﻿#ContentInnerPanel {
    font-family: gothic,Helvetica,Arial,Sans-Serif;
    font-size:18px;
    color:#000;
    letter-spacing:normal !important;
}

#Hero {
    background:url(/images/landing_page_resources/contractors/hero2.jpg) no-repeat center;
    padding-top:150px;
    text-align:center;
    padding-bottom:30px;
    font-size:1.5em;
}
    #Hero div {
        background: #FF600A;
        padding:0.5em;
    }

#Hero .line {
    background:none;
    color:#fff;
    font-size:1.5em;
    line-height:100%;
    display:block;
}


#Hero .line.one{
    font-weight:700;
    font-size:2em;
}

#Hero .line.two{
    font-weight:200;
}

#LineItemPanel {
    padding-bottom:1em;
}

.lineItemRow {
    min-height:148px;
}

.subBanner {
    border: none;
    background: #fff;
    color: #000;
    padding: 0 0 22px 0;
    margin-right: 40px;
    position: relative;
    overflow: visible;
    margin-top: 38px;
}

    .subBanner.sticky {
        padding-bottom: 0;
    }

    .subBanner img.catImage {
        border: solid 6px #000;
        box-sizing:border-box;
        width: 193px;
        height: 193px;
        position: absolute;
        right: 0;
        top: 0;
        margin-right: -40px;
        margin-top: -22px;
    }
    .subBanner .title {
        background: #a3d4dc;
        font-size: 48px;
        font-family: montserrat, "Helvetica Neue",'Segoe UI',Helvetica,Arial,Sans-Serif;
        padding-top: 44px;
        padding-bottom: 48px;
        padding-left: 50px;
        text-align: left;
    }

    .subBanner.sticky img.catImage {
        margin-top: 0;
        margin-right: 0;
        width: 77px;
        height: 77px;
        max-height: initial;
    }
    .subBanner.sticky .title {
        padding-left: 50px;
        padding-bottom: 6px;
        padding-top: 8px;
        height: 63px;
    }

    .chevron {

    }

#Rebates {
    margin-top:1%;
    position: relative;
    box-sizing: border-box;
    background-color: #a3d4dc;
    text-align:center;
    overflow: hidden;
    color:#fff;
    padding: 0 2% 2%;
    line-height:100%;
    font-size:28px;
}

#Rebates img {
    display:block;
    margin:auto;
    height:120px;
}


#Rebates .headline{
    font-weight:700;
    padding:0.5em 0;
}

#LinkToRebates {
    background: #FF600A;
    border-radius: 10px;
    font-weight: 700;
    color: #fff;
    display: inline-block;
    margin: 0.5em auto;
    font-size: 0.9em;
    padding: 0.2em 0.5em;
}

#RebateCopy {
    text-align:center;
    font-size: 50%;
    padding: 1% 1% 2%;
    margin-bottom: 24px;
}

#LineItemsHeading {
    line-height: 105%;
    color: #000;
    text-align: center;
    padding: 6px 12px 20px 12px;
    font-weight:800;
    font-size:1.5em;
}

    #LineItemsHeading .subheading{
        font-size:0.8em;
        padding-top:16px;
        font-weight:500;
    }


    #PunchList{
        text-align:center;
        padding:6px 1% 0;
        font-size:1.5em;
    }

    #PunchList .headline{
        margin-top:2%;
        font-weight:700;
    }

    #PunchList .subheading{
        font-size:0.8em;
        margin-top:1%;
        margin-bottom:3%;
    }

    #PunchList .lineItemRow {
        padding-bottom:0;
    }

    #Checkbox{
        display:block;
        margin:auto;
        width:20%;
        max-width:172px;
    }


#PunchList .featured {
    border: solid 8px #80b8be;
    margin: 8% 0;
}
#PunchList .blurb{
    font-weight:800;
    font-size:0.8em;
}

#PunchList .carouselinsert {
    font-family: "Helvetica Neue",Helvetica,Arial,Sans-Serif;
    font-size: 14px;
    text-align: left;
    padding-bottom: 1em;
}

    #PunchList .simpleHeader {
        text-align:left;
        border:solid 8px #fff;
        display:inline-block;
        color:#fff;
        background:#000;
        padding:0.5em 0.8em 0.6em;
        margin:0;
        height:auto;
    }
        #PunchList .simpleHeader span {
            padding:0;
        }

    .featured .blurb {
        padding: 40px 1% 5%;
        position: relative;
    }

    .featured .blurb::before {
        content: "";
        position: absolute;
        margin: -20px auto auto auto;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        width: 50px;
        height: 50px;
        box-sizing: border-box;
        border: solid 8px #80b8be;
        background: #fff;
    }

    .featured .blurb .points {
        font-size: 0.8em;
        font-weight:400;
        margin-top: 0.5em;
    }

#PunchList .blurb a {
    display: block;
    color: #80b8be;
    padding-top: 0.5em;
    font-size: 0.8em;
}

.darkBand {
    background: #000;
    color: #fff;
    text-align: center;
    margin: 1%;   
    box-sizing:border-box;
}
.orangeBand {
    box-sizing: border-box;
    border: solid 6px #FF600A;
    color: #FF600A;
    text-align: center;
    margin: 1%;
}
.darkBand h2, .orangeBand h2 {font-weight:800;}

    .darkBand img, .orangeBand img{
        width:100%;
        max-width:436px;
        margin-bottom:10px;
    }

    .darkBand div, .orangeBand div {
        padding: 2% 4%;   
        box-sizing:border-box;
    }

    .darkBand a, .orangeBand a {
        color:#fff;
        font-size:1.2em;
        font-weight:700;
        text-transform:uppercase;
        display:block;
    }
    .orangeBand a {
        color:#FF600A;
    }



#EVChargers{
    text-align: center;
    margin: 1%;   
    box-sizing:border-box;
    background:url(/Images/landing_page_resources/contractors/ev-bg.jpg) right -50px no-repeat;
    padding:40% 4% 4%;
}
#EVChargers h2 {
    line-height:1;
    font-weight:800;
}
#EVChargers h2 .subheading {
    display:block;
    font-weight:400;
    font-size:0.8em;
    padding-top:0.3em;
    padding-bottom:1.5em;
}
#EVChargers .copy{
    background:#fff;
    padding:4% 2%;
}
    #EVChargers a {
        color: #80b8be;
        font-weight:700;
        margin-top:5%;
        display:block;
        text-transform:uppercase;
    }


#CategorySpotlight {
    padding:0.5% 1.5% 0;
}
#CategorySpotlight .spotlightPanel {
    text-align:right;
    position:relative;
    padding-top:50px;
    padding-bottom:60px;
    margin-bottom:1.5%;
    box-sizing:border-box;
    border:solid #000 6px;
    overflow:hidden;
}

    #CategorySpotlight .spotlightPanel img.product{
        float:right;
    }

    #CategorySpotlight h2 {
        position: absolute;
        top: 0;
        text-align: left;
        padding: 1% 2%;
        font-weight: 800;
        line-height: 1.1;
    }
    #CategorySpotlight h2 em {
        font-weight: 300;
    }
    #CategorySpotlight h2 .logos {
        display:block;
        padding-top:0.2em;
    }

        #CategorySpotlight h2 .logos img {
            max-height:50px;
        }

        #CategorySpotlight .shopLink {
            background: #80b8be;
            color: #fff;
            border-radius: 0.5em;
            padding: 0.5em 2.5em 0.5em;
            position: absolute;
            bottom: 0;
            left: 0;
            margin-bottom: 1em;
            margin-left: 1em;
            text-transform: uppercase;
            font-weight: 700;
            border:solid #fff 3px;
            font-size:0.8em;
        }

    #CallUs{
        background:url(/Images/landing_page_resources/contractors/let-us-help-bg.jpg) no-repeat center;
        text-align:center;
        margin-top:2%;
    }

    #CallUs img.header{
        width:100%;
        display:block;
    }

        #CallUs .blurb {
            background: #80b8be;
            color: #fff;
            padding: 4% 2%;
        }

        #CallUs .headline {
            font-size:2em;
            margin-bottom:4%;
        }

        #CallUs .blurb p {
        }

        #CallUs .phoneLink{
            color:#fff;
            font-size:32px;
            padding-top:2em;
            display:block;
        }

            #CallUs .phoneLink img{
                height:32px;
                vertical-align:middle;
            }



@media screen and (min-width:450px) {
                #ContentInnerPanel {
                    font-size: 20px;
                }


        #Hero .line::before {
            height: 50px;
            top: 4px;
        }

        #Hero .line::after {
            height: 50px;
            left: -4px;
        }

    #Rebates .headline {
        padding: 10px 12px;
    }

}
@media screen and (max-width:960px){
    .subBanner {
        padding-bottom:2px;
        margin-top:30px;
    }
        .subBanner .title {
        font-size: 42px;
        padding-top: 34px;
        padding-bottom: 42px;
    }
    .subBanner.sticky .title {
    }

    .subBanner img.catImage {
        width: 150px;
        height: 150px;
        margin-top: -11px;
        border-width:3px;
    }
}

@media screen and (max-width:720px){
    .subBanner {
        padding-bottom: 0;
        padding-top: 10px;
        margin-top: 0;
    }

        .subBanner img.catImage {
            display: block;
            height: 100px;
            width: 100px;
            margin-top: -2px;
        }
        .subBanner .title {
        font-size: 32px;
        padding-top: 20px;
        padding-bottom: 20px;
    }

}

@media screen and (max-width:600px) {
    .subBanner {
        margin-right: 0;
    }

        .subBanner .title {
            padding-top: 60px;
            text-align: center;
            font-size: 24px;
            padding-bottom: 8px;
            padding-left: 0;
        }

        .subBanner img.catImage {
            position: relative;
            display: block;
            margin: auto;
            right: auto;
            top: auto;
            margin-bottom: -60px;
        }

        .subBanner.sticky .title {
            margin-right: 0;
            padding-left: 0;
            height:auto;
        }

        .subBanner.sticky img.catImage {
            display: none;
        }


}

@media screen and (min-width:560px){

}

@media screen and (min-width:600px){

    #PunchList{
        padding:0 10px 0 15px;
    }
    #PunchList .featured {
        margin-bottom:1%;
        margin-top:0;
    }

    #PunchList .blurb {
        position: relative;
        padding:2% 7%;
        font-size:18px;
    }
    .featured .blurb::before {
        margin: auto auto auto -15px;
        width:40px;
        height:40px;
    }

        #PunchList .blurb .points{
            font-size:0.8em;
        }

        #PunchList .video {
            padding-top: 0;
            flex-basis: 45%;
        }

    #CategorySpotlight .spotlightPanel{
        padding-top:20px;
        padding-bottom:0;
    }


    #CallUs img.header {
        display: none;
    }

    #CallUs {
        padding:3%;
    }

    #CallUs .blurb{
       background:transparent url(/Images/resources/semitransdark.png);
       padding:6%;
    }
}

@media screen and (min-width:720px) {
    #Rebates {

    }

        #Rebates .headline {
        }

    #LinkToRebates {
    }

    #LineItemsHeading{
        padding-top:30px;
        padding-bottom:6px;
    }

    #PunchList .blurb{
        font-size:20px;
    }

    #EVChargers{
        padding-top:20%;
    }

    #CategorySpotlight .spotlightPanel{
        padding-top:0;
    }

}

@media screen and (min-width:960px) {
    #ContentInnerPanel {
        font-size: 24px;
    }


    .darkBand, .orangeBand{
        display:flex;
        font-size:24px;
    }
    .darkBand div.blurb, .orangeBand div.blurb {
        flex-basis:50%;
    }
    #EVChargers {
        padding-top:4%;
        padding-right:550px;
        background-position:right -20px;
    }

    #EVChargers .copy {
        padding:8% 4%;
    }
    #EVChargers a {
        margin-top:15%;
    }
    #CategorySpotlight {
        font-size:30px;
    }
    #CategorySpotlight .spotlightPanel{
        border-width:11px;
    }


    #Rebates {
        font-size: 28px;
    }
    #Rebates img {
        float: right;
        height:200px;
    }
    #Rebates .rebateContent{
        padding-top:40px;
    }
    #LinkToRebates{
        margin-top:1em;
        font-size:0.9em;
    }
    #PunchList{
        padding-left:40px;
        padding-right:30px;
    }

    #PunchList .featured{
        border-width:11px;
    }


        #PunchList .blurb {
            font-size: 24px;
        }
    .featured .blurb{
        padding-left:50px;
    }
    .featured .blurb::before {
        border-width:11px;
        margin-left:-30px;
        width:70px;
        height:70px;
    }

}

@media screen and (min-width:1280px) {
    #ContentInnerPanel {
        font-size: 26px;
    }
    #Hero {
        padding-top: 300px;
        background-position: top right;
        font-size:2em;
    }

    #Rebates {
        font-size:36px;
    }
    #Rebates img {
        height:auto;
    }
    #Rebates .rebateContent {
        padding-top: 60px;
    }

    #PunchList .blurb{
        font-size:30px;
    }
    .darkBand, .orangeBand {
        margin:0 0 1% 0;
    }
    .darkBand div.blurb, .orangeBand div.blurb {
        flex-basis: 70%;
    }
    #EVChargers {
        margin:1% 0;
    }
    #CategorySpotlight {
        font-size: 35px;
    }

    #CategorySpotlight h2 .logos img {
        max-height: initial;
    }
#CallUs .blurb{
        font-size:36px;
        padding:9% 6%;
}
    #CallUs .blurb .headline{
        margin-bottom:0.5em;
    }

    #CallUs .phoneLink {
        font-size: inherit;
    }

        #CallUs .phoneLink img {
            height: auto;
            vertical-align: middle;
        }
}