@charset "UTF-8";
/* CSS Document */

.clear { clear: both; }

body { margin:0px; padding:0px;
font: 12px/1.5em  "lucida grande", Verdana, Arial, Helvetica, sans-serif;
background:#E7F5F1 ;
background-color:#001D22;
color:#636467;}

h1, h2, h3 { margin:0px; color:#001D22;}

a {  color:#C71F3F; font-weight:bold; text-decoration:none; font-size:95%;}
a:hover { text-decoration:underline;}

ul {margin:10px 0 20px 0px; padding:0px;}
li {background:url(/images/bullet.gif) no-repeat; list-style:none; padding: 0 0 5px 25px; margin:5px 0 0 0;}

#branding { border-bottom:35px #940F2B solid;
background-color:#C71F3F ;

height:140px;}

*html .wave { 
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/images/branding_bkg.png');
	background-position:center top ;
}

.wave[class] {
  background:url(/images/branding_bkg.png) repeat-x center top;
}

*html .spotlightTop { 
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/images/spotlight_bkg.png');
	background-position:center top; 
	bckground-repeat: no-repeat;
}

.spotlightTop[class] {
  background:url(/images/spotlight_bkg.png) no-repeat center top;
}


#wrapper { background: #E7F5F1 url(/images/body_bkg.gif) repeat-y center top;}



#decoration { display:block; height:215px; width:276px;
position:absolute;
top:-150px;
left:-20px;


}

.couch { 
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/images/couch.png');
}


.couch[class] {
  background:url(/images/couch.png) no-repeat;
}

.spotlight { 
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/images/spotlight.png');
}


.spotlight[class] {
  background:url(/images/spotlight.png) no-repeat;
}


#container { width:790px; margin:0 auto; position:relative; padding:80px 0 0px 0; z-index:10;}


#content {width:520px;
float: left;
}

#content h1 { margin-bottom: 10px; }

#content p {margin:2px 0 15px 0;}

body.landing #content p {font-size: 1.5em; line-height: 1.5em; width: 75%; margin: 10px auto}


#content p.intro { font-size:16px; line-height:1.6em;}

#content h2 { color:#C71F3F; font-size:18px; margin: 5px 0 10px 0; }
#content h3 {color:#C71F3F;font-size:14px; margin-bottom:5px;}
#content em.slogan { font-size:14px; font-weight:bold; font-style:italic; color:#C71F3F; }

#content.casey h2 {color:#C71F3F;font-size:14px; margin-bottom:0px;}


#content ul { margin:10px 0 20px 20px;}
#content table {width:100%;
border:none;}

#content table tr:hover {background:#E7F5F1; }

#content table tr td { border-bottom:1px solid #CCCCCC; padding:2px 0;}

#content table tr td h2 {padding:5px 0 0 0;}

#products { position:relative; margin-top:40px; height:600px;}
/* #products img { margin-bottom:20px; position:absolute; top:0px; left:5px; } */
#products a img {border:none;}

#products h2 {height:35px;}

/* 

old home page style - updated 8/4/10

#thermostat, #casey { width:230px; padding-top:160px; position:relative;}

#thermostat {margin:0 30px 0 0;}

#casey {position:absolute;
top:35px; right:0px;
border-left:#cccccc dashed 1px;
padding-left:30px;}

*/

#thermostat {
	border-bottom:#cccccc dashed 1px;
	float: left;
	margin-bottom: 10px;
	padding-bottom: 9px;
}

#casey {
	float: left;
	clear: left;
	width: 540px;
	margin-top: 18px;
}

#casey p {
	padding-right: 10px;
}

#thermostat img{
	
	float: left;
	margin: 0 8px;
	width: 450px;
	height: 277px;

}

#casey img {
	
	float: left;
	margin: 8px;
	margin-bottom: 20px;
	width: 200px;
	height: 121px;
}

#thermostat h3 {
	clear: left;
	text-align: center;
	font-size: 16px;
	line-height: 22px;
}

#thermostat h3 span {
	font-size: 12px;
	color: #001D22;
}

#thermostat h5 {
	font-size: 22px;
	text-align: center;
	color: #940F2B;
	line-height: 22px;
	margin: 15px 0 5px 0;
}

#thermostat h5 span {
	font-size: 18px;
	color: #001D22;
}


#mainnav  {margin:0px; padding:0px; position:absolute;
top:-63px; right:0px; width:517px;}

#mainnav li { list-style:none; width:111px; height:50px; display:block;
text-align:center; position:absolute; background:none;}

#mainnav li a { font-weight:bold; line-height:1.1em;
color:#001D22; margin:0px; padding:12px 0 0 0px;
 display:block; background:url(/images/test.gif) center center #A5D9CF; 
width:111px; height:38px; 
text-decoration:none; font-size:100% }

#mainnav li#login {top:0; left:0px;width:92px; }
#mainnav li#login a {background:url(/images/test2.gif) center center #A5D9CF; width:91px; }

li#about {top:0; left:90px; }
li#talkingthermo {top:0; left:201px; }
li#caseyhvac {top:0; left:312px; }
#mainnav li#contact {top:0; left:423px; width:92px; }
#mainnav li#contact a {background:url(/images/test2.gif) center center #A5D9CF; width:91px; }



#mainnav li a:hover, #mainnav li#login a:hover, #mainnav li#contact a:hover { background-color:#61C4B2; }



#pronav_stripe {margin:0px; padding:0px; position:absolute;
top:170px; right:0px; width:100%; background:#001D22; color:#001D22; height:55px;}
#pronav {margin:0px; padding:0px; position:absolute;
top:13px; right:-40px; width:557px; height:55px;}

#pronav li {display:inline; background:url(/images/bullet_dark.gif) no-repeat; color:#FFFFFF; padding:0px 15px 0 25px;}
#pronav li a {color:#FFFFFF; font-size:13px;}
li#pro {background:none; padding:5px 10px 5px 5px; margin:0 10px 0 0; font-weight:bold;font-size:14px; display:block; float:left;  position:relative; bottom:18px;
background:url(/images/pro_nav_arrow.gif) no-repeat center; width:120px; height:46px; }

li#logo {margin:0px; 
background:url(/images/logo.gif) no-repeat left bottom; 
position:absolute; top:-105px; right:25px; 
height:105px; width:78px;  text-align:right;
}

li#logo a {background:none; display:block; height:105px; width:78px; }
li#logo a:hover {background:none;}

body.landing li#logo {background: none; text-indent: -9999px !important; display: none}
body.landing li#logo a {text-indent: -9999px !important;}

*html li#logo {height:95px;}
*html li#logo a {height:95px;}



#quickinfo { width:220px;
float: right;
border-left:#cccccc dashed 1px;
padding-left:20px;}

#quickinfo p,  #quickinfo ul { margin-left:5px;}

#quickinfo .brandedfont {display:block; }

#quickinfo h2.brandedfont {display:block; height:25px; }

#quickinfo h2 {color:#C71F3F; font-size:18px;}
#quickinfo h2.productguides { background:url(/images/product_guides.gif); height:72px; width:162px; margin-bottom:9px; text-indent:-9999px;}
#quickinfo h2.logintitle { background:url(/images/login.gif); height:72px; width:162px; margin-bottom:9px; text-indent:-9999px;}
#quickinfo h2.logintitle a {display:block; height:72px; width:162px; }


#siteinfo { background:#001D22; margin:0px; 
color:#CCCCCC; font-size:85%;
text-align:center; padding:40px 120px 40px 0;
position:relative;
z-index:0;
clear: both;
}


#siteinfo li {background:none;display:inline; padding:0px 0 0 10px;
}
#siteinfo li a {color:#CCCCCC; font-size:100%;}

img#energystar {position:absolute; 
display:block; height:32px; width:56px;
background:url(/images/energystar.gif);
right:40px; bottom:-160px; z-index:30;
display: none;
 }

form {position:relative;}

form input { width:144px;}
form p {margin:0px 0 0px 5px;}
input#submit1 { width:30px; height:26px; position:absolute; top:10px; right:20px;}



.nugget {border-bottom: 1px #CCCCCC dotted;
border-top: 1px #CCCCCC dotted;
padding:15px 0px 0 0;
margin:10px 0px 20px;
}

.newsection {
border-top: 1px #CCCCCC dotted;
padding:15px 0px 0 0;
margin:10px 0px 20px;
}


.left {float:left; padding:0 20px 0 0 ;}

#content blockquote {  background:#E7F5F1; width:35%; float:right; padding:20px; margin:0px 0 20px 20px; color:#001D22; font-size:110%; line-height:1.8em;}
#quickinfo blockquote {  background:#E7F5F1;  padding:15px; margin:0px 0 20px 0; color:#001D22;  line-height:1.8em;}

/*Forms*/

form label, label span {display:block; margin:2px 0; margin-right:.25em;padding-bottom:.25em;float:left; width:25%; text-align:right; }
form label span {float:left; width:30%; text-align:right; padding-right:10px}


form {
  width: 100%;
   padding: 5px;
  margin: 5px 0;
  position:relative;
}
form p {clear:left; padding:2px 0;}

form label.checkbox {width:55%}

/* fieldset styling */
form fieldset {
  margin:  0 0 5px 0; 
  
/*  space out the fieldsets a little*/
  padding: 1em;
  border : 1px solid #ccc;
}

/* legend styling */
form legend {
  font-weight: normal;
}


/* style for  labels */




form input, form select  {
  width: 200px;
}

input#username, input#password {width:144px;}

form#login input#submit1 {width:30px; height:26px; position:absolute; top:10px; right:20px;}

form input.submit2 {  width: auto; float:none;}

form input.radio, input.submit2, input.checkbox {
  width: auto;
}



form textarea {
  width:200px;
  height: 100px;
}

/* Hack to make sure the floated radio buttons
   sit next to the labels correctly in IE/Mac*/

/* This is the style I want IE/Mac to see */
form input.radio + label {
  text-indent: 2em;
}

/* Using the commented backslash filter, I'm resetting
   the above rule for everything other than IE5/Mac \*/
form input.radio + label {
  text-indent: 0;
}

/* highlight a section of text.  use wherever! */
.highlight_div {background:#940F2B; color: #ffffff; padding: 10px; border: 3px solid #001D22}
.highlight_div h3 {color: #ffffff !important; font-size: 1.2em !important}
.highlight_div a {color: #ffffff}
.highlight_div span.big {font-size: 1.5em; padding: 5px; display: block}