@charset "UTF-8";
/* CSS Document */

/* ---------------------------------------------------------------------------------[ GENERAL ] ---*/

* {
	margin: 0;
	padding: 0;
	}
	
.clear {
	clear: both;
	}
	
	
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%; /* 16px */
	line-height: 1.15em;
	color: #666;
	text-align: center;
	background-color: #fff;
	margin: 15px 0;
}

#wrapper {
	text-align: left;
	margin: 0 auto;
	background: #fff url(../images/bg.gif) repeat-y;
	width: 943px;
	}
	

/* ---------------------------------------------------------------------------------[ HOMEPAGE SPECIFIC STYLES ] ---*/


	
#home-container { 
	background: url(../images/masthead-home.png) no-repeat top left;
	width: 943px;
	}
	
#home-masthead {
	width: 650px;
	margin-bottom: 40px;
	}
	
#home-logo {
	float: left;
	width: 204px;
	height: 84px;
	background: url(../images/logo_home.png) no-repeat;
	margin: 13px 25px 0 13px;
	}
	
#home-logo a { 
	display:block;
	text-indent:-9999px;
	width: 204px;
	height: 84px; 
	}
	
#home-featuredCover {
	float: right;
	}
	
#home-contentContainer {
	padding: 0 25px 25px 25px;
	}
	
#home-lColumn {
	float: left;
	width: 675px;
	margin: 22px 0 0 0;
	}	
	
#home-rColumn {
	float: right;
	width: 212px;
	margin: 22px 0 0 0;
	}
	

	

/* ---------------------------------------------------------------------------------[ TEXT FORMATTING ] ---*/


p, td, th {
	font-size: 0.75em;
	}
	
a {
	color: #5495b3;
	text-decoration: none;
	}
	
a:hover {
	color: #81b867;
	}
	
h1 {
	color: #5495b3;
	font-size: 1.30em;
	margin-bottom: 5px;
	font-weight: normal;
	line-height: 1.30em;
	}
	
h2 {
	color: #333;
	font-size: 1.5em;
	font-weight: normal;
	padding-top: 1px;
	}
	
h3 {
	font-size: 1em;
	color: #333;
	margin-bottom: 10px;
	}
	
#bulletedList {
	margin-left: 25px;
	}
	
#bulletedList li {
	list-style: disc;
	line-height: 1.30em;
	padding-top: 8px;
	}
	
ul li {
	list-style: none;
	padding-top: 8px;
	font-size: 0.75em;
	line-height: 1em;
	}
	
ul li li {
	list-style: none;
	padding-top: 8px;
	margin-left: 10px;
	font-size: 1em;
	}
	
.small {
	font-size: 0.625em;
	}
	

	
	
	
	
/* ---------------------------------------------------------------------------------[ MASTHEAD AREA ] ---*/
	
#toplinks {
	font-size: 0.75em;
	width: 900px;
	margin: 0 auto;
	text-align: right;
	}		
	
#masthead {
	width: 943px;
	background: #5495b3 url(../images/masthead.png);
	height: 145px;
	}
	
#logo {
	float: left;
	width: 248px;
	height: 126px;
	background: url(../images/logo_lg.png) no-repeat;
	}
	
#logo a { 
	display:block;
	text-indent:-9999px;
	width: 248px;
	height: 126px; 
	}
	
#featuredCover {
	float: right;
	margin: 21px 22px 0 0;
	width: auto;
	}
	


/* ---------------------------------------------------------------------------------[ CONTENT AREA ] ---*/

#contentContainer {
	margin: 25px;
	}
	
#lColumn {
	float: left;
	width: 675px;
	}	
	
#rColumn {
	float: right;
	width: 212px;
	}
	
p.introText {
	font-size: .82em;
	color: #5495b3;
	}
	
#featuredArticleContainer {
	margin: 20px 0;
	}
	




/* ---------------------------------------------------------------------------------[ FEATURED ARTICLE BOXES ON HOMEPAGE ] ---*/

.featuredArticleBox			{ width: 212px; background: #fff; border: 1px solid #87b4c9; position: relative; margin: 10px 0; float: left; margin-right: 10px; }
.featuredArticleBox .tl		{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl.gif); top: -1px; left: -1px; }
.featuredArticleBox .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif); position: absolute; top: -1px; right: -1px; }
.featuredArticleBox .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif); position: absolute; bottom: -1px; left: -1px; }
.featuredArticleBox .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif); position: absolute; bottom: -1px; right: -1px; }
.featuredArticleBox .inside	{ padding: 10px; }

.featuredArticleBox	p {
	margin: 10px 0;
	}
	
.featuredArticleBox.last {
	margin-right: 0;
	}
	
img.photo {
	border: 1px solid #d5e5ec;
	}
	
	
/* ---------------------------------------------------------------------------------[ HOMEDEPOT SPECIAL OFFER BOX ] ---*/

.specialOfferBox			{ width: 212px; background: #ebebeb; border: 1px solid #ebebeb; position: relative; margin-bottom: 10px; }
.specialOfferBox .tl		{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl_gray.gif); top: -1px; left: -1px; }
.specialOfferBox .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr_gray.gif); position: absolute; top: -1px; right: -1px; }
.specialOfferBox .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl_gray.gif); position: absolute; bottom: -1px; left: -1px; }
.specialOfferBox .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br_gray.gif); position: absolute; bottom: -1px; right: -1px; }
.specialOfferBox .inside	{ padding: 10px; }

.specialOfferBox img.homedepot {
	padding-left: 3px;
	float: right;
	}
	
.specialOfferBox strong {
	color: #000;
	}
	
.specialOfferBox h3 {
	color: #dd4e22;
	}
	
	
	
	
/* ---------------------------------------------------------------------------------[ BLUE BOX -- RIGHT COLUMN AREA ON HOMEPAGE] ---*/

.rColumnBoxBlue			{ width: 212px; background: #87b4c9; border: 1px solid #87b4c9; position: relative; margin-bottom: 10px; }
.rColumnBoxBlue	 .tl	{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl_blue.gif); top: -1px; left: -1px; }
.rColumnBoxBlue	.tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr_blue.gif); position: absolute; top: -1px; right: -1px; }
.rColumnBoxBlue	.bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl_blue.gif); position: absolute; bottom: -1px; left: -1px; }
.rColumnBoxBlue	.br		{ width: 5px; height: 5px; background: url(../images/rcorners/br_blue.gif); position: absolute; bottom: -1px; right: -1px; }
.rColumnBoxBlue	.inside	{ padding: 10px; }

.rColumnBoxBlue	p {
	margin: 10px 0;
	color: #fff;
	}
	
.rColumnBoxBlue	h3 {
	color: #2b4e5d;
	}
	
.rColumnBoxBlue	strong {
	color: #2b4e5d;
	}
	
.rColumnBoxBlue	a {
	color: #2b4e5d;
	}

.rColumnBoxBlue	a:hover {
	text-decoration: underline;
	}
	
	
	
	
	
	
/* ---------------------------------------------------------------------------------[ STANDARD BOX -- RIGHT COLUMN AREA ON HOMEPAGE ] ---*/

.rColumnBox				{ width: 212px; background: #fff; border: 1px solid #87b4c9; position: relative; margin-bottom: 10px; }
.rColumnBox	 .tl		{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl.gif); top: -1px; left: -1px; }
.rColumnBox	 .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif); position: absolute; top: -1px; right: -1px; }
.rColumnBox	 .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif); position: absolute; bottom: -1px; left: -1px; }
.rColumnBox	 .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif); position: absolute; bottom: -1px; right: -1px; }
.rColumnBox	 .inside	{ padding: 10px; }

.rColumnBox		p {
	margin: 10px 0;
	}
	
.rColumnBox h3 {
	color: #5495b3;
	}
	
.rColumnBox h4 {
	font-size: 1em;
	color: #333;
	margin-bottom: 10px;
	}
	
.rColumnBox strong {
	color: #000;
	}
	

	
	
	
	
	
/* ---------------------------------------------------------------------------------[ RESOURCES AREA ] ---*/

.resourcesContainer			{ width: 660px; background: #fff; border: 1px solid #87b4c9; position: relative; margin: 10px 0; }
.resourcesContainer	 .tl	{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl.gif); top: -1px; left: -1px; }
.resourcesContainer .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif); position: absolute; top: -1px; right: -1px; }
.resourcesContainer .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif); position: absolute; bottom: -1px; left: -1px; }
.resourcesContainer	 .br	{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif); position: absolute; bottom: -1px; right: -1px; }
.resourcesContainer .inside	{ padding: 10px; }

.resourcesContainer	p {
	margin: 10px 0;
	}
	
.resourcesContainer h3 {
	color: #333;
	margin-top: 25px;
	margin-bottom: 0;
	}
	
.resourcesContainer h3.first {
	color: #333;
	margin-top: 0;
	}
	
.resourcesContainer strong {
	color: #000;
	}
	
	
#resourcesLColumn {
	float: left;
	width: 300px;
	}
	
#resourcesRColumn {
	float: right;
	width: 300px;
	}



/* ---------------------------------------------------------------------------------[ ARTICLE INTRO AREA (includes anchor links and photo ] ---*/

#articleIntro {
	margin: 25px 0;
	}
	
#articleBrief {
	float: left;
	width: 340px;
	margin-right: 15px;
	}

#articleBrief p {
	padding-bottom: 10px;
	}

	
#articleBrief a {
	font-size: 1.25em;
	margin-top: 10px;
	font-weight: bold;
	}
	
#articlePhoto {
	float: left;
	width: 300px;
	}
	
	
/* ---------------------------------------------------------------------------------[ ARTICLE CONTENT AREA ] ---*/

.articleContent			{ width: 660px; background: #fff; border: 1px solid #87b4c9; position: relative; margin: 10px 0; }
.articleContent	 .tl	{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl.gif); top: -1px; left: -1px; }
.articleContent .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif); position: absolute; top: -1px; right: -1px; }
.articleContent .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif); position: absolute; bottom: -1px; left: -1px; }
.articleContent	 .br	{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif); position: absolute; bottom: -1px; right: -1px; }
.articleContent .inside	{ padding: 10px; }

.articleContent	p {
	margin: 10px 0;
	}
	
.articleContent h3 {
	color: #5495b3;
	margin-top: 25px;
	margin-bottom: 0;
	}
	
.articleContent h3.first {
	color: #5495b3;
	margin-top: 0;
	}
	
.articleContent strong {
	color: #000;
	}
	
.articleContent table {
	border: 1px solid #666;
	text-align: left;
	}
	
.articleContent td {
	padding: 10px;
	}
	
.articleContent th {
	border-bottom: 1px solid #666;
	padding: 10px;
	}
	
.articleContent tr {
	vertical-align: top;
	}
	
.magcovers {
	float: left;
	width: 83px;
	margin: 4px 8px 4px 0;
	}
	


/* ---------------------------------------------------------------------------------[ GREEN BOX -- USE AS A BLOCKQUOTE OR CALLOUT BOX IN ARTICLE ] ---*/
	
.CalloutBoxGreen			{ width: 450px; background: #81b867; border: 1px solid #81b867; position: relative; margin: 15px auto; }
.CalloutBoxGreen	 .tl	{ width: 5px; height: 5px; background: url(../images/rcorners/tl_green.gif) no-repeat; position: absolute; top: -1px; left: -1px; }
.CalloutBoxGreen	.tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr_green.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
.CalloutBoxGreen	.bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl_green.gif) no-repeat; position: absolute; bottom: -1px; left: -1px; }
.CalloutBoxGreen	.br		{ width: 5px; height: 5px; background: url(../images/rcorners/br_green.gif) no-repeat; position: absolute; bottom: -1px; right: -1px; }
.CalloutBoxGreen	.inside	{ margin-bottom: 0; }

.CalloutBoxGreen	p {
	color: #fff;
	}
	
.CalloutBoxGreen	h3 {
	color: #4b6c3c;
	font-size: .90em;
	margin: 0;
	}
	
.CalloutBoxGreen	strong {
	color:#4b6c3c;
	}
	
.CalloutBoxGreen	a {
	color: #4b6c3c;
	}

.CalloutBoxGreen	a:hover {
	text-decoration: underline;
	}
	
.CalloutBoxGreen img {
	float: right;
	margin-left: 5px;
	}



/* ---------------------------------------------------------------------------------[ FOOTER ] ---*/

#footer {
	width: 943px;
	height: 65px;
	background: #fff url(../images/footer.jpg) no-repeat;
	padding-bottom: 15px;
	clear: both;
	}
	
#footer2 {
	width: 923px;
	margin: 0 auto;
	text-align: left;
	}
	
#footer2 p {
	font-size: 0.75em;
	line-height: 1.3em;
	font-color: #999;
	margin-bottom: 15px;
	}
	
#footer a {
	font-size: 0.75em;
	margin-bottom: 10px;
	}
	
#footer2 h6 {
	font-size: 1.5em;
	color: #999999;
	margin-bottom: 10px;
	}
	
#footer2 sup {
	font-size: 0.58em;
	}
	


/* ---------------------------------------------------------------------------------[ IE6 ] ---*/

*html .featuredArticleBox			{ width: 212px; background: #fff; border: 1px solid #87b4c9; position: relative; margin: 10px 0; float: left; margin-right: 10px; }
*html .featuredArticleBox .tl		{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl.gif) no-repeat; top: -1px; left: -1px; }
*html .featuredArticleBox .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
*html .featuredArticleBox .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif) no-repeat; position: absolute; bottom: -15px; left: -1px; }
*html .featuredArticleBox .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif) no-repeat; position: absolute; bottom: -15px; right: -1px; }
*html .featuredArticleBox .inside	{ padding: 10px; }
	
	
*html .resourcesContainer			{ width: 660px; background: #fff; border: 1px solid #87b4c9; position: relative; margin: 10px 0; }
*html .resourcesContainer .tl		{ position: absolute; width: 5px; height: 5px; background: url(../images/rcorners/tl.gif) no-repeat; top: -1px; left: -1px; }
*html .resourcesContainer .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
*html .resourcesContainer .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif) no-repeat; position: absolute; bottom: -15px; left: -1px; }
*html .resourcesContainer .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif) no-repeat; position: absolute; bottom: -15px; right: -1px; }
*html .resourcesContainer .inside	{ padding: 10px; }

*html .CalloutBoxGreen			{ width: 450px; background: #81b867; border: 1px solid #81b867; position: relative; margin: 15px auto; }
*html .CalloutBoxGreen	.tl		{ width: 5px; height: 5px; background: url(../images/rcorners/tl_green.gif) no-repeat; position: absolute; top: -1px; left: -1px; }
*html .CalloutBoxGreen	.tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr_green.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
*html .CalloutBoxGreen	.bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl_green.gif) no-repeat; position: absolute; bottom: -14px; left: -1px; }
*html .CalloutBoxGreen	.br		{ width: 5px; height: 5px; background: url(../images/rcorners/br_green.gif) no-repeat; position: absolute; bottom: -14px; right: -1px; }
*html .CalloutBoxGreen	.inside	{ padding: 10px; }

*html .articleContent			{ width: 660px; background: #fff; border: 1px solid #87b4c9; position: relative; margin: 10px 0; }
*html .articleContent .tl		{ width: 5px; height: 5px; background: url(../images/rcorners/tl.gif) no-repeat; position: absolute; top: -1px; left: -1px; }
*html .articleContent .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
*html .articleContent .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif) no-repeat; position: absolute; bottom: -15px; left: -1px; }
*html .articleContent .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif) no-repeat; position: absolute; bottom: -15px; right: -1px; }
*html .articleContent .inside	{ padding: 10px; }

*html .rColumnBox				{ width: 212px; background: #fff; border: 1px solid #87b4c9; position: relative; margin-bottom: 10px; }
*html .rColumnBox	 .tl		{ width: 5px; height: 5px; background: url(../images/rcorners/tl.gif) no-repeat; position: absolute; top: -1px; left: -1px; }
*html .rColumnBox	 .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
*html .rColumnBox	 .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl.gif) no-repeat; position: absolute; bottom: -14px; left: -1px; }
*html .rColumnBox	 .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br.gif) no-repeat; position: absolute; bottom: -14px; right: -1px; }
*html .rColumnBox	 .inside	{ padding: 10px; }

*html .rColumnBoxBlue			{ width: 212px; background: #87b4c9; border: 1px solid #87b4c9; position: relative; margin-bottom: 10px; }
*html .rColumnBoxBlue	 .tl	{ width: 5px; height: 5px; background: url(../images/rcorners/tl_blue.gif) no-repeat; position: absolute; top: -1px; left: -1px; }
*html .rColumnBoxBlue	.tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr_blue.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
*html .rColumnBoxBlue	.bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl_blue.gif) no-repeat; position: absolute; bottom: -14px; left: -1px; }
*html .rColumnBoxBlue	.br		{ width: 5px; height: 5px; background: url(../images/rcorners/br_blue.gif) no-repeat; position: absolute; bottom: -14px; right: -1px; }
*html .rColumnBoxBlue	.inside	{ padding: 10px; }

*html .specialOfferBox			{ width: 212px; background: #ebebeb; border: 1px solid #ebebeb; position: relative; margin-bottom: 10px; }
*html .specialOfferBox .tl		{ width: 5px; height: 5px; background: url(../images/rcorners/tl_gray.gif) no-repeat; position: absolute; top: -1px; left: -1px; }
*html .specialOfferBox .tr		{ width: 5px; height: 5px; background: url(../images/rcorners/tr_gray.gif) no-repeat; position: absolute; top: -1px; right: -1px; }
*html .specialOfferBox .bl		{ width: 5px; height: 5px; background: url(../images/rcorners/bl_gray.gif) no-repeat; position: absolute; bottom: -14px; left: -1px; }
*html .specialOfferBox .br		{ width: 5px; height: 5px; background: url(../images/rcorners/br_gray.gif) no-repeat; position: absolute; bottom: -14px; right: -1px; }
*html .specialOfferBox .inside	{ padding: 10px; }
