@media (-webkit-min-device-pixel-ratio: 1.1) { 
    
}

@media (-webkit-min-device-pixel-ratio: 1.4) { 
    
}
@media (-webkit-min-device-pixel-ratio: 1.5) { 

    .image img{ left: -93%;}
    
}
@media (-webkit-min-device-pixel-ratio: 1.75) { 
    .image img {left: -129.5%; }
}

@media only screen and (min-width:1366px) and (max-width:1600px){
    
    header #main-menu{display: block;}
    
}

@media only screen and (min-width:1366px) and (max-width:1440px){
    
}

@media only screen and (min-width:1025px) and (max-width:1366px){
    header #main-menu{display: block;}
     
}


@media only screen and (min-width:1003px) and (max-width:1200px) {
    
    .btn-custom{padding: 9px 12px;}
    header .navbar .navbar-nav li .nav-link{padding: 0.8rem;}

    .engineering .card{padding: 1.5rem;}
    .footer .top{padding: 1.5rem;}

    .banner{height: calc(100svh - 85px); max-height: none;}
    header #main-menu{display: block;}

}

@media only screen and (min-width:768px) and (max-width:1002px) {
    .btn-custom{padding: 9px 12px;}
    header .navbar .navbar-nav li .nav-link{padding: 0.8rem;}
    header #main-menu{display: block;}
    .engineering .card{padding: 1.5rem;}
    .banner{height: calc(100svh - 80px); max-height: none; background-position: 70% 0;}
    .banner .banner-content {width: auto; background-color: rgba(var(--color_white), 0.7); padding: 1rem;}
    .banner .banner-content .banner-text br{display: none;}
    .banner .container{align-items: flex-end !important; justify-content: center;}
    
    .banner-slider{margin-top: 1rem !important;}
    .banner-slider .slider .item .banner-pic .text{font-size: 1.50rem;}

    .infra-group{margin-top: 2rem !important; position: relative;}
    .industry{padding-bottom: var(--padding);}
    .industry-item .industry-content{bottom: 0;}
    .industry-item .industry-content p{display: block;}
    .industry-item:hover .industry-content{min-height: auto;}

    .infra-group .card{height: auto;}
    .infra-group .card .item{padding:1.8rem;}
    .infra-group .card .item .text br{display: none;}
    .infra-group .infra-item h4{font-size: 1.275rem; width: 70%; padding: 20px 30px;}
    
    
    .inner-banner{padding-top: 40% !important;}
    .key-advantage .key-item .icon{ margin: 0 auto;}
    .key-advantage .key-item .text br{display: none;}

    #cust-tab{flex-wrap: nowrap; overflow: hidden; overflow-x: scroll;}
    #cust-tab .nav-item { white-space: nowrap; margin: 0 15px 0 0; display: flex; align-items: center;}
    #cust-tab .nav-item h6{margin: 0 !important;}

    .footer .top{padding-top: 0 !important;}
}

@media only screen and (min-width:320px) and (max-width:767px)
{
     
    header .navbar .navbar-brand{max-width: 160px;}
    header .navbar .navbar-nav li .nav-link{padding: 0.8rem;}
    
    .banner{height: calc(65svh - 72px); max-height: none; background-position: 70% 0;}
    .banner .banner-content .banner-text br{display: none;}
    .banner .container{align-items: flex-end !important; justify-content: center;}
    .banner .banner-content .banner-text{font-size: 1.25rem;}
    header #main-menu{display: block;}
    header .navbar>.container{padding: 0;}
    header .contact-number a .text{display: none;}
    .banner-slider{margin-top: 1rem !important;}
    .banner .banner-content{width: auto; background-color: rgba(var(--color_white),0.7); padding: 1rem;}
    .banner-slider .slider .item .banner-pic .text{font-size: 1.275rem;}
    .infra-group{margin-top: 2rem !important; position: relative;}
    .industry{padding-bottom: var(--padding);}
    .industry-item .industry-content{bottom: 0;}
    .industry-item .industry-content p{display: block;}
    .industry-item:hover .industry-content{min-height: auto;}

    .infra-group .infraslider + h4{font-size: 1.5rem; padding: 15px 20px;}

    
    .infra-group .card{height: auto;}
    .infra-group .card .item{padding:1.8rem;}
    .infra-group .card .item .text{font-size: 1rem;}
    .infra-group .card .item .text br{display: none;}

    .infra-group .infra-item h4{font-size: 1.275rem; width: 70%; padding: 20px 30px;}
    
    .about .about-content p:first-child{font-size: 1.275rem;}

    .inner-banner{padding-top: 40% !important;}
    .key-advantage .key-item .icon{ margin: 0 auto;}
    .key-advantage .key-item .text{font-size: 1rem;}
    .key-advantage .key-item .text br{display: none;}


    #cust-tab{flex-wrap: nowrap; overflow: hidden; overflow-x: scroll;}
    #cust-tab .nav-item { white-space: nowrap; margin: 0 15px 0 0; display: flex; align-items: center;}
    #cust-tab .nav-item h6{margin: 0 !important;}

    .footer .top{padding-top: 0 !important;}

}

@media only screen and (max-width:767px) and (orientation: landscape) {
    .navbar-collapse{ overflow: hidden; overflow-y: scroll; height: 75vh;}
     .banner{height: calc(120svh - 72px);}

    
}

@media only screen and (min-width:320px) and (max-width:640px) { 
    
}