@media (min-width: 1200px) and (max-width: 1499.98px) {

    .service-slider-main {

        width: 108vw;

    }
    .container {
    max-width: 1170px;
}

}



/* Large devices (desktops, less than 1200px) */

@media (max-width: 1199.98px) {

    .container {

        max-width: calc(100% - 30px);

    } 

    .logo {

        width: 130px;

    }

    .logo::before {

        width: 300px;

        height: 300px;

        left: -82px;

        top: -68px;

    }

    .slider-content label {

        width: 240px;

        font-size: 36px;

        line-height: 42px;

        padding-right: 20px;

    }

    .slider-content p {

        width: 390px;

        font-size: 18px;

        line-height: 26px;

        padding-left: 30px;

    }

    .banner-section .owl-nav {

        bottom: 83px;

    }

    .banner-section .owl-carousel .owl-nav button {

        width: 30px;

        height: 30px;

        background-size: 50%;

    }

    .banner-section .owl-carousel .owl-nav button.owl-prev {

        margin-right: 16px;

    }

    .service-slider-main {

        width: 100%;

    }

    .service-slider-detail h2 {

        font-size: 24px;

    }

    .project-slider-content {

        width: calc(100% - 200px);

    }

    .project-slider-main .owl-nav {

        bottom: 51px;

        right: auto;

        left: calc(100% - 320px);

    }

    .project-slider-main .owl-carousel .owl-nav button.owl-prev::after {

        height: 40px;

        top: -14px;

    }

    footer {

        padding-top: 70px;

    }

    .footer-top {

        margin-bottom: 40px;

    }

    .footer-bottom {

        padding: 30px 0;

    }

    .footer-top .col-xl-3.col-lg-4 .footer-detail{

        padding-left: 40px;

    }

    .footer-detail{

        margin-top: 28px;

    }

    .testimonial-content p, .about-section p, .project-slider-content p {

        font-size: 28px;

        line-height: 34px;

    }

    .service-section .site-title p {

        width: 100%;

    }

}



/* Medium devices (tablets, less than 992px) */

@media (max-width: 991.98px) {

    .slider-content {

        flex-direction: column;

        align-items: flex-start;

    }
.page-project h1{padding-bottom: 0;}
header.second-header:not(.fix-header) .menu > .menu-item > a::before{background: transparent;}
header{background: #fff;}
.logo{padding: 4px 0;}
.map-left, .map-right{width: 100%;}
.map-right{padding:40px 20px;}
.page-project .panel-heading {
    position: relative; overflow-x: scroll; width: 100%;
    left: 0;
    top: 0;
}

 .page-project .panel-heading ul {
    border: none;
    width: 100%;
    overflow-x: scroll;
    margin-bottom: 30px;
}
    .slider-content label {

        width: 100%;

        border-right: 0;

        padding: 0;

        font-size: 32px;

        line-height: 40px;

    }

    .slider-content p {

        width: 80%;

        padding-left: 0;

        margin-top: 12px;

    }

    .main-title ~ span {

        margin-left: 0;

        width: 300px;

        margin-top: 20px;

        margin-bottom: 20px;

    }

    .service-slider-detail h2 {

        font-size: 20px;

        margin-top: 20px;

    }

    .service-slider-detail a {

        font-size: 14px;

    }

    .project-section {

        padding-top: 80px;

    }

    .site-title {

        margin-bottom: 40px;

    }

    .main-title {

        margin-left: 78px;

    }

    .d-flex.flex-column:not(.flex-lg-row) .main-title ~ span {

        margin-left: 0;

        margin-top: 20px;

        margin-bottom: 20px;

        width: 400px;

    }

    .testimonial-section, .service-section {

        margin: 80px 0;

    }

    .testimonial-content {

        padding: 0 30px;

    }

    .footer-top .col-xl-3.col-lg-4 .footer-detail {

        padding-left: 0;

    }

    .footer-bottom{

        flex-direction: column;justify-content: center; align-items: center;

        text-align: center;

    }

    .footer-bottom ul{

        text-align: center;

        margin-top: 4px;

        justify-content: center;

    }

}



/* Small devices (landscape phones, less than 768px) */

@media (max-width: 767.98px) {

    .project-slider-content {

        width: calc(100% - 60px);

        padding: 12px 20px;

    }

    .project-slider-main .owl-carousel .owl-nav button {

        background: url('../images/slider-arrow.png') center center no-repeat;

        width: 18px;

        height: 10px;

        background-size: cover;

    }

    .project-slider-main .owl-carousel .owl-nav button.owl-prev {

        margin-right: 30px;

    }

    .project-slider-main .owl-carousel .owl-nav button.owl-prev::after {

        height: 26px;

        top: -8px;

        left: -15px;

    }

    .project-slider-main .owl-nav {

        bottom: 40px;

        right: auto;

        left: calc(100% - 145px);

    }

    .project-slider-content p {

        padding-right: 80px;

    }

    .main-title ~ span {

        font-size: 28px;

        line-height: 38px;

        width: 100%;

    }
    .page-service .panel-heading {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    overflow-x: scroll;
}
.page-service .panel-body{width: 100%;}
.page-service .panel {width: 100%; overflow: hidden; overflow-x: hidden;}
.page-service .panel-heading {overflow-x:scroll;}
.page-service .panel-heading ul{width:1100px; overflow-x:scroll;display:inline-flex;}
.page-service .panel-heading ul li {
    display: block;
    width: auto;
    padding-right: 30px;
}
.page-cms.page-service{padding-top: 30px;}
.page-service .panel-body{padding: 40px 0 0 0;}
.page-service .panel-heading ul li a.active::after{right:0;background: transparent;}
.page-service .panel-heading ul li a{font-size: 16px;}
.service-cont { padding-bottom: 40px;}
.page-project h1 { padding-right: 0; padding-bottom: 20px;}
.page-pd h3{padding-bottom:30px;}
.free-qote{padding: 50px 0;}
.pd-icon{margin-bottom: 10px;}
.tab-content h3{padding-bottom: 20px;}
}



/* Extra small devices (portrait phones, less than 576px) */

@media (max-width: 575.98px) {

    .main-title ~ span {

        width: 100%;

    }
    .page-project .panel-heading ul {
    border: none;
    width: 680px;
    overflow-x: scroll;
    margin-bottom: 30px;
}

.project-list h4{min-height:auto;}
.project-list span{font-size: 14px;}
    .project-section {

        padding-top: 60px;

    }
.testimonial-section{margin-top: 10px;}
.testimonial-content p{padding-bottom: 10px;}
    .d-flex.flex-column:not(.flex-lg-row) .main-title ~ span{

        width: 100%;

    }

    .project-slider-detail {

        padding: 0 1px;

    }

    .project-slider-content {

        width: 100%;

        position: relative;

        border: 1px solid #ddd;

    }

    .project-slider-main .owl-nav {

        left: calc(100% - 90px);

    }

    .about-section{

        margin-top: 60px;

    }

    .testimonial-section, .service-section {

        margin: 60px 0;

    }

    .testimonial-content cite {

        margin-top: 28px;

    }

    footer {

        padding-top: 60px;

    }

    .footer-logo{

        margin-bottom: 20px;

    }

    .footer-bottom {

        justify-content: flex-start;

        align-items: flex-start;

        text-align: left;

        padding: 20px 0;

    }

    .footer-bottom ul{

        text-align: left;

        margin-top: 4px;

        justify-content: flex-start;

    }

    .footer-bottom ul li:first-child a {

        padding-left: 0;

    }

    .testimonial-content {

        padding: 0;

    }

    .testimonial-content p, .about-section p, .project-slider-content p {

        font-size: 22px;

        line-height: 28px;

    }

    .testimonial-content cite::before {

        width: 30px;

        left: -45px;

    }

    .logo {

        width: 100px;

    }

    .logo::before {

        display: none;

    }

    .banner-section .container.position-relative{

        display: none;

    }

    .slider-content p {

        width: calc(100% - 30px);

    }
.slider-content{bottom: 0;}
.slider-content label{font-weight: 600; font-size: 24px;}
.banner-section{height: 60vh;}
.about-section p{padding: 0;}
.page-cms{padding:40px 0 0 0;}
h2{font-size: 22px;}
.page-about span{padding-left:40px;}
.page-about span::after{width: 30px;top: 14px;}
.page-about h2{padding-left: 0;}
.page-cms p:empty{display: none;}
.ab-right{margin-bottom: 20px;}
.abt-img, .service-full-img, .project-thumb {
    
    margin-bottom: 10px;
}
}



@media (max-width: 400px) {

    .project-section {

        padding-top: 50px;

    }

    .main-title ~ span {

        font-size: 24px;

        line-height: 34px;

    }

    .footer-bottom ul{

        margin-top: 10px;

    }

    .footer-bottom ul li a{

        padding: 0;

        margin-right: 24px;

    }

    .footer-bottom ul li a::after {

        right: -15px;

    }

    .about-section{

        margin-top: 50px;

    }

    .testimonial-section, .service-section {

        margin: 50px 0;

    }

    .project-slider-content p {

        padding-right: 0;

    }

    .project-slider-main .owl-nav {

        position: unset;

    }

    .project-slider-main .owl-carousel .owl-nav button {

        width: 30px;

        height: 30px;

        background-size: 50%;

        border: 1px solid #000;

        border-radius: 50%;

        position: absolute;

        top: 50%;

        filter: invert(1);

    }

    .project-slider-main .owl-carousel .owl-nav button.owl-prev {

        margin-right: 0;

        left: 15px;

        transform: translateY(-50%) rotate(-180deg);

        position: absolute;

    }

    .project-slider-main .owl-carousel .owl-nav button.owl-next {

        right: 15px;

        transform: translateY(-50%);

    }

    .project-slider-main .owl-carousel .owl-nav button.owl-prev::after {

        display: none;

    }

}



@media (max-width: 359.99px) {

    

    

}