/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,html [type="button"],/* 1 */
[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,/* 1 */
menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none}


/*! 24 column responsive grid system v3.0 | responsive.gs */
.col { display: block;float: left;width: 100%;}@media ( min-width : 768px ) {.gutters .col {margin-left: 2%;}.gutters .col:first-child { margin-left: 0; }}@media ( min-width : 768px ) { .span_1 { width: 4.16666666667%; }.span_2 { width: 8.33333333333%; }.span_3 { width:12.5%; }.span_4 { width: 16.6666666667%; }.span_5 { width: 20.8333333333%; }.span_6 { width: 25%; }.span_7 { width: 29.1666666667%; }.span_8 { width: 33.3333333333%; }.span_9 { width: 37.5%; }.span_10 { width: 41.6666666667%; }.span_11 { width: 45.8333333333%; }.span_12 { width: 50%; }.span_13 { width: 54.1666666667%; }.span_14 { width: 58.3333333333%; }.span_15 { width: 62.5%; }.span_16 { width: 66.6666666667%; }.span_17 { width: 70.8333333333%; }.span_18 { width: 75%; }.span_19 { width: 79.1666666667%; }.span_20 { width: 83.3333333333%; }.span_21 { width: 87.5%; }.span_22 { width: 91.6666666667%; }.span_23 { width: 95.8333333333%; }.span_24 { width: 100%; }.gutters .span_1 { width: 2.25%; }.gutters .span_2 { width: 6.5%; }.gutters .span_3 { width: 10.75%; }.gutters .span_4 { width: 15.0%; }.gutters .span_5 { width: 19.25%; }.gutters .span_6 { width: 23.5%; }.gutters .span_7 { width: 27.75%; }.gutters .span_8 { width: 32.0%; }.gutters .span_9 { width: 36.25%; }.gutters .span_10 { width: 40.5%; }.gutters .span_11 { width: 44.75%; }.gutters .span_12 { width: 49.0%; }.gutters .span_13 { width: 53.25%; }.gutters .span_14 { width: 57.5%; }.gutters .span_15 { width: 61.75%; }.gutters .span_16 { width: 66.0%; }.gutters .span_17 { width: 70.25%; }.gutters .span_18 { width: 74.5%; }.gutters .span_19 { width: 78.75%; }.gutters .span_20 { width: 83.0%; }.gutters .span_21 { width: 87.25%; }.gutters .span_22 { width: 91.5%; }.gutters .span_23 { width: 95.75%; }.gutters .span_24 { width: 100%; }}
.row {padding-bottom: 5px;} 


/*! Based on HTML5 Boilerplate | MIT License | http://h5bp.com/ */

/*--------------------------------------
------  Primary Website Styles -------
---------------------------------------*/
			


* { 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	margin: auto;
	width: 100%;
	text-align: left;
	background: #f7f7f7;
}

body, select, input, textarea, button {
	font: 15px/2em 'Open Sans', Helvetica, Helvetica Neue, Arial, sans-serif;
	color: #273a47;
}

::-moz-selection{ background: #097bc0; color:#fff; text-shadow: none; }
::selection { background:#097bc0; color:#fff; text-shadow: none; } 

a, a:active, a:visited {
	color: #1aa8a9;
	text-decoration: underline;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

a:hover {
	color: #00b3af;
	text-decoration: none;
}

h1,h2,h3,h4,h5,h6 {
	margin: 1em 0 0.2em 0;
	line-height: normal;
	font-weight: 600;
}

h1 { font-size: 2em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }

p {
	margin: 1.2em 0;
}

img {
	display: block;
	max-width: 100%;
	width: auto;
	height: auto;
}



/* Micro Clearfix: http://nicolasgallagher.com/micro-clearfix-hack/ */
.container:after, .row:after, .col:after, .group:after, .cf:before,.cf:after{content:"";display:table;}
.container:after, .row:after, .col:after, .group:after, .cf:after{clear:both;}
.container, .row, .col, .group, .cf{*zoom:1;}
.clear { clear: both; }



/* STRUCTURE */

.wrapper-wide {
	margin:0 auto;
	max-width:1200px;
}

.wrapper-narrow {
	margin:0 auto;
	max-width:920px;
}

@media only screen and (max-width: 1199px) {

	.wrapper-narrow,
	.wrapper-wide {
		padding-left: 20px;
		padding-right: 20px;
	}

}





/* ==== Header */

header {
	padding-top: 30px;
}

header a#logo {
	float: left;
	width: 180px;
}

header a#tel {
	float: right;
	color:#273a47;
	font-size: 20px;
	font-weight: 700;
	text-decoration: none;
	margin-top: 25px;
	margin-right: 30px;
}

@media only screen and (max-width: 570px) {
	header a#tel {
		clear: both;
		display: block;
		margin: 20px 0 0 0;
		text-align: center;
		width: 100%;
	}
}

header a#tel span {
	font-weight: normal;
}


header nav {
	margin-top: 25px;
	float: right;
	position: relative;
}

/* Nav reset */
header nav ul,
header nav li {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Nav btn */
header nav > a {
	color: #273a47 !important;
	font-weight: bold;
	background: #f8c44f;
	border-radius: 30px;
	font-size: 18px;
	text-transform: uppercase
	line-height: 0em;
	padding: 10px 15px 10px 20px;
	box-shadow: 5px 5px 0px 0px #c19123;
	cursor: pointer;
	text-decoration: none;
	display: block;
	position:relative;
	top: -10px;
}

header nav > a > i {
	font-size: 12px;
	position: relative;
	bottom: 2px;
}

/* Burger menu */

@media only screen and (max-width: 767px) {
	
	header nav > a {
		padding: 30px 20px;
		top: -20px;
	}

	header nav > a span,
	header nav > a i {
		display: none;
	}

	header nav > a b
	{
		width:30px;
		height:5px;
		background-color:#333;
		border-radius:5px;
		position:relative;
		top: -10px;
		display: block;
	}

	header nav > a b:after, header nav > a b:before
	{
		content: '';
		width: 100%;
		height:5px;
		background-color:#333;
		position:absolute;
		border-radius:5px;
	}

	header nav > a b:after
	{
		top:10px;
	}

	header nav > a b:before
	{
		top:20px;
	}

}




/* Nav fold down panel */

header nav > div, nav:active > div {
	max-height: 0px;
	overflow: hidden;
	position: absolute;
	z-index: 1;
	right: 5px;
	top: 35px;
	width: calc(100vw - 40px);
	max-width: 400px;
	transition: max-height 0.2s;
	background: rgba(0, 0, 0, 0.3);
	border-radius: 5px;
}

header nav:hover > div {
	display: block;
	max-height: 2000px;
}


@keyframes animatedBackground {
    0% { background-position: 100% 250%; }
    30% { background-position: 100% 250%; }
    100% { background-position: 100% 100%; }
}

header nav > div > ul, nav:active > div > ul {
	background: #fff url(../img/nav-rocket.png) 100% 250% no-repeat;
}

header nav:hover > div > ul {
	animation: animatedBackground 0.7s ease-in-out;
	background-position: 100% 100%;
}



/* Nav panel contents */
header nav div > ul {
	margin: 10px;
	padding-bottom: 10px;
}

header nav ul li a,
header nav ul li span {
	color: #333333 !important;
	display: block;
	padding: 5px 20px;
	text-decoration: none;
}

header nav ul li a:hover {
	text-decoration: underline;
}


header nav ul > li > ul li:first-child {
	padding-top: 10px;
}

header nav ul > li > ul li:last-child {
	padding-bottom: 15px;
}

header nav ul li span {
	font-weight: bold;
	color: #fff !important;
}

header nav ul li:nth-child(1) span {
	background: #1aa8a9;
	font-size: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
}

header nav ul li:nth-child(2) span {
	background: #bc1f6b;
}

header nav ul li:nth-child(3) span {
	background: #f7961e;
}

header nav ul li a {
	font-size: 19px;
}

header nav ul li.smaller a {
	font-size: 13px;
	padding: 1px 20px;
}















/* HOME */

#home #rainbow-header {
	background: url(../img/rainbow-header.png) 50% 50%;
	background-size: cover;
	color: #fff;
}

#home header a#tel {
	color: #fff;
}



#home .banner {
	padding-top: 80px;
	background: url(../img/clouds.png) 100% 100% no-repeat;
}

#home .banner .wrapper-wide {
	position: relative;
	padding-bottom: 180px;
}

#home .banner img {
	position: absolute;
	bottom: 5px;
	right: 0;
}

#home .banner img:hover {
	bottom: 3px;
	animation: bounce 0.2s infinite;
	filter: drop-shadow(0px 0px 4px rgba(255, 255, 255, 0.42));
}

@keyframes bounce {
	0%, 20%, 60%, 100% {transform: translateY(0);}
	40% {transform: translateY(-0.75px);}
	80% {transform: translateY(0.75px);}
}

#home .banner-content h3 {
	font-size: 40px;
	margin-top: 0;
}

#home .banner-content .btn-yellow {
	margin-top: 30px;
}

#home .banner-content p strong {
	font-size: 26px;
	font-weight: normal;
}

 




#home #third-party-logos {
	position: relative;
	background: #fff;
	padding: 0 40px;
	-webkit-box-shadow: 0 5px 0px 0px rgba(0, 0, 0, 0.1);;
    -moz-box-shadow: 0 5px 0px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 0px 0px rgba(0, 0, 0, 0.1);
    margin-bottom: 40px;
}

#home #third-party-logos img {
	padding: 40px 40px;
}

#home #third-party-logos .prev,
#home #third-party-logos .next {
	font-size: 30px;
	position: absolute;
	top: 40%;
	cursor: pointer;
	color: #d4d3d3;
	-moz-transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in;
}

#home #third-party-logos .prev:hover,
#home #third-party-logos .next:hover {
	color: #283a47;
}

#home #third-party-logos .next {
	right: 10px;
}

#home #third-party-logos .prev {
	left: 10px;
}

@media only screen and (min-width: 1199px) {

	#home #third-party-logos .prev,
	#home #third-party-logos .next {
		display: none;
	}
	
}






#home main section {
	margin-bottom: 20px;
}






#home #how-seo-helps h3 {
	margin-bottom: 20px;
}

#home #how-seo-helps .col {
	background: #fff;
	border: 1px solid #bdbdbd;
	border-radius: 10px;
	padding: 20px;
	margin-bottom: 20px;
}

#home #how-seo-helps .col *:first-child {
	margin-top: 0;
}

#home #how-seo-helps .col *:last-child {
	margin-bottom: 0;
}

#home #how-seo-helps .col h4 {
	font-size: 18px;
}

#home #how-seo-helps .col p {
	font-size: 14px;
	line-height: 1.8em;
}













#home #five-stages {
	padding: 0 !important;
	max-width: 1400px;
	margin: 0 auto;
}



#home #five-stages h2 {
	margin-bottom: 20px;
}


#home #five-stages .span_fifth {
	padding: 40px 20px;
}

#home #five-stages .span_fifth:nth-of-type(1) {
	background: #1aa8a9;
}

#home #five-stages .span_fifth:nth-of-type(2) {
	background: #263b8e;
}

#home #five-stages .span_fifth:nth-of-type(3) {
	background: #752f92;
}

#home #five-stages .span_fifth:nth-of-type(4) {
	background: #ed1f61;
}

#home #five-stages .span_fifth:nth-of-type(5) {
	background: #f7961e;
}

#home #five-stages svg {
	width: 40px;
	height: auto;
	fill: #fff;
	float: left;
}

#home #five-stages h3 {
	font-size: 14px;
	margin: 0 0 0 50px;
	color: #fff;
	min-height: 40px;
}

#home #five-stages p {
	font-size: 13px;
	line-height: 1.5em;
	color: #fff;
}

@media only screen and (min-width: 768px) and (max-width: 920px) {

	#home #five-stages svg {
		float: none;
		text-align: center;
		display: block;
		margin: 0 auto 20px auto;
	}
	#home #five-stages h3 {
		margin-left: 0;
	}
}


@media only screen and (max-width: 768px) {
	#home #five-stages h3 {
		font-size: 16px;
		padding-top: 10px;
	}

	#home #five-stages p {
		font-size: 15px;
	}
}














@media only screen and (min-width: 768px) {
	#home .flex {
		display: flex;
	}
}










/* ==== Various */

.btn-yellow {
	color: #273a47 !important;
	font-weight: bold;
	background: #f8c44f;
	border-radius: 30px;
	font-size: 18px;
	line-height: 0em;
	padding: 25px 30px 25px 30px;
	box-shadow: 5px 5px 0px 0px #c19123;
}

.btn-yellow,
.btn-yellow span,
.btn-yellow span b {
	text-decoration: none;
	position: relative;
    transition: all .25s cubic-bezier(.19,1,.22,1);
	display: inline-block;
	bottom: 0;
}


.btn-yellow span:after {
    display: block;
    transition: all .25s cubic-bezier(.19,1,.22,1);
    content: "";
    height: 3px;
    width: 0;
    bottom: -11px;
    position: absolute;
    background-color: #273a47;
}

.btn-yellow:hover span b {
	bottom: 2px;
}

.btn-yellow:active span:after, .btn-yellow:focus span:after, .btn-yellow:hover span:after {
    width: 100%;
}





/* ==== Main content area */

main {
	padding-bottom: 150px;
}









/* ==== Footer */

footer {
	background: #273a47;
	color: #fff;
}

footer #lets-chat {
    background: #fff;
    color: #273a47;
    position: relative;
    top: -80px;
    padding: 50px;
    -webkit-box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, 0.1);
    text-align: center;
}



footer #lets-chat h6 {
	font-size: 36px;
	margin: 0 0 20px 0;
}

footer #lets-chat p {
	font-size: 24px;
	font-weight: 500;
	margin: 30px 0;
}

footer #lets-chat a {
	color: #00b3af;
	font-weight: 600;
}

footer #lets-chat *:last-child {
    margin-bottom: 0;
    font-size: 30px;
}

@media only screen and (max-width: 550px) {
	footer #lets-chat {
		padding-left: 20px;
		padding-right: 20px;
	}

	footer #lets-chat a {
		display: block;
		white-space: nowrap;
  		overflow: hidden;
  		text-overflow: ellipsis;
	}

	footer #lets-chat *:last-child {
		font-size: 25px;
	}
}

.align-center {
	text-align: center;
}