@media (min-width: 320px) and (max-width: 480px) {
    #ul-header {
        text-align: left;
    }
    #sub-header {
        display: none;
    }
    .box-content-services {
        padding: 50px 25px;
    }
    a#nav-logo img {
        width: 80px;
        position: relative;
        top: 12px;
        left: 81px;
        right: -50px;
        text-align: right;
    }
    .navbar-paver {
        padding-top: 0px;
    }
    .main-banner {
        position: relative;
        height: 600px;
        width: 100%;
    }
    .img-paving {
        content: url(../img/home/banner-paving.png);
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }
    .line-services::after {
        position: absolute;
        content: "";
        height: 0.01rem;
        width: 70%;
        background-color: #c59f8d;
        bottom: -15px;
        left: 15%;
    }
    .line-services {
        margin-bottom: 55px;
    }
    .main-about-content {
        padding-top: 0px;
        padding-bottom: 100px;
    }
    .main-portfolio .img-thumbnail {
        margin-bottom: 25px;
    }
    .main-about {
        position: relative;
        padding-top: 80px;
        color: #fff;
        height: 600px;
    }
    .paving-about {
        content: url(../img/about/about-top.png);
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        top: 400px;
        z-index: -1;
    }
    .paving-about-2 {
        content: url(../img/about/about-botton.png);
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        bottom: -25px;
    }
    .main-title-services {
        text-align: center;
        height: 500px;
        padding-top: 0px;
    }
    .main-title-services h2 {
        display: none;
    }
    .paving-paving {
        content: url(../img/services/paving/paving.png);
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        top: 350px;
        z-index: 1;
    }
    .paving-outdoor {
        content: url(../img/services/outdoorliving/outdoor-living.png);
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        top: 410px;
        z-index: 1;
    }
    .services-paving-paving {
        content: url(../img/services/paving/paving-botton.png);
        position: absolute;
        width: 70%;
        left: 0;
        bottom: -125px;
    }
    .services-paving-outdoor {
        content: url(../img/services/outdoorliving/outdoor-living-2.png);
        position: absolute;
        width: 30%;
        right: 0;
        top: 94%;
    }
    .paving-install {
        content: url(../img/services/pavinginstall/install.png);
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        top: 410px;
        z-index: 1;
    }
    .services-paving-install {
        content: url(../img/services/pavinginstall/install-bottom.png);
        position: absolute;
        width: 65%;
        left: 0;
        bottom: -128px;
    }
    .paving-repair {
        content: url(../img/services/pavingrepair/repair.png);
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        top: 410px;
        z-index: 1;
    }
    .services-paving-repair {
        content: url(../img/services/pavingrepair/repair-bottom.png);
        position: absolute;
        width: 53%;
        right: 0;
        top: 92%;
    }
}


/* 
##Device = Laptops, Desktops
##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {}


/* 
##Device = Tablets, Ipads (portrait)
##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {}


/* 
##Device = Tablets, Ipads (landscape)
##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {}


/* 
##Device = Low Resolution Tablets, Mobiles (Landscape)
##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {}


/*IPAD PRO */

@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) {}


/* 
##Device = Most of the Smartphones Mobiles (Portrait)
##Screen = B/w 320px to 479px
*/