/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) {
    .footer .brand{
        width: 200px;
    }
    .grid-card.listview .card{
        align-items: start;
    }
    .grid-card.listview .card .card-img-top{
        width: 100px;
    }
    .grid-card.listview .card-body{
        text-align: left;
    }
    .grid-card.listview .card-body h5{
        font-size: 17px;
    }
}

@media (max-width: 767px) {
    
    .menu-toggle i{
        position: relative;
        top: -4px;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    header{
        position: absolute;
        top: 0;
        left: 0;
    }
    .banner .social-widget{
        left: 8px;
        top: 35%;
        transform: translate(0, -35%);
    }
    .inner-page .banner .right-img{
        height: calc(100vh - 200px);
    }
    .w200{
        min-width: 200px;
    }
}

@media (max-width: 991px) {
    .banner  > .container-xl .hero-title{
        padding-top: 0;
    }
    span.menu-arrow {
        display: block;
        cursor: pointer;
        display: inline-block;
        margin-left: 15px;
        vertical-align: middle;
        content: "";
        border-top: 6px solid transparent;
        border-left: 6px solid;
        border-bottom: 6px solid transparent;
        position: relative;
        top: 0;
        left: 0;
        order: 2;
        color: #fff;
        transition: all 0.3s ease-in-out;
    }
    span.menu-arrow::after{
        position: absolute;
        width: 24px;
        height: 24px;
        content: '';
        top: -12px;
        left: -15px;
    }
    .menu li {
        position: relative;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: start;
        align-items: center;
    }

    .dropstart .dropdown-toggle::before{
        opacity:0;
    }

    .dropdown-toggle {
        order: 2;
    }

    .menu .dropdown-menu{
        width:100%;
        order: 3;
    }

    span.menu-arrow.active {
        transform: rotate(-90deg);
    }
}

/* Before tablet */
@media (max-width: 992px) {
    .font-18{
        font-size: 16px;
    }    
    .lh-32{
        line-height: 28px;
    }
    .menubar{
        padding-bottom: 40px;
    }
    .menu .dropdown-menu{
        position: relative !important;
        transform: none !important;
        margin: 8px;
    }
    .menu .dropdown-toggle::after{
        display: none;
    }
    header{
        background-color: #192758;
    }
    .menubar .brand{
        width: 156px; 
    }
    header .brand{
        width: 160px;
    }
    header .brand path,
    header .brand rect{
        fill: var(--bs-white);
    }
    .banner .hero-text{
        position: absolute;
        left: 0;
        right: 0;
    }
    .banner .hero-text > div {
        background-color: rgba(var(--bs-white-rgb),.8);
    }
    .banner .swiper-slide > div{
        padding: 0;
    }
    .banner .swiper-pagination{
        display: none !important;
    }
    .social-widget{
        display: none !important;
    }
    .wpml-ls-legacy-list-horizontal li:first-child a{
        padding: 0 0 6px 0 !important;
    }
    .mobile-menu-open{
        overflow: hidden;
    }
    .menubar.show {
        max-height: 100vh;
        overflow-y: auto;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    body .banner .social-widget {
        top: 62%;
    }
    .HeroSlider{
        height: calc(100vh - 100px);
        overflow: hidden;
    }
    .banner .right-img{
        height: calc(100vh - 100px);
    }
    .section-heading.right:before{
        right: 0;
        left: auto;
    }
    .banner .social-widget{
        left: 2%;
        top: 50%;
        transform: translate(-2%, -50%);
    }
    .btn-search{
        width: 45px !important;
        min-width: 45px;
        height: 45px;
        border-radius: 45px;
        padding: 0;
        background-color: var(--bs-white);
        color: var(--black-color);
    }
    .menu li{
        position: relative;
    }
    .menu > li:hover > ul{
        /* background-color: var(--accent-color); */
        display: block;
        left: 0;
        position: absolute;
        top: 100%;
    }
    .menu > li > ul li:hover > ul{
        display: block;
        position: absolute;
        left: 100%;
        top: 0;
        min-width: 260px;
    }
    .menu li ul li a.dropdown-toggle::after{
        border-top: .3em solid transparent;
        border-right: 0;
        border-bottom: .3em solid transparent;
        border-left: .3em solid;
        margin-top: 2px;
    }

    .menu li.centerd:hover > ul{
        /* top: -200%; */
    }

    .menubar .dropdown-menu li a{
        /* white-space:nowrap; */
    }
}

@media (max-width: 1199px) {
    .banner > .container-xl .hero-title {
        padding-left: 0 !important;
        margin: 0 !important;
    }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .error-404{
        padding-left: 90px;
        padding-right: 90px;
    }
    .section{
        padding: 80px 0;
    }
    .post-card.larg{
        height: 500px;
    }
    .btn-primary{
        font-size: 20px;
        padding: 10px 20px;
    }
    .section-heading{
        font-size: 40px;
    }
    footer{
        font-size: 20px;
    }
    .banner .swiper-pagination{
        width: auto;
        left: 56% !important;
    }

    
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
    
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .banner > .container-xl .hero-title{
        font-size: 40px;
    }
}