.main {
  height: 100vh;
  width: 100%;
  background: url(../assets/1_bg.jpg);
  display: flex;
  flex-direction: row;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  font-family: Barlow, sans-serif, arial;
  position: relative; }
  .main .left {
    width: 55%;
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    z-index: 1; }
    .main .left .text-content {
      text-align: center;
      letter-spacing: 0;
      display: flex;
      flex-direction: column;
      margin: auto;
      width: 100%; }
      .main .left .text-content .title {
        font-size: 18px;
        font-weight: 500;
        color: #FFFFFF;
        text-transform: uppercase; }
        @media only screen and (max-width: 767px) {
          .main .left .text-content .title {
            font-size: 17px; } }
      .main .left .text-content .step {
        width: 196px;
        height: 25px;
        background: #C51324 0% 0% no-repeat padding-box;
        border-radius: 10px;
        width: 196px;
        height: 25px;
        background: #C51324 0% 0% no-repeat padding-box;
        border-radius: 10px;
        margin: 35px auto 10px;
        font-size: 12px;
        color: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: center; }
        @media only screen and (max-width: 430px) {
          .main .left .text-content .step {
            margin: 20px auto 10px -5px; } }
      .main .left .text-content .amount {
        text-align: center;
        color: #FECC0A;
        font-size: 39px;
        font-weight: 800; }
        @media only screen and (max-width: 920px) {
          .main .left .text-content .amount {
            font-size: 28px; } }
      .main .left .text-content .bonus {
        font-size: 71px;
        text-align: center;
        letter-spacing: 0;
        color: #FFFFFF;
        font-weight: 600;
        position: relative;
        width: 360px;
        margin: auto; }
        .main .left .text-content .bonus .fs-30 {
          position: absolute;
          height: 110px;
          transform: matrix(0.87, -0.5, 0.5, 0.87, 0, 0);
          top: -70px;
          right: -55px; }
        @media only screen and (max-width: 920px) {
          .main .left .text-content .bonus {
            font-size: 50px;
            width: 260px;
            margin: auto; }
            .main .left .text-content .bonus .fs-30 {
              height: 85px; } }
      .main .left .text-content .gr {
        font-size: 39px;
        font-family: Barlow-Bold, sans-serif;
        font-weight: 600;
        color: #FFFFFF; }
        @media only screen and (max-width: 920px) {
          .main .left .text-content .gr {
            font-size: 28px; } }
      .main .left .text-content .btn {
        width: 325px;
        height: 55px;
        font-size: 18px;
        letter-spacing: 1.2px;
        animation: pulse 2s infinite;
        font-weight: 500; }
        @media only screen and (max-width: 920px) {
          .main .left .text-content .btn {
            width: 340px;
            font-size: 22px; } }
        @media only screen and (max-width: 767px) {
          .main .left .text-content .btn {
            width: 270px;
            height: 54px;
            font-size: 16px;
            margin: 5px auto 10px; } }
      @media only screen and (max-width: 920px) {
        .main .left .text-content p {
          font-size: 12px; } }
    @media only screen and (max-width: 920px) {
      .main .left {
        width: 100%; }
        .main .left nav {
          position: relative;
          margin: 20px auto; } }
  .main .girl {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 100%;
    z-index: 0; }
    @media only screen and (max-width: 920px) {
      .main .girl {
        height: auto;
        margin: auto;
        width: 100%;
        max-height: 345;
        max-width: 420px;
        left: 50%;
        transform: translate(-50%, 0); } }
  .main .excluseve {
    z-index: 0;
    position: absolute;
    height: 275px;
    right: 0;
    top: 0; }
    @media only screen and (max-width: 920px) {
      .main .excluseve {
        height: 130px; } }
  @media only screen and (max-width: 920px) {
    .main {
      flex-direction: column;
      height: auto;
      padding-bottom: 265px; } }

.games-row {
  opacity: 1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }
  .games-row .title {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    color: #FFFFFF;
    flex-direction: row; }
    .games-row .title span {
      color: #FECC0A; }
    @media only screen and (max-width: 920px) {
      .games-row .title {
        font-size: 18px; } }
    @media only screen and (max-width: 767px) {
      .games-row .title {
        display: flex;
        flex-direction: column; } }
  .games-row .games {
    max-width: 1200px;
    padding: 0 50px;
    margin: 40px auto;
    justify-content: space-between;
    display: flex; }
    .games-row .games .item {
      position: relative;
      height: 13vw;
      width: 13vw;
      max-height: 168px;
      min-height: 105px;
      max-width: 168px;
      min-width: 105px;
      border-radius: 10px;
      overflow: hidden; }
      .games-row .games .item img {
        height: 100%;
        width: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transition: all 1s;
        -webkit-transition: 1s;
        -moz-transition: 1s;
        -o-transition: 1s;
        -ms-transition: all 1s;
        border-radius: 8px !important;
        vertical-align: middle; }
      .games-row .games .item .game-btn-s {
        position: absolute;
        width: 80%;
        height: 28px;
        background: transparent linear-gradient(90deg, #FF5008 0%, #C51324 100%) 0% 0% no-repeat padding-box;
        border-radius: 50px;
        font-size: 11px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        max-width: 150px;
        cursor: pointer;
        pointer-events: none;
        opacity: 0;
        transform: translate(-50%, -50%);
        top: 50%;
        left: 50%; }
      .games-row .games .item:hover .content img {
        transform: scale(1.1);
        opacity: 0.3; }
      .games-row .games .item:hover .game-btn-s {
        z-index: 4;
        transition-delay: 0s;
        transition-duration: 1s;
        transition-property: all;
        transition-timing-function: ease;
        opacity: 1 !important;
        pointer-events: all; }
    @media only screen and (max-width: 767px) {
      .games-row .games {
        width: 100%;
        max-width: 320px;
        padding: 0 10px;
        flex-wrap: wrap;
        margin: 30px auto; }
        .games-row .games .item {
          position: relative;
          height: 93px;
          width: 93px;
          max-height: 93px;
          min-height: 93px;
          max-width: 93px;
          min-width: 93px;
          margin-bottom: 10px; }
          .games-row .games .item .game-btn-s {
            width: 95%;
            font-size: 8px; } }

.g-1st {
  background-image: url(../assets/2_bg.jpg); }

.g-2nd {
  background-image: url(../assets/3_bg.jpg); }

.oferta-btn {
  background: transparent linear-gradient(90deg, #FF5008 0%, #C51324 100%) 0% 0% no-repeat padding-box;
  border-radius: 50px;
  text-align: center;
  color: #FFFFFF;
  text-align: center;
  width: 220px;
  height: 40px;
  display: flex;
  margin: 30px auto 10px;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 16px;
  cursor: pointer; }

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