
/* ==========================================================================
   Base styles
   ========================================================================== */

*,:before,:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
* {-webkit-font-smoothing: antialiased;}

@font-face {
    font-family: 'Futura LT';
    src: url(../fonts/FuturaLT.eot);
    src: url(../fonts/FuturaLT.eot?#iefix) format('embedded-opentype'), url(../fonts/FuturaLT.woff) format('woff'), url(../fonts/FuturaLT.ttf) format('truetype'), url(../fonts/FuturaLT.svg#gotham_htfmedium) format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Futura LT';
    src: url(../fonts/FuturaLT-Oblique.eot);
    src: url(../fonts/FuturaLT-Oblique.eot?#iefix) format('embedded-opentype'), url(../fonts/FuturaLT-Oblique.woff) format('woff'), url(../fonts/FuturaLT.ttf) format('truetype'), url(../fonts/FuturaLT-Oblique.svg#gotham_htfmedium) format('svg');
    font-weight: normal;
    font-style: italic;
}


html {min-height: 100%;height: 100%; font-family: 'Futura LT', 'Futura', serif; font-size: 13px; font-weight: normal; color: #222; line-height: 1.4;}

body {margin-top: 140px;}

::-moz-selection {background: #b3d4fc; text-shadow: none;}
::selection {background: #b3d4fc; text-shadow: none;}

hr {display: block; height: 1px; margin: 1em 0; padding: 0; border: 0; border-top: 1px solid #ccc;}

audio, canvas, iframe, img, svg, video {vertical-align: middle;}

fieldset {margin: 0; padding: 0; border: 0;}
textarea {resize: vertical;}

a {color: #222; text-decoration: none; -webkit-transition: color 2s ease-out; -moz-transition: color 0.6s ease 0s; -o-transition: color 0.6s ease 0s; transition: color 0.6s ease 0s;}
a:hover {color: #828282;}

b, strong {font-weight: normal;}



/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {margin: 0.2em 0; padding: 0.2em 0; background: #ccc; color: #000;}


/* ==========================================================================
   GENERAL
   ========================================================================== */

.wrapper {width: 1040px; margin: 0 auto; padding: 0 30px;}

header {width: 980px; margin: 0 auto; padding-bottom: 10px; background: #FFF; position: fixed; top: 0; left: 0; right: 0; z-index: 9999;}

header img {height: 100px; margin-top: 20px;}
.header-fixed header .logo {display: block; width: 215px; height: 50px; margin-top: 50px; overflow: hidden;}
.header-fixed header .logo img {height: 100px; margin-top: -55px;}

header nav {position: absolute; right: 0; bottom: 10px;}
header nav ul {margin: 0; padding: 0; list-style: none;}
header nav li {display: inline-block; margin-left: 35px; font-size: 13px; font-weight: normal; text-transform: uppercase;}
header #pull {display: none;}

header .langs {font-size: 11px; color: #999; position: absolute; top: 23px; right: 220px;}
header .langs a {color: #999;}
header .langs a.active {color: #222; text-decoration: underline;}
header .newsletter {font-size: 11px; position: absolute; top: 20px; right: 0;}
header .search {font-size: 11px; position: absolute; top: 50px; right: 0;}
header .search .fa {font-size: 9px; color: #666; position: absolute; top: 5px; left: 60px;}

header input {width: 120px; margin-left: 10px; padding: 2px 6px; border: 1px solid #666;}
header .search input {padding-left: 20px}

.row {overflow: hidden;}

.col-1-3 {width: 32%; margin-left: 2%; float: left;}
.col-1-3:first-child, .col-2-3:first-child, .col-1-3:nth-child(3n+1) {margin-left: 0;}
.col-2-3 {width: 66%; margin-left: 2%; float: left;}

.banner-primary {margin-top: 20px; border-top: 1px solid #000;}
.banner-primary .slide {width: 100%; height: 550px; margin-top: 20px; position: relative;}
.banner-primary .caption {position: absolute; right: 30px; bottom: 30px;}
.banner-primary .caption p {margin: 0; font-size: 32px; color: #FFF; text-align: right;}
.banner-primary .caption a {padding: 6px 10px; background: #000; font-size: 14px; font-weight: normal; color: #FFF; text-transform: uppercase;}
.banner-primary .caption a:hover {background: #FFF; color: #000;}

h2 {margin: 20px 0 10px; padding: 6px; border-top: 1px solid #000; border-bottom: 1px solid #000; font-size: 32px; font-weight: normal; text-align: center; text-transform: lowercase; position: relative;}

.destaque img {width: 100%;}
.destaque .content {margin: 15px 0 10px; padding-bottom: 10px; border-top: 1px solid #000; border-bottom: 1px solid #000;}
.destaque h3 {margin: 10px 0; font-size: 16px; font-weight: normal;}
.destaque p {margin: 0 0 10px;}
.destaque p:last-child {margin: 0;}
.date {display: block; margin-top: 10px; font-size: 10px; color: #939598;}

.see-all {text-align: center;}

.galeria .item {margin-bottom: 20px;}
.galeria .item:nth-child(3n+1) {margin-left: 0; clear: left;}
.galeria img {width: 100%;}

.static-page {overflow: hidden;}
.static-page .photo img {width: 100%;}

.contact-row {padding: 5px 0; text-align: center;}

.static-page iframe {margin: 20px 0;}

.projectos-main {position: relative;}
body.projectos .projectos-main {min-height: calc(100vh - 140px - 85px);}

ul.categories, ul.production-phase {margin: 0; padding: 0; list-style: none; position: absolute; top: 20px;}
ul.categories li, ul.production-phase li {margin-right: 10px; color: #939598; text-transform: uppercase; float: left;}
ul.categories li a, ul.production-phase li a {color: #939598;}
ul.categories li:after, ul.production-phase li:after {content: '/'; display: block; margin-left: 10px; float: right;}
ul.categories li:last-child:after, ul.production-phase li:last-child:after {content: '';}
ul.categories .active a, ul.categories a:hover, ul.production-phase .active a, ul.production-phase a:hover {color: #000; text-decoration: underline;}

ul.categories {left: 0;}
ul.production-phase {right: 0;}
ul.categories li {margin-right: 10px;}
ul.production-phase li {margin-left: 10px;}

.projectos-main > h3 {margin: 0 0 10px; font-size: 36px; font-weight: normal;}
.projectos-main nav a {margin: 0 15px; color: #939598; text-transform: uppercase;}
.projectos-main nav a.active {color: #000;}
.projectos-main nav a:first-child {margin-left: 0;}
.projectos-main nav a:last-child {margin-right: 0;}

.projecto {margin-top: 30px; overflow: hidden;}
.projecto .img img {width: 100%;}
.projecto .text p {margin: 0 0 10px;}

.projecto-gallery {margin: 10px 0; border-top: 1px solid #000; border-bottom: 1px solid #000;}
.projecto-gallery .slide {width: 200px; margin: 10px 10px 10px 0;}
.projecto-gallery .slide img {width: 100%;}

.noticia h3 {margin: 0 0 10px; font-size: 36px; font-weight: normal;}
.noticia .media img {width: 100%; margin-bottom: 20px;}

.archive {font-size: 12px; font-weight: normal; color: #939598; text-transform: uppercase; position: absolute; top: 20px; left: 0;}

.contact-form h3 {font-weight: normal;}
.contact-form .col-1-3 {margin-left: 0;}
.contact-form label {display: block; width: 80px; float: left;}
.contact-form .col-2-3 label {line-height: 55px;}
.contact-form input {width: calc(100% - 80px); margin-bottom: 6px; padding: 4px 6px; background: #DDD; border: none; float: left;}
.contact-form textarea {width: calc(100% - 80px); height: 55px; margin-bottom: 6px; padding: 4px 6px; background: #DDD; border: none; float: left;}
.contact-form button {padding: 0; background: none; border: none; border-bottom: 1px solid #999; clear: both; float: right;}
.contact-form button:hover {border: none;}

footer {margin-top: 40px; padding: 5px 0; background: #000; font-size: 11px; color: #FFF; line-height: 35px; overflow: hidden;}
footer a {color: #FFF;}
footer .rights {float: left;}
footer .contacts {float: right;}
footer .contacts a {color: #FFF;}
footer .social-icons {margin-left: 20px; float: right;}
footer .social-icons a {color: #000;}


.embed-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; visibility: visible!important;}
.embed-container iframe, .embed-container object, .embed-container embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%; visibility: visible!important;}


/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp
{
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top;
}

.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020;
}

.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.fancybox-opened {
  z-index: 8030;
}

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
     -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
          box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-outer, .fancybox-inner {
  position: relative;
}

.fancybox-inner {
  overflow: hidden;
}

.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch;
}

.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap;
}

.fancybox-image, .fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%;
}

.fancybox-image {
  max-width: 100%;
  max-height: 100%;
}

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
  background-image: url('../img/fancybox_sprite.png');
}

#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060;
}

#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url('../img/fancybox_loading.gif') center center no-repeat;
}

.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040;
}

.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url('../img/blank.gif'); /* helps IE */
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  z-index: 8040;
}

.fancybox-prev {
  left: 0;
}

.fancybox-next {
  right: 0;
}

.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden;
}

.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px;
}

.fancybox-next span {
  right: 10px;
  background-position: 0 -72px;
}

.fancybox-nav:hover span {
  visibility: visible;
}

.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  visibility: hidden;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important;
}

/* Overlay helper */

.fancybox-lock {
    overflow: hidden !important;
    width: auto;
}

.fancybox-lock body {
    overflow: hidden !important;
}

.fancybox-lock-test {
    overflow-y: hidden !important;
}

.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 9999;
  background: url('../img/fancybox_overlay.png');
}

.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0;
}

.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll;
}

/* Title helper */

.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050;
}

.fancybox-opened .fancybox-title {
  visibility: visible;
}

.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center;
}

.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent; /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
     -moz-border-radius: 15px;
          border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap;
}

.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff;
}

.fancybox-title-inside-wrap {
  padding-top: 10px;
}

.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, .8);
}

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
     only screen and (min--moz-device-pixel-ratio: 1.5),
     only screen and (min-device-pixel-ratio: 1.5){

  #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
    background-image: url('../img/fancybox_sprite@2x.png');
    background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/
  }

  #fancybox-loading div {
    background-image: url('../img/fancybox_loading@2x.gif');
    background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/
  }
}


/* ==========================================================================
   Helper classes
   ========================================================================== */

.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

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

    body {margin-top: 95px;}

    .wrapper {width: 100%; padding: 0 20px;}

    header {width: 100%; padding: 20px;}

    header img {height: 60px; margin-top: -6px;}
    header nav {display: none;}
    .nav-open header nav {display: block; width: 100%; height: 216px; background: #FFF; border-bottom: 1px solid #000; top: 85px; z-index: 9999;}
    .nav-open header nav li {display: block; width: 100%; margin: 0; padding: 12px 0; border-top: 1px solid #000; text-align: center;}
    header #pull {display: block; font-size: 14px; position: absolute; top: 53px; left: 165px;}
    header .langs {right: 165px;}
    header .newsletter, header .search {right: 20px;}
    header input {width: 60px;}

    .banner-primary .slide {height: 190px;}
    .banner-primary .caption p {font-size: 16px;}
    .banner-primary .caption a {padding: 4px 8px; font-size: 10px;}

    .col-1-3, .col-2-3 {width: 100%; margin-left: 0; float: none;}
    .col-1-3.img {margin-bottom: 20px;}

    ul.categories, ul.production-phase {display: block; width: 100%; clear: both; text-align: center; overflow: hidden; position: static;}
    ul.production-phase {margin-bottom: 10px;}
    ul.categories li, ul.production-phase li {display: inline-block; margin: 5px 0; font-size: 11px; float: none;}

    .projectos-main > h3 {text-align: center;}

    .projectos-main nav {text-align: center;}
    .projectos-main nav a {margin: 0 5px; font-size: 11px;}

    .archive {font-size: 15px; top: 75px;}
    .noticias .archive {font-size: 12px; top: 23px;}
    .autores .destaques {margin-top: 60px;}

    .projectos-main > h3 {margin: 50px 0 0;}
    .projecto {margin-top: 20px;}

    footer {padding: 10px 0; font-size: 12px; line-height: 25px; text-align: center;}

    footer .rights, footer .contacts {font-size: 9px; float: none;}

    footer .social-icons {margin: 6px 0; float: none;}

}


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

    body {margin-top: 92px;}

    header img {height: 50px; margin-top: 2px;}

    header #pull {left: 147px;}

    header .langs {font-size: 10px; right: 160px;}

}


/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *, *:before, *:after {background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important;}
    a, a:visited {text-decoration: underline;}
    a[href]:after {content: " (" attr(href) ")";}
    abbr[title]:after {content: " (" attr(title) ")";}
    a[href^="#"]:after, a[href^="javascript:"]:after {content: "";}
    pre, blockquote {border: 1px solid #999; page-break-inside: avoid;}
    thead {display: table-header-group;}
    tr, img {page-break-inside: avoid;}
    img {max-width: 100% !important;}
    p, h2, h3 {orphans: 3; widows: 3;}
    h2, h3 {page-break-after: avoid;}
}
