@media screen and (min-width: 992px) {

    
.navbar-nav .nav-link::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0px;
    width: 0%;
    height: 2px;
    background-color: var(--primary-color);
    z-index: 9;
    opacity: 0;
    transition: all 0.1s;
}

.navbar-nav .nav-item:hover .nav-link::before {
    opacity: 1;
    width: 100%;
}

.navbar-nav .nav-item:hover .nav-link {
    color: var(--primary-color);
}

    .header .dropdown:hover .dropdown-menu,
    .dropdown-item:active {
        display: block;
        opacity: 1;
        top: 100%;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
}

@media screen and (max-width: 768px) {
    .home-slider .arrow-right {
        right: 81%;
    }

    .feature-heading h3 {
        font-size: 35px;
    }

    .feature-section .feture-inner {
        padding: 1.1875rem 0.875rem;
    }

    .project-heading h3 {
        font-size: 35px;
    }

    .projects .arrow-left {
        left: 42%;
    }

    .projects .arrow-right {
        right: 42%;
    }

    .projects .inner img {
        height: 185px;
    }

    .about-section .about-text h1 {
        font-size: 24px;
    }

    .mission-vision .mission-vision-text h3 {
        font-size: 24px;
    }

    .mission-vision .mission-vision-text span {
        font-size: 16px;
    }

    .counter-section .title-heading1 h3 {
        font-size: 36px;
    }

    .counter-sec .theme-btn a {
        font-size: 13px;
    }

    .counter-section .inner-counter h2 {
        font-size: 2.5rem;
    }

    .counter-section .inner-counter p {
        font-size: 12px;
    }

    .after-about-heading h3 {
        font-size: 35px;
    }

    .navbar .theme-btn {
        display: none;
    }
    .header {
        padding: 0px 15px;
    }
    .inner-banner .banner-content h3 {
        font-size: 34px;
    }
    .info-section .contact-sec .text {
        font-size: 12px;
    }
    .contact-sec h3, .contact-form-wrapper h3 {
        font-size: 23px;
    }
    .quality .quality-heading h1 {
        font-size: 36px;
    }
    .quality .quality-content {
        padding: 0;
    }

    .service-heading h1 {
        font-size: 26px;
    }

    .service-content {
        margin-top: 20px;
    }
}

@media screen and (max-width: 767px) {
    
    .collapse .navbar-nav .nav-item {
    padding: 10px 0px;
}
  .about-text img.img-fluid {
    width: 108px;
    position: absolute;
    bottom: -46px;
    right: 0px;
    rotate: -49deg;
}
    .top-head {
    padding: 8px 0px;
        display: none;
}
    ul.tphd {
                gap: 51px;
        padding-left: 0px;
    }
    ul.tphd li {
    font-size: 13px;
}
    
    section.feature p {
    padding: 0px 0px;
}
    section.feature ul {
        display: grid;
        gap: 7px;
        padding: 17px 0px 16px;
        height: 263px;
        grid-template-columns: 50% 50%;
    }
   section.feature ul li {
        display: grid;
        font-size: 11px;
        width: 50%;
        line-height: 15px;
    }
    .product {
    padding: 50px 0px 20px;
}
    .stripsection {
    padding: 23px;
}
    .stripsection .about-text h1 {
   font-size: 28px;
}
    
    .footer .footer-links ul {
    margin-top: 15px;
    display: grid;
    grid-template-columns: 50% 50%;
}
    
    .why-us {
    padding: 21px;
}
    .why-us .title-heading1 h3 {
    font-size: 20px;
}
    .mission-vision {
    padding: 50px;
    margin: 29px 25px 75px;
}
    
    .mission-vision-img {
    margin-bottom: 34px;
}
    .mission-vision .mission-vision-text span {
        font-size: 23px;
    }
    .mission-vision-text p {
    font-family: "Marmelad", sans-serif;
    font-size: 15px;
}
}



@media screen and (max-width: 600px) {
    .header {
        padding: 5px;
    }

    .navbar-brand img {
        width: 106px !important;
    }.navbar-toggler {
        background: var(--primary-color);
    }

    .home-slider .arrow-left,
    .home-slider .arrow-right {
        width: 25px;
        height: 25px;
        top: 85%;
    }

    .home-slider .arrow-right {
        right: 78%;
    }

    .about-section,
    .feature-section,
    .mission-vision,
    .projects,
    .counter-sec,
    .blog,
    .footer-before,
    .footer {
        padding: 20px 10px;
    }

    .about-section .about-img img,
    .mission-vision .mission-vision-img img {
        height: 250px;
    }

    .about-section .about-text h1,
    .feature-heading h3,
    .mission-vision .mission-vision-text h3,
    .project-heading h3,
    .counter-section .title-heading1 h3 {
        font-size: 20px;
    }

    .title-heading1 h4 {
        font-size: 25px;
    }

    .title-heading1 h4::before {
        display: none;
    }

    .title-heading1 h4::after {
        display: none;
    }

    .blog .blog-inner {
        margin-top: 0px;
    }

    .about-text {
        margin-top: 10px;
    }

    .projects .inner h3 {
        opacity: 1;
        font-size: 17px;
        height: 33px;
        background-color: var(--primary-color);
    }

    .counter-section {
        padding: 27px 10px;
    }

    .projects {
        margin-bottom: 50px;
    }

    .projects .arrow-right {
        right: 30%;
    }

    .projects .arrow-left {
        left: 30%;
    }

    .projects .inner img {
        height: 240px;
    }

    .sticky-top {
        position: relative;
    }

    .inner-banner {
        padding: 42px 15px 101px 15px !important;
    }
    .inner-banner .banner-content h3 {
        font-size: 27px;
    }

    .certificate .certificate-text h3 {
        font-size: 22px;
    }

    .client .client-text h3 {
        font-size: 28px;
    }

    .services {
        padding: 20px 10px;
    }

    .discover-services {
        padding: 20px 10px;
    }

    .services .service-heading h1 {
        font-size: 16px;
    } 
    .services .year h6 {
        font-size: 25px;
    }
    .services .year p {
        font-size: 13px;
    }

    .sectors, .description-section {
        padding: 20px 10px;
    }

    .sectors .sector-box {
        height: 160px;
    }
    .sectors .sector-box h5 {
        font-size: 12px;
    }
    table {
        display: block;
        overflow: scroll;
    }
}