*{margin:0px; padding:0px;}
html {
  scroll-behavior: smooth;
}
body {color:#000; font-family: "Poppins", sans-serif; font-size:18px; line-height:1.8;}
.landing-container {max-width:1360px; padding:0 30px;}
.landing-container2 {width:75%; padding:0 30px;}
a {text-decoration:none;}

.inverted {
    background-color: #e6f3ed;
    box-shadow: 0 3px 5px 0.3px rgba(0,0,0,0.1);
  }
#header.inverted {padding:1rem 0;}
.inverted .logo{width:120px;}

/**************** Common Css ***********************************/
.button {border-radius:50px; font-size:18px; font-weight:600; padding:15px 25px; display:inline-block;}
.button-gradient {background: linear-gradient(to right,  rgba(155,232,179,1) 0%,rgba(255,236,27,1) 100%); color:#000;}
.button-gradient:hover {background: linear-gradient(to right, rgba(255,236,27,1) 0%,rgba(155,232,179,1) 100%);}
.button-light {color: #000; background: #f8f9fa; border:1px solid #fff;}
.button-light:hover {color: #000; background: #c6c7c8; border:1px solid #babbbc;}

.color-bg-success {background-color:#09A95B1A!important;}
.color-bg-success2 {background-color:#BDE9CA;}
.color-bg-success3 {background-color:#008946;}
.color-bg-light {background-color:#F4FAF7!important;}
.color-bg-gradient {background: linear-gradient(to right, #C1E99D 0%, #CDDD43 100%)!important;}

.site-border{border:1px solid;}
.site-border-warning {border-color:#FFE60B!important;}

h1,.h1,h2,h3,h4,h6{line-height: 1.2; font-weight:600;}
h1,.h1 {font-size:52px; font-weight:400;margin-bottom: .5rem;margin-top: 1.5rem;}
h1 span {font-weight:bold; color:#008946;}
h2 {font-size:48px; color:#008946;}
h3 {font-size:36px;}
h4 {font-size:22px;}
h6 {font-size:18px;font-weight:500;}

.side-social-icon {position:fixed; left:0px; bottom:15%;z-index: 99;}
.site-text-dark{color:#000!important;}
.site-text-warning{color:rgb(255 193 7)!important;}

p{margin-bottom: 1.5rem;}
.pad-y-5 {padding-top: 3rem; padding-bottom: 3rem;}
.width-100 {width:100% !important;}
.height-100 {height: 100% !important;}
.font-weight-bold{font-weight:bold;}
.fleft {float: left;}
.fright {float: right;}
.clear-area{clear:both;}
.position-outer {position: relative !important;}
.position-inner {position: absolute !important;}
.display-block{display:block;}
.display-flex {display: flex;}
.align-text-center{text-align:center;}
.margin-auto{margin-left:auto;margin-right:auto;}

.sml-width-area{width:50%;}
.display-inline {padding-left: 0; list-style: none;}
.display-inline li {display: inline-block;}
	

/**************** Header Css ***********************************/
#header{padding:3rem 0; position: fixed; top: 0; right: 0; left: 0; z-index:99;}
#header .button {font-size:26px; padding:12px 31px;}


/**************** Main Css ***********************************/
#banner .bnr-txt-area {transform: translateY(-50%); right:0px; left:0px; top: 51.6%;}
#banner .bnr-txt-area .bnr-text-width {width: 50%;}
#banner .bnr-txt-area .bnr-text-width  p{width: 80%;}
#banner .bnr-txt-area .bnr-text-width .bnr-button a{margin-right:15px;}
#banner .sml-txt {font-size:12px; font-weight:600; text-transform: uppercase; padding:.5rem 1rem; border-radius:1rem;}


#steps {background:url(../img/steps.png) no-repeat center center;min-height: 200px;}
#steps .step-format{padding: 44px 0;}
#steps .step-format .coloum{float:left; width:30%;}
#steps .step-format .coloum+.coloum{margin-left:55px;}
#steps .numb {background:#008946; border-radius:100%; color:#fff; font-size:24px; font-weight:600; width:60px; height:60px; margin-left:40px; line-height:60px;text-align:center;}
#steps .step-txt {margin-left:15px; width:60%;}


#benefits {background:url(../img/bg-img.jpg) repeat-x 0 64%;}
#benefits .benefit-details {margin-bottom: 40px;}
#benefits .benefit-details .h1 {font-weight: 600;}
#benefits .benefit-details .box,#benefits .benefit-details .box2,#benefits .benefit-details2 .box3{margin:0 7px 15px; border-radius:1rem;padding: 1.5rem;}
#benefits .benefit-details img,#benefits .benefit-details2 .box3 img{margin:10px 0;}
#benefits .benefit-details p,#benefits .benefit-details2 .box3 p{margin:0;}
#benefits .benefit-details .coloum1{width: 50%;}
#benefits .benefit-details .coloum2{width: 35%;}
#benefits .benefit-details .coloum2 h3{margin-top: 40px;}


#benefits .benefit-details2 {margin-top:50px;}
#benefits .benefit-details2 .box3 {width:40%; padding:3rem;}
#benefits .benefit-details2 .box3 h4 {margin-top:1.4rem; margin-bottom:.5rem;}
#benefits .benefit-details2 .box3 ul {margin-top:1.4rem; margin-left:1rem;}


#benefits .box {min-height:277px;}
#benefits .box2 {min-height:338px;}
#benefits .box3 {min-height:410px;}
#benefits .energy {background-image:url(../img/bg-img2.png); background-repeat:no-repeat; background-position:right center;}


#partner li {margin:0 26px;}

#testimonial {background:url(../img/quote-bg.png) no-repeat left bottom;}
#testimonial h2 {margin-bottom:3rem;;}
#testimonial h6 {color:#008946;}
#testimonial .testi-area {font-size:20px; width:66.6%; margin-left:auto; display: flex; flex-wrap: wrap;}
#testimonial .testi-area .coloum {flex: 0 0 auto; width: 47%; margin:10px;}

#testimonial .block {border-radius:20px; position: relative;display: flex; flex-direction: column; min-width: 0;word-wrap: break-word;background-clip: border-box; background:#fff;}
#testimonial .block .block-body {border-radius:20px 20px 10px 20px; padding:30px 30px 0 30px; flex: 1 1 auto;}
#testimonial .block .block-footer {border-radius:0 0 20px 20px;}
#testimonial .testi-area .name{font-size:18px; font-weight:700; text-decoration:underline; width:50%; padding: 15px 0 15px 0; border-radius: 0 20px 0 20px;}
#testimonial .testi-area .star{padding: 15px 0 15px 0; margin:auto; width:50%; border-radius: 0 0 20px 20px;}

#contact .contact-bg {background:url(../img/contact-bg.jpg) no-repeat center center; background-size:cover; min-height:684px; padding:3rem; border-radius:1rem;}
#contact .contact-bg > div {width:50%;}
#contact .contact-bg h3 {color:#fff; font-weight:500; margin-bottom:15px;}
#contact .contact-form-area{padding:3rem; border-radius:1rem;}

#contact .contact-bg .warranty-img {margin:30px 0 0 380px;}
#contact h2 {font-size:42px; font-weight:700; margin-bottom:1.5rem;}
#contact .contact-form .form-field {border:1px solid #3E3C3C4D; border-radius:50px; font-size:16px; font-weight:400; height:56px; margin-bottom:5px; padding:0 20px; width:92%;}
#contact .contact-form .form-field {width:100%;}
#contact .offer {font-size:24px; margin-top:20px;}

/**************** Footer Css ***********************************/
#Footer {color:#6d6b6b;font-size:16px;}
#Footer ul {line-height:1.3}
#Footer ul li {margin-bottom:10px;}
#Footer ul li a {color:#6d6b6b;}
#Footer ul li a:hover,#Footer a.active {color:#008946;}
#Footer h6 {font-weight:600;}

#Footer .copyright {font-weight:500;}

/**************** Media Css ***********************************/
@media (max-width:1399px){
	#testimonial {background-position: -190px 100%;}
}
@media (max-width:1299px){
	.button {padding: 15px 15px;}
	#partner li {margin: 0 20px;}
	#contact .contact-bg .warranty-img {margin: 30px 0 0 350px;}
}
@media (max-width:1199px){	
	.landing-container {max-width:100%;}
	#banner .bnr-img {object-fit:cover; min-height:900px;}
	#banner .bnr-txt-area .bnr-text-width p {width: 100%;}
	#banner .bnr-txt-area .bnr-text-width {width: 60%;}
	#steps .step-format .coloum+.coloum {margin-left: 13px;}
	#steps .step-format {padding: 10px 0;}	
	#steps {background-size: 97%; min-height: 150px;}
	.sml-width-area {width: 70%;}
	
	#benefits .benefit-details .coloum1 {width: 46%;}
	#benefits .benefit-details2 .box3 {padding: 2rem;}
	#testimonial .testi-area {width: 80%;}

	h1, .h1 {font-size: 200%;}
	h2 {font-size: 170%;}
	h3 {font-size: 150%;}
	#contact .contact-bg .warranty-img {margin: 10px 0 0 210px;}
}
@media (max-width:991px){
	.landing-container2 {width: 100%;}
	
	#banner .bnr-txt-area {top: 60%;}
	#banner .bnr-txt-area .bnr-text-width {width: 80%;}
	#banner .bnr-img {min-height: 700px;}
	
	#steps {background-size: 93%; background-position: 0;min-height: 100px;}
	#steps .step-format {padding: 23px 0;}
	#steps .numb {font-size: 20px; width: 40px; height: 40px; margin-left: 0px; line-height: 40px;}
	#steps .step-txt {margin-left: 12px; width: 95%; line-height: 1.5;}	
	.sml-width-area {width: 100%;}
	#benefits .benefit-details2 .box3 {padding: 1.7rem;}
	
	#testimonial .testi-area {width: 100%;}	
	#testimonial .testi-area .name {font-size: 16px;}
	#testimonial .testi-area {font-size: 16px;}
	#contact .contact-bg .warranty-img {margin: 10px 0 0 130px;}
}
@media (max-width:767px){
	
	body {font-size:16px; line-height:1.8;}
	h1,.h1 {font-size:28px;}
	h2 {font-size:26px;}
	h3 {font-size:21px;}
	h4 {font-size:18px;}
	h6 {font-size:16px;}
		
	#contact h2 {font-size: 28px;}
	.inverted .logo img{width:120px;}
	
	#header .fleft {float:right;}
	#header .fright {float:left; width: 170px;}
	#header .button {font-size: 16px; padding: 11px 20px;}
	
	#banner .bnr-txt-area {position:static!important; transform: translateY(0) !important;}
	#banner .bnr-txt-area .bnr-text-width {width: 100%; text-align: center; margin: 40px 0px 10px;}
	#banner .bnr-img {min-height: auto;}
	.side-social-icon {width: 30px;}
	
	
	#steps .step-format .coloum {width: 100%; margin: 0px !important;}
	#benefits .benefit-details .coloum1 {width: 44%;}
	#benefits .benefit-details .coloum2 {width: 34%;}
	#benefits .box {min-height: 255px;}
	#benefits .box2, #benefits .box3 {min-height: 375px;}
	#benefits .benefit-details2 .box3 {width: 38%;}
	
	#testimonial .testi-area .coloum {width: 46%;}
	#testimonial .testi-area .name {font-size: 13px;}
	
	#steps,#testimonial {background:none;}
	#steps .step1{background:#dbeee5; padding:15px;}
	#steps .step2{background:#e6f3ed; padding:15px;}
	#steps .step3{background:#f2f9f6; padding:15px;}
	#steps .step-txt {width: 75%;}
	
	
	#contact .contact-bg .warranty-img {display:none;}
	#contact .contact-form .form-control {font-size: 12px;}
}
@media (max-width:567px){
	body {font-size: 100%;}
	.landing-container {padding:0 25px;}
	.landing-container2 {padding:0px;}

	.button {font-size: 14px; padding: 10px !important;}
	
	#header .button {font-size: 14px;}
	#header .logo img {width: 120px;}
	#partner li {margin: 0 3px;}
	.ftr-logo{width:170px;}
	
	#benefits .box,#benefits .box2, #benefits .box3 {min-height: 100%; width:86%!important; text-align:center;}
	    #testimonial .testi-area .coloum {width: 100%;}
}