/* -------------------
    # LOADER
   ------------------- */
.layer-1 > .path {
  stroke: rgba(234, 234, 234, 0.5);
  stroke-width: 15;
  stroke-dasharray: 1507.2;
  stroke-dashoffset: 1507.2;
  visibility: hidden;
  -moz-transform: rotate(-30deg);
  -ms-transform: rotate(-30deg);
  -webkit-transform: rotate(-30deg);
  transform: rotate(-30deg);
}
.loaded .layer-1 > .path {
  visibility: visible;
  -moz-animation: layer-1 1.25s ease-in;
  -webkit-animation: layer-1 1.25s ease-in;
  animation: layer-1 1.25s ease-in;
}

@-moz-keyframes layer-1 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 15;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 45;
    stroke-width: 225;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(450deg);
    transform: rotate(450deg);
  }
}
@-webkit-keyframes layer-1 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 15;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 45;
    stroke-width: 225;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(450deg);
    transform: rotate(450deg);
  }
}
@keyframes layer-1 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 15;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 45;
    stroke-width: 225;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(450deg);
    -ms-transform: rotate(450deg);
    -webkit-transform: rotate(450deg);
    transform: rotate(450deg);
  }
}
.layer-2 > .path {
  stroke: rgba(234, 234, 234, 0.3);
  stroke-width: 20;
  stroke-dasharray: 1507.2;
  stroke-dashoffset: 1507.2;
  visibility: hidden;
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -webkit-transform: rotate(-60deg);
  transform: rotate(-60deg);
}
.loaded .layer-2 > .path {
  visibility: visible;
  -moz-animation: layer-2 1.25s ease-in;
  -webkit-animation: layer-2 1.25s ease-in;
  animation: layer-2 1.25s ease-in;
}

@-moz-keyframes layer-2 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 20;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 60;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(420deg);
    transform: rotate(420deg);
  }
}
@-webkit-keyframes layer-2 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 20;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 60;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(420deg);
    transform: rotate(420deg);
  }
}
@keyframes layer-2 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 20;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 60;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(420deg);
    -ms-transform: rotate(420deg);
    -webkit-transform: rotate(420deg);
    transform: rotate(420deg);
  }
}
.layer-3 > .path {
  stroke: rgba(234, 234, 234, 0.8);
  stroke-width: 40;
  stroke-dasharray: 1130.4;
  stroke-dashoffset: 1130.4;
  visibility: hidden;
  -moz-transform: rotate(-70deg);
  -ms-transform: rotate(-70deg);
  -webkit-transform: rotate(-70deg);
  transform: rotate(-70deg);
}
.loaded .layer-3 > .path {
  visibility: visible;
  -moz-animation: layer-3 1.25s ease-in;
  -webkit-animation: layer-3 1.25s ease-in;
  animation: layer-3 1.25s ease-in;
}

@-moz-keyframes layer-3 {
  0% {
    stroke-dasharray: 1130.4;
    stroke-dashoffset: 1130.4;
  }
  75% {
    stroke-width: 40;
    stroke-dashoffset: 565.2;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 120;
    stroke-dasharray: 1136.68;
    stroke-dashoffset: 0;
    -moz-transform: rotate(410deg);
    transform: rotate(410deg);
  }
}
@-webkit-keyframes layer-3 {
  0% {
    stroke-dasharray: 1130.4;
    stroke-dashoffset: 1130.4;
  }
  75% {
    stroke-width: 40;
    stroke-dashoffset: 565.2;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 120;
    stroke-dasharray: 1136.68;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(410deg);
    transform: rotate(410deg);
  }
}
@keyframes layer-3 {
  0% {
    stroke-dasharray: 1130.4;
    stroke-dashoffset: 1130.4;
  }
  75% {
    stroke-width: 40;
    stroke-dashoffset: 565.2;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 120;
    stroke-dasharray: 1136.68;
    stroke-dashoffset: 0;
    -moz-transform: rotate(410deg);
    -ms-transform: rotate(410deg);
    -webkit-transform: rotate(410deg);
    transform: rotate(410deg);
  }
}
.layer-4 > .path {
  stroke: rgba(234, 234, 234, 0.6);
  stroke-width: 20;
  stroke-dasharray: 1507.2;
  stroke-dashoffset: 1507.2;
  visibility: hidden;
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.loaded .layer-4 > .path {
  visibility: visible;
  -moz-animation: layer-4 1.25s ease-in;
  -webkit-animation: layer-4 1.25s ease-in;
  animation: layer-4 1.25s ease-in;
}

@-moz-keyframes layer-4 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 20;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 60;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(390deg);
    transform: rotate(390deg);
  }
}
@-webkit-keyframes layer-4 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 20;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 60;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(390deg);
    transform: rotate(390deg);
  }
}
@keyframes layer-4 {
  0% {
    stroke-dasharray: 1507.2;
    stroke-dashoffset: 1507.2;
  }
  75% {
    stroke-width: 20;
    stroke-dashoffset: 753.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 60;
    stroke-dasharray: 1513.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(390deg);
    -ms-transform: rotate(390deg);
    -webkit-transform: rotate(390deg);
    transform: rotate(390deg);
  }
}
.layer-5 > .path {
  stroke: rgba(234, 234, 234, 0.5);
  stroke-width: 30;
  stroke-dasharray: 1884;
  stroke-dashoffset: 1884;
  visibility: hidden;
  -moz-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  -webkit-transform: rotate(-20deg);
  transform: rotate(-20deg);
}
.loaded .layer-5 > .path {
  visibility: visible;
  -moz-animation: layer-5 1.25s ease-in;
  -webkit-animation: layer-5 1.25s ease-in;
  animation: layer-5 1.25s ease-in;
}

@-moz-keyframes layer-5 {
  0% {
    stroke-dasharray: 1884;
    stroke-dashoffset: 1884;
  }
  75% {
    stroke-width: 30;
    stroke-dashoffset: 942;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 90;
    stroke-dasharray: 1890.28;
    stroke-dashoffset: 0;
    -moz-transform: rotate(460deg);
    transform: rotate(460deg);
  }
}
@-webkit-keyframes layer-5 {
  0% {
    stroke-dasharray: 1884;
    stroke-dashoffset: 1884;
  }
  75% {
    stroke-width: 30;
    stroke-dashoffset: 942;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 90;
    stroke-dasharray: 1890.28;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(460deg);
    transform: rotate(460deg);
  }
}
@keyframes layer-5 {
  0% {
    stroke-dasharray: 1884;
    stroke-dashoffset: 1884;
  }
  75% {
    stroke-width: 30;
    stroke-dashoffset: 942;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 90;
    stroke-dasharray: 1890.28;
    stroke-dashoffset: 0;
    -moz-transform: rotate(460deg);
    -ms-transform: rotate(460deg);
    -webkit-transform: rotate(460deg);
    transform: rotate(460deg);
  }
}
.layer-6 > .path {
  stroke: rgba(234, 234, 234, 0.2);
  stroke-width: 45;
  stroke-dasharray: 2386.4;
  stroke-dashoffset: 2386.4;
  visibility: hidden;
  -moz-transform: rotate(-80deg);
  -ms-transform: rotate(-80deg);
  -webkit-transform: rotate(-80deg);
  transform: rotate(-80deg);
}
.loaded .layer-6 > .path {
  visibility: visible;
  -moz-animation: layer-6 1.25s ease-in;
  -webkit-animation: layer-6 1.25s ease-in;
  animation: layer-6 1.25s ease-in;
}

@-moz-keyframes layer-6 {
  0% {
    stroke-dasharray: 2386.4;
    stroke-dashoffset: 2386.4;
  }
  75% {
    stroke-width: 45;
    stroke-dashoffset: 1193.2;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 135;
    stroke-dasharray: 2392.68;
    stroke-dashoffset: 0;
    -moz-transform: rotate(400deg);
    transform: rotate(400deg);
  }
}
@-webkit-keyframes layer-6 {
  0% {
    stroke-dasharray: 2386.4;
    stroke-dashoffset: 2386.4;
  }
  75% {
    stroke-width: 45;
    stroke-dashoffset: 1193.2;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 135;
    stroke-dasharray: 2392.68;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(400deg);
    transform: rotate(400deg);
  }
}
@keyframes layer-6 {
  0% {
    stroke-dasharray: 2386.4;
    stroke-dashoffset: 2386.4;
  }
  75% {
    stroke-width: 45;
    stroke-dashoffset: 1193.2;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 135;
    stroke-dasharray: 2392.68;
    stroke-dashoffset: 0;
    -moz-transform: rotate(400deg);
    -ms-transform: rotate(400deg);
    -webkit-transform: rotate(400deg);
    transform: rotate(400deg);
  }
}
.layer-7 > .path {
  stroke: #eaeaea;
  stroke-width: 75;
  stroke-dasharray: 2826;
  stroke-dashoffset: 2826;
  visibility: hidden;
  -moz-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  -webkit-transform: rotate(-10deg);
  transform: rotate(-10deg);
}
.loaded .layer-7 > .path {
  visibility: visible;
  -moz-animation: layer-7 1.25s ease-in;
  -webkit-animation: layer-7 1.25s ease-in;
  animation: layer-7 1.25s ease-in;
}

@-moz-keyframes layer-7 {
  0% {
    stroke-dasharray: 2826;
    stroke-dashoffset: 2826;
  }
  75% {
    stroke-width: 75;
    stroke-dashoffset: 1413;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 225;
    stroke-dasharray: 2832.28;
    stroke-dashoffset: 0;
    -moz-transform: rotate(470deg);
    transform: rotate(470deg);
  }
}
@-webkit-keyframes layer-7 {
  0% {
    stroke-dasharray: 2826;
    stroke-dashoffset: 2826;
  }
  75% {
    stroke-width: 75;
    stroke-dashoffset: 1413;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 225;
    stroke-dasharray: 2832.28;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(470deg);
    transform: rotate(470deg);
  }
}
@keyframes layer-7 {
  0% {
    stroke-dasharray: 2826;
    stroke-dashoffset: 2826;
  }
  75% {
    stroke-width: 75;
    stroke-dashoffset: 1413;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 225;
    stroke-dasharray: 2832.28;
    stroke-dashoffset: 0;
    -moz-transform: rotate(470deg);
    -ms-transform: rotate(470deg);
    -webkit-transform: rotate(470deg);
    transform: rotate(470deg);
  }
}
.layer-8 > .path {
  stroke: rgba(234, 234, 234, 0.5);
  stroke-width: 250;
  stroke-dasharray: 3391.2;
  stroke-dashoffset: 3391.2;
  visibility: hidden;
  -moz-transform: rotate(-70deg);
  -ms-transform: rotate(-70deg);
  -webkit-transform: rotate(-70deg);
  transform: rotate(-70deg);
}
.loaded .layer-8 > .path {
  visibility: visible;
  -moz-animation: layer-8 1.25s ease-in;
  -webkit-animation: layer-8 1.25s ease-in;
  animation: layer-8 1.25s ease-in;
}

@-moz-keyframes layer-8 {
  0% {
    stroke-dasharray: 3391.2;
    stroke-dashoffset: 3391.2;
  }
  75% {
    stroke-width: 250;
    stroke-dashoffset: 1695.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 750;
    stroke-dasharray: 3397.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(410deg);
    transform: rotate(410deg);
  }
}
@-webkit-keyframes layer-8 {
  0% {
    stroke-dasharray: 3391.2;
    stroke-dashoffset: 3391.2;
  }
  75% {
    stroke-width: 250;
    stroke-dashoffset: 1695.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 750;
    stroke-dasharray: 3397.48;
    stroke-dashoffset: 0;
    -webkit-transform: rotate(410deg);
    transform: rotate(410deg);
  }
}
@keyframes layer-8 {
  0% {
    stroke-dasharray: 3391.2;
    stroke-dashoffset: 3391.2;
  }
  75% {
    stroke-width: 250;
    stroke-dashoffset: 1695.6;
  }
  100% {
    stroke: #eaeaea;
    stroke-width: 750;
    stroke-dasharray: 3397.48;
    stroke-dashoffset: 0;
    -moz-transform: rotate(410deg);
    -ms-transform: rotate(410deg);
    -webkit-transform: rotate(410deg);
    transform: rotate(410deg);
  }
}
.loader {
  position: absolute;
  width: 120px;
  height: 120px;
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
  z-index: 9999;
}
.loaded .loader {
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -webkit-transform: scale(0);
  transform: scale(0);
  -moz-transition: all 2.25s ease-in-out 1.25s;
  -o-transition: all 2.25s ease-in-out 1.25s;
  -webkit-transition: all 2.25s ease-in-out;
  -webkit-transition-delay: 1.25s;
  transition: all 2.25s ease-in-out 1.25s;
}
.loader g, .loader circle {
  transform-origin: 50% 50%;
}

.core > .path {
  fill: rgb(9, 240, 9);
  visibility: hidden;
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
  -moz-transition: all 0.625s ease-in-out 0.15625s;
  -o-transition: all 0.625s ease-in-out 0.15625s;
  -webkit-transition: all 0.625s ease-in-out;
  -webkit-transition-delay: 0.15625s;
  transition: all 0.625s ease-in-out 0.15625s;
}
.loaded .core > .path {
  -moz-animation: core-loaded 2.5s ease-in-out;
  -webkit-animation: core-loaded 2.5s ease-in-out;
  animation: core-loaded 2.5s ease-in-out;
}

@-moz-keyframes core-loaded {
  0% {
    visibility: hidden;
    -moz-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  25%, 85% {
    opacity: 1;
    visibility: visible;
    -moz-transform: scale(1000, 1000);
    transform: scale(1000, 1000);
  }
  100% {
    opacity: 0;
    -moz-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}
@-webkit-keyframes core-loaded {
  0% {
    visibility: hidden;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  25%, 85% {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1000, 1000);
    transform: scale(1000, 1000);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}
@keyframes core-loaded {
  0% {
    visibility: hidden;
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  25%, 85% {
    opacity: 1;
    visibility: visible;
    -moz-transform: scale(1000, 1000);
    -ms-transform: scale(1000, 1000);
    -webkit-transform: scale(1000, 1000);
    transform: scale(1000, 1000);
  }
  100% {
    opacity: 0;
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}
.spinner {
  opacity: 1;
  -moz-transition: opacity 0.1s 0.1s;
  -o-transition: opacity 0.1s 0.1s;
  -webkit-transition: opacity 0.1s;
  -webkit-transition-delay: 0.1s;
  transition: opacity 0.1s 0.1s;
  -moz-animation: rotate 1.25s linear infinite;
  -webkit-animation: rotate 1.25s linear infinite;
  animation: rotate 1.25s linear infinite;
}
.loaded .spinner {
  opacity: 0;
}
.spinner > .path {
  stroke: rgb(9, 240, 9);
  stroke-width: 6;
  stroke-dasharray: 157;
  stroke-dashoffset: 157;
  -moz-animation: spinner 1.25s both infinite ease-in-out;
  -webkit-animation: spinner 1.25s both infinite ease-in-out;
  animation: spinner 1.25s both infinite ease-in-out;
}

@-moz-keyframes rotate {
  0% {
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(270deg);
    transform: rotate(270deg);
  }
}
@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
  }
}
@keyframes rotate {
  0% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
  }
}
@-moz-keyframes spinner {
  0% {
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
  }
  65% {
    stroke-dasharray: 157;
    stroke-dashoffset: 39.25;
    transform: rotate(135deg);
  }
  100% {
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
    transform: rotate(450deg);
  }
}
@-webkit-keyframes spinner {
  0% {
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
  }
  65% {
    stroke-dasharray: 157;
    stroke-dashoffset: 39.25;
    transform: rotate(135deg);
  }
  100% {
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
    transform: rotate(450deg);
  }
}
@keyframes spinner {
  0% {
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
  }
  65% {
    stroke-dasharray: 157;
    stroke-dashoffset: 39.25;
    transform: rotate(135deg);
  }
  100% {
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
    transform: rotate(450deg);
  }
}
.container {
  position: fixed;
  overflow: hidden;
}

.center, .loader, .container, .page, .btn:after, .ARS {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.loader, .core, .spinner, .path {
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

/* -------------------
    # PAGE
   ------------------- */
.page {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 80vh;
}

.wrap {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  width: 100%;
}

.img,
.txt,
.btn {
  display: block;
  position: relative;
  margin: 0.75vh;
  background: #ccc;
}

.img {
  width: 100%;
  height: 15.5vh;
  transform-origin: 50% 50%;
}

.txt {
  display: block;
  margin: 0.75vh;
  height: 0.75vh;
  background: #ccc;
  transform-origin: 0 50%;
}

.btn {
  height: 4vh;
  color: #ccc;
  cursor: pointer;
  transform-origin: 50% 50%;
  z-index: 1;
}
.btn:after {
  content: "RELOAD";
  position: absolute;
  text-align: center;
  font: 700 1.5vh/4vh Verdana, sans-serif;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}
.loaded .btn {
  color: #fff;
  background: rgb(9, 240, 9);
  -moz-animation: btn-loaded 0.1s both 0.5s;
  -webkit-animation: btn-loaded 0.1s both 0.5s;
  animation: btn-loaded 0.1s both 0.5s;
}
.restart .btn {
  color: rgb(9, 240, 9);
  background: rgb(9, 240, 9);
  -moz-animation: btn-restart 0.1s both;
  -webkit-animation: btn-restart 0.1s both;
  animation: btn-restart 0.1s both;
}

.w5 {
  width: 5%;
}

.w10 {
  width: 10%;
}

.w15 {
  width: 15%;
}

.w20 {
  width: 20%;
}

.w25 {
  width: 25%;
}

.w30 {
  width: 30%;
}

.w35 {
  width: 35%;
}

.w40 {
  width: 40%;
}

.w45 {
  width: 45%;
}

.w50 {
  width: 50%;
}

.w55 {
  width: 55%;
}

.w60 {
  width: 60%;
}

.w65 {
  width: 65%;
}

.w70 {
  width: 70%;
}

.w75 {
  width: 75%;
}

.w80 {
  width: 80%;
}

.w85 {
  width: 85%;
}

.w90 {
  width: 90%;
}

.w95 {
  width: 95%;
}

.w100 {
  width: 100%;
}

.ib {
  display: inline-block;
}

.fw {
  flex: 0 0 97%;
}

.hw {
  flex: 0 0 30%;
}

.mt0 {
  margin-top: 0;
}

.mb2 {
  margin-bottom: 2vh;
}

.h10 {
  height: 10vh;
}

.f0 {
  font-size: 0;
}

.new-page .img {
  -moz-animation: scale-in 0.3s both cubic-bezier(0.87, -0.41, 0.19, 1.44);
  -webkit-animation: scale-in 0.3s both cubic-bezier(0.87, -0.41, 0.19, 1.44);
  animation: scale-in 0.3s both cubic-bezier(0.87, -0.41, 0.19, 1.44);
}
.new-page .txt {
  -moz-animation: scaleX-in 0.1s both ease-out;
  -webkit-animation: scaleX-in 0.1s both ease-out;
  animation: scaleX-in 0.1s both ease-out;
}
.new-page .btn {
  -moz-animation: scale-in 0.3s both cubic-bezier(0.87, -0.41, 0.19, 1.44);
  -webkit-animation: scale-in 0.3s both cubic-bezier(0.87, -0.41, 0.19, 1.44);
  animation: scale-in 0.3s both cubic-bezier(0.87, -0.41, 0.19, 1.44);
}
.new-page .dl1 {
  -moz-animation-delay: 0.85s;
  -webkit-animation-delay: 0.85s;
  animation-delay: 0.85s;
}
.new-page .dl2 {
  -moz-animation-delay: 0.95s;
  -webkit-animation-delay: 0.95s;
  animation-delay: 0.95s;
}
.new-page .dl3 {
  -moz-animation-delay: 1.05s;
  -webkit-animation-delay: 1.05s;
  animation-delay: 1.05s;
}
.new-page .dl4 {
  -moz-animation-delay: 1.15s;
  -webkit-animation-delay: 1.15s;
  animation-delay: 1.15s;
}
.new-page .dl5 {
  -moz-animation-delay: 1.25s;
  -webkit-animation-delay: 1.25s;
  animation-delay: 1.25s;
}
.new-page .dl6 {
  -moz-animation-delay: 1.35s;
  -webkit-animation-delay: 1.35s;
  animation-delay: 1.35s;
}
.new-page .dl7 {
  -moz-animation-delay: 1.45s;
  -webkit-animation-delay: 1.45s;
  animation-delay: 1.45s;
}
.new-page .dl8 {
  -moz-animation-delay: 1.55s;
  -webkit-animation-delay: 1.55s;
  animation-delay: 1.55s;
}
.new-page .dl9 {
  -moz-animation-delay: 1.65s;
  -webkit-animation-delay: 1.65s;
  animation-delay: 1.65s;
}
.new-page .dl10 {
  -moz-animation-delay: 1.75s;
  -webkit-animation-delay: 1.75s;
  animation-delay: 1.75s;
}
.new-page .dl11 {
  -moz-animation-delay: 1.85s;
  -webkit-animation-delay: 1.85s;
  animation-delay: 1.85s;
}
.new-page .dl12 {
  -moz-animation-delay: 1.95s;
  -webkit-animation-delay: 1.95s;
  animation-delay: 1.95s;
}
.new-page .dl13 {
  -moz-animation-delay: 2.05s;
  -webkit-animation-delay: 2.05s;
  animation-delay: 2.05s;
}
.new-page .dl14 {
  -moz-animation-delay: 2.15s;
  -webkit-animation-delay: 2.15s;
  animation-delay: 2.15s;
}
.new-page .dl15 {
  -moz-animation-delay: 2.25s;
  -webkit-animation-delay: 2.25s;
  animation-delay: 2.25s;
}
.new-page .dl16 {
  -moz-animation-delay: 2.35s;
  -webkit-animation-delay: 2.35s;
  animation-delay: 2.35s;
}
.new-page .dl17 {
  -moz-animation-delay: 2.45s;
  -webkit-animation-delay: 2.45s;
  animation-delay: 2.45s;
}
.new-page .dl18 {
  -moz-animation-delay: 2.55s;
  -webkit-animation-delay: 2.55s;
  animation-delay: 2.55s;
}
.new-page .dl19 {
  -moz-animation-delay: 2.65s;
  -webkit-animation-delay: 2.65s;
  animation-delay: 2.65s;
}
.new-page .dl20 {
  -moz-animation-delay: 2.75s;
  -webkit-animation-delay: 2.75s;
  animation-delay: 2.75s;
}
.new-page .dl21 {
  -moz-animation-delay: 2.85s;
  -webkit-animation-delay: 2.85s;
  animation-delay: 2.85s;
}
.new-page .dl22 {
  -moz-animation-delay: 2.95s;
  -webkit-animation-delay: 2.95s;
  animation-delay: 2.95s;
}
.new-page .dl23 {
  -moz-animation-delay: 3.05s;
  -webkit-animation-delay: 3.05s;
  animation-delay: 3.05s;
}
.new-page .dl24 {
  -moz-animation-delay: 3.15s;
  -webkit-animation-delay: 3.15s;
  animation-delay: 3.15s;
}
.new-page .dl25 {
  -moz-animation-delay: 3.25s;
  -webkit-animation-delay: 3.25s;
  animation-delay: 3.25s;
}
.new-page .dl26 {
  -moz-animation-delay: 3.35s;
  -webkit-animation-delay: 3.35s;
  animation-delay: 3.35s;
}
.new-page .dl27 {
  -moz-animation-delay: 3.45s;
  -webkit-animation-delay: 3.45s;
  animation-delay: 3.45s;
}
.new-page .dl28 {
  -moz-animation-delay: 3.55s;
  -webkit-animation-delay: 3.55s;
  animation-delay: 3.55s;
}
.new-page .dl29 {
  -moz-animation-delay: 3.65s;
  -webkit-animation-delay: 3.65s;
  animation-delay: 3.65s;
}
.new-page .dl30 {
  -moz-animation-delay: 3.75s;
  -webkit-animation-delay: 3.75s;
  animation-delay: 3.75s;
}

@-moz-keyframes scaleX-in {
  from {
    -moz-transform: scaleX(0);
    transform: scaleX(0);
  }
  to {
    -moz-transform: scaleX(1);
    transform: scaleX(1);
  }
}
@-webkit-keyframes scaleX-in {
  from {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
  }
  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}
@keyframes scaleX-in {
  from {
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
  }
  to {
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}
@-moz-keyframes scale-in {
  from {
    -moz-transform: scale(0);
    transform: scale(0);
  }
  to {
    -moz-transform: scale(1);
    transform: scale(1);
  }
}
@-webkit-keyframes scale-in {
  from {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes scale-in {
  from {
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  to {
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-moz-keyframes btn-loaded {
  from {
    color: #ccc;
    background: #ccc;
  }
  to {
    color: #fff;
    background: rgb(9, 240, 9);
  }
}
@-webkit-keyframes btn-loaded {
  from {
    color: #ccc;
    background: #ccc;
  }
  to {
    color: #fff;
    background: rgb(9, 240, 9);
  }
}
@keyframes btn-loaded {
  from {
    color: #ccc;
    background: #ccc;
  }
  to {
    color: #fff;
    background: rgb(9, 240, 9);
  }
}
@-moz-keyframes btn-restart {
  from {
    color: rgb(9, 240, 9);
    background: rgb(9, 240, 9);
  }
  to {
    color: #ccc;
    background: #ccc;
  }
}
@-webkit-keyframes btn-restart {
  from {
    color: rgb(9, 240, 9);
    background: rgb(9, 240, 9);
  }
  to {
    color: #ccc;
    background: #ccc;
  }
}
@keyframes btn-restart {
  from {
    color: rgb(9, 240, 9);
    background: rgb(9, 240, 9);
  }
  to {
    color: #ccc;
    background: #ccc;
  }
}
body {
  background: #eaeaea;
}

body:not(.loaded) *:not(.spinner, .spinner > .path) {
  -moz-animation: none !important;
  -webkit-animation: none !important;
  animation: none !important;
}

.ARS {
  display: inline-block;
  position: fixed;
  top: auto;
  bottom: 1vh;
  color: #ccc;
  text-align: center;
  text-decoration: none;
  font-family: Verdana, sans-serif;
  font-size: 12px;
  font-weight: 700;
  -moz-transform: translateY(10vh);
  -ms-transform: translateY(10vh);
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  -moz-transition: all 0.5s cubic-bezier(0.87, -0.41, 0.19, 1.44);
  -o-transition: all 0.5s cubic-bezier(0.87, -0.41, 0.19, 1.44);
  -webkit-transition: all 0.5s cubic-bezier(0.87, -0.41, 0.19, 1.44);
  transition: all 0.5s cubic-bezier(0.87, -0.41, 0.19, 1.44);
}
.ARS:hover {
  color: rgb(9, 240, 9);
  -moz-transition: color 0.5s !important;
  -o-transition: color 0.5s !important;
  -webkit-transition: color 0.5s !important;
  transition: color 0.5s !important;
}
.loaded.new-page .ARS {
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -moz-transition-delay: 2.15s;
  -o-transition-delay: 2.15s;
  -webkit-transition-delay: 2.15s;
  transition-delay: 2.15s;
}

@-moz-keyframes ARS {
  from {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  to {
    -moz-transform: translateY(10vh);
    transform: translateY(10vh);
  }
}
@-webkit-keyframes ARS {
  from {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  to {
    -webkit-transform: translateY(10vh);
    transform: translateY(10vh);
  }
}
@keyframes ARS {
  from {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  to {
    -moz-transform: translateY(10vh);
    -ms-transform: translateY(10vh);
    -webkit-transform: translateY(10vh);
    transform: translateY(10vh);
  }
}