/* RESET */
html, body, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td{
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
}
ol, ul{
list-style:none;
}
blockquote, q{
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after{
content:'';
content:none;
}
:focus{
outline:0;
}
table{
border-collapse:collapse;
border-spacing:0;
}
input::-moz-focus-inner{
border:0!important;
outline:none !important;
}
input, select, textarea, form{
margin:0;
padding:0;
}

/* Color Of Highlight */
::-moz-selection {background:var(--teal); color:#fff; text-shadow:none;}
::selection {background:var(--teal); color:#fff; text-shadow:none;}

*{
box-sizing:border-box;
}

html{
height:100%;
overflow-y:scroll;
scroll-behavior:smooth;
}

/* GENERAL STYLES */

body{
max-width:2000px;
margin:0 auto;
padding:0;
font-family:'Raleway', sans-serif;
font-size:22px;
color:#737373;
line-height:1.4;
background:#fff;
}
a{
color:var(--black);
text-decoration:underline;
transition:var(--fade);
}
a:hover{
color:var(--black);
text-decoration:none;
}

/* ------ VARIABLES ------*/

:root{
--assistant:'Assistant', sans-serif;
--oswald:'Oswald', sans-serif;
--raleway:'Raleway', sans-serif;
--icons:'Font Awesome 5 Pro', sans-serif;
--black:#2c2c2c;
--teal:#00928d;
--yellow:#f9bd2d;
--fade:all 0.15s ease-out;
}

/* ------ GLOBAL STYLES ------*/

.wrap{
width:auto;
max-width:1300px;
padding:0 10px;
margin:0 auto;
}
p,
#main ul,
#main ol{
margin:0 0 30px;
}
#main ul{
list-style:outside disc;
margin:0 0 20px 15px;
}
#main ol{
list-style:outside decimal;
margin:0 0 20px 15px;
}
.button{
display:inline-flex;
font-family:var(--assistant);
font-size:18px;
font-weight:800;
color:var(--yellow);
text-decoration:none;
text-transform:uppercase;
}
	.button:after{
	position:relative;
	content:'';
	left:10px;
	top:8px;
	width:90px;
	height:12px;
	background:url(../images/arrow.png) no-repeat top left;
	transition:var(--fade);
	}
	.button:hover{
	color:var(--yellow);
	}
	.button:hover:after{
	left:15px;
	}
.fas.to-top-btn{
position:relative;
width:22px;
height:22px;
font-size:14px;
font-weight:bold;
color:var(--teal);
line-height:1.6;
text-align:center;
background:#fff;
border-radius:50%;
box-shadow:0 0 6px 0 rgba(0,0,0,0.3);
transition:var(--fade);
}
	.fas.to-top-btn:hover{
	color:#fff;
	background:var(--teal);
	box-shadow:0 0 6px 0 rgba(0,0,0,0);
	}
@media screen and (max-width: 1024px) {
	img{
	max-width:100%;
	height:auto;
	}
}
@media screen and (max-width: 580px) {
	#topcontrol{
	display:none;
	}
}

/* HEADER */

#header{
width:100%;
padding:40px 0 29px;
}
#header .logo{
display:inline-block;
}
	#header .logo img{
	width:100%;
	}
@media screen and (max-width: 1024px) {
	#header{
	text-align:center;
	}
}

/* BANNER */

#banner{
width:100%;
}
#banner .wrap{
position:relative;
display:flex;
}
	#banner .banner-text{
	width:50%;
	padding:60px 0 0;
	text-shadow:1px 1px 1px #fff;
	}
	#banner .banner-text h1{
	font-family:var(--assistant);
	font-size:50px;
	font-weight:800;
	color:var(--black);
	line-height:0.85;
	text-transform:uppercase;
	margin:0 0 20px;
	}
		#banner .banner-text h1 span{
		display:block;
		font-size:70px;
		}
	#banner .banner-text p{
	color:var(--black);
	line-height:1.6;
	padding:0 25% 0 0;
	margin:0 0 25px;
	}
	#banner .banner-img{
	width:50%;
	}
@media screen and (max-width: 1024px) {
	#banner .wrap{
	flex-direction:column;
	padding:0 0 60px;
	overflow:hidden;
	}
	#banner .banner-text,
	#banner .banner-img{
	width:100%;
	text-align:center;
	}
	#banner .banner-text{
	padding:40px 0 0;
	z-index:9;
	}
	#banner .banner-text p{
	padding:0;
	}
	#banner .banner-img{
	position:absolute;
	z-index:8;
	opacity:0.25;
	}
	#banner .banner-img img{
	height:100%;
	object-fit:cover;
	}
}

/* MYTHS */

.myth-buster{
position:relative;
width:100%;
padding:100px 0;
}
.myth-buster .wrap{
display:flex;
text-align:center;
align-items:center;
justify-content:space-around;
}
	.myth-buster.teal{
    background:var(--teal);
	}
	.myth-buster:before{
	position:absolute;
	content:'';
	left:50%;
	top:0;
	margin:0 0 0 -34px;
    display:block;
    width:0px;
    height:0px;
    border:34px solid transparent;
    border-bottom-width:0px;
	}
		.myth-buster.teal:before{
		border-top-color:#fff;
		}
		.myth-buster.white:before{
		border-top-color:var(--teal);
		}
	.myth-buster h2,
	.myth-buster h3,
	.myth-buster h4,
	.myth-buster h5,
	.myth-buster h6{
    font-family:var(--oswald);
	font-weight:600;
	line-height:1.4;
	text-transform:uppercase;
	}
	.myth-buster h6{
	font-size:20px;
	color:var(--yellow);
	}
	.myth-buster h5{
	font-size:26px;
	color:var(--black);
	}
	.myth-buster.teal h5{
    color:#fff;
	}
		.myth-buster h5 span{
		font-size:16px;
		color:#58aba7;
		vertical-align:middle;
		}
	.myth-buster h4{
	font-size:32px;
	color:var(--black);
	}
	.myth-buster.teal h4{
	color:#fff;
	}
	.myth-buster h3{
	font-family:var(--raleway);
	font-size:36px;
	font-weight:500;
	color:var(--black);
	}
	.myth-buster h2{
	font-size:38px;
	color:var(--yellow);
	}
	.myth-buster p{
	font-size:14px;
	color:#58aba7;
	}
	.myth-buster.white p{
	color:#b2b2b2;
	}
		.myth-buster p strong{
		font-weight:normal;
		color:var(--yellow);
		}
	.myth-buster .arrow{
	margin:5px 0 20px;
	}
@media screen and (max-width: 1024px) {
	.myth-buster.teal .wrap{
	flex-direction:column-reverse;
	}
	.myth-buster.white .wrap{
	flex-direction:column;
	}
}

/* BENEFITS */

#benefits{
position:relative;
width:100%;
padding:100px 0;
background:#efefef;
}
#benefits .wrap{
text-align:center;
align-items:center;
justify-content:space-around;
}
	#benefits:before{
	position:absolute;
	content:'';
	left:50%;
	right:50%;
	top:0;
	margin:0 0 0 -36px;
    display:block;
    width:0px;
    height:0px;
    border:34px solid transparent;
    border-bottom-width:0px;
	border-top-color:#fff;
	}
	#benefits h2,
	#benefits h6{
    font-family:var(--oswald);
	font-weight:600;
	line-height:1.4;
	text-transform:uppercase;
	}
	#benefits h6{
    font-size:20px;
	color:var(--yellow);
	line-height:0.8;
	}
	#benefits h2{
    font-size:50px;
	color:var(--black);
	}
	#benefits .arrow{
    margin:0 0 60px;
	}
	#benefits section{
	display:flex;
	align-items:center;
	padding:0 0 50px;
	}
		#benefits section:nth-child(odd){
		flex-direction:row-reverse;
		}
		#benefits section:nth-child(odd) img{
		margin:0 0 0 20px;
		}
		#benefits section:nth-child(even) img{
		margin:0 20px 0 0;
		}
	#benefits aside{
	display:flex;
	flex-direction:column;
	justify-content:center;
    text-align:left;
	}
	#benefits aside h3{
	font-family:var(--raleway);
	font-size:42px;
	font-weight:600;
	color:var(--black);
	text-transform:uppercase;
	}
		#benefits aside h3:after{
		content:'';
		display:block;
		width:300px;
		margin:0 0 15px;
		border-bottom:1px solid var(--yellow);
		}
	#benefits aside ul{
	margin:0 0 0 40px;
	}
	#benefits aside ul li{
	list-style-image:url(../images/checkmark.png);
	padding:0 0 0 12px;
	margin:15px 0 10px;
	}
@media screen and (max-width: 1024px) {
	#benefits section,
	#benefits section:nth-child(odd){
	flex-direction:column;
	}
	#benefits aside{
	text-align:center;
	}
	#benefits aside h3:after{
	margin:0 auto 15px;
	}
	#benefits section:nth-child(odd) img,
	#benefits section:nth-child(even) img{
	margin:0 0 20px;
	}
	#benefits aside ul{
	list-style-position:inside;
	margin:0;
	}
}

/* KNOW THE FACTS */

#know-the-facts{
position:relative;
width:100%;
padding:100px 0;
background:var(--teal);
text-align:center;
}
	#know-the-facts:before{
	position:absolute;
	content:'';
	left:50%;
	right:50%;
	top:0;
	margin:0 0 0 -36px;
    display:block;
    width:0px;
    height:0px;
    border:34px solid transparent;
    border-bottom-width:0px;
	border-top-color:#efefef;
	}
	#know-the-facts h2,
	#know-the-facts h4{
	font-family:var(--oswald);
	font-weight:600;
	line-height:1.4;
	text-transform:uppercase;
	}
	#know-the-facts h2{
	font-size:46px;
	color:var(--yellow);
	}
	#know-the-facts h4{
	font-size:32px;
	color:#fff;
	margin:0 0 40px;
	}
	#know-the-facts .arrow{
    margin:0 0 20px;
	}
	#know-the-facts .solid-button{
    display:inline-block;
	padding:18px 38px;
	background:var(--yellow);
	border-radius:26px;
	border:2px solid var(--yellow);
	font-family:var(--assistant);
	font-size:18px;
	font-weight:800;
	color:var(--black);
	line-height:1;
	text-decoration:none;
	text-transform:uppercase;
	}

/* FOOTER */

#footer{
width:100%;
padding:20px 0;
margin:0;
font-size:14px;
color:#9c9c9c;
text-align:center;
}
	#footer a{
	color:#9c9c9c;
	text-decoration:none;
	}
	#footer a:hover{
	color:#333;
	}