/* media query */
@media screen and (min-width: 1600px) {
    body {
        font-size: 2rem;
        line-height: 4rem;
    }

    .h1 {
        font-size: 8rem;
    }

    .h2 {
        font-size: 7.2rem;
    }

    .h3 {
        font-size: 5rem;
        font-weight: 700;
    }

    .h4 {
        font-size: 4rem;
        font-weight: 500;
    }

    .h5 {
        font-size: 3.2rem;
        font-weight: 400;
    }

    .h6 {
        font-size: 2.8rem;
        font-weight: 400;
    }

    .container {
        max-width: 177rem;
        width: 93%;
    }

    .container-custom {
        max-width: 144.4rem;
        margin: auto;
    }

    .col-custom {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }

    .btn {
        font-size: 1.8rem;
    }


    .footer-middle .social-wrapper a.h6 {
        font-size: 5.4rem;
    }

    .footer-bottom a + a {
        margin-left: 3rem;
        padding-left: 3rem;
    }

    /*swiper*/
    .swiper-offer .swiper-button-next,
    .swiper-offer .swiper-button-prev,
    .swiper-quality-spare .swiper-button-next,
    .swiper-quality-spare .swiper-button-prev,
    .swiper-blogs .swiper-button-next,
    .swiper-blogs .swiper-button-prev {
        font-size: 4.6rem;
    }

    .max-w {
        max-width:90%;
        margin-left:auto;
        margin-right:auto;
    }
}

@media screen and (min-width:1599px) {
    .custom-col {
        flex: 2.4; /* 12/5 = 2.4 */
        max-width: 20%; /* (12/5)*100% = 20% */
    } 
}

 

@media screen and (min-width: 992px) {
    /*gsap animation*/
    .fade-in {
        bottom: -100px;
        opacity: 0;
        position: relative;
        transition: all linear .5s;
    }

        .fade-in.active {
            bottom: 0;
            opacity: 1;
        }  
    

    .footer-middle .card {
        margin: auto;
        width: calc(100% - 1rem);
    }


    .desk-store-card {
        position: relative;
        background-color: #fff6ef;
        padding: 2.5rem;
        width: 100%;
        transition: .3s linear;
    } 
    .desk-store-card:hover {
        padding: 0;
    } 
    .desk-store-card:hover:before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 100%;
        background: #1f6784e0;
        transition: .3s linear;
    } 
    .desk-store-card:hover h3 {
        display: none;
    }  
    .desk-store-card .caption {
        position: relative;
        display: none;
    } 
    .desk-store-card:hover .caption {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        padding: 50px 40px;
        color: #fff;
        display: block;
    } 
    .desk-store-card:hover .caption h3 {
        display: block;
    }

            


}

@media screen and (max-width: 1599px) {
    :root {
        --logo-width: calc(13.8rem - 2rem);
    }

    body {
        font-size: 1.6rem;
        line-height: 3.2rem;
    }

    .h1, .h2, .h3, .h5, .h6 {
        margin-bottom: 2rem;
    }

    .h1 {
        font-size: 5rem;
    }

    .h2 {
        font-size: 4.8rem;
    }

    .h3 {
        font-size: 3.6rem;
        font-weight: 700;
    }

    .h4 {
        font-size: 2.4rem;
        font-weight: 500;
    }

    .h5 {
        font-size: 2rem;
        font-weight: 400;
    }

    .h6 {
        font-size: 1.8rem;
        font-weight: 400;
    }

    .fs-20 {
        font-size: 1.6rem;
    }


    .btn {
        font-size: 1.6rem;
    }

    .btn-outline {
        padding: .5rem .8rem .5rem 2rem;
    }

        .btn-outline span, .btn-link span {
            margin-left: 2rem;
        }

    .bg-arrow {
        height: 3rem;
        width: 3rem;
    }

   




    /*banner*/
    .swiper-banner .swiper-slide .card-caption2 {
        font-size: 2rem;
        max-width: 26rem;
        min-height: 14.3rem;
        padding: 2rem;
    }

    .swiper-banner .swiper-button-next, .swiper-banner .swiper-button-prev {
        bottom: 14.3rem;
        height: 6.5rem;
        right: calc(31rem - 12rem);
        width: 7rem;
    }

    .swiper-banner .swiper-button-next {
        right: calc(31rem - 19rem);
    }

    /*section*/
    .icon-marine-grey-logo:before {
        font-size: 370rem;
        padding-top: 11rem;
        transform: translateX(53.6%);
        width: 60.2rem;
    }

    .side-bar-icon:before {
        font-size: 60rem;
        padding: 2rem;
        width: 21%;
        transform: unset;
    }

    /*section one*/
    .section-one .left {
        width: calc(100% - 40%);
    }

    /*section two*/
    .section-two.block {
        padding: 7.5rem 0;
    }

    .section-two .section-top p {
        max-width: 48.6rem;
    }

    .swiper-offer .swiper-button-next,
    .swiper-offer .swiper-button-prev,
    .swiper-quality-spare .swiper-button-next,
    .swiper-quality-spare .swiper-button-prev,
    .swiper-blogs .swiper-button-next, .swiper-blogs .swiper-button-prev {
        font-size: 2.6rem;
    }

    /*section three*/
    .section-three.block {
        padding: 11.7rem 0;
    }

    .section-three .border-left {
        max-width: 46rem;
    }

    .section-three .h2,
    .section-three p {
        margin-bottom: 2rem;
    }

    .counter-wrapper .text-count {
        font-size: 8rem;
    }

    /*section four*/
    .section-four.block {
        padding: 5rem 0;
    }

    .map-wrapper .icon-ind-map, .map-wrapper .icon-Singapore {
        font-size: 56rem;
    }

    /*section five*/
    .section-five .tab .bg-arrow {
        height: 4rem;
        width: 4rem;
    }

    .tab {
        padding: 1.3rem 6.5rem 1.3rem 1.5rem;
    }

    .tab-content {
        padding: 2rem;
    }

    .ul-list.port li {
        margin-bottom: 2rem;
    }

    .swiper-blogs .patch:before {
        height: 3rem;
    }

    /*service*/
    .electronic-product-points li span {
        font-size: 2.5rem;
    }
    .accordion-2 table tr td, .accordion-2 table tr th {
        font-size: 2rem !important;
    }

    .mission-points .mission-card-box .img-fluid {
        width: 75%;
    }

    .mission-points .mission-card-box {
        left: -32.5rem;   
    }


    .fire-fight-points {
        border-radius: 3.5rem;
        padding: 5.5rem;
    }



    /*Career Page*/
    input[type="checkbox"]:checked + label:after {
        top: 1.5rem;
    }

   /*Leadership page*/
    .profile-description .profile-description-top a {
        font-size: 3.5rem;
        right:-8rem;
    }

  /*blog-page*/
    .blog-post-right .why-choose-2 {
        padding: 4rem;
    }

    .select-dropdown .icon-sort-icon {
      
        top: 1.6rem;
       
    }


    /*footer*/
    .footer-middle {
        margin-top: 4rem;
        padding: 2rem;
    }

        .footer-middle .card {
            padding: 3rem 1rem;
        }

        .footer-middle .social-wrapper a.h6 {
            font-size: 4rem;
        }

    .footer-bottom {
        margin-top: 4rem;
    }

        .footer-bottom a {
            line-height: 2rem;
        }
}

@media screen and (max-width: 1399px) {
    body {
        line-height: 2.8rem;
    }

    p {
        line-height: 2.2rem;
    }

    .h1 {
        font-size: 4.8rem;
    }

    .h2 {
        font-size: 4rem;
    }

    .h3 {
        font-size: 3.2rem;
    }

    .h4 {
        font-size: 2.2rem;
    }

    .btn-outline {
        padding: 0.5rem 0.5em .5rem 1.5rem;
    }

    /*header*/
    .navbar {
        padding: 1rem 0;
    }

    /*section banner*/
    .swiper-banner .swiper-pagination-bullet {
        height: .5rem;
        width: 4rem;
    }

    .swiper-banner .swiper-slide .card-caption2 {
        min-height: 11.9rem;
        padding: 1.5rem;
    }

    .swiper-banner .swiper-button-next, .swiper-banner .swiper-button-prev {
        bottom: 11.9rem;
        height: 5.5rem;
        right: calc(32rem - 12rem);
        width: 6rem;
    }

    .swiper-banner .swiper-button-next {
        right: calc(33rem - 19rem);
    }

    .desk-store-card .comprehensive-section-points li { margin:0; }



    /*section*/
    .icon-marine-grey-logo:before {
        font-size: 320rem;
        padding-top: 10rem;
        transform: translateX(58.6%);
        width: 53rem;
    }
    .side-bar-icon:before {
        font-size: 60rem;
        padding-top:2rem;
        width: 21%;
        transform: unset;
    }

    /*section one*/
        .section-one .left {
        width: calc(100% - 43%);
    }

    .swiper-quality-spare .card-caption, .swiper-offer .card-caption {
        padding: 1.5rem;
    }

    /*section three*/
    .section-three.block {
        padding: 8rem 0;
    }

    /*section five*/
    .section-five .tab .bg-arrow {
        height: 3rem;
        width: 3rem;
        right: .5rem;
    }

    .map-wrapper .icon-ind-map, .map-wrapper .icon-Singapore {
        font-size: 50rem;
    }

    .tab {
        border-width: .2rem;
        padding: .6rem 3.5rem .6rem 1rem;
    }

    .ul-list.port li {
        margin-bottom: 1.5rem;
    }

    /*section six*/
    .swiper-blogs .patch:before {
        height: 2rem;
    }

    .swiper-blogs .card-caption-inner {
        padding: 1rem 1rem 0;
    }

    /*service*/
    .fire-fight-points {
        border-radius: 3rem;
        padding: 5rem;
    }
    .mission-points .mission-card-box {
        left: -28.5rem;
    }
        .mission-points .mission-card-box .img-fluid {
            width: 70%;
        }


    /*Supplies*/
    .swiper-store .icon-slider-icon {
        height: 5.8rem;
        width: 5.8rem;
    }

    .swiper-store .swiper-pagination {
        bottom: 2.6rem;
    }

    .pb-15 {
        padding-bottom: 12rem;
    }

    /*footer*/
    footer {
        padding: 5rem 0 3rem;
    }

    .footer-middle .social-wrapper a.h6 {
        font-size: 3.4rem;
    }

    /*About-us*/
    .vision-box .vision-mission-media img, .mission-box .vision-mission-media img {
        width: 100%;
        border-top-right-radius: 6rem;
        border-bottom-left-radius: 6rem;
    }

    .vision-mission-media .media-text {
        color: #ffffff;
        padding: 3rem 2rem 0 2rem;
    }

        .vision-mission-media .media-text span {
            font-size: 10rem;
        }

    .why-choose-3, .why-choose-2, .why-choose-1 {
        padding: 2rem;
    }
}

@media screen and (max-width: 1199px) {
    :root {
        --logo-width: calc(15.5rem - 2rem);
    }
    .padding-right-0 {
        padding-right:0;
    }    
    .padding-left-0 {
        padding-left:0;
    }
    .mt-8 {
        margin-top: 6rem;
    }

    /*section banner*/
    .swiper-banner .card-media .img-fluid {
        height: 60vh;
    }

    /*section*/
    .icon-marine-grey-logo:before {
        font-size: 297rem;
        padding-top: 10rem;
        transform: translateX(45%);
        width: 53rem;
    }

    .side-bar-icon:before {
        font-size: 60rem;
        padding-top: 2rem;
        width: 21%;
        transform: unset;
    }

    /*section two*/
    .section-two.block {
        padding: 5rem 0;
    }

    /*section three*/
    .section-three .border-left {
        border-left-width: .3rem !important;
        max-width: 40rem;
        padding-left: 2rem;
    }

    .counter-wrapper .text-count {
        font-size: 7rem;
    }

    /*section five*/
    .map-wrapper .icon-ind-map, .map-wrapper .icon-Singapore {
        font-size: 40rem;
    }

    /*section six*/
    .section-six {
        padding: 10rem 0 5rem;
    }

   /*service*/
    .fire-fight-points {
        border-radius: 2.6rem;
        padding: 4.2rem;
    }

    .mission-points .mission-card-box .img-fluid {
        width: 65%;
    }

    .mission-points .mission-card-box {
        left: -25rem;
    }

   /*supplies page*/
    .swiper-store .icon-slider-icon {
        height: 5rem;
        width: 5rem;
    }

    .swiper-store .swiper-pagination {
        bottom: 2.2rem;
    }

    .pb-15 {
        padding-bottom: 10rem;
    }


    /*career-page*/
    .form-control {
        font-size: 1.6rem;
    }

    /*About-us*/
    .vision-box .vision-mission-media img, .mission-box .vision-mission-media img {
        width: 100%;
        border-top-right-radius: 6rem;
        border-bottom-left-radius: 5rem;
    }

    .vision-mission-media .media-text p {
        line-height: 2.4rem;
    }

    .vision-mission-media .media-text {
        padding: 3rem 1rem 0 1rem;
    }

        .vision-mission-media .media-text span {
            font-size: 8rem;
        }

    .vision-box, .mission-box {
        width: 100%;
    }

    .why-choose-3 {
        height: 40rem;
    }

   /*Leadership page*/
    .profile-description .profile-description-top a {
        font-size: 3.2rem;
        right: -5rem;
        top: -1rem;
    }


    /*blog-page*/
    .blog-post-right .why-choose-2 {
        padding: 3.2rem;
    }

  /*approval-page*/
    .approvals-bwms .form_outer .inner_form_div {
        max-width: calc(100% - 35%);
    }
    

    /*footer*/
    .footer-middle .h6 {
        margin-bottom: 1rem;
    }
}

@media screen and (max-width: 991px) {
    .mt-8 {
        margin-top: 4rem;
    }

    .padding-right-0 {
        padding-right: 0;
    }

    .padding-left-0 {
        padding-left: 0;
    }
    .padding-right-small-4 {
        padding-right:1.5rem;
    }
    .padding-left-small-4 {
        padding-left:1.5rem;
    }

    .divider {
        border-left: 0;
    }

    /*section*/
    .icon-marine-grey-logo:before {
        transform: translateX(0%);
        width: 53rem;
        margin-right: 0;
    }

    .side-bar-icon:before {
        font-size: 60rem;
        padding-top: 2rem;
        width: 60%;
        transform: unset;
    }

    .swiper.position-static {
        margin-top: 3rem;
        padding-top: 5rem;
        position: relative !important;
    }

    /*section one*/
    .section-one .left {
        width: calc(100% - 20%);
    }

    .section-one .right {
        width: 50%;
    }

    .swiper-quality-spare .card-caption .h4 {
        width: calc(100% - 6.5rem);
    }

    .swiper-offer .swiper-button-next,
    .swiper-offer .swiper-button-prev,
    .swiper-quality-spare .swiper-button-next,
    .swiper-quality-spare .swiper-button-prev,
    .swiper-blogs .swiper-button-next,
    .swiper-blogs .swiper-button-prev {
        top: 2rem;
    }

    /*section two*/
    .swiper-offer .h4 {
        margin-bottom: 1rem;
    }

    /*section three*/
    .section-three.block {
        padding: 5rem 0 2rem;
    }

    .section-three .border-left {
        margin-bottom: 5rem;
        max-width: 100%;
    }

    /*section six*/
    .section-six {
        padding: 5rem 0;
    }

    /*service-section*/
    .pb-60 {
        padding-bottom: 48rem;
    }

    .overlay-image {
        height: 50.1rem;
        margin-top: -42rem;
    }

    .mission-vision-section {
        background-size: cover;
    }

    .mission-points .mission-card-box {
        position: unset;
    }

    .mission-vision-section .desc {
        max-width: 100%;
        padding: 5rem 0;
    }

    .mission-points .mission-card-box .img-fluid {
        width: 100%;
    }

    .mission-vision-section:before {
        width: 100%;
    }

    .mission-img {
        margin-top: 5rem;
    }

    .mw-85 {
        max-width: 100%;
    }

    .fire-fight-points {
        border-radius: 2rem;
        padding: 3.2rem;
    }

    .fire-fighting-tab li span {
        width: 5.4rem;
        height: 5.4rem;
    }

   /*supplies*/
    .swiper-store .swiper-pagination {
        width: calc(100% - 50%); /* Responsive width with padding on both sides */   
    }

    .swiper-store .icon-slider-icon {
        height: 5.4rem;
        width: 5.4rem;
    }

    /*career page*/
    input[type="checkbox"]:checked + label:after {
        top: 1.4rem;
    }

    /*about-us*/
    .our-values-points .values-icons {
        width: 5.5rem;
        height: 5.5rem;
        font-size: 3.2rem;
        margin-right:2rem;
    }

    /*leadership page*/
    .profile-description .profile-description-top a {
        font-size: 2.8rem;
        right: -1.5rem;
    }

   /*approval page*/
    .approvals-bwms .form_outer .inner_form_div {
        max-width: calc(100% - 7%);
    }



    /*footer*/
    .footer-middle {
        border: 0;
        padding: 0;
    }

    .footer-bottom a + a {
        margin-left: 1rem;
        padding-left: 1rem;
    }

    .values-icons {
        margin-right: 3rem;
        max-width: 66% !important;
    }
    .desk-store-card .caption{ display: block; }
    .desk-store-card .comprehensive-section-points li{ padding-left: 0; }



    .generalShipSupplies .item {
        display: block;
        box-shadow: 0px 8px 20px rgb(0 0 0 / 12%);
    }
    .generalShipSupplies .item .image {
        width: 100%;
    }
    .generalShipSupplies .right-wrapper {
        width: 100%;
        padding: 1px;
    } 
    .generalShipSupplies .right-wrapper:before {
        width: 80%;
    } 
    .generalShipSupplies .right-wrapper .card {
        margin: 40px;
        padding: 30px;
    }

}



@media screen and (max-width: 767px) {

    .block-sm{
        padding-bottom: 2.5rem;
    }


    .padding-right-tab-4 {
        padding-right: 1.5rem;
    }

    .padding-left-tab-4 {
        padding-left: 1.5rem;
    }
    .h1 {
        font-size: 4rem;
    }

    .h2 {
        font-size: 3.8rem;
    }

    /*section*/
    .icon-marine-grey-logo:before {
        display: none;
    }

    .side-bar-icon:before {
        display:block;
    }

    /*section banner*/
    .swiper-banner .swiper-slide .card-caption2 {
        display: none;
    }

    .swiper-banner .swiper-button-next,
    .swiper-banner .swiper-button-prev {
        bottom: 0;
        right: 0;
    }

    .swiper-banner .swiper-button-prev {
        right: 6rem;
    }

    .swiper-banner .swiper-horizontal > .swiper-pagination-bullets,
    .swiper-banner .swiper-pagination-bullets.swiper-pagination-horizontal,
    .swiper-banner .swiper-pagination-custom, .swiper-pagination-fraction {
        display: none;
    }

    /*section one*/
    .col-custom .d-flex {
        flex-wrap: wrap;
    }

    .section-one .left,
    .section-one .right {
        width: 100%;
    }

    .swiper-offer .swiper-button-prev,
    .swiper-quality-spare .swiper-button-prev,
    .swiper-blogs .swiper-button-prev {
        right: 14%;
    }

    /*section two*/
    .swiper-offer .h4 {
        margin: 0;
    }

    .swiper-offer .card-caption p {
        display: none;
    }

    /*section five*/
    .ul-list.port {
        display: inline-flex;
        flex-wrap: wrap;
        padding-left: 2rem;
    }

        .ul-list.port li {
            margin-right: 3rem;
        }

    /*services section*/
    .pb-60 {
        padding-bottom: 25rem;
    }

    .overlay-image {
        height: 38rem;
        margin-top: -25rem;
        border-radius: 4.1rem;
    }

    .mw-85 {
        max-width: 100%;
    }

    .fire-fight-points {
        border-radius: 1.5rem;
        padding: 2.5rem;
    }

    .fire-fighting-tab li span {
        width: 4.9rem;
        height: 4.9rem;
    }

    /*Supply Page*/
    .swiper-store .icon-slider-icon {
        height: 4.5rem;
        width: 4.5rem;
    }

    .swiper-store .swiper-pagination {
        bottom: 2rem;
    }

    .pb-15 {
        padding-bottom: 9rem;
    }



    /*careers page*/
    .form_outer {
        max-width: 100%;
    }

    .career_form:before {
        display: none;
    }
    /*career-page*/
    .form-control {
        font-size: 1.4rem;
    }

    /*About-us*/
    .vision-mission-media .media-text span {
        display: none;
    }

    .our-values-points .values-icons {
        width: 6rem;
        height: 6rem;
        font-size: 3.8rem;
    }

  /*Leadership page*/
    .profile-description-top{
        display:flex;
        justify-content:space-between;
    }

    .profile-description .profile-description-top a {
        position: unset;
    }

   /*our approval*/
    .our-approval-outer{
        padding:2rem;
    }

    /*footer*/
    footer {
        padding-bottom: 0;
    }

    .footer-middle,
    .footer-bottom {
        margin-top: 2rem;
    }

        .footer-middle .social-wrapper a.h6 {
            font-size: 3rem;
        }

    .footer-bottom-two {
        margin-top: 1rem;
    }
    .value-text {
        max-width:66%;
    }
    .tabs .bg-gray img {
        width: 100%;
    }

    

}

@media screen and (max-width: 575px) {
    .h1 {
        font-size: 3.4rem;
    }
    .generalShipSupplies .card p {
        font-size: 2.8rem;
        font-weight: 500 !important;
    }
    /*section banner*/
    .swiper-banner .card-media .img-fluid {
        height: 80vh;
    }

    .swiper-banner .swiper-button-next,
    .swiper-banner .swiper-button-prev {
        height: 4rem;
        width: 4rem;
    }

    .swiper-banner .swiper-button-prev {
        right: 4rem;
    }

    .map-wrapper .icon-ind-map,
    .map-wrapper .icon-Singapore {
        font-size: 30rem;
    }

    /*section two*/
    .swiper-offer .btn-outline {
        padding: 0;
        text-indent: -9999px;
    }

        .swiper-offer .btn-outline span {
            margin-left: 0;
            text-indent: 0;
        }

    /*section three*/
    .section-three .border-left {
        border-left-width: 0 !important;
        padding-left: 0;
    }

    /*section five*/
    .tab {
        width: calc(100% / 2 - .5rem);
    }

        .tab .h4 {
            font-size: 1.8rem;
        }

    .section-five .tab .bg-arrow {
        height: 2.5rem;
        width: 2.5rem;
    }

    .section-five .tab-content {
        padding: 2rem 0;
    }

    .manufacturers-brand li {
        width: 45%;
    }

    /*services section*/
    .overlay-image {
        height: 20rem;
        margin-top: -15rem;
        border-radius: 3rem;
        border: 1.5rem solid white;
    }

    .mw-85 {
        max-width: 100%;
    }

    .brand-logo-2 {
        width: 90% !important;
    }

    .fire-fight-points {
        border-radius: 1rem;
        padding: 1.5rem;
    }

    .fire-fighting-tab li span {
        width: 4rem;
        height: 4rem;
    }
    .text-count sup {
        font-size: 3rem;
    }
    .pb-60 {
        padding-bottom:15rem;
    }
    /*Supply*/
    .swiper-store .swiper-wrapper .swiper-slide-active + .swiper-slide {
        filter: unset;
    }

    /*career page*/
    .career_form {
        padding: 4.5rem 0;
    }

    /*about-us page*/
    .vision-box, .mission-box {
        padding: 2.5rem;
    }

    .vision-mission-media .media-text span {
        font-size: 5rem;
    }


    .vision-box, .mission-box {
        border-top-right-radius: 5rem;
        border-bottom-left-radius: 5rem;
    }

        .vision-box .vision-mission-media img, .mission-box .vision-mission-media img {
            border-top-right-radius: 5rem;
            border-bottom-left-radius: 5rem;
        }

    .our-values-points .values-icons {
        width: 5rem;
        height: 5rem;
        font-size: 3.4rem;
    }
    .value-text {
        max-width: 100%;
    }

    .swiper-store .icon-slider-icon {
        height: 3.8rem;
        width: 3.8rem;     
    }

    .swiper-store .swiper-pagination {
        bottom: 1.6rem;
       
    }

    .pb-15 {
        padding-bottom: 7rem;
    }

    /*Leadership page*/
    .profile-description .profile-description-top a {
       font-size:2.5rem;
    }
    .symbol-img p {
        font-size:1.8rem;
    }
    .tabs table th, .tabs table td {
        font-size: 1.6rem;
        line-height: 2.6rem;
    }
}

@media screen and (min-width: 992px) and (max-width: 1680px) and (orientation: landscape) {
    .swiper-banner .card-media .img-fluid {
        height: 95vh;
    }
}

@media screen and (min-width: 576px) and (max-width: 991px) and (orientation: landscape) {
    .swiper-banner .card-media .img-fluid {
        height: 150vh;
    }
}

@media screen and (min-width: 374px) and (max-width: 1199px) {
    .top-banner {
        height: 60vh;
    }
}