:root{--main-color:#215EB8;--white-text:#f2f2f2}.preload{background-image:url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlineasii_charcoal_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_appalachian_sky_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_barkwood_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_birch_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_biscayne_blue_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_cedarfalls_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_charcoal_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_combo_golden_amber.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_copper_canyon_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_fox_hollow_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_golden_harvest_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_hickory_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_hunter_green_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_missionbrown_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_nantucket_morning_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_oyster_gray_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_patriot_red_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_pewter_gray_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_shakewood_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_slate_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_sunset_brick_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_weatheredwood_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_white_combo.jpg'),url('/imageserver/Reusable/GAF/gaf23/gaf23-shingles/timberlinehdz_williamsburg_slate_combo.jpg');height:0;width:0}.maincontent{max-width:100%;padding:0;margin:0}html,body{scroll-behavior:smooth;font-family:"Poppins",sans-serif;font-size:18px}.reusable{padding:0 3%}.divider-line{height:5px;width:80%;margin:30px 0;background-color:#D71921;clip-path:polygon(15% 0%,100% 0%,85% 100%,0% 100%)}.my-hr{border:0;height:1px;background-image:-webkit-linear-gradient(left,#f0f0f0,#8c8b8b,#f0f0f0);background-image:-moz-linear-gradient(left,#f0f0f0,#8c8b8b,#f0f0f0);background-image:-ms-linear-gradient(left,#f0f0f0,#8c8b8b,#f0f0f0);background-image:-o-linear-gradient(left,#f0f0f0,#8c8b8b,#f0f0f0);max-width:70%;margin:2% auto;}.reusable h1{font-weight:700}.reusable h2{font-weight:200}.reusable h3{padding:0;margin:0}.features{padding-left:3%}p{line-height:1.6em}.reusable .row{margin:0!important;padding:0!important}.reusable img{width:100%}.color-item h2{margin-top:5px!important}.my-grid{margin-top:50px;display:grid;grid-template-columns:60% 40%}.grid-content{grid-column:2/3;grid-row:1/2}.grid-image{grid-column:1/2}#shingle{max-width:1000px}#icons{display:flex;flex-direction:column;justify-content:space-evenly}.icon-group{display:flex;flex-direction:row;align-items:center;margin-block:10px}.icon-image-container{margin-right:20px}.icon-image{width:40px!important;}.icon-content p{margin:0}.warranty-group{display:flex;flex-direction:row;justify-content:space-evenly;flex-wrap:wrap}.warranty-box{max-width:400px;min-width:300px;opacity:0}.warranty-box img{max-width:350px}#warranty_header{opacity:0}.my-container{padding:2% 2% 0;margin:0 auto}.my-header{text-align:center}.my-hr{max-width:600px}.mt{margin-top:15px}.color-picker{display:grid;grid-template-columns:repeat(2,50%);gap:1em;justify-content:center;margin:0 auto;padding-inline:1em}#color-picker-house{display:grid;grid-row:1/2;grid-column:1/2}#house{grid-row:1/2;grid-column:1/2;z-index:10;align-self:flex-start}#shingle{justify-self:flex-end}.box{background-color:red;height:100px;width:100px;margin-top:-120px}.color-group{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;max-width:1500px;margin:20px auto}.color-box{display:inline-block;max-width:300px;cursor:pointer}.shingle-swatch:hover{filter:brightness(1.75);transition:.3s}.shingle-swatch{transition:.3s;max-width:150px}.color-item{margin:15px;opacity:0}.color-item h4{margin-top:5px}#color-name{text-align:center}.color-picker-shingle{text-align:center;width:100%;grid-row:1/2;grid-column:2/3;display:flex;flex-direction:column;justify-content:center}#panel-desat{align-self:flex-start;grid-row:1/2;grid-column:1/2}#panel-overlay{align-self:flex-start;width:100%;height:100%;grid-row:1/2;grid-column:1/2;mix-blend-mode:overlay}.features-container{margin:50px 0 20px;padding:0 5%}.features-header{padding-block:10px;text-align:center;background-color:var(--main-color);color:var(--white-text)}.features-body{max-width:1400px}.features-body-header{border-bottom:1px solid #000;max-width:75%;margin-block:20px}.features-list-title{font-size:1.3em;font-weight:600;margin-right:5px}.features-image{-webkit-clip-path:polygon(25% 0%,100% 0%,75% 100%,0% 100%);clip-path:polygon(25% 0%,100% 0%,75% 100%,0% 100%)}.download-icon{max-width:15px;margin-left:3px}.docs{display:block;font-size:1.2em;margin-block:5px}.white-space{white-space:nowrap}@media screen and (max-width:1200px){#hero-text{display:none}#hero-logo{max-width:200px}.my-grid{display:block}.features{margin:0 auto}}@media screen and (max-width:992px){.color-picker{display:block}#color-picker-house{margin-bottom:10px}.features{text-align:center}.features-body-header{margin:20px auto}.icon-group{flex-direction:column}}@media screen and (max-width:700px){.color-item{text-align:center}.my-header{text-align:center!important}.divider-line{margin:30px auto}}@media screen and (max-width:600px){.features-container{margin:15px 0 20px}#hero-container{align-items:flex-end;justify-content:center;height:clamp(200px,25vw,600px)}.main-image{min-width:1px}.color-item{margin:5px}.warranty-box{min-width:200px}.icon-image-container{margin-right:0}}