@charset "UTF-8";
/* CSS Document */
body, div, span, h1, h2, h3, h4, p {
	font-family: 'Lato', sans-serif;
}

body {
	padding:0;
	margin: 0;
}

sup {
	font-size: 13px;
	vertical-align: super;
}

.page-wrapper {
	min-width: 1200px;
	padding:0 20px;
}

.header {
	padding:0 50px;
	width:100%;
	max-width: 1440px;
	min-width: 1200px;
	margin:0px auto;
}

.header nav {
	width:65%;
	float:right;
	padding-top: 21px;
	list-style: none;
	margin:0;
	display: block;
}

.header nav ul {
	width:670px;
	float:right;
	list-style: none;
	margin:0;
	display: block;
}

.header .nav li {
	display: block;
	float:left;
	padding:0 7px;
}

.header .nav .login {
	color:#023492;
	font-size:18px;
	border:solid 2px #023492;
	text-align: center;
	line-height: 45px;
	padding:0 15px;
	display: inline-block;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	margin-top:1px;
}

.header .nav .svg {
	display:block;
	float:left;
}

.header .nav .logo-ex {
	padding-right: 0;
}


.hero-wrapper {
	width:100%;
	min-width: 1200px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#02529f+0,3adeef+100 */
	background: url(../img/bg-sherpa.png) repeat-y top center;
}

.hero {
	color:#fff;
	text-align:center;
	font-size: 17px;
	min-width: 1200px;
	max-width: 1440px;
	margin:0px auto;
	position: relative;
}

.hero .photo {
	display: block;
	width:100%;
	position: relative;
	z-index: 1;
}

.hero .text {
	position: absolute;
	width:50%;
	top:0;
	left:0;
	z-index: 3;
	padding:97px 20px 0 20px;
}

.hero h1 {
	font-size:61px;
	font-weight: 900;
	margin:0;
	line-height: 72px;
	padding:0 0 9px;
	text-shadow: 3px 1px 2px rgba(0, 0, 0, .2);
}

.hero h2 {
	font-size:21px;
	font-weight: 900;
	line-height: 32px;
	margin:0;
	padding:0 0 25px 0;
}

.hero .action-link {
	color:#fff;
	font-size:20px;
	font-weight: 800;
	line-height: 60px;
	background: #ff8d39;
	display: block;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	width:350px;
	text-align: center;
	margin:0 auto;
	margin-bottom: 15px;
}

.hero p {
	margin:0;
	padding:0 0 15px 0;
	font-size:18px;
}

.hero .secure img {
	margin:0 29px;
}

.section-heading {
	font-size:34px;
	color:#414649;
	font-weight: 900;
	padding:54px 0;
	max-width:40%;
	margin:0 auto;
	max-width: 700px;
}

.section-heading p {
	line-height: 38px;
}

.main-features {
	width:100%;
	max-width: 1177px;
	margin:0px auto;
	padding-top:0;
}

.main-features .feature {
	width:44.2%;
	padding-bottom: 65px;
	margin-left:4%;
}

.main-features .feature .icon {
	width:24%;
}

.main-features .feature.float-right .icon {
	width:26%;
}

.main-features .feature .text {
	width:76%;
	padding-right:60px;
}

.main-features .feature.float-right {
	margin:0;
}

.main-features .feature.float-right .text {
	width:74%;
	padding-right:100px;
}

.main-features .feature .text h4 {
	color:#05c9de;
	font-size:26px;
	font-weight: 600;
	margin:0;
	padding:0 0 14px;
}

.main-features .feature .text p {
	margin:0;
	padding: 0;
	font-size: 21px;
	color:#414649;
}

.features-2 {
	width:100%;
	max-width: 1385px;
	margin:0px auto;
	padding:0 0 74px 0;
}

.features-2 .feature {
	width:50%;
	border-left:solid 1px #0375e2;
}

.features-2 .feature:first-child {
	border:none;
}

.features-2 h4 {
	color:#05c9de;
	font-size:33px;
	font-weight: 600;
	margin:0;
	padding:0 0 5px;
}

.features-2 h4 strong {
	font-weight: 900;
}

.features-2 ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.features-2 li {
	font-size:22px;
	color:#414649;
	line-height: 43px;
}

.how-it-works {
	width:100%;
	margin:0px auto;
	max-width:1288px;
}

.how-it-works .feature {
	float:left;
	width:26%;
	padding:0 0 80px;
}

.how-it-works .feature.feature-1 {
	float:left;
	width:30%;
}

.how-it-works .feature.feature-2 {
	float:left;
	width:29%;
}

.how-it-works .feature.feature-3 {
	float:left;
	width:28%;
}

.how-it-works .title {
	color:#05c9de;
	font-size:29px;
	font-weight: 600;
	display: block;
	margin:0;
	padding:0 0 0;
	position:relative;
	z-index:2;
}

.how-it-works .heading {
	color:#414649;
	font-size:23px;
	font-weight: 900;
	display: block;
	margin:0;
	padding:0 0 5px;
}

.how-it-works .arrow {
	width:6.4%;
	padding-top:98px;
}

.how-it-works p {
	font-size:21px;
	color:#414649;
	line-height: 31px;
}

.how-it-works .icon {
	margin-bottom: 30px;
	position: relative;
	z-index:1;
	margin-top:-5px;
}

/* BANNER */
.banner-wrapper {
	width:100%;
	min-width: 1200px;
	padding:0 20px 27px 20px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#02529f+0,3adeef+100 */
	background: url(../img/bg-sherpa.png) repeat-y top center;
}

.banner {
	width:100%;
	max-width: 1220px;
	margin:0px auto;
	padding-top:68px;
}

.banner .sherpa {
	width:33.6%;
	float: left;
	text-align: center;
	color:#fff;
}

.banner .sherpa img {
	margin-bottom:20px;
	display: block;
}

.banner .sherpa strong {
	font-size:22px;
	font-weight: 900;
}

.banner .text {
	width:60%;
	float: right;
	color:#fff;
	padding-top:76px;
	text-align: center;
}

.banner .text p {
	font-size: 31px;
	line-height: 37px;
	width:70%;
	margin:0px auto;
}

.banner .text .heading {
	display: block;
	font-size:44px;
	line-height: 50px;
	font-weight: 900;
	text-align: center;
	padding-bottom: 41px;
}

.banner-wrapper .circle {
	display:block;
	clear:both;
	width:100%;
	text-align: center;
	position:absolute;
	z-index:5;
	left:0;
	right:0;
	min-width: 1200px;
}



/* FOOTER */
.footer-wrapper {
	background: #f6faff;
	padding:50px;
	min-width: 1200px;
}

.footer {
	font-size:15px;
	color: #00475e;
	max-width: 1250px;
	margin:0px auto;
}

.footer p {
	color: #00475e;
	font-size: 15px;
	padding-bottom:25px;
	margin:0;
}

.footer .nav {
	margin:0;
	padding-bottom:25px;
	list-style: none;
}

.footer .nav li {
	display: inline-block;
}

.footer .nav a {
	color: #00475e;
	font-weight: 900;
	padding:0 27px;
	border-right:solid 1px #00475e;
}

.footer .nav li:last-child a {
	border:none;
}

.footer .nav li:first-child a {
	padding-left:0;
}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

@media screen and (min-width:1400px){
	.show-small {
		display: none;
	}

	.show-large {
		display: block;
	}
}

@media screen and (max-width:1400px){
	
	.hero h1 {
		font-size:52px;
		line-height: 54px;
	}
	
	.hero h2 {
		font-size:19px;
		line-height: 28px;
	}
	.hero .text {
		padding:70px 20px 0 20px;
		width:55%;
	}
	
	.hero .action-link {
		margin-bottom: 30px;
	}
	.main-features {
		padding:0 30px;
	}
	.banner .text .heading {
		font-size:42px;
		line-height: 46px;
		padding-bottom: 36px;
	}
}

@media screen and (max-width:1200px){
	.hero .text {
		padding:80px 20px 0 20px;
		width:55%;
	}
	
	.hero h1 {
		font-size:48px;
		line-height: 50px;
	}
	
	.hero h2 {
		font-size:19px;
		line-height: 28px;
	}
	
	.hero .action-link {
		margin-bottom: 20px;
	}
	.main-features {
		padding:0 60px;
	}
	.main-features .feature {
		width:48%;
		padding-bottom: 65px;
	}
	.main-features .feature .text {
		width:76%;
		padding-right:30px;
	}
	.main-features .feature.float-right .text {
		width:74%;
		padding-right:30px;
	}
	.banner .text .heading {
		font-size:38px;
		line-height: 44px;
		padding-bottom: 36px;
	}

}