/* @override http://local.eternitimotors.com/assets/css/screen.css */

/**
 * GLOBAL SCREEN STYLES
 * ETERNITI MOTORS
 *
 * @author Neal Hulme <nealhulme@gmail.com>
 * @version 1.0
 *
 */

body {
	background: #fff no-repeat center top fixed url();
	color: #808080;
	font-family:"Futura Light", 'Gill Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 62.5%;
	font-size-adjust:0.46;
	font-style:normal;
	font-weight:200;
	line-height: 21px;
	padding-top: 14px;
}
body.white {
	background-color: white;
	color: #666;
}

/* @group Typography
---------------------------------------------------------------------------------------------------- */

h1 {
	color: #ccc;
	font-size: 210%;
	letter-spacing: 0.1em;
	line-height: 28px;
	margin-bottom: 14px;
	text-transform: uppercase;
}
h2 {
	color: #ccc;
	font-size: 140%;
	margin-bottom: 14px;
}
p {
	font-size: 140%;
	margin-bottom: 14px;
}

strong {
	color: #ccc;
}

blockquote {
	font-size: 210%;
	line-height: 28px;
	position: relative;
}
blockquote p {
	font-size: 100%;
}
blockquote:before {
	content: "\201C";
	left: -0.4em;
	position: absolute;
}
blockquote p:last-child:after {
	content: "\201D";
}

address {
	font-size: 140%;
}

/* @end */

/* @group Typography - White
---------------------------------------------------------------------------------------------------- */

.white h1,
.white h2 {
	color: #333;
}

/* @end */

/* @group Links
---------------------------------------------------------------------------------------------------- */

a {
	color: #999;
	text-decoration: none;
	-webkit-transition: 0.25s all;
	-moz-transition: 0.25s all;
	-o-transition: 0.25s all;
	transition: 0.25s all;
}
a:hover {
	color: #ccc;
}

.back-link {
	background: transparent url(../images/css/arrow-left.png) no-repeat 0 50%;
	font-size: 100%;
	letter-spacing: 0.1em;
	margin-top: 42px;
	padding-left: 14px;
	text-transform: uppercase;
}

.download-image {
	background: transparent url(../images/css/arrow-down.png) no-repeat 0 45%;
	padding-left: 14px;
}

.pdf-download {
	background: transparent url(../images/css/pdf.png) no-repeat 0 50%;
	font-size: 100%;
	letter-spacing: 0.1em;
	padding-left: 32px;
	text-transform: uppercase;
}

.read-more {
	background: transparent url(../images/css/arrow-right.png) no-repeat 0 45%;
	font-size: 100%;
	letter-spacing: 0.1em;
	padding-left: 14px;
	text-transform: uppercase;
}

h1 a,
#content p a,
.back-link a,
.download-image a,
.pdf-download a,
.read-more a {
	border-bottom: 1px dotted #666;
	color: #666;
}
h1 a:hover,
#content p a:hover,
.back-link a:hover,
.download-image a:hover,
.pdf-download a:hover,
.read-more a:hover {
	border-bottom-color: #ccc;
	color: #ccc;
}

a.right {
	float: right;
}

/* @end */

/* @group Lists
---------------------------------------------------------------------------------------------------- */

li {
	font-size: 140%;
}
li p {
	font-size: 100%;
}

/* @end */

/* @group Forms
---------------------------------------------------------------------------------------------------- */

label {
	display: block;
	margin-bottom: 7px;
}
label span {
	color: #f30;
}
input,
textarea {
	background: #222;
	border: none;
	color: #999;
	display: block;
	font-family:"Futura Light", 'Gill Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
	font-size-adjust:0.46;
	font-style:normal;
	font-weight:200;
	font-size: 100%;
	line-height: 21px;
	padding: 7px 14px;
	width: 345px;
}
textarea {
	height: 84px;
}

button {
	background: black;
	border: 1px solid #666;
	color: #808080;
	cursor: pointer;
	display: block;
	font-family:"Futura Light", 'Gill Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
	font-size-adjust:0.46;
	font-style:normal;
	font-weight:200;
	font-size: 100%;
	letter-spacing: 0.1em;
	margin-top: 28px;
	padding: 7px 14px;
	text-transform: uppercase;
	-webkit-transition: 0.25s all;
	-moz-transition: 0.25s all;
	-o-transition: 0.25s all;
	transition: 0.25s all;
}
button:hover {
	background: #f30;
	border-color: black;
	color: black;
}


/* @end */

/* @group Pagination
---------------------------------------------------------------------------------------------------- */

#pagination {
	
}
#pagination ul {
	float: left;
}
#pagination li,
#pagination a {
	display: block;
	float: left;
	font-size: 100%;
}
#pagination li.active {
	color: white;
	letter-spacing: 0.3em;
	margin-right: 6px;
	padding: 6px 12px;
	text-transform: uppercase;
}
#pagination a {
	background: #181818;
	letter-spacing: 0.3em;
	margin-right: 6px;
	padding: 6px 12px;
	text-transform: uppercase;
}
#pagination a:hover {
	background: #222;
}

/* @end */

/* @group Header
---------------------------------------------------------------------------------------------------- */

#header {
	background: ;
	left: 50%;
	margin-bottom: 7px;
	margin-left: -456px;
	position: relative;
	text-align: center;
	width: 912px;
}

/* @end */

/* @group Navigation
---------------------------------------------------------------------------------------------------- */

#nav {
	background: white;
	left: 50%;
	margin-top: 7px;
	margin-left: -456px;
	overflow: hidden;
	padding-bottom: 28px;
	position: relative;
	text-align: center;
	width: 912px;
}
.ie7 #nav {
	height: 28px;
}

#nav li {
	display: inline-block;
	font-size: 13px;
}
.ie7 #nav li {
	display: inline;
	zoom:1;
}

#nav a {
	color: #808080;
	display: block;
	letter-spacing: 0.3em;
	line-height: 28px;
	padding: 0 1.5em;
	text-transform: uppercase;
}
.ie7 #nav a {
	display: inline;
}
#nav a:hover,
#nav li:hover a {
	color: #ccc;
}

#nav .here a,
#nav .here a:hover {
	color: #CCC;
	cursor: default;
}

#nav ul ul {
	background: white;
	display: block;
	left: 0;
	position: absolute;
	bottom: -28px;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-o-transition: 0.5s all;
	transition: 0.5s all;
	width: 912px;
	z-index: 9;
}
#nav ul li:hover ul {
	bottom: 0;
	z-index: 999;
}
#nav ul ul a,
#nav ul li:hover ul a,
#nav ul .here ul a {
	color: #333;
}
#nav ul li ul a:hover,
#nav ul .here ul a:hover {
	color: #f30;
	cursor: pointer;
}

#nav ul .here ul .here a,
#nav ul .here ul .here a:hover {
	color: #f30;
	cursor: default;
}
#nav ul .here ul,
#nav ul li.here:hover ul {
	bottom: 0;
	z-index: 99;
}

#collection-nav {
	background: white;
	left: 50%;
	margin-left: -456px;
	position: absolute;
	text-align: center;
	top: 182px;
	width: 912px;
	z-index: 99;
}

#collection-nav li {
	display: inline-block;
	font-size: 100%;
}
.ie7 #collection-nav li {
	display: inline;
	zoom:1;
}

#collection-nav li a {
	color: #333;
	display: block;
	letter-spacing: 0.3em;
	line-height: 28px;
	padding: 0 1.5em;
	text-transform: uppercase;
}
.ie7 #collection-nav li a {
	display: inline;
}
#collection-nav a:hover {
	color: #f30;
}

#collection-nav .here a,
#collection-nav .here a:hover {
	color: #f30;
	cursor: default;
}

/* @end */

/* @group Sub-nav
---------------------------------------------------------------------------------------------------- */

#sub-nav {
	float: left;
	left: -681px;
	position: relative;
	width: 142px;
}

#sub-nav li {
	border-bottom: 1px solid #ccc;
	font-size: 100%;
	letter-spacing: 0.1em;
	line-height: 20px;
	text-transform: uppercase;
}
#sub-nav li li {
	border-top: 1px dotted #1a1a1a;
	border-bottom: none;
	padding-left: 14px;
}

#sub-nav a {
	color: #808080;
}
#sub-nav a:hover {
	color: #ccc;
}
#sub-nav .here a,
#sub-nav .here a:hover {
	color: #f30;
	cursor: default;
}
#sub-nav .here ul a,
#sub-nav .here ul a:hover {
	color: #808080;
	cursor: pointer;
}
#sub-nav .here ul a:hover {
	color: white;
}
#sub-nav .here ul .here a,
#sub-nav .here ul .here a:hover {
	color: white;
	cursor: default;
}


/* @end */

/* @group Content
---------------------------------------------------------------------------------------------------- */

#content {
	left: 50%;
	margin: 21px 0 21px -456px;
	min-height: 420px;
	position: relative;
	width: 912px;

}

/* @end */

/* @group Strap
---------------------------------------------------------------------------------------------------- */

#strap {
	left: 50%;
	margin: 0 0 21px -456px;
	position: relative;
	width: 912px;
}

#strap h1 {
	font-size: 180%;
	left: 48px;
	letter-spacing: 0.3em;
	line-height: 42px;
	margin-top: -21px;
	position: absolute;
	top: 50%;
	z-index: 9;
}

#strap img {
	display: block;
	float:left;
}

/* @end */

/* @group Main
---------------------------------------------------------------------------------------------------- */

.content #main {
	float: left;
	width: 450px;
}

.specifications #main {
	float: left;
	left: 231px;
	position: relative;
	width: 681px;
}

.press-centre #main {
	float: left;
	left: 231px;
	position: relative;
	width: 681px;
}

/* @end */

/* @group Aside
---------------------------------------------------------------------------------------------------- */

.content #aside {
	float: right;
	width: 373px;
}
.content #aside img.left {
	display: block;
	float: left;
	margin-bottom: 21px;
	position: relative;
}
.content #aside img.center {
	display: block;
	margin: 0 auto;
	margin-bottom: 21px;
	position: relative;
}
.content #aside img.right {
	display: block;
	float: right;
	margin-bottom: 21px;
	position: relative;
}

.gallery #aside {
	float: right;
	width: 219px;
}
.gallery #aside h1 {
	border-bottom: 1px solid #333;
	font-size: 140%;
	letter-spacing: 0.3em;
	line-height: 21px;
	margin-bottom: 13px;
	padding-bottom: 7px;
}
.gallery #aside li {
	font-size: 100%;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* @end */

/* @group Footer
---------------------------------------------------------------------------------------------------- */

#footer {
	border-top: 1px solid #ccc;
	left: 50%;
	line-height: 28px;
	margin: 21px 0 0 -456px;
	padding-bottom: 21px;
	position: relative;
	width: 912px;
}
.white #footer {
	border-color: #ccc;
}

.social {
	background: url(../images/miscellaneous/___twitter.png) no-repeat 0 0;
	display: block;
	float: left;
	height: 18px;
	margin: 5px 5px 0 0;
	opacity: 0.2;
	overflow: hidden;
	text-indent: -999em;
	width: 18px;
}
.white .social {
	background-position: 0 -18px;
}
.social:hover {
	opacity: 0.8;
}
#facebook {
	background-image: url(../images/miscellaneous/___facebook.png);
}

#footer p {
	color: #666;
	float: right;
	font-size: 100%;
	letter-spacing: 0.1em;
	text-align: right;
	text-transform: uppercase;
}
.white #footer p {
	color: #999;
}

/* @end */

/* @group Homepage
---------------------------------------------------------------------------------------------------- */

.home #content {
	margin-top: 0;
}
.home #slider {
	margin-bottom: 21px;
}
.js .home #slider {
	margin-bottom: 63px;
}

.home-modules {
	float: left;
	margin-right: 12px;
	width: 219px;
}
.home-modules:last-of-type {
	margin-right: 0;
}

.home-modules h1 {
	border-bottom: 1px solid #CCC;
	color: #333;
	font-size: 120%;
	line-height: 21px;
	margin-bottom: 13px;
	padding-bottom: 7px;
}
.home-modules .date {
	color: #666;
	font-size: 120%;
}
.js .home-modules h1 {
	background: url(../images/css/___arrow-large-down.png) no-repeat 98%;
}
.home-modules h1,
.home-modules p {
	margin-right: 12px;
	margin-left: 12px;
}
.js .home-modules {
	background: white;
	background: rgba(0,0,0,#FFF);
	bottom: 0;
	position: absolute;
	z-index: 999;
}
.js #home-first { left: 0; }
.js #home-second { left: 231px; }
.js #home-third { left: 462px; }
.js #home-fourth { left: 693px; }
.js .home-modules h1 {
	padding-top: 9px;
}
.js .home-modules div {
	display: none;
}

/* @end */

/* @group Slider
---------------------------------------------------------------------------------------------------- */

.slider #content {
	margin-top: 0;
	margin-bottom: 0;
}
.slider #footer {
	margin-top: 0;
}

#slider {
	position: relative;
	width: 912px;
}
.content #slider {
	top: -21px;
}
.js #slider {
	height: 420px;
	overflow: hidden;
}
#slider li {
	height: 420px;
	margin-bottom: 21px;
	position: relative;
	width: 912px;
}
#slider img {
	left: 0;
	position: absolute;
	top: 0;
}
#slider img.slider-overlay {
	display: none;
}
#slider h1 {
	font-size: 140%;
	left: 28px;
	letter-spacing: 0.3em;
	line-height: 24px;
	margin-top: -12px;
	position: absolute;
	text-shadow: 1px 1px 0 rgba(0,0,0,0.33);
	top: 50%;
}
#slider p {
	color: #999;
	left: 28px;
	margin-top: 24px;
	position: absolute;
	text-shadow: 1px 1px 0 rgba(0,0,0,0.33);
	top: 50%;
	width: 373px;
}
#slider .right h1,
#slider .right p {
	left: auto;
	right: 28px;
	text-align: right;
}

#slider-pager {
	background: url(../images/css/slider-solid.png) no-repeat;
	bottom: 14px;
	left: auto;
	position: absolute;
	right: 21px;
	z-index: 100;
}
.ie7 #slider-pager {
	display: none;
}
#slider-pager a {
	background: url(../images/css/slider-outline.png) no-repeat 0 0;
	display: inline-block;
	height: 20px;
	margin-left: 3px;
	text-indent: -999px;
	width: 20px;
}

/* @end */

/* @group The Collection
---------------------------------------------------------------------------------------------------- */

#the-collection-hover {
	background: white;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	-o-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	display: none;
	left: 50%;
	margin-left: -265px;
	padding: 7px;
	position: absolute;
	top: 189px;
	z-index: 999;
}
#the-collection-hover a {
	display: inline-block;
	padding: 0 7px;
	position: relative;
}
#the-collection-hover a:hover {
	color: #f30;
}
#the-collection-hover a span {
	bottom: 0;
	left: 0;
	letter-spacing: 0.1em;
	line-height: 28px;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
}

#the-collection {
	text-align: center;
	width: 100%;
}
#the-collection li {
	display: inline-block;
	letter-spacing: 0.3em;
	position: relative;
	text-transform: uppercase;
}
.ie7 #the-collection li,
.ie8 #the-collection li {
	float: left;
}
#the-collection li img {
	display: block;
	opacity: 0.5;
	-webkit-transition: 0.25s all;
	-moz-transition: 0.25s all;
	-o-transition: 0.25s all;
	transition: 0.25s all;
}
#the-collection li:hover img {
	opacity: 1;
}
#the-collection li span {
	bottom: 0;
	display: block;
	left: 0;
	position: absolute;
	width: 373px;
}

.galleria #content {
	margin-top: 0;
	margin-bottom: 0;
	
}
.galleria #footer {
	margin-top: 0;
}

/* @end */

/* @group Specifications
---------------------------------------------------------------------------------------------------- */

.specifications #main h1,
.specifications #main h2,
.specifications #main h3,
.specifications #main h4,
.specifications #main p,
.specifications #main ul {
	margin-right: 12px;
	margin-left: 12px;
}
.specifications #main h1 {
	font-size: 140%;
	line-height: 21px;
	margin-bottom: 14px;
}

.specification-group {
	width: 681px;
	margin-bottom: 21px;
}
.js .specification-group {
	display: none;
}
.js .specification-group:first-child {
	display: block;
}
.specification-group .body {
	float: left;
	width: 450px;
}

.specification-group li {
	list-style: square outside;
	margin-left: 21px;
}

.specification-group img {
	float: right;
}

.specifications table {
	width: 100%;
}
.specifications th,
.specifications td {
	font-size: 130%;
	padding: 7px 14px;
}
.specifications th {
	color: #999;
}
.specifications tr:nth-child(odd) {
	background: #111;
}

/* @end */

/* @group Downloads
---------------------------------------------------------------------------------------------------- */

body.video h1 {
	text-align: center;
}
body.video #main {
	text-align: center;
}
body.video #main img {
	display: block;
	margin: 63px auto 21px;
}

.js body.video #main.flash img,
.js body.video #main.flash p {
	display: none;
}

body.video #main div {
	height: 360px;
	margin: 0 auto;
	width: 640px;
}

.caption-bottom span {
	display: block;
	font-size: 71.428571429%;
	line-height: 28px;
}
.ratios {
	font-size: 85.714285714%;
}
#content .ratios a {
	border: none;
	display: block;
	letter-spacing: 0.1em;
	padding-left: 25px;
	text-transform: uppercase;
}
.ratios .colorbox {
	padding-left: 0;
}
#content .ratios a:hover {
	background-position: 4px -16px;
	border: none;
}
a.ratio43 {
	background: url(../images/css/ratio43.png) no-repeat 4px 4px;
}
a.ratio85 {
	background: url(../images/css/ratio85.png) no-repeat 4px 4px;
}
a.ratio169 {
	background: url(../images/css/ratio169.png) no-repeat 4px 4px;
}

/* @end */

/* @group Press Centre
---------------------------------------------------------------------------------------------------- */

.press-centre #main h1,
.press-centre #main h2,
.press-centre #main h3,
.press-centre #main h4,
.press-centre #main p {
	margin-right: 12px;
	margin-left: 12px;
}

.article-summary {
	border-bottom: 1px solid #ccc;
	margin-bottom: 20px;
	position: relative;
}
.article-summary:last-of-type {
	border: none;
	margin-bottom: 0;
}
.press-article #main img,
.article-summary img {
	float: left;
	margin-bottom: 21px;
}
.press-article #main h1,
.press-article #main p,
#main .article-summary h1,
#main .article-summary p {
	margin-left: 243px;
}
.press-article #main h1,
.article-summary h1 {
	font-size: 140%;
	letter-spacing: 0.1;
	line-height: 21px;
	margin-bottom: 7px;
	padding-top: 28px;
}
.press-article #main .date,
.article-summary .date {
	font-size: 120%;
	left: 0;
	position: absolute;
	top: 0;
}

.press-article .pdf-download {
	left: 0;
	margin-left: 0 !important;
	position: absolute;
	top: 189px;
}

.article-links {
	border-top: 1px dotted #222;
	font-size: 100%;
	padding-top: 20px;
	text-align: center;
}
.previous-article,
.next-article {
	float: left;
	text-transform: uppercase;
}
.next-article {
	float: right;
}

/* @end */

/* @group Gallery
---------------------------------------------------------------------------------------------------- */
.gallery-list #main {
	left: 0;
	width: 912px;
}
.gallery #main {
	float: left;
	left: 0;
	width: 681px;
}
.gallery h1 a {
	float: right;
	font-size: 57.142857143%;
	line-height: 21px;
	position: relative;
	top: 7px;
}

.gallery-listing li {
	float: left;
	margin-right: 12px;
	margin-bottom: 14px;
	width: 219px;
}
.gallery-listing img {
	display: block;
}
.no-js .gallery-listing img {
	margin-bottom: 7px;
}
.gallery-image-list li {
	float: left;
	margin-right: 12px;
	width: 142px;
}
.gallery-listing li:nth-of-type(4n) {
	margin-right: 0;
}
.gallery-image-list li:nth-of-type(4n) {
	margin-right: 0;
}
.gallery-listing h2,
.gallery-image-list h2 {
	font-size: 100%;
	margin-bottom: 0;
}

.gallery-listing p,
.gallery-image-list .download-image,
.gallery-image-list .preview,
.gallery-image-list .reference {
	font-size: 83.333333333%;
}
.gallery-image-list .download-image {
	margin-bottom: 0;
}

.gallery-list #main p {
	margin: 0;
}

/* @end */

/* @group Contact
---------------------------------------------------------------------------------------------------- */

.contact #main {
	float: left;
	width: 450px;
}
.contact #aside {
	float: right;
	text-align: right;
	width: 450px;
}

.dealership {
	float: left;
	margin-right: 12px;
	width: 219px;
}
.dealership:nth-child(4n) {
	margin-right: 0;
}

.dealership h1 {
	font-size: 140%;
	line-height: 21px;
	margin-bottom: 0;
}

.js .dealerships #content h1 {
	display: none;
}
.js .dealership {
	display: none;
}

.mapMarker {
	cursor: pointer;
	height: 20px;
	opacity: 1;
	position: absolute;
	width: 20px;
	z-index: 99;
}

.mapMarkerCentre {
	background: #f30;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-o-border-radius: 20px;
	border-radius: 20px;
	height: 10px;
	left: 5px;
	position: absolute;
	top: 5px;
	width: 10px;
}

.mapMarkerPing {
	border: 5px solid #f30;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	-o-border-radius: 40px;
	border-radius: 40px;
	height: 30px;
	left: -10px;
	opacity: 0;
	position: absolute;
	top: -10px;
	width: 30px;
	
	-webkit-animation-name: 'ping';
	-webkit-animation-duration: 2s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-in-out;
	animation-name: 'ping';
	animation-duration: 2s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}

@-webkit-keyframes 'ping' {
	0% {
		-webkit-transform: scale(0.1);
		opacity: .66;
	}
	75% {
		-webkit-transform: scale(1);
		opacity: 0;
	}
	100% {
		-webkit-transform: scale(1);
		opacity: 0;
	}
}
@keyframes 'ping' {
	0% {
		-webkit-transform: scale(0.1);
		opacity: .66;
	}
	75% {
		-webkit-transform: scale(1);
		opacity: 0;
	}
	100% {
		-webkit-transform: scale(1);
		opacity: 0;
	}
}

/* @end */