/* ==================================== */
/* == ELEMENT ATTRIBUTES FOR SCREENS == */
/* ==================================== */

/* ----------------------- */
/* ELEMENT/CLASS SELECTORS */
/* ----------------------- */

body {	
	color: #444; /* #666666 in concept */
	background: #fffae0 url(../images/backgrounds/body.jpg) repeat-x;
	}
	/* Removed standard abbreviation border */
	.nav * abbr, h1 abbr, h2 abbr, h3 abbr, h4 abbr, h5 abbr, h6 abbr {
		border-bottom: none;
		}
	a {
		color: #000;
		}	
	a:hover {
		text-decoration: none;
		}
	a.needlink {
		background-color: yellow;
		text-decoration: underline;
		}
	ul.big li {
		margin-bottom: 2em;
		}
	ol.steps {
		list-style-type: none;
		margin: 0;
		}
	tr.alt {
		background-color: #fff;
		}
	/* Generic Columns */
	.column1 {
		float: left;
		width: 45%;
		}
	.column2 {
		float: right;
		width: 45%;
		}
	/* Definition lists */
	dl.faq dt:hover {
		cursor: hand;
		}
	dt {
		margin-top: -1px;
		padding: 5px 7px;
		background: transparent url(../../images/icons/arrow-gray.gif) right no-repeat;
		border-top: 1px solid #d9d6d2;
		border-bottom: 1px solid #d9d6d2;
		}
	dt.expand {
		background-image: url(../../images/icons/arrow-gray-down.gif);
		}
	dd {
		color: #000;
		margin-top: 10px;	
		padding: 0 7px;	
		}
		/* Nested definition list */
		dl dl {
			margin: 0 20px;
			}
			dl dl dt {
				margin-top: 10px;
				padding: 0;
				border: 0;
				background: none;
				}
			dl dl dd {
				margin: 0 0 10px 0;
				}
	dt, span.q, span.a {
		font-size: 1.4em;
		font-weight: normal;
		font-family: Georgia, "Times New Roman", Times, serif;
		}
	/* Generic navigation */
	ul.nav {
		margin: 0;
		padding: 0;
		}	
		ul.nav li {
			margin: 0;
			padding: 0;
			list-style-type: none;
			}
			ul.nav a {
				color: #8f989d;
				}		
	/* Generic error messages */
	.error {
		color: red;
		font-weight: bold;
		}
	/* Generic Forms */
	fieldset {
		clear: both;
		width: 450px;
		margin-bottom: 15px;
		}			
		fieldset label {
			margin-right: 1em;
			white-space: nowrap;	
			}
		fieldset.radio label {
			float: left;					
			}
	div.input {
		float: left;
		margin-bottom: 5px;
		padding-right: 4px;	
		}	
		div.input input, div.input select {
			width: 220px;
			height: 1.5em;
			}		
	div.default {
		width: auto !important;
		height: auto !important;	
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		}
		div.default input, div.default select {
		 	width: auto;
			height: auto;			
			}	
	div.checkbox, div.radio {
		clear: both;		
		float: none;
		}	
		div.checkbox input, div.radio input {
			width: auto;
			}		
	div.phone {
		}
		div.phone input {
			width: auto !important;
			}
		div.phone fieldset {
			width: 450px;
			}
	div.address {
		clear: both;
		width: 100%;
		}
		div.address input {
			width: 450px;
			}
	div.zip {
		}
		div.zip input, div.zip select {
			width: 5em;
			}
	div.comment {
		clear: both;
		width: 470px;
		}
		div.comment textarea {
			width: 470px;
			height: 6em;
			}
	div.submit {
		float: none;
		clear: both;
		margin-bottom: 20px;
		padding-top: 10px;
		}
		div.submit * {
			clear: both;
			}
	/* Form focus */
	input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
		background-color: #eee;
		}
	/* PSEUDO-SELECT MENU version 2 GML */
	/* Use with JavaScript */
	div.pseudo-select {
		width: 300px;
		height: auto;
		overflow: hidden;		
		margin-bottom: 20px;
		color: #000;	
		background-color: #fff;	
		border: 1px solid #7f9db9;		
		}
		div.pseudo-select span {
			display: block;
			min-height: 17px;
			padding-top: 2px;
			padding-left: 3px;
			overflow: visible;
			color: #000;
			background: #fff url(../images/indicators/pseudoselect-arrow.gif) right top no-repeat;														
			}
		div.pseudo-select ul {				
			display: block;	
			list-style-type: none;
			width: 300px;
			height: 100px;
			margin: 0;				
			overflow: auto;	
			overflow-x: hidden;
			overflow-y: auto;									
			}
			div.pseudo-select ul a {
				display: block;
				width: 280px;					
				padding-left: 3px;
				color: #000;
				text-decoration: none;
				}
				div.pseudo-select ul a:hover {
					background-color: #b2b4bf;
					}
	
/* --------------------- */
/* SPECIFIC ID SELECTORS */
/* --------------------- */

/* Outer container */
div#main {
	position: relative;
	min-width: 963px; /* Width of content area */
	max-width: 1070px; /* Width of header background image - IE 6 EDIT */
	margin: 0 auto;
	background: transparent url(../images/backgrounds/texture.jpg) bottom right no-repeat;
	}
	/* Header */
	div#header {	
		min-width: inherit;
		max-width: inherit;
		margin-top: -1px; /* Part of "bug" fix - see below */
		height: 700px; /* Height of background image - must keep this height due to gradient */		
		padding: 0 67px;
		background: transparent url(../images/backgrounds/header.jpg) no-repeat; /* Must keep a transparent background so body background image tile shows */
		border-top: 1px solid #fff; /* "Bug" fix for all but IE - must use when all nested elements are positioned relatively and absolutely to keep content at top of container */	
		}
		/* Logo */
		div#logo { /* Must use div selector rather than img selector due to PNG JavaScript for IE 6 */	
			position: absolute;
			z-index: 5;
			top: 0px;
			right: -45px;
			/* REM 
			margin-left: 663px; 
			REPLACED BECAUSE THIS CAUSES PAGE TO SCROLL AT SMALLER RESOLUTIONS */
			}
		/* Main headline */
		div#header h1 {
			position: relative;
			z-index: 1;
			top: 149px;
			width: 400px;
			overflow: visible;
			color: #fff;			
			}
			div#header h1 span.original {
				position: relative;
				z-index: 1;
				/* white-space: nowrap;  ALEX */
				}
			div#header h1 span.shadow {
				position: absolute;
				z-index: 0;
				top: 55px;
				top: 10px; /* ALEX */
				left: 25px;
				left: 0; /* ALEX */
				width: 400px;
				color: #000;
				filter: alpha(opacity=55) blur(add=0, direction=0, strength=10); /* Non-standard, for IE */
				-moz-opacity: .25; /* Non-standard, for Firefox/Mozilla */
				opacity: .25; /* Non-standard, for Opera/Safari */
				}
		/* Header photo - rich media */
		div#header-photo {
			position: absolute;
			top: 35px;
			right: 40px;
			}
			/* Header button */
			div#header-photo p.button {
				position: absolute;
				top: 344px;
				right: 94px;
				}
	/* Navigation */
	div#navigation {
		font-family: Georgia, "Times New Roman", Times, serif;
		}
		div#navigation abbr {
			border: none;
			}
		div#navigation li {
			float: left;
			}
			div#navigation li a {
				display: block; /* Needed for background */
				text-decoration: none;
				}
			div#navigation a:hover, li.selected > a, li.selected > span a { /* First-child selector not supported by IE 6 and below */
				color: #660000;
				background: #fff url(../images/navigation/underline.gif) center no-repeat;
				}
		/* Primary navigation */
		ul.nav-primary {
			position: absolute;
			top: 0px;
			left: 1px;
			}
			ul.nav-primary li {
				}
				ul.nav-primary a {
					padding: 10px 15px;				
					}
				ul.nav-primary a:hover, li.selected > a { /* First-child selector not supported by IE 6 and below */
					padding-bottom: 26px;
					}
				/* Secondary navigation */
				ul.nav-secondary {
					display: none; /* Hide by default */
					position: absolute;
					top: 350px;
					left: 118px;
					}	
				li.selected ul.nav-secondary {
					display: block; /* Show nested navigation when parent is selected */
					}
					/* Navigation "buttons" */
					div#navigation li.button {		
						display: inline-block;						
						margin-left: -9px; /* Custom - IE 6 EDIT */
						padding-left: 21px; /* Width of "left" image */
						line-height: 1em;
						background: transparent url(../images/navigation/secondary-left.png) no-repeat; /* IE 6 EDIT */			
						}
						div#navigation li.button span {	
							position: relative;	
							display: table; /* Firefox bug fix */		
							display: inline-block;
							width: auto;			
							height: 77px; /* Height of "left" and "right" images */
							line-height: 77px; /* Height of "left" and "right" images */
							margin-top: -2px; /* Custom */													
							padding-right: 21px; /* Width of "right" image */		
							font-size: 12px; /* Fixed size for IE */		
							background: transparent url(../images/navigation/secondary-right-extended.png) right top no-repeat; /* IE 6 EDIT */
							}							
							div#navigation ul.nav-secondary a {
								padding: 40px 0 12px; /* Override cascade from primary navigation */
								line-height: 1em;				
								background-color: transparent; /* Override cascade */
								background-position: center bottom; /* Override cascade from primary navigation */
								}	
						/* Specific secondary navigation */
						div#navigation li.secondary-2 {
							margin-top: 3px;
							}
						div#navigation li.secondary-3 {
							margin-top: -10px;
							}			
	/* Content */
	div#content {
		/* IE 6 EDIT */
		padding-bottom: 100px;	
		/* REM 
		margin-top: -240px;
		DOES NOT WORK WITH IE - moved to children elements */	
		}
		div#content div.column1 {
			width: 440px; /* Not exact (535?) - was 440px */
			margin-top: -240px; /* IE 6 EDIT */
			margin-left: 80px; /* IE 6 EDIT */
			}			
		div#content div.column2 {
			width: 413px; /* Not exact - 428 max */
			overflow: visible; /* For BBBS video only... */
			margin-top: -240px; /* IE 6 EDIT */
			margin-right: 10px;			
			padding-top: 7%; /* Space above home page feature */			
			}
			/* Features */
			div#content div.feature {
				text-align: center;			
				}		
			/* Video */
			div#content div#video {
				margin-top: 20px;
				margin-left: 45px;
				}	
/* Footer - outside of main container to allow 100% of browser width */
div#footer {	
	clear: both;
	min-width: 963px;
	height: 74px;
	background: black url(../images/backgrounds/footer.png) repeat-x;
	}
	div#footer p {
		width: 943px;
		margin: 0 auto;
		padding-top: 32px;
		padding-left: 20px;
		color: #999;
		}
	div#footer a {
		color: #999;
		}