@media (max-width:1800px){

  
    
    .closeFilter{
        position: absolute;
        right: 15px;
        top: 15px;
    }
    .grid-wrapper {
        padding-block: 15px;
        padding-bottom: 0px;
        padding-inline: 15px;
    }
    .flex-wrapper{
        padding-block: 15px;
        padding-inline: 15px;
    }
   
    /* .open-main-sidebar{
        .sidebar{
            display: flex;
        }
    } */
    
     .header.listpage{
        .btn-filterhead{
            display: inline-flex !important;
        }
        .filter-uk-navbar{
            .uk-navbar-nav{
                    justify-content: flex-start;
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 5px;
            }
        }
        .sidebar-right{
            --_sidebar-width: 300px;
            width: 100%;
            visibility: hidden;
            position: fixed;
            opacity: 0;
            right: 0;
            top: 0;
            height: 100dvh;
            padding: 20px;
            left: auto;
            right:0;
            transform: translateX(110%);
            -webkit-transform: translateX(110%);
            -moz-transform: translateX(110%);
            -ms-transform: translateX(110%);
            -o-transform: translateX(110%);
            border-radius: 0;
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
            -ms-border-radius: 0;
            -o-border-radius: 0;
            background: white;
            max-width:var(--_sidebar-width);
            &.show{
                display: flex;
                visibility: visible;
                opacity: 1;
                transform: translateX(0);
                -webkit-transform: translateX(0);
                -moz-transform: translateX(0);
                -ms-transform: translateX(0);
                -o-transform: translateX(0);
            }
            .close-floating{
                display: flex;
                font-size:30px;
                width:30px;
                height:30px;
                border-radius:30px;
                align-items: center;
                justify-content: center;
                border:none;
                box-shadow: none;
                position: absolute;
                right: 15px;
                top: 15px;
                -webkit-border-radius:30px;
                -moz-border-radius:30px;
                -ms-border-radius:30px;
                -o-border-radius:30px;
            }
        }

    }
    .sidebar-right{
        z-index:3;
        transition: all 0.35s ease-in-out;
        -webkit-transition: all 0.35s ease-in-out;
        -moz-transition: all 0.35s ease-in-out;
        -ms-transition: all 0.35s ease-in-out;
        -o-transition: all 0.35s ease-in-out;
       
    }
    .header.shortheader{
        .mainmenu{
            height: 64px;
        }
    }
    .header{
        .mainmenu{
            padding: 7px;
        }
    }
    
    .floating-sidebar{
        --_sidebar-width: 300px;
        visibility: hidden;
        position: fixed;
        
        opacity: 0;
        left: 0;
        top: 0;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
        background: white;
        max-width:var(--_sidebar-width);
        z-index:3;
        transform: translateX(-110%);
        -webkit-transform: translateX(-110%);
        -moz-transform: translateX(-110%);
        -ms-transform: translateX(-110%);
        -o-transform: translateX(-110%);
        transition: all 0.35s ease-in-out;
        -webkit-transition: all 0.35s ease-in-out;
        -moz-transition: all 0.35s ease-in-out;
        -ms-transition: all 0.35s ease-in-out;
        -o-transition: all 0.35s ease-in-out;
    }
    .floating-sidebar .close-floating{
        display: flex;
        font-size:30px;
        width:30px;
        height:30px;
        border-radius:30px;
        align-items: center;
        justify-content: center;
        border:none;
        box-shadow: none;
        position: absolute;
        left: 15px;
        top: 15px;
        -webkit-border-radius:30px;
        -moz-border-radius:30px;
        -ms-border-radius:30px;
        -o-border-radius:30px;
    }
    .floating-sidebar.right .close-floating{
        right: 15px ;
        left: auto !important;
    }
    .floating-sidebar.right{
        height: 100dvh;
        padding: 20px;
        left: auto;
        right:0;
        transform: translateX(110%);
        -webkit-transform: translateX(110%);
        -moz-transform: translateX(110%);
        -ms-transform: translateX(110%);
        -o-transform: translateX(110%);
    }
    .floating-sidebar.show{
        display: flex;
        visibility: visible;
        opacity: 1;
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
    }
   
    .toggleSidebar{
        font-size: 30px !important;
    }
    /* .grid-wrapper{
        display: grid;
        grid-template-areas: "logo-wrapper main" "logo-wrapper  main";
    } */
    .overview-page{
        .grid-wrapper{
            grid-template-areas: "logo-wrapper logo-wrapper" "main main";
        }
    }

    .main-wrapper{
        display: flex;
        flex-direction: column;
        gap: var(--grid-gap);
    }
    .hero-section {
        grid-template-columns: 1fr;
    }
    .logo-wrapper {
        width: 200px;
    }
    .header.listpage{
        background: none;
        box-shadow: none;
        min-height: 63px;
        .mainmenu {
            justify-content: flex-end;
            background: none;
            box-shadow: none;
            gap: 20px;
            display: flex;
            height: 57px;
            .navbar-search {
                width: 40px;
                height: 40px;
            }
            .uk-navbar-nav{
                .navlink{
                    justify-content: flex-start;
                    font-size: 14px;
                }
            }
        }
    }
   
    .sidebar {
        & .uk-nav {
            a {
                font-size: 14px;
            }
        }
    }
    .uk-navbar-dropdown.filterDropdown{
        max-width: 100%;
        top: 0 !important;
        left: 10px;
        position: relative;
        box-shadow: none;
        border: none;
        &::before{
            display: none;
        }
    }

    .singleSearchBar{
       margin: 0;
       position: relative;
        .searchbox-head{
            position: absolute;
            top: -0;
            right: 0;
        }
        .btns-nav{
            position: absolute;
            top: -85px;
            right: 0;
        }
    }

    .custom-tab--nav{
        overflow-x:auto ;
        scroll-behavior: smooth;
        scroll-snap-type: x mandatory;
        
        >*{
            scroll-snap-align: start;
        }
        &::-webkit-scrollbar{
            display: none;
        }
    }
    .table-pagisition-wrapper{
        display: grid;
    }

   
}
@media (max-width: 650px) {
    .singleSearchBar{
        position: relative;
         .searchbox-head{
            max-width: 50px;
         }
         .btns-nav {
            --size: 40px;
            .btn{
                padding: 0.5rem;
            }
        }
     }
     .paginationWrapper{
        flex-direction: column;
     }
}
@media (max-width: 991px) {
    .img-box-270 {
        width: 100%;
        height: 270px;
        max-width: 270px;
    }
    .mainmenu {
        .uk-navbar-nav {
            gap: 15px;
        }
    }
    
}

@media (min-width: 1800px) {
    .mainmenu {
        .uk-navbar-nav {
            gap: 54px;
        }
    }
    /* body{
        min-width:1900px;
    } */
  
    .filter-uk-navbar{
        display: grid;
    }
    .sidebar{
        display: flex;
    }
    .toggleSidebar{
        display: none !important;
    }
    .closeSidebar{
        display: none !important;
    }
    
    /* .main-wrapper{
        display: grid !important;
        gap: var(--grid-gap);
        /* grid-template-columns: var(--sidepanel-width) auto; 
    } */
    .main-wrapper {
        display: flex;
        gap: var(--grid-gap);
        flex-direction: column;
    }
    .btn-signUp{
        min-width: 240px;
        min-height: 60px;
        font-size: 24px !important;
    }
}

@media (max-width: 768px) {
    /* .grid-wrapper{
        grid-template-columns: 176px 1fr;
    } */
    
    .chartDiv {
        canvas {
            width: 300px;
        }
    }
    .chartWrapper {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    .chartLabel-list{
        display: flex;
        flex-wrap: wrap;
        gap: 30px;
    }

}
@media (max-width:639px) {
    .grid-wrapper {
        display: grid;
        grid-template-areas:
        "logo-wrapper logo-wrapper"
        "main main";
        row-gap: 5px;
    }
    
    .header {
        background: none;
        box-shadow: none;
        position: absolute;
        top: -75px;
        right: 0;
        .mainmenu{
            grid-template-columns: auto 40px;
            padding: 0px;
        }
    }
    .floating-sidebar{
        height: 100vh;
    }
    .inner-header{
        position: absolute;
        top: -65px;
        right: 0;
        min-height: 50px;
        align-items: start;
        .searchbox-head{
            max-width: 50px;
        }
        .btn,.input-group-addon{
            height: 40px;
            width: 40px;
            padding: 5px;
            display: inline-flex;
            align-items: center;
            .icon{
                height: 40px;
                width: 40px;
            }
        }
    }
    .header.shortheader{
        .mainmenu{
            background: none;
            box-shadow: none;
            gap: 10px;
            .navbar-search {
                width: 38px;
                height: 38px;
                display: flex;
                align-items: center;
                justify-content: center;
                line-height: 0;
            }
        }
        .btn-filterhead{
            display: inline-flex !important;
        }
        .filter-uk-navbar{
            .uk-navbar-nav{
                    justify-content: flex-start;
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 5px;
            }
        }
        .sidebar-right{
            --_sidebar-width: 300px;
            width: 100%;
            visibility: hidden;
            position: fixed;
            opacity: 0;
            right: 0;
            top: 0;
            height: 100dvh;
            padding: 20px;
            left: auto;
            right:0;
            transform: translateX(110%);
            -webkit-transform: translateX(110%);
            -moz-transform: translateX(110%);
            -ms-transform: translateX(110%);
            -o-transform: translateX(110%);
            border-radius: 0;
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
            -ms-border-radius: 0;
            -o-border-radius: 0;
            background: white;
            max-width:var(--_sidebar-width);
            &.show{
                display: flex;
                visibility: visible;
                opacity: 1;
                transform: translateX(0);
                -webkit-transform: translateX(0);
                -moz-transform: translateX(0);
                -ms-transform: translateX(0);
                -o-transform: translateX(0);
            }
            .close-floating{
                display: flex;
                font-size:30px;
                width:30px;
                height:30px;
                border-radius:30px;
                align-items: center;
                justify-content: center;
                border:none;
                box-shadow: none;
                position: absolute;
                right: 15px;
                top: 15px;
                -webkit-border-radius:30px;
                -moz-border-radius:30px;
                -ms-border-radius:30px;
                -o-border-radius:30px;
            }
        }

    }
  
}
@media  (min-width:640px){
    .wrapper{
        min-height: calc(100vh - 110px);
        margin: auto;
    }
    .main {
        min-height: var(--main-height);
        width: 100%;
        flex-grow: 1;
        
    }
    .sidebar{
        max-height: calc(100vh - 149px);
    }
}
@media  (min-width:640px) and (max-width:1800px) {
    .toggleSidebar{
        display: none !important;
    }
    .header {
        background: none;
        box-shadow: none;
        position: relative;
        top: 0px;
        right: 0;
    }
    .floating-sidebar.left .close-floating{
        display: none;
    }
    .floating-sidebar.left{
        position: relative;
        opacity: 1;
        visibility: visible;
        transform: 0;
        -webkit-transform: translateX(0%);
    }
   .sidebar{
        border-radius: var(--radius) !important;
   }
   .singleSearchBar{
    position: relative;
     .searchbox-head{
        max-width: 50px;
     }
     .btns-nav {
        --size: 40px;
        .btn{
            padding: 0.5rem;
        }
    }
    }
    .grid-wrapper{
    grid-template-columns: var(--sidepanel-width) auto;
        
    }
}
@media (min-width: 1800px) {
    .main {
        flex-grow: 1;
        max-width: calc(100% - calc(var(--sidepanel-width) + 20px));
    }
}
@media (max-width: 1660px) {
    .ginfo-grid-2col{
        column-gap: 40px !important;
    }
}