@font-face {
    font-family: 'open_sansbold';
    src: url('../fonts/opensans-bold-webfont.eot');
    src: url('../fonts/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/opensans-bold-webfont.woff2') format('woff2'),
         url('../fonts/opensans-bold-webfont.woff') format('woff'),
         url('../fonts/opensans-bold-webfont.ttf') format('truetype'),
         url('../fonts/opensans-bold-webfont.svg#open_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sanslight';
    src: url('../fonts/opensans-light-webfont.eot');
    src: url('../fonts/opensans-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/opensans-light-webfont.woff2') format('woff2'),
         url('../fonts/opensans-light-webfont.woff') format('woff'),
         url('../fonts/opensans-light-webfont.ttf') format('truetype'),
         url('../fonts/opensans-light-webfont.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sansregular';
    src: url('../fonts/opensans-regular-webfont.eot');
    src: url('../fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/opensans-regular-webfont.woff2') format('woff2'),
         url('../fonts/opensans-regular-webfont.woff') format('woff'),
         url('../fonts/opensans-regular-webfont.ttf') format('truetype'),
         url('../fonts/opensans-regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* The following fixes font rendering in Chrome, which is a bit rubbish - it's a webkit browser, so the media queries target Chrome */

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
		font-family: 'open_sansbold';
	    src: url('../fonts/opensans-bold-webfont.svg') format('svg');
	}
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
		font-family: 'open_sanslight';
	    src: url('../fonts/opensans-light-webfont.svg') format('svg');
	}
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
		font-family: 'open_sansregular';
	    src: url('../fonts/opensans-regular-webfont.svg') format('svg');
	}
}


@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon.eot?ovuclt');
	src:url('../fonts/icomoon.eot?#iefixovuclt') format('embedded-opentype'),
		url('../fonts/icomoon.woff?ovuclt') format('woff'),
		url('../fonts/icomoon.ttf?ovuclt') format('truetype'),
		url('../fonts/icomoon.svg?ovuclt#icomoon') format('svg');
	font-weight: normal !important;
	font-style: normal !important;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	vertical-align: middle;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

html {
	box-sizing: border-box;
	font-size: 10px;	
	overflow-x: hidden;
	width: 100%;
}
body {
	padding: 0;
	margin: 0;
	background-color: #ffffff;
	font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
	font-weight: 400;
	letter-spacing: 0.03em;
	color: #535353;
}

*, *:before, *:after {
  box-sizing: inherit;
}


/* Text */
h1, h2, h3, h4, h5 {
	clear: left;
	font-family: 'open_sansbold', Arial, Helvetica, sans-serif;
	font-weight: normal;
}
h1 {
	font-size: 2.5em;
	font-weight: normal;
	line-height: 1;
	margin: 0 0 0.75em 0;
}
h1:last-child {
	margin: 0;
}
h1 b {
	font-family: 'open_sansbold', Arial, Helvetica, sans-serif;
}
h2 {
	line-height: 1;
	font-size: 2em;
	margin: 1.25em 0 0.75em;
}
h3 {
	font-size: 1.6em;
	line-height: 1.4;
	margin: 1em 0 0.5em;
}
h4 {
	font-size: 1.4em;
	font-weight: normal;
}
h5 {
	font-size: 1.3em;
	margin: 0.5em 0;
}
.small {
	font-size: 75%;
	font-weight: normal;
}
.main ul, .main ol {
	font-size: 1.3em;
	line-height: 1.5;
	padding-left: 1.3em;
}
.main dl {
	font-size: 1.3em;
	line-height: 1.5;
}
.main dd,
.main dt {
	display: inline-block;
	margin-left: 0;
  vertical-align: top;
}
.main dt {
	font-weight: bold;
	width: 30%;
}
.main dd {
	width: 70%;
}
.main li {
	margin-left: 1em;
}
.header p {
	font-size: 1.2em;
	margin-bottom: 0;
}
.slides p {
	font-size: 1.3em;
	line-height: 1.5;
}
.main p {
	font-size: 1.3em;
	line-height: 1.5;
	margin-top: 0;
}
p.intro {
	font-size: 1.7em;
}
p.intro:last-child {
	margin: 0;
}
.footer p {
	font-size: 1.1em;
}
.footer ul {
	font-size: 1.1em;
}

hr {
	background-color: #ddd;
	border: 0;
	color: #ddd;
	height: 1px;
	margin: 1.5em 0;
}

/* General table styling */
table {
	border-collapse: collapse;
	border-bottom: 1px solid #dddddd;
}
th {
	font-family: 'open_sansbold', Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	font-weight: normal;
}
td,
th {
	border-top: 1px solid #dddddd;
	font-size: 1.3em;
	padding: 1em 1em 1em 0;
	text-align: left;
}
td:last-child,
th:last-child {
	padding-right: 0;
}

/* Text styling */
.error,
.alert {
	color: #e41713;
}

/* Links */
a {
	color: #535353;
	font-weight: normal;
	text-decoration: none;
	font-size: inherit;
	text-decoration: underline;
	/* Add a fade in, where supported */
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: 	all 0.3s ease-in-out;
	-ms-transition: 	all 0.3s ease-in-out;
	-o-transition: 		all 0.3s ease-in-out;
	transition: 		all 0.3s ease-in-out;
}
h1 a, h2 a, h3 a, h4 a, h5 a {
	font-family: inherit;
	font-weight: inherit;
	text-decoration: none;
}
h3 a {
	color: #535353;
}
a:hover {
	color: #e41713;
}
a:hover p {
	color: #535353;
}
a.more {
	float: right;
	font-family: 'open_sansbold', Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	text-decoration: none;
	text-transform: uppercase;
}
.home a.more {
  bottom: 0.8em;
  float: none;
  position: absolute;
  right: 1em;
}
a.more .icon-arrow-right2 {
	vertical-align: text-bottom;
}
.main p a {
	text-decoration: underline;
}
.link-icon {
	display: inline-block;
	font-size: 1.5em;
	margin: 0 0 1em 0;
}

* :focus {
	outline: 0;
}

/* Images */
img {
	border: 0;
	-ms-interpolation-mode: bicubic;
}

.image-left {
	float: left;
	padding: 0 1.2em 1.2em 0;
}

.image-right {
	float: right;
	padding: 0 0 1.2em 1.2em;
}

/* Helpers */
.block {
	display: block;
}
.right {
	float: right;
}

/* Header */
.header {
	width: 100%;
	overflow: hidden; /* clears floated content */
}
.header .container {
	overflow: hidden; /* clears floated content */
	width: 96em;
}
.header .logo {
	float: left;
	height: 6.3em;
	margin-top: 3em;
	overflow: hidden;
	position: relative;
	width: 50%;
}
.header .logo a {
	display: block;
}
.header .logo span {
	display: block;
	font-family: 'open_sanslight', Arial, Helvetica, sans-serif;
	font-size: 1.3em;
	margin-top: 0.5em;
	color: #1f1f1f;
}
.header .search-nav {
	float: right;
	padding: 1.5em 0;
	width: 50%;
}
.header .search-nav a {
	text-decoration: none;
}
.header .header__search {
	overflow: hidden;
	border: 0;
	margin-bottom: 0.75em;
	position: relative;
	text-align: right;
}
.header .header__search input[type="text"],
.header .header__search input[type="search"] {
	border-color: #1f1f1f;
	border-style: solid;
	border-width: 1px;
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	margin-bottom: 0;
	padding: 0.3em 3em 0.3em 0.75em;
}
.header .header__search button[type="submit"] {
	border: 0;
	background-color: #1f1f1f;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 1em;
	height: 2.7em;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 2.7em;
}
.header .header__search button[type="submit"] .icon-search {
	font-size: 1.3em;
}
.header .header__basket {
	color: #1f1f1f;
	font-size: 1.3em;
	margin-bottom: 0;
	text-align: right;
	width: 100%;
}
.header .header__basket .icon-cart {
	margin-right: 0.5em;
}
.main {
	overflow: hidden; /* Clears floated content */
	padding-top: 2em;
}
.container {
	clear: both;
	margin: 0 auto;
	width: 100.4em;
}
.footer {
	background-color: #dddddd;
	margin-top: 2em;
	overflow: hidden;
	padding-bottom: 1.5em;
	padding-top: 1.5em;
	width: 100%;
}
.footer .container {
	width: 96em;
}
p.footer-legal {
  color: #999;
}
.footer-nav {	
	border-bottom: 1px dotted #1f1f1f;
}
.footer-nav__item {
	display: inline-block;
	vertical-align: top;
	width: 25%;
}
.footer-nav__item--popular {
	width: 50%;
}
.footer-nav ul {
	list-style-type: none;
	padding: 0;
}
.footer-nav__item--popular ul {
	display: inline-block;
	vertical-align: top;
	width: 50%;
}
.footer-nav li {
	font-size: 1.1em;
}
.footer-nav a {
	text-decoration: none;
}
.social-icons li {
	display: inline-block;
}
.social-icons a {
	border-radius: 4px;
	display: block;
	height: 0;
	margin-right: 1em;
	overflow: hidden;
	padding-top: 30px;
	width: 30px;
}
.social-icons__twitter a {
	background-image: url('../img/logo-twitter.png');
}
.social-icons__facebook a {
	background-image: url('../img/logo-facebook.png');
}

/* Navigation */
.global-nav {
	background-color: #1f1f1f;
	position: relative;
	width: 100%;
}
.global-nav__container {
	margin: 0 auto;
	width: 99em;
}
.global-nav:after {
	display: table;
	content: "";
	clear: both;
}
.global-nav ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.global-nav li {
	display: inline-block;
	padding: 0;
	position: relative;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	/* Add a fade in to the bottom border, where supported */
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: 	all 0.3s ease-in-out;
	-ms-transition: 	all 0.3s ease-in-out;
	-o-transition: 		all 0.3s ease-in-out;
	transition: 		all 0.3s ease-in-out;
}
.global-nav a {
	background-color: #1f1f1f;
	border-left: 1px solid #1f1f1f;
	display: block;
	font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
	font-weight: normal;
	margin-top: 0.4em;
	padding: 0.6em 1em 0.8em;
	color: #fff;
	text-decoration: none;
	font-size: 1.2em;
	/* Add a colour transition to the text, where supported */
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: 	all 0.2s ease-in-out;
	-ms-transition: 	all 0.2s ease-in-out;
	-o-transition: 		all 0.2s ease-in-out;
	transition: 		all 0.2s ease-in-out;
}
.global-nav a.active {
	color: #fff;
	position: relative;
}
.global-nav a.active:after {
	bottom: 0;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffffff;
	border-width: 6px;
	margin-left: -6px;
}
.global-nav li:hover > a {
	background-color: #fff;
	color: #e41713;
}
.global-nav .sub-nav {
	background-color: #fff;
	border-color: #1f1f1f;
	border-style: solid;
	border-width: 0 1px 1px 1px;
    min-width: 20em;
    opacity: 0;
    padding: 1em 0;
    position: absolute;
    text-align: center;
	visibility: hidden;
	z-index: 100;
	/* Add a fade in, where supported */
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: 	opacity 0.2s ease-in-out;
	-ms-transition: 	opacity 0.2s ease-in-out;
	-o-transition: 		opacity 0.2s ease-in-out;
	transition: 		opacity 0.2s ease-in-out;
}
.global-nav .sub-nav li {
	border: 0;
	display: block;
	font-size: 1.1em;
	font-weight: 400;
	text-align: left;
	text-transform: none;
	white-space: nowrap;
}
.global-nav .sub-nav img {
	display: block;
	height: auto;
	margin-bottom: 0.25em;
	width: 100%;
}
.global-nav .sub-nav a {
	background-color: #fff;
	border: 0;
	color: #535353;
	font-weight: 400;
	margin-top: 0;
	padding: 0.5em 1em;
}
.global-nav .sub-nav a:hover,
.global-nav .sub-nav a:active {
	color: #e41713;
}
.global-nav li:hover .sub-nav {
	visibility: visible;
	opacity: 1;
}

.secondary-nav {
	padding-bottom: 1.3em;
	text-align: right;
}
.secondary-nav ul {
	display: inline-block;
	font-size: 1.2em;
	margin: 0;	
	padding: 0;
}
.secondary-nav li {
	display: inline;
}
.secondary-nav li:after {
	color: #1f1f1f;
	content: '\0020''•''\0020';
}
.secondary-nav li:last-child:after {
	content: '';
}
.secondary-nav li a {
	color: #1f1f1f;
}
.secondary-nav li a:hover {
	color: #e41713;
}

.breadcrumb {
	font-size: 1em;
	list-style-type: none;
	margin: 1em 0 2em;
	padding: 0 2.2em;
}
.breadcrumb li {
	font-size: 1.2em;
	display: inline;
	padding-right: 0.5em;
}
.breadcrumb li:after {
	content: '//';
	padding-left: 1em;
}
.breadcrumb li:last-child:after {
	display: none;
	content: '';
}
.breadcrumb a {
	font-weight: 400;
  text-decoration: none;
}

/* Grids and layouts */
.grid {
	border-collapse: separate;
	border-spacing: 2.2em;
	display: table;
	width: auto;
}
.grid__group {
	display: table-row-group;
}
.grid-full {
	display: table-row-group;
}
/* Grid item */
.grid__item {
	display: table-cell;
	overflow: hidden;
	position: relative;
	height: 100%;
	border: 1px solid #ddd;
	vertical-align: top;
	padding: 1em;
}
.grid__item h3 {
	margin-top: 0;
}
.grid__item .more {
	max-width: 20.5em;
	position: absolute;
	bottom: 1em;
	right: 1em;
}
.grid__item .information p:first-child {
	margin-top: 0;
}
.grid__item .information p:last-child {
	margin-bottom: 0;
}
.full-width {
	overflow: hidden;
	padding: 0 2.2em;
}
.auto-width {
	width: auto;
}
.columns {
	overflow: hidden;	
}
.two-thirds-width {
	width: 66.6666%;
	float: left;
}
.one-third-width {
	width: 33.3333%;
	float: left;
}

/* Home */
.grid__item.home {
	padding: 0em;
	width: 33.333%;
}
.grid_item_home_text {
  padding: 1em 1em 3em 1em;
}
.grid_item_home_text div.information p a {
  text-decoration: none;
}

/* Category */
.grid__item.category {
	padding-bottom: 0em;
	width: 50%;
}
.grid__item.category a {
	text-decoration: none;
}
.category img,
.category__info {
	display: inline-block;
	vertical-align: text-top;
}
.category img {
	max-width: 40%;
	padding-right: 1.2em;
}
.category__info {
	width: 60%;
}
.category .more {
	font-family: 'open_sansbold', Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	line-height: 1em;
}
.category .more .icon-arrow-right2 {
	font-size: 1.3em;
	margin-left: 0.4em;
	vertical-align: text-top;
}

/* Products landing */
.grid__item.product {
	padding-bottom: 3em;
	width: 22.4em;
}
.product a {
	display: block;
	text-decoration: none;
}
.product img {
	display: block;
	margin: 1.5em auto;
}
.grid__item h4 {
	color: #727272;
	margin-top: 0;
}
.price {
	bottom: 0.8em;
	font-size: 1.4em;
	position: absolute;
	right: 1em;
}
.price em {
	font-size: 1.2em;
	font-weight: bold;
	color: #e41713;
	font-style: normal;
}
.price .icon {
	margin-right: 0.4em;
}
.saving {
	font-size: 1.2em;
	margin-bottom: 1em;
}
.saving em {
	font-size: 1.2em;
	color: #b61515;
	font-style: normal;
}
.has-ribbon h3 {
	width: 70%;
}
.ribbon-wrapper {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: -3px;
  right: -3px;
}

.ribbon {
  -o-transform:      rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  background-color: #e41713;
  left: -5px;
  position: relative;
  padding: 7px 0;
  text-align: center;
  top: 15px;
  width: 120px;
  color: #fff;
  font-size: 15px;
}

.ribbon:before, .ribbon:after {
	color: #e41713;
	content: "";
	border-top:   3px solid #e41713;   
	border-left:  3px solid transparent;
	border-right: 3px solid transparent;
	position:absolute;
	bottom: -3px;
}

.ribbon:before {
  left: 0;
}
.ribbon:after {
  right: 0;
}


/* Product detail */
.product-header {
	margin-bottom: 2.2em;
	width: 100%;
}
.product-header h1 {
	width: 78%;
}
.product-detail h3 {
	margin-bottom: 1em;
}
.product-header .gallery-buttons {
	width: 20%;
	float: right;
	text-align: right;
}
.product-details {
	background-color: #fff;
	margin-top: 2.2em;
	overflow: hidden;
	position: relative;
}
.product-details p:first-child {
	margin-top: 0;
}
.product-text {
	font-size: 1.4em;
}
.product-text ul {
	font-size: inherit;
}
.product-text .button {
	font-size: 1.2em;
}
.product-images {
	float: left;
	margin-bottom: 2.2em;
	overflow: hidden;
	width: 47em;
}
.main-image img {
	display: block;
	margin-bottom: 2em;
}
.product-images .thumbnails {
	background-color: #ddd;
	float: left;
	margin-right: 2.1em;
	overflow: hidden;
	position: absolute;
	width: 94px;
  left:0;
  top:0;
}
.product-images .thumbnails ul {
	background-color: #fff;
	margin-bottom: 0;
	margin-top: 0;
	padding-left: 0;
}
.product-images .thumbnails li {
	margin-left: 0;
}
.product-images a {
	display: block;
}
.product-images .main-image {
	margin-left: 11.5em;
}
.slider {
	height: 24em;
	margin: 0;
	overflow: hidden;
}

.thumbnails .lSSlideOuter {
    padding: 32px 0;
}
.thumbnails .lSAction > a {
	position: absolute;
	text-decoration: none;
}
.thumbnails .lSAction > a:after {
	display: inline-block;
	font-family: icomoon;
	font-size: 2em;
	margin-left: -0.5em;
	left: 50%;
	position: absolute;
}
.thumbnails .lSAction > .lSPrev,
.thumbnails .lSAction > .lSNext {
    background-color: #ddd;
}
.thumbnails .lSAction > .lSPrev:hover,
.thumbnails .lSAction > .lSNext:hover {
    background-color: #535353;
    color: #ddd;
}
.thumbnails .lSAction > .lSNext:after {
	content: "\e932";
	top: 0.25em;
}
.thumbnails .lSAction > .lSPrev:after {
	content: "\e930";
	top: 0.25em;
}
.thumb-image {
	background-color: #ddd;
	display: block;
	height: 94px;
	margin-bottom: 10px;
	padding-left: 1px;
	padding-top: 1px;
	width: 94px;
}
.thumb-image a {
	background-color: #fff;
	border: 6px solid #fff;
	display: block;
	height: 92px;
	overflow: hidden;
	position: relative;
	width: 92px;
}
.thumb-image:last-child {
	margin-bottom: 0;
	margin-right: 0;
}
.thumb-image img {
	display: block;
}
.thumb-image__youtube {
	left: 50%;
	margin-left: -62px;
	margin-top: -49px;
	position: absolute;
	top: 50%;
}
.thumb-image .icon-video-camera {
	display: block;
	font-size: 3em;
	left: 50%;
	margin-left: -0.5em;
	margin-top: -0.5em;
	position: absolute;
	top: 50%;
  text-shadow:
    -1px -1px 0 #fff,
    1px -1px 0 #fff,
    -1px 1px 0 #fff,
    1px 1px 0 #fff; 
}
.thumb-image.youtube .icon-video-camera {
    color: rgba(5,5,5,0.9);
}
.price-range {
	font-weight: bold;
	font-size: 2.4em;
}
.buying-info {
	border: 1px solid #ddd;
	display: inline-block;
	float: left;
	margin-left: 2.1em;
	margin-bottom: 2.2em;
	padding: 2em;
	width: 46.9em;
}
.buying-info table {
	width: 100%;
}
.buying-info .how-to {
	margin-bottom: 0;
	margin-top: 2em;
}
.product-info {
	clear: left; /* to clear content floated before it */
}

/* Gallery */
.open-gallery {
	cursor: pointer;
}
.open-video-overlay {
	cursor: pointer;
}
.gallery-buttons a {
	margin: 0 0.25em;
}
.gallery-image-list {
	display: none;
}

/* Video */
.flash-video,
.youtube-video,
.wmp-video {
	display: none;
}

.player-container {
	background-color: #000;
}

.youtube-video {
	height: 420px;
	width: 760px;
}

.in-page-video {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.in-page-video iframe {
  position: absolute;
}
.in-page-video .overlay-link {
  display: block;
  height: 0;
  padding-top: 33.3333%;
  position: relative;
  width: 100%;
}

/* Info box */
.info {
	display: table-cell;
	position: relative;
	height: 100%;
	width: 31em;
	border: 1px solid #ddd;
	vertical-align: top;
	padding: 1.5em 1.5em 3em;
}
.info h3 {
	margin-top: 0;
}

/* Content next to an aside */
.article {
	width: 63em;
}

/* Spare lamps box */
.aside {
	float: right;
	margin-bottom: 2em;
	margin-left: 2.5em;
	position: relative;
	width: 30.5em;
}
.aside h3 {
	margin-top: 0;
}
.aside p:last-child {
	margin-bottom: 0;
}
.aside > div:last-child {
  margin-bottom: 0;
}

/* Box */
.box {
	border: 1px solid #ddd;
	margin-bottom: 2em;
	padding: 1.5em;
}
.box--bold {
	border-color: #555;
}
.aside .box {
  overflow: hidden;
}
.aside .important-box {
  border: 1px solid #ff6a00;
}

/* Price table */
.price-info {
	margin: 1.5em 0;
	border-collapse: collapse;
	width: 17em;
}
.price-info td {
	padding: 0.25em;
	width: 50%;
	vertical-align: middle;
}
.rrp-label,
.price-label,
.saving-label {
	text-align: right;
}
.rrp-label,
.rrp-amount {
	text-decoration: line-through;
}
.price-label {
	font-size: 1.7em;
	line-height: 1.9em;
}
.price-label .icon {
	margin-right: 0.2em;
}
.price-amount {
	font-size: 1.7em;
	font-weight: 700;
}
.saving-label {
	font-size: 1.2em;
}
.saving-amount {
	font-size: 1.4em;
}

/* Shopping basket table */
.basket {
	margin-bottom: 2em;
	width: 100%;
}
.basket th,
.basket td {
	padding: 0.5em;
	text-align: center;
}
.basket th:first-child,
.basket td:first-child {
	text-align: left;
}
.basket td {
	white-space: no-wrap;
}
.basket th {
	background-color: #ddd;
}
.basket-even {
	background-color: #eee;
}
.basket .amount {
	text-align: right;
}
.basket .description {
	text-align: left;
}
.basket tfoot {
	border-top: 1px solid #ddd;
}
.basket tfoot td {
	border: 0;
}
.basket tfoot td:first-child {
	font-weight: bold;
	text-align: right;
}
.basket .total-amount {
	color: #e41713;
	text-align: right;
}
.basket tfoot tr:last-child {
	font-size: 1.308em;
	font-weight: bold;
}
.basket .add-remove {
	display: inline-block;
	text-align: left;
	width: 2.8em;
}
.basket a {
	display: inline-block;
	line-height: 1.2em;
	margin-left: 0.3em;
	vertical-align: text-top;
  text-decoration: none;
}
.basket-buttons {
	text-align: right;
}
.basket__empty {
	font-size: 1.6em;
	padding-right: 1em;
	text-decoration: underline;
}
.basket .icon-plus,
.basket .icon-minus,
.basket .icon-cross {
	font-size: 0.8em;
}
.checkout {
	width: 74em;
}

/* Checkout global region selection (mainland UK or international) */
.checkout-chooselocation {
  width: 35%;
  display: inline-block;
	vertical-align: text-top;
  text-align: center;
  border: none;
  padding: 3em;
}
.checkout-chooselocation a {
  font-size: 1.5em;
  text-decoration: none;
  font-weight: bold;
  vertical-align:bottom;
}

/* Accordions */
.accordion h3:after {
	content: "";
}
.accordion.open p {
	display: block;
}

/* Payment methods box */
.payment-methods {
	float: right;
	margin-top: 4.5em;
	margin-left: 3em;
}
.payment-methods a {
	display: block;
	text-align: center;
}

/* Forms */

input[type="text"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"] {
	border: 1px solid #ddd;
	display: inline-block;
	margin-bottom: 1em;
	padding: 0.5em 0.75em;
	width: 16em;
}
textarea {
	border: 1px solid #ddd;
	display: inline-block;
	padding: 0.5em 0.75em;
	width: 29.4em;
}
select {
	border: 1px solid #ddd;
	padding: 0.3em;
	width: 16em;
}
label {
	display: inline-block;
	font-size: 1.4em;
	margin-bottom: 1em;
	margin-right: 2em;
	width: 10em;
}
.main button {
	cursor: pointer;
	font-weight: normal;
	display: block;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: 	all 0.3s ease-in-out;
	-ms-transition: 	all 0.3s ease-in-out;
	-o-transition: 		all 0.3s ease-in-out;
	transition: 		all 0.3s ease-in-out;
}
.button {	
	display: inline-block;
	text-decoration: none;
	vertical-align: middle;
}
.button,
.main button {
	background-color: #555;
	border: 0;
	color: #fff;
	font-size: 1.6em;
	line-height: 1;
	margin: 0.5em 0;
	padding: 0.6em 0.75em;
}
.button:hover,
.button:active,
.button:focus,
.main button:hover,
.main button:active,
.main button:focus {
	background-color: #e41713;
	color: #fff;
}
.mandatory {
	color: #e41713;
}
.button.buy {
	margin-bottom: 0;
	white-space: nowrap;
}
.button.buy .icon-cart {
	margin-right: 0.25em;
}
.button.choice {
	background-color: #fff;
	border: 1px solid #1f1f1f;
	color: #1f1f1f;
	margin-right: 0.4em;
}
.button.choice:hover,
.button.choice:active {
	border-color: #e41713;
	color: #e41713;
}
table .button {
	font-size: inherit;
}
.form-container {
	overflow: hidden;
	width: 74em;
}
.form-container--small {
	width: 50%;
}
.form-container textarea,
.form-container input[type="text"],
.form-container input[type="date"],
.form-container input[type="datetime"],
.form-container input[type="email"],
.form-container input[type="number"],
.form-container input[type="email"],
.form-container input[type="url"],
.form-container input[type="search"],
.form-container select {
	margin-right: 1em;
	vertical-align: top;
}
.form-container textarea {
	height: 6em;
}
.form-container--small textarea {
	margin-right: 0;
	width: 23.2em;
}
.form-container .aside {
	margin-top: 3.5em;
	padding: 1.5em;
}
.form-field {
	vertical-align: top;
}
.form-aside {
	border: 1px solid #ddd;
	float: right;
	padding: 1.5em;
	position: relative;
	width: 30.5em;
}
.form-aside p:last-child {
	margin-bottom: 0;
}

/* Icons */

.alpha {
	font-size: 3em;
}
.beta {
	font-size: 1.4em;
}
.gamma {
	font-size: 1.2em;
}

.icon-home3:before {
    content: "\e900";
}
.icon-newspaper:before {
    content: "\e904";
}
.icon-pencil:before {
    content: "\e901";
}
.icon-pencil {
	vertical-align: text-bottom;
}
.icon-image:before {
    content: "\e902";
}
.icon-camera:before {
    content: "\e905";
}
.icon-video-camera:before {
    content: "\e903";
}
.icon-connection:before {
    content: "\e906";
}
.icon-file-text:before {
    content: "\e907";
}
.icon-price-tags:before {
    content: "\e925";
}
.icon-price-tags {
	vertical-align: text-top;
}
.icon-cart:before {
    content: "\e926";
}
.icon-coin-dollar:before {
    content: "\e908";
}
.icon-coin-euro:before {
    content: "\e909";
}
.icon-coin-pound:before {
    content: "\e90a";
}
.icon-coin-yen:before {
    content: "\e90b";
}
.icon-credit-card:before {
    content: "\e90c";
}
.icon-envelop:before {
    content: "\e90d";
}
.icon-pushpin:before {
    content: "\e90e";
}
.icon-clock:before {
    content: "\e90f";
}
.icon-mobile:before {
    content: "\e910";
}
.icon-bubble2:before {
    content: "\e911";
}
.icon-user:before {
    content: "\e912";
}
.icon-quotes-left:before {
    content: "\e913";
}
.icon-quotes-right:before {
    content: "\e914";
}
.icon-search:before {
    content: "\e927";
}
.icon-lock:before {
    content: "\e915";
}
.icon-wrench:before {
    content: "\e916";
}
.icon-equalizer2:before {
    content: "\e917";
}
.icon-magnet:before {
    content: "\e934";
}
.icon-airplane:before {
    content: "\e918";
}
.icon-truck:before {
    content: "\e919";
}
.icon-power-cord:before {
    content: "\e91a";
}
.icon-earth:before {
    content: "\e91b";
}
.icon-sun:before {
    content: "\e91c";
}
.icon-star-empty:before {
    content: "\e91d";
}
.icon-happy:before {
    content: "\e91e";
}
.icon-smile:before {
    content: "\e91f";
}
.icon-warning:before {
    content: "\e920";
}
.icon-notification:before {
    content: "\e928";
}
.icon-question:before {
    content: "\e929";
}
.icon-plus:before {
    content: "\e92a";
}
.icon-minus:before {
    content: "\e92b";
}
.icon-info:before {
    content: "\e92c";
}
.icon-blocked:before {
    content: "\e921";
}
.icon-cross:before {
    content: "\e92d";
}
.icon-checkmark:before {
    content: "\e92e";
}
.icon-checkmark2:before {
    content: "\e92f";
}
.icon-arrow-up2:before {
    content: "\e930";
}
.icon-arrow-right2:before {
    content: "\e931";
}
.icon-arrow-down2:before {
    content: "\e932";
}
.icon-arrow-left2:before {
    content: "\e933";
}
.icon-scissors:before {
    content: "\e922";
}
.icon-paypal:before {
    content: "\e923";
}
.icon-file-pdf:before {
    content: "\e924";
}

h3 .icon {
	vertical-align: text-bottom;
	margin-right: 0.25em;
}

/* Product listing */
.block img {
	opacity: 1;
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: 	opacity 0.2s ease-in-out;
	-ms-transition: 	opacity 0.2s ease-in-out;
	-o-transition: 		opacity 0.2s ease-in-out;
	transition: 		opacity 0.2s ease-in-out;
}
.block:hover img {
	opacity: 0.8;
}

/* Video */
.main iframe {
	margin: 1em 0;
}

/* Home page slider */
.main .home-slider {
	font-size: 1em;
	list-style-type: none;
	overflow: hidden;
	margin: 0;
	padding: 0;
}
.home-slider li {
	display: inline-block;
	height: 44.2em;
	margin: 0;
	position: relative;
	width: 100%;
}
.home-slider-wrapper {
	height: 44.2em;
	overflow-y: hidden;
}
.home-slider-wrapper .lSAction > a {
	background: #fff;
    cursor: pointer;
    display: block;
    height: 32px;
    margin-top: -16px;
    opacity: 0.5;
    position: absolute;
	text-decoration: none;
    top: 50%;
    transition: opacity 0.35s linear 0s;
    width: 32px;
    z-index: 99;
}
.home-slider-wrapper .lSAction > a:hover {
    opacity: 1;
}
.home-slider-wrapper .lSAction > a:after {
	display: block;
	font-family: icomoon;
	font-size: 2em;
    padding: 0.25em;
}
.home-slider-wrapper .lSAction > .lSPrev {
    left: 10px;
}
.home-slider-wrapper .lSAction > .lSNext {
    right: 10px;
}
.home-slider-wrapper .lSAction > .lSNext:after {
	content: "\e931";
}
.home-slider-wrapper .lSAction > .lSPrev:after {
	content: "\e933";
}
.home-slider-wrapper .lSSlideOuter {
	position: relative;
}
.home-slider-wrapper .lSPager {
	bottom: 0;
	position: absolute;
	width: 100%;
}
.home-slider-wrapper .lSSlideOuter .lSPager.lSpg {
	padding: 0.5em 0;
}
.home-slider-wrapper .lSSlideOuter .lSPager.lSpg > li a, 
.home-slider-wrapper .lSSlideOuter .lSPager.lSpg > li a {
	background-color: #fff;
}
.home-slider-wrapper .lSSlideOuter .lSPager.lSpg > li:hover a, 
.home-slider-wrapper .lSSlideOuter .lSPager.lSpg > li.active a {
    background-color: #e41713;
}
.home-slider .text {
	background-color: rgba(5,5,5,0.4);
	color: #fff;
	display: inline-block;
	margin: 2em 0 2em 2em;
	max-width: 50%;
	padding: 2em;
	position: relative;
}
.home-slider .text h2 {
	margin-top: 0;
}
.home-slider .button {
	background-color: rgba(5,5,5,0.4);
	border: 1px solid #fff;
	color: #fff;
	font-size: 1.2em;
	text-transform: uppercase;
}
.home-slider .button:hover {
	background-color: rgba(5,5,5,0.6);
}

/* Image */
.home-slider .background {
	left: 0;
	position: absolute;
	top: 0;
}

/* Logo animation */
#logo {
	background-image: url('../images/optifanatics.png');
	background-repeat: no-repeat;
    display: block;
    height: 32px;
    overflow: hidden;
    position: relative;
    width: 360px;
}

#logo .static {
    opacity: 1;
	-webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: 	opacity 0.3s ease-in-out;
	-ms-transition: 	opacity 0.3s ease-in-out;
	-o-transition: 		opacity 0.3s ease-in-out;
	transition: 		opacity 0.3s ease-in-out;

}

#logo:hover .static {
    opacity: 0;
}

#logo svg {
	background-color: #fff;
	height: auto;
	left: 0;
	overflow: hidden;
	position: relative;
	top: 0;
	width: 100%;
}

#wheel-top {
  mix-blend-mode: multiply;
}

.st0 {
	fill: #FFFFFF;
}

.st1 {
	fill: #3366FF;
}

.st2 {
	fill: #FF3333;
}

.st3 {
	fill: #FF3399;
}

.st4 {
	fill: #FFFF33;
}


/* Information tables */
/* General table styling */
 table.infotable {
	border: 1px solid #dddddd;
}
table.infotable th {
	font-weight: bold;
  background-color: #eeeeee;
}
table.infotable td,
table.infotable th {
	border: 1px solid #dddddd;
	padding: 1em;
}
table.infotable-compact td,
table.infotable-compact th {
	padding: 0.35em 1em 0.35em 1em;
}