@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    /* For Old IE 7-8-9 */    
}
@media only screen and (max-width:17800px){
    .page-slider{right: 4%;}
}
@media only screen and (max-width:1660px){

    .banner .over-section .item{max-width: 424px;}
    .our-project .blog{width: 48%;}
    .our-project .blog img{max-width: 100%;}
    footer .customers-recommend .contact-section .form-system .top-col input{width: 24%;}
    footer .footer-top-section .right-section .contact-detail p,footer .footer-top-section .right-section .contact-detail a{font-size: 16px; line-height: 18px}
    footer .footer-top-section .right-section p{font-size: 17px; line-height: 30px}
    footer .footer-bottom-section ul li{margin-left: 7.5%;}

}
@media only screen and (max-width:1460px){
    .wrapper{max-width: 1188px;}
}
@media only screen and (max-width:1366px)
{
    .page-slider{right: 2%;}
    footer .customers-recommend{padding-top: 50px;}
    footer .customers-recommend .custome-content{padding-bottom: 90px;}
    footer .customers-recommend .contact-section .form-system{padding-bottom: 100px;}
    .banner .over-section .item h2{font-size: 80px; line-height: 70px;}
    .uncompromising{padding:85px 0 124px ;}
    .uncompromising .right-col p{line-height: 34px;}
    .quality_service{padding-top: 78px; padding-bottom: 47px; margin-bottom: 25px;}
    .uncompromising .right-col{padding-left: 15px;}
    footer .customers-recommend h2,.our-custome h2,.our-project h2{padding-bottom: 25px; font-size: 38px;}
}
@media only screen and (max-width:1280px) /* if tablate and mobile view is same */
{
    .wrapper{max-width: 1080px}
    footer .customers-recommend .custome-content .col-3{width: 32%;}
    footer .customers-recommend .custome-content .col-3 .bottom-section{padding-top: 15px;}
    footer .customers-recommend .contact-section .form-system .top-col input:last-child{width: 50%;}
    footer .footer-bottom-section ul li{margin-left: 7.2%;}
    footer .footer-top-section .right-section .contact-detail .img-section{padding-left: 15px;}
    footer .footer-top-section .right-section .contact-detail .detail-section{padding-right: 15px;}
    footer .footer-top-section .right-section .contact-detail .col{margin-left: 50px;}
    footer .footer-bottom-section:after{left: 30px; right: 30px;}

    .artical-list .list .right-image{width: 550px;}
    .artical-list .list .left-content{width: calc(100% - 550px)}
}

@media only screen and (max-width:1024px)
{
    header .brand{width: 160px;}
    header .brand img{max-width: 100%;}
    header nav ul{padding-top: 22px;}
    header .contact-detail{padding-top: 22px;}
    .wrapper{padding-left: 15px; padding-right: 15px;}
    .page-slider{display: none;}
    .banner .over-section .item {max-width: 335px}
    .banner .nav_arrow{height: 134px;}
    .banner .over-section .item h2{font-size: 70px; line-height: 64px;}
    .uncompromising{padding-bottom: 85px;}
    .uncompromising .right-col{padding-left: 55px;}
    .uncompromising .right-col p{line-height: 28px;}
    .quality_service .col-right h2{font-size: 36px; line-height: 36px;}
    .quality_service .col-left .col-6 h3{margin-bottom: 10px;}
    .quality_service .col-left .col-6 p{line-height: 28px;}
    .our-project{margin-bottom: 50px;}
    .our-project h2{margin-bottom: 50px;}
    footer .footer-bottom-section{padding: 35px 0; margin-top: 50px;}
    footer .customers-recommend .contact-section .form-system{padding-bottom: 50px;}
    footer .footer-bottom-section ul{text-align: center;}
    footer .footer-bottom-section:after{left: 15px; right: 15px;}
    footer .footer-bottom-section ul li{margin-bottom: 10px;}
    footer .footer-top-section .right-section .contact-detail p, footer .footer-top-section .right-section .contact-detail a{font-size: 14px; line-height: 16px;}

    .category-list-nav ul li{min-width: 128px;}
    .artical-list .list .left-content p{font-size: 16px; line-height: 25px;}
    .building_better_world .left-section .bottom-section .col .image-section{height: 290px;}
    
    .uncompromising-blog{margin-bottom: 80px;}
    .experience p{margin-bottom: 30px;}
    .uncompromising-section{margin-top: 70px; margin-bottom: 70px;}
    
    .project-detail-part .left-content,.project-detail-part .right-image{width: 50%;}

}

@media only screen and (max-width: 959px)
{
    header .wrapper{padding-left: 0;}
    header .hemMenu{width: 30px; height: 30px; position: relative; margin-right: 15px; z-index: 9999;}
    header .hemMenu span{width: 100%; position: absolute; width: 100%; top: 50%; margin-top: -1px; height: 2px; background: #fff;}
    header .hemMenu span:after{position: absolute; content: ''; width: 100%; height: 100%; right: 0; top: -10px; background: #fff; transition: 0.5s ease all;}
    header .hemMenu span:before{position: absolute; content: ''; width: 100%; height: 100%; right: 0; top: 10px; background: #fff; transition: 0.5s ease all;}
    header .hemMenu.active span{background-color: transparent}
    header .hemMenu.active span:before{transform: rotate(45deg); top: 0;}
    header .hemMenu.active span:after{transform: rotate(-45deg); top: 0;}

    header nav{position: fixed; width: 100%; height: 100%; right: 0; top: 0; background: #B39444; opacity: 0; visibility: hidden; transition: 0.4s ease all;}
    header nav.active{opacity: 1; visibility: visible;}
    header nav ul{display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex; width: 100%; height: 100%; flex-direction: column; padding-top: 0; justify-content: center; align-items: center}
    header nav ul li{display: block; margin-right: 0; margin-bottom: 40px;}
    header nav ul li:last-child{margin-bottom: 0;}
    header nav ul li a{font-size: 36px; font-weight: 500;}
    .banner .over-section{width: 100%; max-width: 400px; height: 400px;left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 5px;}
    .banner .over-section .item {text-align: center; align-items: center; padding: 15px; max-width: none}
    .banner .over-section .item h2{width: 100%; text-align: center;}
    .banner .over-section .item p{text-align: center;}

    .quality_service .col-right{width: 100%; text-align: center; margin-bottom: 30px;}
    .quality_service .col-left{width: 100%;}
    footer .footer-top-section .right-section .contact-detail{flex-direction: column;}
    footer .footer-top-section .right-section .contact-detail .col{margin-bottom: 25px;}
    footer .footer-top-section .left-section{padding-right: 15px;}
    footer .footer-top-section .right-section{padding-left: 15px;}
    footer .footer-top-section .right-section .footer-logo{margin-bottom: 20px;}
    footer .footer-top-section .right-section .contact-detail{margin-top: 30px;}
    footer .footer-bottom-section ul li{margin:0 12px;}
    footer .customers-recommend .custome-content .col-3{padding: 15px;}
    footer .customers-recommend .custome-content .col-3 .top-section{flex-direction: column; text-align: right; align-items: flex-start}

    .projecr-blog .blog{height: 218px;}
    footer .customers-recommend .transparent{margin-bottom: 70px;}
    .artical-list .list{flex-direction: column}
    .artical-list .list .right-image{width: 100%;}
    .artical-list .list .left-content{width: 100%; padding-right: 0; padding-top: 20px;}
    .artical-list .list .left-content .bottom-section{position: relative;bottom: auto; right: auto; margin-top: 40px;}
    .category-list-nav ul li{margin-left: 5px;}

    .building_better_world {flex-wrap: wrap; margin-bottom: 30px;}
    .building_better_world .left-section img{width: 100%;}
    .building_better_world .left-section .bottom-section .col .image-section{height: 480px;}
    .building_better_world .right-section{width: 100%;}
    .building_better_world .left-section{width: 100%; padding-right: 0;}
    
    .uncompromising-section {flex-direction: column}
    .uncompromising-section .left-section,.uncompromising-section .right-section{width: 100%; padding-right: 0; }
    .uncompromising-section .right-section{margin-bottom: 40px;}
    .uncompromising-blog {flex-wrap: wrap}
    .uncompromising-blog .col{width: 49%; margin-bottom: 11px;}
    .experience .brand-list .list{width: 33.33%; text-align: center; margin-bottom: 10px;}
    .uncompromising-section .right-section:after{display: none;}
    
    .uncompromising_reliability{margin-top: 40px;}
    .uncompromising_reliability h2{margin-bottom: 50px;}
    
    .project-detail-part{flex-wrap: wrap}
    .project-detail-part .right-image{margin-bottom: 20px;}
    .project-detail-part .left-content,.project-detail-part .right-image{width: 100%;}
    
}

@media only screen and (max-width:767px)
{
    header {background: #000;}
    header .brand{width: 120px;}
    header .contact-detail{margin: 0; background: none; padding:15px 0 15px 15px;}
    header .contact-detail a.contact{color: #fff; font-size: 14px;}
    header .contact-detail a img{margin-right: 0;}
    header .contact-detail a.tel{font-size: 0; margin-right: 10px;}
    header nav ul li{margin-bottom: 20px;}
    header nav ul li a{font-size: 22px;}

    .banner .over-section{width: 300px; height: auto; right: auto; background-color: rgba(0,0,0,0.7); padding-bottom: 15px;}
    .banner .over-section .item{position: relative;}
    .banner .over-section .item h2{font-size: 40px; line-height: 40px}
    .banner .thumbnail{width: 94px; height: 68px; right: auto; left: 0;}
    .banner .nav_arrow{right: auto; left: 94px;}
    .banner .thumbnail a p{font-size: 12px; left: 5px;}
    .banner .nav_arrow{height: 68px;}
    .banner .nav_arrow a:first-child{margin-bottom: 10px;}
    .banner .thumbnail img{width: 100%;}

    .uncompromising{display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex; flex-direction: column-reverse; padding-top: 20px; padding-bottom: 20px;}
    .uncompromising .left-col{width: 100%; margin-bottom: 20px;}
    .uncompromising .left-col .img-section:after{display: none;}
    .uncompromising .right-col{width: 100%; padding-left: 0;}
    .quality_service{padding-top: 25px; padding-bottom: 10px;}
    .quality_service .col-right h2{font-size: 26px; line-height: 26px;}
    .quality_service .col-left .col-6{width: 100%; padding-right: 0; margin-bottom: 25px;}
    .quality_service .col-left .col-6 p{line-height: 22px;}
    .our-project .blog{width: 100%; margin-bottom: 25px;}
    .our-project .blog p{line-height: 24px;}
    .our-custome .item a{margin-bottom: 15px;}
    .our-custome{margin-bottom: 30px;}

    footer .customers-recommend h2{margin-bottom: 30px;}
    footer .customers-recommend .custome-content {flex-wrap: wrap; padding-bottom: 20px;}
    footer .customers-recommend .custome-content .col-3{width: 100%; margin-bottom: 20px;}
    footer .customers-recommend .contact-section h2{margin-bottom: 20px;}
    footer .customers-recommend .contact-section p{font-size: 16px; margin-bottom: 15px; text-align: center;}
    footer .customers-recommend .contact-section .form-system .top-col{flex-wrap: wrap}
    footer .customers-recommend .contact-section .form-system .top-col input:last-child{width: 100%;}
    footer .customers-recommend .contact-section .form-system .top-col input{width: 100%; margin-bottom: 10px;}
    footer .customers-recommend .contact-section .form-system textarea{margin-top: 0;}
    footer .customers-recommend .custome-content .col-3 .top-section .img-section{margin-bottom: 10px;}
    footer .footer-top-section>.d-flex{flex-direction: column}
    footer .footer-top-section .left-section,footer .footer-top-section .right-section{width: 100%;}
    footer .footer-top-section .left-section{padding-right: 0; border: 0}
    footer .footer-bottom-section ul {text-align: right;}
    footer .footer-bottom-section ul li{margin: 0 0 10px; width: 31.33%; }
    footer .customers-recommend .transparent p{font-size: 16px; line-height: 27px}
    footer .customers-recommend h2, .our-custome h2, .our-project h2{font-size: 36px; line-height: 36px}
    footer .customers-recommend .transparent h2{margin-bottom: 20px;}
    footer .footer-top-section .left-section img{width: 100%;}

    .projecr-blog{padding-bottom: 40px; padding-top: 25px;}
    .projecr-blog .blog{width: 100%; margin-left: 0;}

    .category-list-nav ul{display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex; overflow: auto; padding-top: 20px; padding-bottom: 20px;}
    .category-list-nav ul li{ margin-left: 0; text-align: right; margin-bottom: 10px; width: auto; min-width: inherit;}
    .category-list-nav ul li a{padding-bottom: 0; padding: 0;}
    .artical-list .list{margin-bottom: 30px;}
    .artical-list .list .right-image{height: 170px;}
    .artical-list .list .left-content{padding-top: 10px;}

    .breadcrum{margin-top: 15px; margin-bottom: 15px;}
    .breadcrum-section .breadcrum-link{margin-top: 0; float: right; margin-bottom: 15px;}
    .semi-banner img{margin-bottom: 20px;}
    .breadcrum a{font-size: 16px;}
    .building_better_world .right-section h3{font-size: 24px; margin-bottom: 10px;}
    .building_better_world .right-section p{font-size: 16px; line-height: 22px;}
    .building_better_world .left-section .bottom-section .col .image-section{height: 210px;}
    
    .uncompromising-section{margin-bottom: 30px;}
    
    .uncompromising-blog .col h4{font-size: 14px; margin-top: 8px;}
    .uncompromising-blog .col{height: 170px;}
    .uncompromising-blog .col img{width: 50px;}
    .uncompromising-blog{margin-bottom: 20px;}
    .uncompromising-section .left-section h3{font-size: 26px;}
    .uncompromising-section .left-section p{font-size: 16px; line-height: 24px;}
    .experience .brand-list .list{width: 50%;}
    .processes_transparent{margin-bottom: 33px;}
    .processes_transparent h2{font-size: 26px; margin-bottom: 20px;}
    .processes_transparent p{font-size: 16px; line-height: 28px;}
    
    .uncompromising_reliability{margin-bottom: 00px;}
    .uncompromising_reliability .left-section .list:last-child{margin-bottom: 0;}
    .uncompromising_reliability.reverce-blog{margin-bottom: 40px;}
    .experience h3{font-size: 26px;}
    .uncompromising_reliability.reverce-blog .section-item,.uncompromising_reliability .section-item{flex-direction: column}
    .uncompromising_reliability.reverce-blog .section-item .right-section,.uncompromising_reliability .right-section{width: 100%; padding-right: 0;}
    .uncompromising_reliability .right-section:after{display: none;}
    .uncompromising_reliability.reverce-blog .section-item .left-section,.uncompromising_reliability .left-section{width: 100%; padding-right: 0; margin-top: 20px;}
    
    .project-detail-part .left-content h3{margin-bottom: 10px;}
    .project-detail-part .left-content{padding-right: 0;}
    .project-detail-part .left-content p{font-size: 16px; line-height: 27px}
    
    footer .footer-bottom-section .creater-link{top: 20px;}


}
@media only screen and (orientation: landscape) and (max-width:767px)
{

}

@media (max-height: 500px)
{

}

@media (max-width:321px)
{

}