﻿@import url('https://fonts.googleapis.com/css?family=Montserrat');

.banner-img {
    background-size: cover;
    width: 100%;
    background-position: center center;
    background-repeat: no-repeat
}
/*--------------------- pavers vs pages ------------------------*/

/*--------------------------- pavers pages --------------------------------*/
.banner-div {
    background-color: #6b9e8b;
    color: white;
    width: 95%;
    padding: 8px;
    margin-left: 8px;
}
.product-pg h2 {
    font-size: 27px;
    font-weight: 500;
}
.product-pg .h2 {
    font-size: 34px;
    line-height: 40px;
    font-weight: bold;
    margin-bottom:20px
}
.gal-link {
   color: #6b9d8b
}
.gal-link:hover{
    color:#6b9d8b;
}
.ba-gal {
    width: 30%;
    display: inline-block
}
#swTitle {
    color: #d85038;
    font-weight: bold;
    text-align: center
}
#pnForm .form_conversion .field_item.fi_submit {
    text-align: center
}
.faq-item {
    padding: 10px 5px;
    /*font-size: 1rem;*/
}
.blog-item {
    padding-top: 20px;
    padding-bottom:5px;
    border-bottom: 1px solid #f1f3f6;
}
.displayStart {
    display: none;
}
.blog-item a {
    text-decoration: none;
    color: #886939
}
.headline-divider {
    border-bottom: 1px solid #a09994;
    max-width: 600px;
    margin: 0 auto
}
ul.tabs{
    list-style-type:none;
    padding:0;
    margin:0;
}
ul.tabs li{
    display:inline-block;
    padding:20px 15px;
    cursor:pointer;
    font-size:20px;
    font-weight:bold;
    color:#a09994;
    text-transform:uppercase
}
ul.tabs li.active{
    color:#c48e65
}

.gal-banner {
    height: 340px;
    /*border-top: 16px solid #a09994;*/
    background: center center no-repeat;
    background-size: cover !important;
    position: relative;   
}
.patio-gal-banner {
    /*background-image: url(/images/layout/herosub/patio.jpg);*/ /*e04082022*/
    background-image: url(https://systempavers.com/images/pavers/gallerybanner.jpg);
}

.turf-gal-banner {
    /*background-image: url(/images/layout/herosub/patio.jpg);*/ /*e04082022*/
    background-image: url(https://systempavers.com/images/turf/galleryBanner.jpg);
}
/*e04082022*/
.half-circle2 {
    background-image: none !important;
    background-color: #FCFBFB !important;
    height:200px !important;
    margin:50px !important
}
.hstyleE {
    padding-top: 40px;
    font-size: 40px;
    font-family: 'Playfair Display';
}
.rowstyleE{
    position:relative;
    top:-40px;
}
.pstyleE {
    font-style:italic;
    font-family: 'Playfair Display';
}

.stylespE05082022 {
  font-family: 'Playfair Display';
    font-weight: 550;
    /* padding: 25px; */
    font-size: 17px;
    color: white;

    padding-top: 5%;

}
.driveway-gal-banner {
    background-image: url(/images/layout/herosub/driveway.jpg);
}
.pool-gal-banner {
    background-image: url(/images/layout/herosub/pooldeck.jpg);
}
.walkway-gal-banner {
    background-image: url(/images/layout/herosub/walkway.jpg);
}
.ba-gal-banner {
    background-image: url(/images/layout/herosub/before-after.jpg);
}
.outdoor-gal-banner {
    background-image: url(/images/layout/herosub/outdoor.jpg)
}
.bbq-gal-banner {
    background-image: url(/images/layout/herosub/bbq-islands.jpg)
}
.kitchen-gal-banner {
    background-image: url(/images/layout/herosub/outdoor_kitchens_gallery.jpg)
}
.kitchen-gal-banner .half-circle{
    background:none
}
.turf-gal-banner {
    background-image: url(https://systempavers.com/images/turf/gallerybanner.jpg)
}
.water-feature-gal-banner {
    background-image: url(/images/layout/herosub/water-feature.jpg)
}
.half-circle {
    height: 273px;   
    background: url(/images/layout/half_circle.png) center top no-repeat;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
opacity: 0.9;
    text-align: center;
    font-size: 21px;
    color: #6a6a6a;
}
.half-circle h2 {
    font-weight: 300;
    font-size: 40px;
    line-height:40px;
    padding-top:30px
}
.gallery-nomore {
    height: auto;
    display: block;
    margin-left: 0;
	text-align:center;
}
.gallery-nomore img {
    margin: 0 5px 15px;
    width: 217px;
    max-width:40%;
    border: 1px solid #b4b3b3;
	height:auto;
      /*height: 159px;*/
}
.gallery-more {
	height:520px;
    overflow: hidden;
    display: block;
    margin-left: 0;
    text-align:center;
    margin-bottom:15px;
}
.gallery-more img {
    margin: 0 5px 15px;
    width: 217px;
    height: 159px;
    border: 1px solid #b4b3b3
}
#show-more, #show-less, #show-more2, #show-less2 {
    cursor: pointer;
    margin: 0 auto
}
.form_conversion {
    padding: 20px;
}
.form-content .fi_firstname, .form-content .fi_lastname, .form-content .fi_address, .form-content .fi_state, .form-content .fi_zip, .form-content .fi_phone {
    width: 48%;
    float: left;
    display: inline;
    margin-right: 2%;
    position: relative;
}
.form-content .fi_email {
    width: 98%;
    margin-right: 2%;
}
.form-content .form-group {
    text-align: left;
}
.form_conversion input[type=checkbox] {
    vertical-align: middle;
    width: 20px;
    height: 20px;
    margin-right: 5px;
}
/*.anchor_top:active{bottom:39px;}*/
.driveway-header {
    background-image: url('/images/pavers/driveway-header.jpg');
}
.patio-header {
    background-image: url('/images/pavers/patio-header.jpg');
}
.pooldeck-header {
    background-image: url('/images/pavers/pooldeck-header.jpg');
}
.walkway-header {
    background-image: url('/images/pavers/walkway-header.jpg');
}
.ba-header {
    background-image: url('/images/pavers/ba-header.jpg');
}
.ba-pt4{
    padding-top:40px;
}
.outdoor-living-header {
    background-image: url('/images/outdoor/outdoor-living-header.jpg');
}
.bbq-header {
    background-image: url('/images/outdoor/bbq-header.jpg');
}
.outdoor-kitchen-header {
    background-image: url('/images/outdoor/outdoor-kitchen-header.jpg');
}
.turf-header {
    background-image: url('https://systempavers.com/images/turf/heroshot.jpg');
}
.water-features-header {
    background-image: url('/images/outdoor/water-features-header.jpg');
}
.referral-header {
    background-image: url('/images/myreferral/referral-header.jpg');
}
.turf-checklist {
    font-size: 13px;
    font-weight: bold;
    color: #9e9a97;
    text-align: center;
}
.toggleContent {
    display: none;
    padding-top:15px;
}
.toggleHeader{
    font-weight:500;
    cursor:pointer;
}
/*.faq .faq-item:nth-child(even) .toggleHeader {
    background-color: #F1F3F6
}*/
/*----------------------------new home page-----------------------------------*/
.home {
    font-family: Poppins,Arial;
    font-weight: 300;
    color: #14242F
}
.home h2 {
    font-family: 'Playfair Display';
    font-weight: 400;
    /*font-size: 2.5rem;    
    line-height: 2.75rem;*/
    letter-spacing: -.5px;
}
.home .review-name {
    font-size: 14px;
    font-weight: 600;
}
.home .review-name span {
    font-weight: 300;
}
.home .review {
    background-color: rgba(218,203,186,0.2);
    padding: 6% 8%;
    margin-bottom: 20px;
}
.home-banner-btn .sp-btn{
    margin-bottom:0;
    margin-right:10px
}
.home .sp-btn, .social-sweeps .sp-btn {
    font-family: Poppins,Arial;
    font-weight: 400;
    padding: .625em 1.25em;
    line-height: inherit
}
.home h3 {
    font-family: Poppins, Arial;
    font-weight: 300;
    margin-bottom:4%
    /*font-size: 1.5rem;    
    line-height:1.75rem*/
}
.home .hr {
    border-top: 1px solid rgba(20,36,47,.2);
    margin:2% 15px;
}
.home .faq {
    font-weight: 600;
}
.home .faq-item {
    border-top: 1px solid rgba(20,36,47,.2);
    padding:12px 5px
}
.home .resources a {
    font-weight: 500;
    color: #C48E65;
}
.home .appt-bg {
    background-image: url(/images/home/appt-bg.jpg);
    background-size: cover;
    background-position: center center;
    min-height: 400px;
    background-repeat: no-repeat;
    text-align: center;
    position: relative;
}
.home .appt-box {
    background-color: #fff;
    font-weight: 500;
    color: #95989A;
    padding: 3% 20px;
}
.home h1, .home .headline{
    font-family: 'Playfair Display';
    /*font-size: 3.25rem;*/
    font-weight: 400;
    /*line-height:3.5rem;*/
    letter-spacing: -.5px;
}
/*.home .about-bg {    
    text-align: center;
    position: absolute;
    color:#fff;
    padding:30px 10%;
    font-weight:400;
    background:rgba(0,0,0,0.4);
    height:100%;
    top:0;
    display:flex;
    justify-content:center;
    align-items:center
}*/
.home .about-bg {
    background-image: url(/images/home/about-bg.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    text-align: center;
    position: relative;
    color: #fff;
    padding: 30px 40px;
    font-weight: 400;
}
.home .nav-tabs{
    border-bottom:none;
    padding-left:0;
    list-style:none;
}
.home .nav-tabs > li{
    margin-bottom:0;
    display:inline-block;
    float:none;
}
.home .nav-tabs > li > a {
    border: 1px solid #BEC3C6;
    border-radius: 0;
    width: 135px;
    text-transform: uppercase;
    color: #BEC3C6;
    font-weight:600;
    font-size:12px;
    text-align:center;
    padding:10px 5px;
    display:block;
    position:relative;
    margin-right:0;
    height:40px;
    text-decoration:none;
    cursor:pointer !important
}
.home .nav-tabs>li.active>a, .home .nav-tabs>li.active>a:hover, .home .nav-tabs>li.active>a:focus{
    background-color:#14242F;
    border:1px solid #14242F;
    color: #BEC3C6;
    text-decoration:none
}
.home .outdoor-living-tabs {
    width: 80%;
    margin-left: 20%;
    /*min-height: 470px;*/
    padding-bottom:8%;
    display: flex;
    padding-top:3%;
    justify-content:flex-end;
}
.home .tabs-img img{
    position:absolute;
    left:15px;
    top:-20px;
    width:48%;
    max-height:98%
}
.home .tabs-copy {
    flex-basis: 60%
}
.home .tab-content{
    margin:20px 15% 0 0;
}
.home .tab-content h2{
    font-size:2rem;
}
.fade-in-image {
    animation: fadeIn .5s ease-out;
    -webkit-animation: fadeIn .5s ease-out;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    25%{
        opacity:0.7
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 1;
    }
}
.home .promo-slider{
    color:#fff;
    text-align:center;
    font-weight:400;
}
.home .promo-headline{
    font-family: 'Playfair Display';
    /*font-size: 4.5rem;*/
    font-weight: 400;
    letter-spacing: -5px;
    margin-bottom:10px;
}
.home .promo-subhead{
    font-size:2.25rem;
    padding-bottom:20px;
    font-weight:300;
}
.home .promo-subhead2{
    font-size:1.5rem;
    font-weight:500;
    /*border-top:1px solid #fff;
    border-bottom:1px solid #fff;*/
    width:250px;
    margin:0 auto 0 auto;
    padding:5px 0;
}
.home .promo-slider .carousel-caption {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-shadow: none;
    z-index: 1;
    padding: 0;
    margin: auto;
    width: 80%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content:center;    
}
.home .promo-slider .carousel-caption .promo-desc{
    font-size:1.125rem
}
.home .promo-slider .carousel-control{
    width:30px;
    opacity:1
}
.home .promo-slider .carousel-control .arrow-left{
    left:10px
}
.home .promo-slider .carousel-control .arrow-right{
    right:10px
}
.home .promo-slider .carousel-control .arrow-left img, .home .promo-slider .carousel-control .arrow-right img{
    width:20px
}
.home .promo-slider .carousel-control.left, .home .promo-slider .carousel-control.right{
    background-image:none
}
.home .promo-slider .carousel-control .arrow-left, 
.home .promo-slider .carousel-control .arrow-right{
    position:absolute;
    top:42%;
    z-index:5;
    display:inline-block
}
.home .promo-slider .slider-text{
    width:330px;
    margin:0 auto 20px auto
}
.home .carousel-indicators{
    z-index:5;
    bottom:0;
}
.home .carousel-indicators li {
    background-color: #BFBFBF;
    border-radius: 0;
    width: 58px;
    height: 8px;
    border:1px solid #bfbfbf;
}
.home .carousel-indicators .active{
    margin:1px;
    background-color:#14242F;
    border:1px solid #ffffff;
}
.home .banner-content {
    /*background: linear-gradient(to right, #14242f 60%, #fff 40%);*/
}
.home .banner-copy{
    width:440px;
    margin:5% auto;
    height:100%;
    
}
.home .banner-slider .bx-wrapper {
    border: none;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    margin-bottom: 30px;
    background: #fff;
}
.home .banner-slider .bx-wrapper .bx-caption{
    background:none;
    color:#ffffff;
    left:2%
}
.home .banner-slider .bx-wrapper .bx-pager.bx-default-pager a{
    background:#bfbfbf;
    width:58px;
    height:8px;
    border:1px solid #bfbfbf;
    border-radius:0;
}
.home .banner-slider .bx-wrapper .bx-pager.bx-default-pager a:hover, 
.home .banner-slider .bx-wrapper .bx-pager.bx-default-pager a.active, 
.home .banner-slider .bx-wrapper .bx-pager.bx-default-pager a:focus{
     border: 1px solid #14242F;
     background-color:#14242F;
}
.home .banner-slider .bx-wrapper .bx-pager,
.home .banner-slider .bx-wrapper .bx-controls-auto{
    bottom:-20px;
}
.home .banner-subhead{
    font-family: 'Playfair Display';
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.5rem;
    letter-spacing: -1px;
}

.carousel-fade .carousel-inner .item {
    opacity: 0;
    transition-property: opacity;
    transition-duration:.4s
}
.carousel-fade .carousel-inner .active {
    opacity: 1;
}
.home .locations table{
    margin-bottom:10px;
}
.home .locations ul.states-list{
    margin:0;
    padding:0;
    list-style-type:none
}
.home .locations table a {
    font-weight: 500;
    color: #95989A;
    text-decoration:none
}
.home .locations table a:hover {
    color: #fff;
    text-decoration: none
}
.home .locations table th, .home .locations table td{
    border-top:none;
    padding:5px;
}
.home .map-desc{
    width:40%;
    position:absolute;
    top:15%;
    right:10%;
    /*font-size:1.25rem;*/
}
.home .process-content{
    display:flex;
}
.home .process-img-mobile{
    display:none;
}
.home .process-step {
    flex-basis: 15%;
    display: flex;
    transition: all 0.3s ease-in-out
}
.home .process-step:after{
    content: '';
    width: 2px;
    background-color: #14242F;
    margin:50px 0 0 23px
}
.home #step1 .process-step {
    background: url(/images/home/step1.png) no-repeat;
    background-size:50px 50px
}
.home #step2 .process-step {
    background: url(/images/home/step2.png) no-repeat;
    background-size: 50px 50px;
}
.home #step3 .process-step {
    background: url(/images/home/step3.png) no-repeat;
    background-size: 50px 50px;
}
.home .process-copy {
    flex-basis: 80%;
    margin-top: 10px;
    margin-bottom: 30px
}
.home .process-step.inactive {
    opacity: .2;
    transition: all 0.3s ease-in-out
}
.animate-fadein.animated {
    opacity: 1;
}
.animate-fadein {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 1s;
    transition-timing-function: ease-in-out;
}
.animate-topIn.animated {
    opacity: 1;
    transform: translate(0,0);
}

.animate-topIn {
    opacity: 0;
    transform: translate(0,60px);
    transition-property: transform, opacity;
    transition-duration: 1s;
    transition-timing-function: ease-in-out;
}
.home rect.on {
    fill: #c93b32;
    stroke: #c93b32;
}
.home .outdoor-living{
    margin-top:50px;
    margin-bottom:30px;
}
.gallery-images img {
    width: 217px;
    margin: 6px 4px;
    text-decoration: none;
    display: inline-block;
}

.vid-wrapper {
    position: relative;
    overflow: hidden;
}
.vid-content {
    width: 150%;
    height:100%;
    background:#000000
}
/*----------------------------referral page-----------------------------------*/
.referral {
}
.referral h2{
    font-size:1.5rem;
    font-weight:bold;
    margin-bottom:10px;
    line-height:1.75rem;
}
.referral h3{
    font-size:1.125rem;
    line-height:1.5rem;
}
.referral .logout-bar {
    padding:20px 30px;
}
.referral .form-row {
    margin-bottom: 8px;
}
.referral .form-lbl {
    width: 28%;
    display: inline-block;
}
.referral .form-txt {
    width: 70%;
    display: inline-block;
}
.referral .form-col{
    padding:30px 20px 20px 20px;
    margin-bottom:30px;
}
.referral .ref-col{
    padding:30px 20px
}
.referral .form-control{
    display:inline-block
}
.referral hr{
    margin:5px 0 10px 0;
    border-top:1px solid rgba(21,36,47,.2)
}
.referral .btn-send{
    min-width:100px;
    padding:12px 20px;
    margin-left:20px;
}
.referral .tbl-referral {
    text-align:center;
    width:100%
}
.referral .tbl-referral td{
    padding:5px 8px;
    vertical-align:middle
}
.referral .table-responsive{
    margin-top:30px;
}
.referral .tbl-referral tr:nth-child(even) td{background:#f6f5f4;}
.referral .ph{
    font-weight:bold;
    white-space:nowrap
}
.referral .clipboard{
    font-size:14px;
    font-style:italic;
    color:rgba(21,36,47,.4)
}
.referral-consult .form-group{
    text-align:left
}
#modalEmail .modal-body {
    padding: 0;
}
#modalEmail .modal-header {
    border: none
}
#modalEmail .close {
    opacity: .5;
    font-size: 30px;
}
/*---------------------------- social sweepstakes -------------------------------*/
.social-sweeps {
    font-family: Poppins,Arial;
    font-weight: 400;
    line-height:1.625rem;
    color: #14242F;
    font-size:1rem;
}
.social-sweeps h2{
    font-family: 'Playfair Display';
    font-size: 2.625rem;
    font-weight: 400;
    line-height: 3rem;
    letter-spacing: -1.5px;
}
.social-sweeps .date{
    font-size:18px;
    color:#1A272E;
    font-style:italic;
    font-weight:normal
}
.social-sweeps-form{
    padding:30px 20px 20px 20px;
}

.social-sweeps .text-col{
    margin-right:60px;
}
.social-sweeps .note{
    font-size:13px;
    line-height:20px;
}
.social-sweeps .headline {
    font-weight:600;
    font-size:1.5rem
}
.social-gallery a img {
    width: 217px;
    display: inline-block;
    margin: 10px 10px;
}
.social-sweeps .blog-headline {
    font-size: 1.75rem;
    line-height: 2.25rem;
    font-family: 'Playfair Display', Arial;
    letter-spacing: -1.5px;
}
.social-sweeps .blog-headline a{
    color:#14242F;
    text-decoration:none
}
/*----------------------------customer portal error page------------------------*/

.cp-error-pg{
    color:#14242F;
}
.cp-error-pg .lg-text{
    font-size:1.25rem;
}
.cp-error-pg .msg{
    max-width:420px;
    margin-left:auto;
    margin-right:auto;
    line-height:1.5rem;
}
.cp-error-pg h1{
    font-family:'Playfair Display',Arial;
    font-size:3.75rem;
}
/*----------------------------instagram page-----------------------------------*/
.instagram [class*="col-"] {
    padding: 3px 3px;
}
/*----------------------------faq-----------------------------------*/
.sp-faq .panel {
    background-color: transparent;
    border-radius: 0;
    border: none;
    box-shadow: none;
    margin-bottom: 10px;
}

.sp-faq .panel-heading {
    font-size: 1rem; /*16px*/
    background-color: transparent;
    border: none;
    border-radius: 0;
    padding: 10px 0;
    cursor: pointer
}
.sp-faq .panel-heading a {
    color: #1A272E;
    text-decoration: none
}
.sp-faq .panel-body {
    /*border-bottom: 1px solid #EAEAEA;*/
    padding: 15px 20px 15px 25px;
}
.sp-faq .panel-heading a:before {
    content: "\f068";
    font-family: 'Font Awesome 5 Free';
    float: left;
    color: #C48E65;
    display: block;
    margin-right: 10px;
    font-weight: 900;
}
.sp-faq .panel-heading a.collapsed:before {
    content: "\f067";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900
}
.sp-faq .panel-heading span {
    display: block;
    overflow: hidden;
    font-size:18px;
    font-weight:500;
}
/*----------------------------- subcontractor page --------------------------------*/
.subcontractor {
    font-family: Arial, Helvetica, sans-serif;
    color: #15242F;
    line-height: 24px;
}
.subcontractor .icon{
    float:left;
    /*width:15%;
    margin-top:20px;*/
    margin-right:5%
}
.subcontractor .text{
    float:left;
    width:80%;
}
.subcontractor h3{
    font-weight:400;
    line-height: 1.75rem;
}
.subcontractor h2{
    font-family:'Playfair Display',Arial;
    font-weight:bold;
}
.career h2{
    font-family:'Playfair Display',Arial;
    font-weight:400;
    text-transform:capitalize
}
.subcontractor .review-box{
    border-radius:5px;
    padding:30px;
    text-align:center;
    background-color:#fff;
    font-size:14px;
    position:relative;
    margin-bottom:40px;
    margin-top:20px;
    min-height:280px;
}
.subcontractor .review-box:before {
    content: "";
    position: absolute;
    top: 100%;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top:20px solid transparent;
    border-top-color: #FFF;
    left:48%
}
.subcontractor .name{
    font-size:18px;
    font-weight:bold;
    display:block;
}
.subcontractor .title{
    font-size:14px;
}
.subcontractor .construction-bg{
    background-image:url(/images/career/subcontractor/construction-bg.jpg);
}
.subcontractor-bg {
    background-image: url(/images/career/subcontractor/header.jpg);
    color:#ffffff
}
.subcontractor ul {
    padding: 0;
    margin: 0;
}
.subcontractor ul li {
    background-image: url('https://systempavers.com/images/common/green-check-icon.png');
    background-repeat: no-repeat;
    list-style-type: none;
    padding-left: 40px;
    background-size:30px 30px;
    background-position-y:5px;
    margin-bottom:20px;
}
.subcontractor ul li span{
    font-size:1.25rem;
    font-weight:bold;
    display:block;
    margin-bottom:5px;
}
.subcontractor .video-content {
    padding: 20px 30px;
    border: 1px solid #F1F3F7;
    background-color: #ffffff;
    margin-left:18%
}
.subcontractor .video-box{
    margin-top:-150px;
    position:relative;
    z-index:9
}
.subcontractor .lblmsg {
    overflow: hidden;
    resize: none;
    outline: none;
    margin-bottom:20px;
}
.subcontractor .logos img{
    margin:30px 14px 0 14px
}
.subcontractor .legal{
    font-size:12px;
    line-height:18px;
}
.subcontractor .contact-box{
    margin:0 auto;
    /*max-width:400px;*/
}
.subcontractor .contact-ph{
    display:inline-block;
    font-size:1.5rem;
    text-align:left;
    margin:0 20px;
    line-height:1.5rem;
    vertical-align:middle
}
.subcontractor .contact-ph span{
    font-size:1.25rem;
    display:block;
    margin-bottom:2px
}
.subcontractor .review-box.spanish {
    min-height: 370px;
}
.subcontractor .req {
    font-weight: 400;
    font-size: 14px;
    color: #E63131;
    font-style: italic
}
.subcontractor .sp-header-content h1 {
    text-transform: none;
    margin-bottom:20px;
}
.subcontractor ul.map-states{
    padding:0;
    margin:0;
    position:absolute;
    top:20%;
    right:5%
}
.subcontractor ul.map-states li{
    list-style-type:none;
    background-image:none;
    margin-bottom:5px;
    line-height:22px
}
.subcontractor .career-banner{
    padding:20px;
    color:#ffffff;
    text-align:center
}
.subcontractor .career-banner a{
    color:#ffffff;
    text-decoration:underline
}
.career-bg {
    background-image: url(https://systempavers.com/images/career/careers-banner-19_Final.jpg);
    min-height: 250px;
}
.career ul.sp-list2 {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.career ul.sp-list2 li {
    background-image: url(https://systempavers.com/images/common/check-icon.png);
    background-repeat: no-repeat;
    padding-left: 40px;
    margin-bottom: 15px;
    text-align: left
}
.career .tblEmpHist{
}
.career .tblEmpHist td{
    padding:10px
}
.career .tblEmpHist textarea{
    resize:none
}
.career .gen-app{
    margin:0 auto
}
.career .gen-app td{
     padding:20px 20px
}
.career .gen-app th{
    padding-left:20px
}
.career .gen-app textarea {
    resize: none
}
.career .tblnest {
    border: 1px solid #ccc
}
.career .cur{
    cursor:pointer
}
/*---------------------------- Responsive-----------------------------------*/
@media (max-width: 575.98px) {
    .form-content .fi_firstname, .form-content .fi_lastname, .form-content .fi_address, .form-content .fi_state, .form-content .fi_zip, .form-content .fi_phone{
    width:98%
}

    .sp-btn {
        
        min-width: 150px !important;
   
}
.half-circle {
    background-size: 310px auto;
    font-size: 15px;
    height: 236px !important;
}
.home .nav-tabs > li > a {
    width: 170px;
    margin-right: 5px;
    margin-bottom: 10px;
}
.home .promo-subhead{
    font-size:1.5rem;
    padding-bottom:0;
}
.home .about-bg {
    padding:30px 20px;
}
.home .promo-slider .carousel-caption .sp-btn{
    min-width:120px;
    margin-top:0;
    padding:8px 10px;
}   
.home .promo-subhead2{
    margin:0 auto 0 auto;
    font-size:1rem;
}
.home .outdoor-living{
    margin-top:30px;
    margin-bottom:10px;
}
.social-sweeps-form{
    padding:30px 0 20px 0;
}
.social-sweeps h2{
    font-size:2.25rem;
}
.home .process-step{
    flex-basis:18%
}
.home .locations table{
    font-size:12px;
}
.home-banner-btn .sp-btn{
    margin-right:0
}
.subcontractor .contact-ph{
    margin:0 5px
}
.subcontractor .sp-btn{
    min-width:0;
    padding:12px 18px;
}
.subcontractor ul.map-states{
    top:0;
    right:-10px;
    font-size:14px;
    width:200px;
}
.subcontractor ul.map-states li{
    line-height:18px
}
}

@media (min-width: 576px) and (max-width: 767.98px) {
.half-circle {
    background-size: 400px auto;
    font-size: 15px
}
.half-circle h2 {
    font-weight: 300;
    font-size: 30px;
    line-height: 30px;
    padding-top: 15px
}
.home .nav-tabs > li > a {
    margin-bottom: 10px;
}
.home .promo-slider .carousel-inner .item{
    height: 450px;
}
}
@media (max-width:767.98px){
.gallery-more img{height:auto; max-width: 40%; } 
.gallery-more{height:auto;margin-top: 8%;}
.gallery-nomore{height:auto;margin-top: 42%;}
.product-pg h2{font-size:20px;}
.product-pg h3{font-size:18px;}
.gal-banner{}
.stylespE05082022 {
    font-family: 'Playfair Display';
    font-weight: 550;
    /* padding: 25px; */
    font-size: 17px;
    color: white;
    padding-top: 19%;
}
.hstyleE {
    padding-top: 28% !important;
    font-size: 40px;
    font-family: 'Playfair Display';
}
ul.tabs li{
    padding:5px 10px;
    font-size:14px;
    display:inline-block;
    border:1px solid #ddd;
    margin:0 -2px;
    font-weight:normal;
    background:#f1f3f6;
}
ul.tabs li.active{background:#fff;}

.ba-pt4{
    padding-top:0;
}
.product-pg .h2 {
    font-size: 24px;
    line-height: 28px;
}
.home .map-desc{
    width:100%;
    position:relative;
    top:0;
    right:0
}
.home .promo-slider .slider-text{
    width:250px;
}
.gallery-images img{
    max-width:40%
}
.social-gallery a img{
    max-width:40%;
}
.social-sweeps .text-col {
    margin-right: 0;
    text-align: center
}
.subcontractor .video-content {
   margin-left:0;
   padding:20px 15px
}
.subcontractor .construction-bg{
    min-height:300px;
}
.subcontractor .contract-icon{
    width:46px
}
.ba-gal {
    width: 45%;
}
}
@media (max-width:991.98px) {
.home .outdoor-living-tabs {
    width: 100%;
    margin-left: 0;    
    display: flex;
    flex-direction:column;
    padding-top:40px;
    padding-bottom:2%;
    text-align:center;
}
.home .tabs-img{
    padding:20px 0;
}
.home .tabs-img img {
    position:relative;
    left:0;
    right:0;
    top:0;
    width:100%;
}
.home .tab-content{
    position:relative;
    margin:10px 20px 20px 20px;
}
.home .about-bg img{
    width:250px;
}
/*.vid-wrapper{
    height:400px;
}*/
.home .banner-content {
    background:linear-gradient(#14242f 65%, #ffffff 40%);
}
.home .banner-copy {
    width: 100%;
}
.home .promo-slider{
    margin-top:30px;
}
.home #step1 .process-img-mobile{
    display:block;
}
.home .process-img{
    display:none;
}
.home .process-content {
    cursor: pointer
}
.home .resources{
    margin-top:30px;
}
.referral .ref-col{
    padding:30px 0
}
.social-sweeps-form{
    padding:30px 0 20px 0;
}
.subcontractor .sp-middle {
    display: block;
}
.subcontractor .review-box {
    min-height: 0;
}
.subcontractor .review-box.spanish {
    min-height:0;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
.home .promo-slider .carousel-inner .item {
    height: 500px;
}
.home .sp-middle {
    display: block;
}
.social-gallery a img{
    max-width:30%;
}
.vid-content {
    width: 100%;
}
.subcontractor .video-content {
   margin-left:0;
}
.subcontractor .contact-ph{
    font-size:1.25rem
}
.subcontractor .contract-icon{
    width:46px
}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
.home .nav-tabs > li > a{
    font-size:10px;
    padding:12px 4px;
    width:100%
}
.sp-btn{
    min-width:150px;
}
.home .about-bg img{
    width:300px;
}
.home .about-bg {
    padding:20px 30px;
}
.home .promo-slider .slider-text{
    width:300px
}
.home .map-desc{
    top:20%;
    right:5%
}
.home .promo-subhead{
    font-size:1.75rem;
    padding-bottom:0;
}
.home .promo-subhead2{
    margin:0 auto 10px auto;
    font-size:1.25rem;
    padding:2px
}
.home .banner-copy{
    width:90%;
    margin:30px
}
.home .banner-slider .bx-wrapper .bx-viewport{
    height:450px !important;
}
.home .banner-slider .bx-wrapper .bx-caption{
    top:0;
    margin-top:330px
}
.home .banner-content {
    background:linear-gradient(#14242f 50%, #ffffff 50%);
}
.home .banner-content.sp-middle{
    display:block
}
.home .locations table a {
    font-size: 14px;
}
.home .resources{
    margin-right:15px;
}
.subcontractor .review-box {
    min-height: 320px;
}
.subcontractor .video-content {
   margin-left:0;
}
.subcontractor .logos img{
    margin:30px 3px 0 3px
}
}
@media (min-width:1100px) and (max-width:1400px) {
.home .tabs-copy{
    flex-basis:63%;
}
.home .outdoor-living-tabs{
    padding-bottom:5%;
}
.home .tabs-img img {
    width:45%;
}
.home .nav-tabs > li > a{
    font-size:11px;
    padding:12px 6px;
    width:100%
}
.subcontractor .video-content {
    margin-left:10%
}
}
@media (min-width:1200px) and (max-width:1500px){
.home .banner-copy div{
    width:430px
}
}

@media (max-width: 768px) {
    .displayStart {
        display: block;
    }
    .sp-btn-start {
        min-width:95%;
        background-color: #c93b32;
        padding: 5% !important;
    }

    .home .banner-slider .bx-wrapper {
       
        margin-bottom: -3% !important;
      
    }
}
