/*================================
========== TYPOGRAPHY ============
================================*/
.flex {
	display:flex;
}
.flex-col {
	flex-direction: column;
}
.flex-wrap {
	flex-wrap: wrap;
}
.flex-item {
	flex: 1;
}

h1, h2, h3, h4, h5, h6{
	margin: 0 0 .8em;
	font-weight: 600;
	color: #4c4c4c;
}

h1{
	font-size: 24px;
	font-weight: 700;
	color: #3f3f3f;
}

#h1-small{
	font-size:38px;
	line-height:42px;
}

h2{
	font-size: 21px;
	color: #3f3f3f;
}

h3{
	font-size: 18px;
}

h4{
	font-size: 16px;
	font-weight: 700;
}

h5{
	font-size: 14px;
}

h6{
	font-size: 13px;
}

a {
	display: inline-block;
	text-decoration: none;
	color: #4b8acf;
	-webkit-transition: background .3s ease, border .3s ease, opacity .3s ease, color .3s ease;
	transition: background .3s ease, border .3s ease, opacity .3s ease, color .3s ease;
}

a:hover {
	color: #fca119;
}

/*================================
=========== TEMPLATE =============
================================*/

html { overflow-y: scroll; }

body {
	background: #404040;
	min-width: 320px;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	color: #878787;
}

.page-slide-container {
	overflow: hidden;
}

.page-slide {
	position: relative;
	-webkit-transition: -webkit-transform .5s ease;
	transition: transform .5s ease;
	/*-webkit-backface-visibility: hidden;*/
}

.page-slide.mm-open {
	-webkit-transform: translateX(389px);
	transform: translateX(389px);
}

main {
	display: block;
	background: #fff;
}

.container{
	width: 95%;
	max-width: 1200px;
	margin: 0 auto;
}

.cover {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.icon {
	height: 0;
	overflow: hidden;
}

.btn {
	display: inline-block;
	background-color: #fca119;
	padding: 5px 10px;
	border-radius: 2px;
	cursor: pointer;
	font-size: 12px;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: #fff;
	-webkit-transition: background .3s ease, border .3s ease, color .3s ease;
	transition: background .3s ease, border .3s ease, color .3s ease;
}

.btn:hover {
	background-color: #ffbf3f;
	color: #fff;
}

.btn-alt {
	background-color: #4b8acf ;
}

.btn-alt:hover {
	background-color: #639fd8;
}

.btn-overflow span {
	display: inline-block;
	background: url(/images/style/roof/arrow-down-white.png) right center no-repeat;
	background-size: 14px 8px;
	padding: 0 23px 0 0;
}

.btn-overflow.open span {
	background-image: url(/images/style/roof/arrow-up-white.png);
}

.js .overflow,
.no-js .btn-overflow {
	display: none;
}

a[href^="tel:"] {
	cursor: default;
}

a[href^="tel:"]:hover {
	color: #4b8acf;
}

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

.list-reset > li {
	margin: 0;
}

.grid-cont5 {
	margin-right: -5px;
}

.grid-cont10 {
	margin-right: -10px;
}

.grid-cont15 {
	margin-right: -15px;
}

.grid-cont20 {
	margin-right: -20px;
}

.dbl {
	display: table;
	width: 100%;
}

.dbl.container {
	width: 95%;
}

.dblr {
	display: table-row;
}

.dblc {
	display: table-cell;
}

.header-banner {
	background-color: #4b8acf;
	height: 234px;
	line-height: 234px;
	position: relative;
	text-align: center;
}

.header-banner::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0; left: 0; right: 0;
}

.header-banner::after {
	background: rgba(255, 255, 255, .45);
	height: 10px;
}

.page-title {
	display: inline-block;
	vertical-align: middle;
	margin: -10px 0 0;
	line-height: normal;
	text-transform: uppercase;
	text-shadow: 0 0 38px rgba(0, 0, 0, .35);
}

.page-title h1,
.page-title span:first-child {
	margin: 0;
	font-size: 64px;
	font-weight: 700;
	line-height: 66px;
	color: #fff;
}

.sub-title {
	display: block;
	font-size: 21px;
	line-height: 24px;
	font-weight: 700;
	color: #fff;
}

.logo-title {
	font-size: 18px;
	text-transform: uppercase;
	color: #4c4c4c;
}

.page-content {
	padding: 35px 0 70px;
}

.cms-page,
.shop-page {
	width: 100%;
	margin: 0 0 0 -350px;
	float: right;
}

.cms-page-inner,
.shop-page-inner {
	border-radius: 2px;
	margin: 0 0 0 350px;
}

.cms-content-block {
	padding: 20px 25px 25px;
	border: 2px solid #ebebeb;
	border-radius: 2px;
}

.cms-content-block > .logo-title {
	margin: 0 0 20px;
}

.cms-content {
	overflow: hidden;
}

.cms-content img {
	border: 2px solid #ebebeb;
	border-radius: 2px;
}

.cms-content li {
	margin: 0 0 10px;
}

.fluid-input-cont {
	overflow: hidden;
	line-height: normal;
}

::-webkit-input-placeholder { /* WebKit browsers */
	color: #878787;
	opacity: 1;
}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color: #878787;
	opacity: 1;
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #878787;
	opacity: 1;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #878787;
	opacity: 1;
}

.custom-row {
	margin-top: 10px;
}

.custom-row:first-child {
	margin-top: 0;
}

.text_input,
.select_input {
	width: 100%;
	padding: 6px;
	border: 1px solid #ebebeb;
	border-radius: 2px;
	color: #878787;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.validate_border {
	border:1px solid #fc1944;
}

@-webkit-keyframes shake {
	0%, 100% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	
	10%, 30%, 50%, 70%, 90% {
		-webkit-transform: translate3d(-3px, 0, 0);
		transform: translate3d(-3px, 0, 0);
	}
	
	20%, 40%, 60%, 80% {
		-webkit-transform: translate3d(3px, 0, 0);
		transform: translate3d(3px, 0, 0);
	}  
}

@keyframes shake {	
	0%, 100% {
		transform: translate3d(0, 0, 0);
	}
	
	10%, 30%, 50%, 70%, 90% {
		transform: translate3d(-3px, 0, 0);
	}
	
	20%, 40%, 60%, 80% {
		transform: translate3d(3px, 0, 0);
	}
}

@-webkit-keyframes stretchY {
	
	0%, 40%, 100% {
		-webkit-transform: scaleY(.3);
		transform: scaleY(.3);
	}  
	20% {
		-webkit-transform: scaleY(1.0);
		transform: scaleY(1.0);
	}
	
}

@keyframes stretchY {
	
	0%, 40%, 100% { 
		transform: scaleY(.3);
	} 
	
	20% { 
		transform: scaleY(1.0);
	}
	
}

/*================================
============ HEADER ==============
================================*/	

header {
	background: #fff;
	position: relative;
	z-index: 20;
}

.header-top {
	background: #4c4c4c;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
}

.ht-acc,
.ht-tel {
	border-left: 2px solid #444444;
	border-right: 2px solid #444444;
	padding: 5px 15px;
	float: right;
	text-align: center;
	color: #ffbf3f;
}

.ht-tel {
	float:left;
}

.ht-acc:hover,
.ht-tel:hover {
	color: #ffbf3f;
}

.ht-acc span,
.ht-tel span {
	display: inline-block;
	padding: 2px 0 2px 20px;
}

.ht-acc span {
	background: url(/images/style/roof/icon-acc.png) left center no-repeat;
	-webkit-transition: opacity .3s ease;
	transition: opacity .3s ease;
}

.ht-acc span:hover {
	opacity: .6;
}

.ht-tel span {
	background: url(/images/style/roof/icon-tel.png) left center no-repeat;
}

.ht-nav {
	padding: 0 10px;
	float: right;
}

.ht-nav li {
	float: left;
}

.ht-nav a {
	padding: 7px 10px;
	color: #fff;
}

.ht-nav a:hover {
	color: #878787;
}

.header-main {
	padding: 25px 0;
}

.mm-toggle {
	display: none;
	width: 42px;
	height: 42px;
	margin: 20px 0 0;
	float: left;
	position: relative;
	cursor: pointer;
}

.mmt-bar {
	width: 100%;
	border-top: 10px solid #4c4c4c;
	border-radius: 1px;
	position: absolute;
	left: 0;
	-o-transition: .2s;
	-moz-transition: .2s;
	-webkit-transition: .2s;
	transition: .2s;
	backface-visibility: hidden;
}

.mmt-top {
	top: 0;
}

.mmt-middle {
	top: 16px;
}

.mmt-bottom {
	top: 32px;
}

.mm-open .mmt-top {
	top: 15px;
	-webkit-transform: rotate(50deg);
	transform: rotate(50deg);
	-o-transition: .2s .3s;
	-moz-transition: .2s .3s;
	-webkit-transition: .2s .3s;
	transition: .2s .3s;
}

.mm-open .mmt-middle {
	opacity: 0;
}

.mm-open .mmt-bottom {
	top: 15px;
	-webkit-transform: rotate(310deg);
	transform: rotate(310deg);
	-o-transition: .2s .3s;
	-moz-transition: .2s .3s;
	-webkit-transition: .2s .3s;
	transition: .2s .3s;
}

.mbl-cart {
	display: none;
	background: url(/images/style/roof/icon-cart-mbl.png) center no-repeat;
	background-size: contain;
	width: 50px;
	height: 42px;
	margin: 20px 0 0;
	float: right;
	position: relative;
}

.mbl-cart span {
	background: #fca119;
	width: 27px;
	border-radius: 50%;
	position: absolute;
	top: -6px; right: -6px;
	font-size: 18px;
	line-height: 27px;
	font-weight: 700;
	text-align: center;
	color: #fff;
}

.logo {
	width: 357px;
	margin: 0;
	float: left;
	font-size: 13px;
}

.logo a {
	display: block;
	background: url(/images/style/roof/logo.png) no-repeat;
	background-size: contain;
	padding: 30.65% 0 0;
}

.header-links {
	float: right;
}

.hl-item {
	float: left;
	line-height: 77px;
}

.hl-tel,
.hl-quote {
	padding-right: 20px;
}

.hl-quote,
.hl-contact {
	border-left: 2px solid #ebebeb;
	padding-left: 20px;
}

.hl-item a {
	display: inline-block;
	padding: 48px 0 0;
	vertical-align: middle;
	font-size: 20px;
	line-height: 16px;
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
	color: #639fd8;
}

.hl-item span {
	display: block;
	font-size: 14px;
	color: #556770;
}

.hl-tel a {
	background: url(/images/style/roof/icon-header-tel.png) center top no-repeat;
	background-size: 40px auto;
}

.hl-quote a {
	background: url(/images/style/roof/icon-header-calc.png) center top no-repeat;
	background-size: 28px auto;
}

.hl-contact a {
	background: url(/images/style/roof/icon-header-env.png) center 5px no-repeat;
	background-size: 40px auto;
}

header .search-form {
	width: 266px;
	margin: 20px 55px 0 0;
	float: right;
}

.main-nav {
	background: #639fd8;
}

.main-nav .container {
	border-left: 2px solid #4b8acf;
	border-right: 2px solid #4b8acf;
	position: relative;
}

.mn-home {
	background: url(/images/style/roof/icon-home.png) center no-repeat;
	width: 70px;
	padding: 45px 0 0;
	border-right: 2px solid #4b8acf;
	float: left;
}

.mn-home:hover {
	background-color: #4b8acf;
}

.mn-link,
.mn-dd-cont {
	border-right: 2px solid #4b8acf;
	float: left;
}

.mn-link a,
.mn-dd-cont > a {
	display: block;
	padding: 0 30px;
	font-size: 15px;
	font-weight: 600;
	line-height: 45px;
	text-transform: uppercase;
	color: #fff;
	-webkit-transition: background .3s ease, color .3s ease;
	transition: background .3s ease, color .3s ease;
}

.entered .mn-dd-cont > a,
.entered .mn-link a {
	-webkit-transition: background 0s ease, color 0s ease;
	transition: background 0s ease, color 0s ease;
}

.mn-link a:hover,
.mn-dd-cont:hover > a {
	background: #ebebeb;
	color: #4b8acf;
}

.mn-link span, 
.mn-dd-cont > a span {
	display: inline-block;
	vertical-align: middle;
	line-height: normal;
}

.mn-dd-cont > a span {
	background: url(/images/style/roof/arrow-down-white.png) right center no-repeat;
	background-size: 17px 10px;
	padding: 0 30px 0 0;
}

.mn-dd-cont:hover > a span {
	background-image: url(/images/style/roof/arrow-down-blue.png);
}

.mn-dd-menu {
	background: #ebebeb;
	border: 2px solid #4b8acf;
	border-top: none;
	border-radius: 0 0 3px 3px;
	position: absolute;
	left: -2px; right: -2px;
	z-index: 11;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility .3s ease, opacity .3s ease;
	transition: visibility .3s ease, opacity .3s ease;
}

.no-js .mn-dd-menu {
	display: none;
}

.js .mn-dd-menu {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility .3s ease, opacity .3s ease;
	transition: visibility .3s ease, opacity .3s ease;
}

.entered .mn-dd-menu {
	-webkit-transition: visibility 0s ease, opacity 0s ease;
	transition: visibility 0s ease, opacity 0s ease;
}

.no-js .mn-dd-cont:hover .mn-dd-menu {
	display: block;
}

.js .mn-dd-cont:hover .mn-dd-menu {
	visibility: visible;
	opacity: 1;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.mn-shop .mn-dd-menu, .mn-servcies .mn-dd-menu{
	min-height: 356px;
	padding: 20px 20px 20px 0;
}

.mn-shop .mn-dd-menu > ul, .mn-services .mn-dd-menu > ul {
	width: 288px;
	float: left;
	font-weight: 600;
	text-transform: uppercase;
}

.mn-dd-item {
	-webkit-transition: background .3s ease;
	transition: background .3s ease;
}

.mn-dd-item:hover,
.mn-dd-item.active {
	background: #fff;
}

.mn-dd-item > a {
	display: block;
	padding: 7px 10px 7px 30px;
	font-size: 15px;
	color: #4c4c4c;
}

.sub-menu-placeholder {
	background: #fff;
	min-height: 316px;
	border-radius: 0 2px 2px 0;
	position: absolute;
	top: 20px; left: 288px; right: 20px;
}

.mn-dd-sub-menu {
	background: #fff;
	min-height: 316px;
	padding: 15px 15px 15px 20px;
	border-radius: 0 2px 2px 0;
	position: absolute;
	top: 20px; left: 288px; right: 20px;
	z-index: 1;
	overflow: hidden;
}

.mn-dd-sub-menu {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility .3s ease, opacity .3s ease;
	transition: visibility .3s ease, opacity .3s ease;
}

.mn-dd-item:hover .mn-dd-sub-menu,
.mn-dd-item.active .mn-dd-sub-menu {
	visibility: visible;
	opacity: 1;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.mn-dd-sub-menu .cl-item a,
.view-all-inner {
	height: 140px;
}

.view-all-inner {
	background: url(/images/style/roof/cat-surfaces-block-paving.jpg) center center no-repeat;
	position: relative;
}

.mn-dd-sub-menu .view-all a {
	background: rgba(76, 76, 76, .86);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0; left: 0;	
	-webkit-transition: background .3s ease;
	transition: background .3s ease;
}

.mn-dd-sub-menu .view-all a:hover {
	background: rgba(76, 76, 76, 1);
}

.mn-dd-sub-menu .view-all-text {
	width: 100%;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 18px;
	letter-spacing: 1px;
	text-align: center;
	color: #ffbf3f;
}

.mn-dd-sub-menu .view-all-text span {
	display: inline-block;
	background: url(/images/style/roof/arrow-right-orange.png) right center no-repeat;
	padding: 0 17px 0 0;
}

.mn-cms .mn-dd-menu {
	padding: 25px 25px 10px;
}

.mn-cms .page-grid {
	margin: 0 -10px 0 0;
}

.mn-cms .page-box {
	padding: 0 10px 10px 0;
}

.header-cart-cont {
	width: 34%;
	float: right;
	position: relative;
}

.header-cart {
	display: block;
	background: #4b8acf;
	padding: 0 50px 0 25px;
	position: relative;
	font-size: 15px;
	font-weight: 600;
	line-height: 45px;
	text-transform: uppercase;
	color: #fff;
}

.header-cart::after {
	content: "";
	display: block;
	background: #ffbf3f url(/images/style/roof/arrow-right-white.png) center no-repeat;
	background-size: 10px 18px;
	width: 35px;
	height: 45px;
	position: absolute;
	top: 0; right: 0;
	-webkit-transition: background .3s ease, width .3s ease;
	transition: background .3s ease, width .3s ease;
}

.header-cart:hover {
	color: #fff;
}

.header-cart:hover::after {
	background-color: #fca119;
	width: 45px;
}

.header-cart > span {
	display: inline-block;
	background: url(/images/style/roof/icon-cart.png) left top no-repeat;
	padding: 1px 0 0 35px;
	margin: -1px 0 0;
	vertical-align: middle;
	line-height: normal;
}

.header-cart strong {
	margin: 0 0 0 15px;
}

.basket_msg_layer {
	position: absolute;
	bottom: -45px; right: 50%;
	z-index: 1;
}

/*================================
============ FOOTER ==============
================================*/

.footer-clients {
	background: #639fd8;
	padding: 35px 0 30px;
	position: relative;
}

.footer-clients::before {
	content: "";
	display: block;
	background: #fdaa30;
	height: 5px;
	position: absolute;
	top: 0; left: 0; right: 0;
}

.footer-clients::after {
	content: "";
	display: block;
	background: url(/images/style/roof/bg-bricks.jpg) center no-repeat;
	background-size: cover;
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
	opacity: .1;
}

.client {
	vertical-align: middle;
	text-align: center;
}

.client:first-child {
	width: 18%;
	text-align: left;
}

.client:last-child {
	text-align: right;
}

.footer-main {
	padding: 25px 0;
	border-top: 4px solid #4c4c4c;
	border-bottom: 4px solid #4c4c4c;
}

.footer-nav {
	width: 34.58%;
	margin: 11px 0 0;
	border-radius: 2px;
	float: left;
	overflow: hidden;
	font-weight: 600;
	text-transform: uppercase;
}

.fn-header {
	display: none;
	padding: 15px 20px;
	cursor: pointer;
	font-size: 21px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.fn-header span {
	display: block;
	background: url(/images/style/roof/arrow-down-white.png) right center no-repeat;
}

.fn-header.open span {
	background-image: url(/images/style/roof/arrow-up-white.png)
}

.fn-inner {
	overflow: hidden;
}

.footer-nav .lvl1-container {
	width: 50%;
	padding: 0 15px 0 0;
	float: left;
}

.footer-menu .footer-item-lvl1 {
	margin: 20px 0 0;
}

.footer-cs .footer-item-lvl1 {
	margin: 10px 0 0;
}

.footer-nav .footer-item-lvl1:first-child {
	margin: 0;
}

.footer-menu a {
	font-size: 15px;
	color: #fff;
}

.footer-menu a:hover {
	color: #878787;
}

.footer-cs a {
	font-size: 12px;
	color: #878787;
}

.footer-cs a:hover {
	color: #fff;
}

.footer-agent {
	float: right;
}

.footer-bottom {
	padding: 20px 0 40px;
}

.fb-main {
	font-size: 11px;
}

.fb-main,
.footer-links a {
	color: rgba(255, 255, 255, .2);
}

.footer-links a:hover {
	color: rgba(255, 255, 255, .4);
}

.footer-payment {
	width: 290px;
	margin: 10px 0 0;
}

.footer-bottom-reviews{
	float:right;
	margin-left:20px;
}

.fb-social {
	float: right;
	overflow: hidden;
	text-align: right;
}

.fb-social span {
	display: block;
	margin: 0 0 10px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.fb-social a {
	margin: 0 0 0 5px;
	float: left;
}

.fb-social img {
	display: block;
	width: 27px;
}





/*================================
========= MOBILE MENU ============
================================*/

.mbl-menu {
	background: url(/images/style/roof/bg-bricks.jpg) top center no-repeat;
	background-size: 1600px;
	width: 389px;
	padding: 30px 20px;
	position: absolute;
	top: 0; bottom: 0; left: -389px;
}

.mbl-menu::before {
	content: "";
	display: block;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#639fd8+0,639fd8+100&0.8+0,1+30 */
	background: -moz-linear-gradient(top,  rgba(99,159,216,0.8) 0%, rgba(99,159,216,1) 1100px, rgba(99,159,216,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(99,159,216,0.8)), color-stop(1100px,rgba(99,159,216,1)), color-stop(100%,rgba(99,159,216,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(99,159,216,0.8) 0%,rgba(99,159,216,1) 1100px,rgba(99,159,216,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(99,159,216,0.8) 0%,rgba(99,159,216,1) 1100px,rgba(99,159,216,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(99,159,216,0.8) 0%,rgba(99,159,216,1) 1100px,rgba(99,159,216,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(99,159,216,0.8) 0%,rgba(99,159,216,1) 1100px,rgba(99,159,216,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc639fd8', endColorstr='#639fd8',GradientType=0 ); /* IE6-9 */
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
}

.mbl-menu-inner {
	position: relative;
}

.mm-acc {
	display: block;
	background: rgba(255, 255, 255, .12);
	padding: 15px;
	margin: 0 0 15px;
	font-size: 18px;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #fff;
}

.mm-acc:hover,
.mm-tel:hover {
	 color: #fff;
}

.mm-acc span {
	display: inline-block;
	background: url(/images/style/roof/icon-acc-mbl.png) left center no-repeat;
	padding: 0 0 0 38px;
}

.mbl-menu .search-form {
	padding: 2px;
	margin: 0 0 30px;
}

.mbl-menu .search-input {
	height: 52px;
	font-size: 21px;
	line-height: 52px;
}

.mbl-menu .search-submit {
	background-size: auto;
	width: 52px;
	padding: 52px 0 0;
}

.mm-main {
	margin: 0 0 15px;
}

.mm-main a {
	display: block;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.mm-main > ul > li {
	background-color: rgba(0, 0, 0, .25);
	margin: 0 0 2px;
}

.mm-main > ul > li > a {
	padding: 20px;
	font-size: 21px;
}

.mm-main-cont > a > span {
	display: block;
	background: url(/images/style/roof/arrow-down-white.png) right center no-repeat;
}

.mm-main-cont .open span {
	background-image: url(/images/style/roof/arrow-up-white.png);
}

.mm-main-cont > ul {
	display: none;
	padding: 0 25px 20px;
}

.mm-main-cont > ul a {
	padding: 3px 0;
}

.mm-main-cont > ul > li > a {
	font-size: 18px;
}

.mm-main-cont > ul > li > ul {
	padding: 7px 10px;
	font-size: 15px;
}

.mm-nav {
	margin: 0 0 35px;
}

.mm-nav li {
	margin: 0 0 2px;
}

.mm-nav a {
	display: block;
	background-color: rgba(0, 0, 0, .12);
	padding: 15px 20px;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.mm-tel {
	display: block;
	padding: 20px 0;
	border-top: 2px solid rgba(44, 40, 41, .25);
	border-bottom: 2px solid rgba(44, 40, 41, .25);
	font-size: 24px;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #fff;
}

.mm-tel span {
	display: inline-block;
	background: url(/images/style/roof/icon-contact-white.png) left center no-repeat;
	background-size: 25px 25px;
	padding: 0 0 0 33px;
}





/*================================
============ SIDEBAR =============
================================*/

.sidebar {
	width: 300px;
	float: left;
	position: relative;
}

.cat-menu,
.cms-cat-menu {
	border-radius: 2px;
	margin: 0 0 30px;
	overflow: hidden;
}

.cm-title {
	padding: 10px 15px;
	font-size: 18px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #fff;
	background:#019BBF;
}

.ha-page-list {
	margin: 0 0 30px;
}

.ha-page-list .cm-title {
	display: none;
}

.cm-title span {
	display: block;
}

.cat-menu .cm-title {
	background: #4b8acf;
}

.cms-cat-menu .cm-title {
	background: #444;
}

.cms-cat-menu ul {
	padding: 10px 0;
}

.cat-menu > ul {
	background: #639fd8;
}

.cat-menu > ul > li,
.cms-cat-menu > ul > li {
	padding: 0 15px;
}

.cat-menu > ul ul {
	padding: 0 0 10px 10px;
}

.cat-menu > ul ul,
.cat-menu .parent.sel,
.cat-menu .open {
	background: #4b8acf;
}

.cat-menu > ul ul a {
	padding: 5px 0;
	font-size: 12px;
}

.cms-cat-menu ul {
	background: #4c4c4c;
}

.cat-menu a,
.cms-cat-menu a {
	padding: 8px 0;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	text-transform: uppercase;
}

.cat-menu a:hover,
.cms-cat-menu a:hover {
	color: #dedede;
}

.cat-menu .sel > a {
	color: #dedede;
}

.cms-cat-menu a.sel {
	color: #ffbf3f;
}

.page-list {
	margin: 0 0 30px;
	text-transform: uppercase;
}

.page-list .cm-title {
	display: none;
	background: #4b8acf;
}

.page-list li,
.ha-page-list li {
	margin: 0 0 2px;
}

.page-list a,
.ha-page-list a {
	display: block;
	background: #ebebeb;
	padding: 12px 15px;
	border-radius: 2px 2px 0 0;
	overflow: hidden;
	font-weight: 600;
}

.page-list a {
	color: #4c4c4c;
}

.page-list .sel a,
.ha-page-list .sel .ha-page-name {
	color: #fff;
}

.page-list .sel a {
	background: #4b8acf;
}

.ha-page-list .ha-page-icon {
	background-size: contain;
	width: 20px;
	height: 20px;
	vertical-align: middle;
	-webkit-transition: transform .3s ease;
	transition: transform .3s ease;
	-webkit-backface-visibility: hidden;
}

.ha-page-list a:not(.sel):hover .ha-page-icon {
	-webkit-transform: translate(0, 40px);
	transform: translate(0, 40px);
}

.ha-page-list .ha-page-name {
	display: inline-block;
	margin: 0 0 0 15px;
	vertical-align: middle;
	font-size: 14px;
	-webkit-transition: transform .3s ease;
	transition: transform .3s ease;
	-webkit-backface-visibility: hidden;
}

.ha-page-list a:not(.sel):hover .ha-page-name {
	-webkit-transform: translate(-35px);
	transform: translate(-35px);
}

.touch .ha-page-list a:not(.sel):hover .ha-page-icon {
	-webkit-transform: none;
	transform: none;
}

.touch .ha-page-list a:not(.sel):hover .ha-page-name {
	-webkit-transform: none;
	transform: none;
}

.filters {
	background: #ebebeb;
	padding: 10px 0;
	border-radius: 2px;
	margin: 0 0 30px;
}

.filter-title {
	padding: 8px 20px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	color: #4b8acf;
}

.filter-title span {
	display: block;
	background: url(/images/style/roof/filter-open.png) right center no-repeat;
}

.filter-open .filter-title span {
	background-image: url(/images/style/roof/filter-close.png);
}

.filter .list-reset {
	padding: 0 35px 0 20px;
	margin: 0 0 10px;
}

.filter li {
	margin: 0 0 4px;
}

.filter a {
	display: inline-block;
	padding: 0 0 0 23px;
	position: relative;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	color: #4c4c4c;
}

.filter a::before {
	content: "";
	display: block;
	background: #fff;
	width: 12px;
	height: 12px;
	margin: -6px 0 0;
	position: absolute;
	top: 50%; left: 0;
}

.filter-selected a {
	color: #fca119;
}

.filter-selected a::before {
	background: #fca119 url(/images/style/roof/icon-tick-white.png) center no-repeat;
	background-size: 10px 8px;
}

.sidebar-links,
.sidebar-links a {
	border-top: 1px solid #ebebeb;
	border-bottom: 1px solid #ebebeb;
}

.sidebar-links a {
	display: block;
	padding: 15px 15px 15px 55px;
	position: relative;
	line-height: 16px;
}

.sb-link-icon {
	display: block;
	background-position: center center;
	background-repeat: no-repeat;
	width: 55px;
	position: absolute;
	top: 15px; bottom: 15px; left: 0;
}

.sb-link-text {
	font-size: 18px;
	font-weight: 600;
	text-transform: uppercase;
	color: #4b8acf;
	-webkit-transition: color .3s ease;
	transition: color .3s ease;
}

.sb-link-text span {
	display: block;
	font-size: 13px;
	color: #878787;
}

.sidebar-links a:hover .sb-link-text {
	color: #fca119;
}





/*================================
=========== HOMEPAGE =============
================================*/

.banner-slider-cont {
	background-color: #4b8acf;
	min-height: 200px;
	position: relative;
}

.loading .banner-slider-cont {
	height: 500px;
}

.banner-slider-cont::after {
	content: '';
	display: block;
	width: 100%;
	position: absolute;
	bottom: 0;
}

.banner-slider-cont::after {
	background: -moz-linear-gradient(top,  rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.75) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0.75))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0.75) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0.75) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0.75) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0.75) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ffffff', endColorstr='#bfffffff',GradientType=0 ); /* IE6-9 */
	height: 30px;
	z-index: 13;
}

.ls-cont {
	display: none;
	background-color: #4b8acf;
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: 11;
}

.load-spinner {
	width: 60px;
	height: 50px;
	margin: -35px 0 0 -30px;
	position: absolute;
	top: 50%; left: 50%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	font-size: 10px;
	text-align: center;
}

.load-spinner span {
	display: inline-block;
	background-color: #ffbf3f;
	height: 100%;
	width: 8px;
	-webkit-animation: stretchY 1.2s infinite ease-in-out;
	animation: stretchY 1.2s infinite ease-in-out;
}

.load-spinner .bar2 {
	-webkit-animation-delay: -1.1s;
	animation-delay: -1.1s;
}

.load-spinner .bar3 {
	-webkit-animation-delay: -1.0s;
	animation-delay: -1.0s;
}

.load-spinner .bar4 {
	-webkit-animation-delay: -0.9s;
	animation-delay: -0.9s;
}

.load-spinner .bar5 {
	-webkit-animation-delay: -0.8s;
	animation-delay: -0.8s;
}

.banner-slider .slick-slide {
	padding: 0 0 35px;
}

.banner-slider .container {
	line-height: 500px;	
}

.bs-content {
	display: inline-block;
	background: #4b8acf;
	width: 90%;
	max-width: 340px;
	padding: 2px;
	border-radius: 3px;
	margin: -30px 0 0;
	vertical-align: middle;
	line-height: normal;
	text-align: left;
}

.bs-inner {
	padding: 14px 20px 18px 20px;
	border: 1px solid rgba(255, 255, 255, .2);
	border-radius: 3px;
}

.bs-title {
	display: block;
	margin: 0 0 6px;
	font-size: 22px;
	line-height: 32px;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
}

.bs-text {
	margin: 0 0 16px;
	font-size: 16px;
	line-height: 21px;
	font-weight: 700;
	color: #ebebeb;
}

.home-featured {
	background: rgb(246,246,246); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(246,246,246,1) 0%, rgba(235,235,235,1) 75%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(246,246,246,1)), color-stop(75%,rgba(235,235,235,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(235,235,235,1) 75%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(235,235,235,1) 75%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(235,235,235,1) 75%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(246,246,246,1) 0%,rgba(235,235,235,1) 75%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#ebebeb',GradientType=0 ); /* IE6-9 */
	position: relative;
	z-index: 12;
}

.hf-section {
	width: 33.33333333%;
	padding: 0 20px 45px 0;
	margin: -20px 0 0;
	float: left;
	position: relative;
}

.hfs-content {
	background: #fff;
	padding: 20px;
	border-radius: 2px;
}

.home-services .hfs-content {
	padding: 20px 20px 15px;
}

.hs-item { 
	width: 50%;
	padding: 0 5px 5px 0;
	float: left;
}

.hs-item a {
	display: block;
	padding: 58.48% 0 0;
	border-radius: 2px;
	position: relative;
	text-align: center;
}

.hs-item a::before {
	content: "";
	background: rgba(73, 73, 73, .8);
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
	opacity: 0;
	-webkit-transition: opacity .3s ease;
	transition: opacity .3s ease;
}

.hs-item a:hover::before {
	opacity: 1;
}

.hs-name {
	display: block;
	width: 100%;
	max-width: 130px;
	position: absolute;
	top: 50%; left: 50%;
	font-size: 14px;
	font-weight: 600;
	line-height: 14px;
	text-transform: uppercase;
	color: #fff;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.guide-slider .slick-slide {
	position: relative;
}

.guide-slider .slick-next,
.guide-slider .slick-prev {
	width: 30px;
	padding: 30px 0 0;
	border-radius: 2px;
	top: auto; bottom: 45px;
	-webkit-transform: translateY(50%);
	transform: translateY(50%);
}

.guide-slider .slick-next {
	background: #fff url(/images/style/roof/arrow-right-grey.png) center center no-repeat;
	right: 20px;
}

.guide-slider .slick-prev {
	background: #fff url(/images/style/roof/arrow-left-grey.png) center center no-repeat;
	left: auto; right: 51px;
}

.guide-cont {
	height: 0;
	padding: 0 0 63.4%;
	position: relative;
}

.guide-cont iframe {
	position: absolute;
	top: 0; left: 0;
}

.guide-slider .guide-title {
	padding: 0 90px 0 70px;
	position: relative;
	line-height: 90px;
}

.guide-slider .guide-title::after {
	content: "";
	display: block;
	background-color: rgba(76, 76, 76, .9);
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
}

.guide-number {
	background: #fff;
	display: block;
	width: 34px;
	border-radius: 50%;
	position: absolute;
	top: 50%; left: 20px;
	z-index: 1;
	line-height: 34px;
	font-weight: 700;
	text-align: center;
	color: #4c4c4c;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.gt-inner {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	z-index: 1;
	overflow: hidden;
	line-height: 18px;
}

.home-minicontent h2 {
	line-height: 21px;
	color: #639fd8;
}

.home-minicontent p {
	line-height: 20px;
}

.hfs-content-inner {
	min-height: 218px;
	padding: 20px 25px;
	border: 2px solid #ebebeb;
	border-top: none;
}

.hfs-text {
	margin: 30px 0 0;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
}

.hfs-title {
	display: block;
	font-size: 24px;
	color: #4c4c4c;
}

.hfs-sub {
	display: block;
	color: #4b8acf;
}

.hf-section .btn {
	min-width: 148px;
	margin: 15px 0 0;
}

.home-sp {
	padding: 25px 0;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
}

.hsp {
	width: 25%;
	float: left;
	text-align: center;
}

.hsp:not(:first-child) {
	padding-left: 10px;
}

.hsp:not(:last-child) {
	padding-right: 10px;
}

.hsp span {
	display: inline-block;
	background: url(/images/style/roof/icon-tick-orange.png) left center no-repeat;
	padding: 0 0 0 30px;
}

.review-slider {
	background: #4b8acf;
	position: relative;
}

.review-slider::before {
	content: "";
	display: block;
	background: url(/images/style/roof/bg-tiles.jpg) center no-repeat;
	background-size: cover;
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
	opacity: .15;
}

.review-slider .slick-next,
.review-slider .slick-prev {
	background-color: rgba(76, 76, 76, .3);
	margin: -20px 0 0;
}

.review-slide {
	width: 80%;
	max-width: 900px;
	padding: 65px 0;
	margin: 0 auto;
}

.rs-left {
	display: block;
	width: 150px;
	border: 5px solid rgba(255, 255, 255, .7);
	margin: 0 25px 0 0;
	float: left;
}

.rs-right {
	overflow: hidden;
}

.rs-comment {
	display: block;
	margin: 5px 0 10px;
	font-size: 24px;
	font-weight: 600;
	font-style: italic;
	color: #fff;
}

.rs-comment p {
	line-height: 28px;
}

.rs-title {
	display: block;
	margin: 0 0 20px;
	vertical-align: middle;
	font-size: 15px;
	font-weight: 600;
	color: #dedede;
}

.rs-right .btn {
	background: #4c4c4c;
}

.rs-right .btn:hover {
	background: #878787;
}

.home-main {
	padding: 70px 0;
}

.home-content {
	width: 47.5%;
	float: left;
}

.home-news {
	border-radius: 2px;
	position: relative;
	overflow: hidden;
}
					
.hn-img {
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 58.07%;
}

.hn-img::before,
.hn-img::after {
	content: "";
	display: block;
	background: rgba(64, 64, 64, .6);
	position: absolute;
	top: 0; bottom: 0; right: 0;
}

.hn-img::before {
	width: 10px;
}

.hn-img::after {
	width: 5px;
}

.hn-text {
	background-image: url(/images/style/roof/home-quote-bg.jpg);
	width: 58.07%;
	padding: 20px 30px 25px;
	float: right;
	font-weight: 600;
	color: #fff;
}

.hn-title {
	display: block;
	margin: 0 0 12px;
	position: relative;
	font-size: 18px;
	line-height: 18px;
}

.hn-date {
	display: block;
	margin: 0 0 15px;
	font-size: 11px;
	text-transform: uppercase;
	color: #878787;
}

.hn-content {
	margin: 0 0 15px;
	position: relative;
	font-size: 12px;
	color: #dedede;
}

.hn-content p {
	line-height: 18px;
}

.hn-content a {
	color: #fca119;
}

.hn-content a:hover {
	color: #ffbf3f;
}

.hn-text .btn {
	font-size: 11px;
}

.hn-more {
	margin: 10px 2px 0 0;
}

.hn-archive {
	background: #878787;
	margin: 10px 0 0;
}

.hn-archive:hover {
	background: #4c4c4c;
}

.home-content {
	padding: 20px 20px 20px;
	border: 2px solid #ebebeb;
}

.home-content .logo-title span {
	color: #4b8acf;
}

.home-content h2, .home-content h3 {
	margin-bottom:0;
	padding-bottom:6px;
}

.home-content p {
	font-size: 12px;
	margin-bottom:10px;
}

.home-content .overflow {
	margin: 0 0 15px;
}

.home-content .btn {
	background-color: #878787;
	padding: 5px 15px;
	margin-top:2px;
}

.home-content .btn:hover {
	background-color: #4c4c4c;
}

.home-content .btn-overflow {
	background-color: #fca119;
	margin: 0 2px 0 0;
}

.home-content .btn-overflow:hover {
	background-color: #ffbf3f;
}

.home-news {
	width: 47.5%;
	float: right;
}





/*================================
========= HELP & ADVICE ==========
================================*/

.ha-left {
	width: 48.333333333%;
	float: left;
}

.ha-page-grid {
	margin: 0 -12px 0 0;
}

.ha-page-box {
	width: 50%;
	padding: 0 12px 12px 0;
	float: left;
	font-weight: 600;
	text-align: center;
}

.ha-page-box a {
	display: block;
	background: #ebebeb;
	padding: 25px 10px;
}

.ha-page-icon {
	display: inline-block;
	background-position: center center;
	background-repeat: no-repeat;
}

.ha-page-box .ha-page-icon {
	width: 51px;
	height: 40px;
	margin: 0 0 10px;
	-webkit-transition: transform .4s ease-out;
    transition: transform .4s ease-out;
	-webkit-backface-visibility: hidden;
}

.ha-page-box a:hover .ha-page-icon {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
}

.ha-page-name {
	text-transform: uppercase;
	color: #4c4c4c;
}

.ha-page-box .ha-page-name {
	display: block;
	margin: 0 0 5px;
	font-size: 18px;
}

.ha-page-box p {
	font-size: 12px;
	line-height: 15px;
	color: #878787;
}

.ha-right {
	width: 48.333333333%;
	float: right;
}

.featured-faq .dd-block {
	background: #639fd8;
	margin: 0 0 5px;
	color: #fff;
}

.featured-faq .dd-block a,
.pack-form .dd-block a{
	color:#fff;
	text-decoration:underline;
}

.featured-faq .dd-block:last-child {
	margin: 0 0 10px;
}

.featured-faq .dd-title {
	text-transform: uppercase;
	color: #fff;
}

.featured-faq .dd-title span {
	background: url(/images/style/roof/arrow-down-white.png) right center no-repeat;
	background-size: 21px 12px;
}

.featured-faq .dd-open span {
	background-image: url(/images/style/roof/arrow-up-white.png);
}

.featured-faq + .btn {
	display: block;
	padding: 10px;
}

.ha-contact-link {
	background: #4b8acf;
	padding: 20px;
	border-radius: 2px;
	margin: 0 0 30px;
	position: relative;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	color: #fff;
}

.ha-contact-link::before {
	content: "";
	display: block;
	background: url(/images/style/roof/bg-bricks.jpg) center no-repeat;
	background-size: 200%;
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
	opacity: .1;
}

.ha-contact-link p {
	position: relative;
}

.ha-contact-link a {
	color: #ebebeb;
}

.ha-contact-link a:hover {
	color: #fff;
}





/*================================
============ CONTACT =============
================================*/

.contact-page-inner {
	border: 2px solid #ebebeb;
}

.contact-left {
	width: 57.69%;
	padding: 30px 40px;
	float: left;
}

.contact-info {
	font-weight: 600;
}

.contact-info .dblc {
	padding-bottom: 15px;
}

.contact-info .contact-address .dblc {
	padding-bottom: 20px;
}

.contact-detail-label {
	width: 150px;
	padding-right: 10px;
	font-size: 12px;
	text-align: right;
	text-transform: uppercase;
}

.contact-detail {
	color: #4c4c4c;
}

.contact-note {
	background: #ffeac1;
	padding: 15px;
	border: 2px solid #ffbf3f;
	margin: 20px 0 35px 0;
	font-size: 12px;
}

.contact-note p {
	line-height: 16px;
}

.contact-right {
	width: 42.31%;
	padding: 20px 20px 25px 0;
	float: right;
}

.contact-form-cont {
	background: #4b8acf;
	padding: 20px 20px 25px;
	border-radius: 0 2px 2px 0;
	margin: -22px -22px -27px 0;
}

.contact-form-cont .msg {
	margin: 0 0 15px;
}

.contact-form .logo-title {
	color: #fff;
}

.contact-form{
	position:relative;	
}

.contact-form-cont .error-msg{
	width:100%;
	position:absolute;
	margin-top:-12px;
}

#image_upload .error-msg{
	margin-top:0;	
}

.contact-form p {
	margin: 0 0 15px 0;
	font-size: 12px;
	line-height: 16px;
	color: #fff;
}

.contact-form p a {
	display: inline;
	color: #fff;
}

.contact-form .custom-row {
	margin: 5px 0 0;
}

.contact-form .custom-row:first-of-type {
	margin: 20px 0 0;
}

.contact-form .custom-row:nth-of-type(5) {
	margin: 15px 0 0;
}

.contact-form .text_input,
.contact-form .select_input {
	padding: 10px 15px;
	border-color: transparent;
}

.contact-form .validate_border {
	border:1px solid #fc1944;
}

.contact-form .select_input {
	color: #4c4c4c;
}

.contact-submit {
	width: 148px;
	margin: 10px 0 0;
	float: right;
}





/*================================
============== FAQ ===============
================================*/

.faq-content {
	margin: 0 0 40px;
}

.dd-section {
	margin: 0 0 40px;
}

.list-reset .dd-block {
	margin: 0 0 5px;
}

.dd-block {
	background: #ebebeb;
	border-radius: 2px;
}

.dd-title {
	padding: 13px 18px;
	cursor: pointer;
	font-size: 14px;
	line-height: 18px;
	font-weight: 600;
	color: #4b8acf;
}

.dd-video-icon{
	float:left;
	width:26px;
	height:20px;
	background-image:url(/images/style/roof/icon-triangle-white.png);
	background-color: #4b8acf;
	background-repeat: no-repeat;
	background-position: 10px 6px;
	background-size:8px 9px;
	border-radius:3px;
	margin:0 8px 0 0;
}

.dd-title span {
	display: block;
	background: url(/images/style/roof/arrow-down-black.png) right center no-repeat;
	padding: 2px 36px 0 0;
}

.dd-open span {
	background-image: url(/images/style/roof/arrow-up-black.png);
}

.dd-text {
	padding: 0 56px 15px 20px;
	font-size: 12px;
	font-weight: 600;
}

.faq-footer {
	margin: 0;
	font-size: 21px;
}

.faq-footer p {
	line-height: 24px;
}





/*================================
============ DELIVERY ============
================================*/

.delivery-footer {
	padding: 20px 0 0;
	border-top: 2px solid #ebebeb;
	margin: 25px 0 0;
	font-size: 18px;
	font-weight: 600;
	color: #4c4c4c;
}

.delivery-footer p {
	line-height: 24px;
}





/*================================
============ REVIEWS =============
================================*/

.fb-item {
	border: 2px solid #ebebeb;
	border-radius: 2px;
	margin: 20px 0 0;
	overflow: hidden;
}

.fb-item:first-child {
	margin: 0;
}

.fb-text {
	padding: 20px 25px;
}

.fb-item-img .fb-text {
	width: 58.4%;
	float: left;
}

.fb-item-img img {
	width: 41.6%;
	float: right;
}

.fb-credit {
	font-size: 12px;
	color: #4c4c4c;
}

.fb-credit span {
	font-weight: 700;
}





/*================================
============= GUIDES =============
================================*/

.guides-section {
	padding: 20px 25px 10px;
	margin: 30px 0 0;
}

.guides-section:first-child {
	margin: 0;
}

.guides-section p {
	margin: 0 0 10px;
	font-size: 14px;
}

.guide {
	width: 50%;
	padding: 0 20px 20px 0;
	float: left;
}

.mbl-guide-title {
	display: none;
	margin: 0 0 15px;
	font-size: 16px;
	font-weight: 600;
	color: #4c4c4c;
}

.mbl-guide-title span {
	border-bottom: 2px solid #4c4c4c;
}

.guide-inner {
	height: 0;
	padding: 0 0 75.32%;
	border-radius: 3px;
	position: relative;
	overflow: hidden;
}

.guide-inner iframe {
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
}

.guide-cover {
	background-color: #444;
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
}

.no-js .guide-cover {
	display: none;
}

.btn-play {
	width: 76px;
	padding: 76px 0 0;
	margin: -38px 0 0 -38px;
	position: absolute;
	top: 50%; left: 50%;
	z-index: 1;
}

.btn-play {
	background: #fca119 url(/images/style/roof/icon-play.png) center center no-repeat;
	background-size: 22px 26px;
	border-radius: 50%;
	cursor: pointer;
	-webkit-transition: background .3s ease;
	transition: background .3s ease;
}

.btn-play:hover {
	background-color: #ffbf3f;
}

.guide-title {
	background-color: rgba(76, 76, 76, .9);
	min-height: 72px;
	padding: 15px 20px;
	position: absolute;
	bottom: 0; left: 0; right: 0;
	font-size: 16px;
	line-height: 18px;
	font-weight: 600;
	color: #fff;
}





/*================================
============ SERVICES ============
================================*/

.services-text {
	width: 59%;
	margin: 0 40px 0 0;
	float: left;
}

.services-images {
	overflow: hidden;
}

.services-content + .grid-cont20 {
	margin: 40px -20px -10px 0;
}

.page-grid {
	margin: 0 -20px 0 0;
}

.page-box {
	width: 16.666666666%;
	padding: 0 20px 20px 0;
	float: left;
}

.page-box a {
	display: block;
	background: #4c4c4c;
}

.page-image {
	display: block; 
	padding: 0 0 67.36%;
}

.page-name {
	height: 40px;
	padding: 0 10px;
	font-size: 13px;
	font-weight: 600;
	line-height: 37px;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
}

.page-name span {
	display: inline-block;
	vertical-align: middle;
	line-height: 16px;
}

.btn-quote {
	width: 48%;
	float:right;
	max-width: 400px;
	padding: 10px;
	margin: 20px auto 0;
	font-size: 15px;
}

.btn-quote:first-of-type {
	float:left;
}

.btn-video{
	padding:10px 10px 4px 10px;
}

.btn-video .image_align_middle{
	margin:-1px 4px 0.25em 0;
}

.content-btn{
	width:auto;
	padding:10px 30px;
	float:right;
	margin:0 0 10px 10px;	
}

.btn-page{
	margin:0 0 26px 0;
}

.btn-blue{
	background:#4b8acf;
}

.btn-blue:hover{
	background:#639fd8;
}

/*================================
====== NEWS / CASE STUDIES =======
================================*/

.news-item {
	width: 33.3333333%;
	padding: 0 20px 20px 0;
	float: left;
}

.ni-inner {
	border: 2px solid #ebebeb;
	border-radius: 2px;
	overflow: hidden;
}

.ni-text {
	padding: 15px 17px 20px;
	font-weight: 600;
}

.ni-title {
	display: block;
	margin: 0 0 6px;
	font-size: 18px;
	line-height: 21px;
}

.ni-date,
.article-date {
	display: block;
	text-transform: uppercase;
	color: #4c4c4c;
}

.ni-date {
	margin: 0 0 6px;
	font-size: 11px;
}

.ni-content {
	font-size: 12px;
	line-height: 16px;
}

.news-item .btn {
	margin: 15px 0 0;
}

.article-title {
	margin: 0 0 10px;
	font-size: 30px;
	font-weight: 600;
	line-height: 36px;
	color: #4b8acf;
}

.article-date {
	margin: 0 0 20px;
	font-size: 13px;
	font-weight: 600;
}

.case-study .article-date {
	text-transform: none;
	font-weight: 700;
}

.news-image {
	width: 50%;
	max-width: 360px;
	margin: 0 0 25px 25px;
	float: right;
}

.archive-title {
	margin: 35px 0 25px;
	font-size: 24px;
	text-align: center;
	text-transform: uppercase;
	color: #4c4c4c;
}





/*================================
=========== QUOTATION ============
================================*/

.quote-cont {
	max-width: 462px;
}

.quote-content {
	padding: 50px 0;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
	color: #4c4c4c;
}

.quote-form-cont {
	background: rgb(235,235,235); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(235,235,235,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(235,235,235,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	padding: 60px 0;
}

.quote-form h2 {
	font-size: 24px;
	text-transform: uppercase;
	text-align: center;
	color: #fff;
}

.quote-form-section {
	background: #4b8acf;
	padding: 20px 30px 30px;
	margin: 0 0 40px;
}

.quote-form .custom-row:first-of-type,
.quote-form .custom-row:nth-of-type(5) {
	margin: 5px 0 0;
}

.contact-form .nsltr-row {
	margin: 20px 0 0;
}

.nsltr-row input {
	margin: 3px 10px 0 0;
	float: left;
}

.nsltr-row label {
	margin: 0;
	overflow: hidden;
	font-size: 11px;
	color: #fff;
}

.quote-address {
	padding: 25px 0 0;
	border-top: 2px solid #639fd8;
	margin: 30px 0 0;
}

#postcode {
	max-width: 210px;
}

.contact-form .quote-note {
	margin: 22px 5px 20px;
	font-size: 13px;
	text-align: center;
}

.quote-submit {
	width: 100%;
	padding: 10px;
	margin: 20px 0 0;
	font-size: 15px;
}





/*================================
============== ABOUT =============
================================*/

.header-banner.about-header-banner {
	height: 680px;
	line-height: 680px;
}

.about-intro-cont {
	background: url(/images/style/roof/about-text-bg.jpg);
	max-width: 644px;
	border-radius: 3px;
	margin: 70px 0 0;
	overflow: hidden;
	position: relative;
}

.about-intro-cont::before {
	content: "";
	display: block;
	background: rgba(0, 0, 0, .2);
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
}

.about-intro {
	padding: 30px 40px 40px;
	position: relative;
	font-size: 14px;
	text-transform: none;
	color: #fff;
}

.about-intro p {
	line-height: 21px;
}

.about-half {
	width: 47.916666%;
	margin: 20px 0 0;
	float: right;
}

.about-half:first-child {
	float: left;
}

.about-half h2 {
	background: url(/images/style/roof/icon-tick-orange.png) left 4px no-repeat;
	padding: 0 0 0 30px;
	font-size: 18px;
	text-transform: uppercase;
	color: #4b8acf;
}

.about-btns {
	padding: 5px 0 0;
}

.about-btns .btn:first-child {
	margin: 0 6px 0 0;
}

.team-members {
	padding: 70px 0;
	text-align: center;

}

.team-members h2 {
	margin: 0 0 50px;
	font-size: 48px;
	line-height: 48px;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 0 0 38px rgba(0, 0, 0, .35);
}

.member {
	display: inline-block;
	width: 220px;
	border: 5px solid rgba(255, 255, 255, .7);
	border-radius: 2px;
	margin: 0 8px 15px;
}

.member img {
	display: block;
}

.member div {
	display: block;
	background: #4b8acf;
	padding: 15px 10px;
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
}

.member span {
	font-size:12px;
}

.about-lower .dblc {
	padding: 25px 0 0;
	vertical-align: middle;
}

.about-lower .dblc:first-child {
	width: 45%;
	padding: 0 20px 0 0;
	font-size: 32px;
	font-weight: 600;
}

.about-lower .dblc:first-child p {
	line-height: 34px;
}

.about-lower .dblc:last-child {
	text-align: right;
}





/*================================
========== CATEGORY PAGE =========
================================*/

.category-slider {
	border-radius: 2px;
	margin: 0 0 5px;
	overflow: hidden;
}

.category-slider .slick-next,
.category-slider .slick-prev {
	background-size: 9px 16px;
	width: 36px;
	padding: 32px 0 0;
	border-radius: 2px;
	margin: 0;
	top: auto; bottom: 20px;
}

.category-slider .slick-next {
	right: 20px;
}

.category-slider .slick-prev {
	left: auto; right: 58px;
}

.results-sort-bar {
	padding: 10px 0;
}

.results_border_top{
	border-top: 2px solid #ebebeb;
}

.selected-filters {
	margin: 0 0 -5px;
	overflow: hidden;
}

.selfilter {
	display: inline-block;
	background: #fca119;
	padding: 0 8px;
	margin: 0 5px 5px 0;
	font-size: 12px;
	line-height: 30px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.selfilter:hover {
	background: #ffbf3f;
	color: #fff;
}

.selfilter img {
	display: inline-block;
	margin: 0 0 .25em 10px;
	vertical-align: middle;
}

.results-sort-by {
	width: 180px;
	margin: 0 0 0 20px;
	float: right;
}

.results-sort-by .select_input {
	background: #fff;
	padding: 5px 10px;
	color: #4c4c4c;
}

.results-sort-by .selectboxit-list {
	border: 1px solid #ebebeb;
	border-top: none;
}

.results-sort-by .selectboxit-list .selectboxit-option-anchor {
	color: #4c4c4c;
}

.results-sort-by .selectboxit-list > .selectboxit-focus > .selectboxit-option-anchor {
	background: #ebebeb;
}

.category-text {
	padding: 20px;
	border: 2px solid #ebebeb;
	border-radius: 2px;
}

.category-text .btn, .listing-content .btn{
	background:#639fd8;
	padding:9px 10px 7px 10px;
	border-radius:5px;
}

.category-text .btn:hover, .listing-content .btn:hover{
	background:#4b8acf;
}

.listing-image {
	position: relative;
}

.listing-image--video-banner {
	position: absolute;
	left: 0;
	top: 0;
	width: 118px;
	height: 118px;
	border-style: solid;
	border-width: 118px 118px 0 0;
	border-color: #fca119 transparent transparent transparent;
	cursor: pointer;
}

.video-banner-icon {
	position: absolute;
    top: -76px;
	left: 12px;
	width: 30px;
	height: 30px;
	background-color: #fff;
	border-radius: 30px;
}

.video-banner-icon::after {
	content: '';
	position: absolute;
	top: 50%;
	left: calc(50% + 1px);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	border-style: solid;
	border-width: 7px 0 7px 12.1px;
	border-color: transparent transparent transparent #fca119;
}

.video-banner-text {
	font-size: 12px;
	font-weight: 600;
	line-height: 15px;
	color: #fff;
    position: absolute;
    top: -110px;
	left: 12px;
    width: 70px;
}

/*================================
========== CATEGORY LIST =========
================================*/

.cat-list {
	margin: 0 0 40px;
}

.cat-list-margin{
	margin-top:20px;	
}

.cat-list-inner {
	margin: 0 -6px -6px 0;
}

.cl-item {
	width: 25%;
	padding: 0 6px 6px 0;
	float: left;
}

.cl-item a {
	display: block;
	position: relative;
	overflow: hidden;
}

.cl-item img {
	display: block;
	width: 100%;
}

.cl-item-text {
	display: block;
	background: rgba(255, 255, 255, .75);
	width: 100%;
	padding: 7px;
	position: absolute;
	bottom: 0;
	font-weight: 600;
	text-transform: uppercase;
	text-align: center;
	color: #4c4c4c;
	-webkit-transition: background .3s ease, color .3s ease;
	transition: background .3s ease, color .3s ease;
}

.cl-item a:hover .cl-item-text,
.cl-item.sel .cl-item-text {
	background: rgba(255, 191, 63, .75);
	color: #fff;
}

.cl-item-text::before {
	content: "";
	display: block;
	background: rgba(255, 255, 255, .45);
	position: absolute;
	top: -5px; bottom: 0; left: 0; right: 0;
	-webkit-transition: background .3s ease;
	transition: background .3s ease;
}

.cl-item a:hover .cl-item-text::before,
.cl-item.sel .cl-item-text::before {
	background: rgba(255, 191, 63, .45);
}

.cl-item-text span {
	position: relative;
}





/*================================
========== PRODUCT LIST ==========
================================*/

.prod-grid {
	width: 33.33333%;
	padding: 0 20px 20px 0;
	float: left;
}

.prod-list {

}

.prod-item {
	
}

.prod-item-inner {
	display: block;
	border: 2px solid #ebebeb;
	position: relative;
	overflow: hidden;
}

.prod_image {
	position: relative;
	text-align: center;
}

/*.prod_banner {
	position: absolute;
	right: 0; bottom: 0; left: 0; 
	padding: 5px;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	text-transform: uppercase;
	background: rgba(232, 45, 46, 0.85);
	border: 1px solid rgba(118, 19, 19, 0.85);
	-webkit-box-shadow: inset 0 0 1px #fff;
	-moz-box-shadow: inset 0 0 1px #fff;
	box-shadow: inset 0 0 1px #fff;
	letter-spacing: 0.05em;
}

.prod_banner::before {
	content: '';
	position: absolute;
	bottom: 100%; left: 50%;
	width: 14px;
	height: 8px;
	margin: 0 0 -1px -7px;
	background: url(/images/style/roof/arrow-up-red-fix.png) no-repeat center;
}*/

.prod_banner_v2 {
	position: absolute;
	right: 0; bottom: 0; left: 0; 
	padding: 5px;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.prod_banner_text_v2 {
	position: relative; 
	z-index: 1;	
}

.prod_banner_background_v2 {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0; 
	background: #E82D2E;
	border: 1px solid #761313;
	-webkit-box-shadow: inset 0 0 1px #fff;
	-moz-box-shadow: inset 0 0 1px #fff;
	box-shadow: inset 0 0 1px #fff;
	opacity: 0.85;
}

.prod_banner_background_v2::before {
	content: '';
	position: absolute;
	bottom: 100%; left: 50%;
	width: 14px;
	height: 8px;
	margin: 0 0 -1px -7px;
	background: url(/images/style/roof/arrow-up-red.png) no-repeat center;
}

.prod_image_overlay {
	width: 65px;
	position: absolute;
	top: 0; left: 0;	
}

.prod_text {
	padding: 15px;
}

.prod_title {
	display: block;
	font-size: 14px;
	font-weight: 700;
	line-height: 18px;
	color: #4b8acf;
	-webkit-transition: color .3s ease;
	transition: color .3s ease;
}

.prod-item-inner:hover .prod_title {
	color: #fca119;
}

.prod_sub_title {
	display: block;
	margin: 10px 0 0;
	font-size: 12px;
	line-height: 14px;
	font-weight: 600;
	color: #878787;
}

.prod-info {
	background: rgb(235,235,235); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(235,235,235,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(235,235,235,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(235,235,235,1) 0%,rgba(255,255,255,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	padding: 10px 15px;
}

.prod-info .dblc {
	vertical-align: bottom;
	width: 100px;
	text-align: right;
}

.prod-info .dblc:first-child {
	width: auto;
	text-align: left;
}

.prod_price_web {
	font-size: 21px;
	line-height: 16px;
	font-weight: 700;
	color: #4c4c4c;
}

.prod_price_from {
	display: block;
	font-size: 11px;
	line-height: 14px;
	text-transform: uppercase;
}

.prod_price_vat {
	font-size: 11px;
	line-height: 14px;
	color: #878787;
}

.prod_rating {
	margin: 0 0 5px;
}

.prod_rating img {
	width: 13px;
	height: 13px;
	margin-left: 2px;
}

.prod_stock {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
}

.prod_stock img {
	display: inline-block;
	max-width: 14px;
	max-height: 11px;
}

.listing_stock_in {
	color: #36ab5f;
}

.listing_stock_out {
	color: #878787;
}

.listing_stock_pending {
	color: #bfbfbf;
}





/*================================
========== PAGE NUMBERS ==========
================================*/

.previous_page, .page_number_sel, .page_number, .next_page{
	float:left;
	margin:0 3px 0 0;
	font-size:11px;
}

.previous_page a, .page_number_sel a, .page_number a, .next_page a{
	float:left;
	display:block;
	padding:4px;
	background:#f3f3f3;
	border:1px solid #d8d8d8;
	color:#6b6b6b;
	text-decoration:none;
}

.previous_page a:hover, .page_number a:hover, .next_page a:hover{
	background:#d8d8d8;
	color:#111;
}

.page_number_sel a{
	background:#171717;
	color:#fff;
}





/*================================
=========== SEARCH PAGE ==========
================================*/

.search-form {
	background-color: #fff;
	padding: 1px;
	border: 2px solid #ebebeb;
	border-radius: 2px;
	margin: 0 0 40px;
}

.search-input {
	height: 34px;
	border-color: transparent;
	font-size: 14px;
	line-height: 34px;
	font-weight: 600;
}

.search-submit {
	background: #4b8acf url(/images/style/roof/icon-search.png) center no-repeat;
	background-size: 18px auto;
	width: 34px;
	padding: 34px 0 0;
	border-radius: 2px;
	float: right;
	-webkit-transition: background .3s ease;
	transition: background .3s ease;
}

.search-submit:hover {
	background-color: #639fd8;
}






/*================================
============ LISTING =============
================================*/

.header-banner.navtrail-banner {
	height: 112px;
	line-height: 112px;
	text-align: left;
}

.navtrail,
.mbl-back {
	display: inline-block;
	margin: -10px 0 0;
	vertical-align: middle;
	font-size: 16px;
	line-height: normal;
	font-weight: 700;
	text-transform: uppercase;
}

.page-content .navtrail{
	display:block;
	color:#878787;
	margin-bottom:10px;
}

.page-content .navtrail a::after {
    background: url(/images/style/roof/arrow-right-grey-tall.png) no-repeat;
	background-size: 11px 14px;
	width:11px;
	height:14px;
}

.page-content .navtrail-current, .page-content .navtrail a{
	color:#878787;
}

.mbl-back {
	display: none;
	padding: 0 0 0 20px;
	position: relative;
	font-size: 21px;
	font-weight: 600;
	color: #fff;
}

.mbl-back:hover {
	color: #fff;
}

.mbl-back::before {
	content: "";
	display: block;
	background: url(/images/style/roof/arrow-left-white.png) no-repeat;
	width: 10px;
	height: 18px;
	background-size: 10px 18px;
	margin: -9px 0 0;
	position: absolute;
	top: 50%; left: 0;
}

.navtrail a {
	margin: 0 45px 0 0;
	position: relative;
	color: #fff;
}

.navtrail a::after {
	content: "";
	display: block;
	background: url(/images/style/roof/arrow-right-white.png) no-repeat;
	width: 8px;
	height: 14px;
	background-size: 8px 14px;
	margin: -7px 0 0;
	position: absolute;
	top: 50%; right: -30px;
}

.navtrail-current {
	color: #ebebeb;
}

.listing-right {
	background: #fff;
	width: 430px;
	float: right;
	position: relative;
}

.listing-main {
	background: #4b8acf;
	padding: 25px 30px 30px;
	border-radius: 2px;
}

.listing-main h1 {
	padding: 0 0 25px;
	border-bottom: 2px solid #639fd8;
	margin: 0 0 25px;
	font-size: 24px;
	line-height: 30px;
	font-weight: 600;
	color: #fff;
}

.price-ratings {
	margin: 0 0 25px;
	color: #fff;
}

.price-ratings .dblc {
	vertical-align: top;
}

#options_price {
	font-size: 36px;
	line-height: 36px;
	font-weight: 700;
}

#options_internatpricevalue{
	font-size:14px;	
}

.listing-vat,
.review-qty {
	font-size: 14px;
	font-weight: 600;
	color: #dedede;
}

.listing-rating {
	text-align: right;
}

.listing-rating a {
	display: block;
}

.listing-questions {
	margin-top: 10px;
}

.listing-rating img,
.rating_image {
	display: inline-block;
	width: 22px;
	height: 22px;
	margin: 0 0 0 2px;
	vertical-align: bottom;
}

.review-qty {
	display: block;
	margin: 5px 0 0;
	text-transform: uppercase;
}

.review-avg{
	padding-left: 10px;		
}

.review-split{
	padding-left: 10px;	
}

.options_1_text, .options_2_text{
	font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
	color:#fff;
	padding-bottom:1px;
}

#listing_options .select_input {
	padding: 8px 15px;
	border-color: transparent;
}

#listing_options .selectboxit {
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
}

.options_1_container .selectboxit,
.options_2_container .selectboxit {
	color: #4c4c4c;
}

.options_2_container,
.quantity-stock {
	margin: 5px 0 0;
}

.quantity-stock .dblc {
	vertical-align: middle;
}

#stock {
	text-align: right;
}

#options_stock span {
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.btn-basket {
	width: 100%;
	padding: 11px;
	margin: 30px 0 0;
	font-size: 18px;
}

.btn-basket:disabled {
	background: #4b8acf;
	color: #639fd8;
	cursor: not-allowed;
}

.listing-downloads {
	margin: 30px 0 0;
}

.listing-downloads li {
	margin: 2px 0 0;
}

.listing-downloads li:first-child {
	margin: 0;
}

.listing-downloads a,
.resource-guide-link {
	display: block;
	padding: 12px 15px;
	border-radius: 2px;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
}

.listing-downloads a {
	background: #ebebeb;
}

.listing-downloads a:hover {
	background: #dedede;
	color: #4b8acf;
}

.listing-downloads span,
.resource-guide-link span {
	display: block;
	padding: 0 0 0 30px;
}

.listing-downloads span {
	background: url(/images/style/roof/icon-pdf.png) left center no-repeat;
}

.resource-guide-link {
	background: #4c4c4c;
	margin: 10px 0 0;
	color: #fca119;
}

.resource-guide-link:hover {
	background: #878787;
	color: #fff;
}

.resource-guide-link span {
	background: url(/images/style/roof/icon-play-orange.png) 2px center no-repeat;
	background-size: 13px 15px;
}

.resource-guide-link:hover span {
	background-image: url(/images/style/roof/icon-play.png);
}

.listing-links {
	background: #639fd8;
	width: 430px;
	padding: 17px 30px;
	border-radius: 2px;
	margin: 30px 0 0;
}

.listing-links li {
	margin: 6px 0;
}

.listing-links a {
	padding: 3px 0;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.listing-links a:hover {
	color: #dedede;
}

.listing-left {
	background: #fff;
	width: 100%;
	margin: 0 -470px 0 0;
	float: left;
}

.listing-left-inner {
	margin: 0 470px 0 0;
}

#listing_image {
	border-radius: 2px;
	overflow: hidden;
}

#listing_img {
	border: 2px solid #ebebeb;
	position: relative;
}

#listing_img a,
#listing_img_thumbs a {
	display: block;
}

#listing_img a,
#listing_img_thumbs a {
	background-color: #fff;
	text-align: center;
}

#listing_offer_overlay {
	position: absolute;
	top: 0; left: 0;
}

#listing_offer_overlay-bottom-right {
	position: absolute;
	bottom: 0; right: 0;
}

.zoom {
	position: absolute;
	left: 17px;
	bottom: 20px;
}

.listing-thumbs-inner {
	background: #ebebeb;
	padding: 18px 20px 10px;
}

.thumbnail {
	width: 25%;
	padding: 0 10px 10px 0;
	float: left;
}

.listing-content {
	padding: 30px 25px;
	border: 2px solid #ebebeb;
	border-radius: 2px;
	margin: 40px 0 0;
	overflow: hidden;
}

.listing-content:first-child {
	margin: 0;
}

.listing-content .logo-title {
	margin: 0 0 20px;
}

#detailed ul,
#technical ul {
	padding: 10px 0;
	list-style: none;
	font-weight: 700;
	color: #4b8acf;
}

#detailed li,
#technical li {
	background: url(/images/style/roof/icon-tick-orange.png) left center no-repeat;
	background-size: 16px 12px;
	padding: 0 0 0 23px;
	margin: 0 0 10px;
}

#video-guide {
	margin: 40px 0 0;
}

.video-cont {
	padding: 0 0 56.25%;
	position: relative;
}

#video {
	position: absolute;
	top: 0; left: 0;
}

#video-guide .btn-play {
	background-size: auto;
	width: 100px;
	padding: 100px 0 0;
	margin: -50px 0 0 -50px;
}

.video-text {
	background-color: rgba(76, 76, 76, .9);
	padding: 20px 30px 25px 20px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	font-weight: 600;
}

.video-title {
	display: block;
	margin: 0 0 15px;
	font-size: 21px;
	line-height: 24px;
	color: #fff;
}

.guide-cat-link {
	background: url(/images/style/roof/logo-small.png) left center no-repeat;
	padding: 0 0 0 30px;
	margin: 3px 0 0;
	float: left;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	color: #ffbf3f;
}

.guide-cat-link:hover {
	color: #fca119;
}

.video-text .btn {
	float: right;
}

#related .grid-cont20 {
	margin-right: -2px;
}

#related .prod-grid {
	width: 25%;
	padding: 0 2px 0 0;
}

#related .prod_title {
	font-size: 13px;
}

#related .prod_sub_title {
	font-size: 11px;
}

#related .prod-info .dblc {
	width: auto;
	text-align: left;
}

#related .prod-info .dblc:first-child {
	display: table-footer-group;
	text-align: left;
}

#related .prod_properties,
#related .prod_price {
	margin: 5px 0 0;
}

#related .prod_rating img {
	margin: 0 2px .25em 0;
}

#related .prod_stock {
	margin: 3px 0 0;
}

#related .prod_price_web {
	font-size: 21px;
}

#reviews .comment {
	padding: 20px 0 0;
	border-top: 2px solid #ebebeb;
	margin: 20px 0 0;
	overflow: hidden;
	font-size: 12px;
}

#reviews > .comment:first-of-type {
	padding: 0;
	border: none;
	margin: 0;
}

#reviews .comment-text {
	margin: 0 0 15px;
}

#reviews .comment-text p {
	line-height: 16px;
}

.comment-by {
	overflow: hidden;
	color: #4c4c4c;
}

.comment-by span {
	display: inline-block;
}

.comment-by span:first-child {
	margin: 0 15px 0 0;
}

.comment-rating {
	margin: 0 0 0 15px;
	float: right;
}

.comment-rating img {
	width: 17px;
	height: 17px;
	margin: 0 1px;
	vertical-align: bottom;
}

#reviews .of-toggle {
	width: 100%;
	margin: 20px 0 0 0;
	padding: 6px 20px;
	text-align: left;
}

#reviews .of-toggle span {
	display: block;
	background: url(/images/style/roof/arrow-down-white.png) right center no-repeat;
	background-size: 17px 10px;
}

#reviews .of-open span {
	background-image: url(/images/style/roof/arrow-up-white.png);
}

.review-form {
	background: #ebebeb;
	padding: 20px 20px 25px;
	margin: 20px 0 0 0;
	border-radius: 2px;
}

.review-form h3 {
	margin: 0 0 20px;
	font-size: 16px;
	text-transform: uppercase;
}

.review-form .form-left {
	width: 39.0625%;
	float: left;
}

.review-form .form-right {
	width: 59.375%;
	float: right;
}

.review-form .custom-row:first-child {
	padding: 0;
}

.review-rating {
	margin: 15px 0 0;
}

.rating_image {
	width: 22px;
	height: 22px;
	cursor: pointer;
}

.review-select {
	display: none;
	border-color: transparent;
}

.review-select .select_input {
	background: #fff;
	border: 1px solid #fff;
}

.review-select .selectboxit-list {
	border-color: #fff;
}

.form-bottom {
	padding: 20px 0 0;
	clear: both;
	overflow: hidden;
}

.review-form .btn {
	padding: 6px 15px;
	margin: 0 0 0 20px;
	float: right;
}

.review-note {
	margin: 0;
	font-size: 11px;
	line-height: 14px;
}

#reviews .msg-sent,
#reviews .error-msg {
	margin: 0;
}

#reviews .error-msg {
	margin: 0 0 20px;
}

#questions .review {
	padding: 20px 0 0;
	border-top: 2px solid #ebebeb;
	margin: 20px 0 0;
	overflow: hidden;
	font-size: 12px;
}

#questions > .review:first-of-type {
	padding: 0;
	border: none;
	margin: 0;
}

#questions .review_quote {
	margin: 0 0 15px 16px;
	position: relative;
}

#questions .review_quote::before {
	content: 'Q:';
	position: absolute;
	top: 1px;
	left: -16px;
	font-weight: bold;
}

#questions .review_name {
	margin: 0 0 15px 16px;
}

#questions .review_response {
	margin: 15px 0 0 16px;
	position: relative;
}

#questions .review_response::before {
	content: 'A:';
	position: absolute;
	top: 0px;
	left: -16px;
	font-weight: bold;
}

#questions .response_name {
	margin: 15px 0 0 16px;
}

#questions .review-form {
	margin-top: 30px;
}

#questions .no_reviews p {
	margin-bottom: 15px;
}

/*
|--------------------------------------------------------------------------
| Listing > Page updates
|--------------------------------------------------------------------------
*/

.stars-container {
	width: 118px;
	margin: 0 0 0 auto;
	position: relative;
}

.star-ratings {
	display: flex !important;
	align-items: center;
}

.star-ratings svg {
	width: 22px;height: 22px;
	margin-right: 2px;
	flex-shrink: 0;
}

.star-ratings svg:last-child {
	margin-right: 0;
}

.stars-inactive svg {
	fill: #e5e5e5;
}

.stars-active {
	overflow: hidden;
	position: absolute;
	top: 0;left: 0;
}

.stars-active svg {
	fill: #fca119;
}

.listing-deadline {
	margin: 20px 0 0 0;
	border-radius: 2px;
	transition: margin 300ms ease 300ms, transform 300ms ease, box-shadow 300ms ease;
	border: 2px solid #ebebeb;
}

.listing-deadline--inner {
	padding: 20px;	
	text-transform: none;
}

.listing-deadline--details {
	float: left;
	padding: 4px 0 0 0;
}

.listing-deadline--title,
.listing-deadline--subtitle,
.listing-deadline--date {
	display: block;
}

.listing-deadline--title ~ .listing-deadline-doughnuts {
	padding-top: 8px;	
}

.listing-deadline--title {
	font-size: 12px;
	color: #4c4c4c;	
	text-transform: uppercase;
}

.listing-deadline--subtitle {
	color: #0c0924;
}

.listing-deadline--date {
	font-size: 16px;
	color: #2e344a;
	letter-spacing: 0.025em;
	text-transform: uppercase;
}

.pulse-animation {
	-webkit-animation: pulse 1s infinite;
	-moz-animation: pulse 1s infinite;
	-o-animation: pulse 1s infinite;
	animation: pulse 1s infinite;
}

.listing-deadline-doughnuts { 
	float: right;
}

.listing-deadline-doughnut {
	position: relative;
	width: 60px; height: 60px;
	float: left;
	transition: transform 1s ease;
	margin: 0 10px 0 0;
}

.listing-deadline-doughnut--inner {
	content: '';
	position: absolute;
	top: 50%; left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 50px;
	height: 50px;
	background-color: #fff;
	border-radius: 50px;
	text-align: center;
	font-weight: 700;
	color: #1e1e1e;
}

.listing-deadline-doughnut strong {
	display: block;	
	font-size: 21px;
	position: relative;
	top: 8px;
	color: #1e1e1e;
}

.listing-deadline-doughnut span {
	display: block;	
	font-size: 11px;
	position: relative;
	top: 4px;
}

.listing-deadline-doughnuts svg {
  width: 60px; height: 60px;
  background: #dde2e5;
  -webkit-transform: rotate(-89.9deg);
  transform: rotate(-89.9deg);
  border-radius: 50%;
}

.listing-deadline-doughnuts circle {
	position: relative;
	fill: #4b8acf;
	stroke: #dde2e5;
	stroke-width: 6px;
	stroke-dasharray: 38 100; /* for 38% */
	transition: stroke-dasharray 1s ease;
}

.listing-deadline-doughnut:hover circle {
	stroke-dasharray: 100 100; /* for 100% */
}

.listing-thumbs-inner {
	padding: 18px 20px;
}

.has-arrows .listing-thumbs-inner {
	padding: 18px 50px;
}

.listing-thumbnail.slick-slide .listing-thumbnail--link {
	padding: 0 3px;
	display: block;
	background: none !important;
}

.listing-thumbnails.hide {
	visibility: hidden;
}

.listing-thumbnails--slider .slick-prev,
.listing-thumbnails--slider .slick-next {
	background-color: #4b8acf;
}

.listing-thumbnails--slider .slick-prev:hover,
.listing-thumbnails--slider .slick-next:hover {
	background-color: #65A4E9;
}

.listing-thumbnails--slider .slick-disabled,
.listing-thumbnails--slider .slick-disabled:hover {
	background-color: rgba(76, 76, 76, 1);
	-webkit-animation: none !important;
	-moz-animation: none !important;
	-o-animation: none !important;
	-ms-animation: none !important;
	animation: none !important;
}

@media screen and (max-width: 479px) {

	.listing-deadline--details,
	.listing-deadline-doughnuts {
		float: none;
		margin: 0 auto;
		text-align: center;
	}
	
	.listing-deadline-doughnuts {
		width: 210px;
		margin-top: 15px;
	}
	
}

@media screen and (max-width: 380px) {

	.has-arrows .listing-thumbs-inner {
		padding: 18px 20px;
	}

}


/*================================
======= CHECKOUT TEMPLATE ========
================================*/

.chkout-container {
	width: 95%;
	max-width: 760px;
	margin: 0 auto;
}

.chkout-tel {
	padding: 10px 0 0;
	float: right;
	font-size: 30px;
	line-height: 30px;
	font-weight: 600;
	text-align: right;
	color: #4b8acf;
}

.chkout-tel span {
	display: block;
	font-size: 16px;
	line-height: 16px;
	text-transform: uppercase;
	color: #878787;
}

.chkout-header {
	background: #4b8acf;
	padding: 46px 0;
	position: relative;
}

.chkout-header::before {
	content: "";
	display: block;
	background: url(/images/style/roof/bg-bricks.jpg) center no-repeat;
	background-size: cover;
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
	opacity: .15;
}

.chkout-header .chkout-container {
	position: relative;
}

.chkout-header h1 {
	padding: 0;
	margin: 0;
	float: left;
	font-size: 24px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.chkout-stage {
	margin: 7px 0 0;
	float: right;
	font-size: 15px;
	font-weight: 600;
	text-transform: uppercase;
	color: #dedede;
}

.stage {
	display: inline-block;
	padding: 0 0 0 45px;
	float: left;
	position: relative;
}

.stage:first-child,
.cart-banner .stage:first-child {
	padding: 0;
}

.stage::before {
	content: ">";
	display: block;
	position: absolute;
	left: 20px;
}

.stage:first-child::before {
	display: none;
}

.stage-prev,
.stage-current::before {
	color: #75d396;
}

.stage-current {
	color: #fff;
}

.stage-current::before {
	color: #75d396;
}

main.chkout {
	background: #eee;
	padding: 50px 0 90px;
}

.chkout-content {
	background: #fff;
	padding: 20px;
}

.chkout-content iframe {
	margin: 0 auto;
}

.chkout h2 {
	font-size: 18px;
	padding: 0 0 15px;
	border-bottom: 2px solid #ebebeb;
	margin: 0 0 20px;
	color: #4c4c4c;
}

.chkout label,
.chkout .label {
	font-size: 12px;
}





/*================================
============== CART ==============
================================*/

.cart-banner {
	background-image: url(/images/style/roof/header-shop-products.jpg);
	height: auto;
	padding: 45px 0;
	line-height: normal;
}

.cart-banner h1 {
	padding: 0;
	margin: 0;
	float: left;
	font-size: 42px;
	text-transform: uppercase;
	text-shadow: 0 0 38px rgba(0, 0, 0, .35);
	color: #fff;
}

.cart-banner .chkout-stage {
	margin: 20px 0 0;
	font-size: 18px;
}

.cart-banner .stage-current {
}

.cart-banner .stage {
	padding:  0 0 0 60px;
}

.cart-banner .stage::before {
	left: 24px;
}

#form_cart {
	font-weight: 600;
}

.cart-items {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 2px;
}

.cart-items th {
	padding-bottom: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

.cart-items tbody td {
	border-top: 2px solid #ebebeb;
	border-bottom: 2px solid #ebebeb;
}

.cart-row-image {
	width: 100px;
}

tbody .cart-row-image {
	border-left: 2px solid #ebebeb;
}

tbody .cart-row-title a {
	font-size: 16px;
}

.cart-row-options {
	display: block;
	font-size: 12px;
}

.cart-row-qty {
	width: 105px;
	text-align: left;
}

.cart-row-qty .short-name {
	display: none;
}

tbody .cart-row-qty {
	font-size: 16px;
}

.cart-row-qty .text_input {
	display: inline-block;
	width: 69px;
	padding: 2px 8px;
	margin: 0 0 0 10px;
	font-size: 16px;
	font-weight: 600;
}

.cart-row-remove {
	width: 250px;
	text-align: center;
}

.remove {
	display: inline-block;
	background: url(/images/style/roof/cart-remove.png) left center no-repeat;
	padding: 0 0 0 15px;
	overflow: hidden;
	cursor: pointer;
	font-size: 12px;
	text-transform: uppercase;
	color: #b52025;
}

.cart-row-price {
	width: 162px;
	text-align: right;
}

thead .cart-row-price {
	padding-right: 17px;
}

tbody .cart-row-price {
	padding-right: 15px;
	border-right: 2px solid #ebebeb;
	font-size: 21px;
	color: #4c4c4c;
}

.cart-base {
	padding: 15px 0;
	border-bottom: 2px solid #ebebeb;
	float: right;
}

.cart-base .btn {
	background-image: url(/images/style/roof/cart-update.png);
	background-position: 10px center;
	background-repeat: no-repeat;
	padding: 5px 12px 5px 25px;
	margin: 1px 85px 0 0;
	float: left;
}

.cart-base-total {
	width: 328px;
	padding: 2px 0 0;
	float: right;
	font-size: 16px;
	text-transform: uppercase;
	color: #4c4c4c;
}

.cbt-value {
	padding: 0 17px 0 20px;
	font-size: 21px;
	text-align: right;
}

.cart-points {
	width: 100%;
	max-width: 320px;
	padding: 30px 0 0;
	float: right;
	clear: right;
	text-align: right;
}

.continue-shopping {
	margin: 14px 0 0;
	float: left;
}

.cart-related {
	width: 100%;
	max-width: 405px;
	padding: 20px 0 0;
	float: left;
	clear: left;
}

.cart-related h2 {
	padding: 45px 0 10px;
}

.related-basket-cont {
	display: table;
	width: 100%;
	border-bottom: 1px solid #dadada;
	padding: 10px;
}

.rb-image,
.rb-content,
.rb-right {
	display: table-cell;
	vertical-align: middle;
}

.rb-image {
	width: 75px;
}

.rb-content {
	padding: 5px;
}

.rb-content a {
	font-size: 14px;
}

.rb-price {
	font-size: 16px;
	text-align: right;
	color: #231f20;
}

.rb-right .btn {
	margin: 5px 0 0;
	float: right;
}

.cart-related h2,
.cart-options h2 {
	padding: 0 0 10px;
	border-bottom: 2px solid #ebebeb;
	margin: 0 0 5px;
	font-size: 16px;
	text-transform: uppercase;
}

.cart-related h2 {
	padding: 10px 0;
}

.related_basket_container {
	border-bottom:1px solid #ebebeb;
	padding:10px;
}

.related_basket_image {
	float:left;
	width:100px;
}

.related_basket_content {
	float:left;
	width:225px;
}

.related_basket_price {
	float:right;
	width:70px;
	text-align:right;
	font-size:14px;
}

.related_basket_button {
	float:right;
	clear:right;
	width:70px;
	text-align:right;
	padding:5px 0 0 0;
}

.cart-options {
	width: 100%;
	max-width: 320px;
	padding: 45px 0 0;
	float: right;
	clear: right;
	font-size: 12px;
	font-weight: 600;
}

.cart-delivery .custom-row {
	display: table;
	width: 100%;
}

.cd-label {
	display: table-cell;
	width: 87px;
	padding: 0 10px 0 0;
	vertical-align: middle;
	text-align: right;
}

.cd-input {
	display: table-cell;
}

.cart_input {
	padding: 2px 6px;
}

.cart-options #account_del_7 {
	width: 137px;
}

.cart-delivery .btn {
	padding: 5px 22px;
	margin: 0 0 0 87px;
}

.methods {
	padding: 15px 0 0;
}

.methods .cd-label {
	vertical-align: top;
}

.shipping-method:not(:first-child) {
	margin: 10px 0 0;
}

.shipping-method input {
	display: inline-block;
}

.shipping-method label {
	display: inline-block;
	padding: 0;
	cursor: pointer;
}

.voucher-cont {
	background: #ebebeb;
	padding: 10px 10px 0;
	margin: 40px 0 0;
	color: #4c4c4c;
}

.voucher-title,
.voucher-block {
	padding: 0 0 10px;
}

.voucher-toggle {
	float: right;
	cursor: pointer;
	text-decoration: underline;
	color: #4b8acf;
}

.voucher-toggle:hover {
	color: #639fd8;
}

.voucher-block .btn {
	padding: 3px 8px;
	margin: 0 0 0 10px;
	float: right;
}

.voucher-input {
	overflow: hidden;
}

.voucher-block .text_input {
	padding: 4px 6px;
	border: none;
}

.cart-totals {
	padding: 40px 0 15px;
	border-bottom: 2px solid #ebebeb;
}

.total-row {
	display: table;
	width: 100%;
	padding: 5px 0 0;
}

.total-label,
.total-value {
	display: table-cell;
}

.total-value {
	width: 160px;
	text-align: right;
}

.cart-grand-total {
	padding: 15px 0 0;
	border-top: 1px solid #ebebeb;
	margin: 10px 0 0;
	overflow: hidden;
	font-size: 16px;
	text-transform: uppercase;
	color: #4c4c4c;
}

.cart-grand-total .total-value {
	font-size: 24px;
}

.cart-totals + .btn {
	width: 100%;
	padding: 11px;
	margin: 20px 0 0;
	font-size: 18px;
}

.empty-cart .custom-row {
	display: table;
	width: 100%;
	padding-top: 20px;
}

.ec-left,
.ec-right {
	display: table-cell;
	vertical-align: middle;
}

.ec-left {
	width: 390px;
	padding: 0 30px 0 0;
}





/*================================
======== CHECKOUT DETAILS ========
================================*/

.div-account .click-span {
	margin: 20px 0 0;
}

.div-details .click-span {
	margin: 0 0 20px;
}

.no-js .div-account {
	margin: 0 0 30px;
}

.no-js .click-span {
	display: none;
}

.form-login {
	max-width: 400px;
}

.form-login .custom-row {
	display: table;
	width: 100%;
}

.fl-left,
.fl-right {
	display: table-cell;
	vertical-align: middle;
}

.fl-left {
	width: 145px;
	padding: 0 15px 0 0;
	text-align: right;
}

.contact-details {
	margin: 0 0 35px;
}

.contact-details .custom-row {
	margin-top: 15px;
}

.details-small,
.details-med,
.details-large {
	padding: 0 20px 0 0;
	float: left;
}

.details-small {
	width: 11%;
}

.details-med {
	width: 27.75%;
}

.details-large {
	width: 44.5%;
}

.address-column {
	width: 47.916666%;
	margin: 0 0 30px;
}

.delivery-details {
	float: left;
}

.billing-details {
	float: right;
}

.address-note {
	font-size: 12px;
}

.custom-row-half {
	width: 50%;
	padding: 0 15px 0 0;
	float: left;
}

#del_pc_finder,
#bill_pc_finder {
	padding: 8px 15px 7px;
	margin: 0 0 0 10px;
	float: right;
}

.pc_error .error-msg,
.pc_error_bill .error-msg {
	margin: 10px 0 0;
	font-size: 12px;
}

.country-change {
	cursor: pointer;
}

.match-del {
	padding: 10px 0 0;
}

.chkout-btns {
	padding: 20px 0 0;
	border-top: 2px solid #ebebeb;
	margin: 30px 0 0;
	clear: both;
}

.chkout-btns #pay {
	width: 320px;
	padding: 8px;
	float: right;
	font-size: 18px;
}

.chkout-btns .btn:first-child {
	float: left;
}





/*================================
======== CHECKOUT CONFIRM ========
================================*/

.confirm-details {
	width: 45.83333%;
	float: left;
	font-size: 12px;
}

.details-display {
	background: #eee;
	padding: 25px 20px;
	color: #4c4c4c;
}

.details-display .custom-row {
	display: table;
	width: 100%;
	padding: 25px 0 0;
}

.details-display .custom-row:first-child {
	padding: 0;
}

.details-label,
.details-value {
	display: table-cell;
}

.details-label {
	width: 50%;
	padding: 0 20px 0 0;
	text-align: right;
}

.details-value {
	font-weight: 600;
	word-break: break-all;
}

.details-display .btn {
	display: block;
	width: 150px;
	margin: 30px auto 0;
}

.confirm-order {
	width: 48.61111%;
	float: right;
	font-size: 12px;
}

.confirm-section {
	margin: 35px 0 0;
}

.confirm-cart {
	margin: 0;
	overflow: hidden;
}

.confirm-cart-items,
.confirm-cart-shipping,
.confirm-cart-total {
	padding: 5px 25px 15px 15px;
	border: 1px solid #ebebeb;
}

.confirm-cart .custom-row,
.payment-methods .custom-row {
	display: table;
	width: 100%;
	padding: 10px 0 0;
}

.confirm-cart-qty {
	display: table-cell;
	width: 20px;
}

.confirm-cart-title {
	display: table-cell;
}

.confirm-cart-price {
	display: table-cell;
	width: 70px;
	font-size: 13px;
	text-align: right;
}

.confirm-cart-shipping,
.confirm-cart-total {
	width: 250px;
	border-top: none;
	float: right;
	clear: right;
}

.confirm-cart-total {
	padding: 5px 25px 15px 15px;
	color: #4c4c4c;
}

.confirm-cart .btn {
	margin: 10px 0 0;
	float: right;
	clear: right;
}

.payment-methods .custom-row:first-child {
	padding: 0;
}

.payment-methods label {
	padding: 0;
	cursor: pointer;
}

.method-title,
.method-image {
	display: table-cell;
	vertical-align: middle;
}

.method-image img {
	float: right;
}

.addtl-info {
	padding: 10px 0 5px;
}

.confirm-tandc {
	padding: 15px 0;
	border-top: 2px solid #ebebeb;
	border-bottom: 2px solid #ebebeb;
	overflow: hidden;
}

.confirm-tandc input {
	margin: 3px 10px 0 0;
	float: left;
	cursor: pointer;
}

.confirm-tandc label {
	padding: 0;
	cursor: pointer;
}

#continue {
	width: 100%;
	padding: 8px;
	margin: 20px 0 0;
	float: right;
	font-size: 18px;
}





/*================================
========= ACCOUNT FORMS ==========
================================*/

.account-banner {
	background-image: url(/images/style/roof/header-shop-products.jpg);
}

.account-tabs {
	border-radius: 2px 2px 0 0;
	border-bottom: 5px solid #4c4c4c;
	overflow: hidden;
	text-align: center;
}

.account-tabs a {
	display: block;
	background-color: #4b8acf;
	width: 50%;
	padding: 12px;
	float: left;
	font-size: 18px;
	line-height: 20px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
}

.account-tabs a:hover {
	background-color: #639fd8;
}

.account-tabs a.sel {
	background-color: #4c4c4c;
}

.account-content {
	padding: 30px 25px 25px;
	border: 2px solid #ebebeb;
	border-top: none;
	border-radius: 0 0 2px 2px;
	overflow: hidden;
}

.account-msg {
	margin: 0 0 20px;
}

.account-box {
	background: #fff;
	width: 48.75%;
	padding: 30px;
	border: 2px solid #ebebeb;
	margin: 0 0 30px;
}

.account-box h2 {
	font-size: 18px;
	color: #4c4c4c;
}

.account-box p {
	padding: 0;
}

.account-box label {
	font-size: 12px;
}

.account-login,
.newacc-contact,
.newacc-del {
	float: left;
}

.order-tracking,
.newacc-acc,
.newacc-bil {
	float: right;
}

.account-login .error-msg {
	margin: 10px 0;
	font-size: 12px;
}

.newacc {
	margin: 15px 0 0;
}

.newacc-intro {
	text-align: center;
	margin: 0 0 30px;
}

.newacc-title {
	margin: 50px 0 30px;
	font-size: 64px;
	line-height: 66px;
	font-weight: 700;
	text-transform: uppercase;
}

.newacc-trade {
	width: 100%;
	overflow: hidden;
}

.trade-left {
	width: 48.67256%;
	float: left;
}

.trade-right {
	width: 48.67256%;
	float: right;
}

.acc-chkbox label {
	padding: 0;
}

.form-note {
	display: block;
	padding: 8px 0 0;
	font-size: 11px;
	color: #7a7a7a;
}

.required-fields{
	font-size: 11px;
	color: #b5121b;
}

.account-box .btn {
	margin: 10px 0 0;
}

.account-box .uppercase_text {
	max-width: 150px;
}

.newacc-del .select_input,
.newacc-bil .select_input {
	max-width: 300px;
}

.newacc > .btn,
#save {
	width: 100%;
	max-width: 320px;
	padding: 8px;
	float: right;
	font-size: 18px;
}

#logout {
	float: left;
}





/*================================
======== FORGOT PASSWORD =========
================================*/

#sendpass {
	margin: 0 0 0 145px;
}

.pass-msg {
	margin: 15px 0 30px;
}





/*================================
========= ORDER HISTORY ==========
================================*/

.order-history {
	width: 100%;
	margin: 0 0 30px;
}





/*================================
========== ORDER INFO ============
================================*/

.order-address {
	margin: 0 0 30px;
	overflow: hidden;
}

.oa-del,
.oa-bil {
	width: 50%;
	float: left;
}

.oa-del {
	padding: 0 20px 0 0;
}

.order-sub {
	text-align: right;
}

.order-total {
	float: right;
}





/*================================
======== ORDER TRACKING ==========
================================*/

.tracked-order {
	width: 100%;
	max-width: 800px;
	margin: 30px 0;
}

.tracked-qty {
	width: 95px;
	text-align: center;
}

.tracked-date {
	text-align: right;
}

.track-again {
	margin: 30px 0 0;
	float: left;
}





/*================================
========= NSLTR ARCHIVE ==========
================================*/

.nsltr-archive li {
	width: 50%;
	margin: 0 0 10px;
	float: left;
	list-style: none;
}





/*================================
============ SITEMAP =============
================================*/

.sitemap-left,
.sitemap-right {
	width: 50%;
	max-width: 450px;
	padding: 0 15px;
	float: left;
}

.sitemap-right {
	padding-right: 0;
}

.shop-sitemap .sitemap-cat {
	margin: 15px 0 0;
}

.shop-sitemap h2 {
	margin: 30px 0 0;
}






/*================================
=========== 404 PAGE =============
================================*/

.text-404 {
	margin: 0 0 30px;
}

.prodlist-404 {
	background: #eee;
	padding: 60px;
}





/*================================
============ OVERLAY =============
================================*/

#olay {
	display: none;
}

#olay_back, .popup_back {
	background: #000;
	position: fixed;
	top: 0; bottom: 0; left: 0; right: 0;
	z-index: 10000;
	filter: alpha(opacity=70);
	opacity: .7;
	width: 100%;
}

#olay_box_container, .popup_back_container {
	width: 95%;
	max-width: 720px;
	position: fixed;
	top: 10%; left: 50%;
	z-index: 10010;
}

.popup_back_container {
	top: 50%;
}

#olay_box, .popup_box {
	background: #fff;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	width: 100%;
	min-width: 320px;
	padding: 30px;
	margin: 0 0 0 -50%;
	border-radius: 2px;
    -webkit-box-shadow: 0px 0px 12px #333; /* Saf3.0+, Chrome */
    box-shadow: 0px 0px 12px #333; /* Opera 10.5, IE 9.0 */
}

.popup_box {
	transform: translate(-50%, -50%);
	margin: 0;
}

#olay_close,
#search_results_close {
	background:url(/images/style/roof/cart-remove.jpg) no-repeat;
	width:26px;
	height:25px;
	float: right;
	cursor: pointer;
}

.popup_close {
	width: 30px;
	height: 30px;
	padding: 0;
	position: absolute;
	top: 30px; right: 30px;
	font-size: 21px;
	line-height: 30px;
}

.popup_content {
	text-align: center;
	font-size: 18px;
}

.popup_content p {
	line-height: normal;
}

.autobasket .cart-row-qty {
	border-right: 2px solid #ebebeb;
}

.autobasket .btn-basket {
	display: block;
	max-width: 320px;
	margin: 20px auto 0;
}





/*================================
========= COOKIE NOTICE ==========
================================*/

.cookie_note_bkg {
	background: url(/images/style/roof/cookie_olay.png);
	position: fixed;
	top: 0;
	width: 100%;
	left: 0;
	height: 45px;
	color: #FFF;
	text-align: center;
	font-size: 14px;
	line-height: 45px;
	z-index: 10000
}

.cookie_note_button {
}

/*Videos Page*/

.guide{
	width: 100%;
	padding: 0 20px 20px 0;
	float: none;	
}

.guides-section {
	padding: 20px 25px 10px;
	margin:0;
}
.guides-section {
	padding: 0;
	margin: 0;
}
.cms-content-block{
	border:none;	
}

.guide-desc{
	font-size:13px;
	font-family:"Open Sans";
	color:#878787;
	padding-top: 30px;
}

.video-page-navtrail{
	width: 100%;
	background-color:#ebebeb;
	padding: 17px 24px 14px 24px;
	margin-bottom: 35px;	
}

.navtrail_current, .video-page-navtrail a{
	text-transform: uppercase;	
}

.navtrail_current{
	font-weight: bold;	
}

.nav-arrow{
	background:url("/images/style/consumer/video-nav-arrow.png");	
	height: 7px;width: 7px;
	display: inline-block;
	margin: 0 1px;
}

#guide-split-col .guide-video{
	width:50%;
	float:left;
}

#guide-split-col .guide-desc{
	width:47%;	
	float:right;
	padding-top:0;
}


.sticky-popup {
	position: fixed;
	bottom: 30px;left: 30px;
	width: 254px;
	color: #fff;
	z-index: 100;
}

.sticky-popup--upper {
	background-color: #4b8acf;
	padding: 8px 10px 8px 12px;
	position: relative;
}

.stick-popup--main {
	line-height: 1.5;
}

.sticky-title {
	padding: 0 10px 0 28px;
	position: relative;
	font-size: 11px;
	font-weight: 700;
	line-height: 16px;
}

.sticky-title::after {
	content: '';
	position: absolute;
	top: -1px;left: 0;
	width: 18px; height: 18px;
	background: url('data:image/svg+xml,<svg width="16" height="18" viewBox="0 0 16 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 0C3.63834 0 0.0898438 3.5485 0.0898438 7.91016C0.0898438 8.39352 0.0898438 12.1327 0.0898438 12.1992C0.0898438 13.0716 0.799543 13.7812 1.67188 13.7812H2.28992C2.50761 14.395 3.09377 14.8359 3.78125 14.8359C4.65358 14.8359 5.36328 14.1262 5.36328 13.2539V8.96484C5.36328 8.09251 4.65358 7.38281 3.78125 7.38281C3.09377 7.38281 2.50761 7.82374 2.28992 8.4375H1.67188C1.48699 8.4375 1.30959 8.46967 1.14453 8.5282V7.91016C1.14453 4.13005 4.21989 1.05469 8 1.05469C11.7801 1.05469 14.8555 4.13005 14.8555 7.91016V8.5282C14.6904 8.46967 14.513 8.4375 14.3281 8.4375H13.7101C13.4924 7.82374 12.9062 7.38281 12.2188 7.38281C11.3464 7.38281 10.6367 8.09251 10.6367 8.96484V13.2539C10.6367 14.1262 11.3464 14.8359 12.2188 14.8359C12.3784 14.8359 12.5325 14.812 12.6779 14.7678C12.4807 15.4168 11.8767 15.8906 11.1641 15.8906H9.49133C9.27364 15.2769 8.68748 14.8359 8 14.8359C7.12767 14.8359 6.41797 15.5456 6.41797 16.418C6.41797 17.2903 7.12767 18 8 18C8.68748 18 9.27364 17.5591 9.49133 16.9453H11.1641C12.6179 16.9453 13.8008 15.7625 13.8008 14.3086V13.7812H14.3281C15.2005 13.7812 15.9102 13.0716 15.9102 12.1992C15.9102 12.1337 15.9102 8.39313 15.9102 7.91016C15.9102 3.5485 12.3617 0 8 0ZM3.25391 8.96484C3.25391 8.67407 3.49047 8.4375 3.78125 8.4375C4.07203 8.4375 4.30859 8.67407 4.30859 8.96484V13.2539C4.30859 13.5447 4.07203 13.7812 3.78125 13.7812C3.49047 13.7812 3.25391 13.5447 3.25391 13.2539V8.96484ZM1.67188 9.49219H2.19922V12.7266H1.67188C1.3811 12.7266 1.14453 12.49 1.14453 12.1992V10.0195C1.14453 9.72875 1.3811 9.49219 1.67188 9.49219ZM8 16.9453C7.70922 16.9453 7.47266 16.7087 7.47266 16.418C7.47266 16.1272 7.70922 15.8906 8 15.8906C8.29078 15.8906 8.52734 16.1272 8.52734 16.418C8.52734 16.7087 8.29078 16.9453 8 16.9453ZM12.7461 13.2539C12.7461 13.5447 12.5095 13.7812 12.2188 13.7812C11.928 13.7812 11.6914 13.5447 11.6914 13.2539V8.96484C11.6914 8.67407 11.928 8.4375 12.2188 8.4375C12.5095 8.4375 12.7461 8.67407 12.7461 8.96484V13.2539ZM14.8555 12.1992C14.8555 12.49 14.6189 12.7266 14.3281 12.7266H13.8008V9.49219H14.3281C14.6189 9.49219 14.8555 9.72875 14.8555 10.0195V12.1992Z" fill="white" style="fill:white;fill-opacity:1;"></path></svg>') no-repeat center center / contain;
}

.sticky-close {
	position: absolute; 
	top: 0;right: 0;bottom: 0;
	width: 24px;
	cursor: pointer;
	z-index: 1;
}

.sticky-close::after {
	content: '';
	position: absolute;
	top: 50%;left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 8px;height: 8px;
	background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none"><g clip-path="url(%23clip0_1_69)"><path d="M10 1.65728L8.34272 0L5.00001 3.34271L1.65728 0L0 1.65728L3.34273 4.99999L0 8.34272L1.65728 10L5.00001 6.65729L8.34272 10L10 8.34272L6.65727 4.99999L10 1.65728Z" fill="white" style="fill:white;fill-opacity:1;"></path></g><defs><clipPath id="clip0_1_69"><rect width="10" height="10" fill="white" style="fill:white;fill-opacity:1;"></rect></clipPath></defs></svg>') no-repeat center center / contain;
}

.stick-popup--main {
	background-color: #4c4c4c;
	padding: 8px 10px;
	font-size: 11px;
}

/*================================
========= MEDIA QUERIES ==========
================================*/

@media (max-width: 1299px) {
	
	.logo {
		width: 320px;
	}
	
	.header-cart span span,
	.review-rating {
		display: none;
	}
	
	.review-select {
		display: block;
	}
	
	header .search-form {
		margin-right: 40px;
	}
	
	.header-cart-cont {
		width: 28%;
	}
	
	.footer-bottom-reviews{
		margin:5px 0 25px 0;
	}
	
	.footer-payment {
		margin: 15px 0 0;
	}
	
	.home-services,
	.home-guides {
		width: 50%;
	}
	
	.home-minicontent {
		width: 100%;
		margin: 0;
	}
	
	.home-minicontent .hfs-content {
		max-width: 700px;
		margin: 0 auto;
	}
	
	.hfs-content-inner {
		min-height: 0;
	}
	
	.prod-info .dblc {
		width: auto;
		text-align: left;
	}
	
	.prod-info .dblc:first-child {
		display: table-footer-group;
	}
	
	.prod_properties,
	.prod_price {
		margin: 5px 0 0;
	}
	
	.prod_rating img {
		margin: 0 2px .25em 0;
	}
	
	.prod_stock {
		margin: 3px 0 0;
	}
	
	#related .prod-grid {
		width: 50%;
	}
	
	#related .prod-info .dblc:first-child {
		display: table-cell;
	}
	
	#related .prod-info .dblc {
		width: 100px;
		text-align: right;
	}
	
	#related .prod_properties,
	#related .prod_price,
	#related .prod_stock {
		margin: 0;
	}
	
	#related .prod_rating img {
		margin: 0 0 .25em 2px;
	}
	
	#video-guide .btn-play {
		background-size: 22px 26px;
		width: 76px;
		padding: 76px 0 0;
		margin: -38px 0 0 -38px;
	}
	
	#reviews .form-left,
	#reviews .form-right {
		width: 100%;
	}
	
	#reviews .form-right {
		margin: 10px 0 0;
	}
	
	.bs-content {
		margin-left: 40px;
	}
	
	.footer-bottom {
		padding: 35px 0;
	}
	
	.footer-bottom .container{
		width:100%;
		padding: 0 40px;
	}
	
	.fb-social {
		float: none;
		margin: 0 0 25px;
		text-align: center;
	}
	
	.fb-social span {
		font-size: 21px;
	}
	
	.fb-social a {
		margin: 0 10px;
		float: none;
	}
	
	.fb-social img {
		width: 54px;
	}
	
	.footer-bottom-reviews{
		margin:5px 0 25px 0;
	}
	
	.fb-main {
		width:100%;
		display: table;
		font-size: 13px;
		line-height: 21px;
		text-align: center;
	}
	
	.footer-payment {
		display: table-caption;
		width: auto;
		margin: 0 0 15px;
	}
	
	.footer-copy {
		margin: 0 0 15px;
	}
	
	.footer-links {
		display: table-footer-group;
	}
	
	.footer-links > span:last-of-type {
		display: block;
		margin: 15px 0 0;
	}
	
}

@media (max-width: 1149px) {
	
	.header-links,
	.footer-cs {
		display: none;
	}
	
	header .search-form {
		width: 55%;
		margin-right: 0;
	}
	
	.footer-menu,
	.nsltr,
	.prod-grid,
	.news-item {
		width: 50%;
	}
	
	.prod-info .dblc:first-child {
		display: table-cell;
	}
	
	.prod-info .dblc {
		width: 100px;
		text-align: right;
	}
	
	.prod_properties,
	.prod_price,
	.prod_stock {
		margin: 0;
	}
	
	.prod_rating img {
		margin: 0 0 .25em 2px;
	}
	
	#related .prod-info .dblc {
		width: auto;
		text-align: left;
	}
	
	#related .prod-info .dblc:first-child {
		display: table-footer-group;
		text-align: left;
	}
	
	#related .prod_properties,
	#related .prod_price {
		margin: 5px 0 0;
	}
	
	#related .prod_rating img {
		margin: 0 2px .25em 0;
	}
	
	#related .prod_stock {
		margin: 3px 0 0;
	}
	
	.page-box {
		width: 25%;
	}
	
	.page-name {
		font-size: 16px;
	}
	
}

@media (max-width: 1099px) {
	.header-top .container{
		width:100%;	
	}
	.ht-acc{
		border-right:none;
	}	
	.ht-tel{
		border-left:none;	
	}
	.mn-home,
	.client:last-child {
		display: none;
	}
	
	.header-cart-cont {
		width: auto;
	}
	
	.client:first-child {
		width: auto;
		text-align: center;
	}
	
	.guide-slider .guide-title {
		line-height: 104px;
	}
	
	.guide {
		width: 100%;
	}
	
	.guide-inner {
		padding: 0 0 56.25%;
	}
	
	.cart-row-remove {
		width: 130px;
		text-align: right;
	}

	.sticky-popup {
		bottom: 45px;
	}
	
}

@media (max-width: 1023px) {
	
	header .search-form,
	.main-nav,
	.client:nth-child(5),
	.ha-right,
	.ha-page-list ul,
	.cat-menu > ul,
	.cms-cat-menu > ul,
	.page-list ul,
	.sidebar-links,
	.listing-links,
	.services-images {
		display: none;
	}
	
	.mm-toggle,
	.mbl-cart,
	.ha-page-list .cm-title,
	.page-list .cm-title,
	.cat-menu a,
	.cms-cat-menu a {
		display: block;
	}
	
	.ha-left,
	.listing-right,
	.cart-base,
	.home-content,
	.home-news,
	.services-text {
		width: 100%;
	}
	
	.cms-page,
	.shop-page {
		margin: 0;
		float: none;
	}
	
	.cms-page-inner,
	.shop-page-inner {
		margin: 0;
	}
	
	.page-content {
		padding: 35px 0;
	}
	
	.header-banner {
		height: 180px;
		line-height: 180px;
	}
	
	.page-title h1,
	.page-title span:first-child,
	.newacc-title {
		font-size: 42px;
		line-height: 44px;
	}
	
	.container .logo {
		margin: 0 auto;
		float: none;
	}
	
	.client {
		width: 25%;
	}
	
	.fb-social {
		margin: 0 0 20px;
		float: none;
		text-align: center;
	}
	
	.fb-social a {
		margin: 0 5px;
		float: none;
	}
	
	.sidebar {
		width: 100%;
		margin: 0 0 30px;
		float: none;
	}
	
	.ha-page-list {
		border-radius: 2px;
		overflow: hidden;
	}
	
	.ha-page-list a {
		border-radius: 0;
	}
	
	.cat-menu {
		margin: 0;
	}
	
	.cms-cat-menu {
		margin: 10px 0 0;
	}
	
	.cm-title {
		cursor: pointer;
	}
	
	.cm-title span {
		background: url(/images/style/roof/arrow-down-white.png) right center no-repeat;
	}
	
	.cm-title.open span {
		background-image: url(/images/style/roof/arrow-up-white.png);
	}
	
	.home-sp {
		padding: 20px 0;
	}
	
	.home-sp .hsp {
		width: 50%;
		margin: 5px 0;
	}
	
	.hsp:not(:first-child),
	.hsp:not(:last-child) {
		padding: 0;
	}
	
	.home-main {
		padding: 50px 0;
	}
	
	.home-quote {
		margin: 0 0 40px;
	}
	
	.rs-right .btn,
	.home-content .btn,
	.home-news .btn {
		font-size: 14px;
	}
	
	.home-news {
		margin: 20px 0 0;
	}
	
	.hn-date {
		font-size: 12px;
	}
	
	.guide {
		width: 50%;
	}
	
	.guide-inner {
		padding: 0 0 75.32%;
	}
	
	.about-lower .dblc:first-child {
		font-size: 28px;
	}
	
	.about-lower .dblc:first-child p {
		line-height: 32px;
	}
	
	.cat-menu a,
	.cms-cat-menu a,
	.filter-title {
		font-size: 16px;
	}
	
	.cat-menu > ul ul a,
	.filter a,
	.results-sort-by .select_input {
		font-size: 14px;
	}
	
	.category-slider {
		margin: 0 0 30px;
	}
	
	.prod-grid {
		width: 33.33333%;
	}
	
	.listing-left {
		margin: 30px 0 0;
	}
	
	.listing-left-inner {
		margin: 0;
	}
	
	#listing_image {
		margin: 0 0 25px;
	}
	
	#listing_img {
		border: none;
	}
	
	#related .prod-grid {
		width: 25%;
	}
	
	.cart-banner {
		height: auto;
		line-height: normal;
	}
	
	.cart-banner h1 {
		float: none;
		text-align: center;
	}
	
	.cart-banner .chkout-stage {
		width: 100%;
		margin: 20px 0 10px;
		text-align: center;
	}
	
	.stage {
		float: none;
	}
	
	.cart-row-remove {
		width: 95px;
	}
	
	.cart-row-price {
		width: 1px;
	}
	
	tbody .cart-row-price {
		padding-left: 20px;
	}
	
	.cart-base .btn {
		margin: 0 20px 0 0;
	}
	
	.page-box,
	.news-item {
		width: 33.3333333%;
	}
	
	
	#guide-split-col .guide-video{
		width:100%;
		float:none;
	}
	
	#guide-split-col .guide-desc{
		width:100%;	
		float:none;
		padding-top:30px;
	}
	
}

@media (max-width: 899px) {
	
	.ht-nav{
		display:none;	
	}
	.ht-tel,
	.ht-acc{
		border:none;	
	}
	.cart-related {
		float: right;
	}
	
	.cart-points,
	.cart-options {
		max-width: 405px;
	}
	
}

@media(max-width:800px){

	.cookie-bar {
		flex-direction: column;
		align-items: flex-start!important;
	}
	.cookie-bar--text {
		margin-right: 0!important;
		margin-bottom: 20px;
	}
}

@media (max-width: 767px) {
	
	.fn-inner,
	.client:nth-child(4),
	.footer-links > span:last-of-type span,
	.guide .guide-title,
	.order-no,
	.order-ref,
	.order-price,
	.selected-filters,
	.category-slider,
	.cart-row-image,
	.cart-row-qty .full-name,
	.chkout-tel,
	.navtrail {
		display: none;
	}
	
	.footer-cs,
	.fn-header,
	.footer-nav a,
	.mbl-guide-title,
	.cart-row-qty .short-name {
		display: block;
	}
	
	.footer-nav,
	.nsltr,
	.banner-slider .container,
	.cart-base-total,
	.details-large,
	.address-column,
	#logout,
	.review-form .btn,
	.chkout-btns .btn:first-child,
	.chkout-btns #pay,
	.confirm-details,
	.confirm-order,
	.sitemap-left,
	.sitemap-right,
	.home-services,
	.home-guides,
	.about-half,
	.nsltr-archive li {
		width: 100%;
	}
	
	.page-title h1,
	.page-title span:first-child,
	.newacc-title {
		font-size: 36px;
		line-height: 38px;
	}
	
	.sub-title {
		font-size: 18px;
		line-height: 21px;
	}
	
	.cms-content img {
		display: block;
		margin: 20px auto;
		float: none;
	}
	
	.slick-next,
	.slick-prev {
		width: 38px;
		padding: 34px 0 0;
	}
	
	.client {
		width: 33%;
		padding: 0 10px;
	}
	
	.footer-main {
		padding: 50px 0;
	}
	
	.footer-nav {
		background-color: #4c4c4c;
	}
	
	.footer-menu {
		margin: 0 0 5px;
	}
	
	.footer-cs {
		margin: 0 0 30px;
	}
	
	.fn-inner {
		padding: 0 20px 15px;
	}
	
	.footer-nav .lvl1-container {
		width: 100%;
	}
	
	.footer-nav .footer-item-lvl1,
	.footer-nav .footer-item-lvl1:first-child {
		margin: 5px 0 0;
	}
	
	.footer-nav a {
		padding: 3px 0;
		font-size: 16px;
		color: #fff;
	}
	
	.footer-menu a:hover {
		color: #fff;
	}
	
	.footer-agent {
		display: block;
		max-width: 290px;
		margin: 0 auto;
		float: none;
	}
	
	.footer-bottom {
		padding: 40px 0;
	}
	
	.footer-bottom .container {
		display: table;
	}
	
	.fb-social {
		margin: 0 0 25px;
		text-align: center;
	}
	
	.fb-social span {
		font-size: 21px;
	}
	
	.fb-social a {
		margin: 0 10px;
	}
	
	.fb-social img {
		width: 54px;
	}
	
	.fb-main {
		font-size: 13px;
		line-height: 21px;
		text-align: center;
	}
	
	.footer-payment {
		display: table-caption;
		width: auto;
		margin: 0 0 25px;
		float: none;
		text-align: center;
	}
	
	.footer-copy {
		margin: 0 0 25px;
	}
	
	.footer-links > span:last-of-type {
		display: block;
		margin: 20px 0 0;
	}
	
	.loading .banner-slider-cont {
		height: 0;
		padding: 0 0 62.6666666%;
	}
	
	.banner-slider .slick-slide {
		padding: 0;
	}
	
	.hs-name {
		font-size: 18px;
		line-height: 18px;
	}
	
	.home-guides {
		margin: 0;
	}
	
	.gt-inner {
		height: auto;
		padding: 0;
		text-align: center;
	}
	
	.review-slide {
		padding: 50px 0;
	}
	
	.rs-left {
		margin: 0 auto 20px;
		float: none;
	}
	
	.rs-right {
		text-align: center;
	}
	
	.rs-comment,
	.article-title {
		font-size: 21px;
	}
	
	.rs-comment p {
		line-height: 26px;
	}
	
	.rs-title {
		font-size: 15px;
	}
	
	.review-slider .slick-next,
	.review-slider .slick-prev {
		margin: 0;
		top: 105px;
	}
	
	.contact-page-inner {
		border: none;
	}
	
	.contact-left,
	.contact-right {
		width: 100%;
		padding: 0;
	}
	
	.contact-left {
		margin: 0 0 25px;
	}
	
	.contact-info .dblc {
		width: 50%;
	}
	
	.contact-form-cont {
		border-radius: 0;
		margin: 0;
	}
	
	.contact-submit {
		font-size: 15px;
	}
	
	.pack-form .dd-text {
		padding-right: 0;
	}
	
	.pack-table {
		max-width: none;
	}
	
	.pack-table .btn {
		display: block;
		margin: 15px auto 0;
		float: none;
	}
	
	.fb-item {
		text-align: center;
	}
	
	.fb-item-img .fb-text,
	.fb-item-img img {
		width: auto;
		float: none;
	}
	
	.fb-item-img img {
		padding: 0 25px 20px;
	}
	
	.guide {
		width: 100%;
	}
	
	.guide-inner {
		padding: 0 0 56.25%;
	}
	
	.about-half {
		margin: 30px 0 0;
	}
	
	.about-half:first-child {
		margin: 0;
	}
	
	.team-members {
		padding: 50px 0;
	}
	
	.team-members h2 {
		margin: 0 0 35px;
	}
	
	.about-lower .dblc {
		display: block;
		text-align: center;
	}
	
	.about-lower .dblc:first-child {
		width: 100%;
	}
	
	.about-lower .dblc:first-child {
		font-size: 24px;
	}
	
	.about-lower .dblc:first-child p {
		line-height: 28px;
	}
	
	.about-lower .dblc:last-child {
		text-align: center;
	}
	
	.about-lower .dblc:last-child img {
		width: 100%;
		max-width: 450px;
	}
	
	.page-box {
		width: 50%;
	}
	
	.prod-grid,
	#related .prod-grid {
		width: 50%;
	}
	
	#related .prod-info .dblc:first-child {
		display: table-cell;
	}
	
	#related .prod-info .dblc {
		width: 100px;
		text-align: right;
	}
	
	#related .prod_properties,
	#related .prod_price,
	#related .prod_stock {
		margin: 0;
	}
	
	#related .prod_rating img {
		margin: 0 0 .25em 2px;
	}
	
	.mbl-back {
		display: inline-block;
	}
	
	.video-text {
		background-color: #4c4c4c;
		position: static;
	}
	
	.review-form .btn {
		margin: 0 0 10px;
	}
	
	.cart-banner .chkout-stage {
		font-size: 15px;
	}
	
	.stage,
	.cart-banner .stage {
		padding: 0 0 0 35px;
	}
	
	.stage::before,
	.cart-banner .stage::before {
		left: 12px;
	}
	
	tbody .cart-row-title {
		padding: 5px;
		border-left: 2px solid #eee;
	}
	
	.cart-row-qty {
		width: 67px;
		text-align: center;
	}
	
	.autobasket .cart-row-qty {
		width: 75px;
	}
	
	.cart-row-qty .text_input {
		width: 40px;
		margin: 0 0 0 5px;
	}
	
	.cart-row-remove {
		width: 45px;
		text-align: center;
	}
	
	.remove {
		width: 15px;
	}
	
	.cart-base .btn {
		margin-bottom: 15px;
	}
	
	.cart-base-total {
		float: none;
		clear: both;
	}
	
	.chkout-container .logo {
		margin: 0 auto;
		float: none;
	}
	
	.chkout-header h1,
	.chkout-stage {
		float: none;
		text-align: center;
	}
	
	.chkout-stage {
		margin: 20px 0 0;
	}
	
	.contact-details .custom-row {
		margin-top: 0;
	}
	
	.details-small {
		width: 25%;
	}
	
	.details-med {
		width: 50%;
	}
	
	.details-med,
	.details-large {
		margin-top: 15px;
	}
	
	.contact-details .custom-row:first-child .details-large:nth-child(2) {
		margin-top: 0;
		width: 75%;
	}
	
	.chkout-btns .btn:first-child {
		display: block;
		margin: 0 0 10px;
		float: none;		
		font-size: 18px;
	}
	
	.confirm-order {
		margin: 30px 0 0;
	}
	
	.autobasket .btn {
		max-width: none;
	}
	
	.account-box,
	.trade-left,
	.trade-right {
		width: 100%;
	}
	
	.trade-right {
		margin: 10px 0 0;
	}
	
	.newacc > .btn,
	#save {
		max-width: none;
	}
	
	#logout {
		padding: 8px;
		margin: 5px 0 0;
		font-size: 18px;
	}
	
	.ec-left {
		width: 45%;
	}
	
	.cms-content .news-image {
		width: auto;
		margin: 0 auto 25px;
	}
	
	.news-item {
		width: 50%;
	}
	
	.banner-slider .container {
		line-height: 350px;
	}
	
	.bs-title {
		margin: 0 0 10px;
		font-size: 26px;
		line-height: 24px;
	}
	
	.bs-text {
		margin: 0 0 15px;
		font-size: 14px;
		line-height: 16px;
		font-weight: 600;
	}
	
	.btn-quote {
		width: 100%;
		float:none;
		max-width:initial;
	}
	
	.btn-quote:first-of-type {
		float:none;
	}
	
	.btn-page:first-of-type{
		margin:0 0 16px 0;
	}
	
}

@media (max-width: 600px) {
	
	.cl-item {
		width: 50%;
	}
	
	#h1-small{
		font-size:28px;	
		line-height:34px;
	}
	
	.content-btn{
		margin:0 auto 10px auto;
		float:none;
	}

	.footer-bottom .container {
		padding: 0 15px;
	}
}

@media (max-width: 549px) {
	
	.cart-row-remove {
		display: none;
	}
	
	.prod-info .dblc,
	#related .prod-info .dblc {
		width: auto;
		text-align: left;
	}
	
	.prod-info .dblc:first-child,
	#related .prod-info .dblc:first-child {
		display: table-footer-group;
	}
	
	.prod_properties,
	.prod_price,
	#related .prod_properties,
	#related .prod_price {
		margin: 5px 0 0;
	}
	
	.prod_rating img,
	#related .prod_rating img {
		margin: 0 2px .25em 0;
	}
	
	.prod_stock,
	#related .prod_stock {
		margin: 3px 0 0;
	}
	
	.video-text .btn {
		margin: 15px 0 0;
		float: left;
		clear: left;
	}
	
	.chkout-stage,
	.cart-banner .chkout-stage {
		font-size: 13px;
	}
	
	.cart-points,
	.cart-related,
	.cart-options {
		max-width: none;
	}
	
	.banner-slider {
		text-align: center;
	}
	
	.bs-content {
		margin: -30px 0 0;
	}
	
}

@media (max-width: 479px) {
	
	.ht-acc,
	.footer-links > span:first-of-type span,
	.pack-stage-title::before,
	.order-status,
	.chkout-stage {
		display: none;
	}
	
	.footer-links > span:first-of-type,
	.ec-left,
	.ec-right,
	.account-tabs a span {
		display: block;
	}
	
	.ha-page-box,
	.page-box,
	.ec-left,
	.ec-right,
	.oa-del,
	.oa-bil,
	.details-med,
	.confirm-cart-shipping,
	.confirm-cart-total,
	.hs-item,
	.news-item {
		width: 100%;
	}
	
	.header-top{
		text-align:center;
	}
	
	.ht-tel{
		float:none;
		font-size:15px;
	}
	
	.logo {
		width: 175px;
	}
	
	.mm-toggle,
	.mbl-cart {
		margin: 5px 0 0;
	}
	
	.page-slide.mm-open {
		-webkit-transform: translateX(84.2%);
		transform: translateX(84.2%);
	}
	
	.mbl-menu {
		width: 84.2%;
		left: -84.2%;
	}
	
	.mm-acc {
		font-size: 16px;
	}
	
	.mbl-menu .search-input {
		height: 44px;
		font-size: 18px;
		line-height: 44px;
	}
	
	.mbl-menu .search-submit {
		background-size: 21px auto;
		width: 44px;
		padding: 44px 0 0;
	}
	
	.mm-main > ul > li > a,
	.mm-tel,
	.fn-header {
		font-size: 18px;
	}
	
	.mm-main-cont > a > span {
		background-size: 16px auto;
	}
	
	.mm-main-cont > ul > li > a,
	.nsltr > span {
		font-size: 16px;
	}
	
	.mm-main-cont > ul > li > ul,
	.nsltr .btn {
		font-size: 13px;
	}
	
	.mm-nav a,
	.footer-nav a {
		font-size: 14px;
	}
	
	.fb-social a {
		margin: 0 5px;
	}
	
	.hs-item a {
		padding: 45% 0 0;
	}
	
	.home-sp .hsp {
		width: 100%;
	}
	
	.hn-img {
		display: block;
		padding: 0 0 45%;
		position: relative;
	}
	
	.hn-img::before,
	.hn-img::after {
		width: auto;
		top: auto; left: 0;
	}
	
	.hn-img::before {
		height: 10px;
	}
	
	.hn-img::after {
		height: 5px;
	}
	
	.hn-text {
		width: 100%;
		float: none;
	}
	
	.pack-select {
		padding: 25px 20px 5px;
	}
	
	.mbl-guide-title {
		font-size: 14px;
	}
	
	.delivery-footer {
		font-size: 16px;
	}
	
	.delivery-footer p {
		line-height: 21px;
	}
	
	.about-intro-cont {
		margin: 35px 0 0;
	}
	
	.about-intro {
		padding: 25px 30px 30px;
		font-size: 13px;
	}
	
	.about-intro p {
		line-height: 18px;
	}
	
	.page-image {
		padding: 0 0 50%;
	}
	
	.results-sort-by {
		width: 100%;
		margin: 0;
	}
	
	.prod-grid,
	#related .prod-grid {
		width: 100%;
	}
	
	.prod-info .dblc:first-child,
	#related .prod-info .dblc:first-child {
		display: table-cell;
	}
	
	.prod-info .dblc,
	#related .prod-info .dblc {
		text-align: right;
	}
	
	.prod_properties,
	.prod_price,
	.prod_stock,
	#related .prod_properties,
	#related .prod_price,
	#related .prod_stock {
		margin: 0;
	}
	
	.prod_rating img,
	#related .prod_rating img {
		margin: 0 0 .25em 2px;
	}
	
	.prod_price_web {
		font-size: 24px;
		line-height: 21px;
	}
	
	#listing_offer_overlay {
		width: 64px;
	}
	
	.listing-content {
		padding: 25px 20px;
	}
	
	.review-form .btn {
		margin: 0 0 15px;
		float: none;
		font-size: 13px;
	}
	
	.ec-left {
		padding: 0;
	}
	
	.ec-right {
		margin: 15px 0 0;
	}
	
	.oa-bil {
		margin: 20px 0 0;
	}
	
	.account-box {
		padding: 20px;
	}
	
	.fl-left {
		width: 110px;
	}
	
	#sendpass {
		margin: 0 0 0 110px;
	}
	
	#h1-small{
		font-size:20px;	
		line-height:26px;
	}
	
	.sub-title{
		font-size:14px;	
	}
}
@media(max-width:450px){
	.show-pref .cookie-pref-overlay {
		margin-left: 0!important;
		left: 0!important;
		width: 100%!important;
		padding: 25px!important;
		font-size: 14px!important;
	}
	.cookie-bar {
		padding: 20px!important;
	}
}
.review-images {
    min-width: 420px;
	margin: 0 -40px -40px 0;
}
.review-images > div {
	display: flex;
	padding: 0 40px 40px 0;
}



/*
|--------------------------------------------------------------------------
| Template > Cookie Notification
|--------------------------------------------------------------------------
*/
.cookie-pref-overlay {
    position: absolute;
    background-color: #FFF;
    width: 400px;
    left: 100%;
    height: 100%;
    transition: ease-in-out .5s;
	padding: 30px;
	font-size: 15px;
}
.cookie-pref--top {
    font-size: 18px;
    color: #222;
    margin-bottom: 15px;
}
.cookie-pref--close {
    position: relative;
    margin-left: 20px;
    margin-top: 2px;
    width: 30px;
	cursor: pointer;
}
.cookie-pref--close::before, .cookie-pref--close::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 3px;
    height: 15px;
    background-color: #222;
    border-radius: 3px;
}
.cookie-pref--close::before {
	transform: translate(-50%, -50%) rotate(-45deg);
}
.cookie-pref--close::after {
	transform: translate(-50%, -50%) rotate(45deg);
}
.cookie-pref--text {
    margin-bottom: 15px;
}
.cookie-pref--text * {
    line-height: 1.5;
}
.cookie-pref-overlay .cookie-bar--submit, .cookie-pref-save {
	width: 100%;
	margin-top: 20px;
}
.cookie-pref-overlay--actions {
    flex: 1;
}
.show-pref .cookie-pref-overlay {
    margin-left: -400px;
}
.show-pref .cookie-bar::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(0 0 0 / 65%);
}
.cookie-pref-form {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgb(0 0 0 / 65%);
    z-index: 9999999999999999;
	overflow: hidden;
}
.cookie-bar {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: #FFF;
    display: flex;
    align-items: center;
	padding: 25px 30px;
}
.cookie-bar--inner {
    position: absolute;
    max-width: 550px;
    padding: 20px !important;
    background-color: #fff;
    width: 90%;
    margin: 0 auto;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    color: #222;
	font-size: 14px;
}
.cookie-bar--text {
    flex: 1;
    margin-right: 30px;
    font-size: 14px;
}
.cookie-bar--text * {
	line-height: 1.5;
}
.cookie-bar--action {
    display: flex;
    align-items: center;
}
.show-cookie-pref, .cookie-bar--submit, .cookie-pref-save {
    text-align: center;
    cursor: pointer;
    transition: ease-in-out .2s;
    color: #FFF;
    padding: 10px 15px;
    border-radius: 4px;
    font-size: 14px;
}
.show-cookie-pref, .cookie-pref-save {
	background-color: #4b8acf;
}
.show-cookie-pref:hover, .cookie-pref-save:hover {
	background-color: #4076b2;
}
.cookie-bar--submit {
    background: #fca21a;
}
.cookie-bar--submit:hover {
    background: #db8c15;
}
.cookie-bar--action .button:not(:first-child) {
	margin-left: 10px;
}
.cookie-bar .toggle-switch {
	margin-top: -3px;
}


.toggle-switch {
	position: relative;
	display: inline-block;
	width: 50px;
    height: 25px;
	padding: 0;
}
.toggle-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.toggle-switch--slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 34px;
}
.toggle-switch--slider:before {
	position: absolute;
	content: "";
	height: 17px;
    width: 17px;
    left: 4px;
    bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 50%;
}
input:checked + .toggle-switch--slider {
	background-color: #fca21a;
}
input:focus + .toggle-switch--slider {
	box-shadow: 0 0 1px #fca21a;
}
input:checked + .toggle-switch--slider:before {
	-webkit-transform: translateX(25px);
	-ms-transform: translateX(25px);
	transform: translateX(25px);
}
.cookie-bar--pref-table {
    border: 1px solid #e0dede;
	margin-top: 30px;
	font-size: 14px;
}

.cookie-bar--table {
	display: none;
	margin-bottom: 15px;
}

.cookie-bar--table > .title {
	margin-bottom: 5px;
}

.cookie-settings {
	text-decoration: underline;
	cursor: pointer;
}


.cookie-bar--action__table {
    width: 100%;
}
.cookie-bar--action__table .title {
    font-size: 14px;
    font-weight: 600;
}
.cookie-bar--pref-table > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 10px 6px;
    height: 45px;
	line-height: 1.1;
}
.cookie-bar--pref-table > div > span {
    font-weight: 600;
    color: #fca21a;
	text-align: right;
}
.cookie-bar--pref-table > div:not(:last-child) {
	border-bottom: 1px solid #e0dede;
}

.cookie-bar--text > p {
	color: #222;
}

.cookie-bar--text > p:last-child {
	margin-bottom: 0;
}

.cookie-bar--text a {
	text-decoration: underline;
}
.cookie-bar--text a:hover {
	color: #4076b2;
}
.cookie-bar--text > .title {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fca21a;
	margin-bottom: 5px;
}

.link-ul {
    text-decoration: underline;
}