/*
Website Template, v1.0

Media: Screen
Author: Mike Harding @ Publicis Digital
*/

body {
	background: #1e1007 url(../images/background.jpg) center 0 no-repeat;
	color: #92805a;
	}
	a:link, a:visited, a:active { color: #92805a; }
	a:hover { color: #999; }

#container {
	width: 740px;
	padding-top: 20px;
	margin: 0 auto;
	}
#main {
	height: 460px;
	background: #000;
	padding-top: 1px;
	}
	#header {
		margin: 25px 25px 0 25px;
		}
		#header p { margin: 0; }
		#header a {
			display: block;
			background: url(../images/old-gold-header.jpg) right 0 no-repeat;
			overflow: hidden;
			width: 690px;
			height: 62px;
			text-indent: -999em;
			}
	#content {
		margin: 25px 25px 20px 25px;
		background: url(../images/tvc-background.jpg) 0 0 no-repeat;
		position: relative;
		height: 385px;
		overflow: visible;
		}
		#helmet-top {
			width: 240px;
			height: 45px;
			background: url(../images/helmet-top.png) 0 0 no-repeat;
			position: absolute;
			top: -45px;
			left: 0;
			}
		#copy {
			background: #000;
			width: 183px;
			position: absolute;
			top: 90px;
			left: 473px;
			}
			h1#epic-story {
				width: 183px;
				height: 28px;
				margin: 0 0 25px 0;
				background: url(../images/the-epic-story.gif) 0 0 no-repeat;
				overflow: hidden;
				text-indent: -999em;
				}
			.subtitle {
				width: 183px;
				height: 14px;
				margin: 0 0 6px 0;
				border-bottom: 1px solid #92805a;
				text-indent: -999em;
				overflow: hidden;
				}
			h2#maya { background: url(../images/subtitle-maya.gif) 0 0 no-repeat; }
			h2#ring { background: url(../images/subtitle-ring.gif) 0 0 no-repeat; }
			h2#old-gold-story { background: url(../images/subtitle-old-gold-story.gif) 0 0 no-repeat; }
			
			ul.quality, ul.quality li {
				margin: 0;
				padding: 0;
				list-style: none;
				}
				ul.quality { margin-top: 10px; }
				ul.quality li {
					float: left;
					display: inline;
					}
				ul.quality li a {
					display: block;
					width: 89px;
					height: 17px;
					text-indent: -999em;
					overflow: hidden;
					margin-bottom: 10px;
					}
				ul.quality .high-quality a {
					background: #444 url(../images/high.gif) 0 0 no-repeat;
					margin-right: 5px;
					}
				ul.quality .low-quality a { background: #444 url(../images/low.gif) 0 0 no-repeat; }
				ul.quality li a:hover { background-color: #333; }
				p#select-quality {
					clear: both;
					margin: 0 0 25px 0;
					font-size: 0.9em;
					width: 183px;
					height: 9px;
					background: url(../images/select.gif) 0 0 no-repeat;
					text-indent: -999em;
					overflow: hidden;
					}
				p.read-more { margin: 0; }
				p.read-more a {
					display: block;
					width: 183px;
					height: 17px;
					text-indent: -999em;
					background: #444 url(../images/read-more.gif) 0 0 no-repeat;
					}
				p.read-more a:hover { background-color: #333; }

		p#strapline {
			background: url(../images/old-gold-strapline.gif) 0 0 no-repeat;
			width: 570px;
			height: 10px;
			overflow: hidden;
			text-indent: -999em;
			margin: 0 auto;
			}


/* PHASE 2 LANDING ////////////////////////////////////////////////////////////////////// */
.phase2 #copy img {
	float: left;
	display: inline;
	clear: both;
	margin: 0 7px 10px 0;
	}
.phase2 ul.quality { margin: 0; }
.phase2 ul.quality li a {
	width: 104px;
	margin-bottom: 0;
	}
.phase2 ul.quality .high-quality a {
	background: #444 url(../images/high-medium.gif) 0 0 no-repeat;
	margin: 0 0 4px 0;
	}
.phase2 ul.quality .low-quality a { background: #444 url(../images/low-medium.gif) 0 0 no-repeat; }
.phase2 ul.quality li a:hover { background-color: #333; }

/* MOVIES /////////////////////////////////////////////////////////////////////////////// */
#main.movie #content {
	background: none;
	height: auto;
	text-align: center;
	}
	#noflash { padding-top: 100px; }
	#noflash p {
		text-align: center;
		}
		#noflash p img,
		#noflash p a { display: inline; }


/* OLD GOLD PAGE //////////////////////////////////////////////////////////////////////// */
body#old-gold #content {
	background: url(../images/old-gold-header.jpg) right 0 no-repeat;
	height: auto;
	padding-top: 90px;
	}
	#text {
		padding-left: 320px;
		padding-right: 35px;
		background: url(../images/chocolate.jpg) 0 0 no-repeat;
		height: 310px;
		overflow: auto;
		}
	#text h1 {
		background: url(../images/subtitle-worth-its-weight.gif) 0 0 no-repeat;
		width: 264px;
		border-bottom: none;
		margin-bottom: 15px;
		}
	#text p {
		font-size: 1.1em;
		line-height: 1.4;
		}
	p.back { margin: 20px 0 0 0; }
	p.back a {
		display: block;
		width: 104px;
		height: 17px;
		text-indent: -999em;
		background: #444 url(../images/back.gif) 0 0 no-repeat;
		}
	p.back a:hover { background-color: #333; }


/* PRIVACY, TERMS, ETC ////////////////////////////////////////////////////////////////// */
#main.basic { height: auto; }
#main.basic #content {
	background: none;
	height: auto;
	padding: 10px 25px 25px 25px;
	color: #adaaa0;
	margin-top: 0;
	}
#main.basic h1 {
	text-transform: uppercase;
	font-size: 1.4em;
	color: #d69d1a;
	}
#main.basic p { margin-bottom: 2em; }
#main.basic strong { color: #92805a; }
#main.basic em { font-weight: bold; }


/* FOOTER /////////////////////////////////////////////////////////////////////////////// */
#footer {
	clear: both;
	padding: 0;
	color: #403927;
	background: url(../images/footer.jpg) 0 0 repeat-x;
	height: 205px;
	text-align: center;
	}
	#footer p {
		font-size: 0.9em;
		text-align: center;
		padding-top: 58px;
		background: url(../images/pattern.jpg) 0 0 no-repeat;
		margin: 0 0 3px 0;
		}
	#footer ul, #footer li { margin: 0; padding: 0; }

	#footer ul {
		display: table;
		padding: 0; 
		margin: 0 auto; 
		list-style: none;
		white-space: nowrap;
		}
	#footer ul li {
		list-style: none;
		display: table-cell;
		text-transform: uppercase;
		border-right: 1px solid #403927;
		line-height: 1;
		font-size: 1em;
		}
		#footer ul li.end { border: none; }
	#footer ul a {
		width: auto;
		display: block;
		padding: 0 10px;
		text-decoration: none;
		color: #403927;
		}
	#footer ul a:hover { color: #92805a; }
	.footer-menu { clear: both; text-decoration: none; }


/* TOOLS ------------------------------------------------- */

.clear { clear: both; }
.clearfix { zoom: 1; /* for IE7 */ }
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}
* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}
* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}
.accessibility {
	position: absolute;
	left: -999px;
	width: 900px;
	background: none;
	}