/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

@font-face {
    font-family: 'HelveticaNowDisplay';
    src: url('HelveticaNowDisplay-Bold.woff2') format('woff2'),
        url('HelveticaNowDisplay-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNowDisplay';
    src: url('HelveticaNowDisplay-ExtraBold.woff2') format('woff2'),
        url('HelveticaNowDisplay-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNowDisplay';
    src: url('HelveticaNowDisplay-Regular.woff2') format('woff2'),
        url('HelveticaNowDisplay-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
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 {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
img { 
	vertical-align: middle
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-size: 62.5%
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
b, strong {
	font-weight: bold;
}
i, em {
	font-style: italic
}
a {
	text-decoration: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

/* LAYOUT */
body {
	font-family: "HelveticaNowDisplay";
	font-weight: 300;
	padding-top: 8em;
	-webkit-font-smoothing: antialiased;
	color: #2a2a2a;
}

#header {
	background-color: #FFF;
	text-align: center;	
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 10001;
	min-height: 8em;
}

	#header .show-menu {
		position: absolute;
		right: 0;
		top: 0;
		width: 8em;
		height: 8em;
		border: 0 none;
		background-color: transparent;
		background-image: url(../images/menu.svg);
		background-position: center center;
		background-repeat: no-repeat;
		cursor: pointer;
		text-indent: -9999em;
		font-size: 1em;
		box-sizing: border-box;
	}
	
		#header .show-menu:hover {
			opacity: 0.5;
		}

	#header .logo {
		position: absolute;
		left: 50%;
		margin-top: 1.6em;
		-ms-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
	}
	
	#header .logo img {
		width: 12em;
	}

		#header .back {
			text-indent: -9999em;
			width: 7.9em;
			height: 7.9em;
			cursor: pointer;
			background-position: center center;
			background-repeat: no-repeat;
			background-size: auto 1.5em;
			display: block;
			float: left;
			background-image: url(../images/back.svg);
		}
	
		#header .back:hover { background-image: url(../images/backHover.svg); }
		
	#header.visible {
		position: fixed;
		-webkit-animation: showUp 0.5s;
		        animation: showUp 0.5s;
		-webkit-animation-fill-mode: forwards;
		        animation-fill-mode: forwards;
	}
	
	@-webkit-keyframes showUp {
		0% { -webkit-transform: translateY(-100%); transform: translateY(-100%); }
		100% { -webkit-transform: translateY(0%); transform: translateY(0%); }
	}
	
	@keyframes showUp {
		0% { -webkit-transform: translateY(-100%); transform: translateY(-100%); }
		100% { -webkit-transform: translateY(0%); transform: translateY(0%); }
	}
	
#menu {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 0;
	overflow: auto;
	z-index: 20000;
	background-color: #FFF;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: auto;
	transition: height 0.5s;
	color: #2a2a2a;
}

	body.menu #menu {
		height: 100vh;
	}

	#menu .show-menu {
		position: absolute;
		top: 0;
		right: 0;
		width: 8em;
		height: 8em;
		background-image: url(../images/cerrar.svg);
		background-position: center center;
		background-repeat: no-repeat;
		background-color: transparent;
		border: 0 none;
		cursor: pointer;
		text-indent: -9999em;
	}
	
		#menu .show-menu:hover {
			opacity: 0.5;
		}
	
	#menu .content {
		width: 100%;
		margin: auto;
		padding: 2em 0;
	}
	
	#menu p {
		font-size: 2.2em;
		font-weight: 600;
		margin: 2em 0;
	}
	
	#menu .content > ul {
		position: relative;
		padding-bottom: 2em;
	}
	
		#menu .content > ul:after {
			content: "";
			position: absolute;
			bottom: 0;
			left: 50%;
			margin-left: -2em;
			height: 5px;
			width: 4em;
			background-color: #2a2a2a;
		}
	
	#menu ul ul {
		max-height: 0;
		transition: 0.5s;
		overflow: hidden;
		box-sizing: border-box;
		padding-top: 0;
	}
	
	#menu ul .opened ul {
		max-height: 40em;
		padding-top: 1em;
	}
	
	#menu li a, #menu .link {
		font-size: 3.8em;
		font-weight: 800;
		cursor: pointer;
		display: block;
	}
	
		#menu a:hover,
		#menu .link:hover,
		#menu .active,
		#menu .opened > .link {
			text-decoration: underline;
		}
		
		#menu .link:after {
			content: "";
			display: inline-block;
			background-image: url(../images/down.svg);
			background-position: right center;
			background-repeat: no-repeat;
			background-size: contain;
			width: 0.5em;
			height: 0.5em;
			margin-left: 0.25em;
			transition: transform 0.2s;
			transform: rotate(0deg);
		}
		
		#menu .link:hover:after {
			opacity: 0.5;
		}
		
		#menu .opened .link:after {
			transform: rotate(180deg);
		}
	
	#menu li {
		margin: 2em 0;
	}
	
	#menu a {
		color: inherit;		
	}
	
	#menu li li a {
		color: #7a7a7a;
		font-size: 2.2em;
		font-weight: bold;
	}
	
	#menu .lang {
		text-transform: uppercase;
		font-weight: 800;
	}
	
	#menu .content > ul > li {
		overflow: hidden;
		padding-bottom: 0.5em;
	}
	
		#menu .content > ul > li > a,
		#menu .content > ul > li > .link {
			position: relative;
			transform: translateY(100%);
			opacity: 0;
			transition: all 0.25s;
		}

		#menu .content > ul > li > a.visible,
		#menu .content > ul > li > .link.visible {
			transform: translateY(0);
			opacity: 1;
		}
	
	@media (max-width: 550px) {
		#menu .content {
			font-size: 0.6em;
		}
	}
		
#main {
	position: relative;
	z-index: 10000;
	background-color: #FFF
}
	
	#main.no-gradient:before {
		display: none;
	}

	#main img {
		max-width: 100%;
	}
	
	#main img.main {
		width: 100%
	}

#footer {
	background-color: #000;
	padding: 3em 8em;
	color: #FFF;
	z-index: 500;
	bottom: 0;
	left: 0;
	right: 0;
	position: fixed;
}

	#footer .links {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin-top: 1em;
	    width: calc(100% + 6.8em);
	    margin-left: -3.4em;
	}

	#footer .info {
		font-size: 1.5em;
		line-height: 1.5em;		
		width: calc(25% - 4.6em);
		padding: 0 2.3em;
	}
	
	#footer .projects {
		width: 50%;
		-webkit-column-count: 2;
		   -moz-column-count: 2;
		        column-count: 2;
	}
	
		#footer .projects ul,
		#footer .projects .col {
			-webkit-column-break-inside: avoid;
			   -moz-column-break-inside: avoid;
			        break-inside: avoid;
			min-height: 1px;
		}
		
	#footer a {
		color: #FFF;
		text-decoration: none;
	}
	
	#footer a:hover,
	#footer a.active {
		text-decoration: underline
	}
	
	#footer h4 {
		font-weight: 800;
		text-transform: uppercase;
		position: relative;
		padding-bottom: 0.6em;
		margin-bottom: 0.6em;
		margin-top: 1em;
	}
	
		#footer h4:after {
			content: "";
			width: 1em;
			height: 2px;
			background-color: #FFF;
			position: absolute;
			bottom: 0;
			left: 0;
		}
		
		#footer h4:first-child {
			margin-top: 0
		}
		
		#footer h4.top:after {
			display: none
		}
		
	#footer p {
		margin-bottom: 1.5em;
	}
	
	#footer p.lang {
		text-transform: uppercase;
		font-weight: 800;
		font-size: 1.7em;
	}
	
		#footer p.lang a.active,
		#footer p.lang a:hover {
			text-decoration: underline
		}
		
		#footer small {
			font-size: 0.65em;
			line-height: 1.2em;
			display: block;
		}
			
@media screen and (max-width: 960px) {
	
	#footer {
		padding-left: 3em;
		padding-right: 3em
	}
	
}

@media screen and (max-width: 750px) {
	
	#footer {
		padding-bottom: 0;
		position: static;
	}
	
	#footer .links {
		display: block;
		margin: 0;
		width: auto;
	}
	
	#footer .info {
		width: auto;
		padding: 0 0 1em 0;
	}
	
	#footer .projects {
		-webkit-column-count: 1;
		   -moz-column-count: 1;
		        column-count: 1;
	}
	
		#footer .col + .col h4:first-child {
			margin-top: 1em;
		}		
			
}
			
@media screen and (max-width: 550px) {

	#footer .info {
		width: 100%;
		float: none
	}
	
}
			
/* COMPONENTS */
.grid {
	position: relative;
	background-color: #000;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 1fr 1fr;
	grid-template-columns: 1fr 1fr 1fr;
}

	.grid li.double {
		-ms-grid-row-span: 2;
		grid-row-end: span 2;
	}

	.grid li a {
		display: block;
		position: relative
	}

	.grid li img {
		width: 100%;
	}
	
	.grid li div {
		position: absolute;
		top: 50%;
		left: 0;
		right: 0;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		color: #FFF;
		z-index: 2;
		text-align: center;
		opacity: 0;
		-webkit-transition: opacity 0.5s;
		-o-transition: opacity 0.5s;
		transition: opacity 0.5s;
	}
	
	.grid li a:after {
		background-color: rgba(0, 0, 0, 0.5);
		position: absolute;
		z-index: 1;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: block;
		content: "";
		opacity: 0;
		-webkit-transition: opacity 0.5s;
		-o-transition: opacity 0.5s;
		transition: opacity 0.5s;
	}

	.grid li a:hover div,
	.grid li a:hover:after {
		opacity: 1;
	}	
	
	.grid li p {
		font-size: 1.7em;
		margin-bottom: 0.25em
	}
	
	.grid li h2 {
		font-weight: 800;
		font-size: 3.8em;
		text-transform: uppercase;
		padding: 0 1em 0.8em 1em;
		position: relative
	}
	
		.grid li h2:after {
			content: "";
			position: absolute;
			bottom: 0;
			left: 50%;
			margin-left: -0.4em;
			height: 0.14em;
			width: 0.8em;
			background-color: #FFF;
		}
		
@media screen and (max-width: 1060px) {
	
	.grid li p {
		font-size: 1.5em;
	}
	
	.grid li h2 {
		font-size: 3em;
	}
	
}

@media screen and (max-width: 800px) {
	
	.grid {
		-ms-grid-columns: 1fr !important;
		grid-template-columns: 1fr !important;
	}
	
}

/* PHOTO GRIDS */
ul.photos li {
	width: 33.3333333%;
	height: 50vh;
	float: left
}

ul.photos li img {
	height: 100%;
	width: 100%;
	-o-object-fit: cover;
	   object-fit: cover
}

@media screen and (max-width: 550px) {
	
	ul.photos article {
		padding: 8em 4em
	}
	
		ul.photos article p {
			font-size: 2.5em
		}
	
	ul.photos li {
		width: 50%;
		height: 33.3333vh
	}
	
}

/* SCREEN BASED LAYOUT */
.top {
	position: relative;
	z-index: 1000
}

/* HOME */
@media screen and (max-width: 500px) {
	
	.grid li a div,
	.grid li a:after {
		opacity: 1;
		visibility: visible
	}
	
}

/* BLOG POST */
#blog article {
	padding: 5em;
}

	#blog article header {
		margin-left: -5em;
		width: calc(100% + 10em);
		text-align: center;
		padding: 0 2em;
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
	}
	
		#blog article h2 {
			color: #a17e54;
			font-size: 2.2em;
			text-decoration: underline;
		}

		#blog article h1 {
			font-size: 7em;
			font-weight: 800;
			text-transform: none;
			max-width: 10em;
			margin: 0.1em auto 0.75em auto;
		}
	
	#blog article p {
		font-size: 2.2em;
 		margin: 1.2em 0 1.75em 0;
		line-height: 1.9em
	}
	
	#blog article p big {
		font-size: 1.45em;
		color: #7a7a7a;
		font-weight: bold;
		line-height: 1.7em;
	}
	
	#blog article p.source {
		font-size: 1.7em;
	}
	
	#blog article a {
		text-decoration: underline;
		color: inherit;
	}
	
	#blog article .text {
		max-width: 68em;
		margin: 6em auto;
	}
	
	#blog article .image {
		width: calc(100% + 10em);
		margin-left: -5em;
		margin-top: 6em;
		margin-bottom: 6em;
	}
	
	#blog article .text .image {
		width: calc(100vw - 16em);
		margin-left: calc(((68em - 100vw) / 2) + 8em);
	}
	
	#blog article img {
		height: auto !important;
		width: 100% !important;
	}
	
	#blog article iframe {
		max-width: 100%
	}
	
	#blog article .video {
		position: relative;
		padding-bottom: 56.25%; /* 16:9 */
		padding-top: 25px;
		height: 0;
	}
	
	#blog article .video iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	
	#blog article footer a {
		text-transform: uppercase;		
	}
	
	#blog .nav {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
	
		#blog .nav div {
			width: 50%;
			padding-right: 1em;
		}
		
		#blog .nav a {
			text-decoration: none;
			font-size: 1.7em;
			color: #7a7a7a;
			line-height: 1.5em;
		}
		
		#blog .nav a:hover strong {
			text-decoration: underline;
		}
		
		#blog .nav strong {
			font-weight: normal;
			color: #a17e54;
			font-size: 1.3em;
			display: block;
			line-height: 1.3em;
		}
		
		#blog .nav .next {
			text-align: right;
			padding-left: 1em;
			padding-right: 0;
		}
	
@media screen and (max-width: 840px) {
	
	#blog article .text .image {
		width: 100%;
		margin-left: 0;
	}
	
}
	
@media screen and (max-width: 650px) {
	
	#blog article {
		font-size: 0.7em;
		padding: 4em 3em
	}

	#blog article .image,
	#blog article header {
		width: calc(100% + 6em);
		margin-left: -3em;
	}
	
	#blog article .text,
	#blog article .image {
		margin-top: 2em;
		margin-bottom: 2em;
	}
}

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

	#blog article h1 {
		font-size: 5em;
	}

}

/* BLOG */
#blog .grid {
	-ms-grid-columns: 1fr 1fr;
	grid-template-columns: 1fr 1fr;	
}

	#blog .grid div {
		padding: 2em 4em 2em 8.5em;
	}

	#blog .grid h2 {
		text-align: left;
		padding: 0;
	}
	
		#blog .grid h2:after {
		    left: 0;
		    margin: 0.5em 0 0 0;
		    position: static;
		    display: block;
		}

#blog .grid .intro {
	position: relative;
}

	#blog .grid .intro div {
		opacity: 1;
		text-align: left;
	}
	
		#blog .grid .intro h2 {
			font-size: 2.2em;
			text-decoration: underline;
			color: #a17e54;
			font-weight: normal;
			text-transform: none;
			padding: 0 0 0.5em 0;
		}
		
			#blog .grid .intro h2:after {
				display: none;
			}
		
		#blog .grid .intro h1 {
			font-size: 7em;
			font-weight: 800;
		}
	
		#blog .grid .intro p {
			font-size: 2.2em;
			line-height: 1.75em;
			margin-top: 0.5em;
		}
		
@media (max-width: 1200px) {
	#blog .grid .intro div {
		font-size: 0.75em;
		padding-left: 8.5em;
	}
	
	#blog .grid div {
		padding-left: 6.375em;
	}
}


@media screen and (max-width: 800px) {
	#blog .grid .intro div {
		position: static;
		-webkit-transform: none;
		    -ms-transform: none;
		        transform: none;
		margin-top: 4em;
		margin-bottom: 4em;
	}
}


@media screen and (max-width: 400px) {
	#blog .grid .intro div,
	#blog .grid div {
		padding-left: 3em;
		padding-right: 3em;
		font-size: 0.75em
	}
}

/* SLIDING PAGES */
.screen {
	min-height: 100vh;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: distribute;
	    justify-content: space-around;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	background-position: center center;
	background-size: cover;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	padding-top: 4em;
	padding-bottom: 4em;
	background-color: #FFF;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

	.screen.mobile-small {
		min-height: 58vw;
	}

	@media (max-width: 650px) {
		.screen.mobile-small {
			min-height: 50vw;
		}
	}
	
	.screen.development-header {
		min-height: 50vw;
	}

	.screen.header {
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		padding-left: 2em;
		padding-right: 2em;
		background-color: #000;
	}

	.screen h1,
	.screen h2 {
		font-size: 9.9em;
		color: #FFF;
		font-weight: 800;
		text-align: center;
	}
	
	.screen .fitText {
		width: 100%;
		display: block;
		height: 100%;
	}
	
	.screen .fitText h1 {
		font-size: 1em;
	}

	.screen h1.inited,
	.screen h2.inited,
	.screen .animated.inited {
		opacity: 0;
	}
	
	.screen h1.animate,
	.screen h2.animate,
	.screen .animated.animate {
		overflow: hidden;
		opacity: 1;
		padding: 0.5em 0;
	}
	
		.screen h1.animate span,
		.screen h2.animate span,
		.screen .animated.animate span {
			-webkit-animation: titles 2s;
			        animation: titles 2s;
			-webkit-animation-fill-mode: forwards;
			        animation-fill-mode: forwards;
			display: block;
		}
		
		@-webkit-keyframes titles {
			0% { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); opacity: 0 }
			100% { -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0); opacity: 1 }
		}
		
		@keyframes titles {
			0% { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); opacity: 0 }
			100% { -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0); opacity: 1 }
		}
		
	.screen.black {
		color: #FFF;
		background-color: #000;
	}
	
	.screen.gray {
		color: #FFF;
		background-color: #2a2a2a;
	}
	
	.screen .text {
		padding-left: 8em;
		padding-right: 8em;
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
	}
	
		.screen .text.half {
			max-width: 98em;
		}
		
		.screen .text.columns {
			max-width: none;
		}
		
		.screen .columns {
			-webkit-columns: 2;
			   -moz-columns: 2;
			        columns: 2;
			-webkit-column-gap: 8em;
			   -moz-column-gap: 8em;
			        column-gap: 8em;
		}
			
		.screen .text p {
			font-size: 2.2em;
			line-height: 1.75em;
		}
		
			.screen .text p + p {
				margin-top: 2em;
			}
		
		.screen .text p.large {
			font-size: 3.6em;
			font-weight: 800;
			line-height: 1em;
		}
		
		.screen .text p strong {
			font-weight: 800;
			color: #a17e54;
		}

		.screen.slogan .text p {
			font-size: 7em;
			font-weight: 800;
			line-height: 1em;
		}
		
		.screen .text p a {
			color: inherit;
		}
		
			.screen .text p a:hover {
				color: #a17e54
			}
		
	.screen blockquote.text p {
		font-size: 3.8em;
		text-align: center;
		line-height: 1.5em;
	}
	
		.screen blockquote.text p.author {
			font-size: 2.2em;
			font-weight: 800;
			color: #a17e54;
		}
		
	.screen.half {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		    -ms-flex-direction: row;
		        flex-direction: row;
		padding: 0;
	}
	
		.screen.half .text,
		.screen.half .image,
		.screen.half .image-auto {
			width: 50%;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-orient: vertical;
			-webkit-box-direction: normal;
			    -ms-flex-direction: column;
			        flex-direction: column;
			-ms-flex-pack: distribute;
			    justify-content: space-around;
			background-position: center center;
			background-size: cover;
		}
		
		.screen.half .image-auto.full img {
			height: 100vh;
			object-fit: cover;
		}
		
		.screen.half .text {
			padding-top: 4em;
			padding-bottom: 4em;
		}
		
		.screen.half .text p {
			font-size: 3.8em;
			font-weight: bold;
		}
		
	.screen.closing img {
		-o-object-fit: contain;
		   object-fit: contain;
		background-color: #FFF;
	}
	
	.screen.half.closing .text p {
		font-size: 2.2em;
		font-weight: normal;
	}
		
	.screen.map {
		min-height: auto;
	}
	
	.screen .text .stats {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		    -ms-flex-direction: row;
		        flex-direction: row;
		-ms-flex-pack: distribute;
		    justify-content: space-around;
	}
	
		.screen .text .stats li {
			width: 50%;
			font-size: 2.2em;
			font-weight: normal;
			line-height: 1.2em;
			-webkit-box-sizing: border-box;
			        box-sizing: border-box;
			margin: 2em 0;
		}
		
		.screen .text .stats strong {
			color: inherit;
			font-size: 4.5em;
			display: block;
			font-weight: bold;
			margin-bottom: 0.4em;
		}
		
/* CONTACTO */
::-webkit-input-placeholder { /* Edge */
  color: white;
  opacity: 1;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: white;
  opacity: 1;
}

::-moz-placeholder {
  color: white;
  opacity: 1;
}

::-ms-input-placeholder {
  color: white;
  opacity: 1;
}

::placeholder {
  color: white;
  opacity: 1;
}

.contact {
	padding: 0 8em;
	text-align: right;
}

	.contact h2 {
		font-size: 3.6em !important;
		font-weight: 800;
		text-align: center !important;
	}
	
	.contact .fields {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		    -ms-flex-pack: justify;
		        justify-content: space-between;
		margin: 7em 0 4em -4em;
		width: calc(100% + 8em);
	}
	
	.contact .group {
		width: calc(50% - 8em);
		margin: 0 4em;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}
	
	.contact input, .contact textarea {
		width: 100%;
		display: block;
		font-size: 2.2em;
		color: #FFF;
		font-family: inherit;
		border: 0 none;
		border-bottom: 1px solid #FFF;
		background-color: transparent;
		outline: none;
		margin-bottom: 4.5em;
	}
	
	.contact label {
		font-size: 2.2em;
		text-align: left;
		display: block;		
		-webkit-box-flex: 0;		
		    -ms-flex-positive: 0;		
		        flex-grow: 0;
		margin-bottom: 0.5em;
	}
	
	.contact textarea {
		-webkit-box-flex: 1;
		    -ms-flex-positive: 1;
		        flex-grow: 1;
		margin: 0;
		border: 1px solid #FFF;
	}
	
	.contact input:last-child {
		margin-bottom: 0;
	}
	
	.contact button {
		width: 8em;
		height: 8em;
		text-indent: -9999em;
		background-color: #000;
		outline: none;
		border: 0 none;
		text-align: left;
		overflow: hidden;
		display: inline-block;
	}
	
	.contact button:before {
		background-image: url(../images/submit.svg);
		background-position: center center;
		background-repeat: no-repeat;
		width: 100%;
		height: 100%;
		display: block;
		content: "";
		cursor: pointer;
	}
	
	.contact button:hover:before {
		opacity: 0.5;
	}
	
	.contact .gracias {
		font-size: 2.2em;
		font-weight: 800;
		text-align: center;
		margin-top: 2em;
		opacity: 0;
	}
	
	@media (max-width: 750px) {
		.contact .fields,
		.contact .group {
			display: block;
			width: auto;
			margin: 0;
		}
		
		.contact .fields {
			margin: 4em 0;
		}
		
		.contact input,
		.contact textarea {
			margin-bottom: 2em !important;
		}
	}	


@media (max-width: 1020px) {
	.screen.half .text p {
		font-size: 3em;
	}
}

@media (max-width: 750px) {
	.screen .columns {
		-webkit-columns: 1;
		   -moz-columns: 1;
		        columns: 1;
	}
	
	.screen blockquote.text p {
		font-size: 2.5em;
	}
	
	.screen.slogan .text p {
		font-size: 3.5em;
	}
	
	.screen.half {
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		min-height: 0;
	}
	
	.screen.half .text {
		width: 100%;
	}
	
	.screen.half .image {
		display: none;
	}
	
	.screen.half .image-auto {
		width: auto;
	}
	
	.screen.half .image-auto img {
		height: auto;
	}
	
	.screen.map,
	.screen.closing {
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
	}
	
		.screen.map .text {
			width: 100%;
			display: block;
		}

	.screen h1, .screen h2 {
		font-size: 7.5em;
	}
}				

@media (max-width: 550px) {

	.screen h1, .screen h2 {
		font-size: 4.5em;
	}
	
	.screen .text,
	.contact {
		font-size: 0.75em;
		padding-left: 4em;
		padding-right: 4em;
	}
	
	.screen .text .stats li {
		font-size: 1.7em;
	}
}

/* SLIDER */
.slider {
    position: -webkit-sticky;
    position: sticky;
    top: 0;	
}

.slider .slick-arrow {
	width: 8em;
	height: 8em;
	display: block;
	border: 0 none;
	background-color: #000;
	position: absolute;
	left: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	    -ms-transform: translateY(-50%);
	        transform: translateY(-50%);
	cursor: pointer;
	outline: none;
	z-index: 9999;
	overflow: hidden;
}
	
	.slider .slick-arrow:before {
		background-image: url(../images/submit.svg);
		background-position: center center;
		background-repeat: no-repeat;
		content: "";
		display: block;
		width: 100%;
		height: 100%;
	}

	.slider .slick-prev:before {
		-webkit-transform: rotate(-180deg);
		    -ms-transform: rotate(-180deg);
		        transform: rotate(-180deg);
	}
	
	.slider .slick-next {
		right: 0;
		left: auto;
	}
	
	.slider .slick-arrow:hover:before {
		opacity: 0.5;
	}
	
.slider .slick-dots {
	position: absolute;
	bottom: 2em;
	width: calc(100% - 16em);
	left: 50%;
	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	        transform: translateX(-50%);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

	.slider .slick-dots li {
		-webkit-box-flex: 1;
		    -ms-flex-positive: 1;
		        flex-grow: 1;
	}
	
	.slider .slick-dots button {
		width: 100%;
		height: 2px;
		background-color: #2a2a2a;
		border: 0 none;
		text-indent: -9999em;
		outline: none;
		cursor: pointer;
		padding: 0;
	}
	
	.slider .slick-dots .slick-active button {
		background-color: #FFF;
	}
	
@media (max-width: 750px) {
	.slider .slick-arrow {
		width: 4em;
		height: 4em;
	}
	
	.slider .slick-dots {
		width: calc(100% - 8em);
	}
}

.screen.static,
.slider.static {
	position: relative;
	z-index: 2;
}
	
/* BUENOS AIRES */
#buenosaires .header { background-image: url(../images/losanj/bsas/header.jpg); }
#buenosaires .image { background-image: url(../images/losanj/bsas/image1.jpg); }
#buenosaires .nunez { background-image: url(../images/losanj/bsas/nunez.jpg); }
#buenosaires .screen .text p a { color: #a17e54; text-decoration: underline }
#buenosaires .screen .text p a:hover { color: inherit; }

/* INTERPRETES */
#cambio .header { background-image: url(../images/losanj/cambio/header.jpg); }
#cambio .image { background-image: url(../images/losanj/cambio/image.jpg); }
#cambio .footer { background-image: url(../images/losanj/cambio/footer.jpg); }

/*@media (max-width: 1200px) {
	#cambio .header h1 { font-size: 8vw; }
}*/

/* LOSANJ */
#losanj .header { background-image: url(../images/losanj/header.jpg); }
#losanj .image { background-image: url(../images/losanj/image.jpg); }

/* PROJECTS */
#project .header.plain { background-color: #f1f1f1; }
#project .header.plain h1 { color: #a17e54 }
#project .screen h2 { color: inherit; font-size: 3.6em; text-align: left; margin-bottom: 0.75em; }