/*
	design.css (extends core.css)
	contains all design specific colors, images and text formatting
	
	All style rule attributes in alpha-numeric order starting from 0-9 A-Z
	x = horizontal, y = vertical
	property: trbl, tb rl, t rl b, t r b l;
	
	-- START ALL STYLES --
*/

/* import additional sheets
----------------------------------------------------------------------------- */

@import url("core.css");

/* design specific presentational elements
----------------------------------------------------------------------------- */

body{
	background: #FFF url(img/cl_header_bg.gif) repeat-x 0 0;
	color: #333;
	font: normal normal 12px "Arial", Sans-Serif;
}

/* global text presentation
----------------------------------------------------------------------------- */

code, samp, kbd, var{ font-family: "Courier New", "Courier", Monospace; }

h1, h2, h3, h4, h5, h6, b, strong{ font-weight: bold; }
i, em, cite, dfn, ins{ font-style: italic; }
del, code, samp, kbd, var{ font-style: inherit; }

del{ text-decoration: line-through; }
ins{ text-decoration: none; }

abbr, acronym{ border: 0; cursor: help; text-decoration: none; }

h1{ font-size: 24px; }
h2{ font-size: 20px; }
h3{ font-size: 18px; }
h4{ font-size: 16px; }
h5{ font-size: 14px; }
h6{ font-size: 13px; }

ul, dl{ list-style: square; }
ol{ list-style: decimal; }

li, dt, dd,
p, pre, address,
legend, label, input, textarea, 
select, option, optgroup,
th, td{ font: inherit; }

small{ font-size: 10px; } 	/* 2px smaller, than body base */
big{ font-size: 14px; } 	/* 2px larger, than body base */

img.float-left,
img.float-right{
	background: #FFF;
	border: 0;
	margin: 3px 10px 5px;
	padding: 0;
}

img.float-left{ margin-left: 0; }
img.float-right{ margin-right: 0; }

img.nb{ border: 0; padding: 0; }

/* hyperlinks
----------------------------------------------------------------------------- */

a:link, 
a:visited{
	color: #0762A1; 
	text-decoration: none; 
}

a:hover, 
a:active,
a:link.act,
a:visited.act{ color: #333; }

#column a:link, 
#column a:visited{ text-decoration: underline; }

#column a:link.button, 
#column a:visited.button{
	background: #157801 url(img/cl_button_fill.gif) repeat-x 0 0;
	color: #FFF; 
	display: block;
	float: left;
	text-decoration: none; 
	text-transform: capitalize;
}

	a:link.button span, 
	a:visited.button span{ 
		background: transparent url(img/cl_button_right.gif) no-repeat 100% 0;
		display: block;  
	}

		a:link.button span span, 
		a:visited.button span span{ 
			background: transparent url(img/cl_button_left.gif) no-repeat 0 0;
			display: block; 
			padding: 3px 7px 3px; 
		}

a:hover.button, 
a:active.button{ color: #FFF; }

/* forms
----------------------------------------------------------------------------- */

#column form{
	background: #F5F5F5;
	border: solid #E5E5E5;
	border-width: 0 1px 1px 0;
	padding: 5px 10px 10px;
}

	#column form h4{ 
		background: #E5E5E5;
		margin: 0 0 10px;
		padding: 5px;
	}

	#column form ul{ list-style: none; margin: 15px 0 0; }

fieldset{
	border: 1px solid #E5E5E5;
	margin: 5px 0 10px;
	padding: 10px 10px 1px;
}

	fieldset.button{
		border: 0;
		margin: 0;
		padding: 0;
	}

label{
	color: #0762A1;
	display: block;
	font-size: 13px;
	font-weight: bold;
	padding: 3px 0;
}

input,
select,
textarea{
	background: #FFF;
	border: 1px solid;
	border-color: #AAA #CCC #CCC #AAA;
	margin: 0 0 10px;
	padding: 3px 5px;
	width: 250px;
}

textarea{ height: 150px; width: 450px; }

select,
.button input,
.chad input{ width: auto; }

.button input{
	background: #0762A1;
	border: 0;
	color: #FFF;
	margin: 0;
	text-transform: uppercase;
}

.chad input{ 
	background: transparent; 
	border: 0; 
	padding: 0; 
	vertical-align: top; 
}

/* design specific presentational ID's
----------------------------------------------------------------------------- */

#wrap{
	margin: 0 auto;
	width: 830px;
}

#masthead{
	background: transparent url(img/cl_header_overlay.gif) no-repeat 100% 100%;
	height: 65px;
	padding: 39px 0 0;
	position: relative;
}

	#masthead h1{
		background: transparent url(img/cl_logo.gif) no-repeat 0 0;
		height: 47px;
		text-indent: -130000em;
		width: 163px;
	}
	
		#masthead h1 a:link,
		#masthead h1 a:visited{ 
			display: block;
			height: 47px;
			width: 163px;
		}

	#masthead ul{
		background: transparent url(img/cl_top_nav_bg.gif) no-repeat 0 0;
		list-style: none;
		height: 26px;
		padding: 6px 0 0;
		position: absolute;
		right: 0;
		top: 0;
		width: 121px;
	}
	
		#masthead ul li{ 
			display: inline;
			font-size: 11px;
			letter-spacing: 1px;
			padding: 0 10px; 
			text-transform: capitalize;
		}
	
	#masthead a:link,
	#masthead a:visited{ color: #FFF; }
	
	#masthead a:hover,
	#masthead a:active{ color: #CCC; }

#contentwrap{ padding: 25px 0; }

#navigation{
	list-style: none;
	float: left;
	margin-right: 20px;
	width: 160px;
}

    .index #navigation{
        background: transparent url(img/energystar_vert.png) no-repeat center bottom;
        padding: 0 0 125px;
    }
    
	.subpage #navigation{
		background: transparent url(img/cl_schooldude_graphic.gif) no-repeat center bottom;
		padding: 0 0 95px;
	}
    
	#navigation li{
		margin: 0 0 4px;
		text-transform: capitalize;
	}
	
	#navigation a:link,
	#navigation a:visited{
		background: #3B434D url(img/cl_nav_bg.gif) no-repeat 0 -25px;
		color: #FFF;
		display: block;
		padding: 5px 10px 6px;
	}
	
	#navigation a:hover,
	#navigation a:active,
	#navigation a:link.act,
	#navigation a:visited.act{ background-position: 0 0; }

#column{
	float: left;
	width: 650px;
}

	#column h2{
		color: #0762A1;
		font-size: 36px;
		letter-spacing: -1px;
		padding: 10px 0 0;
	}
	
		.subpage #column h2{
			font-size: 24px;
			padding: 0 0 5px;
		}
	
	#column h3{
		color: #009900;
		font-size: 18px;
		margin: -5px 0 15px;
		padding: 0;
	}
	
		.subpage #column h3{ font-size: 16px; }
	
	#column h4{
		color: #0762A1;
		font-size: 16px;
		margin: 0 0 -15px;
		padding: 0;
	}
	
	#column ul,
	#column ol{ 
		font-size: 13px;
		margin: 15px 10px 15px 35px; 
	}
	
	#column ol li{ padding: 5px 0; }
	
	#column ul.morelinks{ margin: 0; }
		
	#column p{ 
		font-size: 14px;
		margin: 15px 0; 
	}
	
		#column p.ad{ margin: 0; }
	
		#column p strong{ color: #0762A1; }
		
		.subpage #column p{ font-size: 13px; }
	
		.subpage #column p strong{ color: #333; }
	
	#column sup{ font-size: 9px; }
	
	#column address{ margin: 15px 0; }
	
	#column address.float-right{
		background: #E5E5E5;
		font-size: 14px; 
		padding: 15px; 
	}

#sidebar{
	float: right;
	margin-left: 15px;
	width: 280px;
}

	#sidebar h2{
		background: #3B434D url(img/cl_box_header.gif) no-repeat 0 0;
		color: #FFF;
		font-size: 16px;
		font-weight: normal;
		letter-spacing: 0;
		padding: 5px 10px;
	}
	
		#sidebar h2 sup{
			color: #CCC;
			font-size: 10px;
		}
		
	#sidebar p{
		font-size: 12px;
		margin: 10px 0;
	}

#footerwrap{ 
	background: transparent url(img/cl_footer_bg.gif) repeat-x 0 0; 
	padding: 30px;
}

#footer{
	margin: 0 auto;
	width: 830px;
}

	#footer ul{ list-style: none; }
	
		#footer ul.legal{
			border-top: 1px solid #999;
			margin-top: 15px;
			padding-top: 15px;
		}
	
		#footer li{ padding: 2px 0; text-transform: capitalize; }
	
			#footer li a:link,
			#footer li a:visited{ color: #666; }
	
			#footer li a:hover,
			#footer li a:active{ color: #0762A1; }
	
	address span.adr,
	address span.tel,
	address span.email,
	address span.street-address{ display: block; margin: 3px 0; }

/* design specific presentational classes
----------------------------------------------------------------------------- */

.box{
	background: transparent url(img/cl_box_bottom.gif) no-repeat 100% 100%;
	margin: 0 0 15px;
	padding: 1px 10px 10px;
}

.half-box{ width: 300px; }

.column,
.columnb,
.columnc{ float: left; }

.column{ margin-left: 180px; }

.columnb{ margin: 0 50px 0 115px; }

.morelinks{ list-style: none; }

.morelinks li{
	font-size: 14px;
	padding: 5px 0;
}

.morelinks a:link,
.morelinks a:visited{
	background: transparent url(img/cl_arrow_icon.gif) no-repeat left;
	padding: 5px 0 5px 17px;
}

/*
	-- /END ALL STYLES --
	
	- Please do not steal my code!
	- "I cannot abide useless people"
	- Thank you, I appreciate it.
*/