/*
Theme Name: Energae
Theme URI: http://energaecompany.com/
Description: Theme built for Energae Company
Version: 1.0
Author: Jason Hummel
Author URI: http://humjay.com/
*/

/*
Theme Name: Algae Energae
Theme URI: http://www.algaeenergae.com/
Description: Website Theme for Algae Energae Corporate Site
Version: 1.0
Author: Jason Hummel http://www.humjay.com

TOC:
Reset						// reset default browser styles
Layout						// styles to setup grid
Navigation					// styles for primary navigation
Containers					// content containers that change and style fonts, backgrounds, borders, etc.
Content						// styles for native HTML elements
Forms						// styles for form elements

COLOR REFERENCE:
Light Green:	d8dfa8		// bottom of the content gradient
Green:			c6cd89		// top of the content gradient
Dark Green:		4b5607		// text color
Olive:			afb57b		// color of border around content

*/

/* ========= */
/* = Reset = */
/* ========= */

html,body,div,span,
h1,h2,h3,h4,h5,h6,p,blockquote,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,font,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
dd,dl,dt,li,ol,ul, fieldset,form,label,
legend,table,caption,tbody,tfoot,thead,
tr,th,td,input,button {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	}
	
/* Setting up measurements for site                   */
/* 1em = 10px on the onset. Inheritance applies. YMMV */

body {
	background: #000;
	font: normal normal normal 10px/12.5px Helvetica, Arial, Verdana, sans-serif;
	}

/* ========== */
/* = Layout = */
/* ========== */

/* rows can be inserted within other rows normal usage will require a
/* clearfix class on the row, cols should have a specific width class 
/* 
/* <div class="row clearfix">
/*	<div class="col eight-col">
/*		<div class="row clearfix">
/*			<div class="col seven-col"></div>
/*			<div class="col"></div> <!-- one-col is optional -->
/*		</div>
/*	</div>
/*	<div class="col four-col"></div>
/* </div>
*/

#site {
	margin: auto;
	width: 82em;
	}

.row {
	margin: 1em auto;
	position: relative;
	width: 80em;
	}

	/* \_ */

	.row .row {
		margin: 0 -1em;
		width: auto;
		}

	.col {
		display: inline;
		float: left;
		margin: 0 1em;
		position: relative;
		width: 6em;
		}

	.one-col 		{ width: 6em; }
	.two-col 		{ width: 14em; }
	.three-col 		{ width: 22em; }
	.four-col 		{ width: 30em; }
	.five-col 		{ width: 38em; }
	.six-col 		{ width: 46em; }
	.seven-col 		{ width: 54em; }
	.eight-col 		{ width: 62em; }
	.nine-col 		{ width: 70em; }
	.ten-col 		{ width: 78em; }

/* Positioning Classes */

.left {
	float: left;
	}

.right {
	float: right;
	}

.no-margin {
	margin: 0 auto;
	}

	.clearfix:after {
	    content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
		}

		.clearfix {display: inline-block;}

		/* Hides from IE-mac \*/
			* html .clearfix {height: 1%;}
			.clearfix {display: block;}
		/* End hide from IE-mac */
		
/* ============== */
/* = Navigation = */
/* ============== */

.primary-nav {
	background: url('images/nav_background.png') no-repeat left top;
	padding: 0 1em;
	}
	
	/* \_ */	
	
		#site .primary-nav li {
			height: 34px;
			margin: 0;
			width: 16em;
			}
	
			/* \_ */	
			
				.primary-nav a {
					background: url('images/nav_btn_about.png') no-repeat left -5px;
					display: block;
					height: 75px;
					left: 0;
					outline: none;
					position: absolute;
					text-indent: -9999px;
					bottom: -1px;
					width: 16em;
					z-index: 999;
					}
					
				.primary-nav a:hover {
					background-position: left -107px;
					}
					
				.primary-nav .active a {
					background-position: left -205px;
					cursor: default;
					}
					
				.primary-nav .active a:hover {
					background-position: left -205px;
					cursor: default;
					}
					
				.primary-nav a#nav-news {
					background-image: url('images/nav_btn_news.png');
					}
					
				.primary-nav a#nav-media {
					background-image: url('images/nav_btn_media.png');
					}
					
				.primary-nav a#nav-investor {
					background-image: url('images/nav_btn_investor.png');
					}
					
				.primary-nav a#nav-contact {
					background-image: url('images/nav_btn_contact.png');
					}
					
.side-nav {
	background-image: url('images/side_nav_hover.png'); /* preload the hover */
	border-left: 1px solid #e9eccf;
	border-right: 1px solid #b0b87b;
	}
	
	/* \_ */	
	
		.side-nav li {
			border-top: 1px solid #ffffff;
			border-bottom: 1px solid #919954;
			}
			
			/* \_ */	
			
				.side-nav li a {
					background: url('images/nav_side.png') no-repeat left 50%;
					color: #4b5607;
					display: block;
					font-size: 1.2em;
					padding: 1em 1em 1em 2.5em;
					text-decoration: none;
					}
					
				.side-nav li a:hover {
					background: url('images/nav_side_hover.png') no-repeat left 50%;
					}
.button-nav {
	background-image: url('images/btn_download_hover.png'); /* preload */
	}
	
	/* \_ */	
					
		.button-nav li {
			background: url('images/nav_side.png') no-repeat -50px 50%;
			}
			
			/* \_ */	
			
				.button-nav li a {
					background: url('images/btn_download.png') no-repeat right 50%;
					padding-left:1em;
                                        padding-right: 10em;
					}
					
				.button-nav li a:hover {
					background: url('images/btn_download_hover.png') no-repeat right 50%;
					}

/* ============== */
/* = Containers = */
/* ============== */

.header {
	margin-top: 2em;
	position: relative;
	}
	
.conversion {
	background: url('images/convert_background.png') repeat-x left 50%;
	border: 1px solid #3e371c;
	bottom: 1.5em;
	padding: 0 1em;
	position: absolute;
	right: 2em;
	width: 44em;
	z-index: 1001;
}
	
.main {
	background: #d3d99b url('images/main_backround.png') repeat-x left bottom;
	color: #4b5607;
	line-height: 1.3;
	padding: 0 1.5em;
	position: relative;
	}
	
	/* \_ */	
	
		.content {
			background: #d8dfa8 url('images/content_background.png') repeat-x left top;
			border: 1px solid #afb57b;
			min-height: 300px;
			padding: 2em .5em;
			}
			
		.shadow {
			background: url('images/content_shadows.png') repeat-y -36px top;
			height: 100%;
			left: 0;
			position: absolute;
			top: 0;
			width: 34px;
			z-index: 888;
			}
			
		.right-shadow {
			background-position: -100px top;
			left: auto;
			right: 0;
			}
			
			/* \_ */	
			
				.shadow .top {
					background: url('images/content_shadows.png') repeat-y left top;
					height: 128px;
					width: 34px;
					}
					
				.shadow .bottom {
					background: url('images/content_shadows.png') repeat-y left bottom;
					bottom: 0;
					height: 128px;
					left: 0;
					position: absolute;
					width: 34px;
					}
					
				.right-shadow .top {
					background-position: right top;
					}
					
				.right-shadow .bottom {
					background-position: right bottom;
					}
	
.footer {
	background: url('images/footer_background.png') no-repeat 50% top;
	color: #fff;
	margin-bottom: 1em;
	padding-top: 30px;
	text-align: center;
	}
	
.third-col {
	width: 23.9em;
	}
	
.wide-col {
	width: 44.8em;
	}

.narrow-col {
	width: 29em;
	}
	
#contact .wide-col {
	width: 53em;
	}
	
#contact .narrow-col {
	width: 20em;
	}
	
/* =========== */
/* = Content = */
/* =========== */

h1 {

	width: 260px;
	}
	
	h1 a {
		background: url('images/logo.gif') no-repeat left top;
		display: block;
		font-size: 1px;
		height: 152px;
		text-indent: -9999px;
		}
	
.plain-box {
	font-size: 1.2em;
	}
		
p {
	margin: 1.5em 0;
	}
	
a {
	color: #4b5607;
	outline: none;
	}

.content ol {
   margin: 1em 0 1em 2em;
   list-style-type: decimal;
   }

   /* \_ */

       .content ol li { margin: .5em 0; list-style-type: decimal; };
	
h3 {
	font-size: 1.167em;
	}
	
.third-col h3 {
	text-align: center;
	}
	
.header .btn {
	bottom: -10px;
	cursor: hand;
	position: absolute;
	right: -10px;
	z-index: 1000;
	}
	
.tab {
	background: url('images/tab_right.png') no-repeat right top;
	float: left;
	}
	
	.tab a {
		background: url('images/tab_left.png') no-repeat left top;
		display: block;
		padding: 4px 20px 5px 20px;
	}
		
	.panel {
		width: 77.8em;
	}
		
		
/* ========= */
/* = Forms = */
/* ========= */

.reqtxt,
.emailreqtxt,
.linklove {
	display: none;
	}
	
.failure {
	background: #990000;
	font-size: 1.2em;
	color: #ffffff;
	padding: .5em;
	}
	
.wide-col .failure {
	width: 42.7em;
	}
	
.narrow-col .failure {
	margin: 0 2px 0 6.7em;
	}
	
.conversion .failure {
	margin-top: .5em;
	}
	
.success {
	font-size: 1.6em; 
	margin-top: 2em;
	}
	
.narrow-col .success {
	margin-top: 0;
	}
	
.conversion .success {
	line-height: 1.4;
	margin: 0;
	padding: 1em 0;
	color: #fff;
	}


.cf-ol li {
	margin: .5em 0;
	position: relative;
	}
	
		.float-row,
		.float-row-right,
		.cf-ol li,
		.conversion .cf-sb {
			display: inline;
			float: left;
			}
			
		.float-row-right,
		#li--2, #li--4, #li-3-2,
		.conversion .cf-sb {
			margin-left: 2em;
		}
	
	/* \_ */	
	
		.prompt {
			float: left;
			padding: .5em 1em 0 0;
			text-align: right;
			width: 7em;
			}
			
		.conversion .prompt {
			color: #fff;
			}
			
		.element,
		.cf_li_err {
			display: inline;
			float: left;
			}
			
 			input,
			textarea {
				background: #fff url('images/input_background.png') repeat-x left top;
				border: 1px solid #566115;
				padding: .4em .7em;
				font-size: 1.2em;
				position: relative;
				width: 14.1em;
				}
				
				.conversion .element input.not-text {
					background: none;
					border: none;
					padding: 0;
					width: auto;
					}
				
			textarea {
				height: 100px;
				}
				
			#contact textarea {
				height: 190px;
				}
				
			button {
				background: none;
				margin: 0;
				padding: 0;
				}
				
			/* ----------------------------------------- */
			
			.wide-col input {
				width: 12.1em;
				}
				
			.wide-col textarea {
				width: 34.1em;
				}
				
			.cf-sb {
				margin: 0;
				}
				
			.cf-sb input {
				background: url('images/btn_submit.gif') no-repeat left top;
				border: none;
				font-size: 1px;
				float: right;
				height: 36px;
				text-indent: -9999px;
				width: 132px;
				}

                        .cf-sb input:hover, .cf-sb input.sfhover {
                                background-position: left -36px;
                                }

                        .cf-sb input:active, .cf-sb input.sfdown {
                                background-position: left -72px;
                                }
				
			.conversion .cf-sb {
				bottom: .6em;
				position: absolute;
				right: 1.4em;
				}
				
			.conversion .cf-sb input {
				background: url('images/btn_submit_small.png') no-repeat left top;
				height: 26px;
				}
				
			.conversion .element input {
				width: 8.9em;
				}
				
			.conversion #cf3_field_3 {
				width: 15.65em;
				}
		
				
			

/* ========= */
/* = VCARD = */
/* ========= */
.vcard { border-bottom: 1px solid #97a05e; border-top: 1px solid #fff; padding-bottom: .8em; }
.vcard .map { background: url('images/btn_map.png') no-repeat left top; display: block; height: 26px; margin-top: .8em; text-indent: -9999px; width: 61px; }
.vcard .map:hover { background-position: left -26px; }
.vcard .map:active { background-position: left -52px; }
.vcard p { margin: .8em 0; }
.vcard.first { border-top: none; }
.vcard.last  { border-bottom: none; }
.fn    { font-weight: bold; }
.adr   { margin-bottom: 1em; }


.redraw {
	display: block;
	position: absolute;
	left: -1000px;
	}