@font-face{font-family:'Adelle_Sans';src:url(fonts/fonnts.com-Adelle_Sans.otf);font-weight:400;font-style:normal}
@font-face{font-family:'Adelle_Sans_Bold';src:url(fonts/fonnts.com-Adelle_Sans_Bold.otf);font-style:normal}

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;margin:0;padding:0;-webkit-text-size-adjust:none}
article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{display:block}
body{margin:0;background:#fff; padding:0;font-size:18px;color:#8d8d8d;font-family:Adelle_Sans,sans-serif;}
img{vertical-align:middle;max-width:100%}
a{text-decoration:none}
a:hover,a:focus{text-decoration:none;outline:none}
html{font-family:"";color:#8d8d8d}
.container{width:100%; max-width:990px;margin:0 auto;}
header{
	background: linear-gradient(#000000, #1E1145);
	/*background-image:url("../images/bgstrip.jpg"); background-size:auto auto; background-position:top -100px; background-repeat:repeat-x; */width:100%; background-color:#ffffff;}
.otherbg{background-image:url("../images/bgleft.png"); background-size:auto auto; background-position:left top; background-repeat:no-repeat; width:100%;}
header .logo img{width:auto;margin:0 auto; padding:10px 0 0 0;display:block;position:relative;}
.clear{clear:both;}
.center{text-align:center;}
.step{}
#step1{display:block;}
#step6,#step7,#step8,#step2,#step3,#step4,#step5{display:none;}

.stepfull{display:block; padding:0 0 130px 0;}
.step1left{width:45%;display:inline-block;float:left;color:#ffffff;margin-top:150px;}
.step1left h1{font-size:50px; background: url(../images/sidestrip.png) no-repeat center left; padding:0px 0px 10px 25px; background-size:contain;}
.step1right{width:48%; display:inline-block; float:left;}
.step1right .sidestrip{color:#ffffff; font-size:30px; text-align:center; width:100%; background:url(../images/fern.png) no-repeat top center; margin-top:30px; padding:40px 0 10px 0;}
.step1right .sidestrip span{color:#9dcd4e;font-family:'Adelle_Sans_Bold';}
.formmiddle{width: calc(85% - 80px); max-width:390px; border-radius:15px;  margin:0 auto; padding:50px 40px 70px; display:block; background-image:url(../images/formblocktop.png); background-position:top center; background-repeat:no-repeat; background-color:#ffffff;}
.width500{width:100% !important; max-width:550px; }
.formmiddle p{color:#1E1145; font-size:22px; font-family:'Adelle_Sans_Bold';}
.forminput{width:100%;margin:30px auto 20px auto;}
.forminput .form-input{width:100%; border-radius:10px; padding:20px; font-size:16px; border:1px solid #999999; font-family:'Adelle_Sans';color: #999999 !important;}
/*.elecprovider{appearance: none;width:100%;border-radius:10px; padding:12px 20px 12px 40px; font-size:16px; border:1px solid #6bcaa3; background:url(../images/lightbulb.png) no-repeat 10px 2px,url(../images/step4select.jpg) no-repeat right 17px;}*/

.elecprovider{
color: #777777;
    appearance: none;
    width: 100%;
    border-radius: 10px;
    padding: 12px 20px 12px 50px;
    font-size: 16px;
    border: 1px solid #6bcaa3;
    background: url(../images/lightbulb.png) no-repeat 8px 6px / 30px 30px, url(../images/step4select.jpg) no-repeat calc(100% - 20px) 17px;
}
.elecprovider:focus-visible{ border:1px solid #6bcaa3;outline:0px;}
.btn{width:100%; padding:15px; color:#ffffff; border-radius:10px; text-align:center; background-color:#ed701b; border:0; font-size:20px; font-weight:bold;cursor:pointer;}
.bar{margin:30px auto 80px auto;}
.button{margin:40px auto 0px;}
.button1{width:100%; display:flex; justify-content:space-evenly;}
.btnyes{flex-wrap:wrap;width:120px;height:120px;padding:60px 20px 20px 20px; border:1px solid #3eba87; border-radius:15px; display:inline-flex;justify-content:space-around;background:url(../images/yes.jpg) no-repeat center 30px; font-size:18px; font-weight:bold;color: #000;}
.btnno{width:120px;height:120px;padding:60px 20px 20px 20px;border:1px solid #3eba87; border-radius:15px; display:inline-flex;justify-content:space-around; background:url(../images/no.jpg) no-repeat center 30px; font-size:18px; font-weight:bold;color: #000;}
.sunnyopt{display:flex; justify-content:space-around; flex-wrap:wrap; margin:20px auto 0px auto;}
.sunnybox{width:105px; cursor:pointer; padding:70px 20px 20px 20px; margin:10px 10px 20px 10px; border:1px solid #3eba87; border-radius:15px; display:inline-flex;justify-content:space-around; font-size:18px; font-weight:bold;}
#fullsun{background:url(../images/step5sun1.jpg) no-repeat center 10px;}
#partialsun{background:url(../images/step5sun2.jpg) no-repeat center 10px;}
#nosun{background:url(../images/step5sun3.jpg) no-repeat center 10px;}
#uncertain{background:url(../images/step5sun4.jpg) no-repeat center 10px;}
.formmiddle p.small{color:#999999;font-size:14px; font-family:'Adelle_Sans';}
.formmiddle p.extrasmall{color:#999999;font-size:11px; font-family:'Adelle_Sans'; padding:20px 5 0;}
.address{background:url(../images/step4bg.jpg) no-repeat 10px 2px; padding-left:40px !important;}
.formmiddle p.mid{color:#170c36; font-size:18px; font-weight:normal; padding:10px 0px;}
.formmiddle p.font22{font-size:24px; font-weight:normal;}
	.sunnybox p{font-size:18px !important; font-family:'Adelle_Sans';}


input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  
  width: 50px;
  height: 50px;
  border: 0;
  background: url('../images/lightbulb.png') no-repeat;
  background-size:50px;
  cursor: pointer;
   box-shadow: none !important;
}
#rangeValue{color:#72cfab; margin: 20px 0px 20px 0px;text-align:center;}
input[type="range"]{
    width: 98%;
	height: 10px;
	-webkit-appearance: none;
    -moz-apperance: none;
    border-radius: 6px;
    background-image: -webkit-gradient(
        linear,
        left top,
        right top,
        color-stop(0.15, #36ba87),
        color-stop(0.15, #c7ded5)
    );
	outline: none;
	opacity: 0.7;
	-webkit-transition: .2s;
	transition: opacity .2s;
	  
}


footer{width:100%;margin:0px auto 0; padding:50px 0px;background:#ffffff; font-weight:400;}
footer div{margin: 0 auto; text-align:center;}
footer div{text-align:center; color:#8d8d8d; font-size:14px; width:90%; margin:0 auto;padding:0px 0px 10px 0px;}
footer div a{text-align:center;color:#4ebc80; font-size:14px; }


.form-input{border:1px solid #dddddd; height:40px; border-radius:2px; -moz-border-radius:2px;-webkit-border-radius:2px;}
.error_msg .error{display:block; width:300px; text-align:center; color:red; border:0px solid #efefef; line-height:25px; margin:0px auto; font-size:14px;}
.error{display:block;color:red !important; }

.aicontainersteps{
    width: calc(85% - 80px);
    max-width: 390px;
    margin: 0 auto;
	padding: 20px 10px 0px 10px;
    overflow: hidden;
	
}


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #a7a7a7;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #a7a7a7;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #a7a7a7;
}

.aimobile { display:none !important;}

@media (min-width: 1650px){

}

@media (min-width: 950px) and (max-width: 1190px){
}
@media (min-width: 769px) and (max-width: 949px){
}
@media (min-width: 600px) and (max-width: 880px){
	.step1left h1{font-size:56px;}
}

@media (min-width: 460px) and (max-width: 880px){
		.aidesktop{ display:none !important;}
	.aimobile{
		display:flex !important;
		padding: 10px;
		margin-left: 10px;
	}
	footer{margin:30px auto 0;}
	.step1left{margin-top:30px;width:calc(100% - 20px); padding:0 0 20px 20px; display:block; float:none;}
	.step1right{margin-top:0px;width:100%; display:block; float:none;}
	.step1left h1{font-size:48px;}
	.step1right .sidestrip{margin-top:10px;}
	.formmiddle{width:calc(90% - 50px);padding:40px 25px;}
	/*.btnyes{width:130px;}
	.btnno{width:130px;}*/
	.sunnybox{width:85px; margin:10px auto;}
	.sunnybox p{font-size:14px !important; font-family:'Adelle_Sans' !important;}
	.formmiddle p{font-size:20px; font-family:'Adelle_Sans_Bold';}
}


@media (min-width: 400px) and (max-width: 600px){
		.aidesktop{ display:none !important;}
	.aimobile{
		display:flex !important;
		padding: 10px;
		margin-left: 10px;
	}
	footer{margin:30px auto 0;}
	header .logo img{max-width:200px; padding-bottom:30px}
	.banner{padding-top:0px !important;}
	.otherbg{background-image: none;}
	.step1left{margin-top:0px;width:calc(100% - 20px); padding:0 0 0 10px; display:block; float:none;}
	.step1right{margin-top:0px;width:100%; display:block; float:none;}
	.step1left h1{font-size: 30px;
        padding: 0px 10px 0px 10px;}
	.step1right .sidestrip{margin-top:40px;}
	.formmiddle{width:calc(90% - 50px);padding:40px 25px;}
	/*.btnyes{width:100px;}
	.btnno{width:100px;}*/
	.sunnybox{width:85px; margin:20px auto;}
	.sunnybox p{font-size:14px !important; font-family:'Adelle_Sans' !important;}
	.formmiddle p{font-size:20px; font-family:'Adelle_Sans_Bold';}
	.elecprovider{font-size:13px;}
		.aicontainersteps { width: 90%;	}
}
@media (min-width: 280px) and (max-width: 400px){
	.aidesktop{ display:none !important;}
	.aimobile{
		display:flex !important;
		padding: 10px;
		margin-left: 10px;
	}
	footer{margin:30px auto 0;}
	header .logo img{max-width:200px; padding-bottom:30px}
	.banner{padding-top:0px !important;}
	.otherbg{background-image: none;}
	.step1left{margin-top:0px;width:calc(100% - 20px); padding:0 0 0 10px; display:block; float:none;}
	.step1right{margin-top:0px;width:100%; display:block; float:none;}
	.step1left h1{font-size: 27px; padding: 0px 10px 0px 10px;}
	.step1right .sidestrip{margin-top:40px;}
	.formmiddle{width:calc(90% - 50px);padding:40px 25px;}
	/*.btnyes{width:100px;}
	.btnno{width:100px;}*/
	.sunnybox{width:85px; margin:20px auto;}
	.sunnybox p{font-size:14px !important; font-family:'Adelle_Sans' !important;}
	.formmiddle p{font-size:18px; font-family:'Adelle_Sans_Bold';}
	.elecprovider{font-size:13px;}
	.aitext p{font-size:14px;}
	.aicontainersteps { width: 90%;	}
}



.btnyes:hover, .btnno:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	transform: scale(1.1);
}

.sunnybox:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	transform: scale(1.1);
}

.progress-container {
    position: relative;
    width: 100%;
    max-width: 90%;
	padding-top: 40px;
	margin:0 auto;
}

progress {
    width: 100%;
    height:7px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: none;
	margin-bottom: 80px;
}

progress::-webkit-progress-bar {
    background-color: #eee;
    overflow: hidden;
	    border-radius: 15px;
}

progress::-webkit-progress-value {
    background: linear-gradient(90deg, #3DB987, #B5D335);
}

progress::-moz-progress-bar {
    background: linear-gradient(90deg, #3DB987, #B5D335);
}

#progress-image {
    position: absolute;
    top: -10px; /* Adjust as needed to position the image vertically */
    transform: translateX(-50%);
}

        #city, #state, #zip{
            display: none; /* Hide by default */
			margin: 20px 0px 0px 0px;
        }
		
#citylabel, #statelabel, #ziplabel, #ziplabel2 {
	display:none;
}
		
        .clickable {
            color: #4ebc80;
            cursor: pointer;
        }
		
        .clickable:hover {
            text-decoration: underline;
        }
*,
*:focus{outline: none}

.form-item{
  position: relative;
  margin-bottom: 15px
}
.form-item input, .form-item select{
  display: block;
  width: 100%;
  height: 50px;
  border: solid 1px #ccc;
  transition: all .3s ease;
  padding: 15px;
  margin-top:20px;
  border-radius: 10px;
  color:#1E1145;
  font-size:15px;

}

.form-item label{
  position: absolute;
  cursor: text;
  z-index: 2;
  top: 16px;
  left: 10px;
  font-size: 15px;
  font-weight: bold;
  background: #fff;
  padding: 0 10px;
  color: #999999;
 transition: all .3s ease;
}

.form-item input:focus{
 border-color: #1E1145;
}

.form-item input:focus + label,
.form-item input:valid + label{
  font-size: 12px;
  top: -5px
}
.form-item input:focus + label{
  color: #1E1145;
}

.form-item input::placeholder{
    opacity: 0;
}
input:focus::placeholder{
    opacity: 1;
}
        .form-item input:focus + label,
        .form-item input:not(:placeholder-shown) + label {
            top: -7px;
            font-size: 12px;
		}

        .aicontainer {
            display: flex;
            align-items: center;
			margin-top: 20px;
        }
        .aiimage {
            flex: 1;
            max-width: 8%;
        }
        .aiimage img {
            max-width: 100%;
            height: auto;
        }
        .aitext {
            flex: 2;
            padding-left:15px;
			font-size:16px;
			color:#664c6f;
        }

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
	border-color: #1E1145;
  -webkit-text-fill-color: #1E1145;
  -webkit-box-shadow: 0 0 0 0px #fff inset;
  transition: background-color 5000s ease-in-out 0s;
}



		
