/* 

STYLE SHEET FOR IO METRO/INTERIOR-OUTLET WEB SITE
Created by Bluespace Creative
www.bluespacecreative.com

ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images
	6. hacks

Notes

*/



/* --------- 1. defaults  --------- */

* {margin: 0;padding: 0;}

body { 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	background-color: #FFFFFF;
	}
		
p {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top: 5px;
}		
		
/*  --------- 2. structure  --------- */
#wrapper {
	width: 780px;

	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
		}
#masthead {
		}
#topBar {
	/*background-color: #7A624A;*/
	height: 30px;
	background-image: url(../images/bg.gif);
	background-repeat: repeat;
	/*background-position: 32px 100%;*/
	float: left;
	clear: left;
	width: 780px;
}
#topnav a{
	color: #000;
	text-decoration: none;
}
#topnav a:hover {
	color: #000;
	text-decoration: underline;
}
#topnav ul {
	padding-top: 0px;
	margin-right:10px;
	float:right;
	horizontal-align:middle;
}
#topnav li{
	text-transform: uppercase;
	font-size: 11px;
	height: 15px;
	font-weight: bold;
	padding-top: 10px;
	float: left;
	color: #000;
}


#navcontainer a{
	color: #FFF;
	text-transform: uppercase;
}
#navcontainer {


	height: 277px;
	width: 780px;

	
}

#mainRightBar {
	color: #FFF;
	width: 200px;
	height: 250;
	background-image: url(../images/bg.gif);
	background-repeat: repeat;
	float: right;
}


#content {
	width: 580px;
	font-size: 11px;
	padding: 20px 15px 20px 15px;
	text-align: left;
	background-color: #ffffff;
	min-height:250px;
	float: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
#content #cookieCrumbs {
	margin-bottom: 0px;
}

#content #cookieCrumbs p {
	text-align: right;
	padding-right: 25px;
}

#content #titleBar {
	height: 23px;
	background-image: url(../images/titleBarbackground.gif);
	background-repeat: repeat-x;
	margin: 0px 25px 0px 0px;
	padding: 0px;
}
#content #productPictureBox {
	height: 389px;
	width: 580px;
	margin-left: 3px;
	padding: 0px;
	margin-top: 2px;
	margin-right: 0px;
	margin-bottom: 0px;
}
#content #productDescription p {
	padding-left: 35px;
}
#content #productDescription #pictureBox {
	height: 180px;
	width: 272px;
	float: left;
	margin-top: 5px;
	margin-right: 5px;
	margin-left: 0px;
	padding: 5px 5px 0px 0px;
	margin-bottom: 0px;
}

#productThumbContainer {width:auto;margin:auto;}

#productThumbContainer #productThumb {
	OVERFLOW:hidden;
	background-color:#fff;
	border:1px solid #333;
	height: 150px;
	width: 180px;
	float: left;
	text-align:center;
	margin-top: 5px;
	margin-right: 5px;
	margin-left: 0px;
	padding: 0px;
	padding-bottom: 5px;
	margin-bottom: 0px;
}
#productThumb img{width:auto;margin:auto;}

#footer {
	margin-top: 0px;
	padding-top: 10px;
	border-top:1px solid #333;
	text-align: center;
	clear:left;
	width: 780px;
	horizontal-align:middle;
		}

.separator {
		clear: both;
		height: 0;
		}
.pullquote {
	font-size: 15px;
	color: #7A624A;
	float: right;
	width: 37%;
	font-weight: bold;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
}

h1 {
	font-size: 14px;
	text-transform: uppercase;
}
h1.productTitle {
	font-size: 14px;
	text-transform: uppercase;
	background-image: url(../images/titleBarLogo.gif);
	background-repeat: no-repeat;
	height: 23px;
	padding-left: 35px;
	color: #FFFFFF;
	padding-top: 5px;
}
h2 {
	font-size: 14px;
	color: #000000;
	text-transform: none;
	font-family: Arial, Helvetica, sans-serif;

}



/* ---------- 3. links and navigation ---------- */
h3{
	font-size: 12px;
	font-weight: bold;
	padding-top: 10px;
}
a {
	color: #003399;
	text-decoration: underline;
		}
		
a:hover {
	color: #999999;
	text-decoration: none;
		}

#navigation {
		}

#navigation a {
		}

#navigation ul {
		}
#navcontainer #logo {
	float: left;
	padding-right: 0px;
	margin: 0px 73px 0px 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#navigation li {
	font-size: 11px;
		}
/* ---------- 4. fonts ---------- */
ul {
		list-style-type: none;
		}
#paragraph ul {
		list-style-type: normal;
		}	
#paragraph li {
		list-style-type: normal;
		}		
.firstLetter {
	font-size: 12px;
}
.snfl {
	font-size: 15px;
}
#secNav a{
	color: #FFF;
	text-decoration: none;
}
#secNav a:hover{
	text-decoration: underline;
}
#secNav h3 {
	text-decoration: underline;
	padding-bottom: 5px;
}


/* ---------- 5. images ---------- */

a img {
		border: 0; 
		}
		
/* ---------- 6. hacks ---------- */

body	{ /* IE 5 centring bug fix */
		text-align: center;
		} 
		
#wrapper {
		text-align: left;
		}  


/* eSTORIS specific */
hr {height:1px;width:100%;background-color:#999999;border-collapse:collapse;border:0;color:#999999;}
.textbox {border:1px solid #333;}
.textField {border:1px solid #333;}
.button {padding:1px;border:1px solid #333;background-color:#003399;color:#fff;}
.FormButtons{padding:5px;text-align:right;}
.label {font:bold 10pt Geneva, Arial, Helvetica, sans-serif;text-align:right;}
.data {font:normal 10pt Geneva, Arial, Helvetica, sans-serif;}		
#box {border:1px solid #999;background-color:#F3F3F3;padding:10px;margin:10px}
#box p{margin-bottom:10px;margin-top:10px;padding:0;}
#blurb {margin:0;padding:0;}
#blurb p{margin-bottom:10px;margin-top:10px;padding:0;}
#pageBodyDiv {margin:0;padding:0;}
#pageBodyDiv p{margin-bottom:10px;margin-top:10px;padding:0;}

#imgBox{float:left;margin-right:20px;width:250px;height:200px;background-color:#fff;border:1px solid #333;}
#imgBox div{text-align:center;}

#datagrid {margin:0;padding:0;}
#datagrid table.mainDGTbl{background-color:#fff;margin:0;padding:0;border-collapse:collapse;width:100%;}
#datagrid th{margin:0;padding:3px;padding-top:5px;padding-bottom:5px;border-bottom:1px solid #cccccc;
	background-color:#E8E6BD;font:bold 8pt arial;color:#333;text-align:left;}
#datagrid th.heading{background-color:#CFE2F5;}
#datagrid td{margin:0;padding:2px;font:normal 8pt verdana;}
#datagrid .numeric{text-align:right;}
#datagrid td.additionalAttribs{text-align:center;}
#datagrid a.headerLink{font:normal normal bold 8pt arial;color:333;}
#datagrid a{font:normal 8pt arial;color:333;text-decoration:none;}
#datagrid a:hover{color:#990000;text-decoration:underline;}
#datagrid tr.RowMain{background-color:#ffffff;}
#datagrid tr.RowAlt{background-color:#ffffff;}
#datagrid tr.RowHighlight{background-color:#eeeeee;background-image:url(../images/gridHoverBG.gif);background-repeat:repeat-x;}
#datagrid td.data{vertical-align:top;background-color:#fff;}
#datagrid td.label{vertical-align:top;font:normal normal bold 8pt tahoma, arial;text-align:right;background-color:#fff;}
#datagrid .ButtonLink{text-align:center;color:#939765;}
#datagrid .ButtonLinkDisabled{color:#B1B1B1;text-align:center;width:60px;}
#datagrid .edititemstyle{padding:0;margin:0;}
#datagrid .selecteditemstyle{padding:0;margin:0;}
#datagrid .footerstyle{padding:0;padding-top:10px;margin:0;text-align:right;border-top:1px solid #333;}
#datagrid .footerstyle a{padding-left:2px;padding-right:2px;color:#999D69;font:bold 8pt arial;
	background-repeat:repeat-x;text-decoration: none;margin-right:5px;}
#datagrid .footerstyle a:hover{text-decoration: none;}
#datagrid .footerstyle a.footerActive{color: #990000;margin-right:5px;text-decoration: none;}
#datagrid .footerstyle a.footerDisabled{color: #AF4A23;margin-right:5px;text-decoration: none;}
#datagrid .footerstyle a:hover.footerDisabled{background-image:none;}
#datagrid .footerstyle ul{margin:0;padding:0;border-collapse:collapse;}
#datagrid .footerstyle li{display:inline;list-style-type:none;margin:0;padding:0;}


#DataBox {margin:0;padding:0px;border:#999999 solid 1px; border-collapse:collapse;}
#DataBox p{margin-bottom:10px;margin-top:10px;padding:0;}
#DataBox table{}
#DataBox .TbllessParent{background-color:#ffffff;border:#999999 solid 1px; width:100%;border-collapse:collapse;}
#DataBox th{font:bold 8pt arial;background-color:#E8E6BD;padding:.2em .5em .2em .5em; color:#000;text-align:left;border-bottom:1px solid #ccc;}
#DataBox td{font:normal 8pt arial;vertical-align:top;padding:.3em;}
#DataBox td.label{text-align:right;font-weight:bold;white-space:nowrap;}
#DataBox td.label2{text-align:left;font-weight:bold;white-space:nowrap;}
#DataBox td.data{text-align:left;}
#DataBox .buttons{padding-top:1.5em;}
#DataBox a.gridLink{padding:5px;background-color:#E8E6BD;color:#333333;border:0;text-decoration:none;text-transform:lowercase;}
#DataBox a:hover.gridLink{background-color:#99A563;}
#DataBox ul{list-style-type: none;margin:0;padding:.2em .5em .2em .5em;}
#DataBox li{width:100%;font: normal normal normal 10pt tahoma;color:#000;}


#DataForm {margin:0;padding:0px;}
#DataForm p{margin-bottom:10px;margin-top:10px;padding:0;}
#DataForm table{border:0; width:100%;border-collapse:collapse;}
#DataForm th{font: normal normal bold 10pt arial;background-color:#E8E6BD;padding:.2em .5em .2em .5em;text-align:center;}
#DataForm td{font: normal normal normal 8pt arial;vertical-align:top;padding:.3em;}
#DataForm td.label{text-align:right;font-weight:bold;white-space:nowrap;}
#DataForm td.data{text-align:left;}
#DataForm .buttons{padding-top:1.5em;}

#ListBox {margin:0;padding:0px;}
#ListBox table{float:left;width:340px;margin:0;margin-top:20px;padding:0px;border:1px solid #999999;}
#ListBox p{border-bottom:1px solid #999;padding:5px;margin:0;text-align:left;}
#ListBox ul{list-style-type: none;margin:0;background-color:#E8E6BD;padding:.2em .5em .2em .5em;}
#ListBox li{width:100%;font: normal normal normal 10pt tahoma;color:#000;}

#buttonList {padding:0;margin:0;}
#buttonList ul{padding:0;margin:0;list-style-type:none;}
#buttonList li{padding:0;padding-top:5px;margin:0;margin-right:5px;float:left;width:101px;height:26px;
	background-image:url(../images/button.gif);background-repeat:no-repeat;
	}
#buttonList li img{float:left;margin-left:7px;margin-right:7px;margin-top:2px;}
#buttonList li a{color:#000;} 
#buttonList li a:hover{color:#990000;} 

#ButtonLink {height:23px;padding:3px;}
#ButtonLink a{border:1px solid #999999;padding:2px;padding-left:10px;padding-right:10px;color:#000000;
	background-image:url(../images/buttonBG.gif);background-repeat:repeat-x;text-decoration: none;font:normal 8pt verdana;}
#ButtonLink a:hover{background-image:url(../images/buttonBG.gif);background-repeat:repeat-x;
	text-decoration:underline;color:#990000;}	

/* controls layout of product thumbnails */
#thumbGallery {float:left;width:180px;border:0;margin:5px;margin-bottom:5px;
	background-color:#fff;border:1px solid #333;text-align:center;}
#thumbGallery img.thumbImg{border:0;margin:auto;}
#thumbGallery .thumbText{text-align:center;margin:0;padding:0;padding:5px;font:normal normal normal 8pt verdana;}
#thumbGallery .thumbAltText{text-align:center;margin:0;padding:0;padding:5px;font:normal normal normal 8pt verdana;color:#BC032D;}
#thumbGallery a.thumbLink{padding:1px;text-decoration:none;color:#333333;}
#thumbGallery a:hover.thumbLink{color:#333;}

#hList ul{list-style-type:none;margin:0;padding:0;}
#hList li{display:inline;padding-right:10px;}