body,html{box-sizing:border-box;margin:0;padding:0;font-size:18px;font-family:"Poppins",sans-serif}.maincontent{max-width:100%;padding:0;margin:0}.maincontent_wrapper{padding-top:0}img{width:100%}.bold{font-weight:900}.ital{font-style:italic}.text-center{text-align:center}.highlight{color:#1439a2;text-transform:uppercase;font-style:italic}.colorBrown{color:#a37a14}.colorBlue{color:#1439a2}.gradient-divider{height:1px;z-index:5;background:#000;margin:100px auto;position:relative;max-width:50%;background:-webkit-linear-gradient(left,#fff 0%,#323232 50%,#fff 100%)}.cta-wrapper{cursor:pointer;z-index:5}.cta{display:block;padding:5px 8px;background-color:#fff}a:hover{cursor:pointer}.border-gradient{border:2px solid;border-image-slice:1;border-width:2px}.border-gradient-color{border-image-source:linear-gradient(to bottom right,#1439a2,#a37a14);transition:.3s}.cta:hover{text-decoration:none;filter:drop-shadow(2px 2px 2px rgba(0,0,0,.3))}.border-gradient:hover{border:2px solid;border-image-slice:1;border-width:2px}.border-gradient-color:hover{border-image-source:linear-gradient(to top left,#1439a2,#a37a14);transition:.3s}.header-title{margin:0 auto;position:relative;max-width:80%;display:inline-block}.header-title::before,.header-title::after{content:"";position:absolute;background-color:#a37a14;width:10%;height:2px;z-index:3}.header-title::before{top:50%;left:-11%}.header-title::after{top:50%;right:-11%}.hero{height:40vw;max-height:400px;overflow:hidden;background-image:linear-gradient(rgba(0,0,0,0.3)0%, rgba(0,0,0,0.3)100%), url('/imageserver/Reusable/gutters21/aluminum-banner.jpg');background-repeat:no-repeat;background-size:cover;display:flex;align-items:center;justify-content:center}.hero-text-wrapper{color:#fff;text-align:center}.section1{padding:5% 3%;margin:0 auto}.my-wrapper{max-width:1400px;margin:0 auto;padding-inline:3%}.my-header{text-align:center;max-width:1200px;margin:2% auto}.grid2{display:grid;grid-template-columns:.5fr 1fr}svg{overflow:hidden}.light{color:#fff}.color-picker-section{display:grid;grid-template-columns:repeat(2,50%);padding:2%}#color-picker-grid{display:grid;max-width:600px;justify-content:center;align-items:center;margin:0 auto}#roof-desat{grid-column: 1/2;grid-row: 1/2}#roof-overlaySvg{grid-column: 1/2;grid-row: 1/2;background-color:#f2f3ec;height:100%;width:100%;mix-blend-mode:overlay;z-index:2}#house{grid-column: 1/2;grid-row: 1/2;z-index:3;filter:drop-shadow(3px 3px 3px rgba(0,0,0,.3))}.color-group{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly}.color-box{margin:.2em auto;height:85px;width:85px;border:1px solid #000}.color-item{position:relative;max-width:85px}.color-title{position:absolute;bottom:8px;left:5px;font-size:14px;margin:0 auto;opacity:0;transition:.3s}#selected-color{font-weight:400}.color-item:hover .color-title{opacity:1;transition:.3s}@media screen and (max-width:1200px){.color-picker-section{display:block}}.color{background:url(/imageserver/Reusable/gutters21/xaluminum-box-style.png.pagespeed.ic.Eb442FlnD-.png);background-position:center;background-size:30%;min-height:20vw;background-repeat:no-repeat}#selected-color-title{font-size:1.5rem}#selected-color{color:#a37a14;min-width:200px;display:inline-block;text-align:left}.color-overlay{height:100%;mix-blend-mode:overlay}.colors-list{padding:0 0 30px 10px;align-self:center;display:flex;flex-wrap:wrap;justify-content:flex-start}span.color-item{display:inline-block;height:90px;width:90px;border:1px solid #000}.color-item-group{display:flex;flex-direction:column;width:100px;margin:5px 0;text-align:center;justify-items:center;align-items:center}.color-title{font-size:.8rem}@media screen and (max-width:992px){.grid2{display:block;text-align:center}}