/* GLOBAL STYLESHEET ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

   Color:	rgb()

/*_____________________________________________________________________________________________ PAGE SETUP */
html {font: 5vw/1.3 'Poppins', sans-serif;}
body {
	background: rgb(13,24,28);
	font-family: inherit;
	font-size: 0.875em;
	color: #000;
}
#main {
	margin: 0 -0.9375rem;
	padding: 0 0.9375rem;
}
#main {opacity: 0;transition: opacity 0.25s ease-in-out;}
#main.initialised {opacity: 1;}

@media (min-width:48em) {
	html {font-size: 100%;}
	body {font-size: 1em;}
}
@media (min-width:62em) {
	.span {
		width: 93.75vw;
		max-width: 65rem;
		margin: 0 auto;
	}
}
.container-fluid {
    margin-right: 12.5%;
    transition: transform 0.6s;
    background: #fff;
    color: #000;
    min-height: 100vh;
    overflow-x: hidden;
    width: auto;
	display: block;
	padding-top: 6rem;
}
@media (min-width:48em) {
	.container-fluid {
		padding-top: 12rem;
	}
}
/*____________________________________________________________________________________________ ROW PADDING */
.row {
	z-index: 1;
}
.row > .span {
	padding-top:2em;
	padding-bottom:2em;
}
@media (min-width:48em) {
	.row > .span {
		padding-top:3.5em;
		padding-bottom:3.5em;
	}
}
/*____________________________________________________________________________________________ COMMON TAGS */
h1 {font-weight: 600;font-size: 2em;}
h2 {font-weight: 600;font-size: 1.2em;margin: 0 0 1rem 0;}
h3 {font-weight: 600;font-size: 1.1em;margin: 0 0 1rem 0;}
h4 {font-weight: 600;font-size: 1em;}
@media (min-width:48em) {
	h1 {font-size: 2.4em;}
	h2 {font-weight:bold;font-size: 1.7em;margin: 0 0 2rem 0;}
	#banner h2 {margin-bottom: 0;}
	h3 {font-weight:bold;font-size: 1.5em;}
	h4 {font-size: 1em;}
}
@media (min-width:75em) {
	h1 {font-size: 2.75em;font-weight: bold;}
}
p {margin-bottom: 1.5em;}
p.lead {font-size: 1rem; font-weight: 600;}
ul.no-styles {
	list-style: none;
	padding: 0;margin: 0;
}
ul.no-styles li {
	padding: 0;margin: 0;
}
/*__________________________________________________________________________________________________ LINKS */
a,
a:hover,
a:active,
a:focus {
    color: #7cc242;
}
a.yt-lightbox::before {
	content: '\f144';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: 'Font Awesome 5 Pro';
	font-weight: 400;
	font-size: 3.5rem;
	color: #000;
}
a.yt-lightbox img {
	margin: 0;
}
@media (min-width:48em) {
	a.yt-lightbox {
		position: absolute;
	}
	a.yt-lightbox:hover::before {
		color: #fff;
		z-index: 2;
	}
	a.yt-lightbox::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0,0,0,0.4);
		opacity: 0;
		transition: opacity 0.15s ease-in-out;
	}
	a.yt-lightbox:hover::after {
		opacity: 1;
	}
}

.btn {
	font-family: 'Barlow Condensed', sans-serif;
	border-radius: 0;
	padding: 0.5rem 1rem;
	font-weight: bold;
	font-size: 1.25rem;
	color: #000;
}
.btn-green.video, .btn-green.download {
	padding-right: 2.5rem;
	position: relative;
	max-width: 15rem;
}
.btn-green.video::before {
	content: '\f04b';
	font-family: 'Font Awesome 5 Pro';
	color: #fff;
	position: absolute;
	right: 0.75rem;
	top: 50%;
	transform: translateY(-50%);
}
.btn-green.download::before {
	content: '\f33d';
	font-family: 'Font Awesome 5 Pro';
	color: #fff;
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
}
.btn-green {
	background: #7cc242;
	color: #fff !important;
	border-radius: 0.5rem;
	padding: 0.85rem 0.75rem;
	margin: 1rem 0;
	display: block;
	max-width: 100%;
	text-align: left;
}
.btn-green.arrow-right {
	display: flex !important;
	position: relative;
	max-width: 100%;
	width: 100%;
	margin-bottom: 1em;
	border: none;
}
.btn-green.arrow-right::before {
	content: '\f054';
	font-family: 'Font Awesome 5 Pro';
	color: #fff;
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
}
.btn-green.arrow-right.external::before {
	content: '\f08e';
    font-size: .9em;
}
@media (min-width:48em) {
	.btn-green {
		margin: 0;
		max-width: 10rem;
	}
	.btn-green.video, .btn-green.download, .btn-green.arrow-right {
		padding-right: 4rem;
		
	}
}
.btn.btn-inline {
	padding: 0 0 0.25rem 0;
	font-size: 1rem;
}
/*___________________________________________________________________________GLOBAL CLASSES____________*/
.curved {
	border-radius: 0.5rem;
}
.lines {
	position: relative;
}
.lines::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 5.4rem;
	height: 4rem;
	background: url(/images/common/corner-lines.png) top left / 100% 100% no-repeat;
}
@media(min-width:48em){
	.lines::before {
		width: 6.48rem;
		height: 4.8rem;
	}
}
#banner .banner-image {
	min-height: 10rem;
	margin-bottom: 2rem;
}
#banner .banner-image.portrait {
	min-height: 20rem;
	margin-bottom: 0;
}
#banner .banner-cta {
	position: absolute;
	right: -0.5rem;
	bottom: -0.5rem;
	font-size: 0.8rem;
	max-width: 95%;
	margin: 0;
}
@media(min-width:48em){
	#banner .banner-image {
		min-height: 15rem;
		margin-top: -10rem;
		margin-bottom: 4rem;
	}
	#banner .banner-image.portrait {
		min-height: 30rem;
		margin-bottom: 0;
	}
	#banner .banner-cta {
		font-size: 1rem;
	}
}
.keyline {
	border-top: #7cc242 0.25rem solid;
	border-bottom: #7cc242 0.25rem solid;
}
.keyline p:nth-child(1) {
	font-weight: 600;
}
.keyline p:nth-child(2) {
	font-weight: 400;
}
.keyline p:nth-child(3) {
	font-weight :200;
}
.keyline .warranty-header-text {
	margin-top: 3em;
}
@media(min-width:48em){
	.keyline > .span {
		padding: 2rem 0;
	}
	.keyline > .span > div:last-child {
		text-align: right;
	}
	.keyline p {
		margin-bottom: 0.5rem;
	}
	.keyline p:nth-child(3) {
		margin-bottom: 0;
	}
	.keyline .warranty-header-text {
		margin-top: 0;
	}
}
@media(min-width:75em){
	.keyline a.btn-green {
		display: inline-block;
		margin-top: 0.5em;
	}
}
@media(max-width:48em){
	.content > .span > div {
		margin-bottom: 2rem;
	}
}
.content > .span > div:last-child {
	margin-bottom: 0;
}
.accreditations {
	text-align: center;
}
.accreditations ul {
	padding: 0;
	margin: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.accreditations ul li {
	margin: 1.5rem 0;
	display: flex;
	flex-direction: column;
	position: relative;
}
.accreditations ul li::before {
	content: '';
	position: absolute;
	bottom: -1.5rem;
	transform: translateY(50%);
	left: 0;
	right: 0;
	width: 100%;
	height: 0.125rem;
	background: #7cc242;
}
.accreditations ul li .acc-title {
	font-size: 0.9rem;
	font-weight: 600;
	margin-bottom: 0.5rem;
}
.accreditations ul li .acc-desc {
	font-size: 0.75rem;
	font-weight: 200;
}
@media(min-width:48em){
	.accreditations ul {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-start;
	}
	.accreditations ul li {
		flex: 0 0 33%;
		max-width: 33%;
		padding: 0 1.25rem;
		align-self: stretch;
		margin: 1.75rem 0;
	}
	.accreditations ul li:nth-child(1), .accreditations ul li:nth-child(2), .accreditations ul li:nth-child(4), .accreditations ul li:nth-child(5), .accreditations ul li:nth-child(7) {
		border-right: #7cc242 0.25rem solid;
	}
	.accreditations ul li::before {
		display: none;
	}
	.accreditations ul li .acc-title {
		min-height: 2.5rem;
	}
}
@media(min-width:75em){
	.accreditations ul li {
		flex: 0 0 25%;
		max-width: 25%;
		padding: 0 0.95rem;
	}
	.accreditations ul li:nth-child(4) {
		border-right: none;
	}
	.accreditations ul li:nth-child(3), .accreditations ul li:nth-child(6) {
		border-right: #7cc242 0.25rem solid;
	}
}
/*__________________________________________________________________________________________ COLOUR THEMES */
[data-bg="grey"] {
	background: rgb(230, 230, 230);
}
/*_____________________________________________________________________________________________ HEADER */
#header {
	z-index: 2;
	transition: background 0.3s, padding 0.5s, transform 0.6s;
	padding: 1rem 0;
}
#header img#site-logo {
	width: 50%;
	position: absolute;
	top: 0;
	left: 0.9375rem;
	margin: 0;
	transition: transform 0.25s ease-in-out, left 0.25s ease-in-out;
}
@media (min-width:48em) {
	html[data-scroll-state="down"] #header {
		transition: box-shadow 0.1s ease-in-out, transform 0.4s ease-in-out;
	}
	#header img#site-logo {
		width: 18rem;
		transition: width 0.1s ease-in-out;
	}
}
@media screen and (min-width: 48em) and (max-width: 80em) {
	html[data-scroll-state='down'] img#site-logo {
		transform: scale(1);
		width: 9rem !important;
	}
}
@media (max-width:79.9375em) {
	#header {
		position: fixed;
	}
	html[data-scroll-state='down'] #header a.home-logo[href^="/"] {
		background: rgba(255,255,255,0);
	}
	html[data-scroll-state='down'] #header {
		padding-top:0.75rem;
		padding-bottom:0.75rem;
		background: rgba(255,255,255,1);
		min-height: 4.25rem;
		-webkit-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.75);
		-moz-box-shadow:    0px 3px 5px 0px rgba(50, 50, 50, 0.75);
		box-shadow:         0px 3px 5px 0px rgba(50, 50, 50, 0.75);
	}
	html[data-scroll-state='down'] img#site-logo {
		transform: scale(0.6);
		left: -0.9375rem !important;
		top: -1rem !important;
	}
}
@media (min-width:79.9375em) {
	#header {
		position: absolute;
	}
}
#header .header-nav {
	display: flex;
	justify-content: flex-end;
	font-size: 0.7em;
}
#menu-btn {
	position:relative;
	display:block;
	background:rgba(255,255,255,0.9);
	border-radius: 0;
	border:1px solid rgb(13,24,28);
	margin-right: -1.3rem;
	color: #000 !important;
} 
#menu-btn:first-child {
	border: none;
	background: #7cc242;
	margin-right: 0.5rem;
	padding: 0.75em;
	color: #fff !important;
} 
#header .header-nav {
	display: flex;
	justify-content: flex-end;
}
#menu-btn.menu-toggle {
	padding:calc(0.5625em - 1px) 2.75em calc(0.5625em - 1px) 0.75em;
}
#menu-btn.menu-toggle::after {
	content:'\f053';
	font-family: 'Font Awesome 5 Pro';
	position: absolute;
	right: 0.4rem;
	top: 50%;
	transform: translateY(-50%);
	transition: 0.5s all ease-in-out;
}
.menu-open #menu-btn::after {
    transform: translateY(-50%)rotateY(180deg);
}

/*___________________________________________________________ MENU CUSTOMISATION _____*/
.sticky-header {
	right:12.5%;
	width:87.5%;
}
@media (max-width:47.5em) {
	.menu-open .sticky-header {
		z-index: 1 !important;
	}
}

.container-fluid {
	margin-right:12.5%;
	transition:transform 0.6s;
}
.page-scrim {
	right:12.5%;
	width:87.5%; /* Widths needed for IE11 */
	transition:transform 0.6s, opacity 0.6s;
	background:#7cc242;
}
#menu {
	width:90%;
	transform:translate3d(50%,0,0);
	transition:transform 0.4s, opacity 0.4s;
	color:#fff;
}
.menu-scrim {
	transition:transform 0.4s;
}

.menu-open .sticky-header,
.menu-open .container-fluid,
.menu-open .page-scrim {
	transform:translate3d(-88.57%,0,0); /* -77.5vw calculated in % for IE11: Results in RHS of .page and .page-scrim at 10vw from LHS of viewport */
}
@media (min-width:48em) {
	.sticky-header {
		right:3.75em;
		width:calc(100% - 3.75em);
	}
	.container-fluid {
		margin-right:3.75em;
	}
	.page-scrim {
		right:3.75em;
		width:calc(100% - 3.75em);
		background:rgba(255,255,255,0.8);
	}
	#menu {
		width:16.875rem;
	}
	.menu-open .sticky-header,
	.menu-open .container-fluid,
	.menu-open .page-scrim {
		transform:translate3d(-13.125em,0,0);
	}
}
@media (min-width:80em) {
	/* Menu forced open */
	.sticky-header {
		right:16.875em;
		width:calc(100% - 16.875rem);
		transform:none !important;
		transition:none;
	}
	.sticky-header .header-nav {
		display:none !important;
	}
	.container-fluid {
		margin-right:16.875rem;
		transform:none !important;
		overflow-y: visible;
		transition:none;
	}
	#menu {
		transform:none;
		opacity:1;
		transition:none;
	}
	.page-scrim,
	.menu-scrim {
		display:none;
		transition:none;
	}
}
#menu {
	font-family:'Barlow', sans-serif;
	font-weight:300;
	font-size:0.9em;
	color:rgb(148,148,151);
}
#menu li a {
	color:inherit !important;
}
#menu li.drop:hover > button {
	color:#fff !important;
}
#menu li a:hover {
	color:#fff !important;
}
#menu .aux {
	padding:2em 2.5rem;
}
#menu .drop.active > button {
	background:rgba(255,255,255,0.4);
	color:#fff !important;
}
#menu .drop .sub {
	margin-left: 0.5rem;
}
@media (min-width:48em) {
	#menu > nav {
		padding-top:7rem;
	}
}
#menu .btn::after {
	border-color:#fff;
}
/*___________________________________________________________FOOTER_______________*/
#footer {
	border-top: #ccc solid 0.125rem;
	padding: 1em 1em 1em 0.9375rem;
}
#footer .span > div {
	margin-bottom: 0.85rem;
}
#footer .footer-images {
	width: 100%;
}
#footer .footer-images ul {
	display: flex;
	justify-content: space-between;
}
#footer .footer-images img {
	margin: 0;
	max-height: 2rem;
}
#footer .footer-images #accreditations {
	max-width: 60%;
	align-self: center;
}
#footer .footer-images li {
	max-width: 50%;
	align-self: flex-end;
}
#footer .footer-content {
	width: 100%;
}
#footer .footer-content ul {
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	width: 100%;
}
#footer .footer-content ul li {
	font-size: 0.8rem;
	text-align: center;
	margin-bottom: 1rem;
}
#footer .footer-content #privacy a {
	color: #000 !important;
	text-decoration: underline;
}
#footer .footer-content #part-of-absolent-group {
	color: rgba(0,0,0,0.4);
	font-weight: 600;
}
@media (min-width:48em) {
	#footer .footer-images li {
		max-width: 30%;
	}
	#footer .footer-images img {
		max-height: 3rem;
	}
	#footer .footer-images #accreditations {
		width: 25rem;
		margin-bottom: 1.5rem;
	}
	#footer .footer-images #absolent-group {
		width: 9rem;
		display: flex;justify-content: flex-end;
	}
	#footer .footer-content {
		width: 100%;
	}
	#footer .footer-content ul {
		flex-direction: row;
		justify-content: space-between;
	}
	#footer .footer-content #privacy {
		text-align: left;
		font-size: 0.8rem;
	}
	#footer .footer-content #part-of-absolent-group {
		text-align: right;
		width: auto;
		font-size: 0.8em;
	}
}

.warranty-row {
	background-color: #7cc242;
	color: #fff;
}
.warranty-row .btn-green {
	background-color: #fff;
	color: #000 !important;
}
.warranty-row .btn-green::before {
	color: #000 !important;
}
.warranty-row .warranty-header {
	font-size: 3em;
}