/********************************************************************************
			RESETS
********************************************************************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
}
body { line-height: 1;}

ul { list-style: none;}

blockquote, q { quotes: none;}

blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none;}

a:active { outline: 0;}

sup, sub { position: relative; height: 0; line-height: 1; vertical-align: baseline !important; vertical-align: bottom;}
sup { bottom: .75ex;}
sub { top: .5ex;}

/* remember to define focus styles! */
:focus { outline: 0;}

/* remember to highlight inserts somehow! */
ins { text-decoration: none;}
del { text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0;}

/********************************************************************************
			GLOBAL STYLES
********************************************************************************/

body { background: #f1f1f1 url(../images/bg_body.jpg) repeat-x; font-size: 13px; line-height: 1; font-family: Arial, Helvetica, sans-serif; color: #111111;}

/* links */
a { color: #56be41}
a:hover  {}

/* floats */
.float_left { float: left;}
.float_right { float: right;}
.clear { display: block; clear: both; height: 1px; font-size: 1px; line-height: 1px;}

/* typography */
p { margin: 1em 0; line-height: 1.5;}

/* headers */
h1 { font-size: 20px; color: #337BB9;}
h2 { margin: 25px 0 15px; font-weight: normal; font-size: 16px; color: #046830;}
h2 + p { margin-top: 0;}


/********************************************************************************
			WRAPPERS
********************************************************************************/

.wrapper { width: 960px; margin: 0 auto 20px;}

	.main { float: right; width: 960px; margin-bottom: 30px;}
	.main p {font-size: 16px;}

		.sidebar { float: left; width: 230px; margin-top: 10px; border-radius: 10px 0 0 10px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); overflow: hidden}
		.content { float: right; width: 648px; padding: 40px; background: #ffffff; border: #cccccc solid 1px; border-radius: 10px;}

/********************************************************************************
			MASTHEAD CONTENT
********************************************************************************/

.masthead { padding: 15px 0; overflow: hidden;}

	.logo_branding { float: left;}

	/* main nav */
	.main_nav { float: right; display: inline; margin: 20px 0 20px 10px; padding: 3px 1px; background: #2fa64a; border-radius: 5px; box-shadow: inset 0 2px 1px #02e387; overflow: hidden;

		/* gradients */
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#08b856), to(#00782f)); /* safari 4-5, chrome 1-9 */
		background: -webkit-linear-gradient(#08b856, #00782f); /* safari 5.1+, chrome 10+ */
		background: -moz-linear-gradient(top,  #08b856,  #00782f); /* for firefox 3.6+ */
		background-image: -o-linear-gradient(#08b856, #00782f); /* opera 11.10+ */ }

		.main_nav li { float: left; border-left: #037338 solid 1px; border-right: #13d461 solid 1px;}
		.main_nav .first { border-left: 0;}
		.main_nav .last { border-right: 0;}

			.main_nav a { display: block; padding: 0 10px; margin: 0 2px; font-weight: bold; font-size: 13px; line-height: 50px; color: #ffffff; text-shadow: 0 0 1px rgba(0, 0, 0, 0.5); text-decoration: none;}
			.main_nav a:hover { background: #0b9643; border-radius: 3px; color: #f7ce36;

				/* gradients */
				background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00782f), to(#08b856)); /* safari 4-5, chrome 1-9 */
				background: -webkit-linear-gradient(#00782f, #08b856); /* safari 5.1+, chrome 10+ */
				background: -moz-linear-gradient(top,  #00782f,  #08b856); /* for firefox 3.6+ */
				background-image: -o-linear-gradient(#00782f, #08b856); /* opera 11.10+ */ }

/********************************************************************************
			SIDEBAR
********************************************************************************/

.section_title { padding: 15px; background: #eaeaea; border-top: #cccccc solid 2px; border-bottom: #dedede solid 1px; font-weight: bold; font-size: 16px; color: #337BB9;

	/* gradients */
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fefefe), to(#dedede)); /* safari 4-5, chrome 1-9 */
	background: -webkit-linear-gradient(#fefefe, #dedede); /* safari 5.1+, chrome 10+ */
	background: -moz-linear-gradient(top, #fefefe, #dedede); /* for firefox 3.6+ */
	background-image: -o-linear-gradient(#fefefe, #dedede); /* opera 11.10+ */ }

.sidebar .first { border-top: 0; border-radius: 10px 0 0;}
.sidebar .last { border-radius: 0 0 0 10px;}

.box { padding: 15px; background: #e4f4fe; border-top: #ffffff solid 1px;}

	.box .title { font-size: 15px; line-height: 1.5;}
	.box .title + p { margin-top: 5px;}

.box.gradient { background: #e8edf2;

	/* gradients */
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#e4edf6), to(#f5f5f5)); /* safari 4-5, chrome 1-9 */
	background: -webkit-linear-gradient(#e4edf6, #f5f5f5); /* safari 5.1+, chrome 10+ */
	background: -moz-linear-gradient(top, #e4edf6, #f5f5f5); /* for firefox 3.6+ */
	background-image: -o-linear-gradient(#e4edf6, #f5f5f5); /* opera 11.10+ */ }

/* sidebar nav */
.sidebar_nav { padding: 0 10px;}

	.sidebar_nav li { border-top: #ffffff solid 1px; border-bottom: #94d5ff solid 1px;}
	.sidebar_nav .first { border-top: none;}
	.sidebar_nav .last { border-bottom: none;}

		.sidebar_nav a { display: block; font-size: 14px; line-height: 42px; color: #454545; text-decoration: none; position: relative;}
		.sidebar_nav a:after { content: "\00BB"; float: right; margin-right: 20px; font-size: 22px;}
		.sidebar_nav a:hover { color: #337bb9;}

/********************************************************************************
			 CONTENT
********************************************************************************/

/* hero image */
.hero_top {text-align: center;margin: 0 0 10px 0; font-size: 10px; color: #999;}
.hero_image { margin-bottom: 20px;  position: relative;}
	.hero_image img {border-radius: 10px;}
	.hero_image h2 {position: absolute; bottom: 7px; left: 50px; font-size: 30px;color: #14307F;font-weight: bold;}

/* callout box */
.callout { padding: 20px; margin: 20px 0; background: #eaeaea; border: #d5d5d5 solid 1px; border-radius: 10px; font-weight: bold; font-size: 20px; line-height: 1.25; text-align: center;}

	.callout p { margin: 0;}
	.callout .highlight { color: #da0000;}

/* comparison tables */
.comparison { width: 100%; margin: 15px 0; color: #111111; line-height: 1.5;}

	.comparison th,
	.comparison td { width: 20%; padding: 10px; background: #2fa64a; border: #dedede solid 1px; font-size: 12px; vertical-align: middle;}
	.comparison td { background: #ffffff;}
	.comparison .first { background: #dedede;}
	.comparison tr:hover td { background: #fbffdb;}
	.comparison tr:hover .first { background: #dedede;}

	.comparison th { font-size: 14px; color: #ffffff; text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);}

	.content li { list-style: disc inside; padding-bottom: 10px; line-height: 1.5}


/********************************************************************************
			GEO
********************************************************************************/

	.geo h1 { margin-top: 10px}
	.geo td { line-height: 20px}
	.geo center div { padding-bottom: 15px; color: #a1a1a1}

/********************************************************************************
			FOOTER
********************************************************************************/

.footer { width: 960px; margin: 0 auto; position: relative; text-align: center; font-size: 11px; color: #454545; line-height: 20px; margin-bottom: 50px}
.footer a { color: #454545; text-decoration: none}

/********************************************************************************
			CLEARING ELEMENTS THAT CONTAIN FLOATED ELEMENTS
********************************************************************************/

/* new clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/********************************************************************************
			BUSINESS HERO
********************************************************************************/
.float-left,#float-left { float:left; display:inline; }
.float-right,#float-right { float:right; display:inline; }

.business_hero {width: 650px;height: 361px;margin-bottom: 20px;background: url(/images/JE_ad_new3.jpg) 0 0 no-repeat;position: relative;border-radius: 5px;border: 1px solid #777;}
.business_hero .float-left {float: left;}
.business_hero .float-right {float: right;width: 200px;}
.business_hero #contact-form {width: 188px;border-top: none;margin-top:50px;}
.business_hero #contact-form input#submit {width: 188px;}
.business_hero p.list-title {color: #FFF;margin: 70px 0 0 18px;font-size: 20px;font-weight:  bold;}
.business_hero ul.list {color: #FFF;margin: 10px 0 0 35px;font-size: 13px;}
.business_hero .phone-number {position: absolute;right: 120px;bottom: 63px;font-size: 30px;font-weight: bold;color: #F49A13;}

.business_hero #contact-form {top: 10px; position: relative;}
.business_heroalt #contact-form { padding:5px 0 0; border:none; /*border-top:1px solid #fff;*/}
.business_hero #contact-form p { color: #ffffff; font-weight: bold; text-align: center; line-height: 15px}
.business_hero #contact-form p { color: #000000; text-align: center; line-height: 15px}
.business_hero #contact-form label { display:none; visibility:hidden; }
.business_hero #contact-form input[type="text"] { margin:2px 0 5px; border:1px solid #a4a4a4; -moz-border-radius:5px; border-radius:5px; font-size:14px; padding:3px; width: 180px; color: #818181; }
 .business_hero #contact-form input#submit { background:url(/images/contact-submit.jpg) repeat-x #db4d2b; border:1px solid #db4d2b; -moz-border-radius:5px; border-radius:5px; color:#fff; width:188px; font-size:22px; font-weight:bold; cursor:pointer; text-shadow:0 1px 0 #000; *height: 35px}
.business_hero #contact-form input#submit:hover, .business_hero #contact-form input#submit:hover { background:url(/images/contact-submit-hover.jpg) repeat-x #FC6641; border:1px solid #db4d2b; -moz-border-radius:5px; border-radius:5px; color:#fff; font-size:22px; font-weight:bold;
text-shadow:0 1px 0 #000; }
.business_hero #required { font-size:9px!important; margin:0 10px!important; border:none!important; text-align:right!important; line-height: 12px !important;}

.business_hero .errors { position: absolute; top:-37px; padding: 10px 5px; font-size:12px; background-color:#C02B1D; color:#fff; text-align:center; margin-right:10px; -moz-border-radius:5px; border-radius:5px; -webkit-border-radius:5px;}

.business_hero .puct { color:#666; font-size:9px!important; margin:0 10px!important; border:none!important; text-align:right!important; }

.business_hero > .legal { margin-top: 107px; font-size: 10px; color: #FFF; padding: 0 20px; line-height: 12px;}

.business_hero > .legal a { color: #FFF;}
.business_hero > .legal a:hover { text-decoration: none;}

.thankyou-bg {
	background: url(/images/thankyou-bg-208.jpg) no-repeat 100% 0;
	min-height: 442px;
}
.thankyou-bg h2 {
	color: #b10000;
	font-size: 34px;
	font-weight: bold;
	margin: 30px 0 10px 0;
	text-transform: uppercase;
}
.thankyou-msg {
	font-size: 14px;
}
.thankyou-bg .red-box {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 3px solid #7d0000;
	background: #d30000; /* Old browsers */
	background: -moz-linear-gradient(top,  #d30000 0%, #7e0000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d30000), color-stop(100%,#7e0000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #d30000 0%,#7e0000 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #d30000 0%,#7e0000 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #d30000 0%,#7e0000 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #d30000 0%,#7e0000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d30000', endColorstr='#7e0000',GradientType=0 ); /* IE6-9 */
	color: #fff;
	text-shadow: 1px -2px 0 rgba(0,0,1,.72);
	font-size: 42px;
	font-weight: bold;
	width: 370px;
	text-align: center;
	padding: 25px 0;
	text-transform: uppercase;
}
.thankyou-bg .red-box span {
	display: block;
	color: #fbe900;
	text-shadow: 1px -2px 0 rgba(0,0,1,.72);
}

/********************************************************************************
			Landing AD Hero
********************************************************************************/
.hero_image > h3 { color: #fff; float: left; font-size: 20px; height: 30px; width: 382px; margin-top: 21px; text-align: center;}
.alberta-rate {color: #fff; position: absolute;}
.alberta-rate {top: 50px; left: 57px; text-shadow: 1px 2px 0 #031b66;}
.alberta-rate p {font-size: 1.5em; display: block; float: left; }
.big-eight {font-family: arial, sans-serif; display: block; float: left; font-weight: bold; font-size: 15em; letter-spacing: -8px; text-shadow: 3px 3px 0 #031b66;}
.alberta-rate .cent { font-weight: bold; font-size: 4em; float: left; display: block; margin: 8px 0 0;}
.rate-copy { float: left; width: 200px; padding-left: 20px;}
.rate-copy sup {font-size:12px;}
.kwh {display: block; margin: 21px 0 4px 10px; float: left; line-height: 1;}
.product-type {font-size: 22px; line-height: 1.2; width: 200px; margin: 0;}
p.ad-legal {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: normal; font-size: 9px; bottom: 5px; left: 17px; position: absolute; color: #fff; width: 610px; line-height: 1; margin: 0;}
.masthead {position: relative;}
.headerPhone { position: absolute; top: 15px; right: 0; color: #337BB9; font-weight: bold; font-size: 23px;}
.headerPhone .h-phone { display: block; float: right; padding-left: 15px; color: #C02B1D;}
.smallPhone { float: right; text-align: right; font-size: 12px; line-height: 14px;}
.content {
	min-height: 980px;
}
.hero_image:before,
.hero_image:after {
	display: table;
	content: ' ';
}
.hero_image:after {
	clear: both;
}
.hero_image {
	position: relative;
	height: 357px;
	border-radius: 7px;
	background: url(/images/601/hero.jpg) no-repeat 0 0;
	*zoom: 1;
}
.hero-phone {
	position: absolute;
	top: 265px;
	right: 128px;
	color: #F49A13;
	font-weight: bold;
	font-size: 30px;
}
.hero-form {
	float: right;
	margin: 0 15px 0 0;
}
.hero-form p {
	color: #fff;
	text-align: center;
	font-weight: bold;
	font-size: 12px;
	line-height: 1.3;
}
#contact-form {
	margin: 0;
	padding: 0;
	width: 200px;
}
#contact-form input[type="text"] {
	display: block;
	float: left;
	margin: 0 0 8px 0;
	padding: 5px;
	width: 188px;
	border: 1px solid #d1d1d1;
	border-radius: 4px;
	background-color: #fff;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	font-size: 13px;
	line-height: 13px;
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
}

#contact-form input[type="text"].error {
	border-color: red;
	background: rgb(255, 224, 230);
}

#contact-form input[type="text"]:focus {
	border-color: #999;
}
#contact-form input[type="submit"] {
	display: block;
	float: left;
	margin: 0;
	padding: 5px;
	width: 100%;
	border: 1px solid #B05118;
	border-bottom-color: #DC651E;
	border-radius: 3px;
	background-color: #DC651E;
	background-image: -moz-linear-gradient(top, #E3844B, #B05118);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#E3844B), to(#B05118));
	background-image: -webkit-linear-gradient(top, #E3844B, #B05118);
	background-image: -o-linear-gradient(top, #E3844B, #B05118);
	background-image: linear-gradient(to bottom, #E3844B, #B05118);
	background-repeat: repeat-x;
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
	color: #fff;
	text-align: center;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	font-weight: bold;
	font-size: 18px;
	line-height: 18px;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe3844b', endColorstr='#ffb05118', GradientType=0);
	cursor: pointer;
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
}
#contact-form input[type="submit"]:hover {
	background-color: #DC651E;
	background-image: -moz-linear-gradient(top, #B05118, #E3844B);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B05118), to(#E3844B));
	background-image: -webkit-linear-gradient(top, #B05118, #E3844B);
	background-image: -o-linear-gradient(top, #B05118, #E3844B);
	background-image: linear-gradient(to bottom, #B05118, #E3844B);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb05118', endColorstr='#ffe3844b', GradientType=0);
}
#contact-form .errors {
	float: left;
	margin: 25px 0 5px 0;
	padding: 5px;
	width: 188px;
	border-radius: 4px;
	background-color: #c41425;
	color: #fff;
	text-align: center;
}
#contact-form input[type="text"].is-invalid {
	border-color: #c41425;
	color: #c41425;
}
.je-logo {
	float: right;
}
.slat {
	margin: 30px 0 0 0;
	overflow: hidden;
	background-color: #fff;
	border-radius: 5px;
	border: 1px solid #cdcdcd;
	-webkit-box-shadow: 0 2px 2px -2px #CCC;
	-moz-box-shadow: 0 2px 2px -2px #CCC;
	box-shadow: 0 2px 2px -2px #CCC;
}
.slat > img {
	float: left;
}
.slat > h3 {
	margin: 65px 0 20px 173px;
	font-size: 28px;
	line-height: 28px;
	text-align: center;
}
.slat > p {
	margin: 0 0 0 173px;
	line-height: 20px;
	font-size: 16px;
	text-align: center;
	color: #414141;
}
.slat > p span {
	color: #C02B1D;
	font-size: 20px;
	font-weight: bold;
}

.business_hero > .legal { margin-top: 107px;}
.business_hero .errors { top: -52px;}

#contact-form label {
display: none;
visibility: hidden;
}

/* contact us form */

.webform-wrapper {
padding: 25px 25px 15px;
background-color: #037338;
width: 500px;
border-radius: 4px;
}

.webform input, .webform textarea {

margin: 0 0 10px 0;
padding: 10px;
width: 96%;
outline: 0;
border: none;
border-bottom: 2px solid #FFF;
border-radius: 4px;
background-color: #FFF;
font-size: 15px;
/*display: block;*/
-webkit-transition: all 0.15s ease-in-out;
-moz-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

.webform input.error, .webform textarea.error {
box-shadow: 0 0 3px rgba(255,0,0,1);
-webkit-box-shadow: 0 0 3px rgba(255,0,0,1);
-moz-box-shadow: 0 0 3px rgba(255,0,0,1);
border: 1px solid rgba(255,0,0,0.8);
color : red;
}

.webform .submit-button {
display: block;
padding: 10px;
width: 100%;
border: none;
border-bottom: 2px solid #db6627;
border-radius: 4px;
background-color: #e18147;
color: #FFF;
font-size: 15px;
text-align: center;
cursor: pointer;
-webkit-transition: all 0.15s ease-in-out;
-moz-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
}

.webform .webform-label-reason{
float: left;
margin: 0 0 10px 0;
padding: 5px 10px;
width: 50%;
outline: 0;
border: none;
font-size: 16px;
display: block;
color: #fff;
text-align: right;
}


.webform .webform-input.error{
color: red;
}

.webform-wrapper .message {
color; white;
text-align: center;
font-weight: bold
}

.webform-wrapper .message.error{
color: red;
}
/** Thank You ****/
.thankyou-bg {
	background: url(/images/thankyou-bg-208.jpg) no-repeat 100% 0;
	min-height: 442px;
}
.thankyou-bg h2 {
	color: #b10000;
	font-size: 34px;
	font-weight: bold;
	margin: 30px 0 10px 0;
	text-transform: uppercase;
}
.thankyou-msg {
	font-size: 14px;
}
.thankyou-bg .red-box {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 3px solid #7d0000;
	background: #d30000; /* Old browsers */
	background: -moz-linear-gradient(top,  #d30000 0%, #7e0000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d30000), color-stop(100%,#7e0000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #d30000 0%,#7e0000 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #d30000 0%,#7e0000 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #d30000 0%,#7e0000 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #d30000 0%,#7e0000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d30000', endColorstr='#7e0000',GradientType=0 ); /* IE6-9 */
	color: #fff;
	text-shadow: 1px -2px 0 rgba(0,0,1,.72);
	font-size: 42px;
	font-weight: bold;
	width: 370px;
	text-align: center;
	padding: 25px 0;
	text-transform: uppercase;
}
.thankyou-bg .red-box span {
	display: block;
	color: #fbe900;
	text-shadow: 1px -2px 0 rgba(0,0,1,.72);
}

.float-right, #float-right {
float: right;
display: inline;
}



#sub-menu{display:none}
@media (max-width:768px){
.wrapper,
.footer
{width:450px; overflow:hidden; padding:0 20px; box-sizing:border-box;}

/*Navigation*/
#sub-menu{display:block;   background:url(images/submenu.png) 15px center no-repeat;  border-radius: 20px;   padding: 5px 14px 5px 35px ; text-decoration:none; cursor:pointer; line-height:22px!important; margin: 25px auto 0; width:40px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.45);  }
.main_nav,
.starting-at { margin-top:0; display:none;}
.main_nav.active{display:block; margin-top:5px;}
.main_nav li{display:block; width:100%;}
.main_nav li a{line-height:40px;}


.main,
.content,
#hero-rates ,
.sidebar{width:100%; box-sizing:border-box; border-radius: 10px ; margin-bottom:20px; }
.content{padding:20px;}
.content img{max-width:100%}
.logo_branding{float:none;}
.masthead{display:block; text-align:center;}

 .content #hero-rates{ height: auto !important; margin: -20px -20px 0; overflow: hidden; padding: 0 12px !important;  width: auto; border-radius:10px 10px 0 0}
 #hero-rates #contact-form{position:relative!important; clear:both; width:90%!important; padding:12px!important; margin-left:5%; margin-right:5%; border-radius:3px;}
 #hero-rates #contact-form input{width:100%!important; box-sizing:border-box; }
 #hero-rates #contact-form label{ margin:10px 0 5px; float:left; width:100% }
 input#submit{margin-top:10px!important;}
 .ad2-wrapper{width:100%!important; clear:both; float:left; position:relative;}
 .ad2-wrapper .texas-rate{left:0; top:0; position:relative;}
 .product-type{margin:0!important; clear:both;  padding-top:10px;}
 .call-now-box {width:100%!important;  }

 /*Business page*/
 .biz-hero{width:100%; height:auto;  }
 .biz-hero .contact-form-wrap{ width:100%;position:relative!important; margin-top:150px; right:0;  box-sizing:border-box; overflow:hidden; margin-bottom:30px;}
 .biz-hero .ribbon-wrap{top:100px;width:382px!important;  }
 .biz-hero .ribbon-wrap .ribbon{width:395px; background-size:contain; height:140px; background-repeat:no-repeat;}
 .biz-hero .ribbon-wrap .ribbon .h-phone{font-size:35px; top:77px;}
 .biz-hero .ribbon-wrap .square{height:125px; width:380px;}
	.biz-hero .contact-form-wrap fieldset.half input{width:100%!important}
	.biz-hero .contact-form-wrap input[type="text"], .biz-hero .contact-form-wrap select{box-sizing:border-box; height:35px; width:100%;}
	.biz-hero .contact-form-wrap input[type="submit"]{border-radius:30px; margin-left:0}
	.biz-hero .logos{bottom:305px;}
	.content  h1 {clear:both;  }
	.biz-hero .contact-form-wrap .disclosure-text{margin-left:0}


}

 @media screen and (max-width: 768px){
	.wrapper,
.footer{width:310px; overflow:hidden; padding:0 5px; box-sizing:border-box;}
.big-eight{font-size:100px!important;}
.texas-rate p{font-size:1.5em!important; margin-top:30px;}
.kwh{margin-top:-20px!important}
.call-now-box{text-align:left!important; background-position:right top; box-sizing:border-box}
.call-text{font-size:.9em!important; padding-left:5px!important}
.h-phone{font-size:2em!important; padding-left:5px!important}

/*Business page*/
.biz-hero{margin:-20px -20px 0; display:block; width:auto;}
.biz-hero .heading{width:90%; background-size:contain; background-repeat:no-repeat}
.biz-hero .ribbon-wrap .ribbon{width:322px;  height:140px;  }
.biz-hero .ribbon-wrap{top:100px;width:330px!important;  }
.biz-hero .ribbon-wrap .square{height:100px; width:308px;}
.biz-hero .contact-form-wrap fieldset.half input{width:97px!important}

.biz-hero .ribbon-wrap .ribbon .h-phone{top:70px}
	.biz-hero .logos{bottom:420px;}

.mobile-info {display: none;}
.hero_image {background: none; margin-bottom: 0; height: auto; float: none;}
.hero-form p {color: #000000;}
#contact-form {width: 90%; margin: 0 auto;}
#contact-form input[type="text"] {width: 90%;}
}

/* Mobile Menu */

.sidebar_nav {
	max-height: 0;
	transition: max-height 1s ease;
	-webkit-transition: max-height 1s ease;
	-ms-transition: max-height 1s ease;
	-moz-transition: max-height 1s ease;
}

.sidebar > .section_title {
	background-image: url('../images/menu-toggle.png');
	background-position: right 15px center;
	background-repeat: no-repeat;
	background-size: 20px 20px;
}

.sidebar > .section_title:hover {
	cursor: pointer;
}

.sidebar_nav.is-open {
	max-height: 1000px;
}

@media screen and (min-width: 768px) {
	.sidebar_nav {
		max-height: initial;
	}

	.sidebar > .section_title {
		background: none;
	}

	.headerPhone {
		display: block;
		margin-bottom: 20px;
		text-align: center;
	}
}

.header-second {
		padding: 15px;
		color: #337BB9;
		font-size: 16px;
	}

/*=================*
 * MOBILE HERO CSS *
 *=================*/
.hero_image:before,
.hero_image:after {
	display: table;
	content: ' ';
}
.hero_image:after {
	clear: both;
}
.hero_image {
	position: relative;
	height: 357px;
	border-radius: 7px;
	background: url(/images/601/hero.jpg) no-repeat 0 0;
	*zoom: 1;
}
.hero-phone {
	position: absolute;
	top: 265px;
	right: 128px;
	color: #F49A13;
	font-weight: bold;
	font-size: 30px;
}
.hero-form {
	float: right;
	margin: 0 15px 0 0;
}
.hero-form p {
	color: #fff;
	text-align: center;
	font-weight: bold;
	font-size: 12px;
	line-height: 1.3;
}
#contact-form {
	margin: 0;
	padding: 0;
	width: 200px;
}
#contact-form input[type="text"] {
	display: block;
	float: left;
	margin: 0 0 8px 0;
	padding: 5px;
	width: 188px;
	border: 1px solid #d1d1d1;
	border-radius: 4px;
	background-color: #fff;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	font-size: 13px;
	line-height: 13px;
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
}
#contact-form input[type="text"]:focus {
	border-color: #999;
}
#contact-form input[type="submit"] {
	display: block;
	float: left;
	margin: 0;
	padding: 5px;
	width: 100%;
	border: 1px solid #B05118;
	border-bottom-color: #DC651E;
	border-radius: 3px;
	background-color: #DC651E;
	background-image: -moz-linear-gradient(top, #E3844B, #B05118);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#E3844B), to(#B05118));
	background-image: -webkit-linear-gradient(top, #E3844B, #B05118);
	background-image: -o-linear-gradient(top, #E3844B, #B05118);
	background-image: linear-gradient(to bottom, #E3844B, #B05118);
	background-repeat: repeat-x;
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
	color: #fff;
	text-align: center;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	font-weight: bold;
	font-size: 18px;
	line-height: 18px;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe3844b', endColorstr='#ffb05118', GradientType=0);
	cursor: pointer;
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
}
#contact-form input[type="submit"]:hover {
	background-color: #DC651E;
	background-image: -moz-linear-gradient(top, #B05118, #E3844B);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B05118), to(#E3844B));
	background-image: -webkit-linear-gradient(top, #B05118, #E3844B);
	background-image: -o-linear-gradient(top, #B05118, #E3844B);
	background-image: linear-gradient(to bottom, #B05118, #E3844B);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb05118', endColorstr='#ffe3844b', GradientType=0);
}
#contact-form .errors {
	float: left;
	margin: 25px 0 5px 0;
	padding: 5px;
	width: 188px;
	border-radius: 4px;
	background-color: #c41425;
	color: #fff;
	text-align: center;
}
#contact-form input[type="text"].is-invalid {
	border-color: #c41425;
	color: #c41425;
}

@media screen and (max-width: 768px) {
	.alberta-rate {
		display: none;
	}

	.hero_image {
		background-image: none;
		background-color: #337BB9;
		height: 377px;
	}

	.hero_image > h3 {
		margin-left: 10px;
		width: auto;
	}

	.hero-form {
		float: none;
		margin: 0 31px;
	}

	.hero-phone {
		position: relative;
		font-size: 16px!important;
		margin-left: 40px;
		right: 0;
		top: 0;
	}

	p.ad-legal {
		display: block;
		width: 230px;
		height: auto;
	}
}

.ad-legal a {
	color: #fff !important;
}

#featured_provider_business .mobile-only {
	display: none;
}

#featured_provider_business .mobile-only h3 {
	font-size: 20px;
	color: #fff;
	font-weight: bold;
	text-align: center;
}

#featured_provider_business .mobile-only .h-phone {
	color: #F49A13;
	font-size: 24px;
	margin: 10px 0;
	font-weight: bold;
	display: block;
	text-align: center;
}

@media screen and (max-width:768px) {
	#featured_provider_business {
		background-image: none;
		background-color: #337BB9;
		max-width: 100%;
		padding: 15px;
		box-sizing: border-box;
		-ms-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
	}

	#featured_provider_business * {
		box-sizing: border-box;
		-ms-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
	}

	#featured_provider_business form#contact-form {
		position: relative;
		width: 100%;
		float: none;
		margin: 10px 0;
	}

	#featured_provider_business form#contact-form input {
		float: none;
		width: 100%;
	}

	#featured_provider_business .float-left {
		display: none;
	}

	#featured_provider_business .float-right {
		float: none;
		width: 100%;
		display: block;
	}

	#featured_provider_business .mobile-only {
		display: initial;
	}

	#featured_provider_business > .phone-number {
		display: none;
	}

	#featured_provider_business .legal {
		padding: 10px 0;
		margin: 0;
	}
}