@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700');
@import url('./carousel-fade.css');

/* W3C Markup, IE10 Release Preview */ 
h1,.h1 {font-size:24px;font-weight:600;margin-bottom:30px;margin-top:0;}
h2,.h2 {font-size:20px;font-weight:400;margin-bottom:20px;margin-top:0;}
h3,.h3 {font-size:18px;font-weight:600;margin-bottom:20px;margin-top:0;}
h4,.h4 {font-size:16px;font-weight:300;margin-bottom:20px;margin-top:0;}
h4.underline {padding-bottom:5px;}
p {font-size:16px;font-weight:300;}
p.large {font-size:20px;margin-bottom:20px;}
a {color:#1D252C;transition:color 0.25s ease-in;-moz-transition:color 0.25s ease-in;-webkit-transition:color 0.25s ease-in;-o-transition:color 0.25s ease-in}
a:hover,a.active {color:#98B8AD;text-decoration: none;}
b,strong {font-weight:600;}
ul {margin:0 0 15px 15px;padding:0;font-size:16px;line-height:1.4;font-weight:300;}
img {max-width:100%;height:auto !important}

/* Bootstrap overrides */
body {font-family:'Open Sans',Arial;line-height:1.3;color:#1D252C;font-weight:400}
.nav {font-weight:400;}
.navbar {background-color:#98B8AD;font-size:12px;margin-bottom:0;z-index:9500;}
.navbar.fixed {position:fixed;top:0;left:0;right:0;}
.headerPanel.fixed {position:fixed;top:0;left:0;right:0;z-index:9999;margin-top:-90px;}
.navbar-nav > li > a {font-size:17px;color:#FFFFFF;text-transform: uppercase;padding:10px 15px;}
.navbar-nav > li > a:hover,.navbar-nav > li > a:focus,.navbar-nav > li.active > a {background-color:transparent;color:#1D252C;}
.dropdown-menu > li > a {color:#FFFFFF;text-transform: uppercase;font-size:15px;}
.navbar-toggle {border-color:#FFFFFF}
.icon-bar {background-color:#FFFFFF}
img.fullwidth {width:100% !important}

/* Layout */
.fullwidth {padding:0}
.visible-xxs {display:none;}
.top-buffer15 {padding-top:15px;}
.top-buffer30 {padding-top:30px;}
.top-buffer40 {padding-top:40px;}
.top-buffer50 {padding-top:50px;}
.top-buffer60 {padding-top:60px;}
.top-buffer70 {padding-top:70px;}
.top-buffer80 {padding-top:80px;}
.bottom-buffer3 {padding-bottom:2px;}
.bottom-buffer15 {padding-bottom:15px;}
.bottom-buffer30 {padding-bottom:30px;}
.bottom-buffer50 {padding-bottom:50px;}
.bottom-buffer70 {padding-bottom:70px;}
.text-center .img-responsive {margin:0 auto;}
.v_hidden{	opacity: 0;}
.v_visible{	opacity: 1;}
.containergutter-0.container {  padding-left: 0px;  padding-right: 0px;}
.containergutter-0.container-fluid {  padding-left: 0px;  padding-right: 0px;}
.containergutter-100.container {  padding-left: 100px;  padding-right: 100px;}
.containergutter-100.container-fluid {  padding-left: 100px;  padding-right: 100px;}
.gutter-20.row {  margin-right: -10px;  margin-left: -10px;}
.gutter-20 > [class^="col-"], .gutter-20 > [class^=" col-"] {  padding-right: 10px;  padding-left: 10px;}
.gutter-10.row {  margin-right: -5px;  margin-left: -5px;}
.gutter-10 > [class^="col-"], .gutter-10 > [class^=" col-"] {  padding-right: 5px;  padding-left: 5px;}
.gutter-0.row {  margin-right: 0;  margin-left: 0;}
.gutter-0 > [class^="col-"], .gutter-0 > [class^=" col-"]{  padding-right: 0;  padding-left: 0;}
.content-panel {padding-top:40px;padding-bottom:40px;}
.content-panel.slim {padding-top:20px;padding-bottom:20px;}

/* Format */
.copy-xsmall {font-size:10px;line-height:12px;-webkit-text-size-adjust: 100%;}
.copy-small,.copy-small p {font-size:14px;line-height:18px;}
.nomargin {margin:0}
.bg-green {background-color:#849b92;}
.underline {border-bottom:1px solid #1D252C}
.copy-green {color:#98B8AD;}
.bg-teal {background-color:#4B858E;}
.bg-blue {background-color:#244B5A;}
.bg-white {background-color:#FFFFFF;}
.bg-purple {background-color:#5B7E96}
.copy-white {color:#FFFFFF}
.btn {background-color:#244B5A;color:#FFFFFF;padding:5px 10px;font-weight:600;border:1px solid #244B5A}
.btn:hover {background-color:#FFFFFF;color:#244B5A;}
.back {font-size:17px;margin-top:30px;background-color:transparent;color:#244B5A}
.back:hover {background-color:#244B5A;color:#FFFFFF}

/* Header */
header {padding-top:20px;padding-bottom:20px; position:relative;z-index:9500;background-color:#FFFFFF;font-weight:600;}
header a{font-weight:400}
header .logo img{padding-top:10px;max-width:260px;}
.header-links {padding-top:20px;}
.header-links a {margin-right:20px;}
.header-contact {padding-top:20px;}
.header-contact span{margin-right:20px;}
.epsom {color:#244B5A}
.battersea {color:#5B7E96}
.eastsheen {color:#98B8AD}

/*Home Banner*/
.home-banner.fixed,.no-banner.fixed {margin-top:142px}
.home-banner .item {background-position:center center;background-size:cover;background-repeat:no-repeat;}
.home-banner-content {color:#FFFFFF;font-size:24px;font-weight:300;width:100%;text-align:center;}
.home-banner-content h1 {font-weight:600;margin-bottom:20px;}
.home-banner-content p {margin-bottom:20px;}
#scrollDown {position:absolute;bottom:20px;left:50%;width:38px;height:20px;margin-left:-19px;cursor:pointer;background-image:url(../images/scrollDown.png);background-size:contain;background-repeat:no-repeat;}
.carousel,.carousel-inner,.carousel .item {overflow:hidden;height:100%;width:100%;margin:0;}
.carousel-indicators {    bottom: 30px;}
.carousel-indicators li {    width: 40px;    height: 22px;    border: none;    border-radius: 0;background-color:transparent;margin:0 1px 0 0 !important;background-image:url(../images/carousel-indicator.png);margin:0 1px 0 0 !important;background-repeat:no-repeat;background-position:-40px 10px;-webkit-transition: none;     transition: none;background-repeat:no-repeat;}
.carousel-indicators li.active {    width: 40px;    height: 22px;    border: none;    border-radius: 0;background-color:transparent;background-position:0 10px;-webkit-transition: background-position 8s;     transition: background-position 8s;}
.carousel-heading {position: absolute;bottom:0;left:0;right:0}
.carousel-heading h1 {color:#FFFFFF}
.carousel-heading h1.underline {border-bottom:1px solid #FFFFFF;}
.carousel-mask {position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.2);display: flex;  align-items: center;  justify-content: center;}
.carousel-mask.slim {position: relative;padding:40px 0 20px 0;background-color:transparent}

#content {position: relative;z-index:8500}

/* News tiles */
.news-tile{padding-bottom:20px;}
.news-tile a{display:block;position:relative;padding-bottom:50px;}
.news-tile-image{width:100%;height:0;padding-bottom:60%;background-size:cover;background-position:center center}
.news-tile-info{position:absolute;left:0;bottom:0;right:0;padding:15px 35px 15px 15px;background-color:#98B8AD;color:#FFFFFF;display:flex;justify-content: center;
  flex-direction: column;
  }
.bg-green .news-tile-info{background-color:#FFFFFF;color:#1D252C;}
.news-tile a:hover .news-tile-info{background-color:#244B5A;color:#FFFFFF;}
.news-tile .title{margin-bottom:0;font-size:20px;font-weight:300}
.news-tile .date{position:absolute;bottom:15px;left:15px;font-size:14px;margin:0}
.news-tile .plus{position:absolute;top:50%;margin-top:-8px;right:15px;width:20px;height:20px;background-image:url(../images/plus-over.png)}
.bg-green .news-tile .plus{background-image:url(../images/plus.png)}
.news-tile a:hover .plus{background-image:url(../images/plus-over.png)}

/* Installation tiles */
.installations-tile{padding-bottom:20px;}
.installations-tile > div{display:block;position:relative;padding-bottom:0;}
.installations-tile-image{width:100%;height:0;padding-bottom:60%;background-size:cover;background-position:center center}
.installations-tile-info{padding:15px 35px 15px 15px;background-color:#98B8AD;color:#FFFFFF;display:flex;justify-content: top;
  flex-direction: column;
  }
.bg-green .installations-tile-info{background-color:#FFFFFF;color:#1D252C;}
.installations-tile .title{margin-bottom:10px;font-size:20px;font-weight:400}

footer {color:#FFFFFF;font-size:12px;background-color:#244B5A;padding-top:70px;padding-bottom:60px;}
footer p {font-size:14px !important}
footer a{color:#FFFFFF;}
footer .logo img{max-width:260px;}
.footer-col-1 {padding-bottom:20px;}
.footer-col-2 {padding-bottom:20px;}
.footer-col-3 {padding-bottom:20px;}
.footer-col-4 {padding-bottom:20px;}
.footer-col-4 p {font-size:12px !important}
.footer-col-4 img {padding-top:20px;}

/*Product Tiles*/
.product-cell {overflow: hidden}
.product-cell a {display:block;background-size:cover;background-position: center center;position:relative}

.product-cell1 a,.product-cell2 a,.product-cell3 a,.product-cell4 a,.product-cell5 a,.product-cell6 a,.product-cell7 a,.product-cell8 a {height:200px;margin-bottom:8px;}

.product-cell a > div {position: absolute;top:0;left:0;background-color:#5B7E96;padding:15px 45px 15px 15px;color:#FFFFFF;background-image: url(../images/plus-over.png);background-position:center right 10px;background-repeat: no-repeat;transition:height 0.4s ease-in;-moz-transition:height 0.4s ease-in;-webkit-transition:height 0.4s ease-in;-o-transition:height 0.4s ease-in;}
.product-cell a div:nth-child(2) {right:0;height:0;background-image:none;padding:0;background-color:rgba(30,30,30,0.9);overflow:hidden}
.product-cell a div:nth-child(2) div {display: block;padding:15px}
.product-cell a:hover > div:nth-child(1) {opacity:0;top:0;bottom:0;left:0;right:0;}
.product-cell a:hover > div:nth-child(2) {opacity:1;height:100%;}
.product-cell a h2 {margin-bottom:0;font-size:16px;font-weight:400}
.product-cell div > div:nth-child(2) h2 {margin-bottom:20px;}
.product-cell a p {font-size:14px;}

/* CTA */
.cta {color:#FFFFFF}

/*Grid*/
.grid-cell {display: block}
a.grid-row:hover {text-decoration: none}
.grid-row .plus {opacity: 1;transition:opacity 0.5s ease-in !important;-moz-transition:opacity 0.5s ease-in !important;-webkit-transition:opacity 0.5s ease-in !important;-o-transition:opacity 0.5s ease-in !important;width:24px;}
.grid-row:hover .plus {opacity:1;}
.grid-cell.image {background-size:cover;background-position: center center;height:0;padding-bottom:50%;position:relative;}
.grid-cell.image.auto {height:auto;padding-bottom:0;}
.grid-cell.image .image-credit {font-size:14px;color:#FFFFFF;position:absolute;bottom:15px;left:15px;font-weight:700;}
.grid-cell.text {padding-top:50px;padding-bottom:40px;text-align: center;vertical-align: middle;text-align: center;padding-left:15px;padding-right:15px;}
.grid-cell.text.left {text-align: left;}
.grid-cell.text.top {vertical-align: top;}
.grid-cell.text p {margin-bottom:15px;line-height:1.5;}
.grid-cell.text img {margin-top:15px}
.grid-cell.aqua {background-color:#4B858E;color:#FFFFFF}
.grid-cell.green {background-color:#7D9C91;color:#FFFFFF}
.grid-cell.ink {background-color:#244B5A;color:#FFFFFF}
.grid-cell.blue {background-color:#5B7E96;color:#FFFFFF}
.grid-cell.stone {background-color:#707070;color:#FFFFFF}

/*Shutter*/
.shutter-nav {padding-bottom:30px;}
.shutter-nav a{font-size:14px;color:#FFFFFF;margin-right:20px;display: inline-block}
.shutter-nav a:hover{text-decoration: none}
.shutter-nav a.active{border-bottom:1px solid #FFFFFF}
.shutter-panel {padding:30px;display:none}
.shutter-panel.active {display:block}
.shutter-panel p{font-size:16px;}
.tile-image {background-size:cover;background-position: center;width:100%;height:0;padding-bottom:100%;}

/*Contact Form*/
#contact-thanks{display:none}
input[type=text],input[type=email],textarea{width:100%;border:1px solid #244B5A;padding:10px;color:#244B5A;margin-bottom:10px;display:block;border-radius:0;}
textarea{height:100px;border-radius:0;}
input[type=submit]{border:1px solid #244B5A;padding:8px 20px;background-color:#244B5A;transition:background-color 0.5s ease-in !important;-moz-transition:background-color 0.5s ease-in !important;-webkit-transition:background-color 0.5s ease-in !important;-o-transition:background-color 0.5s ease-in !important;font-weight:400;font-size:18px;font-weight:600;border-radius:6px;color:#FFFFFF;margin-top:20px;}
input[type=submit]:hover{color:#244B5A;background-color:#FFFFFF}
.styled-select {border:1px solid #244B5A;display:inline-block;width:100%;overflow: hidden;background-image:url(../images/select.png);background-repeat: no-repeat;background-position: right 10px center;cursor: pointer;background-color:#FFFFFF;height:40px;vertical-align: middle;margin-bottom: 10px;}
.styled-select select {border:none;background:none;font-size:14px;height:40px;line-height:40px;padding:0 10px;width:calc(100% + 30px);display:inline-block;border-radius: 0;color:#244B5A;-webkit-appearance:none;}
::placeholder {     color: #244B5A;    opacity: 1;}
:-ms-input-placeholder {    color: #244B5A;}
::-ms-input-placeholder {    color: #244B5A;}

/*Branch details*/
.branch {background-color: #FFFFFF;position:relative}
.branch-details {padding:30px 30px 15px 30px;}
.branch-details p {line-height:1.5;margin-bottom:20px;font-size:16px;}
.branch-details .col-xs-6 p {line-height:1.5;margin-bottom:20px;font-size:16px;white-space: nowrap !important;}
.map {height:350px;}

/*News article*/
.news-article h1 {color:#244B5A;font-size:20px;}
.news-article h2 {color:#244B5A;margin-top:30px;font-size:18px;}
.news-article .featured {width:100%}
.news-article-nav p{font-weight: 400}
.news-nav {line-height:1;color:#FFFFFF;font-weight:400;}
.news-nav a{color:#FFFFFF;padding-top:16px;padding-bottom:16px;display: inline-block}

/* Accordion */
panel{background-color:transparent;border:none;box-shadow:none;}
.panel-group .panel {border-radius: 0;}
.panel-default {border:none}
.panel-default > .panel-heading{background-color: #244B5A;color:#FFFFFF;border:none;background-image:url(../images/chevron-up.png);background-repeat:no-repeat;background-position:center right 20px;padding:25px 50px 25px 25px;border-radius:0;display:block;background-size:24px;}
.panel-title{color:#FFFFFF;font-size:16px;font-weight:300;}
.panel-heading.collapsed .panel-title{color: #FFFFFF}
h4.panel-title{font-size:18px;font-weight:300;}
.panel-heading:hover,.panel-heading:focus{background-color: #244B5A !important;color:#FFFFFF;text-decoration: none !important;outline:none !important}
.panel-heading:hover h2{color:#FFFFFF !important;}
.panel-heading.collapsed{background-color:#5B7E96;color:#FFFFFF;background-image:url(../images/chevron-down.png);}
.panel-body{padding:30px;background-color:#E8ECEE;border:none !important;color:#717274;}
.panel-body .btn{display: inline-block;padding:10px 30px;font-size:16px;color: #1A3C6B;border:1px solid #1A3C6B;border-radius: 0}
.panel-body .btn:hover{color: #FFFFFF;background-color:#1A3C6B}

/* Special Offers */
.special-offers {padding-top:40px;padding-bottom:40px;border-top:1px solid #D3A91F;border-bottom:1px solid #D3A91F;color:#FFFFFF}
.special-offers p{font-size:22px;}
.special-offer {padding-bottom:40px;}
.special-offer p{font-size:16px;}
.special-offers h2 {color:#D3A91F;font-size:22px;margin-bottom:40px}
.special-offers h3 {font-size:36px;margin-bottom:10px;font-weight:300;}
.special-offers h3 span {color:#D3A91F;font-weight:600}
.special-offer a {color:#FFFFFF}

/* Extra small devices (phones, less than 768px) */
@media (max-width: 479px) {
  .visible-xxs {   display: block !important;  }
  .hidden-xxs {    display: none !important;  }
}

/* Very Small devices (mobiles, 480px and up) */
@media (min-width: 480px) {
	.tile-image {float:left;width:33.333333333%;height:0;padding-bottom:33.333333333%;}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	h1,.h1 {font-size:26px;}
	h2,.h2 {font-size:24px;}
	h3,.h3 {font-size:20px;}
	h4,.h4 {font-size:18px;}
	p,ul {font-size:16px;}
	p.large {font-size:24px;}
	p.medium {font-size:20px;}
	.text-sm-right {text-align:right}
	.narrow {padding-left:30px;padding-right:30px;}
	.constrain-width {max-width:1240px}
	header {padding-top:40px;padding-bottom:40px;}
	.header-links {position: absolute;right:0;top:0px;padding-top:0;padding-bottom:0;}
	.header-links a {margin-left:20px;margin-right:0}
	.header-contact span{margin-left:20px;margin-right:0}
	.header-contact {position: absolute;right:0;bottom:0px;}
	.header-links {padding-right:15px;}
	.header-contact {padding-right:15px;}
	.footer-col-1 {float:left;width:230px}
	.footer-col-2 {float:left;width:240px}
	.footer-col-3 {float:left;width:220px}	
	.footer-col-4 {width:100%;float:none;clear:both;}		
	.product-cell1 a,.product-cell2 a,.product-cell3 a,.product-cell4 a,.product-cell5 a,.product-cell6 a,.product-cell7 a,.product-cell8 a,.product-cell9 a,.product-cell10 a,.product-cell11 a,.product-cell12 a {height:500px;margin-bottom:4px;}
	.headerPanel.fixed {margin-top:-130px;}
	.home-banner.fixed,.no-banner.fixed {margin-top:182px}
	
	.product-cell1,.product-cell4,.product-cell7,.product-cell10 {width:calc(33.33333% - 4px);float:left;margin-right:3px;}
	.product-cell2,.product-cell5,.product-cell8,.product-cell11 {width:calc(33.33333% - 4px);float:left;margin-left:3px;margin-right:3px;}
	.product-cell3,.product-cell6,.product-cell9,.product-cell12 {width:calc(33.33333% - 4px);float:left;margin-left:3px;}
	
	/*
	.product-cell4 {width:25.16%;float:left;}
	.product-cell5 {width:calc(74.84% - 10px);float:left;margin-left:10px;}
	
	.product-group1 {width:72%;float:left;}
	.product-group2 {width:calc(28% - 10px);float:left;margin-left:10px}

	.product-cell1 a,.product-cell2 a,.product-cell3 a,.product-cell4 a,.product-cell5 a,.product-cell8 a {height:500px;}
	.product-cell6 a,.product-cell7 a {height:350px;}
	*/
	.product-cell a h2 {font-size:18px;}
	
	.grid {display:table;width:100%}
	.grid-row {display:table-row}
	.grid-row .plus {opacity: 0;width:47px;}
	.grid-cell {display:table-cell;width:50%;}
	.grid-cell.text {padding-top:100px;padding-bottom:85px;vertical-align: middle;padding-left:30px;padding-right:30px;}
	.branch-details {max-width:30%;}
	.map {position: absolute;top:0;right:0;bottom:0;left:35%;height:auto;}
	.news-article h1 {font-size:24px;}
	.news-article h2 {font-size:20px;}		
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 
	h1,.h1 {font-size:30px;}
	h2,.h2 {font-size:30px;}
	h3,.h3 {font-size:24px;}
	p,ul {font-size:18px;}
	p.large {font-size:30px;}
	p.medium {font-size:24px;margin-bottom:20px;}
	.narrow {padding-left:60px;padding-right:60px;}
	.footer-col-1 {float:left;width:250px}
	.footer-col-2 {float:left;width:260px}
	.footer-col-3 {float:left;width:240px}		
	.product-cell a h2 {font-size:20px;}
	.grid-cell.text {padding-left:60px;padding-right:60px;}
	.product-cell a p {font-size:16px;}
	.news-article h1 {font-size:30px;}
	.news-article h2 {font-size:26px;}
	.btn {font-size:16px}	
	.panel-title{font-size:18px;}
	/*.headerPanel.fixed {transition:margin-top 0.25s ease-in;-moz-transition:margin-top 0.25s ease-in;-webkit-transition:margin-top 0.25s ease-in;-o-transition:margin-top 0.25s ease-in}
	.headerPanel.fixed:hover {margin-top:0px}*/
	.special-offers p{font-size:22px;}
	.special-offer p{font-size:18px;}
	.special-offers h2 {font-size:22px;margin-bottom:60px}
	.special-offers h3 {font-size:36px;}	
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
	h1,.h1 {font-size:34px;}
	h2,.h2 {font-size:32px;}
	h3,.h3 {font-size:26px;}
	h4,.h4 {font-size:22px;}
	p,ul {font-size:18px;}
	p.large {font-size:32px;}
	p.medium {font-size:26px;}
	.narrow {padding-left:100px;padding-right:100px;}
	.navbar .narrow {padding-left:75px;padding-right:75px;}
	.home-banner-content p {font-size:24px;}
	.home-banner-content.large h1 {font-size:38px;}
	.home-banner-content.large p {font-size:30px;}
	
	.footer-col-1 {width:227px}
	.footer-col-2 {width:240px}
	.footer-col-3 {width:217px}
	.footer-col-4 {float:right;width:305px;text-align: right;padding-top:5px;clear:none}
	.footer-col-4 img {padding-bottom:24px;padding-top:0;}	
	.product-cell a h2 {font-size:22px;}
	.grid-cell.text {padding-left:100px;padding-right:100px;}
	.news-article h1 {font-size:30px;}
	.news-article h2 {font-size:26px;}
	.navbar-collapse {padding:0}
	.navbar-nav {display: flex;    align-items:stretch;    justify-content: space-between;    width: 100%;       margin: 0;    padding: 0;}
	.navbar-nav li{display: block;    flex: 0 1 auto; /* Default */    list-style-type: none;}
	.navbar-nav > li > a {padding:15px 0;}
	.navbar-nav li:nth-child(1){margin-left:0}
	.nav .dropdown-menu {background-color:transparent;border:none;box-shadow: none;padding:15px 0;}
	.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {    background-color: transparent;    border-color: transparent;}
	.dropdown-menu > li > a {padding-left:0}
	.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {    color: #FFFFFF;    background-color: transparent;}
	.nav-mask {position: fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(30,30,30,0.9);z-index:9000;display:none;}
	.grid-cell.image {height:650px;padding-bottom:0;}
	.grid-cell.image.auto {height:700px;}
	.grid-cell.text h1 {font-size:32px;}
	.panel-title{font-size:20px;}	
}

@media (min-width: 1300px) { 
	
	.footer-col-1 {width:250px}
	.footer-col-2 {width:260px}
	.footer-col-3 {width:240px}