/* reset css */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, u, center, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, button, ul, li {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, main, section {display: block;}
body {line-height: 1;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

/* flipem.com
Prymal - 06.01.2014 */

* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	font: 62.5% "Marine", sans-serif; /* .1em = ~1px */
	-webkit-text-size-adjust: none;
	color: #fff;
	background: #fafafa;
	min-width: 98%;
	height: 100%;
}
.containme {
	margin: 0 auto;
	max-width: 1304px;
}
.contain-slider{
	margin: 0 auto;
	max-width: 1366px;
	position: relative;
}
.app-stores {
	position: absolute;
	bottom: 2em;
	right: 3em;
	z-index: 9998;
	display: inline-block;
}
.app-stores img {
	margin-left: 1em;
}
.yo-app {
	position: absolute;
	bottom: 3em;
	left: 3em;
	z-index: 9998;
	display: inline-block;
}

/* header */
header {
	background: #fff;
	padding: 19px 3.2rem 19px 1.5rem;
	min-height: 73px;
	width: 100%;
}
.fixed-header {
	left: 0;
	position: fixed;
	top: 0;
	z-index: 9999;
}
.logo {
	width: 10.90775%; /* 149px / 1366px */
	float:  left;
}

/* navigation */
nav {
	width: 85%;
	float: right;
	position: relative;
}
nav ul {
	list-style: none;
	position: absolute;
	right: 0;
}
nav li {
	display: inline-block;
	position: relative;
}
nav li {
	font: 28px "MarineUP-Bold", sans-serif;
	padding: 0 0 0 2.8em;
}
nav li a {
	color: #999;
	text-decoration: none;
	display: block;
}
nav li a:hover {
	color: #be4645;
}

/* about section */
.about {
	background: #925c91;
	padding: 68px 3.2rem 68px 3.2rem;
	font-size: 18px;
}
.about-heart {
	background: url("../images/about-collage.png") no-repeat right;	
}
.about-content {
	max-width: 625px;
}
.about h2 {
	color: #925c91;
}
.about-left {
	width: 48%;
	float: left;
}
.about-right {
	width: 50%;
	float: right;
}
.button-wrap {
	margin-top: 3.5em;
	text-align: center;
}
.button-wrap button {
	width: 190px;
	padding: .5em 0;
	font: 21px "MarineUP-Bold", sans-serif;
	color: #fff;
	margin: 0 .5em .8em 0;
	border-radius: 6px;
}
.button-wrap button.button1 {
	background: #b285b1;	
}
.button-wrap button.button2 {
	background: #2998c6;	
}
.button-wrap button.button3 {
	background: #ef7e7e;	
}
.button-wrap button.button4 {
	background: #5ba889;	
}
.button-wrap button.button5 {
	background: #aa764d;	
}
.button-wrap button.button6 {
	background: #da7961;	
}

/* features */
.features {
	background: #2998c6;
	padding: 68px 3.2rem 1rem 3.2rem;
	font-size: 18px;
}
.feature-box-wrap {
	max-width: 1116px;
	margin: 0 auto;
}
.feature-box {
	width: 38.53046%; /*430px / 1116px */
	float: left;
	margin-bottom: 4em;
}
.feature-box img {
	margin-bottom: 2em;
}
.feature-box:nth-child(odd) {
	margin-right: 19.6319%; /* 256px / 1304px */
}

/* contact */
.contact {
	background: #ef7e7e; 
	padding: 68px 3.2rem 68px 3.2rem;
	font-size: 21px;
}
.contact-rocket {
	background: url("../images/rocket.png") no-repeat right bottom;
}
.contact-wrap {
	margin-top: 2em;
}
.contact-left {
	border-right: 3px solid #fff;
	width: 50%;
	float: left;
	text-align: right;
	padding: 4em 2em 3em 0;
}
.contact-right {
	width: 50%;
	float: right;
	padding-left: 2em;
	text-align: left;
	padding: 4em 0 3em 2em;
}
.contact a {
	text-decoration: none;
	color: #fff;
}
.contact a:hover {
	text-decoration: underline;
}

/* footer */
footer {
	background: #bb3d3c;
	padding: 2em 3.2em;
	font-size: 21px;
	border-top: 13px solid #d7d5d5;
}
.footer-left {
	width: 30%;
	float: left;
	font-family: "Marine-Regular-Oblicua", sans-serif;
	margin-top: .3em;
}
.footer-bottom-left {
	margin-top: .3em;
	font-size: 10px;
}
/* unvisited link */
.footer-bottom-left a:link {
    color: #FFFFFF;
    text-decoration: none;
}

/* visited link */
.footer-bottom-left a:visited {
    color: #FFF;
    text-decoration: none;
}

/* mouse over link */
.footer-bottom-left a:hover {
    text-decoration: underline;
}

.footer-right {
	width: 70%;
	float: right;
	text-align: right;
	font-family: "MarineUP-Bold", sans-serif;	
}
footer input {
	border-radius: .4em;
	border: transparent;
	padding: .3em;
	color: #bb3d3c;
	background: #fff;
	font: 21px "Marine-Bold-Italic", sans-serif;
	max-width: 226px;
	margin-left: .5em;
}
footer input::-webkit-input-placeholder {
	color: #bb3d3c;
	opacity: .5;
}
footer input:-moz-placeholder {
	color: #bb3d3c; 
	opacity: .5; 
}
footer input::-moz-placeholder {
	color: #bb3d3c; 
	opacity: .5;
}
footer input:-ms-input-placeholder {  
	color: #bb3d3c; 
	opacity: .5;
}

/* common */
h2 {
	font: 30px "MarineUP-Bold", sans-serif;
	text-align: center;
	padding: .2em 0;
	margin-bottom: 2.5em;
	background: #fff;
	width: 254px;
	border-radius: 6px;
}
.features h2 {
	color: #2998c6;
}
.contact h2 {
	color: #ef737e;
}
.features h3 {
	font: 21px "Marine-Bold", sans-serif;
	margin-bottom: 1em;
}
.contact h3 {
	font: 30px "MarineUP-Bold", sans-serif;
	margin-bottom: 1.5em;
}
.contact h4 {
	font: 25px "MarineUP-Bold", sans-serif;
	margin-bottom: .4em;
}
h4+p {
	margin-top: 0;
}
strong {
	font-family: "Marine-Bold";
}
.slider img, .about img, .features img, .contact img {
	max-width: 100%;
	height: auto;
}
.group:after {
  content: "";
  display: table;
  clear: both;
}

/* responsive goodness */
@media screen and (max-width:1255px) { 
	.about-heart {
		background: url("../images/about-collage-transparent.png") no-repeat right;
	}
}
@media screen and (max-width:1255px) { 
	.contact-wrap {
		width: 80%;
	}
}
@media screen and (max-width:1024px) { 
	.contact-left, .contact-right {
		float: none;
		width: 50%;
		text-align: inherit;
		padding: 0;
	}
	.contact-left {
		border-right: none;
		border-bottom: 3px solid #fff;
		margin-bottom: 1em;
	}
	.contact h3 {
		margin-bottom: .5em;
	}
	.footer-left, .footer-right {
		width: 100%;
		float: none;
		text-align: inherit;
	}
}
@media screen and (max-width:760px) { 
	nav li {
		padding: 0 0 0 1.5em;
	}
	footer, .about, .features, .contact {
		font-size: 18px;
	}
	.about-heart {
		background: none;
	}
	.contact h3 {
		font-size: 25px;
	}
	.contact h4 {
		font-size: 21px;
	}	
	.app-stores {
		bottom: 2em;
	}	
	footer input {
		font-size: 21px;
		padding: .2em;
	}
}
@media screen and (max-width:650px) { 
	nav li {
		padding: 0 0 0 1em
	}	
	header, .about, .features, .contact, footer {
		padding: 1em;
	}
	.feature-box {
		float: none;
		width: 100%;
	}
}
@media screen and (max-width:555px) { 
	.logo, .contact-wrap, .contact-left, .contact-right {
		width: 100%;
		float: none;
	}
	header {
		padding-bottom: 2.1rem;
	}
	nav {
		width: 100%;
		margin: .5em 0;
	}
	nav ul {
		left: 0;
		right: inherit;
	}
	nav li {
		padding: 0 1.5em 0 0;
	}
	nav li:last-child {
		padding-right: 0;
	}
	.contact-rocket {
		background: none;
	}
}
@media screen and (max-width:480px) { 
	header {
		padding-bottom: 1.8rem;
	}
	.app-stores {
		bottom: 1em;
		right: 1em;
	}
	nav li {
		font-size: 21px;
	}
	footer input {
		margin-left: 0;
	}
}
@media screen and (max-width:450px) { 
	nav li {
		padding: 0 1em 0 0;
	}
	.app-stores img {
		max-width: 20%;
		height: auto;
		text-align: right;
	}
	.yo-app img {
		max-width: 20%;
		height: auto;
		text-align: left;
	}
}
/** load fonts **/
@font-face {
	font-family: "Marine";
	src: url("../images/fonts/2B0ECB_E_0.eot");
	src: url("../images/fonts/2B0ECB_E_0.eot?#iefix") format("embedded-opentype"),url("../images/fonts/2B0ECB_E_0.woff") format("woff"),url("../images/fonts/2B0ECB_E_0.ttf") format("truetype");
}
@font-face {
	font-family: "Marine-Bold";
	src: url("../images/fonts/2B0ECB_5_0.eot");
	src: url("../images/fonts/2B0ECB_5_0.eot?#iefix") format("embedded-opentype"),url("../images/fonts/2B0ECB_5_0.woff") format("woff"),url("../images/fonts/2B0ECB_5_0.ttf") format("truetype");
}
@font-face {
	font-family: "Marine-Bold-Italic";
	src: url("../images/fonts/2B0ECB_7_0.eot");
	src: url("../images/fonts/2B0ECB_7_0.eot?#iefix") format("embedded-opentype"),url("../images/fonts/2B0ECB_7_0.woff") format("woff"),url("../images/fonts/2B0ECB_7_0.ttf") format("truetype");
}
@font-face {
	font-family: "MarineUP-Bold";
	src: url("../images/fonts/2B0ECB_2_0.eot");
	src: url("../images/fonts/2B0ECB_2_0.eot?#iefix") format("embedded-opentype"),url("../images/fonts/2B0ECB_2_0.woff") format("woff"),url("../images/fonts/2B0ECB_2_0.ttf") format("truetype");
}
@font-face {
	font-family: "Marine-Regular-Oblicua";
	src: url("../images/fonts/2B0ECB_D_0.eot");
	src: url("../images/fonts/2B0ECB_D_0.eot?#iefix") format("embedded-opentype"),url("../images/fonts/2B0ECB_D_0.woff") format("woff"),url("../images/fonts/2B0ECB_D_0.ttf") format("truetype");
}