/* Main Staar.org stylesheet. For everyone viewing in windows larger than 910px in width. */
/* Properties beginning with "_" are hacks that only IE will read                         */

@import "lightbox.css";

html, body {
	height: 100%;
	min-width: 1008px;
	margin: 0;
	padding: 0
} 

a.standout { color: #4b7a87; }
 
body {
	background: #e2e6e8 url(../images/leftbgTile.jpg) repeat-y left top;
	color: #5b5b5b;
	font-family: Arial, Helvetica, sans-serif;
}
	body a {text-decoration: none; color: #918b66;}
	body a:hover {color: #d6cb8d;}

#outer {
	height: 100%;
	line-height: 1.2;
	margin: 0 0 0 149px;
	background: url(../images/rightbgTile.jpg) repeat-y right;
}
 
#header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 226px;
	background: url(../images/headbgTile.gif) repeat-x;
	z-index: 150;
}

#headerGraphic {
	background: url(../images/headerGraphic.jpg) no-repeat top left;
	width: 333px;
	height: 187px;
	margin: 33px 0 0 0;
	float: left;
}

#title {
	width: 353px;
	height: 226px;
	float: right;
	margin: 0 149px 0 0;
	_margin: 0 75px 0 0;
	background: url(../images/title.jpg) no-repeat;
}
	#title h1 {display: none;}
	#title h2 {text-align: right; font-size: 0.9em; font-weight: bold; color: #918b66; width: 348px; margin: 180px 0 0 0;}
	#title ul {padding: 0; margin: 5px 70px 0 0; _margin-right: 35px; list-style: none; float: right; font-size: 0.8em; color: #888888; }
	#title ul li {padding: 0; display: inline;}
	#title ul li a {padding: 0 4px 0 4px;}

#nav {
	margin: 226px 0 5px 0;
	_padding-bottom: 1px;
	text-align: center;
}
	#nav ul {margin: 0; padding: 0; width: 100%;}
	#nav ul li {list-style: none; font-size: 0.9em; font-weight: bold; border-top: 1px solid #aec0c7; border-bottom: 1px solid #aec0c7; background: url(../images/menuItembgTile.gif) repeat-y right;}
	#nav ul li.first {border-top: 2px solid #aec0c7;}
	#nav ul li.last {border-bottom: 2px solid #aec0c7;}
	#nav ul li a {color: #4b7a87; display: block; padding: 11px 20px 11px 0; _width: 100%;}
	#nav ul li a.current {background: #b2d998;}
	#nav ul li a:hover {background: #fafafa url(../images/menuHoverbg.gif) repeat-y right center;}
	
#sidebar {
	position: absolute;
	height: 100%;
	top: 0; 
	left: 0;
	background: #c3d0d6;
	width: 17%;
	border-left: 2px solid #aec0c7;
	border-right: 2px solid #aec0c7;
	z-index: 100;
}

#left {
	position: relative; /*ie needs this to show float */
	width: 150px;
	float: left;
	margin-left: -150px;
	z-index: 100;
	left : 0;
}
	
#leftCap {
	position: absolute; 
	top: 0; 
	width: 150px;
	height: 236px;
	margin: 0;
	background: url(../images/leftCap.jpg) no-repeat top left;
}

#right {
	position: relative; /* ie needs this to show float */
	width: 149px;
	float: right;
	z-index: 200;
	margin-left: -148px;
	background: url(../images/rightCap.jpg) no-repeat top right;
}

#rightCap {
	position: absolute; 
	top: 0;
	right: 0; 
	width: 149px;
	height: 477px;
	margin: 0;
	background: url(../images/rightCap.jpg) no-repeat top left;
}

#main {
	width: 100%;
	float: left;
	position: relative;
	z-index: 1;
	margin: 0;
	_margin: 0 0 0 -1px;
}

#content {
	background: url(../images/contentbg.jpg) no-repeat top right;
	padding: 15px 15px 0 15px;
	_padding-bottom: 30px;
	margin: 225px 150px 30px 17%;
	_margin-left: 19%;
	font-size: 0.9em;
}

	#content p 				{text-indent: 1em; padding: 0 20px 0 20px;}
	#content p.instruction 	{font-size: 0.9em; font-style: italic; text-align: center;}
	#content p.disclaimer 	{margin-top: 50px; font-size: 0.8em; text-align: justify; padding: 0 15px 0 15px;}
	#content p.disclaimer2 	{margin: 0 0 15px 0; font-size: 0.8em; text-align: justify; padding: 0 15px 0 15px;}
	#content a 				{font-weight: bold;}
	#content h1 			{position: relative; font-size: 1.7em; text-align: right; margin: 0 228px 0 0; padding: 0; border-bottom: 1px solid #a9adb0; color: #a9adb0;}
	#content h3 			{font-size: 1.4em; margin: 30px 20px 0 20px; border-bottom: 1px solid #4b7a87; color: #4b7a87;}
	#content h4             {font-size: 1.2em;}
	#content dl 			{width: 90%; margin: 30px 0 30px 0; _margin-top: -120px;}
	#content dl.topContent  {_margin-top: -230px;}
    #content dl dt 			{margin: 20px 0 0 0; padding: 20px 0 0 20px; font-size: 1.2em; font-weight: bold; background: url(../images/smallStar.gif) no-repeat top left; height: 91px;}
    #content dl dd 			{text-align: justify; margin: -70px 0 0 40px;}
    #content dl dd ul       {margin: 10px 0 0 0;}
    #content dl dd dl       {_margin-top: 1px;}
    #content dl dd dt       {background: none;}
    #content fieldset 		{margin: 10px 20px 30px 20px; _margin-bottom: 0;}
    #content legend 		{font-weight: bold; color: #a9adb0;}
    #content ul.address     {list-style: none;}
    
#admin {
	margin: 0 0 80px 0;
}
	#admin h3 					{margin: 30px 0 0 15px; border: none;}
	#admin table            	{margin: 10px 0 0 20px; width: 80%; text-align: center; background: #d5e0e5;}
	#admin table tr.head    	{background: #c3d0d6;}
	#admin table tr.alt     	{background: #e2e6e8;}
	#admin ul.tab              	{list-style: none; border-bottom: 1px solid #a9adb0; margin: 40px 0 0 0; padding: 0 0 0.1em 10px; font-size: 0.7em; line-height: 2.4em;}
 	#admin ul.tab li            {display: inline; white-space: nowrap; }
	#admin ul.tab li a          {border: 1px solid #a9adb0; background: #c3d0d6; padding: 5px; color: #4b7a87; }
	#admin ul.tab li a.current  {background: #e2e6e8;}

#adminContent {
	width: 95%;
    border: 1px solid #a9adb0;
	border-top: none;

	padding: 10px 10px 40px 10px;
}
	
.listing, .fullListing {
	margin: 20px auto 0 auto;
	padding: 0 0 20px 0;
	width: 90%;
}

	.listing h5 {font-size: 1.5em; margin: 0; padding: 0;}
	.listing h5 span, .fullListing h5 span {font-size: 0.5em;}
	.listing img {float: left; border: 1px solid #c3d0d6; padding: 3px;}
	
	.fullListing img {display: block; margin: 0 auto 0 auto; border: 1px solid #c3d0d6; padding: 3px;}
	.fullListing h5 {text-align: center; font-size: 1.7em; margin: 10px 0 0 0;}

.listingDescription {
	float: left;
	width: 50%;
	margin: 0 0 0 10px;
}

.line {
	width: 70%;
	margin: 0 auto 0 auto;
	height: 1px;
	background: #c3d0d6;
}
    
#contentsTable {
	width: 35%;
	background: #4b7a87;
	color: #dddddd;
	margin: 10px 0 0 0;
	_margin-bottom: 150px;
	padding: 1px 10px 1px 10px;
	border: 2px solid #aec0c7;
}
	#contentsTable a 	{color:#ffffff;}
	#contentsTable h3 	{color: #dddddd; font-size: 1.3em; margin: 5px 0 0 0; border-bottom: 1px solid #dddddd;}

.product {
	width: 80%;
	margin: 50px auto 0 auto;
}
	.product img {float: left; margin: 10px 10px 0 20px;}

.productDescription {
	margin: 0 0 0 150px;
}

#footer {
	width: 100%;
	height: 34px;
	z-index: 200;
	background: url(../images/footbgTile.gif) repeat-x;
	text-align: center;
}
	#footer span.footerText {font-size: 0.6em; padding: 10px 0 0 0; display: block; color: #888888;}

#leftFoot {
	width: 150px;
	height: 34px;
	float: left;
	clear: left;
	margin: 0 0 0 -1px;
	background: url(../images/leftFoot.gif) no-repeat;
}

#rightFoot {
	width: 149px;
	height: 34px;
	float: right;
	clear: right;
	background: url(../images/rightFoot.gif) no-repeat;
}

.paypal {
	width: 150px;
	margin: 20px auto 0 auto;
	display: block;
}

.imageWrapper1, .imageWrapper2, .imageWrapper3, .imageWrapper4, .imageWrapper5, .imageWrapper6, .imageWrapper7 {
    float: right;
    clear: right;
}

.imageWrapper1 {height: 22px; width: 208px;}
.imageWrapper2 {height: 22px; width: 218px;}
.imageWrapper3 {height: 22px; width: 228px;}
.imageWrapper4 {height: 22px; width: 242px;}
.imageWrapper5 {height: 22px; width: 248px;}
.imageWrapper6 {height: 72px; width: 170px;}
.imageWrapper7 {height: 72px; width: 20px;}

.center {
	text-align: center;
}

.fright {
	float: right;
}

.fleft {
	float: left;
}

.clear {
	clear: both;
	margin: 0;
}

.hidden {
	border: none;
}

span.center {
	display: block;
	width: 100%;
	text-align: center;
	margin: 10px 0 0 0;
}

/*** * Form Stuff * ***/

span.required {
	font-weight: bold;
	color: #c82828;
}

form span.radioDescr {
	margin: 1em 0 1em 0;
	width: 275px;
	float: left;
	color: #4b7a87;
}

form span.checkDescr {
	margin: 0;
	width: 100%;
	float: left;
	color: #4b7a87;
}

form div.radios {
	float: right;
	margin: 1em 3em 0 0;
	font-size: 0.9em;
}

form div.checks {
	margin: 1em 0 2em 3em;
	font-size: 0.9em;
}

form.standard {
	width: 300px;
	margin: 0 auto 0 auto;
}
	form.standard label 										{float: left; text-align: right; width: 120px; margin: 0 10px 0 0; color: #4b7a87;}
	form.standard input 										{width: 150px; height: 17px; margin: 0 0 -0.5em 140px; display: block; background: url(../images/inputbg.gif) no-repeat top center; border: none; text-indent: 7px;}
	form.standard select 										{width: 150px; height: 18px; margin: 0 0 -0.5em 140px; display: block; background: #c3d0d6; border: 1px solid #6d929d; color: #4b7a87;}
	form.standard input.button, form.standard input.buttonMain 	{float: right; margin: 10px 10px 0 0; _margin-bottom: 10px; padding: 2px; text-indent: -1px; background: #c3d0d6; border: 1px solid #6d929d; color: #4b7a87; width: auto; height: auto; text-align: center;}
	form.standard input.buttonMain 								{background: #d6cb8d; border: 1px solid #656147; color: #656147;}
	form.standard h2 											{font-size: 1.2em; margin-top: 50px; border-bottom: 1px solid #4b7a87; color: #4b7a87;}

form.wide {
	width: 400px;
	margin: 0 auto 0 auto;
}
	form.wide label 									{color: #4b7a87;}
	form.wide input 									{width: 350px; height: 17px; margin: 10px 0 25px 25px; background: url(../images/wideInputbg.gif) no-repeat top center; border: none; text-indent: 7px;}
	form.wide input.button, form.wide input.buttonMain 	{float: right; margin: 0 10px 0 0; _margin-bottom: 10px; padding: 2px; text-indent: -1px; background: #c3d0d6; border: 1px solid #6d929d; color: #4b7a87; width: auto; height: auto; text-align: center;}
	form.wide input.buttonMain 							{background: #d6cb8d; border: 1px solid #656147; color: #656147; margin-right: 20px;}
	form.wide h2 										{font-size: 1.2em; margin-top: 30px; border-bottom: 1px solid #4b7a87; color: #4b7a87;}
	form.wide label.radio 								{display: block; text-align: left; margin: 0 0 -1em 1.3em;}
    form.wide input.typeRadio 							{width: auto; height: 1.1em; margin: 0 0 -0.5em 0; float: left; text-align: right; text-indent: none; background: none;}
	form.wide label.shortAnswerLabel 					{float: left; text-align: right; width: auto; margin: 0 10px 0 0;}
	form.wide input.shortAnswerInput 					{width: 150px; height: 17px; margin: 0 0 0 9em; display: block; background: url(../images/inputbg.gif) no-repeat top center; border: none; text-indent: 7px;}
	form.wide textarea 									{width: 95%; margin: 0.5em 0 0 5%; height: 10em; border: 1px solid #658d98; background: #c3d0d6;}
	form.wide label.check 								{text-align: left; margin: 0 0 -0.8em 1.5em; display: block;}
	form.wide input.checkbox 							{width: auto; height: 1.1em; margin: 0; float: left; text-align: right; text-indent: none; background: none;}
	form.wide input.file                                {width: 150px; _width: 250px; height: 23px; background: #c3d0d6; border: 1px solid #658d98;}
	form.wide select 									{width: 150px; height: 18px; margin: 0 0 0 9em; display: block; background: #c3d0d6; border: 1px solid #6d929d; color: #4b7a87;}

	
table.docs tr { background: #e2e6e8; }
table.docs tr.head { background: #d5e0e5; }
table.docs tr.alt { background: #444840; }