body{font-family: "Montserrat", sans-serif!important; font-size:14px; color:#000; line-height:28px; font-weight:400; overflow-x:hidden;}

html.lenis{height:auto}.lenis.lenis-smooth{scroll-behavior:auto}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}.lenis.lenis-scrolling iframe{pointer-events:none}

:root{
	--clr-lightblue: #03a8ea;
	--clr-dark:#000;
	--clr-white:#fff;
	--clr-blue:#2a3f90;
	--clr-darkblue:#091337;
	--clr-bg-light:#f4f7fa;	
	--clr-bg-sky:#cee8f3;
	--clr-bg-lightsky:#d8eafd;
   --animate-duration:2500ms;
    --animate-delay: 0.9s;
}


a{color:var(--clr-darkblue); text-decoration:none;}
a:hover{color:#000;}
a, img, .fixted-top, .parentbox a, .parentbox > *:hover h5, .topshape:before, .hovergallery img, .mailbox a, .mailbox i{-webkit-transition: all .2s linear; -moz-transition: all .2s linear; -ms-transition: all .2s linear; -o-transition: all .2s linear; transition: all .2s linear;}

h1{font-size:clamp(24px, 4.2vw, 48px);}
h2{font-size:clamp(20px, 3vw, 36px);}
h3{font-size:clamp(18px, 2vw, 30px);}
h4{font-size:clamp(16px, 2vw, 24px);}
h5{font-size:clamp(14px, 2vw, 18px);}
.bigtext{font-size:clamp(24px, 4.2vw, 70px);}
.mn-1{margin-bottom:-150px;}
.img-height, .img-height2{aspect-ratio:1/1; object-fit: cover; height:100%; width:100%;}
.img-height1{aspect-ratio:1/1.2; object-fit: cover; height:100%; width:100%;}
.img-height2{object-position: right;}
.img-height3{aspect-ratio:4/1.3; object-fit:cover;}

.text-info{color: var(--clr-lightblue)!important;}
.bg-blue{background: var(--clr-darkblue);}
.bg-sky{background: var(--clr-bg-sky);}
.bg-lightsky{background:var(--clr-bg-lightsky);}

section, .section {padding-bottom: 6vw;padding-top: 6vw;}
.linkblack .btn-link{color: var(--clr-dark)!important; font-weight:600;}


/*.page-home .fixted-top {background:none; position: fixed; }*/
.fixted-top{width:100%; position:sticky; top:0; z-index:999; background:var(--clr-white);}
.fixted-top a{margin:0 10px;}
/*.navbar{position:fixed; width:100%; z-index:9999; background:none;}*/
.shrink.fixted-top{background:var(--clr-white); border-bottom:1px solid #ccc;}
.logo img{max-width:130px;}
.shrink .logo img{max-width:70px;}

/*--------------- Btn Start --------------------*/

.btn{padding:12px 20px; font-size: 14px; font-weight:400; color: var(--clr-white); text-decoration:none; border-radius:5px;}
.btn:hover{color:#fff; background: var(--clr-blue); border-color: var(--clr-blue);}
.btn-link{color: var(--clr-white); padding:0; border:0;}
.btn-link:hover{color: var(--clr-lightblue); border:0; background: none;}
.btn-info{background-color: var(--clr-lightblue); border-color: var(--clr-lightblue);}
.btn-primary{background-color: var(--clr-blue); border-color: var(--clr-blue);}
.btn-primary:hover{color:#fff; background: var(--clr-lightblue); border-color: var(--clr-lightblue);}
.btn-lg{padding:12px 35px; font-size:16px;}
.btn-sm{padding:8px 20px; font-size:14px!important;}
.btn i{font-size:16px; vertical-align:middle; margin-right:14px; color: var(--clr-white);}

/*--------------- Btn End --------------------*/




/*--------------- Menu Start --------------------*/

.nav-link {color:var(--clr-dark);display: block;margin: 0 0 0 10px; font-size:16px;}
.navbar-nav .nav-link.active, .navbar-nav .nav-link:hover, .navbar-nav .nav-link.show {color: var(--clr-lightblue);}
.nav-link:focus, .nav-link:focus-visible{box-shadow: none;outline: none;}
.navbar-expand-lg .navbar-nav .dropdown-menu {position:absolute; top:40px; border:0; background:var(--clr-lightblue); border-radius:0 0 10px 10px; padding:0;}
.dropdown-item {padding: 5px 10px;font-size: 14px;font-weight: 600; color:var(--clr-white);}
.dropdown-menu li{border-bottom: 1px solid #9dc3f0;}
.dropdown-menu li:last-child{border-bottom:0;}
.dropdown-item:focus, .dropdown-item:hover, .dropdown-item.active, .dropdown-item:active{background:none!important;}
.dropdown-toggle::after{width: 7px;aspect-ratio: 1 / 1;border-style: solid !important;border-color: #000;border-width: 0px 0px 1px 1px ! important;transform: rotate(-45deg);
margin:0 0 0 5px;}

/*--------------- Menu End --------------------*/


/*--------------- Banner Start --------------------*/

.bannerslider{height:100vh; position:relative; background-size:cover;}
.bannerslider .container{position: relative;}
.bannerslider h1{font-size:clamp(28px, 3vw, 56px);}
.bannerslider .caption{position: absolute; top:230px; color: var(--clr-white);}
.midbanner{background:url("images/linedraw.jpg") no-repeat center; color: var(--clr-dark); position:relative;background-size:cover;}
.lastbanner{background:url("images/lastbanner.jpg") no-repeat center bottom; color: var(--clr-white); position:relative;background-size:cover;}
.innerbanner{background:url("images/innerbanner.jpg") no-repeat center center; color: var(--clr-white); position:relative;background-size:cover;}
.contractorbanner{background:url("images/contractorman.png") no-repeat center right;position:relative;background-size:cover;}
.inspectingbanner{background:url("images/bluebg.jpg") no-repeat center right;position:relative;background-size:cover;}
.gradiant{position:relative;} 
.roofing-solution-banner img{aspect-ratio: 3/1; object-fit: cover; width: 100%;}
.gradiant:before{position:absolute; content:''; inset:0; width:100%; height:100%; opacity:.9;background: rgb(3,168,234);
background: linear-gradient(35deg, rgba(3,168,234,1) 0%, rgba(12,103,165,1) 14%, rgba(22,32,91,1) 78%);}

/*--------------- Banner End --------------------*/


.videobox i {
    font-size: 50px;
	background: rgb(30,90,167);
    background: linear-gradient(180deg, rgba(30,90,167,1) 0%, rgba(1,166,232,1) 100%);
    color: var(--clr-white);
    border-radius: 100%;
    padding: 35px;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    transform: translate(0, -50%);
	border: 4px solid #fff;
}


.top-border{border-top:1px solid #cccccc54;}
.last-box a{color:var(--clr-lightblue);}
.last-box a:hover{color:var(--clr-dark);}

/*--------------- Grid Start --------------------*/

.parentbox {display: grid;grid-template-columns: repeat(3, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 30px;grid-row-gap: 30px;position:relative;overflow:hidden;}
.parentbox > *{position:relative; overflow:hidden; border-radius:10px; background:#9ea8cb;}
.parent1 { grid-area: 1 / 1 / 3 / 2; }
.parent2 { grid-area: 1 / 2 / 2 / 3; }
.parent3 { grid-area: 1 / 3 / 2 / 4; }
.parent4 { grid-area: 2 / 2 / 3 / 3; }
.parent5 { grid-area: 2 / 3 / 3 / 4; }
.parentbox img{height:100%; object-fit: cover; width:100%;}
.parentbox > *:hover img{opacity:.3;}
.parentbox > *:hover h5{opacity:0;}
.parentbox > *:hover a{bottom:0;}
.parentbox a{display:block; position:absolute; width:100%; bottom:-70px; background:rgba(9, 19, 55, .6); border-radius:0 0 5px 5px;}
.parentbox h5{font-weight:700; position: absolute; left:0; right:0; margin:0 auto; top:50%; transform:translate(0, -50%); color:var(--clr-white);}

/*--------------- Grid End --------------------*/

.galleryslider .slick-slide{margin:10px; position:relative; overflow: hidden; border-radius:10px;}
.galleryslider .slick-slide img{height: 420px; object-fit: cover; margin-left: 30px;
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;}

.galleryslider .slick-slide:hover img {
	margin-left: 0;
}


/*--------------- List Start --------------------*/

.list, .listicon{position: relative; margin:0; padding:0;  line-height:24px;}
.list li{margin-bottom: 15px;display: flex;column-gap:10px;}
.list li:before{font-family: 'Line Awesome Free';display: flex;content: '\f00c';color:var(--clr-white);font-size: 14px;font-weight: 700;background:var(--clr-lightblue);height: 25px; width: 25px;padding: 8px;align-items: center;justify-content: center;border-radius: 100px;}

.listicon{line-height:clamp(60px, 4vw, 80px);}
.listicon img{max-width:45px; filter: invert(53%) sepia(60%) saturate(4145%) hue-rotate(166deg) brightness(100%) contrast(98%);}
.listicon li{column-gap:20px; font-size:clamp(14px, 2vw, 18px); align-items:center;}
.listicon li:before{display:none;}

.list-lg{font-size:20px;}
.list-lg li:before{height:35px; width:35px; font-size:20px; background:#3a5e87;}
.bluelist li:before{background:#5198e9;}
.list-count{column-count:2;}

/*--------------- List End --------------------*/


/*--------------- Form Start --------------------*/

.form-control{font-size:14px;  margin-bottom:20px; line-height:40px; background:var(--clr-white); border:1px solid #ccc; border-radius:8px; color:var(--clr-dark);}
textarea.form-control{height:120px!important;}

.form-control:focus{box-shadow:none; border-color:1px solid #ccc!important;}
.error{color:#e16d6d; display:block; margin-top:10px;}
.form-select{line-height:40px; margin-bottom:20px;}
.form-select:focus{box-shadow:none; border-color:1px solid #ccc!important;}
.form-control::placeholder {color: 000 !important;opacity: 1;}
label{font-size: 14px;line-height: normal; margin-bottom: 5px;}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 50px #749bb5   inset !important;
	-webkit-text-fill-color: #fff !important;
}
.form-floating>.form-control:not(:placeholder-shown)~label::after{background-color:#749bb5;}
.form-floating>.form-control:-webkit-autofill~label{color:var(--clr-white);}
.homeform .form-check{display:flex; gap:20px;}
.form-check-input{background-color:transparent; width:30px; height:30px;}
.form-check-input:focus{box-shadow:none;}
.form-floating>label{color:var(--clr-dark);}
.form-check-input:checked {background-color: #03a8ea;border-color: #03a8ea;}
.form-check .form-check-input{margin-left:0; margin-right:10px;}
.form-check-label{display: flex; margin-top:10px;}
.form-check-inline{padding-left: 0;}
.text-success {--bs-text-opacity: 1;color: rgb(16 215 123) !important;}

/*--------------- Form End --------------------*/


/*--------------- Footer Start --------------------*/

.footer{font-size:14px; line-height:24px; position:relative;}
.footer:before{background:url("images/pattern.jpg"); opacity:.1; position:absolute; content:''; width:100%; height:100%; inset:0;}
.footer img{max-width:200px;}
.footer h5{font-size:16px; font-weight:700; margin-bottom:10px;}
.f-menu{margin:0; padding:0; list-style:none;}
.f-menu a{display: block; line-height:30px; color:var(--clr-dark);}
.f-menu a:hover{color:#6485ff;}

/*--------------- Footer End --------------------*/

.patternbox{position:relative;}
.patternbox:before{background:url("images/pattern.jpg"); opacity:.1; position:absolute; content:''; width:100%; height:100%; inset:0;}

.heightspace{height:480px; object-fit: cover;}

.topshape{position:relative;}
.topshape:before{position: absolute; content:''; width:100%; height:100%; background:#cee8f3; top:20px; left:20px; opacity:.2;}
.topshape:hover:before{top:0; left:0;}


.buildshape{position:relative;}
.buildshape:after{position:absolute; background: url("images/greybulidingnew.png") no-repeat left; background-size: contain; height:100%; content:''; top:0; width:100%; opacity:0.04;}
.gridgallery img{display:grid;}
.companylogo img{width:80%;}
.lineicon{display:flex; gap:10px;}
.lineicon i{font-size:22px; color:var(--clr-lightblue);}
.lineicon a{color:var(--clr-white);}
.lineicon a:hover{color:var(--clr-dark);}

.iconbox.roof-solution{grid-template-columns: 1fr 1fr 1fr;}



.gridlist{padding:40px 0; font-weight:700; border-radius: 20px; position:relative; height: 700px; overflow: hidden;}
.gridlist:before{position: absolute; content: ''; background: url(images/580-[Converted].png) -110px 150px; bottom: 0; width: 100%; height: 100%; background-repeat: no-repeat;}
.gridlist h3{color:var(--clr-lightblue); font-weight:700;}
.gridlist img{height:60px; margin-bottom:20px; filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(141deg) brightness(106%) contrast(101%);}
.gridlistpic:before{position: absolute; content: ''; background: url(images/drawhouse.png) -110px 280px; bottom: 0; width: 100%; height: 100%; background-repeat: no-repeat;}
/*.mailbox i{background:var(--clr-blue); border-radius:100%; display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; font-size: 40px; margin:10px auto;}*/
.mailbox i{font-size:clamp(20px, 4.2vw, 30px); color:var(--clr-lightblue);}
.mailbox a{color:var(--clr-lightblue); font-size:clamp(14px, 2vw, 24px);; font-weight:700; border:1px solid; border-color:var(--clr-lightblue); padding:10px;}
.mailbox a:hover{border:1px solid #000; color:var(--clr-dark);}
.mailbox a:hover i{color:var(--clr-dark);}


.housebox{position:relative; overflow: hidden; background: linear-gradient(35deg,  rgba(12, 103, 165, 1) 14%, rgba(22, 32, 91, 1) 78%);}
.housebox:before{position: absolute; content: ''; background: url(images/dreamhouse.png) -360px 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size:contain;
background-position: bottom 0;}
.roofing-solution-banner:before{position: absolute; content:''; background: url("images/roofing-solutions-img1.png"); width:100%; height:100%;}
.roofleftbox:after{position: absolute; content:''; inset:0; width:100%; height:100%; background: rgb(255,255,255);background: linear-gradient(117deg, rgba(255,255,255,1) 0%, rgba(22,32,91,0) 88%);}

/*
.thumb{height:100%; padding:20px; background:var(--clr-white);-webkit-box-shadow: 0px 0px 29px 0px rgba(201,238,255,0.28);
-moz-box-shadow: 0px 0px 29px 0px rgba(201,238,255,0.28);
box-shadow: 0px 0px 29px 0px rgba(201,238,255,0.28);}
.thumb img{max-width:50px; margin:20px auto; display: block;}
*/



.leakicon img{max-width:80px; margin-bottom:20px; filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(141deg) brightness(106%) contrast(101%);}
.hovergallery{position:relative; overflow: hidden;}
.hovergallery img{margin-left: 30px;
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;}
.hovergallery:hover img {
	margin-left: 0;
}

/*
.bottombox{margin-top: -250px; height:650px; position:relative;}
.bottombox:before{position: absolute; content: ''; background: url(images/blacklogo.png) 70px 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size:contain;
background-position: bottom;}
*/

.bottompic img{margin-top:-140px; aspect-ratio:1/1.5; object-fit: cover;}

.warrantybox{position:relative;}
.warrantybox:before{position: absolute; content: ''; background: url("images/warrantynew.png"); width: 100%; height: 100%; background-repeat: no-repeat; background-size:contain;
background-position: center right;}









.cross-line-right {
  display: table;
  white-space: nowrap;
  color:var(--clr-white);
}
.cross-line-right::after {
  border-top:1px solid #ccc;
  content: "";
  display: table-cell;
  position: relative;
  top: 10px;
  width: 100%;
}
.cross-line-right span{padding-right:20px;}
.housebanner{position:relative;}
.housebanner:before{position: absolute; content:''; inset:0; width:100%; height:100%; background:url("images/cloud1.png") no-repeat center; color: var(--clr-dark); background-size:cover;
opacity:.5;}

.roofleftbox:before{position:absolute; content:''; background: url("images/roofingtoppic.png") no-repeat 0 -250px; width:100%; height:100%; z-index:9;}
.buildingleftbox:before{position:absolute; content:''; background: url("images/green-glass-house.jpg") no-repeat bottom; width:100%; height:100%; z-index:9; background-size:cover; opacity:.7;}
/*.waterroofinbox{position:relative; background-image: url("images/fluide-applied.jpg"); background-size:cover; background-position: bottom left; background-repeat:no-repeat;}*/
.waterroofinbox{position:relative; background-image: url("images/fluidapplied2-new.jpg"); background-size:cover; background-position: bottom left; background-repeat:no-repeat;}



.sectionbanner{position:relative;}
.sectionbanner img{height:1070px; object-fit: cover;}
.sectionbanner .caption{position:absolute; top:50%; transform: translate(0,-50%);}

.flatbox img{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(36deg) brightness(103%) contrast(101%); max-width:300px; margin:0 auto;}
.flatbox h2{margin:30px 0;}

.flatslider .slick-slide{margin:0 40px;}
.flatslider .slick-dots {font-size: 0;text-align: center;margin-bottom: 0;margin-top: 20px;}
.flatslider .slick-dots li {position: relative;display: inline-block;}
.flatslider .slick-dots li button {padding: 5px;width: 17px;height: 17px;border-radius: 50px;background: #fff;margin: 0 10px 0 0;border: 0;}
.flatslider .slick-dots li.slick-active button {width:17px;height:17px;background: #03a8ea;opacity: 1;}

.text-gradiant{background: linear-gradient(to right, #30CFD0 0%, #330867 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}

.linecard > div{display: inline-block; font-size:20px; padding:50px 20px; border:1px solid #fff; border-radius:10px; margin:20px;}

.picwidth{position: absolute; bottom:0; max-width:970px;}


.homegallery img{aspect-ratio:1.3/1; object-fit: cover; border-radius:10px; margin-bottom:25px;}

.bg-primary-gradiant{background-color: rgb(12 98 147 / 80%);}
.bg-dark-gradiant{background-color: rgb(0 0 0 / 80%);}
.manufeaturebox{border:1px solid #ccc; border-radius:10px;}














.container{max-width:1230px; position:relative; z-index:9;}






@media (max-width:1199.98px){
	.logo img {max-width: 120px;}
	.banner:after{opacity:.1;}
	.nav-link{margin:0; font-size:16px;}
	.warrantybox:before{display:none;}
	
}

@media (min-width:991px) {
.dropdown .dropdown-menu {display: block;visibility: hidden;opacity: 0;-webkit-transform: translateY(20px);-ms-transform: translateY(20px);transform: translateY(20px);
-webkit-transition: all .3s ease-in;-o-transition: all .3s ease-in;transition: all .3s ease-in;box-shadow: 0 10px 10px rgb(0 0 0 / 10%); padding: 10px;}
.dropdown:hover > .dropdown-menu {visibility: visible;opacity: 1;-webkit-transform: scaleY(1);-ms-transform: scaleY(1);transform: scaleY(1);}
.dropdown-item:focus, .dropdown-item:hover, .dropdown-item.active, .dropdown-item:active {color: #333;background-color:#fff;padding-left: 15px;border-radius:0;}
}



@media (max-width:991.98px){
/*	.logo img, .shrink .logo img {max-width:200px;}*/
	.navbar-nav{line-height:30px; }
	.nav-item{border-bottom: 1px dotted #fff; padding:0 20px; background-color:#75a8e6;}
	.nav-link{color:#fff;}
	.navbar-nav .nav-link.active, .navbar-nav .nav-link.show{color: #195c76;}
	.navbar-toggler{border-radius:0; border:0; margin-left:5px;}
	.navbar-toggler i{font-size:30px; color:var(--clr-dark);}
	.navbar-toggler:focus{box-shadow:none;}
/*	.navbar-toggler:focus{box-shadow:none;}.navbar-expand-lg .navbar-nav .nav-link{margin: 0;}*/
	.shrink .navbar-collapse{top:45px;}
	.navbar-expand-lg .navbar-nav .dropdown-menu{position:relative; top:inherit;}
	.banner .btn{font-size:16px; padding:12px 20px;}
	body{font-size:14px;}
	.sectionbanner img{height: inherit;}
	.sectionbanner .caption{position:relative; transform: none; padding:20px;}
	.housebox:before{opacity:.4;}
	.bottombox{margin-top:0; height:500px;}
/*	.roofleftbox:before{background-position: left bottom;}*/
	.iconbox {grid-template-columns: 1fr 1fr!important;}
	.upper{position:relative;}
	.img-height1{aspect-ratio:inherit;}
	.waterroofinbox{background-image: none;}
	.contractorbanner{position:relative;}
	.contractorbanner:before{position: absolute; content:''; width:100%; height:100%; inset:0; background:var(--clr-white); opacity:.8;}
	
	
	
}

@media (max-width:767.98px){
	.lead {font-size: 16px;line-height: 24px; font-weight:500;}.housebox:before{display:none;}
	.roofleftbox:before{background-size: contain;padding-bottom: 670px; background-position: bottom; opacity:.2;}
	.bottompic img{margin-top:0; aspect-ratio:2/1;}
	.videobox i {
        width: 30px;
        height: 30px;
        font-size: 30px;
        padding: 20px;
    }
    .list-count {
    column-count: 1;
    }
    .list-lg {
    font-size: 14px;
    }
    .buildingleftbox:before{opacity: .4;}
    .quick-link-menu{display:flex; flex-direction:row; gap:20px; justify-content:center;}
	
	
}

@media (max-width: 575.98px) {
	.logo img, .shrink .logo img {max-width:80px;}
	body{font-size:13px; line-height:16px;}
	.parentbox{grid-column-gap: 20px; grid-row-gap: 20px;}
	.parentbox h5{font-size: clamp(10px, 2vw, 18px);}
	.parentbox a{bottom:0; font-size:8px; padding:5px 10px;}
	.listicon{line-height:30px;}
	.bannerslider {height: 430px;position: relative;}
	.bannerslider .caption{top:130px; left: 10px; right: 10px;}
	.bannerslider .btn{font-size:12px; padding:12px 20px;}
	.btn-lg {padding: 10px 14px;font-size: 14px;}
	.iconbox {grid-template-columns: 1fr!important;}
	.gridlist{height:440px; padding:15px; padding-top: 30px;}
	.gridlist:before {
    position: absolute;
    content: '';
    background: url(images/580-[Converted].png) -190px 0px;
    bottom: 0;
    width: 100%;
    height: 100%;}
    
    .long-gridlist{height:510px;}
    .long-gridlist.gridlist:before {

    background: url(images/580-[Converted].png) -190px 90px no-repeat;}
    .small-gridlist{height:380px;}
    .small-gridlist.gridlist:before {

    background: url(images/580-[Converted].png) -190px -60px no-repeat;}
}
    .iconbox.roof-solution {padding:20px;}
    .footer{font-size:13px;}
    label{font-size:13px;}

	
	
}

@media (max-width: 376.98px) {
		
}