
/* global ============================================================== */
@import url(global.css);

body > img { position:absolute; }

/* gral HTML =========================================================== */
html, body { width:100%; height:100%; }
html, body, button, input, select, textarea { color:#666; font-weight:300; letter-spacing:-.02em; }

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

::-webkit-input-placeholder { color:#c8c8c8; }
:-moz-placeholder { color:#c8c8c8; }
::-moz-placeholder { color:#c8c8c8; }
:-ms-input-placeholder { color:#c8c8c8; }

h1, h2, h3, h4, h5, h6 { letter-spacing:-.02em; line-height:1.1; color:#000; margin-bottom:.4em; }
h1 { font-size:2.6em; font-weight:500; }
h2 { font-size:1.8em; font-weight:500; color:#666; margin-top:.6em; }
h3 { font-size:1.6em; }
h4 { font-size:1.4em; }
h5 { font-size:1em; font-weight:600; color:#666; text-transform:uppercase; }
h6 { font-size:1em; }
h3, h6, blockquote { font-family:"Times New Roman", Times, serif; font-style:italic; }

a { color:#666; }
a:hover { color:#ef4024; }
a.active, a.inactive { cursor:default; }

/*

rojo 		: #ef4024
gris 1 	: #666
gris 2 	: #8b8b8b

*/

/* MAIN HEADER */
#main-header { position:fixed; top:0; left:0; right:0; width:100%; max-width:80em; min-height:3.75em; margin:0 auto; z-index:1000; background:#ef4024; }
/* #main-header .wrap { width:96%; max-width:72em; opacity:1; overflow:hidden; } */
#main-header .wrap { width:calc(100% - 9.5em); opacity:1; overflow:hidden; max-width:none; }
#main-header > .wrap { min-height:3.75em; }
#main-header.hidden { top:-3em; }
#main-header.hidden > .wrap { opacity:0; }

	/* main logo */
	#main-logo { display:inline-block; float:left; width:15em; padding:.7em 2em .7em 0; }
		#desktop-logo, #mobile-logo { display:inline-block; width:100%; height:2em; }
		#desktop-logo { position:relative; opacity:1; visibility:visible; z-index:1; }
		#mobile-logo { position:absolute; opacity:0; visibility:hidden; z-index:0; }
	
	/* nav principal */
	#main-nav, #main-nav ul { float:left; height:3.75em; display:inline-block; padding:0 1em; }
	#main-nav li, #main-nav li a { display:inline-block; height:100%; float:left; }
	#main-nav li a { padding:1.4em 2em 0 2em; color:#fff; font-size:.9em; font-weight:600; }
	#main-nav li a:hover { background:rgba(0,0,0,.2); }
	#main-nav li a.active { color:#ef4024; background:#fff; }

  #icon-50-2 { position:absolute; top:0; left:0; display:inline-flex; width:3.75em; height:3.75em; align-items:center; justify-content:center; background:rgba(0,0,0,1); }
  #icon-50-2 img { display:inline-block; width:65%; height:auto; }

  #icon-awards { position:absolute; top:0; right:0; display:inline-flex; width:3.75em; height:3.75em; align-items:center; justify-content:center; }
  #icon-awards:hover { background:rgba(0,0,0,.2); }
  #icon-awards img { display:inline-block; width:65%; height:auto; }
	
	/* search */
	#search { position:absolute; top:0; right:0; z-index:1000; width:0; min-width:3.75em; height:3.75em; overflow-x:hidden; }
	#search-icon { display:block; position:absolute; top:0; right:0; z-index:10; width:3.75em; height:100%; background:#8b8b8b url(../img/icons/search-icon.svg) 50% 50% no-repeat; }
	#search-input { position:relative; z-index:0; height:100%; }
	#search.active { width:27%; }
	input { width:100%; padding:.3em 2em; color:#fff; font-size:.8em; letter-spacing:0.035em; font-weight:600; overflow:hidden; border:0; background:#8b8b8b; }

	/* search results */
	.token-container { position:relative; width:100%; height:4.6em; background-color:#666; overflow:hidden; text-align:center; font-weight:700; letter-spacing:.02em; }
	.token-container:before, #clear-search:before { content:''; display:inline-block; height:100%; vertical-align:middle; margin-right:-0.0001em; }
	.token-container .wrap { vertical-align:middle; display:inline-block; text-align:left; }
	.token-container h1 { color:#8b8b8b; font-weight:700; font-size:.9em; margin:.2em 0 0 0; display:inline-block; vertical-align:middle; }
	.token-container ul, .token-container li { display:inline-block; list-style:none; padding:0; vertical-align:middle; }
	.token-container ul li { color:#fff; cursor:pointer; line-height:1; font-size:.8em; padding:0 0 0 3em; white-space:nowrap; }
	.close-term { height:.8em; width:.8em; margin:0 0 .1em .4em; cursor:pointer; display:inline-block; vertical-align:middle; 
		background:url(../img/icons/close-icon.svg) 50% 50% no-repeat; background-size:auto 100%; }
	#clear-search { position:absolute; top:0; right:0; z-index:100; width:12.5em; height:100%; }
	#clear-search span { text-transform:uppercase; font-size:.8em; display:inline-block; vertical-align:middle; cursor:pointer;
		padding:.5em 1.4em; color:#8b8b8b; border:1px solid #8b8b8b; max-width:98%; }


/* MAIN FOOTER */
#main-footer { position:absolute; bottom:0; left:0; width:100%; height:3.75em; z-index:1000; background:#ef4024; }
	
	#social-nav { float:right; padding:1em; }
	#social-nav a { color:#fff; display:inline-block; padding:.2em; margin-left:.8em; }
	
	/* btn mobile */
	#mobile-button { display:none; position:fixed; width:2.75em; height:2.75em; background:#ef4024; bottom:.4em; left:.5em; cursor:pointer; z-index:100; }
	#mobile-button span { position:relative; margin-left:25%; }
	#mobile-button span:before { content:""; position:absolute; left:0; top:1em; width:1.5em; height:.12em; background:#fff; 
		-webkit-box-shadow:0 .375em 0 0 #fff, 0 .75em 0 0 #fff; -moz-box-shadow:0 .375em 0 0 #fff, 0 .75em 0 0 #fff; box-shadow:0 .375em 0 0 #fff, 0 .75em 0 0 #fff; }
	
	/* mobile nav */
	#mobile-nav { position:fixed; top:0; left:0; z-index:10000; width:100%; height:100%; background:rgba(0,0,0,.9); opacity:0; }
	#mobile-nav ul { width:75%; height:100%; padding-top:2em; background-color:#ef4123; position:relative; z-index:10; }
	#mobile-nav li { border-top:solid 1px rgba(255,255,255,.1); display:block; overflow:hidden; }
	#mobile-nav li:last-child { border-bottom:solid 1px rgba(255, 255, 255, .1); }
	#mobile-nav li a, #mobile-nav li a .icon { -webkit-tap-highlight-color:transparent; }
	#mobile-nav li a { display:block; overflow:hidden; color:#fff; width:100%; font-weight:600; text-transform:capitalize; background-color:transparent; }
	#mobile-nav li a span { display:inline-block; vertical-align:middle; }
	#mobile-nav.active li a.active { background-color:#c5351c; }
	#mobile-nav.active { opacity:1; }
	#mobile-nav.inactive { visibility:hidden; display:none; }
	
		#mobile-nav .icon { width:25%; height:3.4em; background-size:auto 50%; background-position:50% 50%; background-repeat:no-repeat; }
		#mobile-home { background-image:url(../img/icons/home-icon.svg); }
		#mobile-work { background-image:url(../img/icons/work-icon.svg); }
		#mobile-news { background-image:url(../img/icons/news-icon.svg); }
		#mobile-about { background-image:url(../img/icons/about-icon.svg); }
		#mobile-location { background-image:url(../img/icons/location-icon.svg); }
	
		#mobile-close { position:absolute; bottom:.4em; right:.5em; width:2em; height:2em; cursor:pointer; display:inline-block; z-index:100;
			background:url(../img/icons/close-icon.svg) 50% 50% no-repeat; background-size:auto 100%; }


/* LAYOUT */
#container { position:relative; width:100%; max-width:80em; min-height:100%; margin:0 auto; }
#main-content { line-height:1.6; height:100%; /*overflow:hidden;*/ }
#main-content .row { font-size:1.2em; letter-spacing:0.035em; }
.wrap { width:90%; max-width:60em; margin:0 auto; }

/* WORK GRID */
.grid, .grid li { list-style:none; padding:0; position:relative; }
.item { margin-bottom:.65em; display:inline-block; overflow:hidden; }
.grid-sizer, .item-square, .item-vertical { width:16%; }
.item-featured { width:49.6%; }
/*.item-featured img { margin-top:-3px; }*/
.item-horizontal { width:32.8%; }
.gutter-sizer { width:.8%; }
	
	/* work item */
	.work { position:relative; display:block; overflow:hidden; width:100%; height:100%; }
	.work:after, .work:before { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; }
	.work:after { z-index:1; background:rgba(0,0,0,0); }
	
	.work h1 { font-size:1.8em; font-weight:600; }
	.work h6 { font-weight:bold; margin-bottom:1em; }
		.work-img { position:relative; width:100%; display:block; z-index:0; }
		.work-info { position:absolute; top:0; left:0; padding:2em; z-index:20; }
		.work-info * { color:#fff; }
		
		/* items grid */
		.grid .work:hover:after { background:rgba(0,0,0,.3); }
		.grid .work h1, .grid .work-info { opacity:0; }
		.grid .work:hover .work-info, .grid .work:hover h1 { opacity:1; }
		
		/* items cuadrados - verticales - horizontales */
		.item-square .work-info, .item-horizontal .work-info, .item-vertical .work-info { font-size:.9em; padding:1.5em; }
		.item-square h1, .item-horizontal h1, .item-vertical h1 { font-size:1.2em; }
		
		/* items solo texto */
		.item-text .work-info { opacity:1; padding:1em; }
		.item-text.item-square h1, .item-text.item-horizontal h1, .item-text.item-vertical h1 { font-size:1em; font-weight:500; opacity:1; }
		.item-text .work:hover:after { background:rgba(0,0,0,0); }
		.item-text .work-info, .item-text .work-info h1 { color:#8b8b8b; }
		.item-text .work-info h6 { color:#ef4024; }
		
		
/* LATEST WORK - HOME
#main-work { margin-bottom:0.625em; } */
	
	/* item type */
	.video:before { z-index:10; background:url(../img/icons/play-btn.svg) center center no-repeat; }
	.link:before { z-index:10; background:url(../img/icons/link.svg) calc(100% - .8em) calc(100% - .8em) no-repeat; background-size:2em; opacity:0; }
	.work.link:hover:before { opacity:1; }

	/* work video */
	#videoWork { position:fixed; top:0; left:0; right:0; bottom:0; padding:0 10%; z-index:100000; text-align:center; background:rgba(0,0,0,.9); }
	.close { position:fixed; top:.5em; right:.5em; width:2em; height:2em; cursor:pointer; display:inline-block; z-index:100000;
		background:url(../img/icons/close-icon.svg) 50% 50% no-repeat; background-size:auto 100%; }

.btnInactive { pointer-events:none; opacity:.5; }
.award-wrap .award-slider .slider { padding-bottom:10px; }
.award-wrap .award-info { font-size:.75em; padding:3em; }

@media all and (min-width:1200px) {

  .award-wrap { display:flex; flex-flow:row wrap; }
  .award-wrap .award-slider { width:70%; }
  .award-wrap .award-info { width:30%; }

}

/* WORK DETAIL */
.slider { padding-bottom:3em; }
.slide .work:hover:after { background:rgba(0,0,0,0); }
.slide .work-info { font-size:1.6em; /*padding:3.4em;*/ }
/*.slide .work h1 { font-size:2.4em; }*/

.details { text-align:center; padding:2em 0; margin:2em 0 0 0; }
.details ul, .details li { list-style:none; padding:0; }
	
	/* work awards */
	.awards { color:#fff; background:#8b8b8b; }
	.awards h3 { color:#fff; font-weight:bold; }
  .awards li { display:inline-block; }
  .awards li a { color:white; font-weight:bold; display:inline-block; padding:.25em 1em; }
  .awards li a:hover { text-decoration:underline; }
	
	/* filed under tags */
	.tags li { display:inline-block; }
	.tags a { font-weight:500; }
	.tags a:hover { text-decoration:underline; }
	.tags a:after { content:','; padding-right:.4em; }
	.tags li:last-child a:after { content:''; padding-right:0; }
	
	/* related work */
	.related { overflow:hidden; text-align:center; }
	.related ul, .related li { list-style:none; padding:0; }
	.related li { float:left; margin:0 .8% .625em 0; }
	.related li:nth-of-type(2n) { margin-right:0; }
	.related .item { text-align:left; }
	.related .work:after { background:rgba(0,0,0,.3); }
	
	
/* NEWS */
#news-header.work:after { background:rgba(0,0,0,.25); }
#news-header .work-info { width:100%; padding:3em 0; }
#news-header .work-info h1 { font-size:3em; }
#news-header .work-info h3 { font-size:1.7em; font-weight:bold; }
.extra-image { padding:2em 0; }
blockquote { font-size:2.8em; line-height:1; letter-spacing:-.03em; color:#2671d9; text-align:center; }

	#byline { padding:1.4em 0 2em 0; }
	#byline p { padding:0; }


/* GMAP */
#gmap { width:100%; height:30em; }
.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; }
.gmap h2 { padding:.8em 0 0 0; text-transform:uppercase; font-weight:bold; font-size:1.2em; }
.gmap h2 span { color:#e6392a; }
.gmap p { color:#3a3a3a; }
.adp-directions { width:100%; }

/* social share */
.share { position:absolute; z-index:8; width:2em; right:1em; display:none; }
.share .share-container { position:fixed; bottom:.6em; overflow:hidden;
	transition:bottom 0.2s; -webkit-transition:bottom 0.2s; -ms-transition:bottom 0.2s;
	transform:translateZ(0); -ms-transform:translateZ(0); -webkit-transform:translateZ(0); }
.share ul, .share li { list-style:none; padding:0; margin:0; display:block; }
.share ul { height:0; opacity:0; visibility:hidden; position:relative; background:#808284; }
.share ul.active { height:5em; opacity:1; visibility:visible; margin-bottom:.125em; }
.share a { display:block; width:2.5em; height:2.5em; background:#808284; text-align:center; }
.share a:before { content:''; display:inline-block; height:100%; vertical-align:middle; margin-right:-0.0001em; }
.share a .fa { color:#fff; vertical-align:middle; display:inline-block; width:98%; }
.share .scrolltop { background-color:#ccc; margin-bottom:.125em; }
.share .scrolltop .fa { font-size:2em; }

/* responsive embeds */
.embed { position:relative; width:100%; height:0; display:inline-block; overflow:hidden; padding-bottom:56.25%; z-index:0; }
.embed iframe, .embed object, .embed embed { position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; }

/* centrado vertical */
.inline { width:100%; height:100%; }
.inline:before { content:''; display:inline-block; height:100%; vertical-align:middle; margin-right:-0.0001em; }
.inline-cont { vertical-align:middle; display:inline-block; width:98%; }


/* TRANSICIONES */
a, span, img, .work:after, .work:before, .work-info, .share-container { 
	-webkit-transition:all .2s ease-in-out; -moz-transition:all .2s ease-in-out; -ms-transition:all .2s ease-in-out; -o-transition:all .2s ease-in-out; transition:all .2s ease-in-out; }
#main-header, #main-header .wrap, #search, .share ul { 
	-webkit-transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out; -ms-transition:all .3s ease-in-out; -o-transition:all .3s ease-in-out; transition:all .3s ease-in-out; }
#main-content, #videoWork { 
	-webkit-transition:opacity .2s ease-out; -moz-transition:opacity .2s ease-out; -ms-transition:opacity .2s ease-out; -o-transition:opacity .2s ease-out; transition:opacity .2s ease-out; }
#mobile-nav, .work h1 { 
	-webkit-transition:opacity .4s ease-out; -moz-transition:opacity .4s ease-out; -ms-transition:opacity .4s ease-out; -o-transition:opacity .4s ease-out; transition:opacity .4s ease-out; }

img { -webkit-transform-style:preserve-3d; -moz-transform-style:preserve-3d; -ms-transform-style:preserve-3d; -o-transform-style:preserve-3d; transform-style:preserve-3d;
	-webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; -o-backface-visibility:hidden; backface-visibility:hidden; }

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

.anim { opacity:0; 
	-webkit-transform:translate3d(0, 80%, 0); -moz-transform:translate3d(0, 80%, 0); -ms-transform:translate3d(0, 80%, 0); -o-transform:translate3d(0, 80%, 0); transform:translate3d(0, 80%, 0); 
	-webkit-transition:all .5s ease-in-out; -moz-transition:all .5s ease-in-out; -ms-transition:all .5s ease-in-out; -o-transition:all .5s ease-in-out; 
	transition:all .5s ease-in-out; }
.animUp { opacity:1; -webkit-transform:none; -moz-transform:none; -ms-transform:none; -o-transform:none; transform:none; }

.work.anim { -webkit-transition:all .5s 0s ease-in-out; -moz-transition:all .5s 0s ease-in-out; -ms-transition:all .5s 0s ease-in-out; -o-transition:all .5s 0s ease-in-out; 
	transition:all .5s 0s ease-in-out; }

#mobile-nav ul { -webkit-transition:-webkit-transform .3s; -moz-transition:-moz-transform .3s; -ms-transition:-ms-transform .3s; -o-transition:-o-transform .3s; transition:transform .33s; }
#mobile-nav li { -webkit-transition:-webkit-transform 0s .2s; -moz-transition:-moz-transform 0s .2s; -ms-transition:-ms-transform 0s .2s; 
	-o-transition:-o-transform 0s .2s; transition:transform 0s .2s; }
#mobile-nav li a { -webkit-transition:background-color .2s .4s ease-in-out; -moz-transition:background-color .2s .4s ease-in-out; ms-transition:background-color .2s .4s ease-in-out; 
	-o-transition:background-color .2s .4s ease-in-out; transition:background-color .2s .4s ease-in-out; }

#mobile-nav ul { -webkit-transform:translate3d(-105%, 0, 0); -moz-transform:translate3d(-105%, 0, 0); -ms-transform:translate3d(-105%, 0, 0); 
	-o-transform:translate3d(-105%, 0, 0); transform:translate3d(-105%, 0, 0); }
#mobile-nav ul.active, #mobile-nav ul.active li { 
	-webkit-transform:translate3d(0, 0, 0) !important; -moz-transform:translate3d(0, 0, 0) !important; -ms-transform:translate3d(0, 0, 0) !important; 
	-o-transform:translate3d(0, 0, 0) !important; transform:translate3d(0, 0, 0) !important; 
	-webkit-transition:-webkit-transform .4s; -moz-transition:-moz-transform .4s; -ms-transition:-ms-transform .4s; -o-transition:-o-transform .4s; transition:transform .4s; }
	
#mobile-nav li:nth-child(2) { -webkit-transform:translate3d(-1000px, 0, 0); -moz-transform:translate3d(-1000px, 0, 0); -ms-transform:translate3d(-1000px, 0, 0); 
	-o-transform:translate3d(-1000px, 0, 0); transform:translate3d(-1000px, 0, 0); }
#mobile-nav li:nth-child(3) { -webkit-transform:translate3d(-1500px, 0, 0); -moz-transform:translate3d(-1500px, 0, 0); -ms-transform:translate3d(-1500px, 0, 0); 
	-o-transform:translate3d(-1500px, 0, 0); transform:translate3d(-1500px, 0, 0); }
#mobile-nav li:nth-child(4) { -webkit-transform:translate3d(-2000px, 0, 0); -moz-transform:translate3d(-2000px, 0, 0); -ms-transform:translate3d(-2000px, 0, 0); 
	-o-transform:translate3d(-2000px, 0, 0); transform:translate3d(-2000px, 0, 0); }
#mobile-nav li:nth-child(5) { -webkit-transform:translate3d(-2500px, 0, 0); -moz-transform:translate3d(-2500px, 0, 0); -ms-transform:translate3d(-2500px, 0, 0); 
	-o-transform:translate3d(-2500px, 0, 0); transform:translate3d(-2500px, 0, 0); }
#mobile-nav li:nth-child(6) { -webkit-transform:translate3d(-3000px, 0, 0); -moz-transform:translate3d(-3000px, 0, 0); -ms-transform:translate3d(-3000px, 0, 0); 
	-o-transform:translate3d(-3000px, 0, 0); transform:translate3d(-3000px, 0, 0); }

#mobile-nav, #mobile-nav ul, #mobile-nav li { -webkit-transition-timing-function:cubic-bezier(.7, 0, .3, 1); -moz-transition-timing-function:cubic-bezier(.7, 0, .3, 1); 
	-ms-transition-timing-function:cubic-bezier(.7, 0, .3, 1); -o-transition-timing-function:cubic-bezier(.7, 0, .3, 1); transition-timing-function:cubic-bezier(.7, 0, .3, 1); }


/* Slider */
.slick-slider { position:relative; display:block; outline:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; 
	-webkit-touch-callout:none; -ms-touch-action:pan-y; touch-action:pan-y; -webkit-tap-highlight-color:transparent; box-sizing:border-box; z-index:1; }
.slick-list { position:relative; display:block; overflow:hidden; outline:none; }
.slick-list.dragging { cursor:pointer; cursor:hand; }

	.slick-loading .slick-list { }
	.slick-slider .slick-track, .slick-slider .slick-list { height:100%; 
		-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); }
	.slick-track { position:relative; top:0; left:0; display:block; }
	.slick-track:before, .slick-track:after { display:table; content:''; height:100%; }
	.slick-track:after { clear:both; }
	.slick-loading .slick-track { visibility:hidden; }
	
	.slick-slide { display:none; float:left; height:100%; min-height:1px; outline:none; }
	.slick-slide > img { width:100%; }
	.slick-slide.slick-loading img { display:none; }
	.slick-slide.dragging img { pointer-events:none; }
	.slick-initialized .slick-slide { display:block; }
	.slick-loading .slick-slide { visibility:hidden; }
	.slick-vertical .slick-slide { display:block; height:auto; border:1px solid transparent; }
	.slick-arrow.slick-hidden { display:none; }
	
	.slick-prev, .slick-next { display:none; }
	.slick-dots { position:absolute; left:0; bottom:1em; display:block; width:100%; list-style:none; text-align:center; z-index:10; padding:0; }
	.slick-dots li { position:relative; display:inline-block; width:10px; height:10px; margin:0 .6em; padding:0; cursor:pointer; font-size:.6em; }
	.slick-dots li button { display:block; width:100%; height:100%; cursor:pointer; border:0; outline:none; background:#ccc; color:transparent;
		-webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; border-radius:50%; }
	/*.slick-dots li button:hover, .slick-dots li button:focus, */.slick-dots li.slick-active button { outline:none; background:#ef4024; }
	.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity:1; }
