@font-face {
  font-family: "PanText";
  src: url(../fonts/Montserrat.otf) format("opentype");
  src: url(../fonts/Montserrat.ttf) format("truetype");
  src: url(../fonts/Montserrat.woff2) format("woff2");
}

:root {
  font-family: PanText, sans-serif;
  color-scheme: light dark;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  place-items: center;
  overflow: hidden;
  height: 100vh;
  height: -moz-available;
  height: -webkit-stretch;
  width: 100vw;
  background: url(../img/tlo.jpg) no-repeat center;
  background-size: cover;
}

button {
  position: absolute;
  outline: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  background-color: transparent;
}

button img {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

button:focus,
button:focus-visible {
  outline: none;
}

a {
  position: absolute;
}

.loader {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: black;
  font-size: 18px;
  color: white;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.gameContainer {
  position: absolute;
  margin: auto;
  height: 177.777vw;
  width: 100vw;
  max-height: 100vh;
  max-width: 56.25vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.first__button {
  width: 61%;
  height: 6%;
  top: 84%;
  left: 19.4%;
}

.rules__first {
  position: absolute;
  width: 15.8%;
  height: 2%;
  top: 92%;
  left: 42%;
}

.answer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  left: 10%;
  width: 78%;
  height: 6%;
}

.answer img {
  width: 6%;
  height: auto;
  height: -moz-fit-content;
}

.answer__button_1_1 {
  top: 56%;
}

.answer__button_1_2 {
  top: 64%;
}

.answer__button_1_3 {
  top: 72%;
}

.answer__button_2_1 {
  top: 60.7%;
}

.answer__button_2_2 {
  top: 68.7%;
}

.answer__button_2_3 {
  top: 76.5%;
}

.answer__button_3_1 {
  top: 58.1%;
}

.answer__button_3_2 {
  top: 66%;
  height: 7.5%;
}

.answer__button_3_3 {
  top: 76.5%;
}

.next__question {
  left: 19.3%;
  height: 6%;
  width: 61.2%;
}

.next1 {
  top: 82.6%;
}

.next2 {
  top: 87.1%;
}

.next3 {
  top: 87%;
}

.next__button {
  left: 14.6%;
  width: 70.9%;
  height: 6%;
}

.button_A {
  top: 84.9%;
}

.button_B {
  top: 82.7%;
}

.button_C {
  top: 81.7%;
}

form {
  position: absolute;
  height: 100%;
  width: 100%;
}

form textarea, form input {
  position: absolute;
  background-color: transparent;
  resize: none;
  margin: 0;
  outline: none;
  border: 0;
  color: white;
  font-family: PanText, sans-serif;
  font-size: 2vh;
}

form textarea.active__font,
form input.active__font {
  font-size: 3.55vw;
}

form textarea::-webkit-input-placeholder, form input::-webkit-input-placeholder {
  font-family: PanText, sans-serif;
}

form textarea:-ms-input-placeholder, form input:-ms-input-placeholder {
  font-family: PanText, sans-serif;
}

form textarea::-ms-input-placeholder, form input::-ms-input-placeholder {
  font-family: PanText, sans-serif;
}

form textarea::placeholder, form input::placeholder {
  font-family: PanText, sans-serif;
}

form textarea {
  width: 77.6%;
  height: 31.9%;
  top: 50.6%;
  left: 9.2%;
  padding: 2%;
}

form input {
  height: 3.7%;
  width: 68.7%;
  left: 9.1%;
}

form #name {
  top: 22.8%;
}

form #surname {
  top: 32%;
}

form #email {
  top: 41.3%;
}

form #phone {
  top: 50.3%;
}

form .checkbox_error {
  background: url(../img/07/Checkbox_Bad.png) center no-repeat !important;
}

form input:-webkit-autofill.show-error,
form input:-webkit-autofill:hover.show-error,
form input:-webkit-autofill:focus.show-error,
form input:-webkit-autofill:active.show-error,
form .show-error {
  background-color: #ff0033;
}

form input[type=checkbox] {
  display: none;
}

form input[type=checkbox] + label {
  cursor: pointer;
  display: inline-block;
  position: absolute;
  padding: 0 0 0 0px;
  background-position: left top !important;
  left: 9.2%;
  background: url(../img/07/Checkbox.png) center no-repeat;
}

form .rules_checkbox + .rules_label {
  top: 57.3%;
  height: 3.2%;
  width: 76.7%;
  background-size: 3.8% 48% !important;
}

form .marketing_checkbox + .marketing_label {
  top: 62.3%;
  height: 6.2%;
  width: 76.7%;
  background-size: 3.8% 26.5% !important;
}

form input[type=checkbox]:checked + label {
  background: url(../img/07/Checkbox_ok.png) center no-repeat;
}

form .send-button {
  cursor: pointer;
  top: 89.1%;
  left: 19.3%;
  width: 61.4%;
  height: 6%;
  padding: 0;
}

form .hero-contact {
  top: 87.5%;
}

.char__counter {
  position: absolute;
  top: 85.5%;
  left: 78.5%;
  color: white;
  font-size: 2vh;
}

.char__counter.active__font {
  font-size: 3.55vw;
}

.rules_link {
  position: absolute;
  width: 27.3%;
  top: 57.7%;
  height: 1.3%;
  left: 58%;
}

.try__again {
  width: 27.3%;
  top: 57.7%;
  height: 1.3%;
  left: 58%;
}

.share__button {
  width: 27.3%;
  top: 57.7%;
  height: 1.3%;
  left: 58%;
}

.button__share {
  width: 70.3%;
  top: 78.6%;
  height: 6%;
  left: 15%;
}

.try__again {
  width: 70.3%;
  top: 87.3%;
  height: 6%;
  left: 15%;
}
/*# sourceMappingURL=style.css.map */