@charset "utf-8";
/* CSS Document */

body {
	font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	background-color:#555555;
}

#header {
	wifth:100%;
	height:100px;
	background-color:#fff;
	position: -webkit-sticky; /* Safari */
	position: sticky;
	top: 0;
	z-index:99;
	border-bottom:1px solid #b8b8b7;
}

#masthead {
	width:100%;
	height:520px;
	position:relative;

}


.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:52px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}

.mastheadwrapper {
	width:100%;
	height:520px;
	background-color:#fbc111;

}
.masthead {
	width:100%;
	height:520px;
	position:relative;

}

@media only screen and (max-height:320px) {
	.masthead {
	width:100%;
	height:220px;
	background-color:#fbc111;
	}
	
	.logobox {
		padding-left:20px;
	}
}



.row-equal-height {
	display:flex;
}

.herocontainer {
	width:100%;
	height:auto;
	padding: 0 120px 0 0px;
	position: absolute;
  	top: 50%;
  	-ms-transform: translateY(-50%);
  	transform: translateY(-50%);
}

.herocontainer h1 {
	width:100%;
	text-align:left;
	font-size:52px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}

@media only screen and (max-width:500px) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 30px 0 30px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:26px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
}

@media only screen and (min-width:501px) and (max-width:575px) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 30px 0 30px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:32px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
}

@media only screen and (min-width:576px) and (max-width:767px) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 80px 0 80px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:32px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
}

@media only screen and (min-width:769px) and (max-width:1024px) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 60px 0 60px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:28px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
}

@media only screen and (min-width:769px) and (max-width:1024px) and (orientation:portrait) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 60px 0 60px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:38px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
}

.strapline {
	padding-top:16px;
	font-size:1.2rem;
	color:#3d3d3d;
}

@media only screen and (max-height:320px) and (orientation:landscape) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 60px 0 60px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:22px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
	.strapline {
	padding-top:16px;
	font-size:0.7rem;
	color:#3d3d3d;
}
}

@media only screen and (max-width:768px) and (orientation:portrait) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 60px 0 60px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:28px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
	.strapline {
	padding-top:16px;
	font-size:1.2rem;
	color:#3d3d3d;
}
}

@media only screen and (max-height:540px) and (orientation:landscape) {
	
	.masthead {
		height:420px;
	}
}

@media only screen and (max-width:500px) {
	
	.herocontainer {
    width: 100%;
    height: auto;
    padding: 0 30px 0 30px;
	}
	
	.verticalforce h1 {
	width:100%;
	text-align:left;
	font-size:26px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#3d3d3d;
}
}


#primary {
	width:100%;
	height:auto;
	background-color:#fff;
}

.logobox {
	width:30%;
	height:100px;
	padding-top:15px;
	padding-left:60px;
	float:left;
}

.navbox {
	width:70%;
	height:100px;
	padding-right:60px;
	float:right;
	text-align:right;
}

.navbar {
	width:100%;
	padding-top:25px;
}

.navitem {
	width:100%;
}

.navitem li {
	list-style: none;
	padding: 8px 8px;
    text-decoration: none;
    display: inline-block;
    color: #fff;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
    outline: 0;
    letter-spacing: 0;
    transition: .3s;
} 



/* Burger */

.topnav {
overflow: hidden;
	padding:35px;
	float:right;
		
}

.topnav a {
  display: inline;
  color: #000;
  text-align: right;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
}

#menuquote {
	display:none;
}

.topnav a:hover {
  color: orange;
}

.topnav a.active {
  color: orange;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 1240px) {
  .topnav a {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 1240px) {
  .topnav.responsive {position: absolute;
    left: 0px;
    width: 100%;
	background-color:rgba(0, 0, 0, 0.8);
	}

	.topnav {
	top:0px;
	padding:0px;
	}
	
	.topnav a {
	  padding: 9px 30px;
	color:#fff;
	}

	.topnav a.active {
  	color: orange;
}
	#menuquote {
	display:contents;
}
	
  .topnav.responsive .icon {
    position: absolute;
    top: 25px;
    left: 0px;
    width: 100%;
	height:auto;
	color:#fff;
  }
	
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
	padding: 14px 30px;
	width:100%;
  }
	
	.chunkytop {
		display:none;
	}
	.fa, .fas {
	font-size:1.7rem;
	float: right;
	color:#000;
	}
	.topnav.responsive a .fa, .fas {
		padding-top:0px;
		color:#fff;
}
}

.fa, .fas {
	font-size:1.7rem;
	padding-top:30px;
}

/* Burger End */

.maincontent {
	width:100%;
	background-color:#fff;
}

.contentbox-white {
	padding-top:90px;
	padding-bottom:90px;
	background-color:#fff;
}

.contentbox-grey {
	padding-top:90px;
	padding-bottom:90px;
	background-color:#f9f9f7;
}

.contentbox-yellow {
	padding-top:20px;
	padding-bottom:0px;
	background-color:#fbc111;
}

.boxheading {
	width:100%;
	text-align:center;
	font-size:42px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#555554;
	padding:0px 30px 10px 30px;
}

.boxheading-videoleft {
	width:100%;
	text-align:center;
	font-size:2.9rem;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:#555554;
	padding:80px 30px 10px 30px;
}

.boxsubtitle {
	width:100%;
	text-align:center;
	font-size:16px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	color:black;
	padding: 0px 30px 15px 30px;
}

.boxtray {
	/* margin: 0px 80px 0px 80px; */
	
}

@media only screen and (max-width:460px) {
.boxtray {
	margin: 0px 20px 0px 20px;
}
	.logobox {
		padding-left:0px;
	}
}
	
.contenttile-one {
	background-color:#f6f4f4;
	margin:20px 6px;
	padding:30px;
	border: 1px solid #dedbdb;
	border-radius: 6px;
	box-shadow: 0px 6px 4px #dedbdb;
	display:flex;
	flex-direction:column;
	height:100%;
}

.contenttile-two {
	background-color:#f6f4f4;
	margin:20px 6px;
	padding:30px;
	border: 1px solid #dedbdb;
	border-radius: 6px;
	box-shadow: 0px 6px 4px #dedbdb;
	display:flex;
	flex-direction:column;
	height:100%;
}

.contenttile-three {
	background-color:#f6f4f4;
	margin:20px 6px;
	padding:30px 30px 30px 30px;
	border: 1px solid #dedbdb;
	border-radius: 6px;
	box-shadow: 0px 12px 20px #dedbdb;
	display:flex;
	flex-direction:column;
	height:100%;
}

.contenttile-four {
	background-color:#f6f4f4;
	margin:20px 6px;
	padding:30px;
	border: 1px solid orange;
	border-radius: 6px;
	box-shadow: 0px 12px 20px #fee392;
	display:flex;
	flex-direction:column;
	height:100%;
}

.contenttile-yellow {
	margin:20px 6px;
}

.contenttile-insurance {
	background-color:#f6f4f4;
	margin:20px 6px;
	padding:10px 30px 30px 30px;
	border: 1px solid #fdb811;
	border-radius: 6px;
	box-shadow: 0px 12px 20px #fddca4;
	display:flex;
	flex-direction:column;
	height:100%;
}

.col-sm-12 {
    margin-bottom: 20px;
}

.contenttileheading {
	width:100%;
	text-align:center;
	font-size:24px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
	padding-bottom:10px;
}

.contenttilebody {
	width:100%;
	text-align:center;
	font-size:16px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
}

.numbercircletray {
	width:100%;
	text-align:center;
	padding-bottom:10px;
}

.numbercircle {
	text-align:center;
	  height: 70px;
  width: 70px;
  background-color: orange;
  border-radius: 50%;
  display: inline-block;
	padding-top:7px;
	font-size:40px;
	color:#fff;
}

.footerbox {
	padding-top:90px;
	padding-bottom:60px;
	background-color:#555555;
	color:#fff;
	font-size:14px;
font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
}

.footerstripe {
	width:100%;
	height:15px;
	 background-image: linear-gradient(90deg, orange, yellow);
}

.footertray {
	margin: 0px 80px 0px 80px;
}
.footerlinks a {
	color:#fff;
	font-size:.8rem;
}
.footerlinks li {
	list-style:none;
}
.footerlinks ul {
	padding:0px;
}

.contentstripe {
	width:100%;
	height:5px;
	 background-image: linear-gradient(90deg, orange, yellow);
}

.CTA-button {
	width:100%;
	text-align:center;
}

.chunkytop {
	width:190px;
	padding:6px 30px;
	margin-left:20px;
	box-shadow:0px 3px 8px #f57efc;
	background-image: linear-gradient(90deg, #ae00ce, #0250ef);
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
font-size:1.2rem;
border:2px solid #9904e6;
	color:#fff;
}

.chunkytop:hover {
	width:190px;
	padding:6px 30px;
	margin-left:20px;
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
	background-image: linear-gradient(90deg, #fff, #fff);
	box-shadow:0px 3px 8px #fcde76;
font-weight: 400;
font-style: normal;
font-size:1.2rem;
	color:orange;
	border:2px solid orange;
	outline:none;
}

.chunkytop:active {
	width:190px;
	padding:6px 30px;
	margin-left:20px;
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
	background-image: linear-gradient(90deg, #fff, #fff);
	box-shadow:0px 3px 8px #fcde76;
font-weight: 400;
font-style: normal;
font-size:1.2rem;
	color:orange;
	border:2px solid orange;
	outline:none;
}

.chunky {
	width:220px;
	padding:6px 30px;
	box-shadow:0px 3px 8px #fed864;
	background-image: linear-gradient(90deg, #ff8a00, #ffc000);
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
font-size:1.2rem;
border:2px solid #ffc000;
}

.chunky:hover {
	width:220px;
	padding:6px 30px;
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
	background-image: linear-gradient(90deg, #fff, #fff);
font-weight: 400;
font-style: normal;
font-size:1.2rem;
	color:orange;
	border:2px solid orange;
	outline:none;
}

.chunky:active {
	width:220px;
	padding:6px 30px;
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
	background-image: linear-gradient(90deg, #fff, #fff);
font-weight: 400;
font-style: normal;
font-size:1.2rem;
	color:orange;
	border:2px solid orange;
	outline:none;
}

.chunkyproduct {
	width:160px;
	padding:6px 6px;
	box-shadow:0px 3px 8px #fed864;
	background-image: linear-gradient(90deg, #ff8a00, #ffc000);
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
font-weight: 400;
font-style: normal;
font-size:1.2rem;
border:2px solid #ffc000;
	margin-top:20px;
}

.chunkyproduct:hover {
	width:160px;
	padding:6px 6px;
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
	background-image: linear-gradient(90deg, #fff, #fff);
font-weight: 400;
font-style: normal;
font-size:1.2rem;
	color:orange;
	border:2px solid orange;
	outline:none;
}

.chunkyproduct:active {
	width:160px;
	padding:6px 6px;
	border:0px;
	border-radius:4px;
	font-family: brevia, sans-serif;
	background-image: linear-gradient(90deg, #fff, #fff);
font-weight: 400;
font-style: normal;
font-size:1.2rem;
	color:orange;
	border:2px solid orange;
	outline:none;
}

@media only screen and (max-height:320px) {
	.masthead {
	width:100%;
	height:220px;
	background-color:#fbc111;
	position:relative;
}
	
	.logobox {
		padding-left:20px;
	}
}

/* .heroimage  {
	background-image: url("../images/heroimage_inset.png");
		background-repeat:no-repeat;
	background-position:cover;
} */

#mastheadwrapper {
	width:100%;
	background-color:#fbc111;
}

.hero {
	width:100%;
	background-color:#fbc111;
}

.mastimage {
    display: table-cell;
	height: 520px;
	position:relative;
	overflow: hidden;
}
.mastimage img {
	height:auto;
	position:absolute;
	top: 50%;
  	-ms-transform: translateY(-50%);
  	transform: translateY(-50%);
	left:10%;
}

@media only screen and (max-width:1430px) and (min-width:769px) {
.mastimage img {
	width:100%;
	transform-duration:2s;
}
}

#mastheadwrapper .col-sm-12 {
	margin-bottom:0px;
}


.social {
	font-size:2rem;
	color:#fff;width:100%;
	text-align:right;
}

.social i {
	padding-left:10px;
}

@media only screen and (max-width:768px) {
.social {
	text-align:left;
}
.social i {
	padding-left:0px;
	padding-right:10px;
}
}

.social a {
	font-size:2rem;
	color:#fff;
}

.social a:hover {
	font-size:2rem;
	color:#0a0907;
}
.conceptimage {
	text-align:center
}
.productbutton {
	position:absolute;
	bottom:0px;
	text-align:center;
	transform: translateX(-50%);
    left: 50%;
}
.policyimage {
	text-align:center;
}

#headertest {
	background-color:#fbc111;
}

.testheaderimagebox {
	display:flex;
	flex-direction:column;
	height:100%;
}
.testheadertextbox {
	display:flex;
	flex-direction:column;
	height:100%;
}



@media only screen and (min-width:992px) {
.verticalforce {
	position:absolute;
	top:50%;
	transform:translateY(-50%);
}
}

.cookiebox {
  display: block;
 background: linear-gradient(45deg, rgba(218,104,3,0.6), rgba(218,135,3,0.6));
  width: 100%;
  height: auto;
padding:20px 60px 20px 60px;;
	position:fixed;
	bottom:0px;
	color:#fff;
	animation-name: appear;
	  animation-duration: .8s;
	z-index:999;
}
.cookiebox a {
	color:#fff;
}
#trigger2:checked + .cookiebox {
  display: none;
}
#trigger2{display:none;}
.cookietext {
	padding-top:10px;
	float:left;
}
.cookietext a {
	text-decoration: underline;
}
.closetray {
	float:right;
}
.closebutton {
	Padding:8px 30px 6px 30px;
	background: linear-gradient(45deg, #da6803, #da8703);
	border-radius:4px;
}

@media (max-width:1000px) {
	.cookiebox {
  display: block;
  background: linear-gradient(45deg, rgba(218,104,3,0.6), rgba(218,135,3,0.6));
  width: 100%;
  height: auto;
padding:5px 60px 10px 60px;;
	position:fixed;
	bottom:0px;
	color:#fff;
		font-size:.8rem;
		z-index:999;
}
	.closebutton {margin-top:6px;}
}


.explainer {height:250px;
padding-bottom:12px;}

.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}