html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  cursor: none; }

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

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline; }

[hidden],
template {
  display: none; }

a {
  background-color: transparent; }

a:active,
a:hover {
  outline: 0; }

em {
  font-style: normal; }

b,
strong {
  font-weight: bold; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

mark {
  background: #ffff00;
  color: #000000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 1em 40px; }

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

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

td,
th {
  padding: 0; }

/** trapezoid shape(inverted) */
.trapezoid-shape:before,
.trapezoid-shape:after {
  content: '';
  position: absolute;
  width: 10%;
  height: 99%;
  background: inherit; }

.trapezoid-shape:before {
  transform-origin: 0 100%;
  transform: skewY(-65deg) rotate(0.001deg);
  left: 100%; }

.trapezoid-shape:after {
  transform-origin: 100% 0;
  transform: skewY(65deg) rotate(0.001deg);
  right: 100%; }

.clearfix:before, .clearfix:after {
  content: " ";
  display: table; }

.clearfix:after {
  clear: both; }

.pointer {
  cursor: pointer; }

.noselect {
  user-select: none; }

.hidden {
  display: none; }

.visible {
  display: block !important; }

.middle {
  position: relative;
  top: 50%;
  transform: translateY(-50%); }

@font-face {
  font-family: "Lato";
  src: url("../assets/fonts/lato-300.woff2") format("woff2"), url("../assets/fonts/lato-300.woff") format("woff");
  /* Modern Browsers */
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: "Lato";
  src: url("../assets/fonts/lato-400.woff2") format("woff2"), url("../assets/fonts/lato-400.woff") format("woff");
  /* Modern Browsers */
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: "Lato";
  src: url("../assets/fonts/lato-700.woff2") format("woff2"), url("../assets/fonts/lato-700.woff") format("woff");
  /* Modern Browsers */
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/montserrat-300.woff2") format("woff2"), url("../assets/fonts/montserrat-300.woff") format("woff");
  /* Modern Browsers */
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/montserrat-400.woff2") format("woff2"), url("../assets/fonts/montserrat-400.woff") format("woff");
  /* Modern Browsers */
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/montserrat-700.woff2") format("woff2"), url("../assets/fonts/montserrat-700.woff") format("woff");
  /* Modern Browsers */
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/montserrat-900.woff2") format("woff2"), url("../assets/fonts/montserrat-900.woff") format("woff");
  /* Modern Browsers */
  font-weight: 900;
  font-style: normal; }

@font-face {
  font-family: "Neo Sans";
  src: url("../assets/fonts/neo-sans-900.woff2") format("woff2"), url("../assets/fonts/neo-sans-900.woff") format("woff");
  /* Modern Browsers */
  font-weight: 900;
  font-style: normal; }

* {
  margin: 0;
  padding: 0; }

*,
*:after,
*:before {
  box-sizing: border-box; }

html, body {
  width: 100%;
  height: 100%; }

html {
  font-weight: 400;
  font-size: 10px;
  font-family: "Lato", Arial, Helvetica, sans-serif; }

body {
  display: block !important;
  overflow: hidden;
  background-color: #000000;
  color: #ffffff;
  user-select: none; }

li {
  display: inline;
  list-style-type: none; }

@media (max-width: 1280px) {
  body:after {
    content: 'big';
    display: none; } }

*,
*:before,
*:after {
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none; }

#templates {
  display: none; }

.drawn-color-placeholder {
  float: left;
  margin: 0 0.1116071429vw;
  width: 1.1160714286vw;
  height: 0.5580357143vw;
  background: #000000; }

.drawn-color-fill-placeholder {
  width: 100%;
  height: 100%;
  display: block;
  background: #000000; }

.drawn-color-info.color-1 .on .drawn-color-fill-placeholder {
  background-color: #dd1f1f; }

.drawn-color-info.color-2 .on .drawn-color-fill-placeholder {
  background-color: #0087ff; }

.drawn-color-info.color-3 .on .drawn-color-fill-placeholder {
  background-color: #1cc51c; }

.drawn-color-info.color-4 .on .drawn-color-fill-placeholder {
  background-color: #efc82d; }

.drawn-color-info.color-5 .on .drawn-color-fill-placeholder {
  background-color: #9d31f0; }

.dynamic-scale {
  transform: scale(1) rotate(0.001deg); }

/***** INFO BOX *****/
.info-box-wrap {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.1);
  z-index: 99; }

.info-box {
  position: absolute;
  bottom: 1.6741071429vw;
  left: 50%;
  width: 66.9642857143vw;
  height: 5.0223214286vw;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 2.7901785714vw; }

.info-box-message {
  font-family: "Lato";
  font-size: 1.7857142857vw;
  color: #fff;
  text-align: center;
  line-height: 3;
  text-transform: uppercase; }

.info-box-wrap.on {
  display: block; }
  .info-box-wrap.on .info-box {
    opacity: 1; }
  .info-box-wrap.on .info-box-message {
    opacity: 1; }

/***** AUDIO *****/
#spin-sound {
  display: none; }

/***** PRELOADER *****/
#preloader {
  display: block;
  transition: visibility 0s 1s;
  visibility: visible; }

.n6-container.active #preloader {
  visibility: hidden; }

.preloader-content {
  position: absolute;
  top: 5%;
  left: 5%;
  transform: translate3d(0, 0, 0);
  width: 2.2321428571vw;
  height: 2px;
  overflow: hidden;
  opacity: 0.01; }

.preloader-content > div,
.preloader-content > img {
  float: left;
  width: 1px;
  height: 1px; }

.preloader-ui {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #161616;
  z-index: 9;
  transition: opacity 1s; }

.preloader-progressbar-wrap {
  position: absolute;
  top: 52.5%;
  left: 50%;
  width: 42.8571428571vw;
  height: 2px;
  margin-left: -21.4285714286vw;
  background-color: #000000;
  overflow: hidden; }

.preloader-progressbar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../assets/images/loader-progressbar.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: cover;
  animation: animate-loader 6s ease-in-out infinite; }

.preloader-vendor-logo {
  position: absolute;
  bottom: 5%;
  left: 50%;
  width: 11.3839285714vw;
  height: 3.3482142857vw;
  margin-left: -5.6919642857vw;
  background-image: url(../assets/images/vendor-logo.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity .3s; }

.n6-container.active .preloader-ui,
.n6-container.active .preloader-progressbar,
.n6-container.active .preloader-vendor-logo {
  opacity: 0; }

@keyframes animate-loader {
  0% {
    background-position: 100% 0; }
  50% {
    background-position: 0 0; }
  100% {
    background-position: 100% 0; } }

.mode-plugin body {
  cursor: default; }

.mode-plugin .client-logo {
  display: none; }

@keyframes fade-in {
  0% {
    opacity: .01; }
  100% {
    opacity: 1; } }

@keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: .01; } }

@media screen and (max-width: 1023px) {
  .info-box {
    bottom: 15px;
    width: 55%; }
  .info-box-message {
    font-size: 12px;
    line-height: 6.746031746vh; }
  .preloader-img-load {
    height: 0px; } }

.n6-container {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(circle, #d9d9d9 0%, #252525 90%); }
  .n6-container:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.7)); }
  .n6-container .container-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .n6-container .container-frame {
    position: relative;
    width: 100%;
    height: 100%; }
  .n6-container #n6-screen > section {
    position: absolute;
    top: 0;
    left: 0;
    transition-property: opacity;
    transition-duration: .5s;
    transition-delay: .5s; }
  .n6-container #n6-screen > section.off {
    opacity: 0;
    transition-delay: 0s; }

.n6-header {
  position: relative;
  width: 100%;
  height: 4.6875vw;
  text-transform: uppercase;
  background-color: rgba(0, 0, 0, 0.5); }
  .n6-header:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #d9d9d9;
    z-index: 2; }
  .n6-header .game-icons {
    float: right;
    margin-right: .75%; }
  .n6-header .game-icon-wrapper {
    float: left;
    width: 4.2410714286vw;
    height: 3.125vw;
    padding: 0.78125vw;
    background-color: #27262c;
    border-radius: 0.3348214286vw;
    cursor: pointer; }
  .n6-header #sound-activation span {
    display: block;
    width: 100%;
    height: 100%;
    background-image: url(../assets/images/sound-off.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain; }
  .n6-header #sound-activation.active span {
    background-image: url(../assets/images/sound-on.png); }
  .n6-header .product-info {
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    height: 100%;
    background: transparent;
    font-family: "Montserrat"; }
  .n6-header .product-info-extension {
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    width: 95%;
    height: 100%;
    background: transparent; }
  .n6-header .product-name {
    position: absolute;
    top: 1%;
    width: 100%;
    color: #fff;
    text-align: center;
    font-weight: 900;
    font-size: 2.4553571429vw; }
  .n6-header .product-name:first-child:nth-last-child(1) {
    top: 20%; }
  .n6-header .product-motto {
    position: absolute;
    bottom: 10%;
    width: 100%;
    color: #848080;
    text-align: center;
    font-size: 1.3392857143vw; }
  .n6-header .game-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 7%;
    width: 100%;
    height: 10.4166666667vh;
    transform: translateY(34.7222222222vh);
    transition: all 0.6s; }
    .n6-header .game-logo .game-logo-text {
      margin-right: 0.75vw;
      font-size: 4.9107142857vw;
      background: linear-gradient(180deg, #f9db5b 0%, #ed9c1f 80%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      font-family: "Neo Sans";
      font-weight: 900;
      text-transform: none;
      color: #ed9c1f;
      transition: all 0.5s; }
    .n6-header .game-logo .game-logo-icon {
      width: 6.1383928571vw;
      height: 6.1383928571vw;
      background-image: url(../assets/images/game-logo-icon.png);
      background-repeat: no-repeat;
      background-position: center center;
      background-size: contain; }
  .n6-header .round-info-number {
    float: right;
    margin: .1% 1% auto .7%;
    color: #fff;
    font-size: 3.125vw;
    opacity: .8; }
  .n6-header .round-info-text {
    float: right;
    max-width: 7.8125vw;
    margin-top: .1%;
    font-weight: 400;
    font-size: 1.2276785714vw;
    color: #fff;
    text-align: right;
    opacity: .5; }

.n6-container.active .n6-header .game-logo {
  height: 3.7946428571vw;
  transform: translateY(0); }
  .n6-container.active .n6-header .game-logo .game-logo-text {
    font-size: 3.125vw; }
  .n6-container.active .n6-header .game-logo .game-logo-icon {
    width: 3.7946428571vw;
    height: 3.7946428571vw; }

@media screen and (max-width: 895px) {
  .n6-header {
    height: 42px; }
    .n6-header .client-logo {
      top: 10px;
      width: 200px;
      height: 25px; }
    .n6-header .product-name {
      font-size: 22px; }
    .n6-header .product-motto {
      font-size: 12px; }
    .n6-header .round-info-number {
      font-size: 28px; }
    .n6-header .round-info-text {
      max-width: 70px;
      font-size: 11px; }
    .n6-header .game-icon-wrapper {
      width: 38px;
      height: 28px;
      padding: 7px; }
  .n6-container.active .n6-header .game-logo {
    height: 34px; }
    .n6-container.active .n6-header .game-logo .game-logo-text {
      font-size: 24px; }
    .n6-container.active .n6-header .game-logo .game-logo-icon {
      width: 34px;
      height: 34px; } }

@media screen and (max-width: 767px) {
  .n6-header .game-icon-wrapper {
    width: 34px;
    height: 26px;
    padding: 6px; } }

@media screen and (max-width: 639px) {
  .n6-header {
    height: 32px; }
    .n6-header .client-logo {
      top: 3px;
      width: 150px; }
    .n6-header .round-info-number {
      font-size: 24px; }
    .n6-header .round-info-text {
      font-size: 10px;
      line-height: .9; }
    .n6-header .game-icon-wrapper {
      width: 28px;
      height: 20px;
      padding: 5px; }
  .n6-container.active .n6-header .game-logo {
    height: 26px; }
    .n6-container.active .n6-header .game-logo .game-logo-text {
      font-size: 18px; }
    .n6-container.active .n6-header .game-logo .game-logo-icon {
      width: 26px;
      height: 26px; } }

@media screen and (max-width: 479px) {
  .n6-header {
    height: 25px; }
    .n6-header .client-logo {
      top: 0; }
    .n6-header .round-info-number {
      font-size: 20px; }
    .n6-header .round-info-text {
      max-width: 60px;
      font-size: 8px;
      line-height: 1; }
    .n6-header .game-icon-wrapper {
      width: 20px;
      height: 16px;
      padding: 3px; }
  .n6-container.active .n6-header .game-logo {
    height: 20px; }
    .n6-container.active .n6-header .game-logo .game-logo-text {
      font-size: 16px; }
    .n6-container.active .n6-header .game-logo .game-logo-icon {
      width: 20px;
      height: 20px; } }

/* IE10+ */
@media screen and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .n6-header .round-info-text {
    margin-top: .3%; }
  .n6-header .round-info-number {
    margin-top: .5%; } }

#n6-screen {
  position: absolute;
  top: 4.6875vw;
  bottom: 0px;
  width: 100%; }

#n6-screen-content {
  height: 100%; }

@media screen and (max-width: 895px) {
  #n6-screen {
    top: 42px; } }

@media screen and (max-width: 639px) {
  #n6-screen {
    top: 32px; } }

@media screen and (max-width: 479px) {
  #n6-screen {
    top: 25px; } }

#drawn-balls {
  position: absolute;
  top: 40%;
  width: 100%;
  height: auto;
  transform: translateY(-60%);
  transition: filter .5s, opacity .5s .4s; }

.draw #drawn-balls {
  transition: opacity .5s 1.3s;
  opacity: 1; }

.results #drawn-balls {
  filter: blur(3px);
  opacity: 0; }

.drawn-balls-col {
  display: block;
  text-align: center; }

.drawn-ball-wrap {
  position: relative;
  display: inline-block;
  width: 6.25vw;
  height: 6.25vw;
  margin: 0.6696428571vw;
  background-color: rgba(0, 0, 0, 0.3);
  background-size: 150%;
  background-position: 50%;
  background-repeat: no-repeat;
  border: 1px solid rgba(217, 217, 217, 0.6);
  border-radius: 50%;
  transition: background .5s;
  overflow: hidden; }
  .drawn-ball-wrap:after {
    opacity: 0; }
  .drawn-ball-wrap.active {
    border-width: 0; }
  .drawn-ball-wrap.next-ball {
    border: none; }
    .drawn-ball-wrap.next-ball:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url(../assets/images/next-ball-spinner.png);
      background-repeat: no-repeat;
      background-size: cover;
      animation-name: spin-next-ball;
      animation-duration: 1.5s;
      animation-timing-function: linear;
      animation-direction: reverse;
      animation-iteration-count: infinite;
      transition: opacity .5s;
      opacity: 1; }

@keyframes spin-next-ball {
  100% {
    transform: rotate(360deg); } }

.ball {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: rgba(217, 217, 217, 0.4);
  font-size: 2.0089285714vw;
  text-align: center;
  transition: color .5s; }

.drawn-ball-wrap.active .ball {
  color: #fff !important;
  font-size: 2.2321428571vw; }

#remaining-balls {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 17.6339285714vw;
  background: linear-gradient(rgba(0, 0, 0, 0.5), transparent 60%);
  overflow: hidden; }
  #remaining-balls:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    background-image: url(../assets/images/spin-balls-shadow.png);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
    z-index: 0; }
  #remaining-balls:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    background-image: url(../assets/images/spin-balls-overlay.png);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
    z-index: 2; }

.balls-spin-list {
  position: relative;
  height: 100%;
  transition: opacity 0s;
  transform: translateZ(0);
  white-space: nowrap;
  overflow: hidden; }

#current-drawn-ball-wrap {
  position: absolute;
  top: 2.2321428571vw;
  left: 44%;
  width: 12.2767857143vw;
  height: 12.2767857143vw;
  transform: translateX(0vw) translateZ(0);
  transition: width .8s .5s, left .8s .5s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

.balls-before,
.balls-after {
  position: absolute;
  top: 0;
  height: 100%; }
  .balls-before .remaining-ball:after,
  .balls-after .remaining-ball:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    border-radius: 50%;
    transition: opacity .3s 1.4s;
    transform: translateZ(0);
    opacity: 0;
    z-index: 1; }

.balls-before {
  right: 108%; }

.balls-after {
  left: 108%; }

.remaining-ball {
  position: relative;
  display: inline-block;
  width: 12.2767857143vw;
  height: 12.2767857143vw;
  margin: auto 0.8928571429vw; }
  .remaining-ball[data-value=""] span {
    opacity: 0; }
  .remaining-ball span {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../assets/images/spin-ball.png);
    transition: opacity .5s;
    opacity: 1;
    z-index: 1; }
  .remaining-ball span:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    width: 8.7053571429vw;
    height: 8.7053571429vw;
    margin: -4.3526785714vw auto;
    background-size: cover;
    background-repeat: no-repeat; }
  .remaining-ball span:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    width: 6.4732142857vw;
    height: 6.4732142857vw;
    margin: -3.2366071429vw auto;
    background-image: url(../assets/images/spin-ball-numbers.png);
    background-size: cover;
    background-position: 0 0; }

.drawn-ball-wrap[data-value="1"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="1"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="2"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="2"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="3"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="3"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="4"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="4"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="5"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="5"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="6"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="6"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="7"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="7"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="8"] {
  background-image: url(../assets/images/colour-0.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="8"] span:before {
  background-image: url(../assets/images/spin-colour-0.png); }

.drawn-ball-wrap[data-value="9"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="9"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="10"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="10"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="11"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="11"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="12"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="12"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="13"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="13"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="14"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="14"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="15"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="15"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="16"] {
  background-image: url(../assets/images/colour-1.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="16"] span:before {
  background-image: url(../assets/images/spin-colour-1.png); }

.drawn-ball-wrap[data-value="17"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="17"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="18"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="18"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="19"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="19"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="20"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="20"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="21"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="21"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="22"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="22"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="23"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="23"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="24"] {
  background-image: url(../assets/images/colour-2.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="24"] span:before {
  background-image: url(../assets/images/spin-colour-2.png); }

.drawn-ball-wrap[data-value="25"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="25"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="26"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="26"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="27"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="27"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="28"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="28"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="29"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="29"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="30"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="30"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="31"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="31"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="32"] {
  background-image: url(../assets/images/colour-3.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="32"] span:before {
  background-image: url(../assets/images/spin-colour-3.png); }

.drawn-ball-wrap[data-value="33"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="33"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="34"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="34"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="35"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="35"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="36"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="36"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="37"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="37"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="38"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="38"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="39"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="39"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="40"] {
  background-image: url(../assets/images/colour-4.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="40"] span:before {
  background-image: url(../assets/images/spin-colour-4.png); }

.drawn-ball-wrap[data-value="41"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="41"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.drawn-ball-wrap[data-value="42"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="42"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.drawn-ball-wrap[data-value="43"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="43"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.drawn-ball-wrap[data-value="44"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="44"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.drawn-ball-wrap[data-value="45"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="45"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.drawn-ball-wrap[data-value="46"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="46"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.drawn-ball-wrap[data-value="47"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="47"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.drawn-ball-wrap[data-value="48"] {
  background-image: url(../assets/images/colour-5.png);
  background-size: 100%;
  background-position: 0; }

.remaining-ball[data-value="48"] span:before {
  background-image: url(../assets/images/spin-colour-5.png); }

.remaining-ball[data-value="1"] span:after {
  background-position: 0 0%; }

.remaining-ball[data-value="2"] span:after {
  background-position: 0 2.1276595745%; }

.remaining-ball[data-value="3"] span:after {
  background-position: 0 4.2553191489%; }

.remaining-ball[data-value="4"] span:after {
  background-position: 0 6.3829787234%; }

.remaining-ball[data-value="5"] span:after {
  background-position: 0 8.5106382979%; }

.remaining-ball[data-value="6"] span:after {
  background-position: 0 10.6382978723%; }

.remaining-ball[data-value="7"] span:after {
  background-position: 0 12.7659574468%; }

.remaining-ball[data-value="8"] span:after {
  background-position: 0 14.8936170213%; }

.remaining-ball[data-value="9"] span:after {
  background-position: 0 17.0212765957%; }

.remaining-ball[data-value="10"] span:after {
  background-position: 0 19.1489361702%; }

.remaining-ball[data-value="11"] span:after {
  background-position: 0 21.2765957447%; }

.remaining-ball[data-value="12"] span:after {
  background-position: 0 23.4042553191%; }

.remaining-ball[data-value="13"] span:after {
  background-position: 0 25.5319148936%; }

.remaining-ball[data-value="14"] span:after {
  background-position: 0 27.6595744681%; }

.remaining-ball[data-value="15"] span:after {
  background-position: 0 29.7872340426%; }

.remaining-ball[data-value="16"] span:after {
  background-position: 0 31.914893617%; }

.remaining-ball[data-value="17"] span:after {
  background-position: 0 34.0425531915%; }

.remaining-ball[data-value="18"] span:after {
  background-position: 0 36.170212766%; }

.remaining-ball[data-value="19"] span:after {
  background-position: 0 38.2978723404%; }

.remaining-ball[data-value="20"] span:after {
  background-position: 0 40.4255319149%; }

.remaining-ball[data-value="21"] span:after {
  background-position: 0 42.5531914894%; }

.remaining-ball[data-value="22"] span:after {
  background-position: 0 44.6808510638%; }

.remaining-ball[data-value="23"] span:after {
  background-position: 0 46.8085106383%; }

.remaining-ball[data-value="24"] span:after {
  background-position: 0 48.9361702128%; }

.remaining-ball[data-value="25"] span:after {
  background-position: 0 51.0638297872%; }

.remaining-ball[data-value="26"] span:after {
  background-position: 0 53.1914893617%; }

.remaining-ball[data-value="27"] span:after {
  background-position: 0 55.3191489362%; }

.remaining-ball[data-value="28"] span:after {
  background-position: 0 57.4468085106%; }

.remaining-ball[data-value="29"] span:after {
  background-position: 0 59.5744680851%; }

.remaining-ball[data-value="30"] span:after {
  background-position: 0 61.7021276596%; }

.remaining-ball[data-value="31"] span:after {
  background-position: 0 63.829787234%; }

.remaining-ball[data-value="32"] span:after {
  background-position: 0 65.9574468085%; }

.remaining-ball[data-value="33"] span:after {
  background-position: 0 68.085106383%; }

.remaining-ball[data-value="34"] span:after {
  background-position: 0 70.2127659574%; }

.remaining-ball[data-value="35"] span:after {
  background-position: 0 72.3404255319%; }

.remaining-ball[data-value="36"] span:after {
  background-position: 0 74.4680851064%; }

.remaining-ball[data-value="37"] span:after {
  background-position: 0 76.5957446809%; }

.remaining-ball[data-value="38"] span:after {
  background-position: 0 78.7234042553%; }

.remaining-ball[data-value="39"] span:after {
  background-position: 0 80.8510638298%; }

.remaining-ball[data-value="40"] span:after {
  background-position: 0 82.9787234043%; }

.remaining-ball[data-value="41"] span:after {
  background-position: 0 85.1063829787%; }

.remaining-ball[data-value="42"] span:after {
  background-position: 0 87.2340425532%; }

.remaining-ball[data-value="43"] span:after {
  background-position: 0 89.3617021277%; }

.remaining-ball[data-value="44"] span:after {
  background-position: 0 91.4893617021%; }

.remaining-ball[data-value="45"] span:after {
  background-position: 0 93.6170212766%; }

.remaining-ball[data-value="46"] span:after {
  background-position: 0 95.7446808511%; }

.remaining-ball[data-value="47"] span:after {
  background-position: 0 97.8723404255%; }

.remaining-ball[data-value="48"] span:after {
  background-position: 0 100%; }

#current-drawn-ball {
  margin: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }
  #current-drawn-ball:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(217, 217, 217, 0.1);
    transition: opacity .25s;
    transform: translateZ(0);
    border-radius: 50%;
    z-index: 0;
    transform: scale(1.2) translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    opacity: 0; }
  #current-drawn-ball span {
    transition: transform .3s 1.4s ease-out;
    -webkit-backface-visibility: hidden; }

.balls-spin {
  position: absolute;
  width: 100%;
  height: 12.0535714286vw;
  top: 50%;
  transform: translateY(-50%) translateZ(0);
  background-image: url(../assets/images/spin.png);
  background-position: 0 0;
  background-size: cover;
  transition: opacity 0s;
  opacity: 0; }

.balls-spin-indicator {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 0;
  margin-left: -0.78125vw;
  border-left: 0.78125vw solid transparent;
  border-right: 0.78125vw solid transparent;
  border-bottom: 1.4508928571vw solid #d9d9d9;
  z-index: 3; }

.balls-loader {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: rgba(217, 217, 217, 0.4); }
  .balls-loader .balls-loader-progress {
    position: relative;
    width: 100%;
    height: 100%;
    background: #d9d9d9;
    animation-direction: alternate;
    animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 2; }
  .balls-loader.on .balls-loader-progress {
    animation-name: animate-progressbar; }
  .balls-loader.off .balls-loader-progress {
    animation-name: animate-progressbar-back;
    animation-duration: .4s;
    animation-timing-function: ease-in; }

/*** SPINNER ANIMATIONS ***/
.spin #current-drawn-ball-wrap,
.spin.spin-start #current-drawn-ball-wrap {
  transform: translateX(50.2232142857vw) translateZ(0); }

.spin-start .balls-spin-list {
  transition: opacity 0s 1s;
  opacity: 0; }

.spin-start #current-drawn-ball-wrap {
  animation: spin-start 1s ease-in forwards; }

.spin-start #current-drawn-ball:after {
  transition: opacity 0s 1.2s;
  opacity: 0; }

.spin-start #current-drawn-ball span {
  transition: transform 0s 1.2s;
  transform: scale(1) translateZ(0); }

.spin-start .balls-spin {
  animation: spin-loop 1.2s steps(29, end) infinite;
  transition: opacity 0s .9s;
  opacity: 1; }

.spin-stop .balls-spin-list {
  transition: opacity 0s;
  opacity: 1; }

.spin-stop #current-drawn-ball-wrap {
  animation: spin-stop 1.3s cubic-bezier(0.22, 0.61, 0.36, 1) forwards; }

.spin-stop #current-drawn-ball:after {
  transition: opacity 0.25s 1.3s;
  opacity: 1; }

.spin-stop #current-drawn-ball span {
  transform: scale(1.11) translateZ(0); }

.spin-stop .balls-spin {
  animation: none;
  opacity: 0; }

.spin-stop .balls-before .remaining-ball:after,
.spin-stop .balls-after .remaining-ball:after {
  opacity: .4; }

.win-ball-remove #current-drawn-ball-wrap {
  width: 0vw;
  left: 50%; }

.win-ball-remove #current-drawn-ball:after {
  transition: opacity .25s .5s;
  opacity: 0; }

.win-ball-remove #current-drawn-ball span {
  transition: transform .5s;
  transform: scale(0) translateZ(0); }

.win-ball-remove .balls-before .remaining-ball:after,
.win-ball-remove .balls-after .remaining-ball:after {
  transition: opacity .2s .5s;
  transform: translateZ(0);
  opacity: 0; }

@keyframes animate-progressbar {
  0% {
    transform: translateX(0) translateZ(0); }
  100% {
    transform: translateX(-100%) translateZ(0); } }

@keyframes animate-progressbar-back {
  0% {
    transform: translateX(-100%) translateZ(0); }
  100% {
    transform: translateX(0) translateZ(0); } }

@keyframes spin-loop {
  0% {
    background-position: 0 0; }
  100% {
    background-position: 0 100%; } }

@keyframes spin-start {
  0% {
    transform: translateX(0vw) translateZ(0); }
  100% {
    transform: translateX(-50.2232142857vw) translateZ(0); } }

@keyframes spin-stop {
  0% {
    transform: translateX(50.2232142857vw) translateZ(0); }
  100% {
    transform: translateX(0vw) translateZ(0); } }

@media screen and (max-width: 767px) {
  #drawn-balls {
    padding-top: 0.390625vw; }
  #remaining-balls {
    height: 16.9270833333vw; }
  .balls-loader {
    height: 1px; } }

@media screen and (max-width: 639px) {
  #drawn-balls {
    padding-top: 1.5625vw; }
  .drawn-ball-wrap {
    margin: 0.625vw 0.9375vw; }
  #remaining-balls {
    height: 15.625vw; }
  #current-drawn-ball-wrap {
    top: 1.25vw;
    width: 11.5625vw;
    height: 11.5625vw; } }

@media screen and (max-width: 383px) {
  #drawn-balls {
    padding-top: 0.78125vw; }
  .drawn-ball-wrap {
    margin: 0.5208333333vw 1.0416666667vw; } }

*,
*:before,
*:after {
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none; }

#templates {
  display: none; }

.drawn-color-placeholder {
  float: left;
  margin: 0 0.1116071429vw;
  width: 1.1160714286vw;
  height: 0.5580357143vw;
  background: #000000; }

.drawn-color-fill-placeholder {
  width: 100%;
  height: 100%;
  display: block;
  background: #000000; }

.drawn-color-info.color-1 .on .drawn-color-fill-placeholder {
  background-color: #dd1f1f; }

.drawn-color-info.color-2 .on .drawn-color-fill-placeholder {
  background-color: #0087ff; }

.drawn-color-info.color-3 .on .drawn-color-fill-placeholder {
  background-color: #1cc51c; }

.drawn-color-info.color-4 .on .drawn-color-fill-placeholder {
  background-color: #efc82d; }

.drawn-color-info.color-5 .on .drawn-color-fill-placeholder {
  background-color: #9d31f0; }

.dynamic-scale {
  transform: scale(1) rotate(0.001deg); }

/***** INFO BOX *****/
.info-box-wrap {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.1);
  z-index: 99; }

.info-box {
  position: absolute;
  bottom: 1.6741071429vw;
  left: 50%;
  width: 66.9642857143vw;
  height: 5.0223214286vw;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 2.7901785714vw; }

.info-box-message {
  font-family: "Lato";
  font-size: 1.7857142857vw;
  color: #fff;
  text-align: center;
  line-height: 3;
  text-transform: uppercase; }

.info-box-wrap.on {
  display: block; }
  .info-box-wrap.on .info-box {
    opacity: 1; }
  .info-box-wrap.on .info-box-message {
    opacity: 1; }

/***** AUDIO *****/
#spin-sound {
  display: none; }

/***** PRELOADER *****/
#preloader {
  display: block;
  transition: visibility 0s 1s;
  visibility: visible; }

.n6-container.active #preloader {
  visibility: hidden; }

.preloader-content {
  position: absolute;
  top: 5%;
  left: 5%;
  transform: translate3d(0, 0, 0);
  width: 2.2321428571vw;
  height: 2px;
  overflow: hidden;
  opacity: 0.01; }

.preloader-content > div,
.preloader-content > img {
  float: left;
  width: 1px;
  height: 1px; }

.preloader-ui {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #161616;
  z-index: 9;
  transition: opacity 1s; }

.preloader-progressbar-wrap {
  position: absolute;
  top: 52.5%;
  left: 50%;
  width: 42.8571428571vw;
  height: 2px;
  margin-left: -21.4285714286vw;
  background-color: #000000;
  overflow: hidden; }

.preloader-progressbar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../assets/images/loader-progressbar.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: cover;
  animation: animate-loader 6s ease-in-out infinite; }

.preloader-vendor-logo {
  position: absolute;
  bottom: 5%;
  left: 50%;
  width: 11.3839285714vw;
  height: 3.3482142857vw;
  margin-left: -5.6919642857vw;
  background-image: url(../assets/images/vendor-logo.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity .3s; }

.n6-container.active .preloader-ui,
.n6-container.active .preloader-progressbar,
.n6-container.active .preloader-vendor-logo {
  opacity: 0; }

@keyframes animate-loader {
  0% {
    background-position: 100% 0; }
  50% {
    background-position: 0 0; }
  100% {
    background-position: 100% 0; } }

.mode-plugin body {
  cursor: default; }

.mode-plugin .client-logo {
  display: none; }

@keyframes fade-in {
  0% {
    opacity: .01; }
  100% {
    opacity: 1; } }

@keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: .01; } }

@media screen and (max-width: 1023px) {
  .info-box {
    bottom: 15px;
    width: 55%; }
  .info-box-message {
    font-size: 12px;
    line-height: 6.746031746vh; }
  .preloader-img-load {
    height: 0px; } }

#result-balls {
  position: absolute;
  bottom: 35%;
  padding: 1.6741071429vw;
  width: 0%;
  height: 3.5%;
  color: #e6e6e6;
  transition: width .7s, height .3s;
  font-weight: 300;
  overflow: hidden; }

#remaining-balls-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 17.6339285714vw;
  font-size: 2.6785714286vw;
  text-align: center;
  font-weight: 300;
  transition: opacity 0s;
  opacity: 0;
  z-index: 3;
  overflow: hidden; }
  #remaining-balls-overlay .remaining-balls-content-box {
    position: absolute;
    left: 50%;
    width: 110vw;
    height: 110vw;
    background: #252525;
    border-radius: 50%;
    transform: translate(-50%, -30%) scale(0);
    transition: transform .9s; }
    #remaining-balls-overlay .remaining-balls-content-box:after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.7);
      border-radius: 50%;
      z-index: 0; }
  #remaining-balls-overlay span {
    position: relative;
    z-index: 1;
    line-height: 17.6339285714vw; }
  #remaining-balls-overlay .remaining-time-wrap {
    transition: opacity .3s;
    opacity: 0; }
  #remaining-balls-overlay .remaining-time {
    display: inline-block;
    position: relative;
    top: 0.6696428571vw;
    width: 8.59375vw;
    height: 8.59375vw;
    margin: 0 1.6741071429vw;
    line-height: 2;
    font-size: 4.4642857143vw;
    color: #d9d9d9;
    border: 2px solid rgba(217, 217, 217, 0.5);
    border-radius: 50%; }

/* ----------- iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
  #remaining-balls-overlay .remaining-time {
    line-height: 1.5; } }

/* ----------- iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) {
  #remaining-balls-overlay .remaining-time {
    line-height: 1.5; } }

/* ----------- IE10+ ----------- */
@media screen and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  #remaining-balls-overlay .remaining-time {
    line-height: 2.1; } }

.draw #result-balls {
  transition-delay: .6s, .3s;
  width: 0%;
  height: 3.5%; }

.draw .result-balls-title,
.draw .result-balls-list {
  transition-delay: 0s;
  opacity: 0; }

.draw #remaining-balls-overlay {
  transition-delay: 1s;
  opacity: 0; }
  .draw #remaining-balls-overlay .remaining-balls-content-box {
    transition-delay: .5s;
    transform: translate(-50%, -30%) scale(0); }
  .draw #remaining-balls-overlay .remaining-time-wrap {
    opacity: 0; }

.results #result-balls {
  transition-delay: .5s, 1.2s;
  width: 100%;
  height: 65%; }

.results .result-balls-title,
.results .result-balls-list {
  transition-delay: 1.5s;
  opacity: 1; }

.results #remaining-balls-overlay {
  opacity: 1; }
  .results #remaining-balls-overlay .remaining-balls-content-box {
    transform: translate(-50%, -30%) scale(1); }
  .results #remaining-balls-overlay .remaining-time-wrap {
    transition-delay: .7s;
    opacity: 1; }

.result-balls-content {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  border-bottom: 2px solid #d9d9d9; }

.result-balls-title {
  position: relative;
  font-size: 2.6785714286vw;
  text-align: center;
  line-height: 2;
  padding-top: 1.1160714286vw;
  transition: opacity .5s;
  opacity: 0; }
  .result-balls-title:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 8.4821428571vw;
    height: 1px;
    background: red;
    text-align: center;
    margin-left: -4.2410714286vw;
    background: #d9d9d9; }

#result-round {
  font-weight: 700; }

.result-balls-list {
  position: relative;
  top: 2%;
  padding: 2.2321428571vw;
  text-align: center;
  transition: opacity .5s;
  opacity: 0; }

.result-ball {
  display: inline-block;
  width: 4.6875vw;
  height: 4.6875vw;
  margin: 0 0.3348214286vw 2.2321428571vw;
  background-color: rgba(0, 0, 0, 0.4);
  background-size: 0;
  color: #68696e;
  border-radius: 50%;
  font-size: 2.0089285714vw;
  text-align: center;
  line-height: 2.6; }
  .result-ball.active {
    color: #fff; }

#result-ball-1.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-2.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-3.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-4.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-5.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-6.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-7.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-8.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-0.png);
  background-size: cover; }

#result-ball-9.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-10.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-11.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-12.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-13.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-14.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-15.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-16.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-1.png);
  background-size: cover; }

#result-ball-17.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-18.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-19.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-20.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-21.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-22.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-23.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-24.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-2.png);
  background-size: cover; }

#result-ball-25.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-26.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-27.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-28.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-29.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-30.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-31.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-32.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-3.png);
  background-size: cover; }

#result-ball-33.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-34.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-35.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-36.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-37.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-38.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-39.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-40.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-4.png);
  background-size: cover; }

#result-ball-41.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

#result-ball-42.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

#result-ball-43.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

#result-ball-44.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

#result-ball-45.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

#result-ball-46.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

#result-ball-47.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

#result-ball-48.active {
  background-color: transparent;
  background-image: url(../assets/images/colour-5.png);
  background-size: cover; }

@media screen and (max-width: 767px) {
  .result-balls-content {
    border-bottom-width: 1px; }
  .result-balls-title {
    padding-top: 0.6510416667vw; } }

@media screen and (max-width: 639px) {
  .result-balls-list {
    padding: 2.1875vw 0; } }

@media screen and (max-width: 383px) {
  #result-balls {
    padding: 1.5625vw 0.5208333333vw; } }

/* Retina Display (large) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .result-ball {
    line-height: 2.4; } }

.n6-footer {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0vw;
  font-weight: 400;
  font-size: 1.3392857143vw;
  color: #bbbbbb;
  z-index: 1;
  background-color: #131313;
  /* Vendor logo */ }
  .n6-footer > .vendor-logo {
    position: relative;
    float: right;
    width: 4.0178571429vw;
    height: 100%;
    background: #242424 url("../assets/images/vendor-logo.png") no-repeat center center;
    background-size: contain; }

.quality-web .n6-footer {
  display: none; }

#debug-wrap {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;
  cursor: default;
  text-transform: uppercase; }
  #debug-wrap.on {
    display: block; }
  #debug-wrap.off {
    opacity: 0;
    z-index: -1; }
  #debug-wrap.disabled {
    display: none !important; }

#debug {
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 0.1116071429vw;
  font-size: 1.1160714286vw;
  background: rgba(0, 0, 0, 0.8);
  transform: translate(-50%, -50%) rotate(0.001deg);
  outline: none !important;
  opacity: 1;
  cursor: default; }
  #debug select, #debug div {
    outline: none !important; }
  #debug.top {
    top: 0;
    transform: translate(-50%, 0) rotate(0.001deg); }
  #debug.bottom {
    top: auto;
    bottom: 0;
    transform: translate(-50%, 0) rotate(0.001deg); }
  #debug.left {
    left: 0;
    transform: translate(0, -50%) rotate(0.001deg); }
  #debug.right {
    left: auto;
    right: 0;
    transform: translate(0, -50%) rotate(0.001deg); }
  #debug .debug-option-wrap {
    position: relative;
    margin: 0.8928571429vw; }
    #debug .debug-option-wrap select,
    #debug .debug-option-wrap .debug-option-name,
    #debug .debug-option-wrap .debug-possibility,
    #debug .debug-option-wrap .debug-select {
      display: inline-block;
      padding: 0.3348214286vw;
      border: 1px solid #fff;
      cursor: pointer; }
    #debug .debug-option-wrap > ul {
      display: inline-block; }
    #debug .debug-option-wrap .debug-select ul {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      padding: 0.4464285714vw;
      background-color: rgba(0, 0, 0, 0.8);
      z-index: 1; }
    #debug .debug-option-wrap .debug-select li {
      position: relative;
      display: inline-block;
      margin: 0.2232142857vw;
      list-style-type: none; }
    #debug .debug-option-wrap select {
      color: #fff;
      min-width: 5vw;
      background: transparent; }
    #debug .debug-option-wrap select .label {
      display: none; }
    #debug .debug-option-wrap option {
      color: #232323; }
    #debug .debug-option-wrap .debug-option-name {
      min-width: 12.0535714286vw;
      text-align: center;
      background-color: #535353; }
    #debug .debug-option-wrap .debug-possibility,
    #debug .debug-option-wrap .debug-select {
      margin-left: 0.8928571429vw; }
    #debug .debug-option-wrap .debug-possibility.active {
      background: #9f8d8d; }
    #debug .debug-option-wrap select:hover,
    #debug .debug-option-wrap .debug-possibility:hover,
    #debug .debug-option-wrap .debug-select:hover {
      background-color: rgba(90, 90, 90, 0.5); }
    #debug .debug-option-wrap .debug-select:hover ul {
      display: block; }
    #debug .debug-option-wrap.sub-option {
      display: none;
      position: relative;
      width: 95%;
      margin-left: 5%;
      border-color: green; }
      #debug .debug-option-wrap.sub-option .debug-option-name {
        min-width: 6.6964285714vw; }
      #debug .debug-option-wrap.sub-option.on {
        display: block; }
  #debug .debug-move-btn,
  #debug .debug-close {
    position: absolute;
    width: 3.3482142857vw;
    height: 3.3482142857vw;
    color: #000;
    text-align: center;
    line-height: 2.2;
    background-color: rgba(255, 255, 255, 0.25);
    opacity: 0.05;
    cursor: pointer;
    z-index: -1; }
    #debug .debug-move-btn:hover,
    #debug .debug-close:hover {
      opacity: 1; }
    #debug .debug-move-btn:active,
    #debug .debug-close:active {
      opacity: 1;
      background-color: rgba(255, 255, 255, 0.5); }
  #debug .debug-close {
    bottom: 100%;
    left: 100%;
    line-height: 3.3482142857vw; }
  #debug .debug-move-btn.left, #debug .debug-move-btn.right {
    height: 11.1607142857vw;
    top: 50%;
    right: 100%;
    transform: translateY(-50%) rotate(0.001deg);
    line-height: 7; }
  #debug .debug-move-btn.left {
    right: 100%; }
  #debug .debug-move-btn.right {
    left: 100%; }
  #debug .debug-move-btn.top, #debug .debug-move-btn.bottom {
    width: 11.1607142857vw;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%) rotate(0.001deg); }
  #debug .debug-move-btn.top {
    bottom: 100%; }
  #debug .debug-move-btn.bottom {
    top: 100%; }
  #debug .scrn-res {
    position: absolute;
    top: -3.3482142857vw;
    right: 0;
    height: 3.3482142857vw;
    line-height: 1;
    padding: 1.1160714286vw;
    background-color: rgba(0, 0, 0, 0.8);
    font-size: 1.5625vw;
    color: #555; }

/*@media (max-width: $break-medium) {

    #debug,
    #debug .scrn-res {
        font-size: get-vw(16px);
    }
}

@media (max-width: $break-small) {

    #debug,
    #debug .scrn-res {
        font-size: get-vw(18px);
    }
}

@media (max-width: $break-xs) {

    #debug,
    #debug .scrn-res {
        font-size: get-vw(20px);
    }
}*/
