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

    .navbar-light .navbar-toggler{
        color: var(--prmary-col) !important;
        border-color: var(--prmary-col) !important;
    }
    .navbar-toggler:focus{
        box-shadow: unset !important;
    }
    header.sticky .navbar-light .navbar-nav .nav-link{
        color: var(--black) !important;
    }
    .navbar-light .navbar-nav .nav-link{
        color: var(--black);
    }
    header.sticky .numb{
        color: var(--black) !important;
        padding-top: 10px;
      }
      
    /* .head {
        height: 108px;
    } */

    .logo img {
        width: 80px;
        height: auto;
    }

    .ban-sec{
        background-position: center center;
        height: auto;
        padding-bottom: 40px;
    }
    .ban-sec-txt{
        padding-top: 150px;
    }
    .org{
        font-size: 55%;
    }
    .title-head span{
        font-size: 45px;
    }
    .title1{
        font-size: 36px;
    }
    .title1 span{
        font-size: 40px;
    }
    .ban2{
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .ban3 {
        margin-top: -1rem;
    }
    .mid{
        padding-top: 10px;
    }
    .counter{
        font-size: 30px;
    }
    .mid2{
        margin-top: 50px;
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .mid2-grd{
        grid-template-columns: repeat(1, 1fr);
    }
    .mid4{
        margin-top: 50px;
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .about-mid1{
        margin-top: 50px;
    }





    .ban1{
        margin-top: 3rem;
    }
    .img-mg{
        /* height: 500px; */
        object-fit: cover;
    }
    .ban1-grid{
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
        /* display: none; */
    }
    .one{
        background-color: var(--white-col);
        border-left: none;
    }

    h1.title.jhu{
        font-size: 40px;
    }
    .title span{
        font-size: 45px;
    }
    .title{
        line-height: 44px;
        font-size: 45px;
    }
    .para{
        font-size: 80%;
    }
    .ban .owl-carousel .owl-nav button.owl-next{
        top: 95%;
    }
    .ban .owl-carousel .owl-nav button.owl-prev{
        top: 95%;
    }
    .ban3{
        margin-bottom: 50px;
    }
    /* .mid-txt{
        margin-left: 0px;
    }
    .mid-grd{
        grid-template-columns: repeat(1, 1fr);
    }
    .mid1-sec{
        margin-top: 50px;
        padding-bottom: 50px;
    }
    .heading {
        font-size: 50px;
    line-height: 50px;
    }
    .mid1-ul li{
        font-size: 90%;
        line-height: 30px;
        padding-bottom: 20px;
    } */

    /* .mid2-sec{
        width: 100%;
    }
    .ata{
        font-size: 75%;
        text-align: end;
    } */
    .mid3{
        margin-top: 50px;
    }
    .mid4{
        margin-top: 50px;
    }
    /* .mid4 .owl-carousel .owl-nav button.owl-next{
        right: 8px;
    }
    .mid4 .owl-carousel .owl-nav button.owl-prev{
        left: 8px;
    } */
    .mid5{
        margin-top: 50px;
    }
    .mid5-sec{
        padding-top: 30px;
    padding-bottom: 30px;
    }
    .mid5 .owl-carousel .owl-nav button.owl-prev{
        top: 110%;
    }
    .mid5 .owl-carousel .owl-nav button.owl-next{
        top: 110%;
    }

    footer{
        margin-top: 50px;
        padding-top: 30px;
        padding-bottom: 30px;
    }
    /* .foot-head{
        padding-top: 30px;
    } */
    .foot{
        padding-top: 30px;
    }
    ul.icon li a{
        line-height: 37px;
    }
    .foot ul li a{
        font-size: 90%;
    }
    .footer-contact-content a{
        font-size: 85%;
    }
      .counter-container{
          gap: 10px;
      }


    /* contact */

    .mid6{
        padding-top: 50px;
    }
    .map-sec{
        margin-top: 50px;
    }
    .ban-sec-txt.nhbhn {
        padding-top: 200px;
    }

    /* product */

    .product{
        margin-top: 50px;
    }
    .product-grid{
        grid-template-columns: repeat(2, 1fr);
    }
    .product-details h5{
        font-size: 78%;
    }
    .counter p{
        font-size: 14px;
    }

        /* about */

        .ban2{
            margin-top: 60px;
            padding-top: 50px;
        }
        .about-mid1 .nav-link{
            font-size: 16px;
        }
        .about-mid {
            margin-top: -1rem;
        }
        /* .about-mid .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
            padding: 10px 10px;
        }
        .about-mid .nav-link{
            padding: 10px 10px;
        } */

    
}

@media screen and (max-width: 320px) {
    h1.title.jhu{
        font-size: 35px;
    }
    .title span {
        font-size: 40px;
    }
    .title{
        line-height: 40px;
    }
    /* .img-mg{
        height: 500px;
        object-fit: cover;
    } */
    .foot ul li a{
        font-size: 90%;
    }
    .footer-contact-content a{
        font-size: 80%;
    }
    .heading {
        font-size: 45px;
        line-height: 45px;
    }
    .mid1-ul li{
        font-size: 80%;
    }

}

@media screen and (min-device-width: 768px) and (max-device-width: 991.78px) { 

    header.sticky .navbar-light .navbar-nav .nav-link {
        color: var(--black) !important;
    }

    .navbar-light .navbar-toggler{
        color: var(--prmary-col) !important;
        border-color: var(--prmary-col) !important;
    }
    .navbar-toggler:focus{
        box-shadow: unset !important;
    }

    .logo img {
        width: 80px;
        height: auto;
    }
    /* .head {
        height: 107px;
    } */
    .ban-sec-txt{
        padding-top: 110px;
    }
    .ban-sec{
        padding-bottom: 60px;
        height: auto;
    }
    .title-head span{
        font-size: 50px;
    }
    .ban1{
        margin-top: 60px;
    }
    .title{
        font-size: 50px;
    }
    .title span{
        font-size: 50px;
    }
    .mid{
        padding-top: 0px;
    }
    .counter{
        font-size: 30px;
    }
    .title1{
        font-size: 50px;
    }
    .title1 span{
        font-size: 50px;
    }

    .mid5 .owl-carousel .owl-nav button.owl-prev{
        top: 109%;
    }
    .mid5 .owl-carousel .owl-nav button.owl-next{
        top: 109%;
    }
    
    footer{
        margin-top: 50px;
        padding-top: 30px;
        padding-bottom: 30px;
    }
    /* .foot-head{
        padding-top: 30px;
    } */
    .foot{
        padding-top: 30px;
    }
    .footer-contact-content a{
        font-size: 80%;
    }
    .ban .owl-carousel .owl-nav button.owl-prev{
        width: 25px;
        height: 25px;
        line-height: 25px;
        font-size: 13px !important;
    }
    .ban .owl-carousel .owl-nav button.owl-next{
        width: 25px;
        height: 25px;
        line-height: 25px;
        font-size: 13px !important;
    }
    .counter{
        padding: 20px;
    }

        /* contact */

        .mid6{
            padding-top: 60px;
        }
        .map-sec{
            margin-top: 60px;
        }
        .ban-sec-txt.nhbhn {
            padding-top: 200px;
        }

            /* product */

    .product{
        margin-top: 60px;
    }
    .product-grid{
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* about */

    .ban2{
        margin-top: 60px;
        padding-top: 50px;
    }
    .about-mid1 .nav-link{
        font-size: 16px;
    }

}

@media screen and (min-device-width: 992px) and (max-device-width: 1200px) { 
    /* .head {
        height: 113px;
    }
    .logo img {
        width: 90px;
        height: auto;
    }
    .btn-don{
        font-size: 15px;
    }
    .ban-txt{
        top: 6%;
    }
    .ban1{
        margin-top: -2rem;

    }
    .ata{
        text-align: end;
        font-size: 85%;
    }
    img.ic-n-mg{
        width: 45px;
        height: 45px;
    } */
}