/* 
Title: 		learn2light
Author:		Shane Smith @ MediaBox Communications
Contact:	shane@mediabox.com
Updated:	November 16, 2007
*/


/* This document should contain all pure and valid css rules. 
All hacks required to compensate for IE bugs are maintained in ie.css */


/* =General Rules ***********************************/
div.clearer {clear:both; line-height:0; height:0; margin:0; padding:0; border: 1px solid #313131; }

/* The default size for "medium" text in all modern browsers is 16px. 
We will reduce the size for the entire document to small using relative keywords:
This takes 16px down to roughly 12px, which is a bit more elegant for a relative base */

html, body {height: 100%; max-height:100%;}
body {
	color: #fff;
	margin: 0;
	padding: 0; 
	text-align:center;
	background-color: #000;
	font: small "Lucida Grande", Lucida, Verdana, sans-serif;
}

/* @group General Classes */

p { margin: 0 0 1.2em;}
p.nomargin {margin: 0} /*so p doesn't have space below*/
img {
	float: left;
	margin: 5px 16px 10px -186px;
	display: block;
	position: relative; /*need this for IE to make visible*/
}

/* @end */



/* @group Links */

a {text-decoration:none; cursor:pointer; color:#9cf; background-color: transparent; padding-bottom: 1px; border-bottom: 2px hidden #444;}
a:hover { padding-bottom: 1px; border-bottom: 2px solid #444;}
a img {border:none;} /* remove border for all linking graphics */

a.linkEmail {background: transparent url("img/mail_icon.gif") no-repeat 100% 0; padding-right:17px;}
a.linkEmail:hover {background: transparent url("img/mail_icon.gif") no-repeat 100% -50px;}

a.linkExternal {background: transparent url("img/external_icon.gif") no-repeat 100% 0; padding-right:17px;}
a.linkExternal:hover {background: transparent url("img/external_icon.gif") no-repeat 100% -50px;}

/* @end */


/* @group Lists */

li {margin: 0; padding: 0;}
ul {padding-left:16px; margin: 0 0 1.2em;} /* standardize list indents for IE and Mozilla */
ul li {list-style: square outside url("img/nav_rollover.gif");}

/*ol {padding-left:24px; margin:0 0 12px 0;}
ol li {margin: 0 0 12px 0;}

dl {margin: 0 0 12px 0; padding-top: 4px;}
dt {margin: 12px 0 0 0; font-weight:bold; color: #333;}
dd {margin: 0;}*/

/* @end */


/* @group Headings */

h1 { /*logo*/
	width: 542px;
	height: 108px;
	padding-bottom: 25px;
	margin: 0;
	text-indent: -6666px;
}
h1 a, h1 a:hover {
	display: block;
	width: 542px;
	height: 108px;
	background: transparent url("img/learn2light_logo_grey.gif") no-repeat left top;
	text-decoration: none;
	border: none;
	padding: 0;
}

h2 { font-size: 180%;
	font-weight: normal;
	color: #9cf;
	margin-top: 0;
}
		
h3 {font-size: 130%; font-weight: normal; color: #9cf; margin: 0;}
	
h4 {font-size: 100%; font-weight: bold; color: #f3b500; margin: 0;}
h4.inline {padding-right: 6px; float: left; } /*make h4 inline*/

h5 { /* IALD logo */
	width: 170px;
	height: 106px;
	margin-left: 372px;
	text-indent: -6666px;
	clear: both;
}
h5 a, h5 a:hover {
	display: block;
	width: 170px;
	height: 106px;
	background: transparent url("img/iald_logo.gif") no-repeat left top;
	text-decoration: none;
	border: none;
	padding: 0;
}
/* @end */


/* @group Page Structure */

#wrapper {
	width: 100%;
	height:100%;
	margin:0;
	padding:0;
}

#navSecondaryWrap {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #f3b500 url("img/navSecondary_back.jpg") repeat-x left center;
	text-align: left;
	float: left;
	font-size: 90%;
	top: 0;
	left: 0
	;z-index: 5;
	position: fixed;
}
#navPrimaryWrap {
	overflow: visible; /* ensure the div stretches to contain its floats */
	background: #4a4a4a url("img/navPrimary_back.jpg") repeat-x left top;
	height: 149px;
	width: 100%;
	margin: 0;
	padding: 0;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 5;
	border-top: 1px solid #f3b500;
}
#navPrimary {
	width: 760px;
	height: 149px;
	margin: 0 auto;
	text-align: left;
	position: relative;
	overflow: hidden;
}

#contentWrap {
	width: 760px;
	/*height: 100%;  removed now that we need to use a clearer div*/
	background: #313131 url("img/contentWrap_back.jpg") repeat-x fixed;
	margin: 0 auto;
	text-align: left;
}


#content {
	width:542px;
	margin: 0 16px 0 0;
	padding: 64px 0 149px 0; 
	float: right;
	display: inline;
	overflow: visible;
	line-height: 1.7em;
}

#modal_overlay { /*iframe background*/
	background-color:#000;
}

#modal_container { /*iframe container*/
	width:356px;
	padding:10px 16px;
	background-color:#313131;
	border:5px solid #fff;
	overflow:auto;
	/*font-family:"Lucida Grande",Verdana;
	font-size:12px;*/
	color:#fff;
	text-align:left;
}

/* @end */

/* @group Secondary Navigatoin */

ul#navSecondary {
	width: 760px;
	margin:0 auto;
	padding: 0;
}
ul#navSecondary li{
	list-style: none; /* hide the bullets */
	float: left;
	padding: 0;
	margin:0;
}
ul#navSecondary li a {
	float: left;
	padding: 4px 14px;
	text-decoration: none;
	color: #333;
}

ul#navSecondary li a:hover, ul#navSecondary li a.selected {
	color: #fff;
	background: #113b6d url("img/navSecondary_rollover.jpg") left center;
	border-style: none;
}

/* @end */


/* @group Primary Navigation Area */

#navPrimary ul li {	list-style: none none;}
#navPrimary ul {
	font-size: 85%;
	width: 186px;
	margin: 8px 0;
	padding: 0;
	float: left;
}
#navPrimary li {
	margin: 0;
	padding: 0;
	display: inline-block;
}
#navPrimary li a {
	color: #fff;
	margin-right: 16px;
	padding: 3% 0 3% 16px;
	/*background: transparent url("img/nav_rollover.gif") no-repeat right;*/
	overflow: hidden;
	border-style: none;
	display: block;
}
#navPrimary li a:hover, #navPrimary li a.selected {
	background: transparent url("img/nav_rolloverb.gif") no-repeat left top;
	color: #99ccff;
	border-style: none;
}
#navPrimary p {
	position: absolute;
	left: 0;
	bottom: 4px;
	width: 100%;
	text-align: right;
	margin: 0;
	font: 75% Arial, Helvetica, Geneva, sans-serif;
	color: #888;
	clear: both;
}

/* @end */

/* @group iFrame Area */

#modal_container p {font-size: 95%;
	line-height: 1.5em;
	margin-bottom: 0.8em;
}
#modal_container a, #modal_container a:hover {
	padding-right: 12px;
	background: transparent url(img/nav_rollover.gif) no-repeat right center;
	float: right;
	border-style: none;
}

/* @end */

/* @group Forms */

fieldset {
	margin: 3% 0;
	padding: 10px;
	border: 1px solid #fae2a7;
}
legend {
	font-size: 115%;
	color: #600;
	padding: 4px;
}
label {
	display: block;
	font-size: 90%;
}
textarea, input {
	width: 100%;
	margin-bottom: 8px;
	border-top: 2px solid #999;
	border-left: 2px solid #999;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	font: 95% Verdana, Arial, Helvetica, Geneva, sans-serif;
}
input {
	width: 300px;
}
input.submit {
	width: auto;
	background-color: #fae2a7;
	border: 1px solid #f4c44c;
	font: 105% "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #900;
}
textarea {
	height: 100px;
}
.required {
	font-size: 10px;
	color: #600;
}

/* @end */


/* @group Extras */

.sampleBox {width: 100%; margin-bottom: 16px; padding-top: 4px; overflow: auto; border-top: 2px solid #444;}
.samplePhoto,
.sampleText {width:356px; float: left;}
.sampleText {float:right;}

/* @end */




/* @group IDs */
body#home #contentWrap {height: 100%;}
body#home h1 a,
body#home h1 a:hover {background: url("img/learn2light_logo.gif");}

body#samples #content {width: 728px; line-height: 1.4em;}
body#samples h1,
body#samples h2 {margin-left: 186px;}
body#samples h5 {margin-left: 558px;}
body#samples img {float: none; margin: 3px 0 16px 0;}

/* @end */