@media only screen and (max-width:990px){
    .md-full{
        width: 100% !important;
    }
    .md-50{
        width: 49% !important;
    }
    .md-33{
        width: 49% !important;
    }
    .md-text-center{
        text-align: center;
    }
    .md-flex-reverse{
        flex-direction: column-reverse !important;
    }
    .mx-auto{
        margin: 0 auto !important;
    }

    .md-m4{
        margin: 3rem 0;
    }
    .md-mb3{
        margin-bottom: 3rem !important;
        
    }
    .md-pr-0{
        padding-right: 0 !important;
    }


    footer .block p{
        padding-right: 0rem;
       
    }

    footer .block .head{
        margin: 3rem 0;
    }

    footer .block .head a::after{
        left: 50%;
        transform: translateX(-50%);
    }

    /* navbar */
    .contact{
        padding-top:6rem !important;
        padding-bottom:3rem !important;
    }
    .contact .text{
        padding-left: 0rem !important;
    }

    .indus-about .text{
        width: 100%;
        margin-bottom: 3rem;
    }
    .indus-about .image{
        width: 100%;
    }

    

    .products{
    padding: 2rem 0 !important;

    }

    .values.group-company .block{
        width: 30% !important;
        margin: 1rem 0;
    }

    .values.group-company .block::after{
        left: 0% !important;
        transform: translateX(0) !important;

    }

    .values.group-company .block img{
        width: 100px !important;
        height: 100px !important;
    }
    .values.group-company .block h3{
        font-size: 1rem !important;
    }

    .values .block::after{
        bottom: -1rem !important;
        left: 50% !important;
        top: unset !important;
        transform: translateY(0) !important;
        transform: translateX(-50%) !important;
        width: 100%;
        height: 2px;
        
    }
    .values .block:last-child:after{
        background-color: #cac9c93a;
    }
    .values .block.act::after{
        background-color: #006bb3;
    }


}

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

    .header{
        height: 5rem;
        
    }
    .header.active{
        height: 100%;
        background-color: white !important;
        position: fixed;
    }


    .header.active::after{
        position: absolute;
        bottom: 0;
        left: 0;
        content: '';
        width: 100%;
        height: 1px;
        background-color: #006bb3;
    }

    .header.active .logo{
        width: 100% !important;

    }
   
    .header .nav .navbar{
        /* display: none; */
        opacity: 0;
        width: 100%;
        overflow: hidden;
        flex-direction: column;
        align-items: flex-start;
        padding: 2rem 0;
        border-top: 1px solid #006bb3 ;
        margin-top: 1rem;
        transition: all 0.5s ease-in-out;
        text-align: left !important;
    }

    header .navbar li a{
        padding: 0.7rem 0 !important;
        margin-top: 0rem;
        transition: all 0.5s ease-in-out;

    }
    header.active .navbar{
        height: auto;
    }

    .header.active .navbar{
        opacity: 1;

    }


    .company-about.exp .images .text{
        padding: 4rem 2rem;
        line-height: 1.5 !important;
    }
    
    .company-about.exp .images .text p{
        text-align:center !important;
        
    }
    
    .cert p{
        width:100% !important;
    }
    
    .cert .img{
        width:100% !important;
        margin:2rem 0rem !important;
    }
    .cert .img img{
        width:100% !important;
        object-fit: contain;
    }
    
    .company-about.exp .images img{
        width:200px !important;
        margin-top:1rem !important;
    }


    .header .nav .navbar li{
        padding: 1rem 0 !important;
        margin: 0 !important;
        text-align: left !important;
    }

    .header .nav .navbar .btn2{
        margin-top: 1.5rem !important;
        padding: 0 !important;
        height: unset;
        width: unset;
        text-align: left;
    }

    .header .nav .navbar .btn2 a{
        padding: 0.7rem 1rem !important;
        border-radius: 4px;
    }


    .header .nav .logo{
        width: 100%;
    }


    .burger-btn{
        display: block;
        position: absolute;
        right: 5%;
        
    }


    .container1{
        width: 90% !important;
    }
    .subscribe{
        display: none;
    }
    .subscribe.d-none{
        display: block;
        padding: 2rem 0;
    }

    .subscribe.d-none h2{
        margin: 2rem;
    }

    .subscribe.d-none h2 a::after{
        left: 50%;
        transform: translateX(-50%);
    }

    .subscribe.d-none input{
        margin-bottom: 1rem ;
        width: 60%;
    }

    .heading{
        padding: 1rem 0 !important;
        text-align: center;
    }
    .heading p{
        width: 100%;
        text-align: center;
        font-size: 1rem;
    }
    .heading h2 a{
        font-size: 2rem !important;
    }

    .heading h2 a::after{
        bottom: -1.5rem;
        left: 50%;
        transform: translateX(-50%);
    }

    .parallax{
        text-align: center !important;
    }
    .parallax h2 a{
        font-size: 2rem;
    }
    .parallax p{
        font-size: 1rem;
    }
    .parallax h2 a::after{
        left: 50%;
        transform: translateX(-50%);
    }
    .about {
        padding-top: 1rem;
    }

    .about .text{
        text-align: center ;
    }

    .about .text li{
        margin-top: 0.5rem;
    }

    .about h2 a::after{
        left: 50% !important;
        bottom: -1.5rem !important;
        transform: translateX(-50%) !important;
        
    }    

    .info h2{
        font-size: 1.5rem !important;
    }

    .info h2 span{
        font-size: 1.5rem !important;
    }

    .indus-about{
        text-align: center;
    }

    .indus-about h2 a{
        font-size: 2rem !important;
        line-height: 0;
    }
    .indus-about h2 a::after{
        left: 50% !important;
        transform:translateX(-50%) ;
    }

    .indus-about .text p{
        font-size: 1rem !important;
    }


    .indus-about .image::after{
        display: none;
    }

    .indus-about .image::before{
        content: '';
        position: absolute;
        left: 0%;
        bottom: -5%;
        width: 100%;
        height: 2px;
        background-color: #dbdbdb56;
    }

    .products{
        text-align: center !important;
    }

    .products .arrange{
        text-align: left !important;
        margin-top: 2rem ;
    }

    .products .box{
        justify-content: center !important;
    }

    .products .box .block h2{
        background-color: #5696df;
        color: white;
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem ;
        font-weight: 400;
        border-radius: 20px;
        margin: 1rem 0rem;
        margin-right: 0.5rem;
        text-align: center;

    }

    .industry .block{
        height: 300px;
    }

    .industry .block p{
        font-size: 1.3rem;
    }

    .hero h2{
        line-height: 1.5;

        font-size: 3rem;
    }

    .hero button{
        font-size: 0.9rem !important;
        padding: 0.5rem 1.5rem;
    }
    
    .product .block {
       
        box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px !important;
    }


    .product .block img{
        height: 400px;
        width: 100%;
        object-fit:cover;
    
    }


}


@media only screen and (max-width:600px){
    .sm-full{
        width: 100% !important;
    }
    .sm-50{
        width: 50% !important;
    }
    .sm-text-center{
        text-align: center;
    }

    .values.group-company .block{
        width: 90% !important;
    }

    .hero button{
        margin: 1rem auto;
    }
    .hero h2{
        text-align: center;
        font-size: 2.5rem;
        max-width: 100% !important;
    }

    .about .image .layer h2{
        font-size: 6rem !important;
    }

    .about .image .layer p{
        font-size: 1rem !important;
    }
}

@media only screen and (max-width:400px){
    
    .hero button{
        margin: 1rem auto;
        width: unset;
        height: unset;
        
    }

    .hero h2{
        font-size: 2rem;
    }
}