.cover-bg,
.step > .container-fluid {
  background-size: cover;
  background-repeat: no-repeat;
}
.landing-bg {
  background: url(../img/intro.jpg) no-repeat scroll;
}
.thankyou-bg {
  background: url(../img/thankyou2.jpg) no-repeat scroll;
}
.instantwin-bg {
  background: url(../img/instantwin2.jpg) no-repeat scroll;
}
.step-1-bg {
  background-image: url(../img/akis-questions.jpg);
}
.step-1a-bg {
  background-image: url(../img/step-1a.jpg);
}
.step-2-bg {
  background-image: url(../img/step-2.jpg);
}
.step-2a-bg {
  background-image: url(../img/step-2a.jpg);
}
.step-3-bg {
  background-image: url(../img/step-3.jpg);
}
.step-3a-bg {
  background-image: url(../img/step-3a.jpg);
}
.step-4-bg {
  background-image: url(../img/step-4.jpg);
}
.step-4a-bg {
  background-image: url(../img/step-4a.jpg);
}
.step-5-bg {
  background-image: url(../img/step-5.jpg);
}
.step-5a-bg {
  background-image: url(../img/step-5a.jpg);
}
.video-bg {
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  display: block;
}
.question {
  font-size: 3em;
  line-height: 1.2em;
  margin-bottom: 1em;
}
.answers {
  font-size: 2.5em;
  padding-left: 2rem !important;
}
input[type="radio"] {
  appearance: none;
  width: 10px;
  height: 10px;
  border: 1px solid white;
  background-color: transparent;
  position: relative;
  cursor: pointer;
  box-shadow: 2px 2px 0 white;
  display: inline-block;
  margin-right: 10px;
}

input[type="radio"]:checked::after {
  content: "✔";
  font-size: 15px;
  color: #17489d;
  position: absolute;
  top: 58%;
  left: 70%;
  transform: translate(-45%, -55%);
  font-weight: bold;
}
.arrow-quiz-position {
  position: absolute;
  left: 50%;
  bottom: 8%;
  width: 10em;
}
.final-score-container,
.thanks-container {
  position: absolute;
  left: 15%;
  top: 32%;
}
.retry-btn {
  width: 100%;
  background: white;
  color: #17489d;
  font-size: 3em;
  font-weight: 500;
  border: none;
}
.retry-btn:hover,
.retry-btn:active,
.retry-btn:focus {
  width: 100%;
  background: #17489d;
  color: white;
  font-size: 3em;
  font-weight: 500;
  border: none;
}
.quiz-btn {
  width: 100%;
  background: #004976;
  color: #0e3a2f;
  font-size: 3.5em;
  border: 5px solid #004976;
  border-radius: 48px;
  line-height: 1em;
  padding: 30px 50px;
  text-align: center;
  margin-bottom: 30px;
}
.quiz-btn.selected {
  background: #fff;
  border-color: #fff;
  outline: none;
}
.quiz-btn.wrong {
  border-color: #ed1c24;
}
.quiz-btn.correct {
  background: #0e3a2f;
  border-color: #0e3a2f;
  color: #004976;
}
.result-cta .cta-btn {
  line-height: 26px;
  padding: 20px 40px;
}
.result-cta .cta-btn::after {
  content: "\203A";
  font-size: 1.4em;
  margin-left: 5px;
}
.result-cta.final .cta-btn::after {
  display: none;
}

/********************/

.pyro > .before,
.pyro > .after {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  box-shadow: 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff;
  -moz-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -webkit-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -o-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -ms-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
}

.pyro > .after {
  -moz-animation-delay: 1.25s, 1.25s, 1.25s;
  -webkit-animation-delay: 1.25s, 1.25s, 1.25s;
  -o-animation-delay: 1.25s, 1.25s, 1.25s;
  -ms-animation-delay: 1.25s, 1.25s, 1.25s;
  animation-delay: 1.25s, 1.25s, 1.25s;
  -moz-animation-duration: 1.25s, 1.25s, 6.25s;
  -webkit-animation-duration: 1.25s, 1.25s, 6.25s;
  -o-animation-duration: 1.25s, 1.25s, 6.25s;
  -ms-animation-duration: 1.25s, 1.25s, 6.25s;
  animation-duration: 1.25s, 1.25s, 6.25s;
}

@-webkit-keyframes bang {
  to {
    box-shadow: -183px -241.6666666667px #0055ff,
      173px -282.6666666667px #5500ff, -213px -20.6666666667px #ff00b7,
      -215px 49.3333333333px #5e00ff, -135px -414.6666666667px #b7ff00,
      -108px -243.6666666667px #00f2ff, 244px -151.6666666667px #00ffea,
      168px -108.6666666667px #00b3ff, -68px -28.6666666667px #ff005e,
      -107px -73.6666666667px #91ff00, 114px -58.6666666667px #4dff00,
      65px 82.3333333333px #ff0073, -198px -39.6666666667px #ff0004,
      66px -306.6666666667px #00ff91, 215px -109.6666666667px #00ff66,
      -231px -91.6666666667px #00d0ff, -37px -395.6666666667px #f200ff,
      -191px -207.6666666667px #ff2200, 121px -326.6666666667px #f700ff,
      29px -66.6666666667px #ff0051, 88px -201.6666666667px #007bff,
      122px -371.6666666667px #ff0062, -45px -299.6666666667px #0080ff,
      88px -164.6666666667px #0022ff, 110px -268.6666666667px #ff007b,
      71px -24.6666666667px #004dff, 170px -16.6666666667px #00ff84,
      -148px -362.6666666667px #ff0066, -235px -79.6666666667px #62ff00,
      181px 27.3333333333px #00ffea, 161px -161.6666666667px #ff00fb,
      -86px -121.6666666667px #ea00ff, 10px -205.6666666667px #ffc400,
      14px -149.6666666667px #ff2b00, 242px -122.6666666667px #00eaff,
      -77px -116.6666666667px #6600ff, 51px -368.6666666667px #84ff00,
      -42px 63.3333333333px #eeff00, -84px 74.3333333333px #77ff00,
      -125px -87.6666666667px #0091ff, 200px 72.3333333333px #7b00ff,
      186px -11.6666666667px #c800ff, -178px -134.6666666667px #2bff00,
      -71px -315.6666666667px #00ff9d, -116px -221.6666666667px #fffb00,
      -113px 43.3333333333px #ff4d00, -158px -371.6666666667px #ff4000,
      234px -374.6666666667px #aa00ff, -103px -158.6666666667px #ccff00,
      19px -389.6666666667px #ff2200, 38px -255.6666666667px #ff009d;
  }
}
@-moz-keyframes bang {
  to {
    box-shadow: -183px -241.6666666667px #0055ff,
      173px -282.6666666667px #5500ff, -213px -20.6666666667px #ff00b7,
      -215px 49.3333333333px #5e00ff, -135px -414.6666666667px #b7ff00,
      -108px -243.6666666667px #00f2ff, 244px -151.6666666667px #00ffea,
      168px -108.6666666667px #00b3ff, -68px -28.6666666667px #ff005e,
      -107px -73.6666666667px #91ff00, 114px -58.6666666667px #4dff00,
      65px 82.3333333333px #ff0073, -198px -39.6666666667px #ff0004,
      66px -306.6666666667px #00ff91, 215px -109.6666666667px #00ff66,
      -231px -91.6666666667px #00d0ff, -37px -395.6666666667px #f200ff,
      -191px -207.6666666667px #ff2200, 121px -326.6666666667px #f700ff,
      29px -66.6666666667px #ff0051, 88px -201.6666666667px #007bff,
      122px -371.6666666667px #ff0062, -45px -299.6666666667px #0080ff,
      88px -164.6666666667px #0022ff, 110px -268.6666666667px #ff007b,
      71px -24.6666666667px #004dff, 170px -16.6666666667px #00ff84,
      -148px -362.6666666667px #ff0066, -235px -79.6666666667px #62ff00,
      181px 27.3333333333px #00ffea, 161px -161.6666666667px #ff00fb,
      -86px -121.6666666667px #ea00ff, 10px -205.6666666667px #ffc400,
      14px -149.6666666667px #ff2b00, 242px -122.6666666667px #00eaff,
      -77px -116.6666666667px #6600ff, 51px -368.6666666667px #84ff00,
      -42px 63.3333333333px #eeff00, -84px 74.3333333333px #77ff00,
      -125px -87.6666666667px #0091ff, 200px 72.3333333333px #7b00ff,
      186px -11.6666666667px #c800ff, -178px -134.6666666667px #2bff00,
      -71px -315.6666666667px #00ff9d, -116px -221.6666666667px #fffb00,
      -113px 43.3333333333px #ff4d00, -158px -371.6666666667px #ff4000,
      234px -374.6666666667px #aa00ff, -103px -158.6666666667px #ccff00,
      19px -389.6666666667px #ff2200, 38px -255.6666666667px #ff009d;
  }
}
@-o-keyframes bang {
  to {
    box-shadow: -183px -241.6666666667px #0055ff,
      173px -282.6666666667px #5500ff, -213px -20.6666666667px #ff00b7,
      -215px 49.3333333333px #5e00ff, -135px -414.6666666667px #b7ff00,
      -108px -243.6666666667px #00f2ff, 244px -151.6666666667px #00ffea,
      168px -108.6666666667px #00b3ff, -68px -28.6666666667px #ff005e,
      -107px -73.6666666667px #91ff00, 114px -58.6666666667px #4dff00,
      65px 82.3333333333px #ff0073, -198px -39.6666666667px #ff0004,
      66px -306.6666666667px #00ff91, 215px -109.6666666667px #00ff66,
      -231px -91.6666666667px #00d0ff, -37px -395.6666666667px #f200ff,
      -191px -207.6666666667px #ff2200, 121px -326.6666666667px #f700ff,
      29px -66.6666666667px #ff0051, 88px -201.6666666667px #007bff,
      122px -371.6666666667px #ff0062, -45px -299.6666666667px #0080ff,
      88px -164.6666666667px #0022ff, 110px -268.6666666667px #ff007b,
      71px -24.6666666667px #004dff, 170px -16.6666666667px #00ff84,
      -148px -362.6666666667px #ff0066, -235px -79.6666666667px #62ff00,
      181px 27.3333333333px #00ffea, 161px -161.6666666667px #ff00fb,
      -86px -121.6666666667px #ea00ff, 10px -205.6666666667px #ffc400,
      14px -149.6666666667px #ff2b00, 242px -122.6666666667px #00eaff,
      -77px -116.6666666667px #6600ff, 51px -368.6666666667px #84ff00,
      -42px 63.3333333333px #eeff00, -84px 74.3333333333px #77ff00,
      -125px -87.6666666667px #0091ff, 200px 72.3333333333px #7b00ff,
      186px -11.6666666667px #c800ff, -178px -134.6666666667px #2bff00,
      -71px -315.6666666667px #00ff9d, -116px -221.6666666667px #fffb00,
      -113px 43.3333333333px #ff4d00, -158px -371.6666666667px #ff4000,
      234px -374.6666666667px #aa00ff, -103px -158.6666666667px #ccff00,
      19px -389.6666666667px #ff2200, 38px -255.6666666667px #ff009d;
  }
}
@-ms-keyframes bang {
  to {
    box-shadow: -183px -241.6666666667px #0055ff,
      173px -282.6666666667px #5500ff, -213px -20.6666666667px #ff00b7,
      -215px 49.3333333333px #5e00ff, -135px -414.6666666667px #b7ff00,
      -108px -243.6666666667px #00f2ff, 244px -151.6666666667px #00ffea,
      168px -108.6666666667px #00b3ff, -68px -28.6666666667px #ff005e,
      -107px -73.6666666667px #91ff00, 114px -58.6666666667px #4dff00,
      65px 82.3333333333px #ff0073, -198px -39.6666666667px #ff0004,
      66px -306.6666666667px #00ff91, 215px -109.6666666667px #00ff66,
      -231px -91.6666666667px #00d0ff, -37px -395.6666666667px #f200ff,
      -191px -207.6666666667px #ff2200, 121px -326.6666666667px #f700ff,
      29px -66.6666666667px #ff0051, 88px -201.6666666667px #007bff,
      122px -371.6666666667px #ff0062, -45px -299.6666666667px #0080ff,
      88px -164.6666666667px #0022ff, 110px -268.6666666667px #ff007b,
      71px -24.6666666667px #004dff, 170px -16.6666666667px #00ff84,
      -148px -362.6666666667px #ff0066, -235px -79.6666666667px #62ff00,
      181px 27.3333333333px #00ffea, 161px -161.6666666667px #ff00fb,
      -86px -121.6666666667px #ea00ff, 10px -205.6666666667px #ffc400,
      14px -149.6666666667px #ff2b00, 242px -122.6666666667px #00eaff,
      -77px -116.6666666667px #6600ff, 51px -368.6666666667px #84ff00,
      -42px 63.3333333333px #eeff00, -84px 74.3333333333px #77ff00,
      -125px -87.6666666667px #0091ff, 200px 72.3333333333px #7b00ff,
      186px -11.6666666667px #c800ff, -178px -134.6666666667px #2bff00,
      -71px -315.6666666667px #00ff9d, -116px -221.6666666667px #fffb00,
      -113px 43.3333333333px #ff4d00, -158px -371.6666666667px #ff4000,
      234px -374.6666666667px #aa00ff, -103px -158.6666666667px #ccff00,
      19px -389.6666666667px #ff2200, 38px -255.6666666667px #ff009d;
  }
}
@keyframes bang {
  to {
    box-shadow: -183px -241.6666666667px #0055ff,
      173px -282.6666666667px #5500ff, -213px -20.6666666667px #ff00b7,
      -215px 49.3333333333px #5e00ff, -135px -414.6666666667px #b7ff00,
      -108px -243.6666666667px #00f2ff, 244px -151.6666666667px #00ffea,
      168px -108.6666666667px #00b3ff, -68px -28.6666666667px #ff005e,
      -107px -73.6666666667px #91ff00, 114px -58.6666666667px #4dff00,
      65px 82.3333333333px #ff0073, -198px -39.6666666667px #ff0004,
      66px -306.6666666667px #00ff91, 215px -109.6666666667px #00ff66,
      -231px -91.6666666667px #00d0ff, -37px -395.6666666667px #f200ff,
      -191px -207.6666666667px #ff2200, 121px -326.6666666667px #f700ff,
      29px -66.6666666667px #ff0051, 88px -201.6666666667px #007bff,
      122px -371.6666666667px #ff0062, -45px -299.6666666667px #0080ff,
      88px -164.6666666667px #0022ff, 110px -268.6666666667px #ff007b,
      71px -24.6666666667px #004dff, 170px -16.6666666667px #00ff84,
      -148px -362.6666666667px #ff0066, -235px -79.6666666667px #62ff00,
      181px 27.3333333333px #00ffea, 161px -161.6666666667px #ff00fb,
      -86px -121.6666666667px #ea00ff, 10px -205.6666666667px #ffc400,
      14px -149.6666666667px #ff2b00, 242px -122.6666666667px #00eaff,
      -77px -116.6666666667px #6600ff, 51px -368.6666666667px #84ff00,
      -42px 63.3333333333px #eeff00, -84px 74.3333333333px #77ff00,
      -125px -87.6666666667px #0091ff, 200px 72.3333333333px #7b00ff,
      186px -11.6666666667px #c800ff, -178px -134.6666666667px #2bff00,
      -71px -315.6666666667px #00ff9d, -116px -221.6666666667px #fffb00,
      -113px 43.3333333333px #ff4d00, -158px -371.6666666667px #ff4000,
      234px -374.6666666667px #aa00ff, -103px -158.6666666667px #ccff00,
      19px -389.6666666667px #ff2200, 38px -255.6666666667px #ff009d;
  }
}
@-webkit-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-moz-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-o-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-ms-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-webkit-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@-moz-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@-o-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@-ms-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@media (min-width: 769px) {
  .logo {
    left: 36%;
    bottom: 12%;
  }
  .change-img img,
  .logo img {
    width: 30em;
  }
  .landing-title {
    font-size: 6em;
  }
  .landing-subtitle {
    top: 35%;
    font-size: 4em;
  }
  .cta-btn {
    font-size: 3.4em;
  }
  .cta-btn img {
    margin-top: 6px;
    width: 3em;
  }
  .landing-cta {
    right: 35%;
  }
  .cta-btn img {
    margin-top: 10px;
    width: 2.8em;
  }
  .landing-cta {
    right: 38%;
  }
  .questions-container {
    height: 70em;
    margin-top: 2%;
    margin-right: 30%;
  }
  .question {
    font-size: 3.5em;
  }
  .answers {
    font-size: 3em;
  }
  input[type="radio"] {
    width: 16px;
    height: 16px;
    box-shadow: 2px 2px 0 white;
  }
  input[type="radio"]:checked::after {
    font-size: 28px;
    top: 56%;
    left: 68%;
  }
  .arrow-quiz-position {
    bottom: 6%;
    width: 14em;
  }
  .congrats-text,
  .thanks-text {
    font-size: 10em;
    line-height: 1.1;
  }
  .score-text {
    font-size: 8em;
  }
}

@media (min-width: 1025px) {
  .logo {
    left: 36%;
    bottom: 12%;
  }
  .change-img img,
  .logo img {
    width: 45em;
  }
  .landing-title {
    left: 25%;
    font-size: 8.2em;
  }
  .landing-subtitle {
    top: 38%;
    left: 12%;
    font-size: 5.2em;
  }
  .cta-btn {
    font-size: 4.5em;
  }
  .cta-btn img {
    margin-top: 10px;
    width: 2.8em;
  }
  .landing-cta {
    right: 30%;
  }
  .questions-container {
    height: 115em;
    /* margin-right: 20%; */
  }
  .question {
    font-size: 5em;
  }
  .answers {
    font-size: 4em;
  }
  input[type="radio"] {
    width: 18px;
    height: 18px;
    box-shadow: 3px 3px 0 white;
  }
  input[type="radio"]:checked::after {
    font-size: 28px;
    top: 56%;
    left: 68%;
  }
  .arrow-quiz-position {
    width: 18em;
  }
  .congrats-text,
  .thanks-text {
    font-size: 15em;
    line-height: 1.1;
  }
  .score-text {
    font-size: 11em;
  }
}

@media (min-width: 1440px) {
  .logo {
    left: 34%;
    bottom: 8%;
  }
  .change-img img,
  .logo img {
    width: 60em;
  }
  .landing-title {
    font-size: 13em;
  }
  .landing-subtitle {
    top: 38%;
    font-size: 9em;
  }
  .cta-btn {
    font-size: 7em;
  }
  .cta-btn img {
    margin-top: 10px;
    width: 3em;
  }
  .landing-cta {
    right: 40%;
  }
  .questions-container {
    height: 140em;
  }
  .question {
    font-size: 6.9em;
    padding-right: 2em;
  }
  .answers {
    font-size: 5.5em;
    margin-left: 1em;
  }
  input[type="radio"] {
    width: 24px;
    height: 24px;
    box-shadow: 3px 3px 0 white;
  }
  input[type="radio"]:checked::after {
    font-size: 28px;
    top: 56%;
    left: 68%;
  }
  .arrow-quiz-position {
    width: 18em;
  }
  .congrats-text,
  .thanks-text {
    font-size: 22em;
    line-height: 1.1;
  }
  .score-text {
    font-size: 12em;
  }
}