@media (max-width: 480px) and (min-width: 320px) {
    #menu-button{
        position: absolute !important;
        top: 50%;
        transform: translateY(-50%);
        right: 50%;
    }
    #rev_slider_3_1 div {
        font-size: 16px !important;
        text-align: center !important
    }

    .quick-contact {
        margin-left: 1.5rem
    }

    .quick-contact:before {
        border-width: 22px 20px 23px 0
    }
}

@media (min-width: 48em) {
    #top-right-menu .menu > .menu-item {
        padding: 9px 14px;
        border-left: 1px solid rgba(238, 238, 238, .1)
    }

    #top-right-menu .menu > .menu-item:last-child {
        border-right: 1px solid rgba(238, 238, 238, .1)
    }

    .site-header.style-02 .mini-cart__content {
        right: 0 !important
    }

    .we-are-layout1 .col-lg-6 {
        padding: 70px 20px
    }

    .element-item {
        width: calc(100% / 2)
    }

    .testimonial .owl-dots {
        position: absolute;
        right: 0;
        bottom: 30px
    }

    .testimonial-2 .col-md-offset-6:before {
        content: '';
        width: 80px;
        height: 100%;
        position: absolute;
        top: 0;
        right: 100%;
        background: rgba(17, 17, 17, .95)
    }

    .testimonial-2 .col-md-offset-6:after {
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
        border-width: 300px 0 300px 150px;
        border-left-color: rgba(17, 17, 17, .95);
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translate(0, -50%)
    }

    .page-projects-basic .element-item, .page-projects-3columns .element-item, .page-projects-sidebar .element-item {
        width: calc(100% / 2)
    }
}

@media (min-width: 64em) {
    #top-right-menu .menu > .menu-item {
        padding: 9px 30px
    }

    .extra-info [class*=col] {
        margin-bottom: 0
    }

    .element-item {
        width: calc(100% / 4)
    }

    .piece-of-us {
        position: relative;
        overflow: hidden;
        padding: 0
    }

    .piece-of-us h2, .piece-of-us p {
        text-align: left;
        margin-bottom: 5px
    }

    .piece-of-us [class*=col] {
        padding: 55px 0
    }

    .piece-of-us [class*=col] * {
        position: relative;
        z-index: 6
    }

    .piece-of-us .col-md-8:before, .piece-of-us .col-md-10:before {
        content: '';
        display: block;
        width: calc(100% - 90px);
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 3;
        background: #eee
    }

    .piece-of-us .col-md-8:after, .piece-of-us .col-md-10:after {
        content: '';
        display: block;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 180px 0 180px 100px;
        border-color: #fff;
        border-left-color: #eee;
        right: -10px;
        z-index: 4;
        position: absolute;
        top: 50%;
        transform: translate(0, -50%)
    }

    .piece-of-us:after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 900px;
        height: 100%;
        background: #fff;
        z-index: 0
    }

    .post-list-item .entry-meta {
        position: relative
    }

    .post-grid-item, .post-simple-item, .post-full-item {
        padding-bottom: 20px
    }

    .post-grid-item .post-thumb, .post-simple-item .post-thumb, .post-full-item .post-thumb {
        position: relative;
        margin-bottom: 35px
    }

    .post-grid-item .post-thumb .entry-meta, .post-simple-item .post-thumb .entry-meta, .post-full-item .post-thumb .entry-meta {
        margin-bottom: 0;
        position: absolute;
        left: 0;
        bottom: -17px
    }

    .product-thumb img {
        margin-bottom: 0
    }

    .cart-button {
        position: absolute;
        width: 130px;
        padding: 12px 17px;
        z-index: 2;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) scale(0)
    }

    .product-thumb_link:before {
        content: "";
        background-color: #fff;
        position: absolute;
        top: 1px;
        right: 1px;
        bottom: 1px;
        left: 1px;
        opacity: 0;
        visibility: hidden;
        z-index: 1
    }

    .product:hover .product-thumb_link:before {
        opacity: .8;
        visibility: visible
    }

    .product:hover .cart-button {
        transform: translate(-50%, -50%) scale(1)
    }

    .page-projects-basic .element-item, .page-projects-3columns .element-item {
        width: calc(100% / 4)
    }
}

@media (min-width: 80em) {
    .site-branding {
        padding: 5px 20px 5px 15px;
    }

    .site-header.style-01 {
        background: #111;
        color: #fff
    }

    .site-header.style-01 i {
        color: #fbd232
    }

    .site-header.style-01 .site-branding::before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: -1000px;
        width: 1000px;
        background: #fbd232
    }

    .site-header.style-01 .site-branding::after {
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 63px 0 63px 40px;
        border-color: transparent;
        border-left-color: #fbd232;
        position: absolute;
        top: 0;
        left: 100%
    }

    .site-header.style-01 .extra-info .col-sm-5 {
        padding-left: 85px
    }

    .site-header.style-01 .extra-info span {
        color: rgba(255, 255, 255, .6)
    }

    .site-header.style-01 .search-cart .search-box {
        margin-bottom: 0
    }

    .site-header.style-01 .search-cart .mini-cart {
        margin-bottom: 0
    }

    .site-header.style-03 .site-branding {
        background: #fbd232
    }

    .site-header.style-03 .site-branding:before {
        content: '';
        position: absolute;
        display: block;
        background: #fbd232;
        top: 0;
        bottom: 0;
        width: 1000px;
        left: -1000px
    }

    .site-header.style-03 .site-branding:after {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
        top: 0;
        z-index: 1;
        border-width: 65px 0 65px 40px;
        border-left-color: #fbd232;
        left: 100%
    }

    .site-header.style-03 .mini-cart .mini-cart__button .mini-cart-icon:after {
        background: #fbd232;
        color: #111
    }

    .site-header.style-03 nav {
        margin-left: 20px
    }

    .site-header.style-03 nav li {
        padding: 0 20px
    }

    .we-are-layout1 {
        padding: 0
    }

    .we-are-layout1:before {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background: url(../images/page-home/home01_projects_bg-left.jpg) center left no-repeat;
        z-index: -2
    }

    .we-are-layout1 .col-lg-6 {
        padding: 70px 0
    }

    .we-are-layout1 .col-lg-6:before, .we-are-layout1 .col-lg-6:after {
        content: '';
        position: absolute;
        height: 50%;
        width: 160%;
        background: #fff;
        left: -130px;
        z-index: -1
    }

    .we-are-layout1 .col-lg-6:before {
        top: 0;
        webkit-transform: skew(-30deg, 0);
        transform: skew(-30deg, 0)
    }

    .we-are-layout1 .col-lg-6:after {
        bottom: 0;
        webkit-transform: skew(30deg, 0);
        transform: skew(30deg, 0)
    }

    .we-are-layout1 li {
        display: block;
        width: 100%;
        margin-right: -3px;
        vertical-align: top;
        padding: 0 12px;
        margin-bottom: 20px;
        border-left: 3px solid #fbd232
    }

    .element-item {
        width: calc(100% / 4)
    }
}

@media (max-width: 79.9em) {
    .extra-info [class*=col] {
        margin-bottom: 20px
    }
}

@media (max-width: 480px) {
    .col-sm-15 {
        width: 49% !important;
        margin: 0 auto
    }

    .service-item {
        height: 150px !important
    }

    .site-branding img {
        width: 30%;
        float: right;
    }
    .footer-about img{
        width: 40% !important;
    }

    #rev_slider_3_1_wrapper {
        height: 350px !important
    }

    #rev_slider_3_1 {
        height: 100% !important
    }
    .tp-revslider-mainul li:nth-child(2) > div.tp-parallax-wrap{
        left: 5% !important;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    .col-sm-15 {
        width: 50% !important
    }

    .service-item {
        height: 200px !important
    }

    .site-branding img {
        width: 50%;
        float: right;
    }

    #rev_slider_3_1_wrapper {
        height: 500px !important
    }

    #rev_slider_3_1 {
        height: 100% !important
    }

    #rev_slider_3_1 div {
        font-size: 24px !important;
        text-align: center !important
    }

    #rev_slider_3_1 div #slide-8-layer-10 {
        left: 50% !important;
        transform: translateX(-50%) !important
    }
    .tp-revslider-mainul li:nth-child(2) > div.tp-parallax-wrap{
        left: 10% !important;
    }
}

@media (min-width: 769px) and (max-width: 992px) {
    .col-sm-15 {
        width: 50% !important
    }

    .service-item {
        height: 250px !important
    }

    .site-branding img {
        width: 50%;
        float: right;
    }

    #rev_slider_3_1_wrapper {
        height: 600px !important
    }

    #rev_slider_3_1 {
        height: 100% !important
    }

    #rev_slider_3_1 div {
        font-size: 24px !important;
        text-align: center !important
    }

    #rev_slider_3_1 div #slide-8-layer-10 {
        left: 50% !important;
        transform: translateX(-50%) !important
    }
}

@media (min-width: 993px) and (max-width: 1200px) {
    .service-item {
        height: 200px !important
    }

    .site-branding img {
        width: 30%
    }

    #rev_slider_3_1_wrapper {
        height: 700px !important
    }

    #rev_slider_3_1 {
        height: 100% !important
    }

    #rev_slider_3_1 div {
        font-size: 30px !important;
        text-align: center !important
    }

    #rev_slider_3_1 div #slide-8-layer-10 {
        left: 50% !important;
        transform: translateX(-50%) !important
    }

    .service-list_item > div {
        padding-left: 5px
    }

    .service-list_item-description_title {
        font-size: 20px !important;
        padding-bottom: 5px !important;
        margin-bottom: 0 !important
    }

    .service-list_item-img img {
        height: auto !important
    }

    .tp-caption img {
        display: none !important
    }
}

@media (min-width: 1201px) and (max-width: 1279px) {
    .site-branding img {
        width: 30%
    }
}

@media (min-width: 1201px) and (max-width: 1440px) {
    .quick-contact {
        z-index: 9
    }

    #rev_slider_3_1 .tp-caption.Renovation-BigTitle, .Renovation-BigTitle {
        font-size: 48px
    }

    .service-list_item > div {
        padding-left: 5px
    }

    .service-list_item-description_title {
        font-size: 20px !important;
        padding-bottom: 5px !important;
        margin-bottom: 0 !important
    }

    .service-list_item-img img {
        height: auto !important
    }

    .features-style-1 .feature-item-wrapper {
        padding: 20px 0 20px 0 !important
    }

    .features-style-1 .feature-item-wrapper p {
        width: 82%
    }

    .features-style-1 .feature-item-wrapper:before {
        border-width: 150px 60px 150px 0 !important
    }

    .features-style-1 .feature-item-wrapper i {
        right: 0 !important
    }
}

@media (max-width: 63.9em) {
    .service-list_item {
        height: auto !important
    }

    .service-list_item-description_title {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important
    }

    .big-title h3 {
        font-size: 20px
    }

    .projects-basic .w-75 {
        width: 100%
    }

    .features-style-1 .feature-item-wrapper:before {
        right: -60px !important
    }

    .features-style-1 .feature-item-wrapper {
        padding: 20px 95px 20px 20px !important
    }

    .testimonial blockquote {
        padding: 65px 5px 5px 5px !important
    }

    .testimonial blockquote p {
        font-size: 15px !important
    }
}

@media (max-width: 47.9em) {
    .site-header.style-03 .mini-cart, .site-header.style-03 .search-box {
        margin-bottom: 20px
    }

    .page-services-list .service-list_item-categories {
        padding-top: 30px
    }

    .about-view-projects img, .our-team_big-image img {
        margin-bottom: 20px
    }
}

@media (min-width: 769px){
.col-md-3-safari{flex:24% !important; flex-basis:24% !important}
.col-md-4-safari{flex:33% !important; flex-basis:33% !important}
}