
/* global ============================================================== */
@import url(global.css);
@import url(https://fonts.googleapis.com/css?family=Fira+Sans:300,400,500,300italic,400italic,500italic|Khand:400,500,600);


/* gral HTML =========================================================== */
html, body { width:100%; height:100%; overflow:hidden; }
html, body, button, input, select, textarea { color:#1f252b; font-family:'Fira Sans', Arial, sans-serif; font-weight:300; }
body { font-size:1em; line-height:1.4; background:#fff; letter-spacing:-.02em; }

::-moz-selection { background:#0056b8; color:#fff; text-shadow:none; }
::selection { background:#0056b8; color:#fff; text-shadow:none; }

::-webkit-input-placeholder { color:#9e9fa2; font-style:italic; letter-spacing:-.02em; }
:-moz-placeholder { color:#9e9fa2; font-style:italic; letter-spacing:-.02em; }
::-moz-placeholder { color:#9e9fa2; font-style:italic; letter-spacing:-.02em; }
:-ms-input-placeholder { color:#9e9fa2; font-style:italic; letter-spacing:-.02em; }

h1, h2, h3, h4, h5, h6 { font-weight:600; font-family:'Khand', sans-serif; line-height:1; margin:.8em 0 .6em 0; letter-spacing:0; }
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; }
h1 { font-size:220%; }
h2 { font-size:180%; }
h3 { font-size:160%; }
h4 { font-size:140%; }
h5 { font-size:130%; }
h6 { font-size:120%; }

a { color:#0056b8; }
a:hover { color:#ff6b00; }
strong { font-weight:500; }
hr { margin:1.4em 0; border-color:rgba(206,206,208,.4); }

.hide { visibility:hidden; opacity:0; }
.show { visibility:visible; opacity:1; }
.overflow { overflow:hidden; }

/*

azul 1 : #0056b8 - rgba(0,86,184,1)
azul 2 : #367ccb - rgba(54,124,203,1)
azul 3 : #b7c7ea - rgba(183,199,234,1)

gris 1 : #9e9fa2 - rgba(158,159,162,1)
gris 2 : #b5b6b8 - rgba(181,182,184,1)
gris 3 : #ceced0 - rgba(206,206,208,1)

naranja 1 : #ff6b00 - rgba(255,107,0,1)
naranja 2 : #ff942f - rgba(255,148,47,1)
naranja 3 : #ffb877 - rgba(255,184,119,1)

*/

/* MAIN HEADER */
#main-header { width:100%; height:0; position:relative; top:0; left:0; z-index:1000; }
	
	/* logo principal */
	#main-logo { margin:2.5em; max-width:20%; display:inline-block; position:relative; z-index:1; }
	#main-logo img { z-index:0; opacity:0; }
	#main-logo img:first-child { position:relative; }
	#main-logo img:last-child { position:absolute; top:0; left:0; }
	#main-logo img.active { z-index:1; opacity:1; }
	
	/* nav principal */
	#main-nav { position:fixed; top:2.4em; right:-2em; z-index:10; padding:.4em 4em .6em 2em; line-height:1; }
	#main-nav ul { position:relative; z-index:1; }
	#main-nav ul a { display:inline-block; }
	#main-nav ul a { color:#fff; padding:.3em .6em; font-weight:400; border:2px solid transparent; font-size:1.2em; }
	#main-nav ul a:hover { border-color:#fff; }
	#main-nav ul a.active { border-color:#ff942f; color:#ffb877; }
	#main-nav .fa { padding-top:.2em; }
	#main-nav .bg-color { background:rgba(255,107,0,.9); }
	
		/* mobile btn */
		#btn-mobile { position:relative; display:none; z-index:10; color:#fff; padding:.3em .6em; font-size:1.2em; }
		#btn-mobile .fa { font-size:1.2em; }


/* GRAL CONTENT */	
.container, .sliderWrap { position:relative; z-index:0; width:100%; height:100%; overflow-x:hidden; }
.sliderWrap { background:#fff url(../img/loading.gif) no-repeat 50% 50%; min-width:100%; min-height:100vh; }
.slider, .slide { width:100%; height:100%; min-height:100vh; }
.slide { background-position:center center; background-repeat:no-repeat; background-attachment:fixed; background-size:cover; }


/* CONTENIDO TEXTO */
.contentWrap { position:relative; top:0; left:0; width:46%; min-height:100vh; z-index:10; padding:16em 16em 4em 4em; }
.contentWrap:before { content:''; display:block; position:fixed; width:46%; height:100%; top:0; left:0; z-index:-1;
	background:url(../img/bg-cont.svg) top right no-repeat; background-size:auto 100%; }

	/* textos */
	.content { }
		.content ul { list-style:none; padding:0; }
		.content li { padding-left:1.6em; position:relative; }
		.content li:before { color:#ff942f; content:'\f067'; position:absolute; top:.55em; left:0; width:1em;
			display:inline-block; font:normal normal normal 14px/1 FontAwesome; font-size:.9em; text-rendering:auto;
			-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;transform:translate(0, 0); }
		.content li li:before { color:#ffb877; content:'\f068'; }

	/* subtitulos */
	.subtitle { position:relative; }
	.subtitle span { display:inline-block; padding:0 .4em 0 0; background:#fff; position:relative; z-index:1; }
	.subtitle:before { content:''; display:block; position:absolute; bottom:.2em; left:0; z-index:0; width:100%; height:2px; background:#ffb877; }


/* PROYECTOS */
.contentWrap.wide { width:100%; padding-right:4em; }
.contentWrap.wide:before { z-index:-1; width:100%; height:100%; background:#fff; }
.contentWrap.wide.pushed { position:fixed; }

	/* thumbs */
	#thumbs { overflow:hidden; margin:2em 0 0 0; position:relative; z-index:0; }
	#thumbs figure { position:relative; z-index:1; display:inline-block; overflow:hidden; width:25%; float:left; background:#0056b8; }
	#thumbs figure a { display:block; padding:2em; color:#fff; position:absolute; top:0; left:0; z-index:1; width:100%; height:100%; }
	#thumbs figure h3 { position:relative; overflow:hidden; padding:.7em 0 0 0; line-height:1; font-weight:500; }
	#thumbs figure h3:after { content:''; position:absolute; top:0; left:0; width:100%; height:.1em; background:#fff; }
	#thumbs figure h3 span, #thumbs figure h3 small, #thumbs figure p { opacity:0; }
	h1 small, #thumbs figure h3 small { display:block; }
	#thumbs figure:hover h3 span, #thumbs figure:hover h3 small, #thumbs figure:hover p  { opacity:1; }
	#thumbs figure p { position:absolute; bottom:2em; padding:.8em 1em .6em 1em; color:#0056b8; background:#fff; font-weight:500; line-height:1; display:inline-block; }
	#thumbs figure img { position:relative; display:block; min-height:100%; z-index:0; }
	#thumbs figure:hover img { opacity:.1; }

	/* proyecto detalle */
	#proyectos { position:absolute; width:100%; min-height:100vh; top:0; left:0; background:#fff; z-index:1; visibility:hidden; opacity:0; }
	#proyectos.show { position:relative; visibility:visible; opacity:1; }
		.proyecto { position:absolute; top:0; left:0; z-index:0; width:100%; min-height:100vh; opacity:0; }
		.proyecto.active { position:relative; z-index:1; opacity:1; }
		.proyecto .contentWrap { opacity:0; }
		.proyecto .contentWrap.show { opacity:1; }
		.proyecto .contentWrap, .proyecto .contentWrap:before { left:-30%; }
		.proyecto .contentWrap.show, .proyecto .contentWrap.show:before { left:0; }
		.proyecto .sliderWrap { position:fixed; top:0; left:0; overflow:hidden; }


/* HOME slider
#home:before { content:''; display:block; position:fixed; width:30%; height:100%; top:0; left:0; z-index:10;
	background:url(../img/bg-cont.svg) top right no-repeat; background-size:auto 100%; } */


.slide > a { display:inline-block; position:absolute; bottom:3em; right:10.2em; text-transform:uppercase; line-height:1; z-index:1000; 
	padding:.85em 2em .7em 2em; font-family: 'Khand', sans-serif; font-weight:500; }
.slide > a span { position:relative; z-index:1; line-height:1; font-size:160%; color:#fff; }
.slide > a .bg-color { background:rgba(255,107,0,.9); border:solid rgba(255,148,47,.9); border-width:0 .5em; }
.slide > a:hover .bg-color { background:rgba(0,86,184,.9); border-color:rgba(54,124,203,.9); }

	/* slide info - links */
	.info { position:absolute; bottom:6em; right:3em; z-index:10; text-align:right; width:33%; }
	.info * { color:#fff; }
	.info h1 { text-shadow:0 0 .2em rgba(0,0,0,.6); font-size:320%; }


/* CONTACT */
p.icon { padding-left:2em; position:relative; }
p.icon:before { color:#ff6b00; position:absolute; top:.1em; left:0; width:1em;
	display:inline-block; font:normal normal normal 14px/1 FontAwesome; font-size:150%; text-rendering:auto;
	-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;transform:translate(0, 0); }
p.icon.direccion:before { content:'\f041'; }
p.icon.telefono:before { content:'\f095'; }
p.icon.email:before { content:'\f0e0'; }

	/* FORMULARIO */
	form p { padding:.4em 0; position:relative; }
	label { cursor:text; }
	input, textarea { background:rgba(0,0,0,.02); padding:.5em .8em; width:100%; overflow:hidden; border:1px solid rgba(0,0,0,0); }
	textarea { height:7em; }
	input[type=submit] { border:0; color:#fff; background:#0056b8; text-transform:uppercase; width:auto; padding:.5em 2em; }
	input[type=submit]:hover { background:#ff6b00; }
		
		/* mensaje de error */
		input.error, textarea.error { border:1px solid rgba(255,148,47,.4); }
		label.error { position:absolute; top:.4em; left:101%; display:inline-block; vertical-align:middle; white-space:nowrap; 
			padding:.5em 1em .5em 2em; color:#fff; background:#ff6b00; -webkit-border-radius:.3em; -moz-border-radius:.3em; border-radius:.3em; }
		label.error:before { content:'\f057'; color:#fff; position:absolute; top:.5em; left:.5em;
			font:normal normal normal 14px/1 FontAwesome; font-size:110%; text-rendering:auto; display:inline-block;
			-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;transform:translate(0, 0); }

	/* GMAP */
	#gmap { width:70%; height:100%; margin:0; position:absolute!important; top:0; right:0; }
	#gmap h2 { font-weight:600; font-size:18px; margin:.4em 0; }
	#gmap p { font-size:14px; margin:0; }
	.gmap * { font-size:100%; }
	.gmap img, .gmap object, .gmap embed { max-width:none; height:auto }
	.gmap *,.gmap *:before,.gmap *:after { -webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; }
	.gmap .gm-style > .gmnoprint:last-child { display:none; }
	.gm-style-iw { height:6em; }
	.adp-directions { width:60%; }


/* TRANSFORMS */
#thumbs figure h3:after {
	-webkit-transform:translate3d(-100%,0,0); -moz-transform:translate3d(-100%,0,0); -ms-transform:translate3d(-100%,0,0); -o-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0); }
#thumbs figure:hover h3:after, #thumbs figure:hover p, .contentWrap.wide { 
	-webkit-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0); transform:translate3d(0,0,0); }
#thumbs figure p, .contentWrap.wide.pushed {
	-webkit-transform:translate3d(110%,0,0); -moz-transform:translate3d(110%,0,0); -ms-transform:translate3d(110%,0,0); -o-transform:translate3d(110%,0,0); transform:translate3d(110%,0,0); }

#thumbs figure img { -webkit-transform:scale(1.12); -moz-transform:scale(1.12); -ms-transform:scale(1.12); -o-transform:scale(1.12); transform:scale(1.12); }
#thumbs figure:hover img { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); }

/* bg img */
.bg { position:fixed; top:0; left:0; z-index:0; width:100%; min-height:100vh; overflow:hidden; background-position:center center; background-repeat:no-repeat; background-attachment:fixed; background-size:cover; }

/* skew bg color div */
.skew { display:block; position:absolute; top:0; right:0; z-index:0; width:100%; height:100%; -webkit-transform:skew(-20deg,0); -moz-transform:skew(-20deg,0); transform:skew(-20deg,0); }


/* ANIMACIONES */
a, img, span, .fa, input, .bg-color {
	-webkit-transition:all .1s ease-in; -moz-transition:all .1s ease-in; -ms-transition:all .1s ease-in; -o-transition:all .1s ease-in; transition:all .1s ease-in; }

#thumbs figure h3:after, #thumbs figure h3 span, #thumbs figure h3 small, #thumbs figure p, #thumbs figure img, #proyectos.show { 
	-webkit-transition:opacity .35s, -webkit-transform .35s; -moz-transition:opacity .35s, -moz-transform .35s; -ms-transition:opacity .35s, -ms-transform .35s; 
	-o-transition:opacity .35s, -o-transform .35s; transition:opacity .35s, transform .35s; }
#proyectos, .proyecto/*, .proyecto .contentWrap*/ { 
	-webkit-transition:opacity .35s, visibility 0s .35s; -moz-transition:opacity .35s, visibility 0s .35s; -ms-transition:opacity .35s, visibility 0s .35s; 
	-o-transition:opacity .35s, visibility 0s .35s; transition:opacity .35s, visibility 0s .35s; }

.container, .contentWrap.wide { 
	-webkit-transition:opacity .5s ease-in, -webkit-transform .5s ease-in; -moz-transition:opacity .5s ease-in, transform .5s ease-in; -ms-transition:opacity .5s ease-in, transform .5s ease-in; 
	-o-transition:opacity .5s ease-in, transform .5s ease-in; transition:opacity .5s ease-in, transform .5s ease-in;	 }

.proyecto .contentWrap, .proyecto .contentWrap:before { 
	-webkit-transition:opacity .5s ease-in, left .5s ease-in; -moz-transition:opacity .5s ease-in, left .5s ease-in; -ms-transition:opacity .5s ease-in, left .5s ease-in; 
	-o-transition:opacity .5s ease-in, left .5s ease-in; transition:opacity .5s ease-in, left .5s ease-in;	 }

img, .sliderWrap, .slider, .slide { 
	-webkit-transform-style:preserve-3d; -moz-transform-style:preserve-3d; -ms-transform-style:preserve-3d; -o-transform-style:preserve-3d; transform-style:preserve-3d; }
/*.proyecto .contentWrap { -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; -o-backface-visibility:hidden; backface-visibility:hidden; }*/


/*
 * Lean Slider v1.0.1
 * http://dev7studios.com/lean-slider
 *
 * Copyright 2012, Dev7studios
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */
.lean-slider { position:relative; *zoom:1; overflow:hidden; }
.lean-slider:before, .lean-slider:after { content:" "; display:table; }
.lean-slider:after { clear:both; }
.lean-slider-slide { float:left; width:100%; margin-right:-100%; display:none; }
.lean-slider-slide.current { display:block; }

.lean-slider-slide { display:block; position:relative; opacity:0; z-index:0; background-color:#fff; 
	-webkit-transition:opacity 0.6s linear; -moz-transition:opacity 0.6s linear; transition:opacity 0.6s linear; }
.lean-slider-slide.current { opacity:1; z-index:1; }

.sliderNav { position:absolute; right:3em; bottom:3em; display:inline-block; white-space:nowrap; z-index:10; }
.arrowNav a, .sliderNav a { display:inline-block; position:relative; padding:1em 1.2em; margin:0 0 0 .2em; line-height:1; }
.arrowNav a i, .arrowNav a span, .sliderNav a i { position:relative; z-index:1; line-height:1; color:#fff; }
.arrowNav .bg-color, .sliderNav .bg-color { background:rgba(0,86,184,.9); }
.arrowNav a:hover .bg-color, .sliderNav a:hover .bg-color { background:rgba(255,107,0,.9); }
.arrowNav { font-size:80%; margin:2em 0 0 -.8em; }
.arrowNav a span { text-transform:uppercase; font-weight:500; font-size:110%; padding:0 .6em; }


/* #Media Queries
================================================== */
@media all and (max-width:1440px) { body { font-size:95%; } }
@media all and (max-width:1366px) { 

	#main-logo { margin:2em; } 
	.info h1 { font-size:280%; } 
	.contentWrap { width:48%; padding:15em 15em 3em 3em; }
	.contentWrap:before { width:48%; }
	.contentWrap.wide { padding-right:3em; }
	
}
@media all and (max-width:1280px) { 

	body { line-height:1.3; } 
	p { padding:.4em 0; }
	h1 { font-size:210%; }
	h2 { font-size:170%; }
	h3 { font-size:150%; }
	#main-logo { max-width:18%; }
	
}
@media all and (max-width:1024px) {
	
	body { font-size:90%; } 
	#main-logo { max-width:20%; }
	
	#btn-mobile { display:inline-block; border:0; }
	#main-nav { padding:.4em 3em .6em 1.4em; text-align:right; top:1.6em; }
	#main-nav ul { display:none; position:absolute; top:100%; right:2em; width:auto; background:rgba(255,107,0,.9); padding:1.6em 2em; }
	#main-nav ul li:not(.rs) { display:block; border-bottom:1px solid rgba(255,255,255,.1); padding:0 .5em; }
	#main-nav ul li:not(.rs) a { padding:.8em 1em; }
	#main-nav ul a { border:0; font-size:1.3em; }
	
	.info { width:50%; }
	.info h1 { font-size:250%; }
	.sliderNav a { font-size:90%; }
	.slide > a { font-size:90%; bottom:3.3em; right:10.6em; }
	
	.contentWrap { width:58%; padding-top:13em; }
	.contentWrap:before { width:58%; }
	#gmap { width:60%; }
	
	#thumbs figure { width:33.3333%; }
	#thumbs figure h3 span, #thumbs figure h3 small, #thumbs figure p { opacity:1; }
	#thumbs figure img { opacity:.6; }
	#thumbs figure h3:after, #thumbs figure p { 
		-webkit-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0); transform:translate3d(0,0,0); }
	#thumbs figure img { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); }
	
}
@media all and (max-width:960px) and (orientation:landscape) { #main-logo { max-width:22%; } .contentWrap { padding-right:13em; } }
@media all and (max-width:800px) and (orientation:landscape) { 

	body { font-size:85%; }
	h1 { font-size:190%; }
	h2 { font-size:160%; }
	
	#main-logo { max-width:25%; }
	#main-nav { font-size:90%; }
	
	.info { bottom:5em; right:2em; }
	.info h1 { font-size:200%; }
	.sliderNav { right:2em; bottom:2em; }
	.slide > a { bottom:2.2em; right:9.5em; }
	
	.contentWrap { width:66%; padding:12em 9em 2.5em 2.5em; }
	.contentWrap:before { width:66%; }
	.contentWrap.wide { padding-right:2.5em; }
	#gmap { width:48%; } 
	
}
@media all and (max-width:800px) { #thumbs figure { width:50%; } }
@media all and (max-width:680px) and (orientation:landscape) { body { font-size:80%; } .proyecto .contentWrap { width:70%; padding-right:12em; } }
@media all and (max-width:600px) and (orientation:landscape) { 
	
	#main-logo { max-width:28%; } 
	.contentWrap { padding-right:7em; }
	.proyecto .contentWrap { padding-right:9em; }
	.info { width:60%; } 
	#thumbs figure a { padding:1em; } 
	#thumbs figure p { font-size:90%; } 

}

@media all and (orientation:portrait) {
	
	body { font-size:100%; }
	#main-logo { max-width:30%; }
	#main-nav { font-size:120%; }

	.contentWrap { width:100%; min-height:auto; padding:13em 3em 8em 3em; }
	.contentWrap:before { position:absolute; width:100%; background:url(../img/bg-cont_.svg) bottom right no-repeat; background-size:100% auto; }

	.slider, .slide { min-height:auto; background-attachment:scroll; }
	.bg, .sliderWrap { position:relative; height:50vh; min-height:auto; background-attachment:scroll; margin-top:-9em; }
	.bg .sliderWrap { height:100%; margin-top:0; }
	
	#home .sliderWrap { height:100%; margin-top:0; }
	#home .slide .bg { display:none; }
	.info { width:calc(100% - 4em); }
	
	.contentWrap.wide { padding-bottom:3em; }
	.proyecto .contentWrap { position:relative; margin-bottom:22vh; }
	.proyecto .contentWrap, .proyecto .contentWrap:before { left:0; opacity:1; }
	.proyecto .sliderWrap { top:auto; bottom:0; }
	.sliderNav .expandBtn { display:none !important; }
	
	#contacto .bg { height:80vh; }
	#gmap { width:100%; }
	label.error { position:relative; top:.4em; left:0; }
	
}
@media all and (max-width:640px) and (orientation:portrait) { 
	
	#main-logo { max-width:36%; } 
	#main-nav { font-size:100%; }
	
	.info { bottom:5em; right:2em; }
	.info h1 { font-size:200%; }
	.sliderNav { right:2em; bottom:2em; }
	.slide > a { bottom:2.2em; right:9.5em; }
	
	.proyecto .contentWrap { margin-bottom:30vh; }
	
	#thumbs figure { width:100%; margin-bottom:2em; } 
	#thumbs figure img { min-width:100%; } 

}
@media all and (max-width:480px) and (orientation:portrait) { 
	
	body { font-size:95%; } 
	#main-logo { max-width:48%; } 
	.info h1 { font-size:200%; }
	.contentWrap { padding:12em 2.5em 6em 2.5em; } 
	.contentWrap.wide { padding-right:2.5em; }

}
@media all and (max-width:380px) { body { font-size:90%; } }
@media all and (max-width:320px) { body { font-size:85%; } .proyecto .contentWrap { margin-bottom:22vh; } }
