@charset "utf-8";
/* 0 - body, group, grid styles */
/* 1 - default button styles */
/* 1.1 - default form styles */
/* 1.2 - default typography styles */

/* 2 - >=1280px styles */
/* 2.1 - alt typographic styles */
/* 2.2 - alt buttons styles */
/* 2.3.1 - alt image styles */

/* 2.4 - top navigation styles */
/* 2.4.1 - header side-menu styles (c) 2015 George Lieu licensed under MIT */
/* 2.4.2 - masthead tint styles */
/* 2.5 - trustpilot styles */
/* 2.6 - legal styles */
/* 2.6.1 popup modal styles */
/* 2.6.2 - 2gdpr cookie consent */
/* 2.6.3 - pull-quote box style */

/* 8 - footer styles */

/* 9.1 - mediaQueries 1024px styles */
/* 9.2 - mediaQueries 996px styles */
/* 9.3 - mediaQueries 420px styles */

/* 0 - body, group, grid styles */
body {
	background-color: #fff;
	font-family: 'Open Sans', Tahoma, Geneva, sans-serif;
	font-size: 0.8em;
	line-height: 1.4;
	font-weight: 300;
	color: #222;
}
section.header, section.header_adblue, section.header_classics, section.header_fillernecks, section.header_motorhomes, section.header_plant, section.main, section.article, section.highlight, section.strapline, section.footer {
 	float: left;
	clear: both;
	width: 100%;
	margin: 0;
	padding: 0;
}
section.header {
	margin: 20px 0;
	padding: 0;
	background-color: #fff;
}
section.header_adblue {
  background-image: url('https://www.thefuelcapcompany.co.uk/images/header/lorries-using-adblue-fuel-additive.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  background-color: #fff;
  height: 60vh;
  overflow: hidden;
  margin: 0;
}
section.header_classics {
  background-image: url('https://www.thefuelcapcompany.co.uk/images/header/classic-blue-mini-john-cooper.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  background-color: #fff;
  height: 60vh;
  overflow: hidden;
  margin: 0;
}
section.header_fillernecks {
  background-image: url('https://www.thefuelcapcompany.co.uk/images/header/aluminium-filler-necks-with-fitting-kits.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  background-color: #fff;
  height: 60vh;
  overflow: hidden;
  margin: 0;
}
section.header_motorhomes {
  background-image: url('https://www.thefuelcapcompany.co.uk/images/header/motorhome-parked-by-mountain-waterfall.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  background-color: #fff;
  height: 60vh;
  overflow: hidden;
  margin: 0;
}
section.header_plant {
  background-image: url('https://www.thefuelcapcompany.co.uk/images/header/agricultural-farm-tractor-lockable-caps.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  background-color: #fff;
  height: 60vh;
  overflow: hidden;
  margin: 0;
}

section.article {
	background-color: #fff;
}
section.highlight {
	padding: 10px 0;
	background-color: #efeff0;
}
section.strapline {
	padding: 0;
	background-color: #71b99e;
}
section.main {
	background-color: #fff;
	min-height: 600px;
}
section.footer {
	position: relative;
	border-top-width: 1px;
	border-top-color: #fff;
	border-top-style: solid;
	background-color: #333;
	padding: 10px 0 20px 0;
}

.container {
	position: relative;
	width: 96.4843%;
	max-width: 1280px;
	height: 100%;
	margin: 0 auto;
	padding: 15px 0;
}
.container_tint {
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

.group:before, .group:after { content: ""; display: table; } /* group (clearfix) - ie8> */
.group:after { clear: both; }
.group { *zoom: 1; }
.column, .column-mb {
	display: block;
	float: left;
	margin: 0 0 0 1.9531%;
 	box-sizing: border-box;
}
.column:first-child { margin-left: 0; }
.row {
	clear: both;
	padding: 0;
	margin: 0 0 15px 0;
}
.row_nomargin {
	clear: both;
	padding: 0;
	margin: 0;
}
.row_25 {
	clear: both;
	padding: 0;
	margin: 0 0 25px 0;
}
.row-bottom-rule {
	clear: both;
	margin: 0 0 15px 0;
	padding: 0 0 5px 0;
	border-bottom: 1px dotted #000;
}
.row-bottom-rule:last-child {
	clear: both;
	margin: 0 0 5px 0;
	padding: 0;
	border: none;
}
.span_1 {
	width: 6.4777%;	
}
.span_2 {
	width: 14.9797%;	
}
.span_3 {
	width: 23.4817%;	
}
.span_4, .span_4pop {
	width: 31.9838%;	
}
.span_5 {
	width: 40.4858%;	
}
.span_6 {
	width: 48.9878%;	
}
.span_7 {
	width: 57.4898%;	
}
.span_8, .span_8pull, .span_12montage {
	width: 65.9919%;	
}
.span_9 {
	width: 74.4939%;	
}
.span_10 {
	width: 82.9959%;
}
.span_11 {
	width: 91.4979%;	
}
.span_12, .span_12img {
	width: 100%;	
}

/* 1 - default button styles */
.button, input[type="submit"], input[type="reset"], input[type="button"] {
	clear: both;
	display: block;
	float: left;
	height: 44px;
	border-radius: 3px;
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px;
	border: none;
	background-color: #222;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.2;
	text-align: center;
	color: #ffffff;
	box-sizing: border-box;
	cursor: pointer;
    -webkit-appearance: button;
	margin: 0 0 15px 0;
	padding: 0;
}
.button:hover, .button-inline:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, .button:focus, .button-inline:focus, input[type="submit"]:focus, input[type="reset"]:focus, input[type="button"]:focus {
	color: #fff;
	background-color: #333;
	box-sizing: border-box;
}

/* 1.1 - default form styles */
.label {
	clear: both;
	display: block;
	margin: 0 0 15px 0;
	padding: 0;
}
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], input[type="file"], textarea, select {
	display: block;
	float: left;
	height: 44px;
	padding-right: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
	padding-left: 10px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
	border: 1px solid #999;
	font-size: 13px;
	line-height: 1.4;
	box-shadow: none;
	box-sizing: border-box;
	background-color: #fff;
	color: #000;
 }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], input[type="file"], textarea {
	-webkit-appearance: none;
	 -moz-appearance: none;
		  appearance: none;
}
textarea {
	min-height: 120px;
	padding-top: 6px;
	padding-bottom: 6px;
 }
.input:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="tel"]:focus, input[type="url"]:focus,
input[type="password"]:focus, textarea:focus, input[type="file"]:focus, select:focus {
	border: 1px solid #FC8C01;
	outline: 0;
}

/* 1.2 - default typography styles */
h1 { font-size: 1.54em; line-height: 1.38; font-weight: 300;}
h2 { font-size: 2.4em; line-height: 1.2; font-weight: 300;}
h3 { font-size: 1.23em; line-height: 1.4; font-weight: 300;}
h4 { font-size: 1.23em; line-height: 1.4; font-weight: 300;}
h5 { font-size: 1.23em; line-height: 1.4; font-weight: 300;}
h6 { font-size: 1.23em; line-height: 1.4; font-weight: 300;}
p {	margin: 0 0 10px 0; padding: 0;}

a:link, a:visited {
    text-decoration: none;
	color: #000;
}
a:hover, a:active {
    text-decoration: none;
	color: #1f75f5;
}
img {
	margin: 0;
	padding: 0;
	display: block;
}

/* 2 - >=1280px styles */
/* 2.1 - alt typographic styles */
.h1-title {
	margin: 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 4.8em;
	line-height: 1.1;
	color: #222;
    text-transform: capitalize;
}
.h2-title {
	margin: 20px 0 0 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 3em;
	line-height: 1.1;
	color: #222;
    text-transform: capitalize;
}
.h3-title {
	margin: 12px 0 6px 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 1.8em;
	line-height: 1.2;
	color: #000;
    text-transform: capitalize;
}
.h3-strapline {
	margin: 0;
	padding: 0;
	font-weight: 300;
	font-size: 1.3em;
	line-height: 1.4;
	color: #fff;
    text-transform: capitalize;
	text-align: center;
	letter-spacing: 2px;
}
.h3-title-centred {
	margin: 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 2.5em;
	line-height: 1.2;
	color: #000;
    text-transform: capitalize;
	text-align: center;
}
.h4-title {
	margin: 0 0 4px 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 1.8em;
	line-height: 1.2;
	color: #000;
    text-transform: capitalize;
}
.h6-title {
	margin: 20px 0 10px 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 2em;
	line-height: 1.2;
	color: #919191;
    text-transform: capitalize;
}
.image_intro {
	margin: 10px 0 0 0;
	padding: 0;
	font-size: 1.2em;
	line-height: 1.4;
	color: #222;
}
.title_intro {
	margin: 0;
	padding: 0;
	font-size: 1.2em;
	line-height: 1.4;
	font-weight: 400;
	color: #222;
	text-align: center;
}

.centre_text {
	text-align: center;	
}
.white_text {
	color: #fff;	
}

a.body_underline:link, a.body_underline:visited {
    text-decoration: underline;
	color: #000;
	font-weight: 400;
}
a.body_underline:hover, a.body_underline:active {
    text-decoration: none;
	color: #ccc;
}
a.tel_link:link, a.tel_link:visited {
    text-decoration: none;
	color: #fff;
}
a.tel_link:hover, a.tel_link:active {
    text-decoration: none;
	color: #ccc;
}
a.intro_link:link, a.intro_link:visited {
    text-decoration: underline;
}
a.intro_link:hover, a.intro_link:active {
    text-decoration: none;
	color: #000;
}

.footer a.tel_link:link, .footer a.tel_link:visited {
    text-decoration: none;
	color: #fff;
}
.footer a.tel_link:hover, .footer a.tel_link:active {
    text-decoration: none;
	color: #ddd;
}

/* 2.2 - alt buttons styles */
.btn_vertical {
/* vertical centre in parent */
	margin: 0;
	padding: 0;
	top: 35%;
	-webkit-transform: translateY(35%);
	-ms-transform: translateY(35%);
	transform: translateY(35%);	
}
.btn_centred {
	margin-left: auto;
	margin-right: auto;
	float: none;
}

/* 2.3 - alt forms styles */

/* 2.3.1 - alt image styles */
.img_corners {
	border-radius: 10px;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px;	
}
.img_with_title {
	margin: 0 0 10px 0;
	padding: 0;	
}
.img_centred {
	margin-left: auto;
	margin-right: auto;	
}
.img_top_margin {
	margin-top: 10px;	
}

/* 2.4 - top navigation styles */
.navigation {
	float: left;
	width: 100%;
	background-color: #222;
}
.navigation_top {
	float: left;
	width: 100%;
	background-color: #71b99e;
}
.navigation_base {
	float: left;
	width: 100%;
	background-color: #fff;
}
.navigation_top .container-nav, .navigation_base .container-nav, .navigation .container-nav-logo {
	position: relative;
	width: 96.4843%;
	max-width: 1280px;
	height: auto;
	margin: 0 auto;
	padding: 15px 0 0 0;
}
.navigation .container-nav-logo {
	padding: 0;
	background-color: #222;
}
.ul-show-menu {
	margin: 0 0 15px 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}
.navigation_top .container-nav .ul-show-menu {
	margin: 0 0 15px 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}
.ul-show-menu li {
	display: inline;
}
.ul-show-menu li.side-menu  {
	display: none;
}
.ul-show-menu li a {
	margin: 0 12px 0 0;
	color: #222;
	text-decoration: none;
	font-size: 1.2em;
	line-height: 1.2;
	font-weight: 400;
}
.ul-show-menu li a:hover, .ul-show-menu li a:active {
    text-decoration: none;
	color: #D5D5D5;
}
.navigation_top .ul-show-menu li a {
	margin: 0 16px 0 0;
	color: #fff;
	text-decoration: none;
	font-size: 1em;
	line-height: 1.2;
	font-weight: 400;
	text-transform: uppercase;
}
.navigation_top .ul-show-menu li a.first {
	color: #fff;
}
.navigation_top .ul-show-menu li a:hover, .navigation_top .ul-show-menu li a:active {
    text-decoration: none;
	color: #ccc;
}
ul.ul-show-menu a.tel_link:link, ul.ul-show-menu a.tel_link:visited {
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 2em;
	line-height: 1.2;
	color: #222;
    text-transform: capitalize;
    text-decoration: none;
}
ul.ul-show-menu a.tel_link:hover, ul.ul-show-menu a.tel_link:active {
    text-decoration: none;
	color: #ddd;
}
.inline-logo {
	display: inline-block;
	margin: 0;
	padding: 0;
	width: 150px;
	height: auto;
	-webkit-transform: translateY(20%);
	-ms-transform: translateY(20%);
	transform: translateY(20%);
}
.inline-logo-sidebar {
	display: inline-block;
	margin: 0;
	padding: 0;
	width: 150px;
	height: auto;
	-webkit-transform: translateY(5%);
	-ms-transform: translateY(5%);
	transform: translateY(5%);
}

/* 2.4 - top navigation hamburger */
.burger-wrapper {
	display: inline-block;
	margin: 0 15px 0 0;
	padding: 3px 5px;
	border: 1px solid #222;
 	box-sizing: border-box;
	width: 27px;
	cursor: pointer;
	-webkit-transform: translateY(10%);
	-ms-transform: translateY(10%);
	transform: translateY(10%);
}
.burger {
    height: 2px;
    background-color: #222;
    margin: 3px 0;
}

/* 2.4.1 - header side-menu styles (c) 2015 George Lieu licensed under MIT */
html {
	overflow-x: hidden;
}
#page {
	position: relative;
	left: 0;
}
.overlay {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	min-height: 100%;
	width: 100%;
	z-index: 20;
	background: black;
	opacity: 0.5;
	filter: alpha(opacity=50);
}
.mmPushBody {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
}

/* pushbar menu styles */
#mobile-menu {
	position: absolute;
	top: 0;
	background: #333;
	z-index: 99999;
	-webkit-box-shadow: 0 1px 8px #555555;
	-moz-box-shadow: 0 1px 8px #555555;
	-o-box-shadow: 0 1px 8px #555555;
	box-shadow: 0 1px 8px #555555;
	display: none;
	font-family: 'Open Sans';
	font-size: 1em;
	line-height: 1.4;
	font-weight: 300;
	border-right: 1px solid #333;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-o-box-sizing: content-box;
	box-sizing: content-box;
}
.mobile-menu {
	list-style-type: none;
	margin: 0;
	width: 100%;
	float: left;
	margin-left: 0;
	padding-left: 0;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
.mobile-menu ul {
	margin-left: 0;
	padding-left: 0;
}
.mobile-menu ul .expand {
	background: #eeeeee;
}
.mobile-menu .home {
	background-color: #71b99e;
	color: #fff;
	height: 10vh;
	overflow: hidden;
}
.mobile-menu .home i {
	padding-right: 5px;
}
.mobile-menu .home a.active {
	color: #fff !important;
}
.mobile-menu .expand {
	right: 0;
	position: absolute;
	border-left: 1px solid #333;
	padding: 0 10px;
	color: #1f75f5;
	margin-left: 100px;
}
.mobile-menu .expand:hover {
	cursor: pointer;
}
.mobile-menu li {
	display: block;
	border-top: 1px solid #646464;
	width: 100%;
	float: left;
	margin-left: 0;
	padding-left: 0;
	position: relative;
}
.mobile-menu li a, .mobile-menu li span, .mobile-menu li .cat_without {
	display: block;
	overflow: hidden;
	white-space: normal;
	color: #fff;
	text-decoration: none;
	padding: 10px;
	padding-left: 15px;
}
.mobile-menu li a.active {
	color: #da3287;
}
.mobile-menu li li {
	background: #666;
}
.mobile-menu li li a {
	padding-left: 25px;
}
.mobile-menu input.simple:focus {
	border: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-o-box-shadow: none;
	box-shadow: none;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
}
.mobile-menu [class^="icon-"]:before {
	margin-right: 0;
	margin-left: 0;
}
.mobile-menu [class*=" icon-"]:before {
	margin-right: 0;
	margin-left: 0;
}

/* 2.4.2 - masthead tint styles */
.dark_tint_horiz {
  background-image: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.5) 35%, rgba(0, 0, 0, 0) 100%);
  background-image: -moz-linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.5) 35%, rgba(0, 0, 0, 0) 100%);
  background-image: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 35%, rgba(0, 0, 0, 0) 100%);
}
.header_box {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: perspective(1px) translate(-50%, -50%);
  -ms-transform: perspective(1px) translate(-50%, -50%);
  transform: perspective(1px) translate(-50%, -50%);
  width: 96.4843%;
  max-width: 1400px;
}

/* 2.5 - trustpilot styles */
.badge_wrapper {
	margin: 0;
	padding: 0;
	position: relative;
}
.trustp_stars {
	margin: 0 0 10px 0;
	padding: 0;
}
.trustp_stars_colour {
	margin: 0 6px 0 0;
	padding: 0;
	color: #4bb30c;
}
.carousel_title {
	margin: 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 1.8em;
	line-height: 1.2;
	color: #000;
    text-transform: capitalize;
}
.carousel_title_plus {
	margin: 0 0 5px 0;
}
.carousel_subheader {
	margin: 6px 0;
	padding: 0;
	font-size: 1.1em;
	line-height: 1.2;
	font-weight: 400;
	color: #222;
    text-transform: uppercase;	
}
.carousel_copy {
	margin: 0;
	padding: 0;
	font-size: 1em;
	line-height: 1.4;
}

/* 2.6 - legal styles */
ul.ul-terms, ul.ul-body {
	margin: 0 0 0 13px;
	padding: 10px 0 0 0;
	list-style-type: square;
}
ul.ul-cart {
	margin: 0 0 0 13px;
	padding: 0;
	list-style-type: square;
}
ul.ul-terms li, ul.ul-cart li, ul.ul-body li {
	padding: 0 0 6px 3px;
}
ul.ul-terms span, .ul.ul-cart span {
	font-weight: 400;
	color: #F30;
}

/* bullet points for body copy */
ul.ul-body {
	margin: 0 0 0 13px;
	padding: 10px 0 0 0;
	list-style-type: square;
}
ul.ul-body li {
	padding: 0 0 6px 3px;
	font-size: 1.2em;
	line-height: 1.4;
}

/* 2.6.1 popup modal styles */
.pop-hide {
	display: none;
}
.pop-overlay {
	display: block;
	margin: 0;
	padding: 20px;
	border-radius: 5px;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	box-sizing: border-box;
	background-color: #333;
	color: #fff;
}
.modal-button {
	clear: both;
	display: block;
	float: left;
	height: 44px;
	margin: 0 0 10px 0;
	padding: 0;
	border-radius: 3px;
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px;
	border: none;
	background-color: #4bb30c;
	font-size: 1.2em;
	line-height: 1.4;
	text-align: center;
	color: #fff;
	box-sizing: border-box;
	cursor: pointer;
    -webkit-appearance: button;
 }
.my_popup_close:hover, .my_popup_close:focus {
	color: #fff;
	background-color: #333;
	box-sizing: border-box;
}
.h3_title_popup {
	margin: 10px;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 2em;
	line-height: 1.2;
	color: #fff;
    text-transform: capitalize;
	text-align: center;	
}
.message_popup {
	margin: 0;
	padding: 0;
	font-size: 1.2em;
	line-height: 1.4;
	color: #fff;
	text-align: center;
}

/* 2.6.2 - 2gdpr cookie consent */
.cc-window{opacity:1;-webkit-transition:opacity 1s ease;transition:opacity 1s ease}.cc-window.cc-invisible{opacity:0}.cc-animate.cc-revoke{-webkit-transition:transform 1s ease;-webkit-transition:-webkit-transform 1s ease;transition:-webkit-transform 1s ease;transition:transform 1s ease;transition:transform 1s ease,-webkit-transform 1s ease}.cc-animate.cc-revoke.cc-top{-webkit-transform:translateY(-2em);transform:translateY(-2em)}.cc-animate.cc-revoke.cc-bottom{-webkit-transform:translateY(2em);transform:translateY(2em)}.cc-animate.cc-revoke.cc-active.cc-top{-webkit-transform:translateY(0);transform:translateY(0)}.cc-animate.cc-revoke.cc-active.cc-bottom{-webkit-transform:translateY(0);transform:translateY(0)}.cc-revoke:hover{-webkit-transform:translateY(0);transform:translateY(0)}.cc-grower{max-height:0;overflow:hidden;-webkit-transition:max-height 1s;transition:max-height 1s}
.cc-revoke,.cc-window {position:fixed;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;
	font-size: 1.2em; line-height: 1.4em; background-color: rgba(0,0,0,0.8); color: #fff;
	display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}
.cc-window.cc-static{position:static}.cc-window.cc-floating{padding:2em;max-width:24em;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}.cc-revoke:hover{text-decoration:underline}.cc-header{font-size:18px;font-weight:300}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}
a.cc-link{
	display: inline-block; text-decoration: underline; color:#ccc; font-weight: 300;
}
a.cc-link:hover{opacity:1; text-decoration:none; color:#fff;}
a.cc-link:active,a.cc-link:visited{text-decoration:none; color:#fff;}
.cc-btn{
	display: block; padding: .8em .8em;
	font-size: 1em; font-weight: 300; color: #fff;
	text-align: center;white-space: nowrap;
	background-color: #4bb30c;
}
a.cc-allow:hover, a.cc-deny:hover {opacity:1; text-decoration:none; color:#fff;}
a.cc-allow:active,a.cc-allow:visited, a.cc-deny:active,a.cc-deny:visited {text-decoration:none; color:#fff;}

.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}
.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}.cc-revoke.cc-left{left:3em;right:unset}.cc-revoke.cc-right{right:3em;left:unset}.cc-top{top:1em}.cc-left{left:1em}.cc-right{right:1em}.cc-bottom{bottom:1em}.cc-floating>.cc-link{margin-bottom:1em}
.cc-floating .cc-message{
	display: block; margin-bottom: 1em; color: #fff;
}
.cc-window.cc-floating .cc-compliance{-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto}.cc-window.cc-banner{-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.cc-banner.cc-top{left:0;right:0;top:0}
.cc-banner.cc-bottom{left:0;right:0;bottom:0}.cc-banner .cc-message{display:block;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;margin-right:1em}.cc-compliance{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}.cc-floating .cc-compliance>.cc-btn{-webkit-box-flex:1;-ms-flex:1;flex:1}.cc-btn+.cc-btn{margin-left:.5em}
.cc-revoke{display:none;}

@media print{.cc-revoke,.cc-window{display:none}}@media screen and (max-width:900px){.cc-btn{white-space:normal;}}@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}.cc-window.cc-bottom{bottom:0}.cc-window.cc-banner,.cc-window.cc-floating,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}.cc-window.cc-banner{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner .cc-compliance{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}.cc-window.cc-floating{max-width:none}.cc-window .cc-message{margin-bottom:1em}.cc-window.cc-banner{-webkit-box-align:unset;-ms-flex-align:unset;align-items:unset}.cc-window.cc-banner .cc-message{margin-right:0}}
.cc-floating.cc-theme-classic{
	padding: 1.2em; background: #000; background: rgba(0,0,0,0.8);
}
.cc-floating.cc-type-info.cc-theme-classic .cc-compliance{text-align:center;display:inline;-webkit-box-flex:0;-ms-flex:none;flex:none}
.cc-theme-classic .cc-btn{
	border-radius:5px;
}
.cc-theme-classic .cc-btn:last-child{min-width:140px}.cc-floating.cc-type-info.cc-theme-classic .cc-btn{display:inline-block}
.cc-theme-edgeless.cc-window{padding:0}.cc-floating.cc-theme-edgeless .cc-message{margin:2em;margin-bottom:1.5em}.cc-banner.cc-theme-edgeless .cc-btn{margin:0;padding:.8em 1.8em;height:100%}.cc-banner.cc-theme-edgeless .cc-message{margin-left:1em}.cc-floating.cc-theme-edgeless .cc-btn+.cc-btn{margin-left:0}

/* 2.6.3 - pull-quote box style */
.pullquote {
	margin: 0 auto;
	padding: 30px;
	background-color: #F7F7F7;
}
.pullquote_title {
	margin: 0 0 8px 0;
	padding: 0;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 2.5em;
	line-height: 1.2;
	color: #222;
    text-transform: capitalize;
	text-align: center;	
}
.pullquote_copy {
	margin: 0;
	padding: 0;
	font-weight: 400;
	font-size: 1.1em;
	line-height: 1.4;
	color: #222;
	text-align: center;	
}

/* 8 - footer styles */
.footer {
	margin: 0;
	padding: 8px 0 0 0;
}
.h3-footer {
	margin: 0 0 8px 0;
	padding: 0;
	color: #fff;
	font-family: 'Fira Sans', Tahoma, Geneva, sans-serif; /* 400,700 */
	font-weight: 700;
	font-size: 1.8em;
	line-height: 1.1;
	text-align: center;
}
.footer .h6-footer {
	margin: 0 0 6px 0;
	padding: 0;
	color: #fff;
	font-size: 1.1em;
	line-height: 1.4;
	font-weight: 300;
	text-align: center;
}
.footer .h6-footer span {
	color: #ccc;
}
.footer .mouse-grey {
	margin: 0 0 8px 0;
	font-size: 1em;
	line-height: 1.4;
	color: #ccc;
}
.footer a:link, .footer a:visited {
    text-decoration: underline;
	color: #fff;
}
.footer a:hover, .footer a:active {
    text-decoration: none;
	color: #ccc;
}


/* 9.1 - mediaQueries 1200px styles */
@media(max-width: 1200px) {
.span_4pop {
	width: 50%;	
}
.h1-title {
	margin: 0;
	padding: 0;
	font-size: 3em;
}
.h2-title {
	margin: 20px 0 0 0;
	padding: 0 0 10px 0;
	font-size: 2.6em;
}
.image_intro {
	margin: 10px 0 0 0;
	padding: 0;
	font-size: 1.1em;
}
.footer .h6-footer {
	margin: 0 0 8px 0;
	padding: 0;
	font-size: 1em;
	text-align: center;
}
.carousel_title {
	margin: 0;
	padding: 0;
	font-size: 1.6em;
}

} /* end 1200px */

/* 9.1 - mediaQueries 1024px styles */
@media(max-width: 1024px) {
.span_4pop {
	width: 60%;	
}
.h2-title {
	margin: 20px 0 0 0;
	padding: 0 0 10px 0;
	font-size: 2.2em;
}
.image_intro {
	margin: 10px 0 0 0;
	padding: 0;
	font-size: 1em;
}
.h3-footer {
	margin: 0 0 8px 0;
	padding: 0;
	font-size: 1.5em;
}
.ul-show-menu li a {
	margin: 0 12px 0 0;
	font-size: 1.1em;
}
ul.ul-body li {
	padding: 0 0 6px 3px;
	font-size: 1em;
}
} /* end 1024px */

/* 9.2 - mediaQueries 996px styles */
@media(max-width: 996px) {
section.header_adblue, section.header_classics, section.header_fillernecks, section.header_motorhomes, section.header_plant {
  background-position: center center;
  height: 40vh;
}
.header_box {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: perspective(1px) translate(-50%, -50%);
  -ms-transform: perspective(1px) translate(-50%, -50%);
  transform: perspective(1px) translate(-50%, -50%);
  width: 88%;
  max-width: 992px;
}	
	
.ul-show-menu li.top-menu {
	display: none;
}
.ul-show-menu li.side-menu {
	display: inline;
}
.ul-show-menu li a.first {
	color: #fff;
	margin: 0;
}
.ul-show-menu li a.first:hover, .ul-show-menu li a.first:active {
    text-decoration: none;
	color: #fff;
}
.cc-cookies a.cc-cookie-accept, .cc-cookies a.cc-cookie-decline, .cc-cookies a.cc-cookie-reset {
	display: block; margin: 1em 0;
}
.navigation_top .container-nav .ul-show-menu {
	text-align: center;
}
.h6-title-caption {
	font-size: 1em;
	line-height: 1.4;
}
.h3-four-block {
	margin: 0 0 4px 0;
	padding: 0;
	font-size: 1.7em;
	line-height: 1.2;
}

} /* end 996px */

/* 9.3 - mediaQueries 420px styles */
@media(max-width: 420px) {
section.header {
	margin: 0;
}
.container {
	float: left;
	width: 92%;
	margin: 0 0 0 4%;
	padding: 10px 0;
}
.navigation .container-nav {
	padding: 5px 0 0 0;
}
.column {
	margin: 0 0 0 0;
}
.column:first-child { margin-left: 0; }
.span_1 {
	width: 100%;	
}
.span_2 {
	width: 100%;	
}
.span_3  {
	width: 100%;	
}
.span_4, .span_4pop {
	width: 100%;	
}
.span_5 {
	width: 100%;	
}
.span_6 {
	width: 100%;	
}
.span_7 {
	width: 100%;	
}
.span_8, .span_8pull, .span_12montage {
	width: 100%;	
}
.span_9 {
	width: 100%;	
}
.span_10 {
	width: 100%;
}
.span_11 {
	width: 100%;	
}

.span_12img {
	width: 80%;
	margin: 0 auto;
}
.span_12 {
	width: 100%;	
}

.h1-title {
	margin: 0;
	padding: 0;
	font-size: 2.6em;
}
.h2-title {
	margin: 20px 0 0 0;
	padding: 0 0 10px 0;
	font-size: 1.8em;
	text-align: center;
}
.h3-title {
	text-align: center;
}
.h3-title-centred {
	margin: 0;
	padding: 0;
	font-size: 1.8em;
}
.h3-strapline {
	margin: 0;
	padding: 0;
	font-size: 1.1em;
}
.h6-title {
	margin: 10px 0;
	padding: 0;
	font-size: 1.4em;
}
	
.trustp_stars {
	text-align: center;
}
.carousel_title {
	text-align: center;
}
.carousel_subheader {
	text-align: center;
}
.carousel_copy {
	text-align: center;
}


.footer .mouse-grey {
	margin: 0 0 8px 0;
	font-size: 1em;
	text-align: justify;
}	
/* reverse order of columns - pic then text */
.flex_display {
   display: flex;
   flex-direction: column-reverse;
}
} /* end 420px */