@charset "utf-8";
/* CSS Document */

.divcontainer {position:relative; width:100%}
.topbannerli, .galrankli, .logosmaxli, .navbarli, .logoli {margin:0; padding:0}
.topbannerli > li, .galrankli > li {display:inline-block; vertical-align:bottom}
.navbarli > li {display:inline-block; vertical-align:middle; text-align:center}
.logoimg img {width:300px; margin:0 auto}
.callbtn {display:inline-block; width:auto; background-color:#000000; color:var(--orange); font-weight:bold;}
.galrankli {position:relative;display:block; width:100%; height:100% !important;}
.galrankli > li {position:relative; width:50%; height:100%;}
.logosmaxli > li {display:inline-block; vertical-align:middle;}
.logoli {display:block; width:100%; list-style-type:none}
.logoli > li:last-child img {margin-bottom:0}
.logoli img {width:100%; margin-bottom:10px; margin-right:0}
.maxim {font-size:2.5rem; line-height:120%; font-weight:bold;}

.roofing {box-shadow: 8px 8px 15px rgba(0, 0, 0, 0.5); background:transparent;border-radius:0 15px 15px 0;}
.roofing .slick-slide, .roofing .slide {margin:0; padding:0}
.roofing .prev-arrow {position: absolute; top: 50%; left: 10px; width: 30px; height: 30px; border:none; background: transparent; cursor: pointer; z-index:99}
.roofing .next-arrow {position: absolute; top: 50%; right: 10px; width: 30px; height: 30px; border:none; background: transparent; cursor: pointer;}

.divgooglerank {position:relative; display:flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width:100%; 
height:55%; /* Height equal to galrankli linear-gradient */ 
flex-flow:column; color:#ffffff;}
.teamimg {bottom:0; left:0; display:flex; align-items: flex-end; justify-content: center;}
.googlestar {display:flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;flex-flow:row;}
.divstar5 {margin:0 auto; background-color:#262626;}
.divmap {background-color:#181818;}
.divfloorplanzoom img, .colorli > li {width:100%}
.divcontainer::after {content: ""; width: 34%; height: 200px; background: url(../images/CR3b.png); display: block; background-size: cover; background-position: bottom; position: absolute; bottom: -220px;   right: 20%;  z-index: -1;}
.eq2li {width:96%; margin:0 auto}
.eq2li > li, .colorli > li {display:inline-block; vertical-align:top; color:#fff}
.eq2li > li:first-child {width:100%; margin-right:0; margin-bottom:30px}
.eq2li > li:last-child {width:100%;}
.colorli > li:first-child {width:6%; margin-right:2%;}
.colorli > li:last-child {width:92%;}
.mapholder {padding:20px 0}
.divform {background-color:#000; padding:30px; text-align:center;}
.formtitle {font-size:1.4rem; margin-bottom:30px; color:#fff}
.hs-input:not([type=file]) {background-color:#262626 !important; margin-bottom:10px !important}
#hbspt-form-669296b5-e376-4851-b085-b1a6a070839d input, .hs-form input, .hs-form textarea, .hs-input {background-color:#262626 !important; margin-bottom:10px !important}
.formli {width:90%; margin:0 auto}
.formli > li {display:inline-block; vertical-align:top; width:100%; color:#aaa; text-align:left}
.frminputwidth {display:inline-block; vertical-align:middle; width:100%; border:none; background-color:#262626; color:#fff; font-size:1.1rem; line-height:18pt; padding:12px; font-family: 'Inter', Arial, Helvetica, sans-serif; margin-bottom:12px; border-radius:8px}		
.sendbut {background-color:#fc7f2f; width:100%; margin:0 auto; padding:6px 12px; border:none; border-radius:8px; color:#fff; font-size:1.2rem; cursor:pointer; font-family: 'Inter', Arial, Helvetica, sans-serif; text-align:center;}
input[type=text]:focus, input[type=tel]:focus, input[type=email]:focus {border:none;outline: none;}
.testi-text img {position:relative !important; width:100% !important; margin-left:37px}

.divvideo { margin:0 auto; margin-top:60px}
.divvideo h4, .divvideo h5 {text-align:center; font-weight: 800; font-size: 1.2rem;}
.video-container {position: relative; width: 100%; padding-top: 56.25%; /* 16:9 aspect ratio */ overflow: hidden;}
.video-container iframe {position: absolute;top: 0;left: 0;	width: 100%;height: 100%;}
.clearb {clear:both}


.colorng {color:#fc7f2f;}
.colwhite {color:#fff;}
.height100 {height:100%}
.alignc {text-align:center}
.mainlinks:link, .mainlinks:visited {color:#fc7f2f; text-decoration:none}
.mainlinks:hover, .mainlinks:active {color:#fff; text-decoration:none}

.topbannerli, .navbarli, .galrankli, .logosmaxli, .eq2li, .colorli, .formli {font-size:0; padding-left:0}
.topbannerli > li, .galrankli > li, .logosmaxli > li, .eq2li > li, .colorli > li, .formli > li  {font-size:1rem}



@media screen and (min-width: 300px) {
.navbarli > li {width:100%; text-align:left}
.galrankli > li {position:relative; width:100%; height:100%;}
.roofing img {border-radius:0;}
.teamimg {position:relative; width:100%; height:45%; /* Height galrankli linear-gradient */  }
.galrankli {background: #fff}
.divgooglerank {margin-bottom:30px}
.logosmaxli > li {color:#000}
.divstar4 {color:#000}
.navbarli > li:first-child {width:42%; margin-bottom:0px}
.navbarli > li:last-child {width:58%;}
.topbannerli > li:first-child {width:100%; margin-bottom:30px}
.topbannerli > li:last-child {width:100%; margin:0 auto}
.navbarli {padding:20px 10px;}
.logoimg img {width:120px;}
.callbtn {padding:4px 10px; border-radius:6px; font-size:0.9rem; text-align:center}
.teamimg img {width:80%; margin:0 auto; height:auto; margin-bottom:30px}
.divmap {border-radius:0px; width:100%; margin:0 auto; padding:30px 10px}
.divmax {padding:20px}
.logosmaxli > li:first-child {width:12%; margin-right:5%; margin-bottom:0}
.logosmaxli > li:last-child {width:83%;}
.maxim {font-size:1.2rem; margin-bottom:20px}
.googlestar {margin-bottom:30px}
.googlelogo img {width:60px; margin-right:20px}
.divstar4 img {width:140px;}
.font1rem {font-size:0.7rem}
.divstar5 {width:85%; padding:10px; border-radius:10px}
.divstar5 img {width:100px;}
.topbannerli {margin-bottom:40px}
.eq2li > li:first-child {width:100%; margin-right:0; margin-bottom:30px}
.eq2li > li:last-child {width:100%;}
.eq2li {width:100%;}
.colorli > li {font-size:0.8rem}
.divform {border-radius:6px; width:100%; display:block}
.formli {width:98%; margin:0 auto}
.formtitle {font-size:1.1rem; margin-bottom:20px;}
.frminputwidth {font-size:0.8rem; line-height:normal; padding:12px 8px; margin-bottom:22px; border-radius:6px}
.formli > li label {font-size:0.8rem; margin-bottom:0px; display:none}
.sendbut {padding:6px 12px; border-radius:8px; font-size:1.0rem; margin-top:10px}
::placeholder {font-size: 0.9rem;}
.divvideo {width:90%; margin:0 auto; margin-top:30px}
	
}

@media screen and (min-width: 480px) {
.logoimg img {width:160px;}
.maxim {font-size:1.4rem; margin-bottom:20px}
.callbtn {font-size:1.0rem;}
.divform {border-radius:6px; width:80%; margin:0 auto; display:block}
	
}

@media screen and (min-width: 768px) {
.navbarli > li:first-child {width:50%; margin-bottom:0px}
.navbarli > li:last-child {width:50%;}
.galrankli > li {position:relative; width:50%; height:100%;}
.roofing img {border-radius:0 15px 15px 0;}
.navbarli {padding:30px;}
.logoimg img {width:240px;}
.callbtn {padding:6px 20px; border-radius:10px; font-size:1.3rem}
.teamimg {position:absolute; width:100%; height:45%; /* Height galrankli linear-gradient */  }
.teamimg img {; margin-bottom:0px}
.galrankli {background: linear-gradient(to bottom, #000000 55%, #ffffff 40%);}
.divmap {border-radius:20px; width:94%; margin:0 auto; padding:30px}
.divgooglerank {margin-bottom:0px}
.logosmaxli > li {color:#fff}
.divstar4 {color:#fff}
.divform {border-radius:10px; width:60%; margin:0 auto}
.divvideo {width:75%; margin:0 auto;}
	
}

@media screen and (min-width: 1024px) {
.topbannerli > li:first-child {width:72%; margin-bottom:0px}
.topbannerli > li:last-child {width:25%; margin-right:3%}
.eq2li > li:first-child {width:46%; margin-right:8%; margin-bottom:0}
.eq2li > li:last-child {width:46%;}
.eq2li {width:98%;}
.callbtn {padding:6px 20px; border-radius:10px; font-size:1.2rem}
.divform {width:100%; border-radius:10px; padding:25px;}
.frminputwidth {font-size:0.8rem; line-height:normal; padding:8px 8px; margin-bottom:18px; border-radius:6px}
.divvideo {width:60%; margin:0 auto}
	
}

@media screen and (min-width: 1280px) {
.topbannerli > li, .galrankli > li, .logosmaxli > li, .eq2li > li, .colorli > li {font-size:1.0rem}
.topbannerli > li:first-child {width:75%}
.topbannerli > li:last-child {width:22%; margin-right:3%}
.navbarli {padding:40px;}
.navbarli > li {text-align:left}
.logoimg img {width:290px;}
.callbtn {padding:6px 30px; border-radius:10px; font-size:1.5rem}
.divmap {border-radius:20px; width:94%; margin:0 auto; padding:40px}
.maxim {font-size:1.9rem; margin-bottom:20px}
.topbannerli {margin-bottom:60px}
.colorli > li:first-child {width:15%; margin-right:3%;}
.colorli > li:last-child {width:82%;}
.eq2li {width:90%;}
.divform {border-radius:10px; padding:25px;}
.frminputwidth {font-size:0.9rem; line-height:normal; padding:12px 8px; margin-bottom:26px; border-radius:6px}
.formli > li label {font-size:0.9rem; margin-bottom:0px; display:none}
.divvideo {width:50%; margin:0 auto;}
	
}

@media screen and (min-width: 1366px) {
.topbannerli > li, .galrankli > li, .logosmaxli > li, .eq2li > li, .colorli > li {font-size:1.1rem}
.frminputwidth {margin-bottom:32px;}
}

@media screen and (min-width: 1440px) {
.callbtn {border-radius:15px;}
.divform {border-radius:15px; padding:25px;}
.formli {width:90%; margin:0 auto}
.formtitle {font-size:1.4rem; margin-bottom:20px;}
.frminputwidth {font-size:0.9rem; line-height:normal; padding:8px; margin-bottom:18px; border-radius:8px}
.formli > li label {font-size:0.9rem; margin-bottom:3px; display:block}
.sendbut {padding:6px 12px; border-radius:8px; font-size:1.0rem; margin-top:10px}
::placeholder {font-size:0}
	
}

@media screen and (min-width: 1600px) {
.topbannerli > li:first-child {width:70%}
.topbannerli > li:last-child {width:27%; margin-right:3%}
.navbarli {padding:50px}
.logoimg img {width:300px;}
.callbtn {padding:6px 40px; font-size:1.6rem}
.logoli img {margin-bottom:15px;}
.maxim {font-size:2.0rem;}
.divmax {padding:30px}
.font1rem {font-size:0.8rem}
.divstar5 {width:80%; padding:20px;}
.divstar5 img {width:90px;}
.topbannerli {margin-bottom:80px}
.eq2li {width:75%;}
.divform {padding:30px;}
.formtitle {font-size:1.4rem; margin-bottom:20px;}
.frminputwidth {font-size:1rem; line-height:normal; padding:8px; margin-bottom:24px; border-radius:8px}
.formli > li label {font-size:1rem; margin-bottom:5px}
.sendbut {padding:8px 12px; border-radius:8px; font-size:1.1rem;}
.divvideo {width:45%; margin:0 auto;}
	
}

@media screen and (min-width: 1900px) {
.topbannerli > li, .galrankli > li, .logosmaxli > li, .eq2li > li, .colorli > li {font-size:1.2rem}
.navbarli {padding:60px}
.logosmaxli > li:first-child {width:15%; margin-right:5%; margin-bottom:0}
.logosmaxli > li:last-child {width:80%;}
.logoli img {margin-bottom:10px;}
.maxim {font-size:2.5rem; margin-bottom:30px}
.divmax {padding:40px}
.googlelogo img {width:80px;}
.divstar4 img {width:160px;}
.divstar5 {width:75%; padding:20px; border-radius:10px}
.divstar5 img {width:100px;}
.eq2li {width:70%;}
.divform {padding:30px;}
.formtitle {font-size:1.4rem; margin-bottom:30px;}
.frminputwidth {font-size:1.1rem; line-height:18pt; padding:12px; margin-bottom:34px; border-radius:8px}
.formli > li label {font-size:1.1rem; margin-bottom:5px}
.sendbut {font-size:1.2rem;}
	
	
}