@import url('fonts/fonts.css');
/* Header section styling */
:root {
	--lighblue-color: #2765CF;
	--yellow-color: #FADF01;
	--darkblue-color: #003CA2;
	--black-color: #0A1527;
	--white-color: #ffffff;
	--black-text-color: #000000;
	--text-gray-color: #000000B2;
	--text-ligh-color: #FFFFFFCC;
	--gradientp-color: #E1EDFF;
	--gradients-color: #EEE9DA;
	--border-color:#0000004D;
}
html{
	scroll-behavior: smooth;
}
.pac-container {
    z-index: 10510; /* Higher than Bootstrap modal's default z-index of 1050 */
}
ul#menu-commercial-solar-landing-top {
    display: inline-flex;
    gap: 15px;
}
section#testimonials .custom-nav{
	top:35%;
}
.bgthankyou{
	position: relative;
}
.thankyou{
	color:#fff;
}
.bgthankyou:before{
	
	    content: "";
    position: absolute;
    background: linear-gradient(0deg, #ffffff00, #ffffff00), linear-gradient(191.33deg, rgba(10, 21, 39, 0) 22.48%, #0A1527AB 57.9%);
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
a:hover {
    color: inherit;
}
a.btn.btn-yellow.deactive.mt-3.w-100{
	pointer-events: none;
}
.whyarisessection .btn-yellow.btn {
    font-size: 1.10rem !important;
    margin: 15px 5px 0px;
    display: inline-block;
}
.whyarisessection .boxblue{
	width:100%;
}
.video-tes p.text_22 {
    min-height: 65px;
}
.whyarisessection .boxblue p.text_16.text_white_shades{
	min-height:100px;
}
section.testimonials .content.common_spa p.text_18 {
    min-height: 71px;
}
section.testimonials .video-tes p.text_18 {
    min-height: 115px !important;
}
.boxblue_list{
    max-width: 100%;
    margin: 0 auto;
}
.elem-form label.form-label {
    margin-bottom: 0px;
}
.bannersection {
	transition: background-image 1s ease;
}
body{
	font-family: 'CircularStdBook';
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, p, dl, ol, ul{
	margin: 0px;
}
.container{
	position: relative;
}
.radio-btn{
	cursor: pointer;
}
.row.selectamount .radio-btn{
 opacity: 1 !important;
}
.carousel-caption-static {
    position: absolute;
    top: 60px;
    left: 60px;
    right: 60px;
    text-align: center;
    color: white;
    z-index: 10;
    margin: 0 auto;
    display: inline-block;
    width: calc(100% - 120px);
}
.wpcf7-list-item{
	padding: 12px !important;
	cursor: pointer;
	background: #eef2fa;
	margin: 0 1em 0 0em !important;
	border-radius: 10px;
}
.card.bg-white-call.mx-auto {
	border-radius: 8px;
	overflow: hidden;
}
#menu-top-menu {
	display: inline-flex !important;
	gap: 30px;
}
.work-carousel{
	margin-left:15px;
}
.footerbg img{
	width:auto;
}
.wpcf7-textarea {
	max-height: 75px;
}
.testinomial-carousel .owl-item img{
	height:172px !important;
}
.work-carousel .owl-item img{
	margin: 0 auto;
	max-width: 100%;
	width: 100%;
	border-radius: 10px;
	height: 300px;
	object-fit: cover;
}
.form-check.form-check-inline{
	width:100%;
}
.radio-btn.active {
	background: var(--lighblue-color);
	color: var(--white-color);
}
button.navbar-toggler{
	background-color: var(--yellow-color);
}
.topheader{
	background-color:var(--lighblue-color);    
	display: inline-block;
	width: 100%;
}
.btn-yellow.btn{
	font-size: 1.10rem !important; 
}
.form-control {
	border-color: var(--border-color);
	border-radius: 8px;
	border: 1px solid rgba(0, 0, 0, .3);
	padding: 13px 16px !important;
	color: #000;
	font-size: 16px;
	display: block;
	margin: 7px 0 12px 0;
	background-color: #F7F7F7;
	height:unset;
}
a{ 
	text-decoration: none;
}
.topheader a{
	color:var(--white-color);
	font-size: 14px;
	font-weight: 450;
	line-height: 17.71px;
	text-align: center;
}
.navbar-brand img {
	max-height: 40px; /* Adjust to your logo size */
}
.btn-yellow {
	background-color: var(--yellow-color);
	color: var(--black-color);
	border-radius: 20px;
	padding: 10px 50px 10px 50px;
	gap: 10px;
	border-radius: 50px;
	min-width: 230px;
	max-width: 100%;
}
section#whyarises .btn-yellow{
	min-width: 275px;
}
.modal-header{
	color:var(--lighblue-color)
}
.deactive{
	opacity: 0.5;
}
.navbar-nav.ml-auto{
	border-width: 0px 0px 0px 1px;
	border-style: solid;
	border-color: #00000033;
}
li.nav-item {
	border-width: 0px 1px 0px 0px;
	border-style: solid;
	border-color: #00000033;
	padding-left: 12px;
	padding-right: 12px;
}
ul.navbar-nav a{
	font-size: 16px;
	font-weight: 450;
	line-height: 20.24px;  padding: 24px;
	color:var(--black-text-color);
}
.d-inline-grid{
	display: inline-grid;
}
.bannersection {
	/*background-image: url('images/banner.webp');  */
	background-size: cover;
	background-position: center;
	color: white;
	/*padding: 88px 0px;*/
	text-align: center;
	position:relative;
}
.iconsection .d-flex{
	gap:15px;
}
.max_six_fifty{
	max-width: 575px;
}
.boxblue_list
{
	padding: 24px 16px 24px 16px;
	border-radius: 10px;
	background: var(--darkblue-color);
}
.boxblue
{
	padding: 24px 16px 24px 16px;
	gap: 10px;
	border-radius: 10px;
	background: var(--darkblue-color);
}
.solutionssection, .whyarisessection {
	background-color: var(--lighblue-color);
}
.solutionssection .container{
	background-image: url('images/solutionssectionbg.png'); /* Replace with actual background */
	background-size: contain;
	background-position: right bottom;
	background-repeat: no-repeat;
	position: relative;
	z-index: 1;
}
.cecapproved{
	background-image: url('images/cec.webp');
	background-size:cover;
	position: relative;
}
.cecapproved .smalllogo img {
	vertical-align: middle;
	border-style: none;
	background: #000000b8;  
	margin: 6px;
	border-radius: 10px;
	filter: grayscale(1);
}
.cecapproved:before, .bannersection:before{
	content: "";
	position: absolute;
	background: linear-gradient(0deg, #ffffff00, #ffffff00), linear-gradient(191.33deg, rgba(10, 21, 39, 0) 22.48%, #0A1527AB 57.9%);
	width: 100%;
	height: 100%;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}
.find-right-system, .customer-support{
	background: linear-gradient(239.67deg, var(--gradientp-color) 10.03%, var(--gradients-color) 72.62%);
}
.find-right-system .card.bg-white {
	max-width: 800px;
	margin: 0 auto;
	padding: 32px 50px 32px 50px;
	border-radius: 8px;
}
.find-right-system .card.bg-white.mx-auto {
	gap: 10px;
}
.customer-support .bg-right-50 {
	background-image: url('images/support.webp');
	background-size: 50% auto;
	background-position: top right;
	background-repeat: no-repeat;
	position: relative;
	z-index: 1;
}
.grid-setup{
	display: grid;
	gap: 20px;
}
img.img-fluid {
	margin: 0 auto;  
}
.find-right-system img.img-fluid {
	width:100%;
}
.radio-btn{
	padding: 16px 20px 16px 20px;
	gap: 6px;
	border-radius: 8px;
	opacity: 0px;
	font-weight: 450;
	background: #EEF2FA;
}
.wpcf7-list-item.active {
	background: #2765CF;
	color: #fff;
}
.wpcf7-list-item label{
	margin:0px;
}
.wpcf7-list-item.active .wpcf7-list-item-label{
	color:#fff;
}
.testimonials, .footerbg{
	background-color: var(--black-text-color);
	color:var(--white-color);
}
.video-tes {
	padding: 20px 20px 28px 20px;
	gap: 0px;
	border-radius: 10px;
	border: 1px;
	background: var(--lighblue-color);
	display: inline-grid;
	gap: 15px;  
	margin-bottom:20px;
}
.font-weight-bold{
	font-family: 'CircularStdBold';
}
.text-tes {
	display: inline-grid;
	gap: 22px;
	margin-bottom: 40px;
}
.card.bg-white-call.mx-auto .col-sm-5{
	background-size:cover;
}
.whyarisessection .boxblue{
	margin-bottom: 15px;
	gap:20px;    
	display: inline-grid;
}
.row.align-items-center.border-top-div {
	border-top: 1px solid #FFFFFF33;
	padding: 24px 0px;
}
.footerbg img{
	max-height: 120px;
	margin-bottom: 20px;
}
.form-control{
	border-color: var(--border-color);
}
section.find-right-system label{
	font-size: 16px;
	font-weight: 450;
	line-height: 17.6px;
	color: var(--text-gray-color);
	margin:0px;
}
section.bannersection  .carousel-item img {
  margin: 0 auto;
  display: inherit;
  width: 100%;
  object-fit: cover;
}
i.fas.fa-check.mr-2.text-black{
	color:var(--yellow-color);
}
section.bannersection .carousel-item img.bg{
	height:600px;
}
section.bannersection li, section.customer-support li{
	margin-bottom: 8px;
	list-style: none;
	position: relative;
}
section.bannersection li, section.customer-support li{
	margin-bottom: 15px;
}
.boxblue .text_16 {
    font-size: 1.25rem;
    line-height: 125%;
}
section.customer-support ul{
	padding-left: 35px;
}
section.bannersection ul{
	padding-left: 0px !important;
}
.bannersection .carousel-caption{
	top:10%;
	bottom:unset;
}
.col-sm-10.d-inline-grid.gap-24{
	padding:0px;
}
.d-inline-grid.gap-24{
	gap: 24px;
}
.bannersection  .carousel-inner::after {
	display: block;
	clear: both;
	content: "";
	content: "";
	position: absolute;
	background: linear-gradient(0deg, #ffffff00, #ffffff00), linear-gradient(191.33deg, rgba(10, 21, 39, 0) 22.48%, #0A1527AB 57.9%);
	width: 100%;
	height: 100%;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}
section.customer-support li:before{
	content: " ";
	width: 20px;
	background-image: url(images/rightarrow.svg);
	background-size: 100%;
	position: absolute;
	background-repeat: no-repeat;
	height: 16px;
	left: -35px;
	top: 4px;
}
ul.text_20 {
	position: relative;
}
.solutionssection img {
	max-height: 48px;
}
.common_spa {
	display: inline-grid;
	gap: 15px;
}
.testimonials a:hover{
	color:var(--yellow-color);
}
.work-carousel{
	position: relative;
}
.custom-nav {
	position: absolute;
	top: 50%;
	width: 100%;
	display: flex;
	justify-content: space-between;
	pointer-events: none;
	z-index: 1;
}
.custom-nav .owl-prev, .custom-nav .owl-next {
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size:25px;
	color: #000;
	pointer-events: all;
	font-weight: bold;
	background: #fff;
	border: none;
}
/****Textcss****/
a{color: inherit;}
.testimonials span, section.whyarisessection span{
	color: var(--yellow-color);
}
p.text_16.font-weight-bold small{
	color: var(--text-ligh-color);
}
.video-tes .image {
	max-height: 165px;
	overflow: hidden;
	object-fit: cover;
}
.text_white{
	color:var(--white-color);
}
.text_blue{
	color:var(--lighblue-color);
}
.text_white_shades{
	color:var(--text-ligh-color);
}
.text_black_shades, small{
	color:var(--text-gray-color);
}
.font_weight_bold{
	font-weight: 700;
}
.text_12{
	font-size: 12px;
	line-height: 15.6px;
}
.text_14{
	font-size: 14px;
	line-height: 15.6px;
}
.text_16{
	font-size: 16px;
	line-height: 20.8px;
} 
.text_18{
	font-size: 18px;
	line-height: 23.4px;
} 
.text_20{
	font-size: 1.25rem;
	line-height:120% !important;
	line-height: 20px;
} 
.text_22{
	font-size: 1.25rem;  
	line-height: 1.35rem;
}
.text_24{
	font-size: 24px;  
	line-height: 30.36px;
}
.text_26{
	font-size: 26px;
	line-height: 33.8px;  
}
.text_32{
	font-size: 32px;
	line-height: 35.2px;
}
.text_50{
	font-size: 50px;
	line-height: 55px;
	position: relative;
}
.text_68{
	font-size: 68px;
	line-height: 74.8px;
}
section.customer-support .text_20 p {
    margin-bottom: 15px;
}
.form-check-inline .form-check-input {
	padding: 10px 12px 10px 12px;
	gap: 6px;
	border-radius: 8px;
	font-weight: 450;
	background: #EEF2FA;
}
.form-check-inline .form-check-input.active {
	background: #2765cf;
	color: #fff;
}
.image-popup .popup-overlay {
	position: absolute;
	top: 0; left: 0; width: 100%; height: 100%;
	background: rgba(0, 0, 0, 0.8);
	z-index: 1;
}
.image-popup .popup-content {
	position: relative;
	z-index: 2;
	padding: 20px;
	border-radius: 8px;
	text-align: center;
}
.image-popup .popup-content img.popup-image {
	max-width:auto;
	height: 85vh;
	border-radius: 8px;
}

.image-popup .close-button {
	margin-top: 15px;
	padding: 8px 16px;
	border: none;
	color: #fff;
	border-radius: 8px;
	cursor: pointer;
	position: absolute;
	top: 5px;
	right: 20px;
	background: #00000059;
}
.modal-dialog.modal-lg.modal-dialog-centered {
	max-width: 600px;
}
.modal-content {
	box-shadow: 1px 1px 25px rgba(0, 0, 0, .4);
}
#exampleModalLabel {
	font-size: 1.5rem;
	padding-left:20px;
}
.modal-body {
	padding: 20px 30px;
}
.carousel-control-next, .carousel-control-prev{
	width:60px;
}

.carousel-caption{
	left:60px;
	right:60px;
}
.bannersection .carousel-item .img-fluid.d-none.d-md-block {
  max-width: 100%;
}
.boxblue_tic{
	padding-left:30px;
	position:relative;
}
.boxblue_tic:after {
    content: " ";
    width: 20px;
    background-image: url(images/right.svg);
    background-size: 100%;
    position: absolute;
    background-repeat: no-repeat;
    height: 16px;
	left:0px;
    top: 4px;
}
@media(max-width:1024px){
	.text_68{
		font-size:42px;
		line-height: 50.8px;
	}
	.text_50{
		font-size: 35px;
		line-height: 110%;
	}
	.text_32{
		font-size: 28px;
	}  
	.text_26{
		font-size: 22px;
	}
	.text_24{
		font-size: 20px;
	}
	.text_20{
		font-size: 16px;
	}
	.text_22{
		font-size: 18px;
	}
	.row.align-items-center.border-top-div{
		gap:15px;
	}
	.w-75{
		width:100% !important;
	}
	.boxblue{
		margin-bottom: 15px;
	}
	section.iconsection .col-sm-3{
		flex:0 0 48%;
		max-width: 50%;
	}
	section.iconsection .row{
		gap: 15px;
	}
	section.iconsection .d-flex.justify-content-center{
		justify-content: flex-start !important;
	}
	section.bannersection .carousel-item img.bg{
		height:520px;
	}
}
@media(max-width: 991.98px){
	.navbar-nav.ml-auto, li.nav-item{
		border: none;
	}
	ul.navbar-nav a{
		padding:10px;
	}
	div#navbarNav{
		position: absolute;
		z-index: 1;
		background: rgb(255, 255, 255);
		left: 0px;
		right: 0px;
		top: 56px;
		border-radius: 0px 0px 10px 10px;
	}
	.container {
		max-width: calc(100% - 30px);
	}
}
@media(max-width:768px){  
	.container {
		max-width: calc(100% - 0px);
	}
	  section.bannersection img {
		/*max-width: 140px;
		margin-top: 20px;*/
		height: 50vh;
		width: 100%;
	  }
	.customer-support .bg-right-50{
		background-size: cover;
	}
	.solutionssection .container:after {
		content: " ";
		background-color: #2765cfc7;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		width: 100%;
		position: absolute;
		z-index: -1;
	}
	.bg-right-50:after {
		content: " ";
		background-color: #ffffffd9;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		width: 100%;
		position: absolute;
		z-index: -1;
	}
	section.whyarisessection .mt-md-5 {
		margin: 20px 0px;
	}
	section.find-right-system .col{
		min-width: 50%;
		margin-bottom: 15px;
	}
	.cecapproved .smalllogo img{
		max-width: 125px;
	} 
	.text_68 {
		font-size: 30px;
		line-height: 38px;
	  }
	.btn-yellow.btn{
		font-size:1rem !important;
	}
	a.navbar-brand img {
    max-width: 200px;
}
	.work-carousel{
		margin-left:0px;
	}
	.custom-nav{
		width: 94%;
	}
}