@media (min-width: 1600px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:1420px!important
    }
}

@media (min-width: 1850px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:1600px!important
    }

    header a.nav-link {
        font-size: var(--f18)
    }
}

@media (min-width: 2000px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:1800px!important
    }
}

@media (max-width: 1400px) {
  footer .col-md-5 {
    width: 100%;
}
    header a.nav-link {
        margin-right:var(--m20)
    }

    footer .col-md-4.quick {
        width: 22%
    }

    footer .col-md-4.contact {
        width: 28%
    }

    .footer-social ul {
        padding-left: 0;
        margin-left: 0;
        gap: 10px 0;
        display: flex;
        flex-wrap: wrap
    }
}
@media(max-width:1366px){
    header.new-header ul.menu-bar{
        gap: 10px;
    }
    header a.nav-link{
                margin-right: 3px;
    }
    header li.nav-item a.main-btn{
            font-size: 13px;
    }
    header ul.social{
            gap: 7px;
    }
}
@media (max-width: 1024px) and (min-width:981px) {
    .footer-details .col-lg-3{
        width: 33%;
    }
    footer.footer .other-details li a {
        display: flex;
        align-items: center;
    }
    .footer-details .col-lg-5{
        
        width: 100%;
        padding-top: 20px;
    }
    footer .col-12.md-12.sm-12 {
        gap:20px
    }

    footer {
        border-top: 0 solid
    }

    header a.nav-link {
        margin-right: var(--m10)
    }

    header .logo {
        margin-right: var(--m20)
    }

    #exampleModal .modal-dialog {
        width: 600px
    }

    footer .col-md-4.first {
        width: 100%;
        text-align: center;
        margin-bottom: var(--m30)
    }

    .footer-social ul {
        width: 100%;
        justify-content: center
    }

    footer .col-md-4,footer .col-md-4.contact,footer .col-md-4.quick {
        width: 33.33%
    }
    footer .col-md-5 {
    width: 47%;
}
    footer .col-md-3 {
    width: 19.6%;
}
  header.desk-nav .nav-links ul.up{
    gap: 6px;
  }
  
  .footer-about-social-list {
    display: flex;
    align-items: center;
}
  
  header .side-menu .main-btn {
    width: 145px;
}
  
  header .navbar {
    width: 100%;
  }

  header ul.social {
    gap: 10px;
    padding-right: 10px;
}

header.new-header ul.menu-bar {
    gap: 8px;
}



}

@media (max-width: 980px) {
    footer .center h4{
        font-size: var(--f28);
    }
    footer .left h2{
        font-size: var(--f28);

    }

footer .search .fa-solid{
    left: -8px;
    top: 19px;
}
footer .search input{
        font-size: 13px;
        padding-left: 37px;
}
footer .search .btn{
        font-size: 14px;
}
    header li.nav-item a.main-btn {
    background: #fff;
    color: var(--btn-color) !important;
    margin-right:0;
}
    footer ul.social {
    width: 100%;
}

    .about-img2 img {
    right: 20px;
    bottom: -40px;
}

        .about-img1 img {
        width: 70%;
    }

    footer .center {
    padding-left: 12px;
}
  
  footer .newsletter-info {
    width: 380px;
    margin: auto;
}
  
  header #main_nav {
    display: flex !important;
    justify-content: center !important;
}
  header .navbar {
    top: 0;
    left: 0;
}
    .navbar-nav li {
    opacity: 1;
    margin-bottom: 0;
}
  
  header.page-header.mob {
    display: block;
}
  .desk-nav{
    display: none;
  }
    
      header.mob {
        display: block !important;
        z-index: 9;
        padding: 10px 0;
        position: relative;
        width: 100%;
        background: var(--secondary-color);
    }
  
    header.header .contact {
        display: none;
    }
    header a.nav-link,i#close-menu1 {
        color: var(--white-color);
    }

    header a.nav-link:focus,header a.nav-link:hover {
        color: var(--secondary-color)
    }

    .menu-toggle1 i,i#close-menu1 {
        font-size: var(--f28);
        cursor: pointer
    }

    #exampleModal .modal-dialog {
        width: 600px
    }

    header.desk {
        display: none
    }

    div#tag1,header.mob,nav.navbar.navbar-expand-lg.navbar-dark.bg-primary {
        display: block
    }

    header.mob {
        z-index: 10;
        padding: 10px 0;
        display: none;
    }

    header img {
        width: 140px;
        margin-bottom: 0
    }

    header a.logo {
        width: auto;
        padding: 0;
        margin-right: 0;
        margin-bottom: 0
    }

    header a.nav-link:hover {
        border-color: var(--secondary-color)
    }

    header nav.navbar.navbar-expand-lg.navbar-dark.bg-primary {
        border-bottom: 0 solid
    }

    header div#menu-toggle1 {
        width: auto
    }

    header .navbar-nav .nav-link.active,header .navbar-nav .nav-link.show {
        color: var(--primary-color)!important;
        border-color: var(--heading-color)!important
    }

    header .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: relative;
        left: 0;
        padding: 0;
        border-radius: 0;
        top: 0;
        width: auto;
        border: none
    }

    header .row {
        flex-direction: row;
        justify-content: space-between;
        align-items: center
    }

    div#tag1 {
        position: fixed;
        left: -1px;
        top: 0;
        width: 100%;
        transform: translateX(-47em);
        height: 100%;
        transition: .5s ease-in-out;
        padding: 0
    }

    div#tag1 .mobile-nav {
        padding: 2rem 20px 20px;
        background: var(--secondary-color);
        text-align: center;
        /* width: 350px; */
        height: 100vh;
        position: relative
    }
div#tag1 .mobile-nav li a{
    color:var(--white-color);
}
    div#tag1 .mobile-nav li a.dropdown-item{
        color: #000;
        /* background: var(--secondary-color); */
    }
    div#tag1 .mobile-nav li a.dropdown-item:hover{
    background: var(--secondary-color);
        color: #fff;
    }
    #close-menu {
        right: 1rem;
        position: absolute;
        top: 10px
    }

    header a.nav-link {
        margin-right: 0;
        padding: 0!important;
        font-size: var(--f16);
        margin-bottom: var(--m10);
        margin-top: var(--m10);
        border-left: 0 solid
    }

    div#mob_nav {
        margin-top: var(--m20)
    }

    .menu-toggle1 i {
        color: var(--white-color);
    }

    header li.nav-item.dropdown:hover ul.dropdown-menu {
        width: 100%;
        position: relative
    }

    footer .col-6.md-12.sm-12.right p,footer .copyright p,header li .dropdown-item {
        text-align: center
    }

    section {
        padding: var(--p50) var(--p12)
    }

    footer .row.upper-footer {
        flex-direction: column
    }

    footer .col-6.md-6.sm-12.left {
        width: 100%;
        border-right: 0px solid var(--white-color)
    }

    .copyright .col-md-6,.footer-social li:first-child,footer .col-6.md-6.sm-12.right {
        width: 100%
    }

    footer .row.bottom {
        padding: var(--p30) var(--p48);
        border-top: 1px solid var(--white-color);
        border-bottom: 1px solid var(--white-color)
    }

    footer .copyright .row {
        align-items: center;
        flex-direction: column
    }

    footer .copyright .col-6 {
        flex: 0 0 auto;
        width: 100%
    }

    footer .col-md-4.first {
        width: 100%;
        text-align: center;
        margin-bottom: var(--m30)
    }
    footer .col-md-5 {
        width: 100%;
    }
footer .col-md-3 {
    width: 50%;
}
    footer .col-md-4,footer .col-md-4.contact,footer .col-md-4.quick {
        width: 31%;
    }

    footer p.abt {
        height: auto
    }

    footer .col-md-4.newsletter {
        width: 100%;
        margin-top: 25px
    }

    .banner h1 {
        font-size: var(--f32);
        margin-top: var(--m30)
    }

    .banner,.banner .guides,.banner img.img-fluid {
        height: 300px;
        max-height: 300px
    }

    .footer-social ul {
        float: none;
        justify-content: left;
    }
    footer.footer .other-details {
    padding: 60px 30px 40px 30px;
}
  .mobile-menu-logo {
    margin-bottom: 30px;
}
  header .dropdown-menu li{
    padding: 0 0px;
  }
  footer .quick-links {
    width: 65% !important;
}
  footer .contact-us {
    width: 100% !important;
    margin-top: 30px;
}
  
    footer .logo-sec {
    margin-bottom: 50px;
    padding-bottom: 50px;
}
  
  footer {
    padding-top: 60px;
    padding-bottom: 0;
}

header ul.navbar-nav {
    flex-direction: column;
    gap: 4px;
}

header li.nav-item {
    padding: 0 !important;
}
  
}

@media (max-width: 540px) {

    footer .center h4 {
    font-size: var(--f28);
}

    footer .left h2 {
    font-size: var(--f28);

}

    footer ul.social {
    width: 100%;
    margin-top: 20px;
}

    footer .right{
        width:100%;

    }

       footer .center{
        width:100%;

    }

       footer .left{
        width:100%;

    }

      header .navbar {
        top: 0;
        left: 0;
    }

  .quick {
    display: flex;
    justify-content: left;
}

    .breadcrumb-wrap {
        display: none;
    }
    footer .quick-links{
        width: 100% !important;
        padding-top: 0;
    }
    
    footer .contact-us{
        width: 100% !important;
        margin-top: 20px;
    }

    header.header div#offcanvasNavbarDark {
        width: 65%;
    }

    footer.footer .col-3.info {
        border-right: 0;
    }
    footer.footer .other-details {
        padding: 0px 0px 40px 0px;
    }
    footer.footer .col-3.info {
        padding: 40px 0px 0px 0px;
        width: 100%;
    }
    footer.footer .other-details {
        width: 100%;
    }
    footer.footer .footer-logo img {
        width: 140px;
    }
    .banner h1,.video-cont h1:before {
        display:none
    }

    div#tag1 .mobile-nav {
        /* width: 70%; */
    }

    section {
        padding: var(--p40) var(--p12)
    }

    h1 {
        font-size: var(--f40)
    }

    h2 {
        font-size: var(--f28)
    }

    .head-sec span,footer .social.row a i,h3 {
        font-size: var(--f25)
    }

    .menu-toggle1 i,h4 {
        font-size: var(--f22);
    }

    h5,h6 {
        font-size: var(--f20)
    }

    .go-top.active {
        top: 92%
    }

    .logo img {
        width: 100px;
        margin: auto;
    }

    .banner .guides {
        width: auto;
    }

    header.header {
        position: relative;
    }
    header a.nav-link {
        font-size: var(--f14)
    }

    .owl-carousel .owl-item img {
        object-fit: unset;
        object-position: center
    }

    footer h4 {
        font-size: var(--f21)
    }

    footer .row.top .col-6.md-6.sm-12 {
        padding: 0;
        width: 100%
    }

    footer img.super {
        height: 70px;
        width: 100%;
        object-fit: contain
    }

    footer .col-md-4.contact,footer .col-md-4.quick,footer .imgs img,footer input.form-control {
        width: 100%
    }

    footer .col-12.md-12.sm-12 {
        display: flex;
        padding: 0;
        gap: 10px;
        flex-direction: column
    }

    footer .newsletter {
        gap: 0
    }

    footer form {
        gap: 10px;
        flex-direction: column
    }

    footer .social.row a {
        padding: var(--p30) var(--p30)
    }

    .copyright p {
        margin: auto;
        font-size: 14px!important
    }

    .banner h1 {
        font-size: var(--f28);
        text-align: center;
        padding-left: var(--p12);
        padding-right: var(--p12);
        margin-top: var(--m60)
    }

    .banner,.banner .guides,.banner img.img-fluid {
        height: 150px;
        max-height: 250px
    }

    .breadcrumb {
        padding-left: 0;
        font-size: 13px
    }

    .breadcrumb-wrap .container {
        padding: 0
    }

    #exampleModal .form-label,footer i.flaticon-right-chevron {
        font-size: 14px
    }

    footer .footer-logo img {
        width: 150px;
        margin: auto;
        display: block;
    }

    #exampleModal .modal-dialog {
        width: 90%
    }

    #exampleModal .row {
        padding: 0;
        flex-direction: column-reverse
    }

    #exampleModal .row button.btn-close {
        position: absolute;
        top: 10px;
        right: 10px
    }

    #exampleModal .col-6 {
        flex: 0 0 auto;
        width: 100%
    }

    #exampleModal img {
        width: 100%;
        height: 220px;
        object-fit: cover
    }

    #exampleModal .col-6.cont-left h2 {
        margin-top: 0;
        font-size: 19px
    }

    footer {
        padding: 40px 0 0
    }

    .footer_logo img {
        width: 90px
    }

    footer .col-md-4.first {
        width: 100%;
        text-align: left;
        margin-bottom: var(--m20)
    }

    footer .col-md-4 {
        width: 100%;
        margin-bottom: 20px
    }

    .footer_links h4 {
        font-size: 20px
    }
}

@media (max-width: 360px) {
    h1 {
        font-size:var(--f36)
    }

    h2 {
        font-size: var(--f25)
    }

    footer .social.row a i,h3 {
        font-size: var(--f22)
    }

    h4 {
        font-size: var(--f19)
    }

    h5,h6 {
        font-size: var(--f17)
    }

    .head-sec p {
        font-size: 14px;
        line-height: 1.3
    }

    footer h4 {
        font-size: var(--f18)
    }
}