/*
..................................................
Filename: _conserve.css
Author: Chad Harrington
Date: 7/26/2010

Supporting Files: reset.css, _global.css
Project: CSS Clean-up

Description: The _conserve.css file is used for
the Conserve section of the site; it contains
styles/rules that are global to Conserve.
..................................................
*/

p {
	font-size: 13px;
	line-height: 18px;
	color: #6e6e6e;
}

/* - top band with section header and horizontal navigation - */

#sectionNav {
	height: 12px;
	padding-bottom: 10px;
	/* background: #f2f2f2; */
	border-bottom: 1px solid #e3e3e3;
}

#sectionNav h2 {
	font-size: 12px;
	line-height: 12px;
	/* margin: 0 0 0 12px;
	padding: 6px 8px; */
	padding-left: 22px;
	float: left;
	margin: 0;
}

#sectionNav h2 a:hover {
	text-decoration: none;
	color: #76d750;
}

ul#sectionNavMenu {
	font-size: 12px;
	line-height: 12px;
	padding-bottom: 10px;
	float: right;
	display:inline;
	margin-right: 20px;
	clear: none;
}

ul#sectionNavMenu li {
	display: inline;
}

ul#sectionNavMenu li a,
ul#sectionNavMenu li a:visited {
	float: left;
	padding: 0 8px;
	color: #666;
}

ul#sectionNavMenu li.last a {
	padding-right: 0;
}

ul#sectionNavMenu li a:hover {
	text-decoration: none;
	color: #76d750;
}


ul#sectionNavMenu li.wheretobuy a {
	padding-right: 0;
}

/*
..................................................
Snippet
..................................................
*/
.snippet {
	margin: 0 40px;
	clear: both;
	overflow: hidden;
}

.snippet h3 {
	font-weight: bold;
	font-size: 20px;
	line-height: 24px;
	margin: 30px 8px 5px 8px;
}

.snippet h3.install {
	margin-top: 18px;
}

.snippet p { margin: 0 8px 5px 8px; }

.snippet img.left {
	float: left;
	margin-right: 20px;
}

.snippet img.right {
	float: right;
	margin-left: 20px;
}

.snippet img.right.padding-right {
	padding-right: 75px;
}

.snippet .padding-top {
	padding-top: 24px;
}

.snippet .thin-column {
	width: 420px;
}
.img-home-energy-monitor {
	padding-bottom: 20px;
}



/*
..................................................
START CONSERVE SPECIFIC RULES
..................................................
*/

.exlporehome ul#sectionNavMenu li.explorehome a,
.products ul#sectionNavMenu li.products a,
.wheretobuy ul#sectionNavMenu li.wheretobuy a,
.explorehome ul#sectionNavMenu li.explorehome a:visited, 
.products ul#sectionNavMenu li.products a:visited, 
.wheretobuy ul#sectionNavMenu li.wheretobuy a:visited { 
	color: #333;
}

.exlporehome ul#sectionNavMenu li.explorehome a:hover,
.products ul#sectionNavMenu li.products a:hover,
.wheretobuy ul#sectionNavMenu li.wheretobuy a:hover,
.explorehome ul#sectionNavMenu li.explorehome a:visited:hover, 
.products ul#sectionNavMenu li.products a:visited:hover, 
.wheretobuy ul#sectionNavMenu li.wheretobuy a:visited:hover { 
	color: #76d750;
}

div.hr {
	width: 760px;
	border-bottom: 1px solid #999;
	margin: 8px auto 15px auto;
}


/*
..................................................
Flash Banner
..................................................
*/
#flashBannerFullbleed { 
	height: 390px; /* Needed for IE */
	position: relative;
	z-index: 3;
}

#flash_box {
	width: 800px;
	height: 390px; /* Needed for IE */
	z-index: 4;
}


/*
..................................................
Product Story
..................................................
*/
#banner-cycle {
	width: 800px;
	height: 390px;
	overflow: hidden;
}

#prod-story {
	background: url("/conserve/images/product-story-bg.jpg") no-repeat 0 0;
}

#prod-intro {
	margin: 0 40px 40px 40px;
	padding: 40px 0 0 0;
}

#prod-intro h3 {
	color: #76d750;
	font-size: 28px;
	line-height: 30px;
	margin: 0 8px 20px 8px;
}

#prod-intro h4 {
	color: #84c047;
	font-size: 22px;
	line-height: 24px;
	font-weight: bold;
	margin: 0 8px 4px 8px;
}

#prod-intro p {
	margin: 0 8px 5px 8px;
}

#prod-intro p.sub-title {
	color: #333333;
	font-size: 18px;
	line-height: 20px;
	margin-bottom: 10px;
}

#prod-intro p.try-suggestions {
	color: #333333;
	font-size: 16px;
	margin-top: 40px;
}

.insight #prod-intro p.try-suggestions {
	margin-top: 0;
}

p.disclaimer {
	font-size: 10px;
	line-height: 12px;
	margin: 30px 20px;
}

#prod-story ul {
	color: #6e6e6e;
	margin: 8px 0;
	padding-left: 15px;
}

#prod-story li {
	list-style: square outside;
	line-height: 15px;
	margin: 8px 0 0 8px;
}

#prod-story-foot {
	width: 780px;
	margin-bottom: 20px;
	margin-left: 20px;
	overflow: hidden;
}

a.prod-details {
	float: left;
	color: #76d750;
	padding-left: 14px;
	background: url("/conserve/images/plus-bullet.jpg") no-repeat left center;
	line-height: 27px;
}

ul#social-links {
	
	margin: 0;
	padding: 0;
	display: block;
	min-width: 100px;
	float: right;
}

ul#social-links li {
	list-style: none;
	display: inline;
	margin: 0 4px 0 0;
}

ul#social-links li a {
	text-decoration: none;
	float: left;
	width: 27px;
	height: 27px;
	line-height: 27px;
	text-indent: -10000px;
	overflow: hidden; 
}

ul#social-links li a.facebook {
	background: url("/conserve/images/facebook.png") no-repeat 0 0;
}

ul#social-links li a.twitter {
	background: url("/conserve/images/twitter.png") no-repeat 0 0;
}

a.buy-now {
	height: 27px;
	position: absolute;
	top: 5px;
	right: 20px;
	padding: 0 14px 0 0;
	font-size: 12px;
	text-decoration: none;
	background: url("/conserve/images/buy-now-btn-bg-right.png") no-repeat top right;
}

a.buy-now span {
	color: #ffffff;
	display: block;
	line-height: 27px;
	padding: 0 0 0 14px;
	background: transparent url("/conserve/images/buy-now-btn-bg-left.png") no-repeat 0 0;
}

.button-wrapper {
	float: left;
    left: 0;
    position: relative;
    padding: 8px 0 20px 8px;
}

a.buy-now-top {
	height: 27px;
	padding: 0 14px 0 0;
	font-size: 12px;
	text-decoration: none;
	background: url("/conserve/images/buy-now-btn-bg-right.png") no-repeat top right;
	display: block;
	
}

a.buy-now-top span {
	color: #ffffff;
	display: block;
	line-height: 25px;
	padding: 0 0 0 14px;
	background: transparent url("/conserve/images/buy-now-btn-bg-left.png") no-repeat 0 0;
	height: 27px;
}

/*
..................................................
Conserve Product Grid
..................................................
*/

#conserve-prod-grid {
	/* background: url("/includes/graphics/divider2-bg.jpg") no-repeat scroll left top transparent; */
	width: 800px;
	padding: 20px 0 16px 0;
	float: left;
	border-top: 1px solid #cccccc;
}

.conserve-home #conserve-prod-grid {
	border-top: 0;
}

a.conservebox-sq,
a.conservebox-long {
	background-position: -200px 0;
	float: left;
}

a.conservebox-sq {
	width: 200px;
	height: 200px;
}

a.conservebox-long {
	width: 200px;
	height: 400px;
}

/* US - Conserve Product Grid */
a#smartavbox { background-image: url("/conserve/images/smartav2-sprite.jpg");}
a#powerswitch { background-image: url("/conserve/images/power-switch-sprite.jpg");}
a#socketbox	{ background-image: url("/conserve/images/socket-sprite.jpg");}
a#valetbox	{ background-image: url("/conserve/images/valet-sprite.jpg");}
a#insightbox { background-image: url("/conserve/images/insight-sprite.jpg");}
a#switchbox	{ background-image: url("/conserve/images/switch-sprite.jpg");}
a#switchavbox { background-image: url("/conserve/images/switchav-sprite.jpg");}
a#surgetimer { background-image: url("/conserve/images/surgetimer-sprite.jpg");}

/* UK - Conserve Product Grid */
a#smartavbox-uk { background-image: url("/uk/conserve/images/smartav-sprite-uk.jpg");}
a#socketbox-uk	{ background-image: url("/uk/conserve/images/socket-sprite-uk.jpg");}
a#valetbox-uk	{ background-image: url("/uk/conserve/images/valet-sprite.jpg");}
a#insightbox-uk { background-image: url("/uk/conserve/images/insight-sprite-uk.jpg");}
a#switchbox-uk	{ background-image: url("/uk/conserve/images/switch-sprite-uk.jpg");}
a#monitor-uk { background-image: url("/uk/conserve/images/home-energy-monitor-sprite-uk.jpg");}

/* DE - Conserve Product Grid */
a#smartavbox-de { background-image: url("/de/conserve/images/smartav-sprite-de.jpg");}
a#socketbox-de	{ background-image: url("/de/conserve/images/socket-sprite-de.jpg");}
a#valetbox-de	{ background-image: url("/de/conserve/images/valet-sprite.jpg");}
a#insightbox-de { background-image: url("/de/conserve/images/insight-sprite-de.jpg");}
a#switchbox-de	{ background-image: url("/de/conserve/images/switch-sprite-de.jpg");}

/* FR - Conserve Product Grid */
a#smartavbox-fr { background-image: url("/fr/conserve/images/smartav-sprite-fr.jpg");}
a#socketbox-fr	{ background-image: url("/fr/conserve/images/socket-sprite-fr.jpg");}
a#valetbox-fr	{ background-image: url("/fr/conserve/images/valet-sprite.jpg");}
a#insightbox-fr { background-image: url("/fr/conserve/images/insight-sprite-fr.jpg");}
a#switchbox-fr	{ background-image: url("/fr/conserve/images/switch-sprite-fr.jpg");}

/* AU - Conserve Product Grid */
a#smartavbox-au { background-image: url("/au/conserve/images/smartav-sprite-au.jpg");}
a#socketbox-au	{ background-image: url("/au/conserve/images/socket-sprite-au.jpg");}
a#valetbox-au	{ background-image: url("/au/conserve/images/valet-sprite.jpg");}
a#insightbox-au { background-image: url("/au/conserve/images/insight-sprite-au.jpg");}
a#switchbox-au	{ background-image: url("/au/conserve/images/switch-sprite-au.jpg");}
a#switchavbox-au	{ background-image: url("/au/conserve/images/switch-sprite-au.jpg");}



a.conservebox-sq:hover,
a.conservebox-long:hover { 
	background-position: 0 0;
	text-decoration: none;
}

.conservebox-long h4,
.conservebox-sq h4 {
	color: #84c047;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	width: 190px;
}

.conservebox-long h4 {
	margin: 330px auto 0 auto;
}

.conservebox-sq h4 {
	margin: 130px auto 0 auto;
}

.conservebox-sq h4.surge {
	color: #3197c8;
	margin-bottom: 3px;
}

.conservebox-long p,
.conservebox-sq p {
	font-size: 12px;
	line-height: 16px;
	margin: 0 auto;
	width: 190px;
	text-indent: 1px;
}

p.subhead {
	color: #333333;
	font-weight: bold;
	margin-bottom: 0;
	font-size: 12px;
}

p.sub {
    width: 180px;
    color: #666;
    font:normal 12px/16px helvetica,sans-serif;
    margin: 136px 0 0 20px;
}

#smartavbox p.sub {
    margin-top: 336px;
}

/* only for Where to Buy conserve product grid */
p.buynow {
	color: #76d750;
	text-indent: 9px;
	line-height: 16px;
	background: url("/conserve/images/blue-plus.gif") no-repeat left center;
}

a.conservebox-long:hover p.buynow,
a.conservebox-sq:hover p.buynow {
	text-decoration: underline;
}


/*
..................................................
Where to Buy page
..................................................
*/
#w2b {
	width: 800px;
	background: url("/conserve/images/product-story-bg.jpg") no-repeat 0 0;
	padding-bottom: 40px;
}

#w2b h3 {
	font-size: 28px;
	line-height: 36px;
	font-weight: bold;
	width: 500px;
	padding: 22px 0 0 20px;
}

#w2b p {
	font-size: 14px;
	width: 500px;
	margin: 5px 20px 10px 22px;
}

#w2b a {
	display: inline-block;
	margin: 25px 0 0 25px;
}

/*
..................................................
Conserve Products page
..................................................
*/
#conserve-prod-banner {
	width: 800px;
	height: 130px;
	border-top: 1px solid #d3d3d3;
	background: url("/conserve/images/conserve-prod-banner-bg.jpg") no-repeat 0 0;
}

#conserve-prod-banner h3 {
	font-size: 28px;
	line-height: 36px;
	font-weight: bold;
	width: 500px;
	padding: 22px 0 0 20px;
}

#conserve-prod-banner h3 span {
	font-weight: normal;
}

#conserve-prod-banner p {
	font-size: 14px;
	width: 480px;
	margin: 5px 20px 10px 22px;
}


/*
..................................................
Product Detail page
..................................................
*/
a#cnsrvPrd {
	font-size: 18px;
	line-height: 20px;
	text-decoration: none;
	color: #84c047;
	display: block;
	width: 274px;
	height: 54px;
	margin: 0 32px 30px 33px;
	padding: 65px 461px 0 0;
	background: url("/conserve/images/propage_conserveban.png") no-repeat 0 0;
}

/*
..................................................
Possibly add to _global.css
..................................................
*/
.clearAll {
	margin:0;
	padding: 0;
	clear: both;
	line-height: 0;
}

#banner-wrap {
	height: 390px;
	width: 800px;
	position: relative;
}

#banner-wrap h3 {
	color: #fff;
	font-size: 21px;
	font-weight: 100;
	letter-spacing: 1.3px;
	margin: 0;
	padding: 0;
	position: absolute;
	bottom: 40px;
	left: 40px;
	z-index: 2;
}