/*	Resets
	------	*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}

a img {border: 0;}

/* Selection colours (easy to forget) */

::selection 	 	{background: rgb(255,255,158);}
::-moz-selection 	{background: rgb(255,255,158);}
img::selection 		{background: transparent;}
img::-moz-selection	{background: transparent;}
body {-webkit-tap-highlight-color: rgb(255,255,158);}



/*		Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

a.threedeep img {display: block; width: 120px; height: 54px; position: absolute; z-index: 100; margin: -460px 0 0 775px !important; border: 0; } 

#content-main.threedee #content-one {padding-top: 10px; }
#content-main.threedee #content-two {padding-top: 0px; } 

#content-top { background: url(/images/wreck360/ajax-loader.gif) 340px 220px no-repeat !important; background-color: #000 !important;}

#hint { background: url(/images/wreck360/drag-hint.png) no-repeat; display: none; position:absolute; left: 47%; top: 25%; z-index: 101; width:100px; height:100px; pointer-events: none; }

#ipadSave { width: 200px; height: 89px; background: url(/images/wreck360/ipad-save.png) no-repeat top left; display: none; position: absolute; margin: 0 0 0 180px; z-index: 200; }

div#stats { display:none; width: 200px; position: absolute; z-index: 220; margin:  -90px 0 0 325px; pointer-events: none; }
div#stats p {color: #CCC; font-size: 10px; text-align: right; }

#toggle { display: none; position: absolute; width: 450px; z-index: 200; margin: -450px 0 0 13px; }
#toggle a { background: url(/images/wreck360/toggle.png) no-repeat 0px 0px; width: 55px; float: left; height: 12px; overflow: hidden; display: block; padding:3px 0 0 19px; font-size: 0.65em !important; color: #FFF; text-align: left; text-decoration: none; cursor: pointer;}
#toggle a.down { background: url(/images/wreck360/toggle.png) no-repeat 0px -15px; color: #CCC; cursor: pointer; }

#noscript {width: 500px; text-align: center; color: #CCC; font-size: 12px; position: absolute; left: 22%; top: 55%; z-index: 200; }

#viewer {
	width: 900px;
	margin: 0 auto;
	clear: both;
	position: relative;
}
#viewer:hover {	cursor: ew-resize;}
#viewer .vr img {
	width: 100%;	
}

div.spinner {position: absolute;}

.marker {
	position: absolute; 
}

.inactive {
	display: none !important;
}

.photo {
	width: 50px;
	height: 50px;
	background: url(/images/wreck360/photo-marker.png) 0 0 no-repeat;
	cursor: pointer;
}
.photo:hover {
	background: url(/images/wreck360/photo-marker.png) 0 -50px no-repeat;
}
.video {
	width: 50px;
	height: 50px;
	background: url(/images/wreck360/video-marker.png) 0 0 no-repeat;
	cursor: pointer;
}
.video:hover {
	background: url(/images/wreck360/video-marker.png) 0 -50px no-repeat;
}

.label1, .label2, .label3, .label4 {
	width: 100px;
	height: 100px;
	pointer-events: none;
}
.label1 {
	background: url(/images/wreck360/label-top-left.png) 0 0 no-repeat;		
}

.label2 {
	background: url(/images/wreck360/label-top-right.png) 0 0 no-repeat;		
}

.label3 {
	background: url(/images/wreck360/label-bottom-left.png) 0 0 no-repeat;		
}

.label4 {
	background: url(/images/wreck360/label-bottom-right.png) 0 0 no-repeat;		
}

.labeltext {
	color: #FFF;
	width: 300px;
	margin-top: 10px;
	font-size: 12px;
	pointer-events: none;
	text-shadow: 2px 2px 2px #000;
	text-transform: uppercase;
	font-size: 11px;
}

div.popup {width: 620px; min-height: 320px; overflow: hidden; float: left; background: #FFF; }
div.popup div.popup-left {width: 314px; float: left; display: inline; padding: 5px; }
div.popup div.popup-left img {width: 314px; padding: 0; float: left; }
div.popup div.popup-right {width: 250px; float: left; display: inline; padding: 5px 0 0 10px; }
div.popup div.popup-right h6 {font-size: 17px !important; color: #336699; margin: 5px 0 10px 0 !important; }
div.popup div.popup-right p {font-size: 13px; color: #666; margin: 0px 0 15px 0 !important; width: 240px; line-height: 17px;}

img.surface {width: 795px; height: 200px; display: block; position: absolute; z-index: 50; margin: -465px 0 0 0;}