/*

This is the CSS that controls the layout of the Augmented Reality pages, it EXTENDS the normal style sheet, but with the extra options.

*/

body {
	background:transparent url('/images/bmwuk/augmented_reality/e89_bmw-co-uk_hub_bkg.jpg') no-repeat scroll 0 0;
}

div#box-download-dl {
	z-index:501;
	display: none;
}
.icon-close {
	float: right;
	border: 0px none;
}
div#tab-demo a {
	font-weight: bold;
}

div.main-content {
	background: #ffffff;
	width: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index:-1;
}
div.gray-box {
	position: absolute;
	visibility: visible;
	border-width: 1px;
	border-style: solid;
	border-spacing: 1px;
	border-color: #afafaf;
	font-family: arial;
	font-size: 11px;
	background: white;
	z-index:500;
}
div.box-download {
	top: 100px;
	left: 11px;
	width: 412px;
	height: 329px;
}
div.box-movie {
	top: 122px;
	left: 461px;
	width: 522px;
	height: 308px;
}
div.box-z4fan {
	top: 443px;
	left: 11px;
	left: 234px;
	width: 215px;
	height: 109px;
}
div.box-shared {
	top: 443px;
	left: 236px;
	left: 459px;
	width: 524px;
	height: 109px;
}
div.box-informed {
	top: 443px;
	left: 769px;
	left: 11px;
	width: 215px;
	height: 109px;
}
div.box-share-this {
	top: 556px;
	left: 802px;
	width: 188px;
	height: 50px;
	border-style: none;
	font-size: 11px;
	font-weight: bold;
}
div.general-tab {
	padding-top: 4px;
	position: absolute;
	visibility: visible;
	width: 122px;
	height: 18px;
	_height: 22;
	font-family: arial;
	font-size: 14px;
	text-align: center;
	background: white url('/images/bmwuk/augmented_reality/video-tab.gif') top left no-repeat;
}
div.demo-tab {
	top: 101px;
	left: 461px;
	font-weight: bold;
	z-index:501;
}
div.tv-ad-tab {
	top: 101px;
	left: 585px;
	z-index:499;
}
div.mid-content {
	height: 66px;
	margin-bottom: 4px;
}
div.mid_content p {
	margin: 0px;
}
.navbuttonarrow_text {
	border-right: #7b7b7d 1px solid; padding-right: 6px; padding-left: 6px; border-left-color: #7b7b7d; background: #202d57; float: left; border-bottom-color: #7b7b7d; border-top-color: #7b7b7d; height: 19px; border-spacing: 1px;
}
div.navbuttonarrow_text a {
	font-size: 11px;
	clear: all; font-weight: bold; float: left; color: #ffffff; line-height: 19px; text-decoration: none;
}
div.navbuttonarrow_text a:visited {
	clear: all; font-weight: bold; float: left; color: #ffffff; line-height: 19px; text-decoration: none;
}
div.navbuttonarrow_text a:hover {
	font-weight: bold; float: left; color: #666666; line-height: 19px; text-decoration: none;
}
.navbuttonarrow_graphic {
	height: 19px; background: #202d57; float: left; padding-left: 6px; padding-right: 6px;
}
.navbuttonarrow_graphic img {
	position: relative; top: 6px;
}

.whitenavbuttonarrow_text {
	padding-right: 2px; padding-left: 2px; float: left; height: 19px;
}
div.whitenavbuttonarrow_text a {
	font-size: 11px;
	clear: all; font-weight: bold; float: left; color: #336699; line-height: 19px; text-decoration: none;
}
div.whitenavbuttonarrow_text a:visited {
	clear: all; font-weight: bold; float: left; color: #336699; line-height: 19px; text-decoration: none;
}
div.whitenavbuttonarrow_text a:hover {
	font-weight: bold; float: left; color: #666666; line-height: 19px; text-decoration: none;
}
.whitenavbuttonarrow_graphic {
	height: 19px; float: left; padding-left: 2px; padding-right: 2px;
}
.whitenavbuttonarrow_graphic img {
	position: relative; top: 6px;
}