@media (min-width:320px) and (max-width:600px){

    p {
        font-size: 15px;
        line-height: 28px;
    }

    .section-padding {
        padding: 60px 0;
    }

    .mainHeading {
        font-size: 22px;
        line-height: 36px;
        letter-spacing: 0.8px;
        margin-bottom: 10px;
    }

    /* header */

    .desktop-header {
        display: none;
    }

    .mobile-header {
        display: block;
        z-index: 999;
        position: relative;
        border-bottom: 1px solid #efeae7;
        padding: 12px 4px;
        background: #ffffff;
    }

    .mobile-header .logo img {
        width: 120px;
    }

    #mobileMenu {
        overflow: hidden;
    }

    #mobileMenu .offcanvas-body {
        padding: 0;
    }

    #mobileMenu .mobile-menu-head {
        display: flex;
        height: 50px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        justify-content: space-between;
        align-items: center;
        z-index: 501;
        position: sticky;
        top: 0;
        background: #fff;
    }

    #mobileMenu .mobile-menu-head .go-back {
        height: 50px;
        width: 50px;
        border-right: 1px solid rgba(0, 0, 0, 0.1);
        cursor: pointer;
        line-height: 50px;
        text-align: center;
        color: #000000;
        font-size: 15px;
    }

    #mobileMenu .mobile-menu-head .mobile-menu-close {
        height: 50px;
        width: 50px;
        border-left: 1px solid rgba(0, 0, 0, 0.1);
        cursor: pointer;
        line-height: 50px;
        text-align: center;
        color: #000000;
        font-size: 15px;
    }

    #mobileMenu .menu-main>li>a,
    #mobileMenu .menu-main>li>.sub-menu>ul>li>a {
        line-height: 50px;
        height: 50px;
        padding: 0 50px 0 15px;
        display: block;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        color: #0a4f6e;
        font-size: 15px;
        letter-spacing: 0.5px;
        position: relative;
        font-weight: 500;
    }
    
    #mobileMenu .menu-main>li>a i{ 
        position: absolute;
        height: 50px;
        width: 50px;
        top: 0;
        right: 0;
        text-align: center;
        line-height: 50px;
        font-size: 15px;
    }

    #mobileMenu .menu-main>li>.sub-menu {
        background-color: #fff;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        padding-top: 50px;
        z-index: 500;
        transform: translateX(100%);
        transition: transform 0.30s linear;
    }

    #mobileMenu .menu-main>li>.sub-menu.active {
        transform: translateX(0);
    }

    /* hero banner */
    
    .heroBanner .content-area {
        padding: 40px 20px 0;
    }

    .heroBanner .slider-button {
        gap: 60px;
        right: 0;
        left: 0;
        justify-content: center;
    }

    .heroBanner .slider-button div button {
        font-size: 22px;
        gap: 20px;
    }

    .heroBanner .slider-button div button svg {
        margin-top: 2px;
    }

    /* summary */

    .summary {
        padding: 40px 0;
    }

    .summary .content-area p {
        font-size: 16px;
        line-height: 30px;
    }

    /* homepage */

    .about-us .row {
        flex-direction: column-reverse;
    }

    .about-us .content-area h5 {
        margin-bottom: 15px;
        font-size: 15px;
    }

    .about-us .content-area h2 {
        font-size: 22px;
        line-height: 34px;
    }

    .about-us .img-box img {
        height: 360px;
    }

    /* products */

    .products .heading h2 {
        font-size: 24px;
    }

    .products .item .product-box .content-area h4 {
        font-size: 20px;
        margin-bottom: 8px;
    }

    .technique {
        padding: 80px 0;
    }

    .technique .content-area h2 {
        font-size: 30px;
    }

    .technique .content-area p {
        font-size: 16px;
        line-height: 32px;
    }

    .milestone .counter {
        grid-template-columns: 100%;
        gap: 14px;
    }

    .milestone .counter .counter-item .number h4 {
        font-size: 34px;
    }

    .milestone .counter .counter-item .name p {
        font-size: 16px;
        line-height: 26px;
    }

    .client-logo .heading h2 {
        font-size: 22px;
        line-height: 32px;
    }

    /* page breadcrumb */

    .page-breadcrumb .breadcrumb-content {
        padding: 60px 40px;
    }

    .page-breadcrumb .breadcrumb-img img {
        height: 200px;
    }

    .page-breadcrumb .breadcrumb-content h1 {
        font-size: 22px;
        letter-spacing: 1px;
    }

    .our-vision .vision-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px 16px;
    }

    .our-vision .vision-grid .vision-item h3 {
        font-size: 18px;
        margin-bottom: 6px;
    }

    .our-vision .right-area .counter {
        display: block;
    }

    .our-vision .right-area .counter .column h2 {
        font-size: 32px;
    }

    .our-vision .right-area .counter::before,
    .our-vision .right-area .counter::after {
        display: none;
    }

    /* certificate */

    .certificates h2 {
        font-size: 18px;
        margin: 12px 0 0;
    }

    /* product detail */

    .product-detail .row:nth-child(even) {
        flex-direction: column-reverse;
    }

    .product-detail .content-area h2 {
        font-size: 22px;
        line-height: 34px;
    }

    .product-detail .content-area ul li {
        font-size: 16px;
    }

    .product-detail .img-box {
        margin-top: 30px;
    }

    .product-detail .img-box:after {
        bottom: 0;
        right: 0;
    }

    .product-detail .img-box::before {
        top: 0;
        left: 0;
    }

    .product-detail .row:nth-child(even) .img-box:before {
        right: 0;
        top: 0;
    }

    .product-detail .row:nth-child(even) .img-box:after {
        left: 0;
        bottom: 0;
    }

    /* our services */

    .our-service .content-area h3 {
        font-size: 22px;
        margin-bottom: 12px;
    }

    .our-service .img-box:before {
        top: 0;
        left: 0;
    }

    .our-service .img-box:after {
        right: 0;
        bottom: 0;
    }

    .our-service .img-box {
        position: relative;
        margin-top: 26px;
    }

    .our-service:nth-child(odd) .img-box {
        margin: 0 0 26px;
    }

    .our-service:nth-child(odd) .content-area {
        padding: 0;
    }

    /* enquiry */

    .enquiry .title h4 {
        font-size: 20px;
        line-height: 30px;
    }

    .enquiry .consent label {
        font-size: 15px;
    }

    /* testimonial */

    .testimonial-area .testimonial-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .testimonial-area .testimonial-grid .testimonial-box .client-info .client-name {
        font-size: 22px;
    }

    /* career */

    .openings .content-area h2 {
        font-size: 22px;
        margin-bottom: 20px;
        line-height: 30px;
    }

    .openings .content-area ul {
        padding-left: 20px !important;
    }

    .openings .content-area ul li {
        font-size: 16px;
    }

    .openings .img-box {
        margin-top: 26px;
    }

    .openings .img-box:before {
        top: 0;
        left: 0;
    }

    .openings .img-box:after {
        right: 0;
        bottom: 0;
    }

    /* contact us */

    .contact-us .left-area .address-info h3 {
        font-size: 20px;
    }

    .contact-us .left-area .address-info ul li {
        font-size: 15px;
        line-height: 25px;
    }

    .contact-us .enquiry {
        margin-top: 26px;
        padding: 30px 22px;
        border-radius: 14px;
    }

    .enquiry .form-group input {
        border: 2px solid #0000001f;
        height: 40px;
    }

    .google-map iframe {
        height: 300px;
    }

    /* footer */
    
    footer .container-fluid {
        padding: 0 12px;
    }

    footer .footer-menu {
        padding: 60px 0 50px;
    }

    footer .logo-area img {
        margin-bottom: 20px;
    }

    footer .logo-area p {
        margin-bottom: 40px;
        font-size: 16px;
        letter-spacing: 0.4px;
    }

    footer .col-md-3:last-child .footer-widget {
        margin-top: 28px;
    }

    footer .footer-widget h4 {
        margin-bottom: 18px;
    }

    footer .footer-widget ul li a {
        font-size: 15px;
        line-height: 24px;
    }

    footer .footer-widget .info li {
        font-size: 15px;
    }

    /* about us */

    .about-us .col-md-6:last-child {
        padding: 40px 20px;
    }

    /* our vision */

    .our-vision .left-area .top-area {
        padding-bottom: 40px;
    }

    .our-vision .left-area .bottom-area h3 {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .our-vision .left-area .bottom-area p {
        font-size: 17px;
        line-height: 29px;
    }

    .our-vision .right-area {
        padding: 50px 0 0;
    }

    .our-vision .right-area .top-area h2 {
        margin-bottom: 46px;
        font-size: 24px;
        line-height: 36px;
    }

    /* our client */

    .our-client .logo-area {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    /* showcase gallery */

    .showcase-gallery .heading p {
        margin-bottom: 36px;
    }

    .showcase-gallery .gallery-area {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    .showcase-gallery .gallery-area .gallery-img-box img {
        height: 120px;
    }

    /* testimonial */

    .testimonial .mainHeading {
        margin-bottom: 36px;
    }

    .testimonial .google-box {
        min-height: 360px;
    }

    .testimonial .testimonialSlider {
        margin-top: 20px;
    }

    /* faq */

    .faq .row .col-md-6 {
        padding: 50px 20px;
    }

    .faq .accordion .accordion-item .accordion-header .accordion-button {
        line-height: 25px;
        letter-spacing: 0.8px;
    }

    .faq .inquiry-form {
        padding: 20px;
    }

    .faq .inquiry-form .form-fields {
        display: block;
    }

    .faq .inquiry-form .form-group textarea {
        height: 100px;
    }

    /* blogs */

    .blogs .blogSlider .blog-card .content-area {
        min-height: 300px;
    }

    .blogs .blogSlider .blog-card .img-box img {
        height: 220px;
    }

    .blogs .blogSlider .blog-card .content-area .top-area h4 a {
        font-size: 17px;
        line-height: 27px;
    }

}