@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/

* {
  -webkit-overflow-scrolling: touch;
}

img, object, embed, video, iframe {
	max-width: 100%;
}

.screenreader {
	text-indent: -9999px;
	font-size:0;
}
sup {
 font-size: smaller;
}
h1 sup {
	font-size: 40%;
}
ul.extra-space li {
	margin: 10px 0;
}

/* responsively embed video */

.video-container {
overflow: hidden;
position: relative;
width:100%;
}

.video-container::after {
padding-top: 56.25%;
/* 16:9 ratio */
display: block;
content: '';
}
 
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

.clr	{
	clear: both
}

/* Animations */

@-webkit-keyframes fadein { from {opacity:0} to {opacity:1} }
@keyframes fadein { from {opacity:0} to {opacity:1} }

.fadein {-webkit-animation:fadein 0.5s; animation:fadein 0.5s}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		8;
	dw-num-cols-tablet:		16;
	dw-num-cols-desktop:	24;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

.fluid {
	clear: both;
	margin-left: 0;
	width: 100%;
	float: left;
	display: block;
}

.fluidList {
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;        
}

/* default css for hidden elements */
#autoLocation	{
	display: none;
}
html.noscroll	{
	position: fixed; 
    overflow-y: scroll;
    width: 100%;
}

.img-right {
	display: block;
	margin: 0 auto;
}


/* Mobile Layout: 480px and below. */
  
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	clear: none;
	float: none;
	padding:0;
}
#header {
	position: absolute;
	margin: 0;
	padding-top: 1%;
	padding-bottom: 1%;
	z-index: 500;
	border-top: 6px solid transparent; /* used to be #f1c621 */
	background-color: none;
	/*background: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1));
    background: -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1));
    background: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1));
    background: linear-gradient(to top, rgba(255,255,255,0), rgba(241,198,33,1)); */
}
	#header.open {
		background-color: #fff;
		height: 100vh;
		overflow-y: auto;
	}
#logo {
	width: 23.0769%;
}
	#superpro-logo	{
		margin-top: 0;
		margin-left: 15%;
	}
#mainNav {
/*width: 61.5384%;
margin: 1% 0 0 2.5641%;
clear: none;*/
font-weight: 400;
text-transform:uppercase;
font-size: 90%;
width: 100%;
padding-bottom: 0;
/*position: absolute; */
/*top: -12px; */ /* needs to be top minus 2 x top border width of the header */
/*height: 100%; */
}
	#mainNav.open {
		/*overflow-y: auto;*/
		min-height: 100vh;
		float: none;
		padding-bottom: 10%;
	}
#menu-circle {
    background-color: #163b79;
    border-radius: 50%;
    width: 46px;
	height: 46px;
    position: absolute;
	top: 8px;
	right: 2.5%;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    z-index: 1;
}
.menu-link {
	background-color: #163b79;
    border-radius: 50%;
    width: 46px;
	height: 46px;
	z-index: 9999;
	outline: 0;
	display: inline-block;
	position: absolute;
	top: 14px;
	right: 5%;
	-webkit-tap-highlight-color: rgba(0,0,0,0); /* remove tap colour on mobiles */
}
#mainNav.light .menu-link {
	background-color: #f1c621;
}
#mainNav.open .menu-link {
	background-color: #f1c621;
}
#mainNav.light.open .menu-link {
	background-color: #f1c621;
}

.menu-icon {
	/*width: 50px;
	height: 50px;*/
}
#mainNav .menu-line {
  background-color: #fff;
  height: 2px;
  width: 50%;
  border-radius: 2px;
  position: absolute;
  left: 25%;
  transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
#mainNav.light .menu-line	{
	background-color: #163b79;
	/*box-shadow: 0px 0px 2px #333;*/
}
#mainNav.open .menu-line, #mainNav.light.open .menu-line	{
	background-color: #163b79;
	box-shadow: none;
	/*transition: all 0.25s ease 0s;*/
}

.menu-line-1 { top: 15px; }

.menu-line-2 {
  top: 0;
  bottom: 0;
  margin: auto;
}

.menu-line-3 { bottom: 15px; }

#mainNav.open .menu-line-1 {
  transform: translateY(8px) translateY(-50%) rotate(-135deg);
}

#mainNav.open .menu-line-2 {
  opacity: 0;
}

#mainNav.open .menu-line-3 {
  transform: translateY(-8px) translateY(50%) rotate(135deg);
}
.menu-link:active, .menu-link:focus {
	outline: 0;
}
	#mainNav ul	{
		padding: 0;
		margin: 10px 0 0 0;
		/**/display: none;
		background-color: #fff;
		clear: both;
		position: fixed;
		top: -1px;
		bottom: 0;
		width: 100%;
		/*height: 100%;
		min-height: 100%;*/
		z-index: 999;
		padding-top: 45px;
		overflow-x: hidden;
		overflow-y: auto;
	}
	#mainNav.open ul	{
		display: block;
	}
		#mainNav ul li	{
			display: block;
			font-size: 1.3em;
			font-family: 'Oswald', sans-serif;
			font-weight: 400;
		}
		#mainNav.ie ul li	{
			font-weight:200;
		}
			#mainNav ul li a, #mainNav ul li a:visited	{
				color: #163b79;
				display: block;
				outline: 0 none;
				padding: 10px 18px;
				text-decoration: none;
				z-index: 270;
				background:none;
				transition: all 0.12s ease 0s;
			}
			#mainNav ul li a:hover, #mainNav ul li a:active, #mainNav ul li a.selected	{
				background-color: #f1c621;
			}
			#mainNav ul li a#btnSearch	{
			}
			/* LIGHT VARIANT
				#mainNav.light ul li a, #mainNav.light ul li a:visited	{
					color: #FFF;
				}
				#mainNav.light ul li a:hover, #mainNav.light ul li a:active, #mainNav.light ul li a.selected	{
					color: #000;
				} */

/* FULL SCREEEN MENU */
/* The Overlay (background) */
.overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */   
    height: 0%;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 999; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(255,255,255, 1); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.3s; /* 0.3 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
	overflow-y: scroll;
	border-top: 6px solid #f1c621;
	text-align:center;
}

/* Position the content inside the overlay */
.overlay-content {
    position: relative;
    top: 10%; /* 25% from the top */
    width: 95%; /* 100% width */
    text-align: left; /* Centered text/links */
	padding-bottom: 30px;
    margin: 0 auto 0 auto; /* 30px top margin to avoid conflict with the close button on smaller screens */
	color: #fff;
}

/* The navigation links inside the overlay */
.overlay a {
    text-decoration: none;
    font-size: 16px;
    color: #163b79;
    display: block; /* Display block instead of inline */
    outline: 0 none;
	padding: 10px 10px;
	background:none;
	transition: all 0.12s ease 0s;
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
    /*color: #f1c621;*/
	background-color: #f1c621;
	color: #000;
}

/* Position the close button (top right corner) */
.overlay .closebtn {
    position: absolute;
    top: 15px;
    right: 35px;
    font-size: 40px;
	margin:0; padding: 0;
	line-height: 40px;
	z-index: 999;
}
	.overlay a.closebtn:hover, .overlay a.closebtn:focus	{
		background: none;
		color: #f1c621;
	}

.grid-sizer, .grid-item	{
	width: 100%;
}
.gutter-sizer	{
	width: 0;
}
.grid-item { min-height: 50px; text-align:left; vertical-align:middle; }
.grid-item--width2 { width: 100%; }
.grid-item img	{
	padding-right: 10px;
}
.grid-item .new {
	padding: 0 0 0 10px;
	color: #608800;
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	font-size: 70%;
}
.models-accordion h3 .new {
	color: #608800;
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	font-size: 90%;
	float: right;
}
.models-accordion h3.new {
	color: #608800;
}

#mainContent {
	z-index: 50;
	position: relative;
	width: 100%;
	/*margin-top: 200px;
	padding-bottom: 100px;*/
	float: none;
}

.breadcrumb {
	font-family: 'Oswald', sans-serif;
	font-size: 90%;
	margin-top: 20px;
	/*border-left: 2px solid #f1c621;
	padding-left: 10px;*/
}
	.breadcrumb ul {
		margin: 0;
		padding: 0;
		list-style: none;
		clear: both;
	}
		.breadcrumb ul li {
			float: left;
		}
		.breadcrumb ul li:not(:last-child):after {
			content: "\00a0\00a0>\00a0\00a0";
			position:relative;
    		top:-2px;
		}
			.breadcrumb ul li a, .breadcrumb ul li a:visited {
				color: #163b79;
				text-decoration:none;
				text-transform:uppercase;
				line-height:normal;
				-webkit-transition: all 0.1s ease;
				-moz-transition: all 0.1s ease;
				-ms-transition: all 0.1s ease;
				-o-transition: all 0.1s ease;
				transition: all 0.1s ease;
			}
			.breadcrumb ul li a:active, .breadcrumb ul li a:hover {
				color:#f1c621;
			}

a.button, a.button:visited	{
	text-transform:uppercase;
	font-family: 'Oswald', sans-serif;
	font-size: 150%;
	line-height:normal;
	text-decoration: none;
	padding: 2.5%;
	background-color: #f1c621;
	color: #000;
	border-width: 2px;
	border-style:solid;
	border-color:transparent;
	margin: 0 0 0 0;
	display: block;
	/*width: 95%;*/
	text-align:center;
	-webkit-transition: all 0.1s ease;
	-moz-transition: all 0.1s ease;
	-ms-transition: all 0.1s ease;
	-o-transition: all 0.1s ease;
	transition: all 0.1s ease;
}
	a.button:active, a.button:hover	{
		color: #fff;
		border-color: #f7b224;
		background-color: #001463;
	}

/* trademark quote container */
.quote-container	{
	z-index: 100;
	position: relative;
	margin-top:-7%;
}
svg:not(:root) {
    overflow: hidden;
}
.st0{fill:#f1c621;} /* quote */
.stfooter{fill:#0260ba;}  /*footer top-curve */
#topCurve, #bottomCurve {
	width: 100%;
	float: left;
	z-index: 101;
	height: 100%;
	position: relative;
}
.curve-bottom	{
	margin-top: -2px;
	/* new flat bottom bit */
	background-color: #f1c621;
}

.quote	{
	background-color: #f1c621;
	width: 100%;
	height: 100%;
	text-align: center;
	position: relative;
	margin: -1px 0 -1px 0;
	padding: 0;
	float: left;
	z-index: 100;
}
	.quote-container a, .quote-container a:link, .quote-container a:visited, .quote-container a:hover, .quote-container a:active	{
		color: #252525;
		text-decoration: none;
		outline: none;
	}
	.quote-bg	{
		width: 100%;
		background-image: url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/quote-open-mob.png), url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/quote-close-mob.png);
		background-repeat: no-repeat, no-repeat;
		background-position: 2.5% top, 97.5% bottom;
	}
	.quote-position {
		width: 60%;
		margin: 0 auto;
		/*overflow: hidden;*/
	}
	.quote-position h4, .quote-position h5 {
		margin: 0;
		padding: 0;
		font-weight: normal;
		line-height: 1;
		text-overflow: ellipsis;
		text-transform:uppercase;
	}
	.quote-position h4 {
		font-size: 150%;
		font-style: italic;
	}
	.quote-position h5 {
		font-size: 80%;
		margin-top: 4px;
		padding-bottom: 2px; /* Because the line was being cut off at the base by a couple of pixels when the line wraps over more than a single line */
	}
.bg-maps	{
	
}
#banner {
	/*min-height: 200px;*/
	height: 89vh;
	/*position: absolute;*/
	position: relative;
	display: table;
	top: 0;
	left: 0;
	background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/4x4day.tab.jpg) no-repeat scroll center 20%;
	background-size: cover;
	z-index: 1;
	float: none;
	border-bottom: solid 10px #0260ba;
	text-align:center;
}
.clarify {
	position: absolute;
	height: 100%;
	width: 100%;
	margin-top: -1%;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9Ijc0JSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC42NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(25deg, rgba(0,0,0,0) 40%, rgba(0,0,0,0.55) 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(40%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.55)));
	background: -webkit-linear-gradient(25deg, rgba(0,0,0,0) 40%,rgba(0,0,0,0.55) 100%);
	background: -o-linear-gradient(25deg, rgba(0,0,0,0) 40%,rgba(0,0,0,0.55) 100%);
	background: -ms-linear-gradient(25deg, rgba(0,0,0,0) 40%,rgba(0,0,0,0.55) 100%);
	background: linear-gradient(25deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.55) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=1 );
}
/*
	#banner.light {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/defenders.tab.jpg) no-repeat scroll center 60%;
		background-size: cover;
	}
	#banner.search {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/search.background.tab.jpg) no-repeat scroll center 60%;
		background-size: cover;
	}
	#banner.bar {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/bar.tab.jpg) no-repeat scroll 50% 50%;
		background-size: cover;
	}
	#banner.bar-under {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/bar.under.tab.jpg) no-repeat scroll 55% 60%;
		background-size: cover;
	}
	#banner.caster {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/caster.tab.jpg) no-repeat scroll 75% 50%;
		background-size: cover;
	}
	#banner.arms {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/arms.tab.jpg) no-repeat scroll 75% 65%;
		background-size: cover;
	}
	#banner.trc0003 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/trc0003.tab.jpg) no-repeat scroll 35% 10%;
		background-size: cover;
	}
	#banner.golf5 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/vw.golf.5.tab.jpg) no-repeat scroll center 80%;
		background-size: cover;
	}
	#banner.isuzu-dmax {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/isuzu-dmax.tab.jpg) no-repeat scroll 50% 50%;
		background-size: cover;
	}
	#banner.landcruiserarms {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/landcruiserarms.tab.jpg) no-repeat scroll 54% 0%;
		background-size: cover;
	}
	#banner.mazda-mx5 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/mx5-pc.tab.jpg) no-repeat scroll 65% 66%;
		background-size: cover;
	}
	#banner.porsche918 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/918.tab.jpg) no-repeat scroll 60% 60%;
		background-size: cover;
	}
	#banner.porsche {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/porsche.tab.jpg) no-repeat scroll 50% 60%;
		background-size: cover;
	}
	#banner.ramp {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/focus.rs.ramp.tab.jpg) no-repeat scroll 25% 65%;
		background-size: cover;
	}
	#banner.mustang {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/mustang.tab.jpg) no-repeat scroll 70% 60%;
		background-size: cover;
	}
	#banner.trc1045 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/TRC1045.tab.jpg) no-repeat scroll center 10%;
		background-size: cover;
	}
	#banner.trc10105	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/TRC10105.tab.jpg) no-repeat scroll center 50%;
		background-size: cover;
	}
	#banner.tyretread	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/tyre-tread.tab.jpg) no-repeat scroll left 50%;
		background-size: cover;
	}
	#banner.presstool	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/presstool.tab.jpg) no-repeat scroll center 50%;
		background-size: cover;
	}
	#banner.rallyday	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/rallyday.tablet.jpg) no-repeat scroll center 50%;
		background-size: cover;
	}
*/
#bannerContent	{
	/*display: table-cell;*/
	display: inline-block;
    vertical-align: middle;
	text-align: center;
	padding-top: 28%;
	margin: 0 auto;
}

#bannerContent h3{
	color: #fff;
	font-weight: 400;
	text-transform: uppercase;
	font-size: 200%;
	margin: 0;
}
#bannerContent h4{
	color: #7b94ff;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 120%;
	margin: 0 0 6px 0;
}
#bannerContent h5{
	color: #7b94ff;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 120%;
	margin: 0 0 0 0;
}
#bannerContent h6{
	color: #FFF;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 100%;
	margin: 1% 0 0 0;
}
#bannerContent .spacer {
	height: 1px; width: 100%;
	margin: 0 0 13% 0;
}
	.divider	{
		color: #ccc;
		display: inline;
	}

.fullwidth {
	width: 100%;
	padding: 20px 0;
	background-color: #f3f3ee;
}
	.fullwidth-news-pic {
		width: 100%;
		padding: 20px 0;
		text-align:center;
	}
.fixedwidth {
	width: 90%;
	margin: 0 auto;
	/*overflow-wrap: break-word;
	word-wrap: break-word;
	-ms-word-break: break-all;
	word-break: break-word;*/
	/* Adds a hyphen where the word breaks, if supported (No Blink) */
	/*
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
	*/
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Oswald', sans-serif;
	hyphens: none;
}
	h1	{
		display: inline-block;
		padding-bottom: 3px;
		border-bottom: 3px solid #f1c621;
		font-size: 160%;
		margin-left: auto;
		margin-right: auto;
		text-transform:uppercase;
		font-weight: 400;
		letter-spacing:1px;
	}
	.h1-logo {
		float: left;
		vertical-align: center;
		margin-right: 2.5%;
	}
picture {
	width: 100%;
	max-width: 100%;
	text-align:center;
}
picture source, picture img {
	margin: 0 auto;
}
figure{
	text-align: center;
	max-width: 100%;
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
          page-break-inside: avoid; /* Firefox */
               break-inside: avoid; /* IE 10+ */
	background-color: #f3f3ee;
}
figure.normal-appearance {
	background-color: none;
	text-align: left;
}
figure.normal-appearance figcaption {
	text-align: left;
	font-size: 100%;
	background-color: none;
}
figcaption {
		text-align: left;
		background-color: #000;
		color: #ececec;
		margin-bottom: 28px;
		padding: 10px 16px;
		border-top: 1px solid #f1c621;
		font-size: 80%;
		-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
          page-break-inside: avoid; /* Firefox */
               break-inside: avoid; /* IE 10+ */
	}
	a.enlarge {
		text-decoration: none;
	}
.pswp__caption__center figcaption { /* undo the above */
	text-align: center;
	background: none;
	margin: 0;
	padding: 0;
	font-size: 140%;
}
	.off-screen {
		border: 0 none !important;
		clip: rect(1px, 1px, 1px, 1px);
		height: 1px !important;
		overflow: hidden;
		padding: 0 !important;
		position: absolute !important;
		width: 1px !important;
	}
.txtBlack	{
	color: #000;
}
.txtBlue	{
	color: #163b79;
}
.txtGreen {
	color: #009900;
}
.column-block	{
	
}
	.column-block h3:first-child {
		margin-top: 0;
	}
.column-block {
	padding-bottom: 30px;
}
.no-column-break {
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}
.contentcontainer {
	/*width: 95%;
	margin: 0 2.5%;*/
	float: none;
	clear: both;
	position:relative;
}
	

/* SEARCH POPUP */
#search-container	{
	max-width: 1232px;
	/*background: #fff url(images/SPF0767K.jpg) no-repeat 90% bottom;
	background-size: 50%;*/
	background-color:#fff;
	margin: 0 auto;
	padding: 2.5% 2.5%;
	vertical-align: top;
	position: relative;
	min-height: 500px;
}
	#search-container h4	{
		font-weight: 400;
		font-size: 100%;
		margin-top: 20px;
	}
	#search-container ul {}
	#search-container ul li {
		font-size: 90%;
	}
		#search-container ul li a {
			text-decoration: none;
		}
		#search-container ul li img	{
			display: none;
		}
	#txtKeyword	{
		float: left;
		font-size: 100%;
		width: 80%;
		border: none;
		padding: 10px 5px;
		color: #163b79;
	}

/* placeholder */
		#txtKeyword::-webkit-input-placeholder {
			color: #c2c2c2;
		}
		
		#txtKeyword:-moz-placeholder {
			color: #c2c2c2;
		}
		
		#txtKeyword::-moz-placeholder {
			color: #c2c2c2;
		}
		
		#txtKeyword:-ms-input-placeholder {
			color: #c2c2c2;
		}
	#btnSearchSubmit	{
		float: left;
		width: 10%;
		max-width: 40px;
		margin: 10px 15px 0 0;
	}
	ul.ui-autocomplete	{
		margin-left: 40px;
	}
	.ui-menu-item	{
		cursor: pointer;
		color: #163b79;
		line-height: 1.5;
		margin-bottom: 4px;
		display: block;
		clear: both;
		float: none;
	}
#search-results	{}

/* END: SEARCH POPUP */

.petrol-pump-container {
	float: left;
	margin-right: 10px;
}
.petrol-pump	{
	width: 100%;
	max-width: 12px;
	height:auto;
}

	/* add colours to the pump icons */
	.petrol-pump.diesel .pump {
		fill:#000000;
	}
	.petrol-pump.petrol .pump {
		fill:#4e9947;
	}

/* stockist search box */
#locator input {
	padding: 5px;
	font-family: 'Oswald', sans-serif;
}
	#locator input[type=submit] {
		text-transform: uppercase;
	}

.center	{
	display: block;
	text-align:center;
}
.extra-top-margin	{
	margin-top: 80px;
}

#back-to-top {
    bottom: 20px;
    display: none;
    position: fixed;
    right: 20px;
    z-index: 1000;
}
	#back-to-top a {
		background: url("https://d365pjkgt5rd4j.cloudfront.net/images/icons/backtotop.png") no-repeat scroll center 49% #2892f8;
		border: none;
		border-radius: 100px;
		display: block;
		height: 41px;
		text-indent: -9999px;
		transition: all 0.2s linear 0s;
		width: 41px;
		outline: 0;
		-webkit-tap-highlight-color: rgba(0,0,0,0); /* remove tap colour on mobiles */
	}
		#back-to-top a:hover, #back-to-top a:active {
			background-color: #f1c621
		}
		
/* footer popover */
.cookie-bar {
	font-family: "Roboto",sans-serif;
	background-color: #fff;
    bottom: 0;
    color: #101010;
    height: 100px;
    left: 0;
    padding: 10px;
    position: fixed;
    right: 0;
    width: 100%;
    z-index: 98;
	text-align:center;
}
.obeyx {
    bottom: 81px;
    cursor: pointer;
    position: absolute;
    right: 2%;
    z-index: 99;
	color: #000;
	width: 30px;
	height: 30px;
	text-align:right;
}
		
/* Vehicle Listing */
.vehiclelistcontainer {
}
.vehiclelistcontainer h2 {
	border-bottom: 2px solid #f1c621;
	display: inline-block;
	padding-bottom: 2px;
	letter-spacing: 0.5px;
	font-weight: 600;
	text-transform: uppercase;
	vertical-align: middle;
}
	.h2vehicleyears {
		font-weight: 100;
		font-size: 90%;
		color: #636363;
	}
.vehicle.headerrow {
	font-weight: bold;
}
a .vehicle {
	width: 95%;
	border-bottom: 1px solid #ececec;
	padding: 10px 2.5%;
	transition: all 0.1s linear 0s;
}
a:link .vehicle {
	color: #004890;
}
a:hover .vehicle, a:active .vehicle {
	background: #c4e7ff;
}
a:visited .vehicle {
	color: #551A8B;
}/**/
a:link .vehicle.new, a:hover .vehicle.new, a:active .vehicle.new {
	color:#608800;
}
.vehiclevariant {
/*width: 100%;*/
width: auto;
margin-left: 0;
display: inline;
font-weight:bolder;
}
	.vehiclevariant:after {
    	content: "\00a0";
	}
.vehiclebodystyle {
/*width: 100%;*/
width: auto;
margin-left: 0;
clear: none;
display: inline;
}
	.vehiclebodystyle:after {
 	   content: "\00a0";
	}
.vehicledrivetype {
/*width: 100%;*/
width: auto;
margin-left: 0;
clear: none;
display: inline;
}
.vehicleyears {
width: 100%;
clear: both;
margin-left: 0;
}

/* END: Vehicle Listing */

/* Product Listing */

.productcontainer {
	padding: 2.5% 0;
	border-top: 1px solid #f1c621;
	background: #fff;
	/*border-bottom: 2px solid #004890;*/
}
.productcontainer.productoption {
	border-top: none;
	width: 92%;
	padding: 1% 4%;
	background: #fff;
}
.productcontainer:last-child {
	border-bottom: 1px solid #f1c621;
}
.productphoto {
width: 100%;
clear: both;
margin-left: 0;
}
	.productphotocrop {
		width: 100%;
		position: relative;
		height: 100px;
		overflow: hidden;
	}
	.productphotocrop img {
		position: absolute;
		margin: auto;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
.producttitle {
width: 87.1794%;
clear: none;
margin-left: 2.5641%;
margin-top: 6px;
}
	.producttitle h2 {
		margin: 0;
		font-size: 120%;
	}
	.producttitle h3 {
		margin: 0;
	}
.productdescription {
width: 87.1794%;
clear: both;
margin-left: 12.8205%;
}
.productattributes {
width: 87.1794%;
clear: both;
margin-left: 12.8205%;
}
.productnumber {
width: 10.2564%;
margin-left: 0;
font-family: 'Oswald', sans-serif;
font-size: 200%;
color: #004890;
text-align:center;
	/* stop the wrapping of the numbers */
	overflow-wrap: normal;
	word-wrap: normal;
	-ms-word-break: normal;
	word-break: normal;
	/* Adds a hyphen where the word breaks, if supported (No Blink) */
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;

}
	.productoption .productnumber {
		font-size: 180%;
	}
				.bom-stock-indicator {
					width: 3px;
					height: 10px;
					display: inline-block;
					margin-right: 12px;
				}
				.bom-stock-indicator.instock {
					background-color: #78af2d
				}
				.bom-stock-indicator.nostock {
					background-color: #f1592a
				}
/* END: Product Listing */

/* Part Number Display */

.partnumbercontainer {
}
.partdetails {
/*width: 61.5384%;*/
width: 100%;
}
	.partdetails h1 {
		font-size: 200%;
	}
	.partdetails h2 {
		font-size: 120%;
		margin-top: 0;
	}
.partnumberphoto {
width: 100%;
margin-left: 0;
padding-top: 0;
/*width: 35.8974%;
clear: none;
margin-left: 2.5641%;
padding-top: 10%;*/
}
ul.alternative-products li {
	margin: 6px 0;
}

.richmediacontainer {
}
.richmediaitem {
width: 48.7179%;
clear: none;
margin-left: 2.5641%;
margin-top: 10px;
background-color: #f5f7f7;
}
	.richmediaitem:nth-child(even) {
		background-color: #edf1f1;
	}
	.richmediaitem img {
		max-height: 75px;
		margin: 0 auto;
	}
.richmediaitempadding {
	width: 80%;
	padding: 10%;
	text-align:center;
}
	.richmediaitempadding a, .richmediaitempadding a:visited {
		
	}
	.richmediacontainer h4 {
		margin: 10px 0 0 0;
	}

/* END: Part Number Display */

/* FAQs */

.faq { margin-bottom: 50px;}
.faq-container {
	margin-bottom: 20px;
}
.faq h2 {
	text-transform: uppercase;
	color: #163b79;
}
.question {
	margin: 0 15px 10px 15px;
	font-weight: 400;
	font-size: 140%;
	color: #163b79;
	cursor: pointer;
	display: inline-block;
}
.answer-container {
	height: 0px;
    overflow: hidden;
    padding: 0px;
}
.answer {
	margin: 0 15px 30px 15px;
	padding-bottom: 30px;
}

/* END: FAQs */



/* search.results.cfm */
#search-results h4	{
	margin: 20px 0
}
	ul.search-result	{
		padding: 0; margin: 0
	}
	ul.search-result li	{
		padding: 15px 0;
		list-style:none;
	}
	ul.search-result li a, ul.search-result li a:visited	{
		text-decoration: none
	}
	ul.search-result li a:hover, ul.search-result li a:active	{
		text-decoration: underline
	}
	.search-image	{
		width: 20%;
		float: left;
	}
	.search-image img {
		max-width: 100%;
	}
	.search-text-container	{
		float: left;
		width: 60%;
	}
		.search-result-number	{
			font-size: 210%;
			color: #999;
			width: 20%;
			float: left;
			text-align:center;
		}
		.search-result-title	{
			font-size: 120%;
			color: #333;
			display: block;
		}
			.search-result-title img	{
				float: right;
				left-padding: 5px;
			}
		.search-result-description	{
			font-size: 80%;
			color: #666;
			line-height:normal
		}
		.search-result-category	{
			display: block;
			color: #999;
			font-size: 11px;
			font-weight:normal;
			letter-spacing:normal
		}
		.search-result-category	{
			padding-top: 10px;
		}
/* END: search.results.cfm */

/* NEWS */
.top-headline {
	width: 100%;
	background-color: #fff;
	-webkit-box-shadow: 0 2px 5px rgba( 0, 0, 0, .2 ); /* 2 5 */
	box-shadow: 0 2px 5px rgba( 0, 0, 0, .2 ); /* 2 5 */
	color: #474d51;
	margin-bottom: 40px;
}
a .top-headline, a:visited .top-headline {
	
}
a:active .top-headline, a:hover .top-headline {
	background: #f1c621;
	color: #000;
	transition: all 0.1s linear 0s;
}
	.top-headline-image, .top-headline-intro {
		width: 100%;
		float: left;
	}
	.top-headline-intro-container {
		position: relative;
		margin: 0 5%;
	}
	.news-article-type {
		color: #767676;
		position: absolute;
		bottom: 20px;
	}


.news-list
{
	overflow: hidden;
	list-style:none;
	margin: 0; padding: 0;
}
	.news__item
	{
		width: 100%; /* 1 item per row */
		float: left;
		position: relative;
	}
	html.no-js .news__item
	{
		width: 100%;
		float: none;
	}
	.news__item a, .news__item a:visited {
		text-decoration: none;
	}
	.news__item a:hover .news__item__inner, .news__item a:active .news__item__inner {
		background: #f1c621;
		color: #000;
		transition: all 0.1s linear 0s;
	}
	.news__item figure {
		margin:2.5%; padding: 0 0 2px 0;
	}
	.news__item figcaption {
		color: #333;
		background: none;
	}
	.news__item figure .news-article-type {
		position: absolute;
		bottom: 20px;
		margin-left: 5%;
		font-size: 75%;
	}
		.news__item__inner
		{
			color: #474d51;
			background-color: #fff;
			-webkit-box-shadow: 0 2px 5px rgba( 0, 0, 0, .2 ); /* 2 5 */
			box-shadow: 0 2px 5px rgba( 0, 0, 0, .2 ); /* 2 5 */
		}

		
		html.no-js .news__item__inner
		{
			overflow: hidden;
		}

		
			.news__item__inner img
			{
				width: 100%;
			}
			html.no-js .news__item__inner img
			{
				max-width: 100%; /* 150 */
				float: right;
				margin-left: 20px; /* 20 */
			}

		
				.news__item__inner figcaption,
				.news__item__inner p
				{
					padding: 20px; /* 20 */
				}
				
			.keep-me-informed {
				padding: 20px 30px;
				border: 5px solid #0260ba;
			 }
#news-article {
	hyphens: none;
}

/* END: NEWS */

/* TABLE */

th {
	text-align: left;
	font-weight: bold;
	font-size: 120%;
	color: #000;
	text-transform: uppercase;
	padding-bottom: 12px;
}
	th .th {
		margin-bottom: 10px;
		display: inline-block;
		border-bottom: 2px solid #f1c621;
	}
	td {
		padding-bottom: 12px;
	}
	
/* END: TABLE */

/* START: Videos */

.youtube-video-container {
	float: left;
	width: 100%;
	margin-left: 0;
	margin-bottom: 10%;
}
.youtube-video-container:nth-child(4n+1) {
	margin-left: 0;
}
.youtube-video-container:nth-child(4n+5) {
	clear: both;
}
	.youtube-video-container .thumbnail {
		margin-bottom: 10px;
	}
	.youtube-video-container .title {
		display: -webkit-box;
		max-height: 3.2rem;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: normal;
		-webkit-line-clamp: 2;
		font-size: 1.0rem;
		font-weight: 500;
		line-height: 1.2rem;
	}
	.youtube-video-container .published {
		font-size: 0.8rem;
		color: #666;
		margin-top: 6px;
	}
	
	.video-nav-container {
		width: 100%;
		text-align:center;
		margin-bottom: 5vh;
	}
		.video-nav-container .next, .video-nav-container .prev, .video-nav-container .pageinfo {
			margin: 10px;
			border: 1px solid transparent;
			display: inline-block;
		}
		.video-nav-container .next a {
			border-right: 2px solid #f1c621;
		}
		.video-nav-container .prev a {
			border-left: 2px solid #f1c621;
		}
		.video-nav-container a, .video-nav-container a:visited {
			text-decoration:none;
			color: #000;
			background: #F5F5F5;
			padding: 10px 15px;
		}
		.video-nav-container a:hover, .video-nav-container a:active {
			background: #f1c621;
		}
		.video-nav-container .pageinfo {
			border: 1px solid transparent;
			background: none;
			padding: 10px 15px;
			display: inline-block;
		}

/* END: Videos */

/* SITEMAP */

dl {}
	dt {
		font-weight: bold;
		font-size: 120%;
		margin-top: 30px;
		margin-bottom: 10px;
		display: inline-block;
		border-bottom: 2px solid #f1c621;
	}
		dd {
			margin-top: 6px;
			margin-bottom: 6px;
		}
		dd:last-child {
			
		}
		dl dt dd dl {
			margin-left: 80px;
		}

/* END: SITEMAP */


a.nounderline {
	text-decoration: none;
}

#footer {
	color: #000;
	/*margin-top: 40px;
	position: absolute;
    left: 0;
    bottom: 0;*/
}
#footer-container {
	background-color: #f1c621;
	/* margin-top: -1px; if using the angled curve */
	padding: 60px 0;
	border-top: 5px solid #fbd666;
}
	#footer-container a, #footer-container a:visited {
		color: #333;
		text-decoration: none;
		transition: all 0.1s linear 0s;
	}
	#footer-container a:hover, #footer-container a:active {
		color: #003;
	}
.footer-column-section	{
	width: 80%;
	margin: 0 10%;
	float: left;
}
	.footer-column-section, .footer-column-section h3	{
		font-family: Arial,Helvetica,freesans,sans-serif;
	}
	.footer-column-section h3	{
		font-weight: 700;
		font-size: 16px;
		padding-bottom: 2px;
		/*border-bottom: 1px solid #2892f8;*/
		display: inline-block;
		margin: 0;
	}
	.footer-column-section	{
		font-weight: 400;
		font-size: 13px;
	}
	.footer-column-section:first-child {
		margin-top: 30px;
	}
	.footer-column-section:last-child {
		margin-bottom: 20px;
	}
	.footer-column-section ul	{
		list-style: none;
		padding-left: 0;
		margin-top: 0;
	}
		.footer-column-section ul li	{
			margin-bottom: 0px;
		}
	#footer-divider	{
		clear: both;
		width: 80%;
		margin: 10px 10%;
		height: 1px;
		/*background-color: #2892f8;*/
	}
	#footer-social-container {
		width: 80%;
		margin: 20px 10% 0 10%;
		float: left;
	}
		.social-icon {
			float: left;
			width: 32px;
			margin-right: 10px;
		}
#copyright-container {
	width: 80%;
	margin: 10px 10%;
	float: left;
	font-size: 80%;
	color: #555;
	font-family: 'Oswald', sans-serif;
	letter-spacing:1;
	text-align:center;
}
.productContainer {
	width: 100%;
}
.productPhoto {
	width: 30%;
	float: left;
}
.productDescription {
	width: 40%;
	float: left;
}
.productAttributes {
	width: 20%;
	float: left;
}


/* stockists list */
.stockistcontainer {
	margin-bottom: 20px;
}
.stockistdetails {
width: 100%;
clear: both;
margin-left: 0;
}
.stockistscreenshot {
width: 100%;
clear: both;
margin-left: 0;
}
.stockistpadding {
width: 100%;
clear: both;
margin-left: 0;
}

/* END: stockists list */

/* Why SuperPro? */

.majorpointcontainer {
	font-family: 'Oswald', sans-serif;
	font-weight: normal;
	display: table;
	margin-bottom: 20px;
}
.majorpointnumber {
width: 10.2564%;
text-align:center;
color: #003e8e;
display: table-cell;
vertical-align: text-top;
float: none;
}
.majorpointdetail {
width: 87.1794%;
clear: none;
margin-left: 2.5641%;
display: table-cell;
vertical-align:middle;
float: none;
}

/* END: Why SuperPro? */

.desc-secondary {
	font-size: 80%;
	font-style: italic;
}


.zeroMargin_mobile {
margin-left: 0;
}
.hide_mobile {
display: none;
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {
	
.img-right {
	float: right;
	margin-left: 5px;
	position: relative;
	z-index: 1;
}

.gridContainer {
	width: 100%;
	clear: none;
	float: none;
	margin-left: auto;
}
#header {
	border-top-width: 10px;
}
#logo {
width: 24.0506%;
}
	#superpro-logo	{
		
	}
#mainNav {
/*width: 74.6835%;
clear: none;
margin-left: 1.2658%;
text-align:right;*/
}
	#mainNav ul li a {
		padding: 18px 18px;
	}
.menu-link {
	top: 40px;
}

/*
#mainNav .menu-link	{
	
}
	#mainNav ul	{
		padding: 0;
		margin: 0 2.5% 0 0;
		z-index: 1000;
		display: none;
		background-color: transparent;
	}
	#mainNav.open ul	{
		display: block;
		background-color: transparent;
	}
		#mainNav ul li	{
			display: inline-block;
			font-size: 1em;
			font-family: 'Oswald', sans-serif;
			font-weight: 400;
		}
			#mainNav ul li a, #mainNav ul li a:visited	{
				color: #163b79;
				display: block;
				outline: 0 none;
				padding: 18px 18px;
				text-decoration: none;
				z-index: 270;
				background:none;
				transition: all 0.12s ease 0s;
			}
			#mainNav ul li a:hover, #mainNav ul li a:active, #mainNav ul li a.selected	{
				background-color: #f1c621;
			}
				#mainNav.light ul li a, #mainNav.light ul li a:visited	{
					color: #FFF;
				}
				#mainNav.light ul li a:hover, #mainNav.light ul li a:active, #mainNav.light ul li a.selected	{
					color: #000;
				}
*/

.overlay	{
	border-top-width: 10px;
}
.overlay a {}
    .overlay .closebtn {
        font-size: 60px;
        top: 25px;
        right: 40px;
    }
.grid-sizer, .grid-item	{
	width: 32.5%;
}
.gutter-sizer	{}
.grid-item {}
.grid-item--width2 { width: 65%; }
.grid-item img	{}

#mainContent {
	/*margin-top: 500px;*/
}

a.button, a.button:visited	{
	display: inline-block;
	width: auto;
}
	a.button:active, a.button:hover	{
		
	}

/* trademark quote container */
.quote-container	{
	
}
svg:not(:root) {
}
.st0{}
#topCurve, #bottomCurve {
}
.curve-bottom	{
	
}

.quote	{
}
	.quote-bg	{
		background-image: url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/quote-open-tab.png), url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/quote-close-tab.png);
	}
	.quote-position {
		width: 75%;
	}
	.quote-position h4, .quote-position h5 {
	}
	.quote-position h4 {
		font-size: 280%;
	}
	.quote-position h5 {
		font-size: 100%;
	}
.bg-maps	{
	background: url(https://d365pjkgt5rd4j.cloudfront.net/images/backgrounds/map.jpg) no-repeat scroll top right;
	background-size: contain;
}
#banner {
	/*min-height: 95vh;
	min-height: 500px;*/
	background-size: cover;
}
/*
	#banner.light {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/defenders.jpg) no-repeat scroll center 60%;
		background-size: cover;
	}
	#banner.search {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/search.background.jpg) no-repeat scroll center 60%;
		background-size: cover;
	}
	#banner.bar {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/bar.desktop.jpg) no-repeat scroll 50% 50%;
		background-size: cover;
	}
	#banner.bar-under {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/bar.under.desktop.jpg) no-repeat scroll 55% 60%;
		background-size: cover;
	}
	#banner.caster {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/caster.desktop.jpg) no-repeat scroll 75% 50%;
		background-size: cover;
	}
	#banner.trc0003 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/trc0003.jpg) no-repeat scroll 35% 10%;
		background-size: cover;
	}
	#banner.arms {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/arms.jpg) no-repeat scroll 75% 65%;
		background-size: cover;
	}
	#banner.golf5 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/vw.golf.5.jpg) no-repeat scroll center bottom;
		background-size: cover;
	}
	#banner.isuzu-dmax {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/isuzu-dmax.desktop.jpg) no-repeat scroll 50% 50%;
		background-size: cover;
	}
	#banner.landcruiserarms {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/landcruiserarms.desktop.jpg) no-repeat scroll 52% 0%;
		background-size: cover;
	}
	#banner.mazda-mx5 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/mx5-pc.desktop.jpg) no-repeat scroll 65% 66%;
		background-size: cover;
	}
	#banner.porsche918 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/918.jpg) no-repeat scroll 60% 60%;
		background-size: cover;
	}
	#banner.porsche {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/porsche.desktop.jpg) no-repeat scroll 50% 60%;
		background-size: cover;
	}
	#banner.ramp {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/focus.rs.ramp.desktop.jpg) no-repeat scroll 25% 65%;
		background-size: cover;
	}
	#banner.mustang {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/mustang.desktop.jpg) no-repeat scroll 70% 80%;
		background-size: cover;
	}
	#banner.trc1045 {
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/TRC1045.jpg) no-repeat scroll center 90%;
		background-size: cover;
	}
	#banner.trc10105	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/TRC10105.jpg) no-repeat scroll center 50%;
		background-size: cover;
	}
	#banner.tyretread	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/tyre-tread.desktop.jpg) no-repeat scroll left 50%;
		background-size: cover;
	}
	#banner.presstool	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/presstool.jpg) no-repeat scroll center 50%;
		background-size: cover;
	}
	#banner.rallyday	{
		background: url(https://d365pjkgt5rd4j.cloudfront.net/images/banners/rallyday.desktop.jpg) no-repeat scroll center middle;
		background-size: cover;
	}
*/
#bannerContent {
	/*display: table-cell;*/
	vertical-align: middle;
	text-align: center;
	padding-top: 13%;
	margin: 0 auto;
}
#bannerContent h3{
	color: #fff;
	font-weight: 400;
	text-transform: uppercase;
	font-size: 260%;
	margin: 0;
}
#bannerContent h4{
	color: #7b94ff;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 140%;
	margin: 0;
}
#bannerContent h5{
	color: #7b94ff;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 120%;
	margin: 0 0 0 0;
}
#bannerContent h6{
	color: #FFF;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 160%;
	margin: 1% 0 0 0;
}
#bannerContent .spacer {
	height: 1px; width: 100%;
	margin: 0 0 13% 0;
}
	.divider	{
		color: #ccc;
		display: inline;
	}
.fixedwidth {
	width: 95%;
}
h1	{
	font-size: 260%;
}
	.h1-logo {
		margin-top: 7%;
		float: right;
	}
.column-block	{

}
	.column-block h2:first-child	{
		margin-top: 0;
	}
	.column-block p:first-child	{
		
	}
.contentcontainer {
}

/* SEARCH POPUP */
#search-container	{
	
}
	#search-container h4	{
		
	}
	#search-container ul {}
	#search-container ul li {
		
	}
		#search-container ul li a {
			
		}
		#search-container ul li img	{
			display: inline-block;
			max-width: 60px;
			margin-right: 20px;
		}
	#txtKeyword	{
		font-size: 300%;
		padding: 5px;
	}

	#btnSearchSubmit	{
		width: 8%;
		margin: 10px 10px 0 0;
	}
	ul.ui-autocomplete	{
		
	}
	.ui-menu-item	{
		
	}
#search-results	{}

/* END: SEARCH POPUP */

/* stockist search box */
#locator input {
	padding: 10px;
	font-family: 'Oswald', sans-serif;
}
	#locator input[type=submit] {
		text-transform: uppercase;
	}
	
/* Vehicle Listing */
.vehiclelistcontainer {
	margin-bottom: 40px;
}
.vehicle {
width: 95%;
padding: 8px 2.5%;
}
.vehiclevariant {
width: 36.7088%;
margin-left: 0;
}
.vehiclebodystyle {
width: 17.7215%;
margin-left: 1.2658%;
clear: none;
}
.vehicledrivetype {
width: 17.7215%;
margin-left: 1.2658%;
clear: none;
}
.vehicleyears {
width: 24.0506%;
margin-left: 1.2658%;
clear: none;
}
/* END: Vehicle Listing */

/* Product Listing */

.productcontainer {
}
.productphoto {
width: 24.0506%;
clear: none;
margin-left: 1.2658%;
float: right;
}
	.productphotocrop {
		height: auto;
	}
	.productphotocrop img {
		position: relative;
	}
.producttitle {
width: 62.0253%;
clear: none;
margin-left: 1.2658%;
}
	.producttitle h2 {
		font-size: 160%;
	}
.productdescription {
width: 62.0253%;
margin-left: 12.6582%;
clear: none;
}
.productattributes {
width: 62.0253%;
margin-left: 12.6582%;
clear: none;
}
.productnumber {
width: 11.3924%;
clear: none;
margin-left: 0;
font-size: 260%;
}

/* END: Product Listing */

/* Part Number Display */

.partnumbercontainer {
}
.partdetails {
/*width: 55.6962%;*/
width: 100%;
}
	.partdetails h1 {
		font-size: 300%;
	}
	.partdetails h2 {
		font-size: 160%;
	}
.partnumberphoto {
/*width: 43.0379%;
clear: none;
margin-left: 1.2658%;*/
width: 100%;
margin-left: 0;
}

.richmediacontainer {
}
.richmediaitem {
width: 49.367%;
clear: none;
margin-left: 1.2658%;
text-align:center;
}
	.richmediaitem img {
		max-height: 150px;
	}
.richmediaitempadding {
	width: 80%;
	padding: 10%;
}

/* END: Part Number Display */

/* NEWS */

.top-headline {
}
	.top-headline-image, .top-headline-intro {
		width: 100%;
	}
	.top-headline-intro-container {
		position: relative;
		margin: 0 5%;
	}
	.news-article-type {
	}

.news__item {
	width: 33.333%; /* 3 items per row */
	width: 50%; /* 2 items per row */
}

	.keep-me-informed {
		padding: 20px 30px;
		border: 5px solid #0260ba;
	 }

/* END: NEWS */

/* START: Videos */

.youtube-video-container {
	float: left;
	width: 45%;
	margin-left: 5%;
	margin-bottom: 5%;
}
.youtube-video-container:nth-child(2n+1) {
	margin-left: 0;
}
.youtube-video-container:nth-child(2n+3) {
	clear: both;
}
	.youtube-video-container .thumbnail {
		margin-bottom: 10px;
	}
	.youtube-video-container .title {
		display: -webkit-box;
		max-height: 3.2rem;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: normal;
		-webkit-line-clamp: 2;
		font-size: 1.0rem;
		font-weight: 500;
		line-height: 1.2rem;
	}
	.youtube-video-container .published {
		font-size: 0.8rem;
		color: #666;
		margin-top: 6px;
	}
	
	.video-nav-container {
		width: 100%;
		text-align:center;
		margin-bottom: 5vh;
	}
		.video-nav-container .next, .video-nav-container .prev, .video-nav-container .pageinfo {
			margin: 10px;
			border: 1px solid transparent;
			display: inline-block;
		}
		.video-nav-container .next a {
			border-right: 2px solid #f1c621;
		}
		.video-nav-container .prev a {
			border-left: 2px solid #f1c621;
		}
		.video-nav-container a, .video-nav-container a:visited {
			text-decoration:none;
			color: #000;
			background: #F5F5F5;
			padding: 10px 15px;
		}
		.video-nav-container a:hover, .video-nav-container a:active {
			background: #f1c621;
		}
		.video-nav-container .pageinfo {
			border: 1px solid transparent;
			background: none;
			padding: 10px 15px;
			display: inline-block;
		}

/* END: Videos */


#footer {
	/*margin-top: 2.5%;*/
}
#footer-container {
	/**/background-image: url(../images/backgrounds/footer.bg.links.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;
	background-size: 30%;
	border-top-width: 10px;
}
.footer-column-section	{
	width: 40%;
	margin: 0 5%;
}
	.footer-column-section, .footer-column-section h3	{
		
	}
	.footer-column-section h3	{
		
	}
	.footer-column-section	{
	}
	.footer-column-section:first-child {
		margin-top: 0;
	}
	.footer-column-section:last-child {
		margin-bottom: 0;
	}
	.footer-column-section ul	{
	}
		.footer-column-section ul li	{
		}
	#footer-divider	{
		width: 90%;
		margin: 10px 5%;
	}
	#copyright-container {
		width: 90%;
		margin: 0 5%;
		text-align:left;
	}
	#footer-social-container {
		width: 90%;
		margin: 20px 5% 0 5%;
		text-align: left;
	}
.productContainer {
}
.productPhoto {
}
.productDescription {
}
.productAttributes {
}

/* Stockists list */

.stockistcontainer {
}
.stockistdetails {
width: 49.367%;
clear: none;
margin-left: 1.2658%;
}
.stockistscreenshot {
width: 36.7088%;
clear: none;
margin-left: 1.2658%;
}
.stockistpadding {
width: 5.0632%;
clear: both;
margin-left: 0;
}

/* END: stockists list */

/* Why SuperPro? */

.majorpointcontainer {
	margin-bottom: 20px;
}
.majorpointnumber {
width: 11.3924%;
font-size: 260%;
}
.majorpointdetail {
width: 87.3417%;
clear: none;
margin-left: 1.2658%;
font-size: 200%;
}

/* END: Why SuperPro? */

.hide_mobile {
	display: block;
}
.hide_tablet {
display: none;
}
.zeroMargin_tablet {
margin-left: 0;
}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1090px) {
	
.img-right {
	float: right;
	margin-left: 5px;
	position: relative;
	z-index: 1;
}

.gridContainer {
	max-width: 2000px;/**/
	width: 100%;
	margin: auto;
	clear: none;
	float: none;
}
#header {
	border-top-width: 15px;
	overflow: hidden;
}
#logo {
width: 20.168%;
}
	#superpro-logo	{
		margin-left: 10%;
	}
#mainNav {
width: 78.9915%;
clear: none;
text-align:right;
font-weight: 400;
text-transform:uppercase;
margin-left: 0.8403%;
position: static;
height: auto;
}
	#mainNav.ie {
		position: absolute;
		/*right: -21.0083%;*/
		right: 0;
		float: right;
		text-align: right;
	}
#mainNav .menu-link	{
	display: none;
}
	#mainNav ul	{
		padding: 1.5% 0 0 0;
		margin: 0 2.5% 0 0;
		display: inline-block;
		background-color: transparent;
		overflow: auto;
		position: initial;
		width: auto;
		/*display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		flex-direction: row;
   		-webkit-justify-content: flex-end;
   		justify-content: flex-end;*/
	}
	#mainNav.ie ul	{
		display: block;
		overflow: hidden;
		position: relative;
	}
		#mainNav ul li	{
			display: inline-block;
			font-size: 1em;
			vertical-align:top;
		}
			#mainNav ul li a, #mainNav ul li a:visited	{
				
			}
			#mainNav ul li a:hover, #mainNav ul li a:active, #mainNav ul li a.selected	{
				background-color: #f1c621;
			}
			#mainNav ul li a#btnSearch	{
				padding-right: 36px;
				background-image: url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/search-blue.png);
				background-repeat:no-repeat;
				background-position: 88% center;
				background-size: 16px;
				font-size: 100%;
			}
			/* LIGHT VARIANT */
				#mainNav.light ul li a, #mainNav.light ul li a:visited	{
					color: #FFF;
					text-shadow: 0px 0px 2px #333;/**/
				}
				#mainNav.light ul li a:hover, #mainNav.light ul li a:active, #mainNav.light ul li a.selected	{
					color: #000;
					text-shadow: 0 0 0 #fff;/**/
				}
				#mainNav.light ul li a#btnSearch	{
					background-image: url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/search-white.png);
				}
.overlay	{
	border-top-width: 15px;
}
.overlay a {}
    .overlay .closebtn {
        font-size: 60px;
        top: 25px;
        right: 40px;
    }
.grid-sizer, .grid-item	{
	width: 19%;
}
.gutter-sizer	{}
.grid-item {min-height: 30px;}
.grid-item--width2 { width: 38%; }
.grid-item img	{}
				
#mainContent {
	/*margin-top: 28%;*/
}



/* trademark quote container */
.quote-container	{
	
}
svg:not(:root) {
    
}
.st0{}
#topCurve, #bottomCurve {
	
}
.curve-bottom	{
	
}

.quote	{
}
	.quote-bg	{
		background-image: url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/quote-open.png), url(https://d365pjkgt5rd4j.cloudfront.net/images/icons/quote-close.png);
	}
	.quote-position {
		width: 70%;
	}
	.quote-position h4, .quote-position h5 {
	}
	.quote-position h4 {
		font-size: 400%;
	}
	.quote-position h5 {
		font-size: 120%;
	}
.bg-maps	{
	
}
#banner {
	/*min-height: 800px;
	min-height: 100vh;*/
	background-size: cover;
}
	#banner.light, #banner.light.search, #banner.trc0003, #banner.light.golf5, #banner.light.porsche918, #banner.trc1045	{
		background-size: cover;
	}

#bannerContent {
	display: inline-block;
	margin: 0 auto;
}
#bannerContent h3{
	font-size: 400%;
}
#bannerContent h4{
	color: #7b94ff;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 180%;
	margin: 0;
}
#bannerContent h5{
	color: #7b94ff;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 180%;
	margin: 0 0 0 0;
}
#bannerContent h6{
	color: #FFF;
	font-weight: 300;
	text-transform: uppercase;
	font-size: 160%;
	margin: 1% 0 0 0;
}
#bannerContent .spacer {
	height: 1px; width: 100%;
	margin: 0 0 13% 0;
}
	.divider	{
		color: #ccc;
		display: inline;
	}

.fullwidthpic.restricted-height {
	width: 75%;
	background: none;
	padding: none;
	clear: both;
	float: none;
}
.fixedwidth {
	width: 95%;
	max-width: 1232px;
}
h1	{
	font-size: 300%;
}
	.h1-logo {
		margin-top: 4%;
	}
.column-block	{
	-webkit-column-count: 2; /* Chrome, Safari, Opera */
	-moz-column-count: 2; /* Firefox */
	column-count: 2;
	-webkit-column-gap: 20px; /* Chrome, Safari, Opera */
	-moz-column-gap: 20px; /* Firefox */
	column-gap: 20px;
	margin: 0;
}
	.column-block p:first-child	{
		margin-top: 0;
	}
.contentcontainer {
}
	.contentcontainer.SPF1988K {
		background: url(../images/backgrounds/SPF1988K.jpg) no-repeat scroll left 25%;
	}
/* SEARCH POPUP */
#search-container	{
	
}
	#search-container h4	{
		
	}
	#search-container ul {}
	#search-container ul li {
		
	}
		#search-container ul li a {
			
		}
		#search-container ul li img	{
			
		}
	#txtKeyword	{
		
	}

	#btnSearchSubmit	{
	}
	ul.ui-autocomplete	{
		
	}
	.ui-menu-item	{
		
	}
#search-results	{}

/* END: SEARCH POPUP */

/* stockist search box */
#locator input {
	padding: 10px;
	font-family: 'Oswald', sans-serif;
}
	#locator input[type=submit] {
		text-transform: uppercase;
	}
	
/* Vehicle Listing */
.vehiclelistcontainer {
}
.vehicle {
width: 95%;
}
.vehiclevariant {
width: 49.5798%;
margin-left: 0;
}
.vehiclebodystyle {
width: 15.9663%;
margin-left: 0.8403%;
clear: none;
}
.vehicledrivetype {
width: 15.9663%;
margin-left: 0.8403%;
clear: none;
}
.vehicleyears {
width: 15.9663%;
clear: none;
margin-left: 0.8403%;
}
/* END: Vehicle Listing */

/* Product Listing */

.productcontainer {
}
.productphoto {
width: 24.3697%;
margin-left: 0.8403%;
clear: none;
float: right;
}
	.productphotocrop {
			}
	.productphotocrop img {
		position: relative;
	}
.producttitle {
width: 70.5882%;
margin-left: 0.8403%;
clear: none;
}
	.producttitle h2 {
		font-size: 180%;
	}
.productdescription {
width: 70.5882%;
clear: none;
margin-left: 4.2016%;
}
.productattributes {
width: 70.5882%;
clear: none;
margin-left: 4.2016%;
}
.productnumber {
width: 3.3613%;
margin-left: 0%;
clear: none;
}

/* END: Product Listing */

/* Part Number Display */

.partnumbercontainer {
}
.partdetails {
/*width: 49.5798%;*/
width: 100%;
}
.partnumberphoto {
width: 49.5798%;
margin-left: 0.8403%;
clear: none;
}

.richmediacontainer {
}
.richmediaitem {
width: 32.7731%;
margin-left: 0.8403%;
clear: none;
}
	.richmediaitem img {
		max-height: 200px;
	}
.richmediaitempadding {
	width: 80%;
	padding: 10%;
}

/* END: Part Number Display */

/* NEWS */

.top-headline {
}
	.top-headline-image, .top-headline-intro {
		width: 50%;
		float: left;
	}
	.top-headline-image {
		/*max-height: 300px;
		overflow: hidden;*/
	}
	.top-headline-intro-container {
		
	}
	a:hover .news-article-type, a:active .news-article-type {
		color: #163b79;
		transition: all 0.1s linear 0s;
	}
	.news-article-type {
		color: #767676;
		position: absolute;
		bottom: 20px;
	}

.news__item {
	width: 33.3333%; /* 4 items per row */
}
/*
.news__item:first-child {
	width: 50%;
}
.news__item:nth-child(3) {
	clear: right;
}
.news__item:nth-child(4) {
	clear: left;
}*/

	.keep-me-informed {
		padding: 20px 30px;
		border: 5px solid #0260ba;
	 }

/* END: NEWS */

/* START: Videos */

.youtube-video-container {
	float: left;
	width: 22.5%;
	margin-left: 2.5%;
	margin-bottom: 5%;
}
.youtube-video-container:nth-child(2n+1) {
	margin-left: 2.5%;
}
.youtube-video-container:nth-child(2n+3) {
	clear: none;
}
.youtube-video-container:nth-child(4n+1) {
	margin-left: 0;
}
.youtube-video-container:nth-child(4n+5) {
	clear: both;
}
	.youtube-video-container .thumbnail {
		margin-bottom: 10px;
	}
	.youtube-video-container .title {
		display: -webkit-box;
		max-height: 3.2rem;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: normal;
		-webkit-line-clamp: 2;
		font-size: 1.0rem;
		font-weight: 500;
		line-height: 1.2rem;
	}
	.youtube-video-container .published {
		font-size: 0.8rem;
		color: #666;
		margin-top: 6px;
	}
	
	.video-nav-container {
		width: 100%;
		text-align:center;
		margin-bottom: 5vh;
	}
		.video-nav-container .next, .video-nav-container .prev, .video-nav-container .pageinfo {
			margin: 10px;
			border: 1px solid transparent;
			display: inline-block;
		}
		.video-nav-container .next a {
			border-right: 2px solid #f1c621;
		}
		.video-nav-container .prev a {
			border-left: 2px solid #f1c621;
		}
		.video-nav-container a, .video-nav-container a:visited {
			text-decoration:none;
			color: #000;
			background: #F5F5F5;
			padding: 10px 15px;
		}
		.video-nav-container a:hover, .video-nav-container a:active {
			background: #f1c621;
		}
		.video-nav-container .pageinfo {
			border: 1px solid transparent;
			background: none;
			padding: 10px 15px;
			display: inline-block;
		}

/* END: Videos */

#footer {
}
#footer-container {
	background-image: url(../images/backgrounds/footer.bg.links.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	background-size: contain;
	border-top-width: 15px;
}
.footer-column-section	{
	width: 22%;
	margin: 0 1.5%;
}
	.footer-column-section, .footer-column-section h3	{
		
	}
	.footer-column-section h3	{
		
	}
	.footer-column-section	{
	}
	.footer-column-section ul	{
	}
		.footer-column-section ul li	{
		}
	#footer-divider	{
		width: 97%;
		max-width: 1232px;
		margin: 10px 1.5%;
	}
	#copyright-container {
		width: 97%;
		margin: 0 1.5%;
		max-width: 1232px;
		text-align:left;
		text-transform:uppercase;
	}
	#footer-social-container {
		width: 97%;
		margin: 20px 1.5% 0 1.5%;
	}
.productContainer {
}
.productPhoto {
}
.productDescription {
}
.productAttributes {
}

/* Stockists list */

.stockistcontainer {
}
.stockistdetails {
width: 41.1764%;
margin-left: 0.8403%;
clear: none;
}
.stockistscreenshot {
width: 24.3697%;
margin-left: 0.8403%;
clear: none;
}
.stockistpadding {
width: 15.9663%;
margin-left: 0.8403%;
clear: none;
}

/* END: stockists list */

/* Why SuperPro? */

.majorpointcontainer {
}
.majorpointnumber {
width: 7.563%;
}
.majorpointdetail {
width: 91.5966%;
margin-left: 0.8403%;
clear: none;
}

/* END: Why SuperPro? */

.zeroMargin_desktop {
margin-left: 0;
}
.hide_mobile {
	display: block;
}
.hide_tablet {
	display: block;
}
.hide_desktop {
display: none;
}

}


/* phone Landscape */
@media only screen
  and (max-device-width: 800px)
  and (orientation: landscape) {

	#logo {
		width: 15%; /* reduce the size of the logo when viewing on mobile in landscape format */
	}
	
	.news__item {
		width: 50%; /* 2 items per row */
	}

}