.banner-overlay {
background:rgba(0, 0, 0, 0.4); position:absolute; top:0; width:100%; height:100%; display:table
}

/* Banners */

#banner {
width:100%; background-image:url(../images/banner.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

/* Building Maretials */
/* 20210302 Changed all banners to skinny banner per KC */
#banner-building-materials {
width:100%; background-image:url(../images/banner-building-materials.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-lumber-building-materials {
width:100%; background-image:url("../images/banner-lumber-building-materials.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-drywall {
width:100%; background-image:url("../images/banner-drywall.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-roofing {
width:100%; background-image:url("../images/banner-roofing.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-siding {
width:100%; background-image:url("../images/banner-siding.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-trusses {
width:100%; background-image:url("../images/banner-trusses.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

/* Hardware */

#banner-hardware {
width:100%; background-image:url("../images/banner-hardware.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-electrical {
width:100%; background-image:url("../images/banner-electrical.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-fasteners {
width:100%; background-image:url("../images/banner-fasteners.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-connections {
width:100%; background-image:url("../images/banner-connections.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-general-hardware {
width:100%; background-image:url("../images/banner-general-hardware.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-home-decor {
width:100%; background-image:url("../images/banner-home-decor.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-hvac {
width:100%; background-image:url("../images/banner-hvac.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-plumbing {
width:100%; background-image:url("../images/banner-plumbing.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-tools {
width:100%; background-image:url(../images/banner-tools.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

/* Kitchen + Batch */

#banner-kitchen-and-batch {
width:100%; background-image:url(../images/banner-kitchen-and-batch.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:200px; padding-bottom:200px
}

#banner-design-services {
width:100%; background-image:url(../images/banner-design-services.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:200px; padding-bottom:200px
}

#banner-meet-designer {
width:100%; background-image:url(../images/banner-meet-designer.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:200px; padding-bottom:200px
}

#banner-cabinets-and-hardware {
width:100%; background-image:url(../images/banner-cabinets-and-hardware.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-contertop-and-tile {
width:100%; background-image:url(../images/banner-contertop-and-tile.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-cabinets-by-room {
width:100%; background-image:url(../images/banner-cabinets-by-room.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-wall-cladding {
width:100%; background-image:url(../images/banner-wall-cladding.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-flooring-and-tile {
width:100%; background-image:url(../images/banner-flooring-and-tile.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

/* Windows and Doors */

#banner-windows-and-doors {
width:100%; background-image:url(../images/banner-windows-and-doors.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-windows {
width:100%; background-image:url(../images/banner-windows.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-doors {
width:100%; background-image:url(../images/banner-doors.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-moulding-and-trim {
width:100%; background-image:url(../images/banner-moulding-and-trim.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

/* Decking and Fencing */

#banner-decking-and-fencing {
width:100%; background-image:url(../images/banner-decking-and-fencing.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-deck-design-and-railing {
width:100%; background-image:url(../images/banner-deck-design-railing.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-fencing {
width:100%; background-image:url(../images/banner-fencing.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

/* Paint */

#banner-paint1 {
width:100%; background-image:url(../images/banner-paint1.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-paint {
width:100%; background-image:url(../images/banner-paint.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:200px; padding-bottom:200px
}

#banner-paint-supplies {
width:100%; background-image:url(../images/banner-paint-supplies.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

#banner-stain {
width:100%; background-image:url(../images/banner-stain.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; position:relative; padding-top:150px; padding-bottom:50px
}

/* Locations/Footer */

#banner-store-info {
width:100%; background-image:url("../images/banner-store-info.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-values {
width:100%; background-image:url("../images/banner-values.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-carrer {
width:100%; background-image:url("../images/banner-carrer.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-our-story {
width:100%; background-image:url("../images/banner-our-story.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-policies {
width:100%; background-image:url("../images/banner-policies.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-contact {
width:100%; background-image:url("../images/banner-contact.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-service {
width:100%; background-image:url("../images/banner-service.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-brand {
width:100%; background-image:url("../images/banner-brand.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-credit {
width:100%; background-image:url("../images/banner-credit.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-findapro {
width:100%; background-image:url(../images/banner-findapro.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; 
position:relative; padding-top:150px; padding-bottom:50px

}

#banner-curbside-pickup {
width:100%; background-image:url(../images/banner-curbside-pickup.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; 
position:relative; padding-top:150px; padding-bottom:50px
}

/* Email Landing Pages */
#banner-makita {
width:100%; background-image:url(../images/banner-makita.jpg); background-repeat:no-repeat; background-position: center; background-size:cover; 
position:relative; padding-top:150px; padding-bottom:50px
}

.page-title {
width:100%; font-family:'Open Sans', sans-serif
}

.page-title h1 {
font-size:52px; font-weight:500; line-height:60px; color:#ffffff; text-shadow: 2px 2px 3px #555555; text-align:center
}

.page-title h2 {
font-size:28px; font-weight:500; line-height:40px; color:#ffffff; text-shadow: 2px 2px 3px #555555; text-align:center; letter-spacing:2px;
text-transform:uppercase; position:relative; top:70px
}

/* Small Banners */

#banner-diy {
width:100%; background-image:url(../images/banner-diy.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-events {
width:100%; background-image:url(../images/banner-events.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

#banner-events-single {
width:100%; background-image:url(../images/banner-events.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:120px; padding-bottom:30px
}

#banner-small {
width:100%; background-image:url(../images/banner.jpg); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px; font-family:'Open Sans', sans-serif
}

#banner-making-a-list {
width:100%; background-image:url("../images/banner-making-a-list.jpg"); background-repeat:no-repeat; background-position: center; background-size:cover;
position:relative; padding-top:150px; padding-bottom:50px
}

.small-banner-title-page {
width:100%; max-width:1200px; padding-left:20px; padding-right:20px; margin:auto
}

.small-banner-title-page h1 {
font-size:40px; font-weight:500; line-height:50px; color:#ffffff; text-shadow: 2px 2px 3px #555555; text-align:left
}

.small-banner-title-page h3, .small-banner-title-page a {
font-size:20px; font-weight:500; line-height:30px; color:#ffffff; text-align:left; text-decoration:none
}

.small-banner-title-page a:hover {
color:#f1f1f1; text-decoration:none
}

/* No Banners */

#no-banner {
width:100%; background:#ffffff; position:relative; padding-top:50px; padding-bottom:50px; border-bottom:solid 3px #e2e2e2;
font-family:'Open Sans', sans-serif
}

.no-banner-title-page {
width:100%; max-width:1200px; padding-left:20px; padding-right:20px; margin:auto
}

.no-banner-title-page h1 {
font-size:50px; font-weight:500; line-height:60px; color:#000000; text-align:left
}

.small-banner-title-page {
width:100%; max-width:1200px; padding-left:20px; padding-right:20px; margin:auto; font-family:'Open Sans', sans-serif
}

.small-banner-title-page h1 {
font-size:40px; font-weight:500; line-height:50px; color:#ffffff; text-shadow: 2px 2px 3px #555555; text-align:center
}

.small-banner-title-page h3, .small-banner-title-page a {
font-size:20px; font-weight:500; line-height:30px; color:#ffffff; text-align:left; text-decoration:none
}

.small-banner-title-page a:hover {
color:#f1f1f1; text-decoration:none
}

/* Banner Single Blog/Event Post */

#blog-banner {
width:100%; position:relative; background-image:url(../images/wood-background.jpg); background-position:top center; background-size:cover;
font-family:'Open Sans', sans-serif
}

.blog-banner-body {
width:100%; max-width:1160px; margin:auto
}

#blog-banner-left {
width:60%; height:250px; float:left; padding-left:10px; padding-right:10px; display:table
}

#blog-banner-left h1 {
font-size:40px; font-weight:500; line-height:50px; color:#ffffff; text-shadow: 2px 2px 3px #555555; text-align:left
}

#blog-banner-left span {
display:table-cell; vertical-align:middle
}

#blog-banner-right {
width:40%; height:250px; float:right; 
}

#blog-banner-right img {
height:250px; object-fit:cover
}

/* Mobile Banners */

#mobile-banner {
width:100%; background:#f8f8f8; padding-bottom:20px; font-family:'Open Sans', sans-serif
}

#mobile-banner img {
width:100%; height:auto
}

#mobile-banner h1 {
font-size:30px; font-weight:500; line-height:40px; color:#000000; text-align:center; padding-top:20px
}

#mobile-banner h2 {
font-size:18px; font-weight:500; line-height:22px; color:#000000; text-align:center; text-transform:uppercase
}

/* Breadcrumb */

#breadcrumb {
width:100%; background:#ffffff; font-size:14px; line-height:25px; color:#4a4a4a; text-align:left; border-bottom:solid 3px #e2e2e2;
font-family:'Open Sans', sans-serif
}

.breadcrumb-body {
width:100%; max-width:1200px; margin:auto; padding-left:20px; padding-right:20px; padding-top:20px; padding-bottom:20px
}

#breadcrumb a {
color:#008080; text-decoration:none; font-size:14px; line-height:25px
}

#breadcrumb span.breadcrumbs__current {
font-size:14px; line-height:25px
}