/* CSS Document */

html {background-color: #004C89; background-image: url(/images/site-background-blend.jpg); background-repeat: repeat-x;}

body {background-image: url(/images/site-background-top.jpg);background-repeat: no-repeat;background-position: top center;padding: 0;margin:0;font-family: Arial, Helvetica, sans-serif;font-size: 12px;color: #333;line-height: 1.7em;}

a {outline: none;}
	
/*  ------ global link colors ------- */	
	
a:link {color: #0066CC;text-decoration: none;}
a:visited {color: #0066CC; text-decoration: none;}
a:hover {color: #4C8D23;text-decoration: none;}
a:active {color: #666; text-decoration: none;}


/*  ------ global image attributes ------- */

img { behavior:url(/_includes/iepngfix.htc);}
a img { border: 0px;}

a:hover img {opacity:.70;}


/*  ------ global headings ------- */

h1 {padding: 15px 0 10px 0; margin:0; clear: both; font-weight: normal; font-size: 32px; color:#4F9224; line-height: 1em; float:left; width:600px;}
h2 {padding: 9px 10px 5px 10px; margin:0; font-size: 19px; font-weight: bold; color: #fff; background:#4C8D23 url(/images/heading-blend.jpg) repeat-y; line-height: 1em;}

	h2 a:link,h2 a:visited,h2 a:hover,h2 a:active {color: #fff;}

h3 {padding: 0 0 .7em 0; margin:0; font-weight:normal; font-size: 16px; line-height: 1.6em; color: #666;}
h4 {padding: 0 0 .7em 0; margin:0; font-weight: bold; font-size: 18px; text-decoration:none;}
h5 {padding: .7em 0 .7em 0; margin:.7em 0 0 0; font-weight: bold; font-size: 18px; border-top: 1px dotted #ccc;clear: both; }
h6 {font-size: 17px; font-weight: bold; padding: 0 0 1em 0; margin: 0px;}


/*  ------ Remove space above paragraph tag, but keep space below ------- */

p {margin: 0 0 1em 0;}



/*  ------ center site and set the width ------- */
.wrapper {width:1010px;margin: 0 auto;padding:0px;text-align:left;overflow:hidden; height: 1%;}	


/*  ------ site edge ------- */
.site-edge { background: url(/images/site-edge.jpg) repeat-y #fff; clear: both;overflow:hidden; height: 1%; padding: 14px 25px 25px 25px;}	



/*  ------ header background with curve ------- */

.top-bg {background: url(/images/header-background.gif) no-repeat top center; height: 215px;}

	/*------hidden from IE 6 and below------*/
	html > body .top-bg {background-image:url(/images/header-background.png);background-repeat:no-repeat; background-position: top center; height: 215px;}



/*  ------ logo ------- */
.logo {padding: 72px 0 0 15px; float: left;}
.logo a:hover img {opacity:.80;}



/*  ------ top right links ------- */
.top-right-links {float: right;color: #999;padding: 64px 25px 0 0;}
	.top-right-links ul {padding: 0; margin: 0;}
	.top-right-links ul li {padding:0; margin: 0; display: inline; list-style:none;}
	
	.top-right-links a:link {color: #999;text-decoration: none;}
	.top-right-links a:visited {color: #999; text-decoration: none;}
	.top-right-links a:hover {color: #4C8D23;text-decoration: none;}
	.top-right-links a:active {color: #666; text-decoration: none;}
	
	
/*  ------ search ------- */
.search {color: #999;float: right; padding: 34px 15px 0 100px;}
	.search td {padding: 0 10px 0 0;}
	.search input {width: 220px; border: #DDD solid 1px; background: #F7FAFD; padding: 5px 4px; color: #999;}
	
	
	
/*  ------ Main Menu ------- */
.main-menu {padding: 0 0 3px 18px; clear:both;}
	.main-menu ul {padding: 0; margin: 0;}
	.main-menu li {display: inline;list-style: none;}
	.main-menu a {display:block;float:left;height: 64px;}
	.main-menu a:hover {background-position:0 -64px;}
	.main-menu a:active {background-position:0 -128px;}
	
	.about {background:url("/images/menu-about.jpg") no-repeat; width: 104px;}
		.aboutOn {background-position:0 -192px;}
		
	.residential {background:url("/images/menu-residential.jpg") no-repeat; width: 115px;}	
		.residentialOn {background-position:0 -192px;}
		
	.commercial {background:url("/images/menu-commercial.jpg") no-repeat; width: 118px;}	
		.commercialOn {background-position:0 -192px;}
		
	.new-customers {background:url("/images/menu-new-customers.jpg") no-repeat; width: 142px;}	
		.new-customersOn {background-position:0 -192px;}	
		
	.view-bill {background:url("/images/menu-view-bill.jpg") no-repeat; width: 136px;}	
		.view-billOn {background-position:0 -192px;}
		
	.environment {background:url("/images/menu-environment.jpg") no-repeat; width: 124px;}	
		.environmentOn {background-position:0 -192px;}
		
	.media {background:url("/images/menu-media.jpg") no-repeat; width: 119px;}	
		.mediaOn {background-position:0 -192px;}	
		
	.contact {background:url("/images/menu-contact.jpg") no-repeat; width: 114px;}	
		.contactOn {background-position:0 -192px;}	
		
		
/*  ------ Home Page ------- */		

.alert-box { margin: 0 0 25px 0;padding: 25px 25px 16px 25px;border: #EDD1D1 solid 1px;background-color:#F7EBEB;color:#990000;overflow:hidden; height: 1%;}
	
.homeRotatorBox {position: relative; border: #ccc solid 1px; padding:2px; margin: 0 0 25px 0;}

#rotator {overflow:hidden; width:954px; height:294px; }
#rotatorNav {z-index: 50; position: absolute; bottom: 10px; right: 10px }
#rotatorNav a { margin: 0 0 0 7px; padding: 4px 7px; background: #333; text-decoration: none; color:#FFF; }
#rotatorNav a.activeSlide { background: #008DFF; color: #fff; }
#rotatorNav a:focus { outline: none; }
#rotatorNav a.withLink {border:0 none !important; margin:0 !important; padding:0 !important;}

.home-faq-col {float:left;width: 215px; line-height: 1em;}
	.home-faq {clear:both; border-bottom: #DCDCDC solid 1px;}
	.home-faq-pic {float:left; margin: 10px 10px 10px 0; width: 50px; border: 1px solid #ccc;}
	.home-faq-text {float:left; padding: 10px 10px 10px 0; width: 138px;}
	.home-faq-all {float:left; padding: 10px 10px 0 0;}
	.home-faq a:hover img {opacity:.70;}
	
	
.home-media-col {float:left;width: 215px;padding: 0 0 0 25px; line-height: 1em;}
	.home-media {clear:both; border-bottom: #DCDCDC solid 1px;}
	.home-media-pic {float:left; margin: 10px 10px 10px 0; width: 50px; border: 1px solid #ccc;}
	.home-media-text {float:left; padding: 10px 10px 10px 0; width: 138px;}
	.home-media-all {float:left; padding: 10px 10px 0 0;}
	.home-media a:hover img {opacity:.70;}
	
.home-learn-about {float:left;width: 453px;margin: 0 0 0 25px;padding: 0 0 0 25px;border-left: 1px dotted #999;}
	.home-learn-about div {padding: 25px 0 0 0; float: left;}
	.home-learn-about a:hover img {opacity:.70;}
	
	
/*  ------ Side Column------- */	


.side-column {float: left; width: 190px; margin-right: 25px;}
	
	
/*  ------ Side Menu ------- */			

.side-menu {}

	.side-menu ul {padding: 0; margin:0;}
	.side-menu ul li {margin:0; list-style: none; border-bottom: #ccc solid 1px; line-height: 1.2em;}
	
	.side-menu ul a {color: #666; display:block; width:170px; padding: 8px 10px;}
	.side-menu ul a:visited {color: #666;}
	.side-menu ul a:hover {color: #4C8D23; background: #F7FAFD;}
	.side-menu ul a:active {color: #999;}
	
	.selectedItem {color:#4C8D23; background-color: #F3FAEF;}
	
	
/*  ------ Side Tips ------- */			

.side-tip {padding: 20px 0 10px 0;}
.side-tip-heading {font-weight: bold; text-align: center; color:#4C8D23; letter-spacing: 1px; padding: 0 0 5px 0;}
.side-tip-text {text-align: center; line-height:2em; color: #666; padding: 0 10px;}

	
	
/*  ------ Content ------- */	

.content-area {float: left;  padding: 0 0 0 25px; width: 718px; border-left: 1px dotted #999;}

#content{}

	#content a:link {text-decoration: underline;}
	#content a:visited {text-decoration: underline;}
	#content a:hover {text-decoration: underline;}
	#content a:active {text-decoration: underline;}
		

.lead-image {padding: 2px; border: 1px #e4e4e4 solid; margin: 18px 0 18px 0; clear: both;}

.landing-page-tables {border-left: 1px #dcdcdc solid;border-top: 1px #dcdcdc solid;border-right: 1px #dcdcdc solid; background:#F7FAFD; width: 100%; padding: 0;margin: 12px 0 0 0; clear:both; }
	.landing-page-tables td {vertical-align: top; padding: 20px; border-bottom: 1px solid #dcdcdc; width:50%;}
	
.row-line-table {
	margin: 0 0 18px 0;}	
	
	.row-line-table td {border-bottom: 1px solid #DCDCDC; padding: 2px 20px 2px 0px;}
	
.pdf-thumb-grid {padding: 15px 0 0 0;}
.pdf-thumb-grid td {padding: 25px 25px 25px 0; border-top: 1px dotted #ccc;}	
	.pdf-thumb-grid img {border: 1px #ccc solid;}
	.pdf-thumb-grid a:hover img {opacity:.70;}
	
.h3-list ul { padding: 0 0 15px 0; margin: 0;}
	.h3-list ul li {padding: 5px 0; margin: 0; border-bottom: 1px dotted #DCDCDC; list-style:none;font-size: 15px; line-height: 1.6em; color: #666;}
	
.info-grid th {text-align: left; padding: 5px 40px 5px 8px; background: #E5E5E5;}
	.info-grid td {text-align: left; padding: 7px 40px 7px 5px; border-bottom: 1px solid #DCDCDC; vertical-align:top;}
	.info-grid tfoot {font-size: 14px; font-weight:bold;background: #F7FAFD;}
	
.thumbs {
	float: left; margin: 0 15px 0 0; border: 1px solid #ccc;}
	
	.thumbs a:hover img {opacity: .70;}
	
.right-box {float: right; padding: 16px; border: 1px #dcdcdc solid; background:#F7FAFD; margin: 0 0 10px 20px;}		
	
#tools-you-can-use {float: right; padding: 16px; border: 1px #dcdcdc solid; background:#F7FAFD; margin: 0 0 10px 20px;}	
	#tools-you-can-use ul {padding: 0 0 0 0; margin: 0;}
	#tools-you-can-use ul li {padding: 0; margin: 0; list-style: none; border-top: #ddd solid 0px;}
	
		#tools-you-can-use ul a {text-decoration: none; color: #666; display:block; width:190px; padding: 2px 8px 2px 22px;}
		#tools-you-can-use ul a:visited {color: #666; text-decoration: none;}
		#tools-you-can-use ul a:hover {color: #4C8D23; background: #FFF; text-decoration: none;}
		#tools-you-can-use ul a:active {color: #999; text-decoration: none;}
	
.side-pics {
	float: right;

	margin: 0 0 20px 20px;}	
	
.table-forms {border-left: 1px #dcdcdc solid;border-top: 1px #dcdcdc solid;border-right: 1px #dcdcdc solid; background:#F7FAFD; width: 100%; padding: 0;margin: 12px 0 12px 0; clear:both;}
	.table-forms td {vertical-align: top; padding: 12px; border-bottom: 1px solid #dcdcdc;}
	
.faq-table {border-left: 1px #dcdcdc solid;border-top: 1px #dcdcdc solid;border-right: 1px #dcdcdc solid; background:#F7FAFD; width: 100%; padding: 0;margin: 12px 0 0 0; clear:both;}
	.faq-table td {vertical-align: top; padding: 12px; border-bottom: 1px solid #dcdcdc;}	
		
.faq-detail-pic {float: left; padding: 0 20px 15px 0;}	



/*  ------ Font Sizer ------- */	

.font-sizer {float: right; width: 80px; padding: 27px 0 0 0;}
	.font-size, .font-size-down, .font-size-up {float: left;padding-right: 2px;}
	
	/*  ------Heading Line ------- */	
	
	.heading-line {border-bottom: 1px solid #ccc;overflow:hidden; height: 1%; margin-bottom:20px;}


/*  ------ breadcrumb ------- */		
	
.breadcrumb {color: #437E1E;font-size: 9px;text-transform:uppercase; line-height: 1em;}	
	.breadcrumb ul {padding: 0 0 0 0;margin: 0px;}
	.breadcrumb ul li {display: inline;list-style: none;padding: 0 0 0 0;margin: 0px;}
	.breadcrumb a:link {color: #999; text-decoration: none;}
	.breadcrumb a:visited {color: #999; text-decoration: none;}
	.breadcrumb a:hover {color: #999; text-decoration: underline;}
	.breadcrumb a:active {color: #999; text-decoration: none;}
	
	
	
/*  ------ Footer ------- */			

.footer-site-edge {background:url(/images/footer-bg.jpg) repeat-y;overflow:hidden; height: 1%;}

.footer-bottom { background-image:url(/images/footer-bottom.gif); background-repeat:no-repeat;width: 1010px; height: 50px;}	

	/*------hidden from IE 6 and below------*/
		html > body .footer-bottom {background-image:url(/images/footer-bottom.png); background-repeat:no-repeat;width: 1010px; height: 50px;}


.footer-left {float: left; width:695px; padding: 25px 25px 15px 25px; color: #666; }
.footer-right {float: left; width:214px; padding: 0 25px 8px 25px; margin: 25px 0 0 0; color: #666; border-left: 1px #ccc dotted;font-size: 11px; font-weight: bold;}
	.footer-right ul {padding: 0; margin: 0;}
	.footer-right ul li {padding: 0; margin: 0; list-style: none;}
.footer-right-left {float: left; width:90px; padding: 0 16px 0 0;}
.footer-right-right {float: left; width:90px; padding: 0;}

.copyright {font-size: 11px; color: #fff; padding: 15px 0 0 25px;}
	.copyright a:link {color: #FFF; text-decoration: none;}
	.copyright a:visited {color: #FFF; text-decoration: none;}
	.copyright a:hover {color: #FFF; text-decoration: underline;}
	.copyright a:active {color: #ccc; text-decoration: none;}
	
	
.playercontainer {margin:18px 0 18px 0; clear: both;}