/* ==============================
    responsive code
==================================*/

@media screen and (max-width: 575px) {
    .mobile_footer_design .container{
        padding: 0px;
    }
    .mobile_footer_design{
        display: block;
    }
    .mobile_footer_design .main_column{
        max-width: 100%;

    }

    .mobile_footer_design {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: #f8f9fa;
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
        z-index: 100;
        transform: translateY(100%);
        transition: transform 0.4s ease; /* Smooth animation */
    }

    .mobile_footer_design.visible {
        transform: translateY(0); /* Slide into view */
    }

    .mobile_footer_design ul {
        list-style: none;
        display: flex;
        justify-content: space-around;
        padding: 10px;
        margin: 0;
    }
    .mobile_footer_design ul li a {
        color: #333;
        text-decoration: none;
        font-size: 20px;
    }
    .mobile_footer_design ul li a:hover {
        color: #007bff;
    }
    .mobile_footer_design .main_column ul li{
        list-style: none;
        display: inline-block;
        margin-right: 10px;
        background: var(--primary);
        border-radius: 5px;
        padding: 6px 15px;
      }
}