html, body{

	 width: 100vw;
	 height: 100vh;
	 display: flex;
	 justify-content: center;
	 align-items: center;
	 flex-direction: column;
	 font-family: 'Rubik', sans-serif;
	 font-size: 1rem;
	 line-height: 1.5;
	 margin: 0;
	 min-height: 100vh;
}

.center {
  margin: 0;
  position: absolute;
  top: 86%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}


section {
	 width: 100%;
	 height: 100%;
	 overflow: hidden;
	 	 margin-left: auto;
	 margin-top: auto;
}
 .background {
	 background-image: linear-gradient(#000203 0%, #00345e 85%, #004d89 100%);
}
 .indrolab {
	 display: block;
	 position: relative;
	 width: auto;
	 height: 80%;
	 margin: 0 auto;
	/* top: 50%;
	 transform: translateY(-50%);  */
}
 .hover {
	 width: 100%;
	 height: 100%;
	 animation: hover 5s ease-in-out infinite;
	 animation-fill-mode: forwards;
}
 .hover2 {
	 width: 100%;
	 height: 100%;
	 animation: hover2 5s ease-in-out infinite;
	 animation-fill-mode: forwards;
}
 .hover3 {
	 width: 100%;
	 height: 100%;
	 animation: hover3 5s ease-in-out infinite;
	 animation-fill-mode: forwards;
}

 .hover4 {
	 width: 100%;
	 height: 100%;
	 animation: hover4 5s ease-in-out infinite;
	 animation-fill-mode: forwards;
}

 .number-one {
	 transform: translateX(40px) translateY(-10px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-10 4075ms ease-in-out infinite;
	 animation-fill-mode: forwards;
}
 .number-two {
	 transform: translateY(-20px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-20 2035ms ease-in-out infinite;
	 animation-delay: 53ms;
	 animation-fill-mode: forwards;
}
 .number-three {
	 transform: translateY(-30px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-30 3302ms ease-in-out infinite;
	 animation-delay: 5813ms;
	 animation-fill-mode: forwards;
}
 .number-four {
	 transform: translateY(-50px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-50 5371ms ease-in-out infinite;
	 animation-delay: 1957ms;
	 animation-fill-mode: forwards;
}
 .number-five {
	 transform: translateY(-60px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-60 2090ms ease-in-out infinite;
	 animation-delay: 5872ms;
	 animation-fill-mode: forwards;
}
 .number-six {
	 transform: translateY(-70px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-70 2082ms ease-in-out infinite;
	 animation-delay: 162ms;
	 animation-fill-mode: forwards;
}
 .number-seven {
	 transform: translateY(-80px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-80 3863ms ease-in-out infinite;
	 animation-delay: 4452ms;
	 animation-fill-mode: forwards;
}
 .number-eight {
	 transform: translateY(-90px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-90 4964ms ease-in-out infinite;
	 animation-delay: 3467ms;
	 animation-fill-mode: forwards;
}
 .number-nine {
	 transform: translateY(-100px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-100 4967ms ease-in-out infinite;
	 animation-delay: 4126ms;
	 animation-fill-mode: forwards;
}
 .number-ten {
	 transform: translateY(-110px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-110 3692ms ease-in-out infinite;
	 animation-delay: 299ms;
	 animation-fill-mode: forwards;
}
 .number-eleven {
	 transform: translateY(-120px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-120 4718ms ease-in-out infinite;
	 animation-delay: 4036ms;
	 animation-fill-mode: forwards;
}
 .number-twelve {
	 transform: translateY(-150px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-150 2635ms ease-in-out infinite;
	 animation-delay: 5088ms;
	 animation-fill-mode: forwards;
}
 .number-thirteen {
	 transform: translateY(-160px) translateZ(0);
	 opacity: 0;
	 animation: fadeNumberDown-160 5360ms ease-in-out infinite;
	 animation-delay: 3740ms;
	 animation-fill-mode: forwards;
}
 @keyframes hover {
	 0% {
		 transform: translateY(0);
	}
	 25% {
		 transform: translateY(-3px);
	}
	 75% {
		 transform: translateY(3px);
	}
	 100% {
		 transform: translateY(0px);
	}
}
 @keyframes hover2 {
	 0% {
		 transform: translateY(0);
	}
	 25% {
		 transform: translateY(15px);
	}
	 75% {
		 transform: translateY(-13px);
	}
	 100% {
		 transform: translateY(0px);
	}
}
 @keyframes hover3 {
	 0% {
		 transform: translateY(0);
	}
	 25% {
		 transform: translateY(7px);
	}
	 75% {
		 transform: translateY(-7px);
	}
	 100% {
		 transform: translateY(0px);
	}
}

 @keyframes hover4 {
	 0% {
		 transform: translateY(0);
	}
	 25% {
		 transform: translateY(10740px);
	}
	 75% {
		 transform: translateY(-1071px);
	}
	 100% {
		 transform: translateY(0px);
	}
}


 @keyframes fadeNumberDown-10 {
	 0% {
		 transform: translateX(-130px) translateY(-70px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-130px) translateY(70px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-20 {
	 0% {
		 transform: translateX(-200px) translateY(-20px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-200px) translateY(140px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-30 {
	 0% {
		 transform: translateX(-150px) translateY(-30px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-150px) translateY(130px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-50 {
	 0% {
		 transform: translateX(-200px) translateY(-50px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-200px) translateY(110px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-60 {
	 0% {
		 transform: translateX(-100px) translateY(-60px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-100px) translateY(90px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-70 {
	 0% {
		 transform: translateX(-120px) translateY(-70px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-120px)translateY(80px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-80 {
	 0% {
		 transform: translateX(-100px) translateY(-80px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-100px) translateY(80px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-90 {
	 0% {
		 transform: translateX(-140px) translateY(-90px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-140px) translateY(60px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-100 {
	 0% {
		 transform: translateX(-200px) translateY(-100px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-200px) translateY(60px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-110 {
	 0% {
		 transform: translateX(-200px) translateY(-110px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-200px) translateY(30px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-120 {
	 0% {
		 transform: translateX(-200px) translateY(-120px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-200px) translateY(20px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-150 {
	 0% {
		 transform: translateX(-200px) translateY(-150px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-200px) translateY(10px) translateZ(0);
		 opacity: 0;
	}
}
 @keyframes fadeNumberDown-160 {
	 0% {
		 transform: translateX(-200px) translateY(-160px) translateZ(0);
		 opacity: 0;
	}
	 40% {
		 opacity: 0.4;
	}
	 60% {
		 opacity: 0.4;
	}
	 100% {
		 transform: translateX(-200px) translateY(10px) translateZ(0);
		 opacity: 0;
	}
}
 
 
 
 
 
 
 @import url('https://fonts.googleapis.com/css?family=Rubik:700&display=swap');
 * {
	 box-sizing: border-box;
}
 *::before, *::after {
	 box-sizing: border-box;
}

 button {
	 position: relative;
	 display: inline-block;
	 cursor: pointer;
	 outline: none;
	 border: 0;
	 vertical-align: middle;
	 text-decoration: none;
	/* font-size: inherit; */
	 font-family: inherit;
}
 button.click {
	 font-weight: 600;
	 color: #fff;
	 text-transform: uppercase;
	 padding: .8em 1em;
	 background: #f29d71;
	 border: 2px solid #ee7333;
	 border-radius: 0.75em;
	 transform-style: preserve-3d;
	 transition: transform 150ms cubic-bezier(0, 0, 0.58, 1), background 150ms cubic-bezier(0, 0, 0.58, 1);
}
 button.click::before {
	 position: absolute;
	 content: '';
	 width: 100%;
	 height: 100%;
	 top: 0;
	 left: 0;
	 right: 0;
	 bottom: 0;
	 background: #c75419;
	 border-radius: inherit;
	 box-shadow: 0 0 0 .3px #ee7333, 0 0.625em 0.925em 0 #ffd285;
	 transform: translate3d(0, 0.75em, -1em);
	 transition: transform 150ms cubic-bezier(0, 0, 0.58, 1), box-shadow 150ms cubic-bezier(0, 0, 0.58, 1);
}
 button.click:hover {
	 background: #ee7333;
	 transform: translate(0, 0.25em);
}
 button.click:hover::before {
	 box-shadow: 0 0 0 .3px #ee7333, 0 0.5em 0.625em 0 #ffd285;
	 transform: translate3d(0, 0.5em, -1em);
}
 button.click:active {
	 background: #ee7333;
	 transform: translate(0em, 0.75em);
}
 button.click:active::before {
	 box-shadow: 0 0 0 2px #ee7333, 0 0 #ffd285;
	 transform: translate3d(0, 0, -1em);
}