/*
 *	Common styling for Shop Browser & Details pages
 *	Copyright (c) 2009 Daniel Phillimore - Roger Clark Motorsport
 */

#divMain {
	/* Stretch to fill width,
		leaving equal gap either side */
	margin-left: 40px;
	margin-right: 40px;
	
	min-width: 900px;
	min-height: 500px;
	width: auto;
	height: 100%;
}

/* Use wider left column for shop's pages */
#divLeftColumn {
	width: 256px;
}

#divCenterContainer {
	position: absolute;
	left: 0px;
	top: 146px;
	bottom: 54px;
	
	width: 100%;
	height: auto;
}

#divRightContentColumn {
	/* Left border of the main, right-hand content column 
	border-left: solid #616264 1px;*/
	
	/* Use wider left column for shop's pages */
	margin-left: 270px;
	
	/* Move scrollbar out to right
	margin-right: -30px;
	padding-right: 14px; */
	
	position: relative;
	left: 0px;
	top: 0px;
	
	width: auto;
	max-height: 100%;
	height: 100%;
	
	z-index: 1;
	
	/* overflow-x: hidden;
	overflow-y: scroll; */
	
	overflow: visible;
}

.clsShop_TopBorderContainer {
	position: absolute;
	left: 0px;
	/* Stretch out to 100% width ( cannot use width: 100% because of borders ) */
	right: 0px;
	top: 0px;
	
	z-index: 4;
	
	width: auto;
	height: 12px;
	
	font-size: 0px;
}

.clsShop_PageSection_Header {
	padding: 3px 20px 9px 20px;
	
	position: absolute;
	left: 0px;
	/* Stretch out to 100% width ( cannot use width: 100% because of padding ) */
	right: 0px;
	top: 0px;
	
	width: auto;
	height: 10px;
	
	z-index: 3;
	
	font-size: 13px;
	background-color: #616264;
	color: #FFFFFF;
}

.clsShop_PageSection_Body {
	/* Left border of the main, right-hand content column */
	border-left: solid #616264 1px;
	
	/* Move scrollbar out to right */
	margin-right: -30px;
	padding-right: 13px;
	
	position: relative;
	left: 0px;
	top: 0px;
	bottom: 0px;
	
	width: auto;
	max-height: 100%;
	height: auto;
	
	/* Generic fallback for old browsers with no
		overflow-x/y support */
	overflow: auto;
	overflow-x: hidden;
	overflow-y: scroll;
}
.clsPageBody_Inner {
	border-right: solid #616264 1px;
	/* Space to clear header above */
	margin-top: 22px;
	
	position: relative;
}
.clsShop_BottomBorderContainer {
	border-bottom: solid #616264 1px;
	
	margin-left: 0px;
	margin-right: 0px;
	margin-top: -13px;
	
	position: relative;
	left: 0px;
	top: 0px;
	
	width: auto;
	height: 12px;
	
	z-index: 4;
	
	font-size: 0px;
}

.clsTopLeftCorner_DarkGray {
	position: absolute;
	left: 0px;
	top: 0px;
	
	width: 12px;
	height: 12px;
	
	z-index: 4;
	
	background-image: url("/images/border/section_top_left_darkgray.png");
	
	font-size: 0px;
}
.clsTopRightCorner_DarkGray {
	position: absolute;
	right: 0px;
	top: 0px;
	
	width: 12px;
	height: 12px;
	
	z-index: 4;
	
	background-image: url("/images/border/section_top_right_darkgray.png");
	
	font-size: 0px;
}
.clsBottomLeftCorner_DarkGrayLine {
	position: absolute;
	left: 0px;
	bottom: -1px;
	
	width: 12px;
	height: 12px;
	
	z-index: 4;
	
	background-image: url("/images/border/section_bottom_left_darkgray_line.png");
	
	font-size: 0px;
}
.clsBottomRightCorner_DarkGrayLine {
	position: absolute;
	right: 0px;
	bottom: -1px;
	
	width: 12px;
	height: 12px;
	
	z-index: 4;
	
	background-image: url("/images/border/section_bottom_right_darkgray_line.png");
	
	font-size: 0px;
}

.clsBorderCutOff {
	position: absolute;
	left: 0px;
	top: auto;
	bottom: 0px;
	
	height: auto;
	width: 100%;
}


.clsShop_Header_RightControls {
	display: block;
	
	position: absolute;
	right: 0px;
	top: 0px;
	border: none;
	color: #FFFFFF;
	height: 14px;
	width: 70px;
}

.clsShop_Header_RightControls a {
	padding-top: 4px;
	left: 0px;
	top: 2px;
	display: block;
	width: 70px;
	height: 20px;
	color: #FFFFFF;
	font-size: 11px;
	background: transparent url("/images/shop_back.png") 36px 0px no-repeat;
}

.clsShop_PageSection_Body_EndBar {
	width: auto;
	height: 12px;
	
	background-color: #616264;
	
	font-size: 0px;
}