@media (min-width:320px) and (max-width:1199px) {

    .navmenu ul {
        position: initial;
        border-radius: 0px !important;
        box-shadow: none;
    }

    .navmenu li {
        flex-direction: column;
        padding: 5px 0px;
        margin: 5px 0px;
    }

    ul.cs-al {
        padding: 0;
    }

    ul.cs-al .dropdown {
        padding: 0px 0px;
        margin: 0px 0px;
    }

    .navmenu .dropdown ul {
        display: block;
        position: static;
        z-index: 99;
        padding: 0px 0;
        margin: 10px 20px;
        background-color: transparent;
        border: transparent;
        box-shadow: none;
        width: calc(100% - 40px);
    }

    .cs-header .navmenu .dropdown ul.submenu li a:hover, .cs-header .navmenu .dropdown ul.submenu li a:focus {
        background: transparent;
    }

    .navmenu .dropdown:hover > a {
        background: transparent;
        color: inherit;
    }


    .navmenu a, .navmenu a:focus {
        width: calc(100% - 30px);
        padding: 0px 20px;
        border: 0px !important;
    }

    .navmenu .dropdown ul.submenu li a::before {
        bottom: -2px;
        width: 13%;
        height: 1px;
    }

    .navmenu li.spl::before {
        display: none;
    }

    .submenu.rgt li {
        margin-bottom: 0px;
        text-align: left;
    }

    .hd-btn-primary, .hd-btn-primary:focus {
        background: #fff;
        color: var(--cs-primary-color) !important;
        padding: 0px 20px !important;
        line-height: 40px;
    }

    .hd-btn-trans {
        padding: 0px 20px !important;
    }

    .mobile-nav-active .mobile-nav-toggle {
        background: #000;
        right: 50px;
        top: 21px;
    }

    .mobile-nav-toggle {
        position: absolute;
        right: -10px;
        top: 15px;
    }
}
@media (min-width:320px) and (max-width:767px) {
    .hero-links.mb-view {
        display: flex;
        flex-wrap: wrap;
    }
    .step-card {
        padding: 1.5rem;
        width: 100%;
    }

    .stat-number {
        font-size: 28px;
    }

    .card-custom {
        width: 100%;
    }

    .popular-header {
        text-align: center;
    }

    .button-container {
        align-items: flex-start;
        margin-bottom: 15px;
    }


    .top-section {
        padding: 34px 0px 34px 0px;
    }

    .banner-text {
        bottom: 10%;
    }

    .banner {
        height: 50vh;
    }

    .story-card {
        width: 100%;
    }

    .event-card {
        width: 100%;
    }

    .banner-text {
        font-size: 35px;
    }

    section.heading_banner, .spl-banner {
        margin: 0px 0px 0px 0px;
        padding: 20px 0px 20px 0px;
    }
    .benefits-row {
        flex-flow: column wrap;
    }
        .benefits-row .benefit-card {
            width: 100%;
        }
        .nav-item {
            padding: 0px 0;
        }

        .cs-tabs .tab-content {
            padding: 25px 0px;
        }

        .cs-ls-bg {
            display: flex;
            justify-content: space-between;
            margin-top: 30px;
            margin-bottom: 30px;
        }

        .cs-ls-vw .ls {
            width: 100%;
        }

        .cs-container {
            width: 90%;
        }

        .cs-tabs .cs-bg {
            margin-top: 20px;
        }

        .cs-container .row {
            width: 100%;
        }

    #SortSection {
        margin-bottom: 20px;
    }

    .ds-usr-btn {
        text-align: left;
        color: #000;
        background: top;
        border-bottom: 1px solid #ccc;
        border-radius: 0px;
        border-top: 1px solid #ccc;
        padding: 4px 17px;
    }
    .navmenu li:has(.active) a.active {
        font-weight: bold;
        background: transparent;
        color: #FF874F;
    }   
    .pl-ds-bg {        
        flex-direction: column;
        gap: 30px;
    }

    .pl-ds-bg .popular-container {
        width: 100%;
    }

    .pl-ds-bg .map-container {
        width: 100%;
    }

    .popular-container .sidebar {
        max-height: 100% !important;
    }

    .lang-pill {
        margin: 0px 15px;
    }

        .cs-card-dts {
            flex-direction: column;
        }

            .cs-card-dts .cs-tab {
                width: 100%;
            }

            .cs-card-dts .cs-card-dts-bg {
                width: 100%;
                margin-bottom: 30px;
            }

            .cs-card-bg {
                margin-bottom: 10px;
            }

            .cs-lv-bg {
                flex-direction: column;
            }

            .cs-lv-bg .ls {
                width: 100%;
            }

            .ds-box-bg {
                flex-direction: column;
                gap: 30px;
            }

            .ds-box-bg .box {
                flex-direction: column;
                width: 100%;
            }

            .ds-box-bg .box.spl {
                width: 100%;
                flex-direction: column;
                gap: 15px;
            }

            .ds-box-bg .box.spl .half-col {
                min-width: 100%;
            }

            .ds-box-bg .box.spl .half-col .cs-btn-green {
                float: left;
            }
            .ds-box-bg .box {
                width:100%;
            }

            .dataTables_wrapper {                
                width: 100%;
                overflow: auto;
                height: 450px;
            }

            .cs-mb-ds-n {
                display: none;
            }
            .cs-Ins-card-bg {
                flex-wrap: wrap;
            }
            .cs-card-title {
                width: 75%;
            }
            .form-row {    
                grid-template-columns: repeat(1, 1fr);
            }
            .upload-button {
                width: 100%;
            }
            .cs-card {
                overflow:auto;
            }

    .footer-links-section {
        text-align: center;
    }
    .footer-menu-title {
        text-align:center;
    }
    .contact-item {
        justify-content: center;    
    }
    .footer-logo {
        justify-content:center;
    }
    .footer-description {
        text-align:center;
    }

    .social-icons{
        text-align:center;
    }

    .bottom-section {
        padding: 60px 0px;
    }
    .stats-container {
        flex-direction: column;
        gap: 30px;
    }

        
    }