/* Media */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, nav ul, blockquote, q, blockquote:before, blockquote:after, q:before, q:after, a, ins, mark, del, abbr[title], dfn[title], table, hr, input, select, ul, ol {
    -webkit-tap-highlight-color: transparent;
    -moz-tap-highlight-color: transparent;
    -ms-tap-highlight-color: transparent;
    -o-tap-highlight-color: transparent;
    tap-highlight-color: transparent;
    -webkit-focus-ring-color: transparent;
    -moz-focus-ring-color: transparent;
    -ms-focus-ring-color: transparent;
    -o-focus-ring-color: transparent;
    focus-ring-color: transparent;
}

textarea, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
button, input[type="button"], input[type="reset"], input[type="submit"] {
	-webkit-appearance: button;
	-moz-appearance: button;
	appearance: button;
}

/* Smaller Screen */
@media screen and (max-width : 1366px){
    #header .contact-num{right: -180px;}
    #header .contact-num:hover{right: 0;}
    #header nav{right: 50px;}
    .inner-page #header .contact-num{right: 0;}
    .clientele-list{max-width: 95%;}
}
@media screen and (max-width : 1160px){
    .secondary-btn{padding: 10px 10px;}
    #header nav ul li{margin-left: 20px;}
    #header .enquiry-btn{margin-left: 15px;}
    #header nav{margin-right: 10px;}
}
/* END Smaller Screen */

/* Tab */
@media screen and (max-width : 800px){
    #main:before,
    #main:after{
        display: none;
    }
    .secondary-btn{padding: 10px 30px;}
    .wrapper{width: 90%;}
    .abt-lf-ess .abt-lf-ess-hldr{display: block;}
    .abt-lf-ess-profile{margin: 45px 0 0 0;}
    #header nav{display: none;}
    #header .wrapper{justify-content: space-between;}
    #header .contact-num{
        position: relative;
        right: 0;
        border-radius: 50%;
        width: auto;
        height: auto;
        padding: 0;
    }
    #header .contact-num .desktop-info{display: none;}
    #header .contact-num .mobile-btn{
        width: 48px;
        height: 48px;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        -ms-align-items: center;
        align-items: center;
        justify-content: center;
        box-shadow: 0 20px 20px rgba(0, 0, 0, 0.16);
        border-radius: 50%;
    }
    #header .contact-num .mobile-btn svg{
        margin: 0;
        width: 25px;
        height: 25px;
    }
    .our-pro-main{
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        -o-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }
    .our-projects{
        width: 100%;
        margin: 45px 0 0 0;
    }
    .enquiry-form{
        width: 90%;
        margin: 40px 0;
    }
    .enquiry-form-hldr{justify-content: space-between;}
    .enquiry-popup .popup-close{
        position: relative;
        bottom: 0;
        left: 0;
        margin-left: 0;
        transform: none;
    }
    #header{
        padding: 0;
        box-shadow: 0 2px 2px rgba(0, 0, 0, 0.16);
    }
    #header.sticky{box-shadow: 0 2px 2px rgba(0, 0, 0, 0.16);}
    #header .logo-hldr a{
        justify-content: flex-start;
        -ms-align-items: center;
        align-items: center;
    }
    #header .logo-hldr{justify-content: flex-start;}
    #header .logo-hldr a img{margin-right: 20px;}
    #container{padding-top: 125px;}
    ul.services-lst{
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        -o-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    ul.services-lst li{
        -webkit-flex: none;
        -moz-flex: none;
        -ms-flex: none;
        -o-flex: none;
        flex: none;
        width: 50%;
        margin: 0;
    }
    ul.services-lst li:nth-child(2){margin-right: 0;}
    ul.services-lst li h6{border: none;}
    ul.services-lst li p{display: none;}
    #ContactUs ul.contact-lst{
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
    }
    #ContactUs ul.contact-lst li{
        border: none;
        border-bottom: 1px solid #3DB9B4;
        margin: 0 0 20px 0;
        padding: 0 0 20px 0;
    }
    #ContactUs ul.contact-lst li:last-child{margin: 0 0 20px 0;}
    /* Inner Page */
    #inner-main .article-cnt{
        display: block;
        margin-top: 20px;
    }
    #inner-main ul.article-lst > li:nth-child(2n) .article-cnt .img-hldr,
    #inner-main .img-hldr{
        width: 100%;
        margin: 0 0 30px 0;
    }
    .fix-breadcrump h6{
        white-space: nowrap;
        margin-right: 15px;
    }
    .fix-breadcrump ul{
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        -o-flex-wrap: nowrap;
        flex-wrap: nowrap;
        overflow: auto;
    }
    .fix-breadcrump ul li{white-space: nowrap;}
    #banner .banner-cnt{display: none;}
    .abt-lf-ess .wrapper{width: 85%;}
    .our-pro-cnt .our-pro-ech:hover img{transform: scale(1);}
    .our-pro-hldr{width: 100%;}
    .our-pro-main{height: auto;}
    .our-pro-cnt{
        width: 100vw;
        margin-left: -5vw;
        height: auto;
    }
    .our-pro-cnt .owl-stage-outer .owl-stage{height: auto;}
    .our-pro-cnt .owl-stage-outer{
        margin: 0;
        padding: 0 0 40px 0;
    }
    .our-services h2{padding-bottom: 30px;}
    .our-services{padding: 40px 0 30px 0;}
    .projects{padding-top: 30px;}
    .clientele{padding: 30px 0 30px 0;}
    .popup .popup-sld-one .owl-stage{padding: 0;}
    #inner-main ul.article-lst > li{
        margin-bottom: 40px;
        padding-bottom: 40px;
    }
    .inner-page #inner-main{padding-top: 230px;}
    #inner-main ul.article-lst{margin-top: 20px;}
    .popup .popup-sld-one .popup-sld-ech{
        width: 90%;
        margin: 0 auto;
    }
    h2{
        text-transform: uppercase;
        text-align: center;
        font-size: 20px;
    }
    .projects h2{text-align: left;}
    #banner{top: 105px;}
    .banner-sticky #banner{
        top: 65px;
        padding-top: 10px;
    }
    .enquiry-form legend{text-align: center;}
    .enquiry-form legend b{
        display: block;
        text-transform: uppercase;
    }
    .our-pro-cnt.owl-carousel .owl-nav .owl-prev,
    .our-pro-cnt.owl-carousel .owl-nav .owl-next{top: 43%;}
    #banner .banner-heading{
        text-align: center;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        -o-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }
    #banner .banner-heading > div{
        -webkit-flex: 1;
        -moz-flex: 1;
        -ms-flex: 1;
        -o-flex: 1;
        flex: 1;
    }
    .desktop-home{
        width: 30px;
        opacity: 1;
        visibility: visible;
    }
    .desktop-home span{display: none;}
    #banner .banner-heading h2{
        float: none;
        display: inline-block;
        font-size: 24px;
        border-bottom-width: 2px;
    }
    .banner-sticky #banner .banner-overlay{opacity: 1;}
    .gallery-hldr{margin: 0;}
    .inner-page.explore-page #banner .banner-heading{justify-content: center;}
    .explore-page.inner-page #inner-main{padding-top: 230px;}
    .inner-page #header .contact-num{padding: 0;}
    /* END Inner Page */
    #banner .banner-heading{margin-top: 0;}
    .owl-carousel.clientele-list .owl-stage,
    .owl-carousel.clientele-list .owl-stage-outer{display: block;}
    #header .mobile-enquiry-hldr{
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: flex-end;
    }
    #OurProducts h2{justify-content: center;}
    #OurProducts h2 hr{display: none;}
    #OurProducts{padding-bottom: 0;}
    .projects h2 br{display: block;}
    .clientele-list li{width: 25%;}
    .clientele-list li:nth-child(4n+1):before{display: none;}
    .clientele-list li:nth-child(5n+1):before{display: block;}
    .clientele-list li:first-child:before{display: none;}
    .on-going{overflow: visible;}
    .arrow-btns{display: none;}
}
/* END Tab */

/* Mobile */
@media screen and (max-width : 640px){    
    .our-pro-cnt{
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
    }
    .our-pro-cnt .secondary-btn{font-size: 16px;}
    .projects-lst{margin: 25px 20px 0 20px;}
    #header .logo-hldr a img:first-child{
        width: 110px;
        margin-right: 15px;
    }
    #header .logo-hldr a img:last-child{width: 80px;}
    .abt-lf-ess-cnt .vision-mission{
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
    }
    .abt-lf-ess-cnt .vision{
        -webkit-flex: none;
        -moz-flex: none;
        -ms-flex: none;
        -o-flex: none;
        flex: none;
        margin: 0 0 20px 0;
    }
    .clientele-list li{width: 50%;}
    .clientele-list li:nth-child(2n+1):before{display: none;}
    .clientele-list li:last-child::after{display: none;}
    .clientele-list li img{
        max-width: 120px;
        max-height: 70px;
    }
}
/* END Mobile */