@charset "UTF-8";
@font-face {
  font-family: 'el-tercer-hombre';
  src: url("../fonts/el-tercer-hombre.woff") format("woff");
  src: local("☺"), url("../fonts/el-tercer-hombre.eot"), url("../fonts/el-tercer-hombre.ttf") format("truetype"), url("../fonts/el-tercer-hombre.svg") format("svg");
  font-weight: normal;
  font-style: normal; }
body {
  min-width: 320px; }
  body.not-scroll {
    overflow-y: hidden; }

.header-wrapper {
  width: 100%;
  background-color: #99DBD9;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
          box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15); }
  .header-wrapper .header {
    max-width: 1310px;
    margin: 0 auto;
    height: 80px; }

.navigation-wrapper {
  float: left; }
  .navigation-wrapper .navigation {
    display: block;
    width: 100%;
    height: 100%; }
    .navigation-wrapper .navigation .nav-item {
      display: inline-block;
      margin-right: 70px;
      line-height: 80px; }
      .navigation-wrapper .navigation .nav-item:last-of-type {
        margin-right: 0; }
      .navigation-wrapper .navigation .nav-item > a {
        color: #1d1d1d;
        font: 24px "Helvetica Neue", Helvetica, Arial, sans-serif;
        vertical-align: middle;
        font-style: oblique;
        font-weight: bold;
        line-height: 29px;
        text-transform: uppercase;
        text-decoration: none; }
        .navigation-wrapper .navigation .nav-item > a.always-pink {
          color: #EC008C; }
        .navigation-wrapper .navigation .nav-item > a:hover {
          color: #EC008C; }

.header-social-wrapper {
  float: right;
  height: 100%; }
  .header-social-wrapper .header-social {
    height: 100%; }
    .header-social-wrapper .header-social > a {
      text-decoration: none;
      display: inline-block;
      line-height: 80px;
      margin-right: 54px; }
      .header-social-wrapper .header-social > a:last-of-type {
        margin-right: 0; }
      .header-social-wrapper .header-social > a > img {
        vertical-align: middle; }
      .header-social-wrapper .header-social > a .social-hover {
        display: none; }
      .header-social-wrapper .header-social > a:hover > .social {
        display: none; }
      .header-social-wrapper .header-social > a:hover > .social-hover {
        display: inline-block; }

.mobile-header-wrapper {
  display: none;
  width: 100%;
  background: #99DBD9; }
  .mobile-header-wrapper .mobile-header {
    height: 32px;
    padding: 0 12px; }
    .mobile-header-wrapper .mobile-header .mobile-menu-button {
      float: left;
      width: 23%;
      line-height: 32px; }
      .mobile-header-wrapper .mobile-header .mobile-menu-button > img {
        vertical-align: sub; }
    .mobile-header-wrapper .mobile-header .mobile-header-title-holder {
      float: left;
      width: 54%;
      text-align: center; }
      .mobile-header-wrapper .mobile-header .mobile-header-title-holder .mobile-header-title {
        color: #e7118b;
        font: 14px "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-style: oblique;
        font-weight: bold;
        line-height: 32px;
        text-transform: uppercase;
        text-decoration: none; }
    .mobile-header-wrapper .mobile-header .mobile-social {
      float: right;
      width: 23%;
      text-align: right; }
      .mobile-header-wrapper .mobile-header .mobile-social > a {
        text-decoration: none;
        display: inline-block;
        line-height: 32px;
        margin-right: 8px; }
        .mobile-header-wrapper .mobile-header .mobile-social > a:last-of-type {
          margin-right: 0; }
        .mobile-header-wrapper .mobile-header .mobile-social > a > img {
          vertical-align: sub; }
          .mobile-header-wrapper .mobile-header .mobile-social > a > img[alt="twitter"], .mobile-header-wrapper .mobile-header .mobile-social > a > img[alt="steam"] {
            width: 18px; }
          .mobile-header-wrapper .mobile-header .mobile-social > a > img[alt="facebook"] {
            width: 8px; }
        .mobile-header-wrapper .mobile-header .mobile-social > a .social-hover {
          display: none; }
        .mobile-header-wrapper .mobile-header .mobile-social > a:hover > .social {
          display: none; }
        .mobile-header-wrapper .mobile-header .mobile-social > a:hover > .social-hover {
          display: inline-block; }
    .mobile-header-wrapper .mobile-header .mobile-nav-menu {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 0;
      overflow: hidden;
      background: #99DBD9;
      z-index: 2;
      -webkit-transition: all .3s ease-in-out;
      transition: all .3s ease-in-out; }
      .mobile-header-wrapper .mobile-header .mobile-nav-menu.opened {
        height: 100%;
        overflow: scroll; }
      .mobile-header-wrapper .mobile-header .mobile-nav-menu .mobile-nav-header {
        width: 100%;
        height: 32px;
        padding: 0 12px; }
      .mobile-header-wrapper .mobile-header .mobile-nav-menu .mobile-nav {
        display: block;
        width: 100%;
        text-align: center; }
        .mobile-header-wrapper .mobile-header .mobile-nav-menu .mobile-nav > li {
          margin-top: 50px; }
          .mobile-header-wrapper .mobile-header .mobile-nav-menu .mobile-nav > li > a {
            color: #1d1d1d;
            font: 24px "Helvetica Neue", Helvetica, Arial, sans-serif;
            font-style: oblique;
            font-weight: bold;
            line-height: 29px;
            text-transform: uppercase;
            text-decoration: none; }
            .mobile-header-wrapper .mobile-header .mobile-nav-menu .mobile-nav > li > a.always-pink {
              color: #EC008C; }

.trailer-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0; }

.trailer-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.content-wrapper {
  width: 100%;
  background: url("../images/bg.png");
  background-size: cover; }
  .content-wrapper .content {
    max-width: 1310px;
    margin: 0 auto;
    overflow: auto; }
    .content-wrapper .content .section-1 {
      margin-top: 106px; }
      .content-wrapper .content .section-1 .about-title {
        display: block;
        color: #fff;
        font: 60px "el-tercer-hombre";
        text-align: center; }
      .content-wrapper .content .section-1 .about-text {
        display: block;
        color: #fff;
        font: 24px "Helvetica Neue", Helvetica, Arial, sans-serif;
        margin-top: 43px; }

.owl-carousel {
  position: relative; }

.slider-item {
  max-width: 1310px;
  text-align: center; }

.owl-item {
  opacity: .5; }

.owl-item.active.center {
  opacity: 1; }

#slider-wrapper .owl-nav {
  position: absolute;
  margin: 0;
  width: 100%;
  height: 0;
  top: 50%;
  margin-top: -31px;
  left: 0;
  padding: 0 20px;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out; }
  #slider-wrapper .owl-nav :after {
    content: '';
    display: block;
    clear: both; }
  #slider-wrapper .owl-nav .owl-prev {
    float: left;
    background: none;
    position: relative; }
    #slider-wrapper .owl-nav .owl-prev:after {
      content: '';
      display: block;
      width: 25px;
      height: 42px;
      background: url("../images/arrow.svg");
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg); }
    #slider-wrapper .owl-nav .owl-prev:hover:after {
      color: deeppink;
      font-size: 107px; }
  #slider-wrapper .owl-nav .owl-next {
    float: right;
    background: none;
    position: relative; }
    #slider-wrapper .owl-nav .owl-next:after {
      content: '';
      display: block;
      width: 25px;
      height: 42px;
      background: url("../images/arrow.svg"); }

#slider-wrapper {
  margin-top: 104px; }
  #slider-wrapper .owl-dots {
    display: none; }
    #slider-wrapper .owl-dots .owl-dot > span {
      height: 24px;
      width: 24px;
      background: #27596A;
      margin: 33px 16px; }
    #slider-wrapper .owl-dots .owl-dot.active > span {
      background: yellow; }

.section-2-wrapper {
  width: 100%;
  margin-top: 197px;
  background: url("../images/features-bg.png");
  background-size: cover;
  position: relative; }
  .section-2-wrapper:after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 190px;
    background: url(../images/features-shadow.png);
    background-position-y: bottom;
    background-position-x: center;
    top: 100%;
    left: 0; }
  .section-2-wrapper .section-2 {
    max-width: 1310px;
    margin: 0 auto;
    padding: 42px 0;
    overflow: auto; }
    .section-2-wrapper .section-2 .features-title {
      display: block;
      text-align: center;
      color: #fff;
      font: 60px "el-tercer-hombre";
      line-height: 60px;
      text-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5); }
    .section-2-wrapper .section-2 .key-features-list {
      display: block;
      float: left; }
      .section-2-wrapper .section-2 .key-features-list > li {
        color: #fff;
        font: 24px "Helvetica Neue", Helvetica, Arial, sans-serif;
        line-height: 29px;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
        margin-top: 43px; }

.section-3-wrapper {
  width: 100%;
  position: relative;
  overflow: hidden; }
  .section-3-wrapper:after {
    content: '';
    display: block;
    position: absolute;
    width: 970px;
    height: 750px;
    background: url("../images/head-4.png");
    top: 0;
    left: 50%;
    margin-left: -485px; }
  .section-3-wrapper .section-3 {
    max-width: 1310px;
    margin: 0 auto;
    height: 750px;
    overflow: auto;
    position: relative;
    z-index: 1; }
    .section-3-wrapper .section-3 .section-3-title {
      display: block;
      text-align: center;
      color: #fff;
      font: 60px "el-tercer-hombre";
      line-height: 60px;
      margin-top: 160px;
      text-transform: uppercase; }
    .section-3-wrapper .section-3 .section-3-sub-text {
      display: block;
      text-align: center;
      margin-top: 60px;
      color: #fff;
      font: 90px "el-tercer-hombre";
      line-height: 91px; }
    .section-3-wrapper .section-3 .steam-logo {
      text-align: center;
      margin-top: 60px; }

.footer-wrapper {
  width: 100%;
  background: #2a5f69;
  opacity: .9; }
  .footer-wrapper .footer {
    height: 108px;
    max-width: 1310px;
    margin: 0 auto; }
    .footer-wrapper .footer .footer-social {
      height: 100%;
      text-align: center; }
      .footer-wrapper .footer .footer-social > a {
        text-decoration: none;
        display: inline-block;
        line-height: 108px;
        margin-right: 54px; }
        .footer-wrapper .footer .footer-social > a:last-of-type {
          margin-right: 0; }
        .footer-wrapper .footer .footer-social > a > img {
          vertical-align: middle; }
        .footer-wrapper .footer .footer-social > a .social-hover {
          display: none; }
        .footer-wrapper .footer .footer-social > a:hover > .social {
          display: none; }
        .footer-wrapper .footer .footer-social > a:hover > .social-hover {
          display: inline-block; }

@media screen and (min-width: 1280px) and (max-width: 1599px) {
  .header-wrapper .header,
  .content-wrapper .content,
  .slider-item,
  .section-2-wrapper .section-2,
  .section-3-wrapper .section-3,
  .footer-wrapper .footer {
    max-width: 1100px; }

  .navigation-wrapper .navigation .nav-item {
    margin-right: 50px; }
    .navigation-wrapper .navigation .nav-item > a {
      font-size: 20px; }

  .header-social-wrapper .header-social > a {
    margin-right: 24px; }
    .header-social-wrapper .header-social > a > img {
      width: 90%; } }
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .header-wrapper .header,
  .content-wrapper .content,
  .slider-item,
  .section-2-wrapper .section-2,
  .section-3-wrapper .section-3,
  .footer-wrapper .footer {
    max-width: 800px; }

  .navigation-wrapper .navigation .nav-item {
    margin-right: 20px; }
    .navigation-wrapper .navigation .nav-item > a {
      font-size: 17px; }

  .header-social-wrapper .header-social > a {
    margin-right: 20px; }
    .header-social-wrapper .header-social > a > img {
      width: 80%; }

  .content-wrapper .content .section-1 .about-title,
  .section-2-wrapper .section-2 .features-title,
  .section-3-wrapper .section-3 .section-3-title {
    font-size: 48px; } }
@media screen and (max-width: 1023px) {
  .header-wrapper {
    display: none; }

  .mobile-header-wrapper {
    display: block; }

  .header-wrapper .header,
  .content-wrapper .content,
  .slider-item,
  .section-2-wrapper .section-2,
  .section-3-wrapper .section-3,
  .footer-wrapper .footer {
    max-width: 600px; }

  .content-wrapper .content .section-1 .about-title,
  .section-2-wrapper .section-2 .features-title,
  .section-3-wrapper .section-3 .section-3-title {
    font-size: 35px; }

  .content-wrapper .content .section-1 .about-text,
  .section-2-wrapper .section-2 .key-features-list > li {
    font-size: 16px;
    line-height: normal; }

  .section-3-wrapper .section-3 .section-3-sub-text {
    font-size: 70px; } }
@media screen and (max-width: 640px) {
  .header-wrapper .header,
  .content-wrapper .content,
  .slider-item,
  .section-2-wrapper .section-2,
  .section-3-wrapper .section-3,
  .footer-wrapper .footer {
    max-width: 300px; } }
@media screen and (max-width: 320px) {
  body {
    overflow-x: scroll; } }

/*# sourceMappingURL=style.css.map */