@import url(https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap);

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
  border: 0;
  font-size: 100%;
  font: inherit;
  margin: 0;
  padding: 0;
  vertical-align: initial
}

:focus {
  outline: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section {
  display: block
}

ol,
ul {
  list-style: none
}

blockquote,
q {
  quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
  content: "";
  content: none
}

input,
input:required {
  box-shadow: none
}

input:-webkit-autofill,
input:-webkit-autofill:active,
input:-webkit-autofill:focus,
input:-webkit-autofill:hover {
  -webkit-box-shadow: inset 0 0 0 30px #fff
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  -moz-appearance: none
}

input[type=search] {
  -webkit-appearance: none;
  -moz-appearance: none
}

input:focus {
  outline: none
}

audio,
canvas,
video {
  display: inline-block;
  max-width: 100%
}

audio:not([controls]) {
  display: none;
  height: 0
}

[hidden] {
  display: none
}

a:active,
a:hover {
  outline: none
}

img {
  height: auto;
  vertical-align: middle
}

img,
picture {
  display: inline-block
}

button,
input {
  line-height: normal
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button;
  background: #0000;
  border: 0;
  cursor: pointer
}

button[disabled],
html input[disabled] {
  cursor: default
}

[disabled] {
  pointer-events: none
}

input[type=checkbox],
input[type=radio] {
  padding: 0
}

input[type=search] {
  -webkit-appearance: textfield;
  box-sizing: initial
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0
}

button {
  background: #0000;
  border: 0
}

textarea {
  overflow: auto;
  resize: vertical;
  vertical-align: top
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  text-indent: 0
}

hr {
  background: #000;
  border: 0;
  box-sizing: initial;
  height: 1px;
  line-height: 0;
  margin: 0;
  overflow: visible;
  padding: 0;
  page-break-after: always;
  width: 100%
}

pre {
  font-family: monospace, monospace;
  font-size: 100%
}

a {
  background-color: #0000
}

abbr[title] {
  border-bottom: none;
  text-decoration: none
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace
}

small,
sub,
sup {
  font-size: 75%
}

sub,
sup {
  line-height: 0;
  position: relative;
  vertical-align: initial
}

sub {
  bottom: -5px
}

sup {
  top: -5px
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1;
  margin: 0;
  padding: 0
}

button,
input {
  overflow: visible
}

button,
select {
  text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
  -webkit-appearance: button
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
  border-style: none;
  outline: 0;
  padding: 0
}

legend {
  border: 0;
  color: inherit;
  display: block;
  max-width: 100%;
  white-space: normal;
  width: 100%
}

fieldset {
  min-width: 0
}

body:not(:-moz-handler-blocked) fieldset {
  display: block
}

progress {
  vertical-align: initial
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit
}

body,
html {
  background: #002f5e
}

.banner {
  font-size: clamp(4px, 1.4814814815vh, 16px);
  height: clamp(270px, 100vh, 100vh);
  overflow: hidden;
  position: relative;
  text-transform: uppercase;
  white-space: nowrap
}

.banner__content {
  transform: translate(-54.2em, -24em);
  z-index: 20
}

.banner__content,
.banner__game {
  left: 50%;
  position: absolute;
  top: 50%
}

.banner__game {
  transform: translate(3.4em, -24.1em);
  z-index: 15
}

.banner img {
  width: 100%
}

@media screen and (max-width:1750px) {
  .banner {
    font-size: clamp(4px, 1.4814814815vh, 14px)
  }
}

@media screen and (max-width:1530px) {
  .banner {
    font-size: clamp(4px, 1.4814814815vh, 12px)
  }
}

@media screen and (max-width:1366px) {
  .banner {
    font-size: clamp(4px, 1.4814814815vh, 11.4px)
  }

  .banner__content {
    transform: translate(-53.2em, -24em)
  }

  .banner__game {
    transform: translate(5.3em, -24.8em)
  }
}

@media screen and (max-width:1280px) {
  .banner__content {
    transform: translate(-51em, -21.9em)
  }

  .banner__game {
    transform: translate(4.8em, -21.8em)
  }
}

@media screen and (max-width:1220px) {
  .banner__content {
    transform: translate(-48em, -21.9em)
  }

  .banner__game {
    transform: translate(1.8em, -22.8em)
  }
}

@media screen and (max-width:1150px) {
  .banner {
    font-size: clamp(6px, 2.0833333333vh, 16px);
    height: clamp(290px, 100vh, 100vh)
  }

  .banner__content {
    transform: translate(-29em, -12.7em)
  }

  .banner__game {
    transform: translate(2.4em, -12.7em)
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .banner__content {
    transform: translate(-38em, -15.9em)
  }

  .banner__game {
    transform: translate(2.6em, -15.8em)
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .banner__content {
    transform: translate(-50%, -39.3em)
  }

  .banner__game {
    transform: translate(-49%, -5.6em)
  }
}

@media screen and (max-width:960px) {
  .banner {
    font-size: clamp(6px, 2.0833333333vh, 12px)
  }
}

@media screen and (max-width:920px) {
  .banner {
    font-size: clamp(6px, 2.0833333333vh, 10px)
  }
}

@media screen and (max-width:770px) {
  .banner {
    font-size: clamp(6px, 2.0833333333vh, 9px)
  }
}

@media screen and (max-width:700px) {
  .banner {
    font-size: clamp(6px, 2.0833333333vh, 8px)
  }
}

@media screen and (max-width:640px) {
  .banner {
    font-size: clamp(6px, 2.0833333333vh, 7.5px)
  }

  .banner__content {
    transform: translate(-39.2em, -17.6em)
  }

  .banner__game {
    transform: translate(3.2em, -17.6em)
  }
}

@media screen and (max-width:600px) {
  .banner__content {
    transform: translate(-37.2em, -17.6em)
  }

  .banner__game {
    transform: translate(1.2em, -18.2em)
  }
}

@media screen and (max-width:570px) {
  .banner {
    font-size: clamp(6px, 1.7857142857vh, 16px);
    height: clamp(332px, 100vh, 100vh)
  }

  .banner__content {
    transform: translate(-50%, -25.7em)
  }

  .banner__game {
    transform: translate(-49%, -2.8em)
  }
}

@media screen and (max-width:380px) {
  .banner {
    font-size: clamp(6px, 1.7857142857vh, 14px)
  }
}

@media screen and (max-width:340px) {
  .banner {
    font-size: clamp(6px, 1.7857142857vh, 12px)
  }
}

@media screen and (max-width:320px) {
  .banner {
    font-size: clamp(6px, 1.7857142857vh, 10.2px)
  }

  .banner__content {
    transform: translate(-50%, -25.1em)
  }
}

.button {
  border: .1875em solid #93e126;
  border-radius: 3.5em;
  box-shadow: 0 0 .5em #92e20a;
  display: inline-block;
  padding: .5em;
  text-decoration: none
}

.button,
.button__inner {
  overflow: hidden;
  position: relative;
  text-transform: uppercase
}

.button__inner {
  align-items: center;
  background: #93e126;
  border-radius: 3em;
  box-shadow: 0 0 1.1625em #92e20a, inset 0 2px 0 #bdff82;
  display: block;
  display: flex;
  height: 3.75em;
  justify-content: center;
  width: 20.5em
}

.button__highlite {
  border-radius: 3em;
  height: 100%;
  left: 0;
  -webkit-mask-image: -webkit-radial-gradient(circle, #fff 100%, #000 0);
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%
}

.button__highlite:before {
  animation-delay: .3s;
  animation-duration: 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-name: animationHighlight;
  animation-timing-function: linear;
  background: linear-gradient(90deg, #fcffff00, #fcffff4d 45%, #fcffff66 50%, #fcffff4d 55%, #fcffff00);
  content: "";
  display: block;
  height: 100%;
  left: -100%;
  position: absolute;
  top: 0;
  transform: skewX(-45deg);
  width: 4em
}

.button__txt {
  color: #32373d;
  font: 700 1.75em Roboto, sans-serif;
  font-style: italic;
  line-height: 1
}

.button:hover {
  opacity: .9
}

@media screen and (max-width:1280px) {
  .button {
    border: .18em solid #93e126;
    padding: .48em
  }

  .button__inner {
    height: 3.63em;
    width: 19.82em
  }

  .button__txt {
    font-size: 1.69em
  }
}

@media screen and (max-width:1150px) {
  .button {
    border: .125em solid #93e126;
    padding: .25em
  }

  .button__inner {
    height: 2em;
    width: 11.25em
  }

  .button__txt {
    font-size: 1em
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .button {
    border: .16em solid #93e126;
    padding: .32em
  }

  .button__inner {
    height: 2.56em;
    width: 14.4em
  }

  .button__txt {
    font-size: 1.28em
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .button {
    border: .125em solid #93e126;
    padding: .5em
  }

  .button__inner {
    height: 3.375em;
    width: 18.125em
  }

  .button__txt {
    font-size: 1.5em
  }
}

@media screen and (max-width:640px) {
  .button {
    border: 1px solid #93e126;
    padding: 2px
  }

  .button__inner {
    height: 2.8em;
    width: 14.93em
  }

  .button__txt {
    font-size: 1.32em
  }
}

@media screen and (max-width:570px) {
  .button {
    border: .125em solid #93e126;
    padding: .3125em
  }

  .button__inner {
    height: 2.25em;
    width: 12em
  }

  .button__txt {
    font-size: 1em
  }
}

@media screen and (max-width:320px) {
  .button__txt {
    font-size: 1.05em;
    margin: .39em 0 0
  }
}

@keyframes animationHighlight {

  0%,
  to {
    left: -100%;
    opacity: 1
  }

  97% {
    left: 120%;
    opacity: 1
  }

  98% {
    left: 120%;
    opacity: 0
  }

  99% {
    left: -100%;
    opacity: 0
  }
}

.content {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center
}

.content__action {
  margin: 4.4em 0 0
}

@media screen and (max-width:1280px) {
  .content__action {
    margin: 4.2em 0 0
  }
}

@media screen and (max-width:1150px) {
  .content__action {
    margin: 2.5em 0 0
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .content__action {
    margin: 3.4em 0 0
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .content__action {
    margin: 2.4em 0 0
  }
}

@media screen and (max-width:640px) {
  .content__action {
    margin: 3.6em 0 0
  }
}

@media screen and (max-width:570px) {
  .content__action {
    margin: 1.6em 0 0
  }
}

@media screen and (max-width:320px) {
  .content__action {
    margin: 1.2em 0 0
  }
}

.decoration__item {
  position: absolute
}

.decoration__item.decoration__item--1 {
  bottom: -52.8em;
  left: -58.2em;
  width: 107.6875em;
  z-index: 2
}

.decoration__item.decoration__item--2 {
  left: -2em;
  top: 50%;
  transform: translateY(-19em);
  width: 10.125em;
  z-index: 2
}

.decoration__item.decoration__item--3 {
  left: 50%;
  top: 50%;
  transform: translate(-20.4em, -49.2em);
  width: 99em;
  z-index: 1
}

@media screen and (max-width:1366px) {
  .decoration__item.decoration__item--1 {
    bottom: -53.4em;
    left: -57.2em
  }

  .decoration__item.decoration__item--2 {
    left: -1.5em;
    transform: translateY(-19em)
  }

  .decoration__item.decoration__item--3 {
    transform: translate(-18.4em, -49em)
  }
}

@media screen and (max-width:1280px) {
  .decoration__item.decoration__item--1 {
    bottom: -54.8em;
    left: -56.2em;
    width: 103.86em
  }

  .decoration__item.decoration__item--2 {
    left: -2.4em;
    transform: translateY(-17em);
    width: 9.74em
  }

  .decoration__item.decoration__item--3 {
    transform: translate(-18.4em, -46.2em);
    width: 95.53em
  }
}

@media screen and (max-width:1220px) {
  .decoration__item.decoration__item--3 {
    transform: translate(-21.4em, -46.2em)
  }
}

@media screen and (max-width:1150px) {
  .decoration__item.decoration__item--1 {
    bottom: -27.4em;
    left: -30.8em;
    width: 58.75em
  }

  .decoration__item.decoration__item--2 {
    left: -1.6em;
    transform: translateY(-19.9em);
    width: 5.5em
  }

  .decoration__item.decoration__item--3 {
    transform: translate(-10.6em, -26.4em);
    width: 54em
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .decoration__item.decoration__item--1 {
    bottom: -38em;
    left: -41.8em;
    width: 75.76em
  }

  .decoration__item.decoration__item--2 {
    left: -2.4em;
    transform: translateY(-12.1em);
    width: 7.12em
  }

  .decoration__item.decoration__item--3 {
    transform: translate(-14em, -33.5em);
    width: 69.68em
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .decoration__item.decoration__item--1 {
    bottom: -33.4em;
    left: -34.4em;
    width: 63.875em
  }

  .decoration__item.decoration__item--2 {
    left: auto;
    right: -1em;
    transform: translateY(-34.9em);
    width: 7.3125em
  }

  .decoration__item.decoration__item--3 {
    transform: translate(-84.8em, -79em);
    width: 161.5625em
  }
}

@media screen and (max-width:640px) {
  .decoration__item.decoration__item--1 {
    bottom: -39em;
    left: -42.8em;
    width: 78.27em
  }

  .decoration__item.decoration__item--2 {
    left: -2em;
    transform: translateY(-13.6em);
    width: 7.33em
  }

  .decoration__item.decoration__item--3 {
    transform: translate(-14em, -35.7em);
    width: 72.13em
  }
}

@media screen and (max-width:570px) {
  .decoration__item.decoration__item--1 {
    bottom: -21.8em;
    left: -24.6em;
    width: 43.4em
  }

  .decoration__item.decoration__item--2 {
    display: none
  }

  .decoration__item.decoration__item--3 {
    transform: translate(-40.6em, -41.8em);
    width: 81.3125em
  }
}

@media screen and (max-width:320px) {
  .decoration__item.decoration__item--1 {
    left: -23.6em
  }
}

.description {
  color: #fff;
  letter-spacing: 3.4%;
  text-align: center
}

.description__txt {
  font: 700 2.875em Roboto, sans-serif;
  font-style: italic;
  line-height: 1.2
}

@media screen and (max-width:1280px) {
  .description {
    letter-spacing: 3.4%
  }

  .description__txt {
    font-size: 2.78em
  }
}

@media screen and (max-width:1150px) {
  .description {
    letter-spacing: 3.4%
  }

  .description__txt {
    font-size: 1.5625em
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .description__txt {
    font-size: 2em
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .description__txt {
    font-size: 2.0625em
  }

  .description ._tablet {
    display: none
  }
}

@media screen and (max-width:640px) {
  .description__txt {
    font-size: 2em
  }

  .description ._tablet {
    display: block
  }
}

@media screen and (max-width:570px) {
  .description__txt {
    font-size: 1.375em
  }
}

.game__content {
  height: 47.625em;
  position: relative;
  width: 47.625em;
  z-index: 1
}

.game__content.active:after {
  display: block
}

.game__content:after {
  background: url(assets/e69f03d95b79b52f9aa4.png) no-repeat 50% 0/contain;
  content: "";
  display: none;
  height: 100%;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 10
}

.game__wheel {
  height: 100%;
  width: 100%;
  z-index: 1
}

.game__btn {
  width: 22.875em;
  z-index: 18
}

.game__btn,
.game__frame {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.game__frame {
  margin: .4375em 0 0 1em;
  width: 54.9375em;
  z-index: 20
}

@media screen and (max-width:1280px) {
  .game__content {
    height: 45.96em;
    width: 45.96em
  }

  .game__btn {
    width: 22.11em
  }

  .game__frame {
    margin: .3em 0 0 .96em;
    width: 53.07em
  }
}

@media screen and (max-width:1150px) {
  .game__content {
    height: 26em;
    width: 26em
  }

  .game__btn {
    width: 12.5em
  }

  .game__frame {
    margin: .1875em 0 0 .5em;
    width: 30em
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .game__content {
    height: 33.52em;
    width: 33.52em
  }

  .game__btn {
    width: 16.08em
  }

  .game__frame {
    margin: .3em 0 0 .64em;
    width: 38.64em
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .game__content {
    height: 39.5625em;
    width: 39.5625em
  }

  .game__btn {
    width: 19em
  }

  .game__frame {
    margin: .4em 0 0 .75em;
    width: 45.625em
  }
}

@media screen and (max-width:640px) {
  .game__content {
    height: 34.66em;
    width: 34.66em
  }

  .game__btn {
    width: 16.63em
  }

  .game__frame {
    margin: .35em 0 0 .66em;
    width: 39.95em
  }
}

@media screen and (max-width:570px) {
  .game__content {
    height: 21em;
    width: 21em
  }

  .game__btn {
    width: 10.125em
  }

  .game__frame {
    margin: .15em 0 0 .375em;
    width: 24.25em
  }
}

.logo {
  margin: 0 0 7.5em;
  width: 26.6875em
}

@media screen and (max-width:1280px) {
  .logo {
    width: 25.9em
  }
}

@media screen and (max-width:1150px) {
  .logo {
    margin: 0 0 4.2em;
    width: 14.5em
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .logo {
    margin: 0 0 5.5em;
    width: 18.8em
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .logo {
    margin: 0 0 3em;
    width: 25.6875em
  }
}

@media screen and (max-width:640px) {
  .logo {
    margin: 0 0 5.7em;
    width: 19.47em
  }
}

@media screen and (max-width:570px) {
  .logo {
    margin: 0 0 2.38em;
    width: 13.625em
  }
}

.title {
  margin: 0 0 2.5em;
  width: 46.9375em
}

@media screen and (max-width:1280px) {
  .title {
    margin: 0 0 2.2em;
    width: 45.4em
  }
}

@media screen and (max-width:1150px) {
  .title {
    margin: 0 0 1.3em;
    width: 25.625em
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .title {
    margin: 0 0 1.6em;
    width: 33.12em
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .title {
    margin: 0 0 1.8em;
    width: 37.5em
  }
}

@media screen and (max-width:640px) {
  .title {
    margin: 0 0 1.7em;
    width: 34.27em
  }
}

@media screen and (max-width:570px) {
  .title {
    margin: 0 0 1.25em;
    width: 22.6875em
  }
}

@media screen and (max-width:320px) {
  .title {
    margin: 0 0 1.1em
  }
}

.modal {
  display: none;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 999
}

.modal.active {
  display: block
}

.modal__overlay {
  background: #00153ad4;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1
}

.modal__confetti {
  background: url(assets/bd8977223c27c28df332.png) no-repeat 50% 0/contain;
  height: 110.6875em;
  left: 50%;
  position: absolute;
  top: -76em;
  transform: translateX(-58.8em);
  width: 121.6875em;
  z-index: 50
}

.modal__wrap {
  background: url(assets/f712d26789a49f45e838.png) no-repeat 50% 50%/contain;
  box-sizing: border-box;
  height: 46.25em;
  left: 50%;
  padding: 0 0 0 4.6em;
  position: absolute;
  top: 50%;
  transform: translate(-47em, -21.9em);
  width: 90.5625em;
  z-index: 10
}

.modal__wrap ._tablet {
  display: none
}

.modal__content {
  align-items: center;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 6.4em;
  text-align: center;
  width: 100%
}

.modal__title {
  letter-spacing: 4%;
  position: relative;
  text-shadow: 0 0 1.875em #03d3ffb3
}

.modal__title span {
  display: inline-block;
  font: 700 4.9375em Roboto, sans-serif;
  font-style: italic;
  line-height: 1;
  vertical-align: middle
}

.modal__title:after,
.modal__title:before {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  height: 8.5em;
  vertical-align: middle;
  width: 8.3125em
}

.modal__title:before {
  background-image: url(assets/df49e16b5dd56cdd5c15.png)
}

.modal__title:after {
  background-image: url(assets/98bde6700502f887cf85.png)
}

.modal__description {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin: .5em 0 0;
  text-align: center
}

.modal__bonus {
  letter-spacing: .4%
}

.modal__bonus span {
  font: 700 2.5em Roboto, sans-serif;
  line-height: 1
}

.modal__bonus i {
  color: #0cf
}

.modal__promo {
  margin: .66em 0 1.6em;
  text-shadow: 0 0 1.875em #03d3ffb3
}

.modal__promo span {
  font: 700 3.8125em Roboto, sans-serif;
  line-height: 1
}

.modal__promo span.modal__promo-txt {
  color: #0cf;
  font-size: 4.9375em
}

.modal__legal {
  letter-spacing: 3%
}

.modal__legal span {
  font: 700 1.125em Roboto, sans-serif;
  line-height: 1.3
}

.modal__action {
  margin: 2.4em 0 0
}

.modal__action .button {
  border: .1875em solid #93e126;
  padding: .5em
}

.modal__action .button__inner {
  height: 3.75em;
  width: 20.5em
}

.modal__action .button__txt {
  font-size: 1.75em
}

@media screen and (max-width:1150px) {
  .modal__confetti {
    height: 60.3125em;
    top: -36.4em;
    transform: translateX(-31.6em);
    width: 66.3125em
  }

  .modal__wrap {
    height: 26em;
    padding: 0 0 0 2.6em;
    transform: translate(-25.2em, -12.8em);
    width: 49.5em
  }

  .modal__content {
    padding-top: 3.8em
  }

  .modal__title {
    letter-spacing: 4%;
    text-shadow: 0 0 1.875em #03d3ffb3
  }

  .modal__title span {
    font-size: 2.6875em
  }

  .modal__title:after,
  .modal__title:before {
    height: 4.6875em;
    width: 4.625em
  }

  .modal__description {
    margin: .3em 0 0
  }

  .modal__bonus {
    letter-spacing: .4%
  }

  .modal__bonus span {
    font-size: 1.3125em
  }

  .modal__promo {
    margin: .4em 0 .6em;
    text-shadow: 0 0 1.875em #03d3ffb3
  }

  .modal__promo span {
    font-size: 2.0625em
  }

  .modal__promo span.modal__promo-txt {
    font-size: 2.75em
  }

  .modal__legal {
    letter-spacing: 3%;
    line-height: .7
  }

  .modal__legal span {
    font-size: .625em
  }

  .modal__action {
    margin: 1.1em 0 0
  }

  .modal__action .button {
    border: .125em solid #93e126;
    padding: .25em
  }

  .modal__action .button__inner {
    height: 2em;
    width: 11.25em
  }

  .modal__action .button__txt {
    font-size: 1em
  }
}

@media screen and (max-width:1150px)and (max-height:600px) {
  .modal__confetti {
    height: 77.84em;
    top: -53.4em;
    transform: translateX(-40.8em);
    width: 85.52em
  }

  .modal__wrap {
    height: 33.16em;
    padding: 0 0 0 3.3em;
    transform: translate(-32.8em, -15.8em);
    width: 63.8em
  }

  .modal__content {
    padding-top: 4.8em
  }

  .modal__title {
    letter-spacing: 4%;
    text-shadow: 0 0 2.4em #03d3ffb3
  }

  .modal__title span {
    font-size: 3.44em
  }

  .modal__title:after,
  .modal__title:before {
    height: 6em;
    width: 5.92em
  }

  .modal__description {
    margin: .3em 0 0
  }

  .modal__bonus {
    letter-spacing: .4%
  }

  .modal__bonus span {
    font-size: 1.76em
  }

  .modal__promo {
    margin: .4em 0 1.2em;
    text-shadow: 0 0 2.4em #03d3ffb3
  }

  .modal__promo span {
    font-size: 2.64em
  }

  .modal__promo span.modal__promo-txt {
    font-size: 3.52em
  }

  .modal__legal {
    letter-spacing: 3%;
    line-height: .7
  }

  .modal__legal span {
    font-size: .8em
  }

  .modal__action {
    margin: 1.5em 0 0
  }

  .modal__action .button {
    border: .16em solid #93e126;
    padding: .32em
  }

  .modal__action .button__inner {
    height: 2.56em;
    width: 14.4em
  }

  .modal__action .button__txt {
    font-size: 1.28em
  }
}

@media screen and (max-width:1150px)and (min-height:1366px) {
  .modal__confetti {
    height: 107.0625em;
    top: -72.4em;
    transform: translateX(-56.4em);
    width: 117.6875em
  }

  .modal__wrap {
    background-image: url(assets/26019558a01d6f997485.png);
    height: 68em;
    padding: 0 0 0 2.6em;
    transform: translate(-32.2em, -32.7em);
    width: 61.6875em
  }

  .modal__wrap ._tablet {
    display: block
  }

  .modal__content {
    padding-top: 8.6em
  }

  .modal__title span {
    font-size: 3.9375em
  }

  .modal__title:after,
  .modal__title:before {
    height: 7.375em;
    width: 7.25em
  }

  .modal__description {
    margin: 1.5em 0 0
  }

  .modal__bonus {
    letter-spacing: .4%
  }

  .modal__bonus span {
    font-size: 2.6875em;
    line-height: 1.2
  }

  .modal__promo {
    margin: 1.8em 0 2.6em
  }

  .modal__promo span {
    font-size: 3.5em;
    line-height: 1.2
  }

  .modal__promo span.modal__promo-txt {
    font-size: 4.5em
  }

  .modal__legal {
    letter-spacing: 3%;
    line-height: .7
  }

  .modal__legal span {
    font-size: 1.4375em
  }

  .modal__action {
    margin: 2.8em 0 0
  }

  .modal__action .button {
    border: .125em solid #93e126;
    padding: .625em
  }

  .modal__action .button__inner {
    height: 4em;
    width: 22.25em
  }

  .modal__action .button__txt {
    font-size: 1.9375em;
    margin-top: .125em
  }
}

@media screen and (max-width:640px) {
  .modal__confetti {
    height: 77.84em;
    top: -53.4em;
    transform: translateX(-40.8em);
    width: 85.52em
  }

  .modal__wrap {
    background-image: url(assets/f712d26789a49f45e838.png);
    height: 33.16em;
    padding: 0 0 0 3.3em;
    transform: translate(-32.8em, -15.8em);
    width: 63.8em
  }

  .modal__wrap ._tablet {
    display: none
  }

  .modal__content {
    padding-top: 4.8em
  }

  .modal__title {
    letter-spacing: 4%;
    text-shadow: 0 0 2.4em #03d3ffb3
  }

  .modal__title span {
    font-size: 3.44em
  }

  .modal__title:after,
  .modal__title:before {
    height: 6em;
    width: 5.92em
  }

  .modal__description {
    margin: .3em 0 0
  }

  .modal__bonus {
    letter-spacing: .4%
  }

  .modal__bonus span {
    font-size: 1.76em
  }

  .modal__promo {
    margin: .4em 0 1.2em;
    text-shadow: 0 0 2.4em #03d3ffb3
  }

  .modal__promo span {
    font-size: 2.64em
  }

  .modal__promo span.modal__promo-txt {
    font-size: 3.52em
  }

  .modal__legal {
    letter-spacing: 3%;
    line-height: .7
  }

  .modal__legal span {
    font-size: .8em
  }

  .modal__action {
    margin: 1.5em 0 0
  }

  .modal__action .button {
    border: .16em solid #93e126;
    padding: .32em
  }

  .modal__action .button__inner {
    height: 2.56em;
    width: 14.4em
  }

  .modal__action .button__txt {
    font-size: 1.28em
  }
}

@media screen and (max-width:570px) {
  .modal__confetti {
    height: 46.3125em;
    top: -25.6em;
    transform: translateX(-24em);
    width: 50.875em
  }

  .modal__wrap {
    background-image: url(assets/0aafc8e98d6528911a2a.png);
    height: 35em;
    padding: 0 0 0 .2em;
    transform: translate(-15.4em, -16.5em);
    width: 31.1875em
  }

  .modal__wrap ._tablet {
    display: block
  }

  .modal__content {
    padding-top: 6.4em
  }

  .modal__title span {
    font-size: 1.6875em
  }

  .modal__title:after,
  .modal__title:before {
    height: 3.125em;
    width: 3.0625em
  }

  .modal__description {
    margin: .9em 0 0
  }

  .modal__bonus {
    letter-spacing: .4%
  }

  .modal__bonus span {
    font-size: 1.1875em;
    line-height: 1.2
  }

  .modal__promo {
    margin: .6em 0 1em
  }

  .modal__promo span {
    font-size: 1.5em;
    line-height: 1.25
  }

  .modal__promo span.modal__promo-txt {
    font-size: 1.9375em
  }

  .modal__legal {
    letter-spacing: 0;
    line-height: .5
  }

  .modal__legal span {
    font-size: .625em
  }

  .modal__action {
    margin: 1.2em 0 0
  }

  .modal__action .button {
    border: .125em solid #93e126;
    padding: .25em
  }

  .modal__action .button__inner {
    height: 1.75em;
    width: 9.625em
  }

  .modal__action .button__txt {
    font-size: .875em
  }
}

@media screen and (max-width:320px) {
  .modal__confetti {
    height: 54.22em;
    top: -34.2em;
    transform: translateX(-28.4em);
    width: 59.61em
  }

  .modal__wrap {
    height: 41.8em;
    padding: 0;
    transform: translate(-18.4em, -18.8em);
    width: 37em
  }

  .modal__content {
    padding-top: 7.8em
  }

  .modal__title span {
    font-size: 1.96em
  }

  .modal__title:after,
  .modal__title:before {
    height: 4.2em;
    width: 4.2em
  }

  .modal__description {
    margin: .6em 0 0
  }

  .modal__bonus {
    letter-spacing: .4%
  }

  .modal__bonus span {
    font-size: 1.37em
  }

  .modal__promo {
    margin: .6em 0 1.4em
  }

  .modal__promo span {
    font-size: 1.76em;
    line-height: 1.25
  }

  .modal__promo span.modal__promo-txt {
    font-size: 2.25em
  }

  .modal__legal {
    letter-spacing: 0;
    line-height: -.0625em
  }

  .modal__legal span {
    font-size: .69em
  }

  .modal__action {
    margin: 1.8em 0 0
  }

  .modal__action .button {
    border: 1px solid #93e126;
    padding: .29em
  }

  .modal__action .button__inner {
    height: 2.1em;
    width: 11.37em
  }

  .modal__action .button__txt {
    font-size: 1em
  }
}