
.os-phrases-hidden {
	display:none;
}



.os-phrases p {
  font-size: 1.5rem;
  font-family: 'Poppins', cursive;
  text-align: center;
  width: 100%;
  overflow: hidden;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 120px;
  left: 0;
  opacity: 0;
}

.os-phrases p,
.os-phrases p > span {
  height: 80%;
  /* Centering with flexbox */
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.os-phrases p > span {
  margin: 0 15px;
}

.os-phrases p > span > span {
  display: inline-block;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  perspective: 1000px;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.os-phrases p > span > span > span {
  display: inline-block;
  color: hsla(0,0%,0%,0);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.os-phrases p:nth-child(1) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 2.2s;
  -moz-animation-delay: 2.2s;
  animation-delay: 2.2s;
}

.os-phrases p:nth-child(2) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 4.8s;
  -moz-animation-delay: 4.8s;
  animation-delay: 4.8s;
}

.os-phrases p:nth-child(3) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 6.2s;
  -moz-animation-delay: 6.2s;
  animation-delay: 6.2s;
}

.os-phrases p:nth-child(4) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 9.2s;
  -moz-animation-delay: 9.2s;
  animation-delay: 9.2s;
}

.os-phrases p:nth-child(5) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 10.4s;
  -moz-animation-delay: 10.4s;
  animation-delay: 10.4s;
}

.os-phrases p:nth-child(6) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 13.3s;
  -moz-animation-delay: 13.3s;
  animation-delay: 13.3s;
}

.os-phrases p:nth-child(7) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 16.7s;
  -moz-animation-delay: 16.7s;
  animation-delay: 16.7s;
}

.os-phrases p:nth-child(8) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 19.7s;
  -moz-animation-delay: 19.7s;
  animation-delay: 19.7s;
}

.os-phrases p:nth-child(9) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 23.5s;
  -moz-animation-delay: 23.5s;
  animation-delay: 23.5s;
}

.os-phrases p:nth-child(10) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 27.9s;
  -moz-animation-delay: 27.9s;
  animation-delay: 27.9s;
}

.os-phrases p:nth-child(11) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 33.5s;
  -moz-animation-delay: 33.5s;
  animation-delay: 33.5s;
}

.os-phrases p:nth-child(12) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 37.0s;
  -moz-animation-delay: 37.0s;
  animation-delay: 37.0s;
}

.os-phrases p:nth-child(13) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 40.2s;
  -moz-animation-delay: 40.2s;
  animation-delay: 40.2s;
}

.os-phrases p:nth-child(14) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 43.9s;
  -moz-animation-delay: 43.9s;
  animation-delay: 43.9s;
}

.os-phrases p:nth-child(15) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 48.5s;
  -moz-animation-delay: 48.5s;
  animation-delay: 48.5s;
}

.os-phrases p:nth-child(16) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 52.9s;
  -moz-animation-delay: 52.9s;
  animation-delay: 52.9s;
}

.os-phrases p:nth-child(17) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 56.5s;
  -moz-animation-delay: 56.5s;
  animation-delay: 56.5s;
}

.os-phrases p:nth-child(18) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 59.3s;
  -moz-animation-delay: 59.3s;
  animation-delay: 59.3s;
}

.os-phrases p:nth-child(19) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 63.4s;
  -moz-animation-delay: 63.4s;
  animation-delay: 63.4s;
}

.os-phrases p:nth-child(20) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 68.3s;
  -moz-animation-delay: 68.3s;
  animation-delay: 68.3s;
}

.os-phrases p:nth-child(21) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 71.8s;
  -moz-animation-delay: 71.8s;
  animation-delay: 71.8s;
}

.os-phrases p:nth-child(22) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 75.5s;
  -moz-animation-delay: 75.5s;
  animation-delay: 75.5s;
}

.os-phrases p:nth-child(23) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 80.5s;
  -moz-animation-delay: 80.5s;
  animation-delay: 80.5s;
}

.os-phrases p:nth-child(24) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 84.6s;
  -moz-animation-delay: 84.6s;
  animation-delay: 84.6s;
}

.os-phrases p:nth-child(25) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 87.8s;
  -moz-animation-delay: 87.8s;
  animation-delay: 87.8s;
}

.os-phrases p:nth-child(26) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 92.3s;
  -moz-animation-delay: 92.3s;
  animation-delay: 92.3s;
}

.os-phrases p:nth-child(27) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 95.5s;
  -moz-animation-delay: 95.5s;
  animation-delay: 95.5s;
}

.os-phrases p:nth-child(28) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 99.1s;
  -moz-animation-delay: 99.1s;
  animation-delay: 99.1s;
}

.os-phrases p:nth-child(29) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 102.2s;
  -moz-animation-delay: 102.2s;
  animation-delay: 102.2s;
}

.os-phrases p:nth-child(30) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 106.6s;
  -moz-animation-delay: 106.6s;
  animation-delay: 106.6s;
}

.os-phrases p:nth-child(31) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 109.6s;
  -moz-animation-delay: 109.6s;
  animation-delay: 109.6s;
}

.os-phrases p:nth-child(32) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 113.4s;
  -moz-animation-delay: 113.4s;
  animation-delay: 113.4s;
}

.os-phrases p:nth-child(33) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 119.5s;
  -moz-animation-delay: 119.5s;
  animation-delay: 119.5s;
}

.os-phrases p:nth-child(34) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 123.1s;
  -moz-animation-delay: 123.1s;
  animation-delay: 123.1s;
}

.os-phrases p:nth-child(35) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 127.0s;
  -moz-animation-delay: 127.0s;
  animation-delay: 127.0s;
}

.os-phrases p:nth-child(36) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 130.3s;
  -moz-animation-delay: 130.3s;
  animation-delay: 130.3s;
}

.os-phrases p:nth-child(37) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 133.0s;
  -moz-animation-delay: 133.0s;
  animation-delay: 133.0s;
}

.os-phrases p:nth-child(38) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 136.9s;
  -moz-animation-delay: 136.9s;
  animation-delay: 136.9s;
}

.os-phrases p:nth-child(39) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 142.6;
  -moz-animation-delay: 142.6s;
  animation-delay: 142.6s;
}

.os-phrases p:nth-child(40) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 145.3s;
  -moz-animation-delay: 145.3s;
  animation-delay: 145.3s;
}

.os-phrases p:nth-child(41) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 150.5s;
  -moz-animation-delay: 150.5s;
  animation-delay: 150.5s;
}

.os-phrases p:nth-child(42) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 156.5s;
  -moz-animation-delay: 156.5s;
  animation-delay: 156.5s;
}

.os-phrases p:nth-child(43) > span > span > span {
	  -webkit-animation: OpeningSequence 10s linear forwards;
  -moz-animation: OpeningSequence 10s linear forwards;
  animation: OpeningSequence 10s linear forwards;
  -webkit-animation-delay: 159.1s;
  -moz-animation-delay: 159.1s;
  animation-delay: 159.1s;
}

.os-phrases p:nth-child(44) > span > span > span {
-webkit-animation: FadeIn 10s linear forwards;
  -moz-animation: FadeIn 10s linear forwards;
  animation: FadeIn 10s linear forwards;
  -webkit-animation-delay: 162.0s;
  -moz-animation-delay: 162.0s;
  animation-delay: 162.0s;
}

@-webkit-keyframes OpeningSequence {
  0% {
    text-shadow: 0 0 3rem #fff;
    letter-spacing: 10px;
    opacity: 0;
    -webkit-transform: rotateY(-90deg);
  }
  15% {
    text-shadow: 0 0 1px #fff;
    letter-spacing: 3px;
    opacity: 0.8;
    -webkit-transform: rotateY(0deg);
  }
  45% {
    text-shadow: 0 0 1px #fff;
    letter-spacing: 1px;
    opacity: 0.8;
    -webkit-transform: rotateY(0deg) translateZ(100px) translateY(-125px);
  }
  100% {
    text-shadow: 0 0 10px #fff;
    opacity: 0;
    -webkit-transform: translateZ(130px);
    pointer-events: none;
  }
}

@-moz-keyframes OpeningSequence {
  0% {
    text-shadow: 0 0 50px #fff;
    letter-spacing: 10px;
    opacity: 0.2;
    -moz-transform: rotateY(-90deg);
  }
  15% {
    text-shadow: 0 0 1px #fff;
    letter-spacing: 3px;
    opacity: 0.8;
    -moz-transform: rotateY(0deg);
  }
  45% {
    text-shadow: 0 0 1px #fff;
    letter-spacing: 1px;
    opacity: 0.8;
    -moz-transform: rotateY(0deg) translateZ(100px) translateY(-125px);
  }
  100% {
    text-shadow: 0 0 10px #fff;
    opacity: 0;
    -moz-transform: translateZ(130px);
    pointer-events: none;
  }
}

@keyframes OpeningSequence {
  0% {
    text-shadow: 0 0 50px #fff;
    letter-spacing: 10px;
    opacity: 0.2;
    transform: rotateY(-90deg);
  }
  15% {
    text-shadow: 0 0 1px #fff;
    letter-spacing:1px;
    opacity: 0.8;
    transform: rotateY(0deg);
  }
  45% {
    text-shadow: 0 0 1px #fff;
    letter-spacing: 1px;	
    opacity: 0.8;
    transform: rotateY(0deg) translateZ(100px) translateY(-80px);
  }
  90% {
    text-shadow: 0 0 1px #fff;
    letter-spacing: 1px;	
    opacity: 0.8;
    transform: rotateY(0deg) translateZ(100px) translateY(-220px);
  }
  100% {
    text-shadow: 0 0 10px #fff;
    opacity: 0;
    transform: translateZ(130px)translateY(-250px);
    pointer-events: none;
  }
}

@-webkit-keyframes FadeIn { 
  0% {
    opacity: 0;
    text-shadow: 0 0 50px #fff;
  }
  100% {
    opacity: 1;
    text-shadow: 0 0 1px #fff;
  }
}

@-moz-keyframes FadeIn { 
  0% {
    opacity: 0;
    text-shadow: 0 0 50px #fff;
  }
  100% {
    opacity: 1;
    text-shadow: 0 0 1px #fff;
  }
}

@keyframes FadeIn { 
  0% {
    opacity: 0;
    text-shadow: 0 0 50px #fff;
  }
  100% {
    opacity: 1;
    text-shadow: 0 0 1px #fff;
  }
}



