html {
  font-family: "Open Sans", sans-serif;
  overflow:    hidden;
}

body {
  margin:     0;
  background: #172a3a;
}

.playgroundIn {
  -webkit-animation: playgroundIn 0.5s ease-out forwards;
  animation:         playgroundIn 0.5s ease-out forwards;
}

@-webkit-keyframes playgroundIn {
  from {
    opacity:           0;
    -webkit-transform: translateY(10px);
    -ms-transform:     translateY(10px);
    transform:         translateY(10px);
  }

  to {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }
}

@keyframes playgroundIn {
  from {
    opacity:           0;
    -webkit-transform: translateY(10px);
    -ms-transform:     translateY(10px);
    transform:         translateY(10px);
  }

  to {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }
}

.fadeOut {
  -webkit-animation: fadeOut 0.5s ease-out forwards;
  animation:         fadeOut 0.5s ease-out forwards;
}

@-webkit-keyframes fadeIn {
  from {
    opacity:           0;
    -webkit-transform: translateY(-10px);
    -ms-transform:     translateY(-10px);
    transform:         translateY(-10px);
  }

  to {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }
}

@keyframes fadeIn {
  from {
    opacity:           0;
    -webkit-transform: translateY(-10px);
    -ms-transform:     translateY(-10px);
    transform:         translateY(-10px);
  }

  to {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }
}

@-webkit-keyframes fadeOut {
  from {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }

  to {
    opacity:           0;
    -webkit-transform: translateY(-10px);
    -ms-transform:     translateY(-10px);
    transform:         translateY(-10px);
  }
}

@keyframes fadeOut {
  from {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }

  to {
    opacity:           0;
    -webkit-transform: translateY(-10px);
    -ms-transform:     translateY(-10px);
    transform:         translateY(-10px);
  }
}

@-webkit-keyframes appearIn {
  from {
    opacity:           0;
    -webkit-transform: translateY(0px);
    -ms-transform:     translateY(0px);
    transform:         translateY(0px);
  }

  to {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }
}

@keyframes appearIn {
  from {
    opacity:           0;
    -webkit-transform: translateY(0px);
    -ms-transform:     translateY(0px);
    transform:         translateY(0px);
  }

  to {
    opacity:           1;
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0);
  }
}

@-webkit-keyframes scaleIn {
  from {
    -webkit-transform: scale(0);
    -ms-transform:     scale(0);
    transform:         scale(0);
  }

  to {
    -webkit-transform: scale(1);
    -ms-transform:     scale(1);
    transform:         scale(1);
  }
}

@keyframes scaleIn {
  from {
    -webkit-transform: scale(0);
    -ms-transform:     scale(0);
    transform:         scale(0);
  }

  to {
    -webkit-transform: scale(1);
    -ms-transform:     scale(1);
    transform:         scale(1);
  }
}

@-webkit-keyframes innerDrawIn {
  0% {
    stroke-dashoffset: 70;
  }

  50% {
    stroke-dashoffset: 140;
  }

  100% {
    stroke-dashoffset: 210;
  }
}

@keyframes innerDrawIn {
  0% {
    stroke-dashoffset: 70;
  }

  50% {
    stroke-dashoffset: 140;
  }

  100% {
    stroke-dashoffset: 210;
  }
}

@-webkit-keyframes outerDrawIn {
  0% {
    stroke-dashoffset: 76;
  }

  100% {
    stroke-dashoffset: 152;
  }
}

@keyframes outerDrawIn {
  0% {
    stroke-dashoffset: 76;
  }

  100% {
    stroke-dashoffset: 152;
  }
}

.hHWjkv {
  -webkit-transform-origin: 0px 0px;
  -ms-transform-origin:     0px 0px;
  transform-origin:         0px 0px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.2222222222222222s;
  animation:                scaleIn 0.25s linear forwards 0.2222222222222222s;
}

.gCDOzd {
  -webkit-transform-origin: 0px 0px;
  -ms-transform-origin:     0px 0px;
  transform-origin:         0px 0px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.4222222222222222s;
  animation:                scaleIn 0.25s linear forwards 0.4222222222222222s;
}

.hmCcxi {
  -webkit-transform-origin: 0px 0px;
  -ms-transform-origin:     0px 0px;
  transform-origin:         0px 0px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.6222222222222222s;
  animation:                scaleIn 0.25s linear forwards 0.6222222222222222s;
}

.eHamQi {
  -webkit-transform-origin: 0px 0px;
  -ms-transform-origin:     0px 0px;
  transform-origin:         0px 0px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.8222222222222223s;
  animation:                scaleIn 0.25s linear forwards 0.8222222222222223s;
}

.byhgGu {
  -webkit-transform-origin: 0px 0px;
  -ms-transform-origin:     0px 0px;
  transform-origin:         0px 0px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 1.0222222222222221s;
  animation:                scaleIn 0.25s linear forwards 1.0222222222222221s;
}

.llAKP {
  -webkit-transform-origin: 0px 0px;
  -ms-transform-origin:     0px 0px;
  transform-origin:         0px 0px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 1.2222222222222223s;
  animation:                scaleIn 0.25s linear forwards 1.2222222222222223s;
}

.bglIGM {
  -webkit-transform-origin: 64px 28px;
  -ms-transform-origin:     64px 28px;
  transform-origin:         64px 28px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.2222222222222222s;
  animation:                scaleIn 0.25s linear forwards 0.2222222222222222s;
}

.ksxRII {
  -webkit-transform-origin: 95.98500061035156px 46.510000228881836px;
  -ms-transform-origin:     95.98500061035156px 46.510000228881836px;
  transform-origin:         95.98500061035156px 46.510000228881836px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.4222222222222222s;
  animation:                scaleIn 0.25s linear forwards 0.4222222222222222s;
}

.cWrBmb {
  -webkit-transform-origin: 95.97162628173828px 83.4900016784668px;
  -ms-transform-origin:     95.97162628173828px 83.4900016784668px;
  transform-origin:         95.97162628173828px 83.4900016784668px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.6222222222222222s;
  animation:                scaleIn 0.25s linear forwards 0.6222222222222222s;
}

.Wnusb {
  -webkit-transform-origin: 64px 101.97999572753906px;
  -ms-transform-origin:     64px 101.97999572753906px;
  transform-origin:         64px 101.97999572753906px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 0.8222222222222223s;
  animation:                scaleIn 0.25s linear forwards 0.8222222222222223s;
}

.bfPqf {
  -webkit-transform-origin: 32.03982162475586px 83.4900016784668px;
  -ms-transform-origin:     32.03982162475586px 83.4900016784668px;
  transform-origin:         32.03982162475586px 83.4900016784668px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 1.0222222222222221s;
  animation:                scaleIn 0.25s linear forwards 1.0222222222222221s;
}

.edRCTN {
  -webkit-transform-origin: 32.033552169799805px 46.510000228881836px;
  -ms-transform-origin:     32.033552169799805px 46.510000228881836px;
  transform-origin:         32.033552169799805px 46.510000228881836px;
  -webkit-transform:        scale(0);
  -ms-transform:            scale(0);
  transform:                scale(0);
  -webkit-animation:        scaleIn 0.25s linear forwards 1.2222222222222223s;
  animation:                scaleIn 0.25s linear forwards 1.2222222222222223s;
}

.iEGVWn {
  opacity:                           0;
  stroke-dasharray:                  76;
  -webkit-animation:                 outerDrawIn 0.5s ease-out forwards 0.3333333333333333s, appearIn 0.1s ease-out forwards 0.3333333333333333s;
  animation:                         outerDrawIn 0.5s ease-out forwards 0.3333333333333333s, appearIn 0.1s ease-out forwards 0.3333333333333333s;
  -webkit-animation-iteration-count: 1, 1;
  animation-iteration-count:         1, 1;
}

.bsocdx {
  opacity:                           0;
  stroke-dasharray:                  76;
  -webkit-animation:                 outerDrawIn 0.5s ease-out forwards 0.5333333333333333s, appearIn 0.1s ease-out forwards 0.5333333333333333s;
  animation:                         outerDrawIn 0.5s ease-out forwards 0.5333333333333333s, appearIn 0.1s ease-out forwards 0.5333333333333333s;
  -webkit-animation-iteration-count: 1, 1;
  animation-iteration-count:         1, 1;
}

.jAZXmP {
  opacity:                           0;
  stroke-dasharray:                  76;
  -webkit-animation:                 outerDrawIn 0.5s ease-out forwards 0.7333333333333334s, appearIn 0.1s ease-out forwards 0.7333333333333334s;
  animation:                         outerDrawIn 0.5s ease-out forwards 0.7333333333333334s, appearIn 0.1s ease-out forwards 0.7333333333333334s;
  -webkit-animation-iteration-count: 1, 1;
  animation-iteration-count:         1, 1;
}

.hSeArx {
  opacity:                           0;
  stroke-dasharray:                  76;
  -webkit-animation:                 outerDrawIn 0.5s ease-out forwards 0.9333333333333333s, appearIn 0.1s ease-out forwards 0.9333333333333333s;
  animation:                         outerDrawIn 0.5s ease-out forwards 0.9333333333333333s, appearIn 0.1s ease-out forwards 0.9333333333333333s;
  -webkit-animation-iteration-count: 1, 1;
  animation-iteration-count:         1, 1;
}

.bVgqGk {
  opacity:                           0;
  stroke-dasharray:                  76;
  -webkit-animation:                 outerDrawIn 0.5s ease-out forwards 1.1333333333333333s, appearIn 0.1s ease-out forwards 1.1333333333333333s;
  animation:                         outerDrawIn 0.5s ease-out forwards 1.1333333333333333s, appearIn 0.1s ease-out forwards 1.1333333333333333s;
  -webkit-animation-iteration-count: 1, 1;
  animation-iteration-count:         1, 1;
}

.hEFqBt {
  opacity:                           0;
  stroke-dasharray:                  76;
  -webkit-animation:                 outerDrawIn 0.5s ease-out forwards 1.3333333333333333s, appearIn 0.1s ease-out forwards 1.3333333333333333s;
  animation:                         outerDrawIn 0.5s ease-out forwards 1.3333333333333333s, appearIn 0.1s ease-out forwards 1.3333333333333333s;
  -webkit-animation-iteration-count: 1, 1;
  animation-iteration-count:         1, 1;
}

.dzEKCM {
  opacity:                           0;
  stroke-dasharray:                  70;
  -webkit-animation:                 innerDrawIn 1s ease-in-out forwards 1.3666666666666667s, appearIn 0.1s linear forwards 1.3666666666666667s;
  animation:                         innerDrawIn 1s ease-in-out forwards 1.3666666666666667s, appearIn 0.1s linear forwards 1.3666666666666667s;
  -webkit-animation-iteration-count: infinite, 1;
  animation-iteration-count:         infinite, 1;
}

.DYnPx {
  opacity:                           0;
  stroke-dasharray:                  70;
  -webkit-animation:                 innerDrawIn 1s ease-in-out forwards 1.5333333333333332s, appearIn 0.1s linear forwards 1.5333333333333332s;
  animation:                         innerDrawIn 1s ease-in-out forwards 1.5333333333333332s, appearIn 0.1s linear forwards 1.5333333333333332s;
  -webkit-animation-iteration-count: infinite, 1;
  animation-iteration-count:         infinite, 1;
}

.hjPEAQ {
  opacity:                           0;
  stroke-dasharray:                  70;
  -webkit-animation:                 innerDrawIn 1s ease-in-out forwards 1.7000000000000002s, appearIn 0.1s linear forwards 1.7000000000000002s;
  animation:                         innerDrawIn 1s ease-in-out forwards 1.7000000000000002s, appearIn 0.1s linear forwards 1.7000000000000002s;
  -webkit-animation-iteration-count: infinite, 1;
  animation-iteration-count:         infinite, 1;
}

#loading-wrapper {
  position:                absolute;
  width:                   100vw;
  height:                  100vh;
  display:                 -webkit-box;
  display:                 -webkit-flex;
  display:                 -ms-flexbox;
  display:                 flex;
  -webkit-align-items:     center;
  -webkit-box-align:       center;
  -ms-flex-align:          center;
  align-items:             center;
  -webkit-box-pack:        center;
  -webkit-justify-content: center;
  -ms-flex-pack:           center;
  justify-content:         center;
  -webkit-flex-direction:  column;
  -ms-flex-direction:      column;
  flex-direction:          column;
}

.logo {
  width:             75px;
  height:            75px;
  margin-bottom:     20px;
  opacity:           0;
  -webkit-animation: fadeIn 0.5s ease-out forwards;
  animation:         fadeIn 0.5s ease-out forwards;
}

.text {
  font-size:         32px;
  font-weight:       200;
  text-align:        center;
  color:             rgba(255, 255, 255, 0.6);
  opacity:           0;
  -webkit-animation: fadeIn 0.5s ease-out forwards;
  animation:         fadeIn 0.5s ease-out forwards;
}

.dGfHfc {
  font-weight: 400;
}
