Snack 2 Win

Призы

Barni advent

Authorization - Code

Country

Promotional items photo

Селфи с паспортом

Фото паспорта

Authorization - Phone number

Authorization - E-mail

Согласие на рассылку от Mondelez

Fiscal terms

T&Cs

Feedbacks - Question

Feedbacks - Topic

Receipt photo

Receipt FP

Receipt FD

Receipt FN

Receipt price

Receipt date

Delivery zip

Registration zip

Delivery state

Registration state

Delivery city

Registration city

Delivery address

Registration address

Payout card

Passport issued by

Passport issue date

Passport number

Birthday date

Email

Second name

Last name

First name

Language

Срок действия паспорта

Phone operator for recharge

Штрих-код

Participant's level

Дополнительное фото паспорта

Согласие на обработку персональных данных

Адрес регистрации для налоговой

User ID

<html>
  <div class="bg">
    <img class="desktop-bg background" src="https://kz.barni.org/api/file_keepers/nybg1">
    <img class="mobile-bg background" src="https://kz.barni.org/api/file_keepers/nybgm1">

    <div class="container-ny">
        <a href="https://kz.barni.org/"><div class="flag-button kz"></div></a>
        <a href="https://ge.barni.org/"><div class="flag-button ge"></div></a>
        <a href="https://uz.barni.org/"><div class="flag-button uz"></div></a>
        <a href="https://az.barni.org/"><div class="flag-button az"></div></a>
    </div>
  </div>
    
  
</html>

<style>
  .background {
    display: none;
  }
  
  .bg {
    position: relative;
    width: 100%;
    /*height: 100vh;*/
  }
  
  .bg img {
    width: 100%;
    /*height: 100vh;*/
  }
  
  .kz {
    background-image: url('https://kz.barni.org/api/file_keepers/kz_button');
    background-size: cover;
  }
  
  .ge {
    background-image: url('https://kz.barni.org/api/file_keepers/ge_button');
    background-size: cover;
  }
  
  .uz {
    background-image: url('https://kz.barni.org/api/file_keepers/uz_button');
    background-size: cover;
  }
  
  .az {
    background-image: url('https://kz.barni.org/api/file_keepers/az_button');
    background-size: cover;
  }
  
  
  .container-ny {
    position: absolute;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 4vh;
    column-gap: 3vh;
    max-width: 500px;
    margin: 0 auto;
  }

  .flag-button {
      display: block;
      padding: 10px;
      /*background-color: rgba(240, 240, 240, 0.8); */
      cursor: pointer;
      transition: background-color 0.3s;
      text-decoration: none;
      animation: pulse 1.5s infinite;
      color: #000; /* Цвет текста */
      border-radius: 3vh;
  }

  
  
  
  
    /* Мобильное разрешение */
  @media (max-width: 768px) {
    .mobile-bg {
      display: block;
    }
    
    .container-ny {
      top: 60%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
    
    .flag-button {
      height: 10vh;
      width: 20vh;
    }
    
    .flag-button:active {
      box-shadow: 0 0 10px 5px rgba(0, 123, 255, 0.7);
    }
  }
  
  /* Десктопное разрешение */
  @media (min-width: 769px) {
    .desktop-bg {
      display: block;
    }
    
    .container-ny {
        top: 35%;
        left: 77%;
        transform: translate(-50%, -50%);
    }
    
    .flag-button {
      height: 12vh;
      width: 24vh;
    }
    
    .flag-button:hover {
      animation: none;
      box-shadow: 0 0 10px 5px rgba(0, 123, 255, 0.9);
    }
  }
  
  @keyframes pulse {
    0%, 100% {
      box-shadow: 0 0 10px 5px rgba(0, 123, 255, 0.5);
    }
    
    50% {
      box-shadow: 0 0 10px 5px rgba(0, 123, 255, 0.9);
    }
  }
  
</style>

