@charset "UTF-8";

::selection 		{ background: #000000; color: #FFFFFF;}
::-moz-selection 	{ background: #000000; color: #FFFFFF;}
::-webkit-selection { background: #000000; color: #FFFFFF;}

::-webkit-input-placeholder { color: #AAAAAA;}
::-moz-placeholder 			{ color: #AAAAAA; opacity: 1;}
:-moz-placeholder 			{ color: #AAAAAA; opacity: 1;}
:-ms-input-placeholder 		{ color: #AAAAAA;}

*, body, html { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-text-size-adjust: none; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; }
body { font-family: 'Nunito Sans', sans-serif; font-size: 18px; font-weight: 600; color: #AAAAAA; background: #111; animation: fadein 2s; -moz-animation: fadein 2s; -webkit-animation: fadein 2s; -o-animation: fadein 2s;}
html, body { overflow-x: hidden;}

h1, h2, h3, h4, h5, h6, ul, ol { display: block; list-style: none; font-weight: 600; line-height: 21px; margin-bottom: 11px;} 
p, li { display: block; list-style: none; line-height: 21px; margin-bottom: 21px;}
a { text-decoration: none; color: #AAAAAA;} 
a img { text-decoration: none;}
em { font-weight: 400; font-style: inherit;}
strong { font-weight: 800; font-style: normal;}
a.on, .on { color: #FFF;}

/* UI */
.ui-widget.ui-widget.ui-tooltip { color: #AAA; background: black; box-shadow: none; border: 0; padding: 8px; font-size: .8em; white-space: nowrap; width: auto; max-width: 100%;}


.colMain { width: 1280px; padding: 0 15px 0 0;}

.header { position: fixed; top: 0; left: 0; z-index: 200; height: 160px; padding-top: 20px; background-color: #111; background-color: rgba(17,17,17,.8);}
.header h2 { margin-bottom: 0; line-height: 31px;}
.header h2 strong, .header h2 strong a { display: inline-block;}
.header .colMain { display: flex; align-items: flex-end; flex-wrap: wrap;}
.header #logo { font-size: 45px; line-height: 38px; padding-bottom: 15px; font-weight: 200; color: #007DA4;}
.menu ul li { display: inline-block; padding-top: 4px; margin-bottom: 0; line-height: 31px;}
.menu ul.l li  { margin-right: 30px;}
.menu ul.r li  { margin-left: 10px;}

.content { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; min-height: 100%; padding-top: 240px;}

.boxTopCont { position: fixed; top: 160px; left: 0; min-height: 60px; z-index: 200; padding-top: 10px; background-color: #111; background-color: rgba(17,17,17,.8);}
.boxTopCont ul, .boxTopCont ul li.submenu { margin-bottom: 0;}
.btnDown:after { content: ''; display: inline-block; width: 20px; height: 20px; line-height: 20px; vertical-align: -3px; margin-left: 10px; background: url(../img/iconRowP.png) no-repeat right center; background-size: auto 100%;}

.submenu { display: inline-block; position: relative; margin-right: 15px;}
.submenu:last-child { margin-right: 0;}
.submenu .btn { cursor: pointer;}
.submenu .btn.marcado { color: #FFF;}
.submenu .btn.btnDown:after { width: 13px; height: 13px; line-height: 13px; vertical-align: -2px; background: url(../img/iconRowSubmenu.png) no-repeat center; background-size: 100%;}
.submenu .btn.on.btnDown:after { transform: rotateZ(180deg); -o-transform: rotateZ(180deg); -ms-transform: rotateZ(180deg); -moz-transform: rotateZ(180deg); -webkit-transform: rotateZ(180deg);}
.submenu .boxUp { display: none; z-index: 100; width: auto; min-width: 200px; position: absolute; top: 50px; left: auto; right: -15px; padding: 0 15px 15px 15px; background: #111; background: rgba(17,17,17,.8); text-align: right;}
.submenu .boxUp.on { display: block; animation: fadein .4s; -moz-animation: fadein .4s; -webkit-animation: fadein .4s; -o-animation: fadein .4s;}
.submenu .boxUp li { cursor: pointer; color: #AAAAAA;}
.submenu .boxUp li.on { color: #FFF;}
.submenu.inputBuscar input { padding: 3px 10px; background: rgba(255,255,255,.2); color: #FFF; font-size: 16px;}

.submenu.inputBuscar input::-webkit-input-placeholder { color: #777;}
.submenu.inputBuscar input::-moz-placeholder 		  { color: #777; opacity: 1;}
.submenu.inputBuscar input:-moz-placeholder 		  { color: #777; opacity: 1;}
.submenu.inputBuscar input:-ms-input-placeholder 	  { color: #777;}

.boxTxt { max-width: 830px;}
.boxTxt a { color: #FFF;}
.boxTxt h1 { color: #878787;}
.boxTxt h1, .boxTxt h2 { font-size: 26px; line-height: 31px; margin-bottom: 16px;}


/* Home */

.boxRecent { padding-right: 30px; color: #878787;} 
.boxRecent a { color: #878787;}
.boxRecent a strong { color: #AAAAAA;}

.boxWorks { padding-bottom: 90px;}
.boxWorks .itemWork { margin-bottom: 31px; font-size: 18px; line-height: 21px;}
.boxWorks .itemWork a { display: block;}
.boxWorks .itemWork img { margin-bottom: 11px;}
.boxWorks .itemWork strong { font-weight: 600; display: flex; justify-content: space-between; width: 100%;}
.boxWorks .itemWork .name { display: inline-block; max-width: 80%; height: 21px; line-height: 21px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.boxWorks .itemWork .date { display: inline-block; height: 21px; line-height: 21px; color: #878787; white-space: nowrap; overflow: hidden; flex-shrink: 0;}


/* Press / Bio / Team */

.boxBio, .boxPress { padding-bottom: 50px;}

.boxPress li { margin-bottom: 31px;}
.boxPress h2 { line-height: 24px; font-size: 20px;}
.boxPress a { position: relative;}
.boxPress h2 a strong { font-weight: 600; color: #878787;}
.boxPress h2 strong { font-weight: 600; color: #878787;}
.boxPress h2 a .info { font-size: 18px; line-height: 21px; color: #AAAAAA;}
.boxPress h2 .info { font-size: 18px; line-height: 21px; color: #AAAAAA;}

.boxTeam h2 { line-height: 24px; font-size: 20px;}
.boxTeam h2 strong { font-weight: 600;}
.boxTeam h2 span { color: #878787;}
.boxTeamImg { padding: 50px 0; }


/* Contact */

.boxContact { padding-bottom: 40px;}
.boxContact h1 { margin-bottom: 0;}
.boxContact .row { margin-bottom: 31px;}
.boxContact h2 a strong { color: #AAAAAA;}
.boxContact p,
.boxContact h2,
.boxContact li h2 { color: #AAAAAA; font-size: 18px; line-height: 21px; margin-bottom: 19px;}
.boxContact h2 a { color: #878787;}
.boxContact fieldset { padding: 10px 0 0 0;}
.boxContact [type="checkbox"] { -webkit-appearance: none !important; appearance: none !important; display: inline-block !important; width: 14px !important; height: 14px !important; padding: 0 !important; border-radius: 0; border: 1px solid #AAAAAA; background: transparent; vertical-align: baseline;}
.boxContact [type="checkbox"]:checked { background-color: #007DA4; border-color: #007DA4;}
.boxContact .h3Gal { font-size: 26px; color: #878787;}
.boxContact .boxRrss { margin-top: 15px;}
.boxContact .boxRrss a { color: #555; display: inline-block; font-size: 1em; margin-right: 1em; width: 40px; height: 40px; padding-top: 10px; text-align: center; border: 1px solid #333;}
.boxContact input[type="text"], .boxContact input[type="email"] { margin-bottom: 18px;}
input[type="text"], .boxContact input[type="email"] { display: block; width: 100%; height: 40px; padding: 10px; border: 1px solid #AAAAAA; background: transparent; font-family: 'Nunito Sans', sans-serif; font-size: 18px; color: #AAAAAA;}
input[type="submit"] {font-family: 'Nunito Sans', sans-serif; color: #878787; background: transparent; font-size: 26px; height: 30px; padding-right: 40px; background: url(../img/iconRowSend.png) no-repeat right center; background-size: auto 100%;}

input[type="text"]:focus, input[type="email"]:focus { border: 1px solid #007DA4; color: #007DA4;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { color: transparent; }
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { color: transparent; } 
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder  { color: transparent; } 
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { color: transparent; } 

.content__gdpr p,
.content__gdpr > label,
.content__gdprLegal p { font-size: 11px; line-height: 13px; font-weight: 600;}
.content__gdpr p,
.content__gdprLegal p { margin-bottom: 6px;}
.mc_fieldset.gdprRequired.mc-field-group,
#mc-embedded-subscribe { margin-top: 6px; font-weight: 600; color: #FFF;}


/* Item Work */

.boxTopCont h1 { display: inline-block; margin-right: 40px; font-size: 45px; line-height: 38px; font-weight: 200; margin-bottom: 16px; color: #FFF;}
.boxTopCont .btnsMedia { display: inline-block;}
.boxTopCont .btnsMedia .btn { margin-right: 25px; cursor: pointer;}
.boxTopCont .btnsMedia .btn:last-child { margin-right: 0px;}

.slide { left: -100%; position: absolute; top: 0; bottom: 50px;}
.slide .item { position: absolute; top: 0; bottom: 0; left: 100px; right: 100px;}
.slide .item .contItem { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.slide .item.item-video { display: flex; align-items: center; justify-content: center;}
.slide .item.item-video .contItem { position: static; height: auto; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 1580px; max-height: 100%; height: 100%; aspect-ratio: 16/9;}
.slide .item.item-video .contItem iframe, 
.slide .item.item-video .contItem video { width: 100%; max-width: 1580px; max-height: 100%; height: 100%; aspect-ratio: 16/9;}

.slide.onMedia { left: 0;}

.boxTxtWork  { padding-bottom: 50px;}
.boxTxtWork img { width: auto;}
.boxTxtWork a { color: #FFF;}
.boxTxtWork, .boxBottomWork { display: none;}
.boxTxtWork.onMedia, .boxBottomWork.onMedia { display: block;}
.boxTxtWorkFichaTecnica { padding-left: 60px; padding-top: 30px;}
.boxBottomWork { position: absolute; bottom: 0; height: 50px; padding-top: 15px;}


/* Transitions */

.submenu .btn, .submenu .btn:after, input[type="submit"], input[type="text"], a *, a:after, a:before, a { transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -ms-transition: all 0.2s ease;}
.onMedia { animation: fadein 2s; -moz-animation: fadein 2s; -webkit-animation: fadein 2s; -o-animation: fadein 2s;}


@keyframes fadein 			{ from { opacity: 0;} to { opacity: 1;} }
@-moz-keyframes fadein 		{ from { opacity: 0;} to { opacity: 1;} }
@-webkit-keyframes fadein 	{ from { opacity: 0;} to { opacity: 1;} }
@-o-keyframes fadein 		{ from { opacity: 0;} to { opacity: 1;} }