/*
Theme Name: AvioClean
Theme URI: www.creationalstate.com
Description: AvioFuel Landing Page
Author: Luis Glez
Author URI: www.creationalstate.com/#aboutme
Tags: html5, clean, responsive, CSS3
*/

@charset "UTF-8";

/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
html {font-family: sans-serif;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
body {margin: 0;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {display: block;}
audio,canvas,progress,video {display: inline-block;vertical-align: baseline;}
audio:not([controls]) {display: none;height: 0;}
[hidden],template {display: none;}
a {background: transparent;}
a:active,a:hover {outline: 0;}
abbr[title] {border-bottom: 1px dotted;}
b,strong {font-weight: bold;}
dfn {font-style: italic;}
h1 {font-size: 2em;margin: 0.67em 0;}
mark {background: #ff0;color: #000;}
small {font-size: 80%; }
sub,sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
img {border: 0;}
svg:not(:root) {overflow: hidden;}
figure {margin: 1em 40px;}
hr {-moz-box-sizing: content-box;box-sizing: content-box;height: 0;}
pre {overflow: auto;}
code,kbd,pre,samp {font-family: monospace, monospace;font-size: 1em;}
button,input,optgroup,select,textarea {color: inherit;font: inherit;margin: 0;}
button {overflow: visible;}
button,select {text-transform: none;}
button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance: button;cursor: pointer;}
button[disabled],html input[disabled] {cursor: default;}
button::-moz-focus-inner,input::-moz-focus-inner {border: 0;padding: 0;}
input {line-height: normal;}
input[type="checkbox"],input[type="radio"] {box-sizing: border-box;padding: 0;}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {height: auto;}
input[type="search"] {-webkit-appearance: textfield;-moz-box-sizing: content-box;-webkit-box-sizing: content-box;box-sizing: content-box;}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
fieldset {border: 1px solid #c0c0c0;margin: 0 2px;padding: 0.35em 0.625em 0.75em;}
legend {border: 0;padding: 0;}
textarea {overflow: auto;}
optgroup {font-weight: bold;}
table {border-collapse: collapse;border-spacing: 0;}
td,th {padding: 0;}

/* ---------------------  General -------------------- */

html, body { height: 100% }
html { 
	font-size: 100%; 
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

body { 
	font-family: -apple-system, system-ui, BlinkMacSystemFont, 'SF UI Text', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 18px;
	line-height: 1.52947;
    font-weight: 400;
    letter-spacing: normal;
	text-rendering: optimizeLegibility;
	overflow: auto;
	color: #363a3a;
	/*background-color: #eef2f2;*/
	background: #282e32;
	word-spacing: normal;
	text-rendering: optimizeLegibility;
	font-synthesis: none;
 	-moz-font-feature-settings: 'kern';
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
}

b, strong { font-weight: 600; color: #3c3c3c; font-size: inherit; }

h1, h2, h3, h4, h5, h6 {
	font-weight: 600; 
	margin-bottom: 0.60em; 
	margin-top: 0.60em; 
	text-transform: none; 
	color: #333; 
	letter-spacing: normal;
}

h1 { line-height: 1.1em; font-size: 2.4em; }
h2 { line-height: 1.3em; font-size: 2.0em; }
h3 { line-height: 1.3em; font-size: 1.6em; }
h4 { line-height: 1.3em; font-size: 1.4em; }
h5 { line-height: 1.3em; font-size: 1.2em; }
h6 { line-height: 1.3em; font-size: 1.0em; }

@media screen and (max-width: 62em) {
	h2.titulo, .inverso h2.titulo { font-size: 2.4em; line-height: 1.4; }
}

@media screen and (max-width: 52em) {
	h2.titulo, .inverso h2.titulo { font-size: 2.0em; line-height: 1.4; }
}

@media screen and (max-width: 34em) {
	h2.titulo, .inverso h2.titulo { font-size: 1.4em; }
	.texto-izquierda { text-align: center; }
	section.azul-aviofuel h3.titulo { font-size: 26px;}
}

blockquote, pre, p, ul, ol, dl, hr { margin-top: 0 }
p, ul, ol, dl, hr, form, table { margin-bottom: 1.5em }
ul, ol { line-height: 1.6;}
hr { border-top:1px solid #999 }
blockquote>:last-child, ul>:last-child, ol>:last-child, dl>:last-child { margin-bottom: 0 }
aside { display: none }
li ul,li ol { margin: 0.6em 0 }
dt { font-weight:bolder }
dd { margin-left:0; margin-bottom:0.75em; font-style:italic }
caption { padding-bottom:.5em; font-style:italic }
th,td { padding:.25em .5em; border:1px solid #999 }
tr:nth-child(odd) td { background-color:#F6F6F6 }
th,legend { font-weight:bolder; background:#cdccb7 }
label { display:block; padding-bottom:.25em; font-weight:300 }

.left { float:left }
.right { float:right }

input, select, textarea { 
	padding: .5em; 
	border: 1px solid; 
	-webkit-box-shadow: 0,0,3px,0.1; 
	-moz-box-shadow: 0,0,3px,0.1; 
	box-shadow: 0,0,3px,0.1; 
	color: #666; 
	background-color: #FFF; 
	border-color: #666 #CCC #CCC #666
}

button, .btn:link, input[type=submit] { display: inline-block; padding: 0.9em 2em 0.9em }

blockquote, cite { display: block; position: relative; padding: 0 2em 2em; font-family: "ff-meta-serif-web-pro", serif; color: #777; }
blockquote p, cite p { font-size: 1.0em; color: #666; }

@media screen and (min-width: 52em) {
	blockquote { padding-left: 2em; padding-right: 2em }
}

@media screen and (max-width: 52em) {
	blockquote p { font-size: 1.0em }
}

/* ---------------------- LINKS ------------------------ */

/*a:active, a:focus { position: relative; top: 1px }*/
a { text-decoration: none; color: #139dac; font-weight: inherit; }
a:visited { color: #139dac }
a:hover { color: #139dac; text-decoration: none; }

a, a.img, img a { outline: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
a img { border:none; }

.more { border: 1px solid #aaa; border-radius: 5px; padding: 3px 8px; margin-left:5px; }
.more:hover { background: #ddd; color: #fff; }


/* --------------------- ICONS ---------------------- */

.menu-social { position: relative;  display: block; padding: 0; margin: 10px 8px 0 0; }
.menu-social ul { float: right; margin: 0 0 50px;  }
.menu-social ul, .menu-social li { list-style: none; list-style-type: none;}
.menu-social li { float: left; display: block; padding: 0 0.8em; font-size: 13px; font-weight: 300; }
.menu-social li a { color: #ddd; }
.menu-social li.current a { font-weight: bold}

@media screen and (max-width: 42em){
	.menu-social { margin-bottom: 0; padding-bottom: 40px;}
	.menu-social ul { margin-top: 1em; float: none; margin-left: 12px; }
}

a.logo-doble {
	display: block;
	width: 40px;
	height: 40px;
	background: url('./img/logo/logo_doble.png') 0 0 no-repeat;
	background-size: 40px 40px;
}

a.logo-doble:hover { background-position: 0 -40px; }

.top-logo { 
	position: absolute; 
	top: 25px; 
	right: 35px; 
}

.top-logo a img { 
	width: 30px; 
	height: 30px; 
	float: left;
	margin-right: 9px;
	margin-top: 1px;
}

.top-logo span { 
	font-family: Menlo, monospace;
	font-size: 17px;
	letter-spacing: 1px;
	color: rgba(255,255,255,0.8); 
}

.main-logo { float: left; width: 220px; margin-bottom: 20px }
.main-logo a { text-decoration: none; color: #dadada; }

.main-logo .title {
	font-family: Menlo, monospace;
	font-size: 16px; 
	margin-top: 2px; 
	color: var(--text-color); 
	letter-spacing: 1px;
	float: left;
}

.main-logo .subtitle { font-size: 10px; text-transform: uppercase; letter-spacing: 6px;  line-height: 1.0}

h1.title .light {font-weight: 300; font-size: 28px; color: var(--text-color); }

.main-logo a img {
	float: left;
	width: 30px;
	height: 30px;
	margin-right: 10px;
}

@media screen and (max-width: 42em){
	.main-logo { display: none; }
}


/* ------------------------- LAYOUT --------------------------- */

.container {
	opacity: 1; 
	max-width: 68em;
	width: 95%; 
	padding: 2em 0 2em;
	margin: 0 auto;
}

.container.full { max-width: 600px; width: 90%}

.container img { opacity: 1 }

.contenido {
	display: block; 
	position: relative; 
	padding: 0; 
	margin: 0 auto; 
	text-align:left;
	/*letter-spacing: -0.31em;*/
}

.contenido > .contenido { overflow: hidden; margin-right: 0; margin-left: 0 }
.contenido-centrado { text-align:left }
.inner-content { max-width: 42em; margin: 0 auto; padding-top: 1em; }

@media screen and (max-width: 32em) {
	.container { padding:0 }
	.contenido { padding: 0 0.7em 0; }
}

.celda {
	-moz-box-sizing: border-box; 
	box-sizing: border-box; 
	width: 100%; 
	display: inline-block; 
	padding: 0 1em;
	vertical-align: top; 
	text-align: left;  
	word-spacing: normal; 
	word-break: break-word;
}

.celda-centrada { display: block; margin: 0 auto; }
.texto-izquierda { width: 62%; display: block; position: relative; float: left; margin-left: 1em  }
.texto-derecha { width: 62%; display: block; position: relative; float: right; }

.wrapper { padding: 10px 20px 0}

/* ----- tweaks ------ */

.texto-untercio { margin-bottom: 0; padding-bottom: 0;margin-top: 5px;}
.texto-untercio p { font-size: 15px; }
.texto-untercio h3 { margin-bottom: 5px; font-size: 1.4em; line-height: 1.3em; font-weight: 300 }

@media screen and (min-width: 46em) {
	.texto-untercio { width: 32%; padding: 0 1em 0; line-height: 1.4em;}
	.contenido-centrado { text-align: center}
}

@media screen and (max-width: 58em) {
	.texto-untercio h3 { margin-top: 1.0em; font-size: 1.2em;}
	.texto-untercio p { font-size: 14px; }
}

@media screen and (max-width: 56em) {
	.texto-untercio img { margin-top: -5px }
}

@media screen and (max-width: 42em) {
	.texto-untercio img { margin-top:-10px}
}

@media screen and (max-width: 32em) {
	.texto-izquierda, .texto-derecha { width: 100%; text-align: center; margin:0; padding: 0;}
	.texto-untercio img { margin-top: 0}
	.texto-untercio h3 { margin-top: 0px}
}

/* ----------------- FOOTER -------------------- */

#aboutme p { margin-bottom: 0; padding-bottom: 0; margin-top: 15px}

footer { display: block; position: relative; width:100%; margin:0; padding: 0; background: #282e32; text-align: center; overflow: hidden; text-shadow: none;}
p.copyright { color: #bbb; font-size: 13px; margin: 5px 0 0; padding: 0;  }
p.copyright a { color: #eaeaea; font-weight: 400; }
footer a:hover { color: #139dac }

.footer-wrapper { max-width: 72em; margin: 0 auto 0; padding: 0 60px 0; }

.footer-info2 { float: right; display: block; position: relative; margin-right: 0; }

.footer-logo { float: left; display: block; position: relative; padding: 0 0 0 20px;  }
.footer-logo p { font-size: 13px; color: #888; margin: 0; padding: 0; line-height: 1.4; text-align: left; }
.footer-logo a { display: block; height: 60px; width: auto; float: left; word-spacing: normal; }
.footer-logo a img { float: left; width: 40px; height: 40px; padding-left: 15px; padding-right: 10px; }
.footer-logo h1 { font-weight: 300; font-size: 20px; color: #aaa; letter-spacing: 2px; float: left; line-height: 0.5em; text-transform: lowercase; font-variant: small-caps }
.footer-logo h1 strong { font-weight: 600; color: #f0f0f0; letter-spacing: 4px; float: none; font-size: 20px}
.footer-logo a:hover strong { color: #139dac; }
.footer-logo a:hover h1, .footer-logo a:hover h2 { color: #139dac; }

.footer-logo h2 { margin: 0 0 0 2px; padding: 0; clear: both; color: #999; font-size: 14px; line-height: 0.5em; text-align: left; font-weight: 300; letter-spacing: 1px; }
.footer-logo a:hover { text-decoration: none; }

.footer-press { float: none; text-align: center; margin: 0; padding: 10px 0 10px; clear:both; width: 100%; }

.footer2 { background: transparent; padding-bottom: 1em }
.footer3 { padding-top: 30px; }

p.copyright { display: block; float: right; line-height: 20px; padding-top:0; margin-top:-15px; margin-right: 20px; }

@media screen and (max-width: 52em) {
	.main-logo { float: none; }
	footer { width:100% }
}

@media screen and (max-width: 42em) {
	.footer3 { width: 100%;}
	.footer-wrapper { width: 100%; padding: 0; text-align: center; }
	.footer-logo { display: none;}
	.footer-info { float: none; margin: 0 auto; text-align: center; }
	.menu-social ul, .menu-social ul li { margin: 0; padding: 0;}
	.menu-social ul li { width: 32.5% }
	p.copyright { margin: 0; padding: 20px 0 0; text-align: center; float: none; clear: both; }
}

@media screen and (max-width: 34em){
	.contenido-centrado { text-align:center; }
}

/* ------------------ HEADER --------------------- */

header { 
	width: 100%;
	height: 65px;
	overflow-y: hidden;
	z-index: 999; 
	display: block;
}

header.movil {
	background-color: transparent;
	position: absolute;
	top:0;
	left:0;
}

header.inicio {
	position: relative;
	background-color: transparent;
}

.nav-up { top: -65px; }

.header-wrapper { 
 	width: 95%;
 	max-width: 82em;
 	margin: 0 auto;
}

h2.logo-header a { 
	display: block; position: absolute; top: 5px; left: 40px;
	font-weight: 300; 
	font-size: 20px; 
	letter-spacing: 1px; 
	position: absolute;
	text-transform: lowercase; 
	font-variant: small-caps; 
	float: left;
	color: #f0f0f0;
	text-decoration: none;
}

h2.logo-header a:hover { color: rgba(255, 255, 255, 1); }
h2.logo-header a strong { font-weight: 600; font-size: 20px; letter-spacing: 2px;}

.header-gradient {
	display: block;
	position: absolute;
	top: 0; left:0;
	width: 100%;
	height: 250px;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}

.logo, .logo-mini {   }
.logo a, .logo-mini a { text-decoration: none; color: #666; }
.logo-mini { display: none; }
.logo a img { width: 50px; height: 50px; }
.logo h1 { font-weight: 400; font-size: 22px; letter-spacing: normal; text-transform: uppercase; position: fixed; top: 5px; left: 5px; }
.logo h1 strong { font-weight: 400; color: #333; letter-spacing: normal; }
.logo a:hover strong { color: #139dac; }
.logo a:hover h1, .logo a:hover h2 { color: #139dac; }

.logo-mini h1 { font-weight: 500; font-size: 20px; letter-spacing: 1px; text-transform: uppercase; line-height: 45px; margin: 3px 0 0; padding: 0;}


@media screen and (max-width: 62em) {
	header, .header-main { height: 55px; }
	.nav-up { top: -55px; }
	.pagina, .categoria { margin-top: 55px;}
	.logo h1 { font-size: 20px; line-height: 55px;}
	.logo a img { width: 50px; height: 50px; margin-top: 2px; }
}

@media screen and (max-width: 42em) {
	header, .header-main { height: 46px;}
	.nav-up { top: -46px; }
	.pagina, .categoria { margin-top: 46px;}
	.logo h1 { font-size: 18px; line-height: 46px; letter-spacing: normal; }
	.logo a img { max-width: 40px; height: auto; margin-top: -8px; }
	h2.logo-header a { left: 15px; top: 0; letter-spacing: 2px;}
}

@media screen and (max-width: 34em){
	.logo a img { height: auto; padding: 0; margin:-6px 0 0 10px;}
}

/* ----------------------- MAIN MENU ------------------------- */

.nav-principal {
	text-transform: uppercase;   
	position: relative;
	display: block;
	float: right;
	font-weight: 400;
	font-size: 15px;
	margin-top:3px;
}

.logo-image { vertical-align: middle; width: 40px; height: 40px; margin-top: -4px}



.nav-principal ul { line-height: 65px; float: right; list-style: none; list-style-type: none; margin: 0; padding: 0 }
.nav-principal ul li { float: left;}
.nav-principal ul li a { color: #fff; display: inline-block; padding: 0 1.0em 0; }

.nav-principal ul li a:hover { 
	text-decoration: none;
	color: #aaa;
}

.nav-principal ul li.current-menu-item a { 
	color: #333; font-weight: 500; border-bottom: 1px solid #aaa;
}

@media screen and (max-width: 62em) {
	.logo-image { width: 30px; height: 30px; margin-top: -2px;}
	.nav-principal ul { line-height: 55px; }
}

@media screen and (max-width: 52em) {
	.nav-principal ul li a { padding: 0 1.2em 0; }
}

@media screen and (max-width: 42em) {
	.nav-principal ul { line-height: 46px; }
	.logo-image { width: 28px; height: 28px; margin-top: -3px;}
	.nav-principal ul li a { padding: 0 0.5em 0 0.5em; }
}

@media screen and (max-width: 34em) {
	.nav-principal { font-size: 13px; }
	.nav-principal ul:first-child { padding-left:0;}
	.nav-principal ul li a { padding: 0 1.0em 0 1.0em; }
	.logo { display: none}
	.logo-mini { display: block; }
}

.nav-principal ul li a.toggle { color: #3c4147; text-align: center }

/*--------------------- INTRO PAGE ------------------------ */

section.anima { display: block;	}
section.anima:after { content:""; display: block; clear: both; }

.anima { height: 100%; }

.celda-izquierda { width: 49%; height: 100%; float: left;  }
.celda-derecha { width: 49%; height: 100%; float: left; }

article.texto-centrado p { max-width: 46em; margin: 0 auto; }

.anima img.iphone { 
	width: auto;
	height: 80%;
	max-height: 925px;
	float: right;
}


a#go-features, a#go-features:active { position: relative; margin-left: 5px; margin-top: 2.5em; color: #555}

.anima .home {
	display: table;
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	background: url("./img/g450-6.jpg") center right no-repeat;
	background-size: cover;
}

.anima .home .intro-izquierda {
	display: table-cell;
	vertical-align: middle;
	width: 50%;
	height: 100%;
	padding: 0;
}

.imagen-home {
	max-width: 550px;
	height: 75%;
	background: url('./img/i6.png') center right no-repeat;
	background-size: contain;
	text-indent: -9999px;
	margin: 0 auto;
}

.anima .home .intro-derecha { 
	display: table-cell;
	vertical-align: middle;
	text-align: left;
}

.texto-home { margin-left: 30px; padding-right: 20px}

.texto-home h1.linea1 {
	font-size: 70px; 
	letter-spacing: 1px;   
	line-height: 1.3em;
	color: #fff;
	font-weight: 600;
	text-transform: none;
	margin: 0;
	padding: 0;
	text-shadow: 0px 1px 2px rgba(0,0,0,0.3);
}

.texto-home h1.linea1 strong { font-weight: 600; color: rgba(255,255,255,0.90); letter-spacing: 1px; }

.texto-home h2.linea2 {
	font-size: 28px;
	letter-spacing: normal;
	margin: 0 0 0 2px;
	padding: 0;
	line-height: 1.2em;
	font-weight: 400;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 0 1px 1px rgba(0,0,0,0.3);
	max-width: 250px;
}

.celda-derecha { margin-top: 80px; }
.celda-derecha h3 { margin-top: 60px; margin-bottom: 10px;}
.celda-izquierda img { width: 415px; height: auto; float: right; margin-right: 60px; }
.celda-derecha img { max-width: 95%; height: auto; }

@media screen and (max-width: 52em) {
	.celda-izquierda img { width: 300px; height: auto; }
	.celda-derecha { margin-top: 20px;}
	.celda-derecha p, .inverso .celda-derecha p, #family p { font-size: 18px; }
	.celda-derecha h3 { font-size: 1.5em; margin-top: 20px; }
	.texto-home h1.linea1 { font-size: 3.4em; }
	.texto-home h2.linea2 { font-size: 1.5em; }
}

@media screen and (max-width: 42em) {
	.celda-izquierda img { width: 285px; height: auto; }
	.celda-derecha { margin-top: 5px; }
	.texto-home { margin-left: 20px; padding-right: 10px}
	.texto-home h1.linea1 { font-size: 2.4em; letter-spacing: normal; text-shadow: 0px 1px 1px rgba(0,0,0,0.3); }
	.texto-home h2.linea2 { font-size: 1.1em; letter-spacing: normal; text-shadow: 0px 1px 1px rgba(0,0,0,0.3);}
}

@media screen and (max-width: 32em) {
	.texto-home { margin-left: 10px; }
	.celda-izquierda, .celda-derecha { width: 100%; }
	.celda-derecha { margin-top: 0; }
	.celda-derecha h3 { margin-top: 40px; font-size: 1.4em; }
	.celda-izquierda img { width: 100%; height: auto; margin: 0 auto 0; padding: 0; float: none; }
}

@media screen and (max-width: 340px) {
	.texto-home { margin-left: 5px; }
	.texto-home h1.linea1 { font-size: 2.2em; }
	.texto-home h2.linea2 { font-size: 1.0em; }
}

.feature { min-height: 300px; position: relative; }
.table { display: table; position: relative; margin: 0 auto; max-width: 60em; width: 90% }
.content { margin: 0 auto; width: 90%; max-width: 31.25em; position: relative; overflow: hidden; }
.table .content { padding: 1em 0 2em; display: table-cell; vertical-align: middle; width: 100% }

.azul-aviofuel { background: #609bae; }
section.azul-aviofuel p { color: rgba(255, 255, 255, 0.8); }

/* =========== App Store Badge & Video Review ========== */

.appstore {  text-align: center; }
.appstore h3 { font-weight: 300; margin-top:0; }
.store-badge  { margin: 40px auto 20px; }
.store-badge a {
	display: block;
	position: relative;
	width: 250px;
	height: 74px;
	background: url('../img/appstore_badge_original.png') 0 0 no-repeat;
	background-size: 250px 74px;
	text-indent: -9999px;
	margin: 0 auto;
}

@media screen and (max-width: 32em) {
	.appstore h3 { font-size: 24px; }
}

/* ---------- Sections ---------- */
.celda.testimonio0 { max-width: 40em; margin:0 auto;}
.testimonio0 h3 { font-size: 24px; line-height: 28px;}
#testimonials p { font-size: 15px; color: #555; line-height: 1.5; }
#testimonials a { text-decoration: none; }
#testimonials a h3:hover { text-decoration: none; color: #ffbb71; }

#testimonials .texto-untercio p { font-size: 15px; }
#testimonials span { color: #fafafa; font-size: 13px; margin-top: 15px; color: #4a8da7; }

#testimonials h3 span { font-size: 18px; color: #888;}

.sportys { float: right; }

a.sportys-logo { 
		display: block;
		width: 150px;
		height: 33px;
		background-image: url('./img/sportys_logo_doble.png');
		background-size: 150px 66px;
		background-position: 0 0;
		text-indent: -9999px;
		float: right;
		margin-top: 10px;
}

a.sportys-logo:hover { background-position: 0 33px; }

img.iphones { width: 100%; max-width: 760px; height: auto; float: none; margin: 0 auto; }

@media screen and (max-width: 62em) {
	.celda-izquierda img { margin-right: 30px; }
	.testimonio0 h3 { font-size: 24px; }
	#testimonials .testimonio0 p { font-size: 15px; }
}

@media screen and (max-width: 42em) {
	.testimonio0 h3 { font-size: 22px; }
}

@media screen and (max-width: 32em) {
	.testimonio0 h3 { font-size: 20px; }
}


/* ---------------- SECTIONS ----------------- */

section { overflow: hidden; }

section.blog .container { padding: 2em 1em 2em; }

.categoria section.blog .container { padding-top:0; margin-top:0}
.categoria .contenido article { margin-top:0; padding-bottom: 1.5em}

section.apps .contenido { max-width: 62em; margin: 0 auto; padding: 0 0 1em }

section.one {
	display: block;
	position: relative;
	width: 100%;
	overflow: hidden;
	margin: 0;
	padding: 0 0 2em;
	/*background-color: #69a2b3;*/
}

section .one .container { padding: 0 0 2em}

.main-intro { 
	background: url('../img/black-gradient.png') center center no-repeat;
	background-attachment: scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.imagen-mac img { max-width: 300px; height: auto; float: left}

section.azul-claro { 
	border-top:1px solid #ccc; 
	padding: 1.5em 0 4em;
	background: #eef3f8; 
	background: -webkit-radial-gradient(center, circle cover, #eef3f8 0%, #ccd9e6 100%); 
	background: radial-gradient(circle at center, #eef3f8 0%, #ccd9e6 100%);
	
}

section.azul-claro .contenido { text-align: center; }
section.azul-claro p { color: #555; }

section.azul-oscuro {
	background-color: #3d7f99;
	background: -webkit-radial-gradient(center, circle cover, #3d7f99 0%, #135670 100%); 
	background: radial-gradient(circle at center, #3d7f99 0%, #135670 100%);
}

.rojo {
	background-color: #009595; 
	padding: 1.5em 0 4em;
}

.verde { 
	padding: 1.5em 0 4em;
	background: #009595;
	background: -webkit-radial-gradient(center, circle cover, #009595 0%, #005c5c 100%); 
	background: radial-gradient(circle at center, #009595 0%, #005c5c 100%);
}

section.azul { 
	text-shadow: none; 
	border-top: 1px solid #1b84ab;
	background: #2c95bc; 
	background: -webkit-radial-gradient(center, circle cover, #2c95bc 0%, #056083 100%); 
	background: radial-gradient(circle at center, #2c95bc 0%, #056083 100%);
}

section.azul a { color: #ffbb71; font-weight: normal; }
section.azul strong { color: #fff; font-weight: 400; }
section.azul h1, section.azul h2, section.azul h3, section.azul h4, section.azul p, section.azul ul li { color: #263647 }
section.azul .contenido p, section.azul h3.titulo, section.azul h2.titulo { color: #efefef;  }

h3.titulo strong { font-weight: 600; }

section.short { padding: 0;}

section.four { padding: 3em 0 3em; }

section.blanco { background-color: #fff; border-top: 1px solid #ccc; }

section.gris { background-color: #f8f9fb; border-top: 1px solid #ccc; }

.intro-texto { padding-top: 2.8em; padding-bottom: 0em; }

#contact .imagen-izquierda { padding-top: 20px;}

@media screen and (max-width: 52em){
	#design img { padding-right: 60px; padding-top: 25px; float:left }
}

@media screen and (max-width: 42em){
	#design img { padding-right:30px; padding-top: 40px; }
	section.four { padding: 1.5em 0 1.5em}
}

@media screen and (max-width: 32em){
	#design img { padding-right:0; padding-top:20px; float:none; }
	.celda { margin-bottom: 1em; padding: 0; }
	#contact article.celda { margin-bottom: 0;}
	#contact .imagen-izquierda {  }
	.celda h2 { margin-top: 0; padding-top: 0; line-height: 1em;  }
}

.texto-centrado { text-align:center; margin-top:0; margin-bottom:1.4em }
.centrado { text-align: center; }

.list-unset, .nav { list-style: none !important; margin-left:0 !important; padding-left:0 }
.list-numbers { list-style: decimal !important }
.list-bullets { list-style: disc !important }
.block { display:block }
.hidden { display:none !important }
.cf,header,.media,.nav,#wp_page_numbers ul { zoom: 1 }
.cf:before,header:before,.media:before,.nav:before,#wp_page_numbers ul:before,.cf:after,header:after,.media:after,.nav:after,#wp_page_numbers ul:after { content:""; display: table }
.cf:after,header:after,.media:after,.nav:after,#wp_page_numbers ul:after { clear: both }
.is-hidden { display: none; visibility: hidden }
.is-vhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px }

/* ----------------- BUTTONS ------------------- */

a.boton, .single a.boton, button, input[type=submit] { 
	display:inline-block;
	padding: 10px 25px 10px;
	font-size: 0.95em;
	font-weight: 400;
	text-transform: lowercase;
	white-space:nowrap;
	vertical-align:middle;
	color: #fff;
	background: #5f9ae4;
	cursor:pointer;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
	border-radius:5px;
	text-shadow: none;
	border: none;
}

a.boton.grande {
	padding: 10px 40px;
	font-size: 1.0em;
	font-weight: 400;
}

a.boton.peque {
	padding: 5px 20px;
	font-size: 0.9em;
}

a.boton.transp { background: transparent; border: 1px solid #999; color: #999; font-weight: 300; }

a.boton.blanco, a.boton.grande.blanco { color: #4c4c4c; background-color: rgba(250, 250, 250, 0.65) }
a.boton.blanco:hover, a.boton.grande.blanco:hover { background: #fff; color: #000;}

@media screen and (max-width: 52em){
	ul li a.boton { padding: 5px 10px; font-size: 1.0em; }
	a.boton.grande { padding: 8px 30px; font-size: 1.0em; }
}

@media screen and (max-width: 42em){
	a.boton, button, input[type=submit] { padding: 12px 30px 12px; font-size: 0.95em; }
	a.boton.grande { padding: 4px 30px; font-size: 0.90em; }
}
	
a.boton:hover, .single a.boton:hover, button:hover, input[type=submit]:hover { 
	text-decoration: none;
	color: #fff;
	background-color: #555;
}

/* ------------------ inner menu ----------------- */

.menu3 { width: 150px; margin: 10px 0 10px}

ul.menu2 { margin: 2.5em auto; list-style: none; list-style-type: none; float: none; text-align: center;}
ul.menu2 li { float: left; padding: 0 10px 0; list-style: none; list-style-type: none; }
ul.menu2 li a { margin-left: 10px}

@media screen and (max-width: 42em){
	ul.menu2 { text-align: center; padding-left: 0px; padding-top: 1.5em; margin: 0 auto }
	ul.menu2 li { margin-right: 10px; }
}

@media screen and (max-width: 32em) {
	ul.menu2 { margin: 0 auto; float: none; text-align: center; padding-bottom: 2em }
	ul.menu2 li { margin: 10px 0 10px; float: none; }
	ul.menu2 li a.boton { width: 140px; }
}

.menutop { text-align: center; margin: 0 auto; width: 200px}


/* ------------ FRAME Imagen --------------- */


.marcoLabel { padding: 0.8em 0 1.0em; width:100%; text-align: center }
.marcoLabel p { font-size: 0.9em; text-align: center; margin-top: -5px;}

img.frame, .frame img {
  background: #fff;
  border: 1px solid #f8f8f8;
  padding: 4px;
  -webkit-box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.75);
  box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.75);
  margin: 1em auto 0;
  max-width: 95%;
  height: auto;
}

img.luis {
	max-width: 200px;
	height: auto;
}

.sombra {
  	-webkit-box-shadow: 0px 5px 15px 0px rgba(50, 50, 50, 0.65);
	-moz-box-shadow:    0px 5px 15px 0px rgba(50, 50, 50, 0.65);
	box-shadow:         0px 5px 15px 0px rgba(50, 50, 50, 0.65);
}

@media screen and (max-width: 32em) {
	img.frame, .frame img { padding: 4px;}
}

a:hover { color: #139dac; }

.inverso p { color: #fafafa; }
.inverso h1, .azul.inverso h1 { color: #fff; }
.inverso h2, .azul.inverso h2 { color: #fff; }
.inverso h3, .azul.inverso h3 { color: #fff; }
.inverso h1 strong, .azul.inverso h1 strong, .inverso h2 strong, .azul.inverso h2 strong { color: #fff; font-weight: 600; }
.inverso a { color: #ffbb71; }
.inverso strong { color: #fff;  }

.videoplayer { 
	margin: 2.0em auto 3.0em; 
	width: 90%;
	border: 1px solid #aaa;
	-webkit-box-shadow:0 2px 4px rgba(0,0,0,.4);
	-moz-box-shadow:0 2px 4px rgba(0,0,0,.4);
	-o-box-shadow:0 2px 4px rgba(0,0,0,.4);
	box-shadow:0 2px 4px rgba(0,0,0,.4)
}

.panel, .panel2 {
	font-size: 0.90em;
	margin: 0em auto 1.5em; 
	padding: 2em 2em 1em; 
	border:1px solid #bbb; 
	background-color:#fbfbfb; 
	-webkit-border-radius:6px; 
	-moz-border-radius:6px; 
	-o-border-radius:6px;
	border-radius:6px;
	-webkit-box-shadow:0 2px 4px rgba(0,0,0,.1);
	-moz-box-shadow:0 2px 4px rgba(0,0,0,.1);
	-o-box-shadow:0 2px 4px rgba(0,0,0,.1);
	box-shadow:0 2px 4px rgba(0,0,0,.1)
}
.panel {max-width: 42em;}
.panel2 { 
	box-shadow: none; 
	-webkit-box-shadow:none; 
	-moz-box-shadow:none; 
	-o-box-shadow:none; 
	border: 2px solid #888; 
	margin-top: 1em;
	background: #f5f5f5;
	font-size: 0.95em;
	max-width: 42em;
}

@media screen and (max-width: 42em) {
	.panel, .panel2 { padding: 1.5em 2em 1em; }
}

@media screen and (max-width: 32em) {
	.panel2 { width: 99%; padding-left: 0; padding-right: 0; background: transparent; border: none}
	.videoplayer { width: 95%; }
}

/* ----------- SPACERS & DIVISORS ---------- */

.spacer { display: block; position: relative; width: 100%; height: 30px; background: transparent }
.spacer.x2 { height: 60px }
.spacer.x3 { height: 90px }

@media screen and (max-width: 42em){
	.spacer { height: 20px; }
	.spacer .x2 { height: 40px; }
}

.divisor { 
	display: block; position: relative; height: 5px;
	border-top: 1px solid #135671; 
	clear: both;
}

.divisor2 {
	height: 1px;
  	border: 0;
  	margin: 10px 0 10px;
	background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.2), rgba(0,0,0,0));
	background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.2), rgba(0,0,0,0));
	background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.2), rgba(0,0,0,0));
	background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.2), rgba(0,0,0,0));
}


/* ------------ END CSS ---------- */