/* CUSTOM TEMPLATE LAYOUT STYLES :: These can be deleted as they are for this example template, CREATE YOUR OWN IF YOU WISH*/
/* CSS Document */

body {
	margin: 0px;
	padding: 0px;
	height: 100%;
	background-color: #572600;
	font: 11px/16px Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
}

/* Positioning */
#wrapper {
	width: 100%;
	height: 100%;
	background-color: #572600; /* dark brown expanding edges */
	text-align: center;
	position: relative;
}

#headerIndex {
	float: left;
	width: 100%;
	height: 211px;
	background-image: url(images/headerIndexBkgrnd.gif);
	background-repeat: repeat-x;
	z-index: 1000;
}

#headerInterior {
	float: left;
	width: 100%;
	height: 126px;
	background-image: url(images/headerBackSlice.gif);
	background-repeat: repeat-x;
	z-index: 1000;
}

#content {
	position:relative;
	width: 955px;
	height: 100%;
	margin: 0px auto;
	z-index: 999;
}

#brownBar {
	clear: left;
	float: left;
	width: 100%;
	height: 29px;
	z-index: 1001;
}

#brownBar Div {
	width: 955px;
	height: 29px;
	background-image: url(images/brownRuleSlice.gif);
	background-repeat: repeat-x;
	margin: 0px auto;
}

#footer {
	clear: left;
	position: fixed;
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 35px;
	background-image: url(images/footer_bkg.gif);
	text-align: center;
	z-index: 2000;
}

/* Header -- Index */

#headerLogo {
	width: 955px;
	height: 211px;
	background-image:url(images/headerIndex.gif);
	background-repeat: no-repeat;
	background-position: left;
	margin: 0px auto;
}

	#logo {
		float: left;
		width: 223px;
		height: 114px;
	}
	
	#headerNavigation {
		padding-top: 180px;
		text-align: right;
	}
	
		#headerNavigation a {
			font: bold 10px Verdana, Arial, Helvetica, sans-serif;
			text-transform: uppercase;
			color: #572600;
			text-decoration: none;
			padding-left: 10px;
		}

		#headerNavigation a:hover {
			font: bold 10px Verdana, Arial, Helvetica, sans-serif;
			text-transform: uppercase;
			color: #4f91cd;
			text-decoration: none;
			padding-left: 10px;
		}
		
/* Header -- Interior */
		
#headerLogoInterior {
	width: 955px;
	height: 126px;
	background-image:url(images/logoGlow.gif);
	background-repeat: no-repeat;
	background-position: left;
	margin: 0px auto;
}

	#headerLogoInterior Div {
		padding-top: 94px;
		text-align: right;
	}
	
		#headerLogoInterior a {
			font: bold 10px Verdana, Arial, Helvetica, sans-serif;
			text-transform: uppercase;
			color: #572600;
			text-decoration: none;
			padding-left: 10px;
		}

		#headerLogoInterior a:hover {
			font: bold 10px Verdana, Arial, Helvetica, sans-serif;
			text-transform: uppercase;
			color: #4f91cd;
			text-decoration: none;
			padding-left: 10px;
		}
		
/* Content */

#contentBackgroundIndex {
	position: relative;
	width: 955px;
	height: 100%;
	clear: left;
	float: left; 
}

#contentBackgroundInterior {
	position: relative;
	width: 955px;
	height: 100%;
	background-image: url(images/gridInterior.gif);
	clear: left;
	float: left;
	padding-bottom: 55px;
	z-index: 999;
}

#contentLeft {
	width: 300px;
	float: left;
}
.rollImgFix{
	position:relative;
	display:block;
	height:122px;
	overflow:hidden;
	width:300px;
}
#imageGallery {
	text-align: left;
}
#projImages{
	float:right;
	margin:20px 0 0 0;
	height:75px;
}
#projImages a{
	margin-left:20px;
}
#testimonials {
	font: italic bold 11px/24px Verdana, Arial, Helvetica, sans-serif;
	text-align: left;
	padding-top: 20px;
	padding-left: 55px;	
	padding-right: 30px;
}

#contentRight {
	width: 655px;
	float: left;
	position:relative;
	z-index:999;
}

	#caseStudy {
		width: 580px;
		background-image: url(images/caseStdyBckgrnd.gif);
		background-repeat: repeat-y;
		height: 107px;	
		font: 10px/18px Verdana, Arial, Helvetica, sans-serif;
		color: #080808;
		padding-left: 30px;
		padding-top: 15px;
		padding-right: 45px;
		text-align: left;
	}
		
	#contentBody{
		width: 580px;
		padding-top: 10px;
		padding-left: 30px;
		padding-right: 45px;
		text-align: left;
	}

#flashContent {
	width: 955px;
	float: left;
}

/* Footer */

#footer Div {
	width: 955px;
	height: 35px;
	margin: 0px auto;
	background-image: url(images/yourVisionTag.gif);
	background-repeat: no-repeat;
	background-position: 0px 10px;
}

#footer Div Div {
	float: right;
	text-align: right;
	font: 9px Verdana, Arial, Helvetica, sans-serif;
	color: #90c3f1;
	padding-top: 12px;
}

		#footer a {
			font: 9px Verdana, Arial, Helvetica, sans-serif;
			color: #90c3f1;
		}
	
		#footer a:hover {
			font: 9px Verdana, Arial, Helvetica, sans-serif;
			color: #FFFFFF;
		}
		
		#footer .accountLogin a {
			padding-left: 25px;
			color: #90c3f1;
			text-decoration: none;
			font-weight: bold;
		}
		
		#footer .accountLogin a:hover {
			padding-left: 25px;
			color: #FFFFFF;
			text-decoration: none;
			font-weight: bold;
		}
		
		#footer .concentre a {
			padding-left: 25px;
			text-decoration: none;
		}
		
		#footer .concentre a:hover {
			padding-left: 25px;
			text-decoration: none;
			color: #33FF00;
		}

/* Generic */	
	
h1 {
	font: bold 16px Verdana, Arial, Helvetica, sans-serif;
	color: #4f91cd;
}

h2 {
	font: bold 14px Verdana, Arial, Helvetica, sans-serif;
	color: #4f91cd;
}

h3 {
	font: bold 12px Verdana, Arial, Helvetica, sans-serif;
	color: #572600;
}

h4 {
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	color: #4f91cd;
	text-transform: uppercase;
}

h5 {
	font: bold 10px Verdana, Arial, Helvetica, sans-serif;
	color: #572600;
	
}

h6 {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	color: #c26410;
	text-transform: uppercase;
}
/* END CUSTOM LAYOUT STYLES */
.clearfix:after {
 content: "."; 
 display: block; 
 height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-table;}

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

/* THE STYLES BELOW MUST NOT BE DELETED*/

/* NAVIGATION MENU ***********************************************************************************************/
/* The Navigation can be customized, but realize that the code will try to indent sub directories.               */

/* #linkNavBox is a style for the <div> tag surrounding each navigation link. This style can be used to create
space or lines between the links */
#linkNavBox
{
margin-top:0px;
padding: 5px 0px 5px 0px;
clear:right;
/* Uncomment to creat black lines inbetween the navigation links */
 border-bottom:1px solid black;
}
/* This is one extra style to keep the underline from appearing
under the login link, these styles should be identical to the
#linkNavBox above unless you wish to make the login link different */
#loginlinkNavBox
{
margin-top:0px;
padding: 5px 0px 5px 0px;
clear:right;
}

/* linknav: is the actual style for the navigation link. It is highly recommended that you use all link style 
selectors to be cross browser friendly */

a.linknav:link, a.linknav:visited {color:#5D857C;font-weight:bold;text-decoration:none; }
a.linknav:link:focus, a.linknav:visited:focus { color: #5D857C;font-weight:bold; }
a.linknav:link { color:#5D857C;font-weight:bold;text-decoration:none; }
a.linknav:visited { color: #5D857C;font-weight:bold; }
a.linknav:link:hover, a.linknav:visited:hover { color: blue;text-decoration: underline; font-weight:bold;}
a.linknav:link:active, a.linknav:visited:active { color: #5D857C;font-weight:bold; }

/* when a page has deeply nested pages, the main navigation will disappear and the new sub navigation will appear 
using these styles */
.linkhr{height:1px;color:gray;}
.subTitle{color:red;font-weight:bold;margin-top:10px;}

/* BREAD CRUMBS **************************************************************************************************/

/* crumbbox: there's a div tag that wraps the entire crumb trail */
.crumbbox{/*border-bottom:1px solid #c0c0c0;*/ font-size:90%;padding-bottom:2px;}
/* crumbraquo: raquo is the tag for double arrows, format it if you'd like */
.crumbraquo{}
/* endcrumb: The page that is being shown is not a link but can be formatted with this style */
.endcrumb {font-weight:bold;}

/* crumblink is the actual style for the crumb hyperlinks. It is highly recommended that you use all link style 
selectors to be cross browser friendly */
a.crumblink:link, a.crumblink:visited {color:white;font-weight:bold;text-decoration:none; }
a.crumblink:link:focus, a.crumblink:visited:focus { color:white;font-weight:bold; }
a.crumblink:link { color:white;font-weight:bold;text-decoration:none; }
a.crumblink:visited { color: white;font-weight:bold; }
a.crumblink:link:hover, a.crumblink:visited:hover { color: #CFD8E6;text-decoration: underline; font-weight:bold;}
a.crumblink:link:active, a.crumblink:visited:active { color: white;font-weight:bold; }

/* NORMAL CONTENT PAGES*******************************************************************************************/
/* The only aspect of the content that can be formatted is the general font,size,color ect..
   In this template I am using the whitebox style above to define what the font attributes will be.*/
   
/* These are the link styles for any hypertext link that is not in the navigation menu. It is highly recommended 
that you use all link style selectors to be cross browser friendly */
:link, :visited { color:#ff8000;text-decoration:none; }
:link:focus, :visited:focus { color: green; }
:link { color:#ff8000;text-decoration:none; }
:visited {color: #bb5e00; }
:link:hover, :visited:hover { color: blue; text-decoration:underline; }
:link:active, :visited:active { color: #bb5e00; }
  
/* EVENTS PAGES***************************************************************************************************/

a.eventsLink:link, a.eventsLink:visited {color:#647D8F;font-weight:bold;text-decoration:none; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.eventsLink:link:focus, a.eventsLink:visited:focus { color: #647D8F;font-weight:bold; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.eventsLink:link { color:#647D8F;font-weight:bold;text-decoration:none; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.eventsLink:visited { color: #647D8F;font-weight:bold;font-family: georgia,Verdana, Arial, Helvetica, sans-serif;  }
a.eventsLink:link:hover, a.eventsLink:visited:hover { color: blue;text-decoration: underline; font-weight:bold;font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.eventsLink:link:active, a.eventsLink:visited:active { color: #647D8F;font-weight:bold; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
.eventTitle{color:#647D8F;margin-left:0px;font-family: georgia,Verdana, Arial, Helvetica, sans-serif;font-size:20pt; }
.eventHR{height:1px;margin-top:5px;font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }

/* DOWNLOADS PAGES************************************************************************************************/

.downloadsTitle{color:#ff8000;}
.downloadsCatHeading{font-weight:bold}
.downloadsCat{margin-top:20px;}
.downloadsLinksBox{padding-left:10px;}
.downloadsLinks{}
.downloadsHR{height:1px;}

/* CATALOG PAGES**************************************************************************************************/

.categoryTitle{color:#648F7D;margin-left:0px;font-family: georgia,Verdana, Arial, Helvetica, sans-serif;font-size:20pt; }
.subCatTable{border-collapse:collapse;margin-bottom:25px;width:580px; }
.subCatTD{padding-bottom:3px;text-align:center; }
.subCatImageLink{}
.subCatImage{border:0px;}

/* item lists */
.itemTable{border-collapse:collapse;border:1px solid; width:580px;}
.itemImage{border:0px;}
.itemNamePrice{padding-left:5px;vertical-align:top;border:1px solid;}
.itemImageLinkTD{width:100px;border:1px solid;text-align:center;}
.itemImageLink{}

a.itemTextLink:link, a.eventsLink:visited {color:#647D8F;font-weight:bold;text-decoration:none; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.itemTextLink:link:focus, a.eventsLink:visited:focus { color: #647D8F;font-weight:bold; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.itemTextLink:link { color:#647D8F;font-weight:bold;text-decoration:none; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.itemTextLink:visited { color: #647D8F;font-weight:bold;font-family: georgia,Verdana, Arial, Helvetica, sans-serif;  }
a.itemTextLink:link:hover, a.eventsLink:visited:hover { color: blue;text-decoration: underline; font-weight:bold;font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }
a.itemTextLink:link:active, a.eventsLink:visited:active { color: #647D8F;font-weight:bold; font-family: georgia,Verdana, Arial, Helvetica, sans-serif; }


.itemLinkTitle{margin-bottom:5px;font-size:10pt;}
.itemPrice{}
.subCatTitle{clear:right;}

/* full catalog item display*/
.itemDisplayTable{border-collapse:collapse;width:580px; border:1px solid black;}
.itemHeaderTD{background-color:#D7DBDA;padding:2px 2px 2px 2px;}
.itemName{font-weight:bold;}
.itemPrice{color:red}
.itemID{font-weight:bold;}
.itemDescription{text-align:left;padding:5px 5px 5px 5px;width:330px;vertical-align:top;}
.itemImageTD{width:250px; vertical-align:top; text-align:center;}
.itemImageTable{width:100%;border:1px; padding:0px 0px 0px 0px; border-collapse:collapse;border:1px solid;}
#PictureBox{ }
.itemImageNav{text-align:center;font-size:80%;border-bottom:1px solid;}
.itemSpecs{text-align:left;padding:5px 5px 5px 5px;}

/* Specials Discount Module*/
.itemname,.regPrice,.specialPrice{font-weight:bold;padding:3px 3px 3px 3px;background-color:#d4af89;}
.specialsnum{color:red;font-weight:bold;padding:3px 3px 3px 3px;background-color:#e0e0e0;}
.specTable{border-collapse:collapse; }
.specialstitle{font-weight:bold;padding:3px 3px 3px 3px;background-color:#e0e0e0;}
.specialsdesc{padding:3px 3px 3px 3px;background-color:#eeece8;}
.iName{padding:3px 3px 3px 3px;}
.rPrice{padding:3px 3px 3px 3px;}
.sPrice{padding:3px 3px 3px 3px;}
.totalR,.totalS{padding:3px 3px 3px 3px;background-color:#e38e79}