@import url(../vendor/wow/css/animate.css);
@import url(../vendor/bootstrap/css/bootstrap.min.css);
@font-face {
  font-family: 'HelveticaNeueLight';
  src: url("../fonts/HelveticaNeue-Light.eot");
  src: local("../fonts/HelveticaNeue-Light"), local("../fonts/HelveticaNeue-Light"), url("../fonts/HelveticaNeue-Light.woff") format("woff"), url("../fonts/HelveticaNeue-Light.ttf") format("truetype"); }

@font-face {
  font-family: 'HelveticaNeue';
  src: url("../fonts/HelveticaNeue.eot");
  src: local("../fonts/HelveticaNeue"), local("../fonts/HelveticaNeue"), url("../fonts/HelveticaNeue.woff") format("woff"), url("../fonts/HelveticaNeue.ttf") format("truetype"); }

@font-face {
  font-family: 'HelveticaNeueMedium';
  src: url("../fonts/HelveticaNeue-Medium.eot");
  src: local("../fonts/HelveticaNeue-Medium"), local("../fonts/HelveticaNeue-Medium"), url("../fonts/HelveticaNeue-Medium.woff") format("woff"), url("../fonts/HelveticaNeue-Medium.ttf") format("truetype"); }

@font-face {
  font-family: 'HelveticaNeueBold';
  src: url("../fonts/HelveticaNeue-Bold.eot");
  src: local("../fonts/HelveticaNeue-Bold"), local("../fonts/HelveticaNeue-Bold"), url("../fonts/HelveticaNeue-Bold.woff") format("woff"), url("../fonts/HelveticaNeue-Bold.ttf") format("truetype"); }

@font-face {
  font-family: 'HelveticaNeueCondensed';
  src: url("../fonts/HelveticaNeue-Medium.eot");
  src: local("../fonts/HelveticaNeue-CondensedBold"), local("../fonts/HelveticaNeue-CondensedBold"), url("../fonts/HelveticaNeue-CondensedBold.woff") format("woff"), url("../fonts/HelveticaNeue-CondensedBold.ttf") format("truetype");
  font-weight: bold; }

/* ALL */
@media only screen and (min-width: 120px) and (max-width: 767px) {
  body {
    font-size: 120%; }
    body .go-top {
      display: none; }
    body .main-nav {
      text-align: right !important; }
    body .side-status {
      top: 20% !important; }
      body .side-status .point .left-description {
        display: none !important; }
    body #navbar {
      padding: 0;
      width: 100%; }
      body #navbar .navbar-nav {
        width: 100%; }
        body #navbar .navbar-nav li {
          width: 100%; }
          body #navbar .navbar-nav li a {
            width: 100%; }
    body .team-full h2 {
      padding: 40px 0 0 0; }
    body .portafolio-initial h2 {
      padding: 40px 0 0 0; }
    body .team-detail p {
      width: 100%; }
    body .contacto-banner {
      min-height: 200px; }
    body .main-container .extra-content .content-layout2 {
      padding: 120px 0 240px 0 !important; } }

/* Custom, iPhone Retina */
@media only screen and (min-width: 320px) {
  .navbar-nav {
    width: 100%; }
    .navbar-nav li {
      width: 100%; }
      .navbar-nav li a {
        width: 100%; } }

/* Extra Small Devices, Phones */
/* Small Devices, Tablets */
@media only screen and (min-width: 768px) {
  .portafolio-initial h2 {
    padding: 120px 0 0 0; }
  .content-layout2 {
    padding: 0 0 200px 0; }
  .contacto-banner {
    min-height: 450px; }
  .team-full h2 {
    padding: 120px 0 0 0; }
  .team-detail article .worker:nth-child(odd) .container-worker .col-text {
    float: left; }
  .team-detail article .worker:nth-child(odd) .container-worker .col-image {
    float: right; }
  .team-detail article .worker:nth-child(even) .container-worker .col-text {
    float: left; }
  .team-detail article .worker:nth-child(even) .container-worker .col-image {
    float: right; }
  #navbar {
    width: inherit; }
    #navbar .navbar-nav {
      width: inherit; }
      #navbar .navbar-nav li {
        width: inherit; }
        #navbar .navbar-nav li a {
          width: inherit; } }

/* Medium Devices, Desktops */
/* Large Devices, Wide Screens */
body {
  background: url("../images/background.jpg") repeat 100% center fixed;
  background-color: #0a3ec5;
  background-size: cover; }
  body .main-container {
    padding: 0; }
    body .main-container .header {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 999; }
      body .main-container .header .main-nav {
        position: relative;
        width: 100%;
        height: 40px;
        min-height: 40px;
        background: url("../images/nav.png") repeat-x bottom center #ffffff;
        display: block;
        border-radius: 0;
        border: 0;
        text-align: center; }
        body .main-container .header .main-nav .content-center {
          display: inline-block; }
          body .main-container .header .main-nav .content-center .navbar-header #navbar {
            border: 0; }
          body .main-container .header .main-nav .content-center .navbar-header ul li a {
            color: #0a3ec5;
            background-image: url("../images/nav.png");
            background: url("../images/nav.png") repeat-x bottom center #ffffff;
            display: inline-block;
            padding: 10px;
            font-family: "HelveticaNeueMedium";
            text-align: center; }
            body .main-container .header .main-nav .content-center .navbar-header ul li a.active, body .main-container .header .main-nav .content-center .navbar-header ul li a:active, body .main-container .header .main-nav .content-center .navbar-header ul li a:hover {
              background: url("../images/nav-active.png") repeat-x bottom center #ffffff;
              display: inline-block;
              color: #ffffff;
              text-decoration: none; }
        body .main-container .header .main-nav .navbar-toggle {
          margin-top: 3px;
          margin-bottom: 3px;
          margin-right: 3px; }
    body .main-container .team-full {
      min-height: 100%; }
      body .main-container .team-full h2 {
        font-family: "HelveticaNeueMedium";
        font-size: 5em;
        color: #ffffff;
        line-height: 0.95em; }
      body .main-container .team-full .gallery-team {
        text-align: center;
        width: 95%;
        max-width: 860px;
        margin: auto;
        padding: 90px 0 60px 0; }
        body .main-container .team-full .gallery-team .avatar {
          max-width: 154px;
          display: inline-block;
          margin: 0 0 20px 0; }
          body .main-container .team-full .gallery-team .avatar .image-face {
            border: 6px solid #fff;
            display: inline-block; }
          body .main-container .team-full .gallery-team .avatar .description-name {
            color: #ffffff;
            font-family: "HelveticaNeueMedium"; }
    body .main-container .team-detail article .worker {
      background: #eee5d6;
      margin: 0 0 20px 0; }
      body .main-container .team-detail article .worker:nth-child(odd) .container-worker .col-text {
        float: left; }
      body .main-container .team-detail article .worker:nth-child(even) .container-worker .col-text {
        float: right; }
      body .main-container .team-detail article .worker:last-child {
        margin: 0; }
        body .main-container .team-detail article .worker:last-child .container-worker .col-text {
          float: right; }
      body .main-container .team-detail article .worker .container-worker {
        width: 80%;
        min-width: 220px;
        max-width: 900px;
        margin: 0 auto; }
        body .main-container .team-detail article .worker .container-worker .col-text h3 {
          font-family: "HelveticaNeueLight";
          font-size: 3em;
          padding: 60px 0 0 0; }
        body .main-container .team-detail article .worker .container-worker .col-text p {
          font-family: "HelveticaNeueLight";
          font-size: 1.3em;
          padding: 10px 0 0 0;
          max-width: 210px; }
    body .main-container .home-banner {
      width: 100%;
      display: table;
      height: 90vh;
      min-height: 500px; }
      body .main-container .home-banner .intro {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        position: relative; }
        body .main-container .home-banner .intro .buttons-social {
          position: absolute;
          bottom: 20px;
          width: 100%; }
          body .main-container .home-banner .intro .buttons-social a {
            margin: 0 10px; }
    body .main-container .extra-content {
      position: relative; }
      body .main-container .extra-content.brown {
        background: url("../images/background-brown.jpg") repeat center;
        background-size: cover; }
      body .main-container .extra-content.laptop {
        background: url("../images/background-laptop.jpg") repeat center;
        background-size: cover;
        display: table;
        width: 100%;
        min-height: 600px; }
        body .main-container .extra-content.laptop .intro {
          display: table-cell;
          vertical-align: middle;
          text-align: center;
          position: relative; }
      body .main-container .extra-content .content-layout {
        padding: 120px 0 150px 0;
        text-align: left;
        color: #ffffff;
        font-family: "HelveticaNeueBold";
        font-size: 2.2em;
        line-height: 1em;
        min-height: 500px;
        text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2); }
      body .main-container .extra-content .content-layout2 {
        padding: 150px 0 160px 0;
        min-height: 600px;
        color: #ffffff;
        font-family: "HelveticaNeueBold";
        line-height: 1em;
        max-width: 360px;
        margin: auto; }
        body .main-container .extra-content .content-layout2 h3 {
          font-size: 4.5em;
          line-height: 0.8em;
          margin: 0 0 30px 0;
          font-family: "HelveticaNeueBold"; }
        body .main-container .extra-content .content-layout2 p {
          font-size: 1.4em;
          line-height: 1.1em;
          font-family: "HelveticaNeueMedium"; }
      body .main-container .extra-content .down-options {
        position: absolute;
        bottom: 20px;
        left: 0;
        width: 100%;
        text-align: center;
        overflow: hidden; }
        body .main-container .extra-content .down-options a {
          color: #ffffff;
          font-size: 1.3em;
          margin: 5px 0;
          display: inline-block; }
    body .main-container .content-contact {
      margin: 60px auto 120px;
      background: #ffffff;
      padding: 0 0 70px; }
      body .main-container .content-contact .contacto-banner {
        width: 100%;
        background: url("../images/background-contact.jpg") no-repeat 100% center;
        background-size: cover;
        background-position: center; }
      body .main-container .content-contact .form-contact {
        margin: 40px auto 0;
        width: 90%;
        max-width: 650px; }
        body .main-container .content-contact .form-contact .contact-side {
          font-family: "HelveticaNeueMedium";
          padding: 0 20px 20px; }
        body .main-container .content-contact .form-contact .form {
          padding: 30px 0 0 0; }
          body .main-container .content-contact .form-contact .form input, body .main-container .content-contact .form-contact .form textarea {
            border: 1px solid #000000;
            border-radius: 0;
            width: 100%;
            margin: 0 0 20px 0;
            max-width: 100%;
            min-width: 100%;
            font-family: "HelveticaNeueMedium"; }
          body .main-container .content-contact .form-contact .form .submit-btn {
            text-align: right; }
            body .main-container .content-contact .form-contact .form .submit-btn .send-contact {
              display: inline-block;
              width: 80px;
              min-width: 5%;
              background: #000000;
              color: #ffffff;
              text-shadow: none;
              border: 0;
              border-radius: 0;
              padding: 10px 5px;
              font-size: 1.2em; }
    body .main-container .marcas-banner {
      width: 100%;
      display: table;
      height: 90vh;
      min-height: 400px;
      background: url("../images/background-open.jpg") no-repeat 100% center;
      background-size: contain;
      background-position: center;
      background-color: #000000;
      padding: 40px 0 0 0; }
      body .main-container .marcas-banner h2 {
        padding: 160px 0 0 0;
        font-family: "HelveticaNeueMedium";
        font-size: 5em;
        color: #ffffff;
        line-height: 1em; }
      body .main-container .marcas-banner .intro {
        overflow: visible; }
    body .main-container .isotope-marcas {
      background: #ffffff;
      padding: 80px 0;
      text-align: center; }
      body .main-container .isotope-marcas .isotope-list .isotope-item {
        display: inline-block; }
    body .main-container .portafolio-initial {
      padding: 40px 0 0 0;
      height: 70%;
      min-height: 600px;
      background: url("../images/background-cafe.jpg") repeat 100% center fixed;
      background-color: #0a3ec5;
      background-size: cover; }
      body .main-container .portafolio-initial h2 {
        font-family: "HelveticaNeueMedium";
        font-size: 5em;
        color: #ffffff;
        line-height: 1em; }
      body .main-container .portafolio-initial p {
        padding: 120px 0 200px 0;
        min-height: 600px;
        color: #ffffff;
        font-family: "HelveticaNeue";
        line-height: 1em;
        font-size: 1.8em;
        max-width: 375px;
        margin: auto; }
    body .main-container .portafolio-clientes {
      background: #ffffff;
      padding: 80px 0; }
      body .main-container .portafolio-clientes p.text-description {
        text-align: center; }
      body .main-container .portafolio-clientes .list {
        text-align: center;
        max-width: 900px;
        margin: auto; }
        body .main-container .portafolio-clientes .list .inline-item {
          display: inline-block; }
    body .main-container .section-portafolio .content-portafolio {
      background: url("../images/background.jpg") repeat 100% center fixed;
      background-color: #0a3ec5;
      background-size: cover; }
      body .main-container .section-portafolio .content-portafolio p.logos {
        text-align: center; }
      body .main-container .section-portafolio .content-portafolio .youtube {
        text-align: center;
        margin: 20px 0 80px 0; }
        body .main-container .section-portafolio .content-portafolio .youtube iframe {
          width: 90%;
          max-width: 460px; }
      body .main-container .section-portafolio .content-portafolio .image-view {
        text-align: center;
        margin: 20px 0 80px 0; }
        body .main-container .section-portafolio .content-portafolio .image-view a {
          margin: 5px 10px;
          border: 8px solid #ffffff;
          display: inline-block; }
      body .main-container .section-portafolio .content-portafolio .text-content {
        margin: 110px auto 70px;
        width: 80%;
        max-width: 600px;
        background: rgba(0, 0, 0, 0.5);
        padding: 30px; }
        body .main-container .section-portafolio .content-portafolio .text-content .images {
          text-align: center; }
        body .main-container .section-portafolio .content-portafolio .text-content h2 {
          width: 60%;
          max-width: 300px;
          font-size: 4.5em;
          line-height: 1em;
          color: #ffffff;
          font-family: "HelveticaNeueMedium";
          position: relative;
          top: -80px;
          left: -60px;
          margin: 0 0 -50px 0; }
        body .main-container .section-portafolio .content-portafolio .text-content p {
          color: #ffffff; }
    body .main-container .side-status {
      width: 20px;
      height: 200px;
      position: fixed;
      top: 30%;
      right: 10px;
      z-index: 9; }
      body .main-container .side-status .point {
        width: 15px;
        height: 15px;
        display: inline-block;
        border-radius: 50%;
        margin: 0 0 20px 0;
        border: 2px solid #ffffff;
        position: relative;
        box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4); }
        body .main-container .side-status .point.active {
          background: #ffffff; }
          body .main-container .side-status .point.active .left-description {
            right: 20px;
            position: absolute;
            color: #ffffff;
            min-width: 80px;
            top: -5px;
            display: inline-block;
            text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4); }
        body .main-container .side-status .point .left-description {
          display: none; }
  body .map {
    width: 90%;
    height: 400px;
    overflow: hidden;
    max-width: 820px;
    margin: auto; }
    body .map #gmap_canvas {
      height: 400px;
      width: 100%; }
      body .map #gmap_canvas img {
        max-width: none !important;
        background: none !important; }
  body * {
    font-family: "HelveticaNeue"; }
  body footer {
    min-height: 150px;
    background: #0a3ec5; }
  body img {
    max-width: 100%; }
  body .go-top {
    width: 128px;
    height: 63px;
    position: fixed;
    background: url("../images/go-top.png");
    bottom: 10%;
    right: 0;
    z-index: 9999;
    opacity: 0.85;
    opacity: 0;
    transition: all 1s ease-in-out; }
    body .go-top.show {
      opacity: 1;
      transition: all 1s ease-in-out; }
  body .inline-list {
    list-style: none;
    padding: 0;
    margin: 0; }
    body .inline-list li {
      font-size: 1em;
      display: inline-block; }


section{
  overflow: hidden;
}
.background-video {
  background-position: top center;
  background-repeat: no-repeat;
  bottom: 0;
  left: 0;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: -20%;
  z-index: -1;
}

video,
source {
  bottom: 0;
  left: 0;
  min-height: 100%;
  min-width: 100%;
  position: absolute;
}

.loaded .ytplayer-container {
  display: block;
}

.loaded .placeholder-image {
  opacity: 0;
}

.ytplayer-container {
  bottom: 0;
  height: 100%;
  left: 0;
  min-width: 100%;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 3;
}

.placeholder-image {
  height: 100%;
  left: 0;
  min-height: 100%;
  min-width: 100%;
  position: fixed;
  top: 0;
  z-index: 1;
}

.ytplayer-shield {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 2;
}

.ytplayer-player {
  position: absolute;
}