*{
  margin:0;
  padding:0;
  box-sizing:border-box}
html{
  font-size:62.5%;
  -webkit-text-size-adjust:100%;
  height:100%}
body{
  position:relative;
  min-height:100%;
  font-size:1.7rem;
  font-family:"MyriadPro", Arial, sans-serif;
  color:#000;
  line-height:1.1}
p{
  margin-bottom:0.5rem}
.bg{
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  z-index:-1;
  animation:bgMove 15s linear infinite;
  -webkit-animation:bgMove 15s linear infinite}
.content_wrap{
  padding:1% 0;
  height:100%}
.content{
  background:#fff;
  max-width:112.5rem;
  border-radius:12px;
  padding:5rem 4.5rem;
  width:96%;
  margin:auto}
.left_side{
  position:relative;
  width:37%;
  display:inline-block;
  vertical-align:top}
.slide{
  width:100%;
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  transition:opacity linear 1s;
  text-align:center;
  }
.slide.active{
  position:relative;
  z-index:2;
  opacity:1}
.slide img{
  max-width:100%;
  border:1rem solid #000}
.right_side{
  width:62%;
  display:inline-block;
  vertical-align:top;
  padding-left:4%;
  text-align:center}
.step{
  display:none}
.title_text{
  color:#ff0600;
  font-weight:bold;
  text-transform:uppercase;
  font-size:7.6rem}
.large_text{
  font-size:3rem;
  text-transform:uppercase;
  font-weight:bold;
  margin-bottom:1.3rem}
.text{
  margin-bottom:1rem}
.text span{
  font-weight:bold}
.first_step{
  display:block}
.first_step .title_text{
  font-size:10.8rem}
.first_step .text{
  font-size:2.7rem;
  text-transform:uppercase}
.first_step .large_text{
  font-size:4rem}
.q_block{
  display:none}
  .q_block.current {
      display: block;
  }
.question{
  color:#007eff;
  font-size:3rem;
  font-weight:bold;
  margin-bottom:1.8rem}
.question_text{
  margin-bottom:1.7rem}
.choice_block{
  width:70%;
  display:block;
  margin:0 auto 1rem}
.choice_block li{
  display:inline-block;
  vertical-align:middle;
  font-size:1.2em;
  margin-bottom:1rem;
  padding:0 15px 0 25px;
  cursor:pointer;
  position:relative;
  width:49%;
  text-align:left}
.choice_block li:before{
  content:"";
  width:14px;
  height:14px;
  border:1px solid #959595;
  display:block;
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  margin:auto;
  transition:all 0.3s linear}
.choice_block li.active:before{
  background:#007eff;
  border-color:#007eff}
.loading_block{
  display:none}
.progress_bar{
  width:100%;
  border-radius:4px;
  height:4rem;
  background:#e8e8e8;
  margin:0 auto 1.5rem auto;
  position:relative;
  border-radius:5px}
.progress_bar:before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:0;
  z-index:5;
  animation:progress 6s ease-in-out forwards;
  -webkit-animation:progress 6s ease-in-out forwards;
  background:#3398ff;
  border-radius:5px}
.run_load{
  display:none}
.run_load:first-child{
  display:block}
.final_step > *{
  display:none}
.f_title{
  font-size:5.1rem;
  color:#007eff;
  text-transform:uppercase;
  font-weight:bold}
.f_large_text{
  font-size:3.2rem;
  font-weight:bold}
.green_color{
  font-weight:bold;
  color:#609f4e}
.red_color{
  font-size:2.4rem;
  color:#ff0600;
  font-weight:bold}
.rules{
  text-align:left;
  font-weight:bold;
  margin-bottom:2rem}
.rules li{
  padding:1rem 0 1rem 5rem;
  list-style-type:none;
  position:relative}
.rules li span{
  width:4rem;
  height:4rem;
  color:#fff;
  border-radius:50%;
  background:#ff0600;
  line-height:4rem;
  text-align:center;
  font-size:3.8rem;
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  margin:auto}
.button{
  background:#fff;
  color:#8d8d8d;
  text-transform:uppercase;
  border-radius:5rem;
  border:0.8rem solid #d9d9d9;
  text-decoration:none;
  padding:1.5rem 2.5rem;
  font-size:4.9rem;
  font-weight:bold;
  min-width:40%;
  display:inline-block;
  transition:all 0.2s linear;
  margin:0 5px}
.button:hover{
  background:#d9d9d9}
.ok_button,.yes_btn, .btn-fin{
  text-shadow:0 3px 3px rgba(0, 66, 134, 0.75);
  background:#007eff;
  color:#fff}
.ok_button:hover,.yes_btn:hover,.btn-fin:hover{
  background:#3398ff}
@-webkit-keyframes bgMove {
  from{
    background-position:0 0;
  }
  to{
    background-position:0 1080px;
  }
}
@keyframes bgMove {
  from{
    background-position:0 0;
  }
  to{
    background-position:0 1080px;
  }
}
@keyframes progress {
  from{
    width:0;
  }
  to{
    width:100%;
  }
}
@-webkit-keyframes progress {
  from{
    width:0;
  }
  to{
    width:100%;
  }
}
@media screen and (max-width: 1200px){
  html{
    font-size:55.5%}
}
@media screen and (max-width: 1000px){
  html{
    font-size:45.5%}
}
@media screen and (max-width: 780px){
  html{
    font-size:35%}
  body{
    font-size:2.5rem}
  .content{
    max-width:450px;
    padding:2rem}
  .left_side,.right_side{
    display:block;
    margin:auto;
    width:100%;
    padding:0}
  .slide img{
    max-height:40rem}
  .choice_block{
    width:100%}
  .f_title{
    font-size:3.1rem}
  .first_step .title_text,.title_text{
    font-size:5rem}
}
.location {
  text-transform: uppercase;
  font-weight: 700;
  position: absolute;
  bottom: 20px;
  right: 20px;
  z-index: 11;
}
.location img {
  max-width: 100px;
  display: block;
  margin: 0 auto;
}
.random-num {
  font-weight: 700;
  color: #fe1c56;
  padding-right: 5px;
}
.location p {
  margin: 2px 0 0;
  font-size: 14px;
  background-color: #000000;
  padding: 5px 15px;
  border-radius: 15px;
  color: #fff;
  text-align: center;
}
@media (max-width: 780px) {
  .left_side {
    padding-bottom: 70px;
  }
  .location {
    bottom: 10px;
    left: 50%;
    text-align: center;
    right: auto;
    transform: translateX(-50%);
    width: auto;
    min-width: 200px;
  }
  .location p {
    padding: 5px;
  }
  .location img {
    display: none;
  }
}