/* Scolling Text */

.floatwrap {
  display: block;
  overflow: hidden;
  position: absolute;
  /* top: 300px;
  /* left: 840px; */
  height: 100%;
  width: 100%;
  z-index: -2;
  animation: loadfloaters 3s ease-in 1s 1;
  animation-delay: 3s;
  /* animation-iteration-count: 1; */
}

@keyframes loadfloaters {
  from {
    transition-property: opacity(0);
    transform: top(800px);
  }

  to {
    transition-property: opacity(1);
    transform: top(-800px);
  }
}

.vscroll {
  background: rgba(0, 0, 0, 0);
  height: 100%;
  width: 100%;
  left: auto;
  opacity: 50%;
  position: relative;
  font-size: 20px;
  color: rgb(184, 184, 184);
}

.hw {
  display: block;
}

.sw {
  display: block;
}

.nw {
  display: block;
}

.web {
  display: block;
}

.cloud {
  display: block;
}

#vscroll01 {
  position: absolute;
  left: 4%;
  width: 100%;
  top: 700px;
  animation: scrollUp1 11s ease-in-out infinite normal;
  animation-delay: 0s;
}

#vscroll02 {
  position: absolute;
  left: 28%;
  width: 100%;
  top: 700px;
  animation: scrollUp2 13s ease-in-out infinite normal;
  animation-delay: 1s;
}

#vscroll03 {
  position: absolute;
  left: 36%;
  width: 100%;
  top: 700px;
  animation: scrollUp3 10s ease-in-out infinite normal;
  animation-delay: 2s;
}

#vscroll04 {
  position: absolute;
  left: 52%;
  width: 100%;
  top: 700px;
  animation: scrollUp4 12s ease-in-out infinite normal;
  animation-delay: 3s;
}

#vscroll05 {
  position: absolute;
  left: 13%;
  width: 100%;
  top: 700px;
  animation: scrollUp5 11s ease-in-out infinite normal;
  animation-delay: 0s;
}

#vscroll06 {
  position: absolute;
  left: 83%;
  width: 100%;
  top: 700px;
  animation: scrollUp6 9s ease-in-out infinite normal;
  animation-delay: 3s;
}

#vscroll07 {
  position: absolute;
  left: 45%;
  width: 100%;
  top: 700px;
  animation: scrollUp7 10s ease-in-out infinite normal;
  animation-delay: 2s;
}

#vscroll08 {
  position: absolute;
  left: 1%;
  width: 100%;
  top: 700px;
  animation: scrollUp8 17s ease-in-out infinite normal;
  animation-delay: 3s;
}

#vscroll09 {
  position: absolute;
  left: 91%;
  width: 100%;
  top: 700px;
  animation: scrollUp9 9s ease-in-out infinite normal;
  animation-delay: 2.2s;
}

#vscroll10 {
  position: absolute;
  left: 30%;
  width: 100%;
  top: 700px;
  animation: scrollUp10 13s ease-in-out infinite normal;
  animation-delay: 4s;
}

#vscroll11 {
  position: absolute;
  left: 74%;
  width: 100%;
  top: 700px;
  animation: scrollUp11 14s ease-in-out infinite normal;
  animation-delay: 4s;
}

#vscroll12 {
  position: absolute;
  left: 14%;
  width: 100%;
  top: 700px;
  animation: scrollUp12 16s ease-in-out infinite normal;
  animation-delay: 5.2s;
}

#vscroll13 {
  position: absolute;
  left: 24%;
  width: 100%;
  top: 700px;
  animation: scrollUp13 12s ease-in-out infinite normal;
  animation-delay: 2s;
}

#vscroll14 {
  position: absolute;
  left: 44%;
  width: 100%;
  top: 700px;
  animation: scrollUp14 14s ease-in-out infinite normal;
  animation-delay: 3s;
}

#vscroll15 {
  position: absolute;
  left: 69%;
  width: 100%;
  top: 700px;
  animation: scrollUp15 9s ease-in-out infinite normal;
  animation-delay: 1s;
}

#vscroll16 {
  position: absolute;
  left: 44%;
  width: 100%;
  top: 700px;
  animation: scrollUp16 14s ease-in-out infinite normal;
  animation-delay: 3.3s;
}

#vscroll17 {
  position: absolute;
  left: 84%;
  width: 100%;
  top: 700px;
  animation: scrollUp17 15s ease-in-out infinite normal;
  animation-delay: 2s;
}

#vscroll18 {
  position: absolute;
  left: 24%;
  width: 100%;
  top: 700px;
  animation: scrollUp18 11s ease-in-out infinite normal;
  animation-delay: 1.2s;
}

#vscroll19 {
  position: absolute;
  left: 36%;
  width: 100%;
  top: 700px;
  animation: scrollUp19 9s ease-in-out infinite normal;
  animation-delay: 1.8s;
}

#vscroll20 {
  position: absolute;
  left: 59%;
  width: 100%;
  top: 700px;
  animation: scrollUp20 14s ease-in-out infinite normal;
  animation-delay: 5s;
}

.box {
  height: 200px;
  overflow: hidden;
  position: relative;
}

.vscroll ul {
  float: left;
  margin: 0;
  padding: 0;
  animation-iteration-count: infinite;
}

.vscroll ul li {
  opacity: 0.7;
  height: 20px;
  padding: 20px;
  list-style: none;
}

@keyframes scrollUp1 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-2000px);
  }
}

@keyframes scrollUp2 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp3 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp4 {
  from {
    transform: translateY(800px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp5 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1800px);
  }
}

@keyframes scrollUp6 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp7 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp8 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp9 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp10 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp11 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-2000px);
  }
}

@keyframes scrollUp12 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp13 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp14 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp15 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-2200px);
  }
}

@keyframes scrollUp16 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp17 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp18 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp19 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}

@keyframes scrollUp20 {
  from {
    transform: translateY(700px);
  }

  to {
    transform: translateY(-1400px);
  }
}