:root{
	--pyramid-color: #00ff84;
	--pyramid-color-bg: #00ff8470;
}

#wrapper{padding-top: 0;}



#main{
	position: absolute; 
	top: 50%; left: 50%; transform: translate(-50%, -50%);
	font-size: 50px; opacity: .5; text-transform: uppercase; text-align: center; margin-top: -70px;
}
#main .logo{margin: auto; width: 35px; height: 38px; animation: rotate 5s linear infinite;}
#main .dankypanky{margin: auto; margin-top: 20px; width: 130px; border-bottom: 4px solid #fff; margin-bottom: 12px; padding-bottom: 2px;}
#main .dankypanky div{display: inline-block;}
#main .dankypanky .rotate{background: url(/_images/d.png) no-repeat; width: 17px; height: 29px; background-size: contain; animation: rotate 5s linear infinite;}
#main .dankypanky .stand{background: url(/_images/anky.png) no-repeat; width: 90px; height: 30px; background-size: contain; margin-left: -4px;}
#main .tagline{font-size: 14px;}



.home_services{
	background: #1b457e; position: relative; margin-bottom: -10px; 
	/*padding-bottom: 100px;*/ /*box-shadow: 0px 100px 30px #cddc394a;*/
	box-shadow: 0px 11px 10px #0000002e;
}
.home_services .colorb{color: #9DD0FF;}

.home_dictionary{background: #fff; color: #000; padding: 100px 0;}







.bubble_wrapper .bubble{background-image: url(/_images/home/logos.png?v1.3); border: 5px solid #fff;}






/*
============== ============== ============== 
============== SIMPLE ZOOMING STARS
============== ============== ============== 
#game:before{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	height: 1px;
	width: 1px;
	background-color: #fff;
	border-radius: 50%;
  box-shadow: 24vw 9vh 1px 0px #fff,12vw -24vh 0px 1px #fff,-45vw -22vh 0px 0px #fff,-37vw -40vh 0px 1px #fff,29vw 19vh 0px 1px #fff,4vw -8vh 0px 1px #fff,-5vw 21vh 1px 1px #fff,-27vw 26vh 1px 1px #fff,-47vw -3vh 1px 1px #fff,-28vw -30vh 0px 1px #fff,-43vw -27vh 0px 1px #fff,4vw 22vh 1px 1px #fff,36vw 23vh 0px 0px #fff,-21vw 24vh 1px 1px #fff,-16vw 2vh 1px 0px #fff,-16vw -6vh 0px 0px #fff,5vw 26vh 0px 0px #fff,-34vw 41vh 0px 0px #fff,1vw 42vh 1px 1px #fff,11vw -13vh 1px 1px #fff,48vw -8vh 1px 0px #fff,22vw -15vh 0px 0px #fff,45vw 49vh 0px 0px #fff,43vw -27vh 1px 1px #fff,20vw -2vh 0px 0px #fff,8vw 22vh 0px 1px #fff,39vw 48vh 1px 1px #fff,-21vw -11vh 0px 1px #fff,-40vw 45vh 0px 1px #fff,11vw -30vh 1px 0px #fff,26vw 30vh 1px 0px #fff,45vw -29vh 0px 1px #fff,-2vw 18vh 0px 0px #fff,-29vw -45vh 1px 0px #fff,-7vw -27vh 1px 1px #fff,42vw 24vh 0px 0px #fff,45vw -48vh 1px 0px #fff,-36vw -18vh 0px 0px #fff,-44vw 13vh 0px 1px #fff,36vw 16vh 0px 1px #fff,40vw 24vh 0px 0px #fff,18vw 11vh 0px 0px #fff,-15vw -23vh 1px 0px #fff,-24vw 48vh 0px 1px #fff,27vw -45vh 1px 0px #fff,-2vw -24vh 0px 1px #fff,-15vw -28vh 0px 0px #fff,-43vw 13vh 1px 0px #fff,7vw 27vh 1px 0px #fff,47vw 5vh 0px 0px #fff,-45vw 15vh 1px 1px #fff,-5vw -28vh 0px 1px #fff,38vw 25vh 1px 1px #fff,-39vw -1vh 1px 0px #fff,5vw 0vh 1px 0px #fff,49vw 13vh 0px 0px #fff,48vw 10vh 0px 1px #fff,19vw -28vh 0px 0px #fff,4vw 7vh 0px 0px #fff,21vw 21vh 1px 1px #fff,-15vw -15vh 0px 1px #fff,-6vw -42vh 1px 0px #fff,-15vw 48vh 1px 1px #fff,-23vw 25vh 1px 1px #fff,-48vw 25vh 0px 1px #fff,-31vw -19vh 0px 1px #fff,4vw 37vh 1px 1px #fff,-43vw 28vh 0px 0px #fff,3vw -25vh 0px 1px #fff,-39vw 14vh 0px 1px #fff,-40vw 31vh 0px 1px #fff,35vw -36vh 1px 1px #fff,16vw 49vh 0px 0px #fff,6vw 39vh 0px 0px #fff,3vw -35vh 0px 1px #fff,-44vw -2vh 1px 0px #fff,-6vw 21vh 1px 0px #fff,48vw 9vh 1px 1px #fff,-43vw 30vh 1px 1px #fff,29vw -12vh 1px 1px #fff,-48vw 13vh 1px 0px #fff,-42vw 32vh 1px 1px #fff,34vw 15vh 1px 1px #fff,29vw -37vh 1px 1px #fff,28vw 2vh 0px 0px #fff;
  animation: zoom 16s alternate infinite; 
}

@keyframes zoom {
	0%{
		transform: scale(1);
	}
	100%{
		transform: scale(1.5);
	}
} 
*/


/*
============== ============== ============== 
============== A MORE COMPLEX ZOOMING STARS
============== ============== ============== 
*/
#space {z-index: -1; width: 100%; height: 100%; animation-name: starField; animation-duration: 30s; animation-iteration-count: infinite; animation-delay: 0s; animation-timing-function: linear;}
@keyframes starField{
  from{filter: hue-rotate(0deg);}
  to{filter: hue-rotate(360deg);}
}

#space,
.stars{overflow: hidden; position: absolute; top: 0; bottom: 0; left: 0; right: 0;}
.stars{
	background-image: radial-gradient(2px 2px at 20px 30px, #eee, rgba(0, 0, 0, 0)), radial-gradient(2px 2px at 40px 70px, #fff, rgba(0, 0, 0, 0)), radial-gradient(2px 2px at 50px 160px, #ddd, rgba(0, 0, 0, 0)), radial-gradient(2px 2px at 90px 40px, #fff, rgba(0, 0, 0, 0)), radial-gradient(2px 2px at 130px 80px, #fff, rgba(0, 0, 0, 0)), radial-gradient(2px 2px at 160px 120px, #ddd, rgba(0, 0, 0, 0));
	background-repeat: repeat; background-size: 200px 200px; animation: starZoom 5s infinite; opacity: 0;
}
.stars:nth-child(1){background-position: 50% 50%; animation-delay: 0s;}
.stars:nth-child(2){background-position: 20% 60%; animation-delay: 1s;}
.stars:nth-child(3){background-position: -20% -30%; animation-delay: 2s;}
.stars:nth-child(4){background-position: 40% -80%; animation-delay: 3s;}
.stars:nth-child(5){background-position: -20% 30%; animation-delay: 4s;}
@keyframes starZoom{
  0%{opacity: 0; transform: scale(0.5); animation-timing-function: ease-in;}
  85%{opacity: 1; transform: scale(2.8); animation-timing-function: linear;}
  100%{opacity: 0; transform: scale(3.5);}
}





















.pyramid{
	/* 	position: absolute; top: 10%;  */
	float: right; margin: 30px 0 150px 130px; shape-outside: inset(1% round 50%);
	width: 200px; height: 200px; transform-style: preserve-3d; animation: pyramidanimate 4s linear infinite;
}
@keyframes pyramidanimate{
	0%{transform: rotateX(-30deg) rotateY(0deg);}
	100%{transform: rotateX(-30deg) rotateY(360deg);}
}

.pyramid div{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform-style: preserve-3d;}
.pyramid div span{
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(#003911, var(--pyramid-color));
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	transform: rotateY(calc(90deg * var(--i))) translateZ(99px) rotateX(30deg); transform-origin: bottom;
}
.pyramid .glow{
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--pyramid-color-bg);	
	transform: rotateX(90deg) translateZ(-150px);
	filter: blur(20px); box-shadow: 0 0 500px var(--pyramid-color);
}




.glowing_ring{
	float: right; margin: 50px; shape-outside: inset(1% round 50%);
	position: relative; height: 300px; width: 300px;
}
.glowing_ring .outer-ring{
	position: absolute; left: calc(50% - 150px); height: 100%; width: 100%; border-radius: 50%;
	background-image: linear-gradient(135deg, #FEED07 0%, #FE6A50 5%, #ED00AA 15%, #2FE3FE 50%, #8900FF 100%);
	animation-duration: 2s; animation-name: glowing_ring_rotate;	animation-iteration-count: infinite;
}
.glowing_ring .inner-ring{
	position: absolute; margin-top: 10px; left: calc(50% - 140px); height: calc(100% - 20px); width: calc(100% - 20px); border-radius: 50%;
/* 				background-image: linear-gradient(0deg, #36295e, #1c1045); */
	background: #1b467e;
}

@keyframes glowing_ring_rotate{
	0%{transform: rotate(0deg);}
	100%{transform: rotate(360deg);}
}





.rocket_wrapper{position: relative; float: right; shape-outside: inset(1% round 50%); width: 180px; height: 580px; margin: 150px; margin-top: 0; margin-right: 0;}
.rocket{position: absolute; top: 20%; width: 80px; left: calc(50% - 60px);}
.rocket .rocket-body{
	width: 80px; left: calc(50% - 50px); 
	animation: rocketbounce 0.5s infinite;
}
.rocket .rocket-body .body{
	background-color: #dadada; height: 180px; left: calc(50% - 50px); 
	border-top-right-radius: 100%; border-top-left-radius: 100%; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; border-top: 5px solid #f5f5f5;
}
.rocket .rocket-body:before{content: ""; position: absolute; left: calc(50% - 24px); width: 48px; height: 13px; background-color: #554842; bottom: -13px; border-bottom-right-radius: 60%; border-bottom-left-radius: 60%;}
.rocket .window{position: absolute; width: 40px; height: 40px; border-radius: 100%; background-color: #a75248; left: calc(50% - 25px); top: 40px; border: 5px solid #b4b2b2;}
.rocket .fin{position: absolute; z-index: -100; height: 55px; width: 50px; background-color: #a75248;}
.rocket .fin-left{left: -30px; top: calc(100% - 55px); border-top-left-radius: 80%; border-bottom-left-radius: 20%;}
.rocket .fin-right{right: -30px; top: calc(100% - 55px); border-top-right-radius: 80%; border-bottom-right-radius: 20%;}
.rocket .exhaust-flame{
	position: absolute; top: 90%; width: 28px; background: linear-gradient(to bottom, transparent 10%, #f5f5f5 100%); height: 150px; left: calc(50% - 14px); 
	animation: rocketexhaust 0.2s infinite;
}
.rocket .exhaust-fumes li{width: 60px; height: 60px; background-color: #adadad; list-style: none; position: absolute; border-radius: 100%;}
.rocket .exhaust-fumes li:first-child{width: 200px; height: 200px; bottom: -300px; animation: rocketfumes .7s infinite;}
.rocket .exhaust-fumes li:nth-child(2){width: 150px; height: 150px; left: -120px; top: 260px; animation: rocketfumes 1.5s infinite;}
.rocket .exhaust-fumes li:nth-child(3){width: 120px; height: 120px; left: -40px; top: 330px; animation: rocketfumes .2s .5s infinite;}
.rocket .exhaust-fumes li:nth-child(4){width: 100px; height: 100px; left: -170px; animation: rocketfumes .2s .5s infinite; top: 380px; display: none;}
.rocket .exhaust-fumes li:nth-child(5){width: 130px; height: 130px; left: -120px; top: 350px; animation: rocketfumes .5s infinite;}
.rocket .exhaust-fumes li:nth-child(6){width: 200px; height: 200px; left: -60px; top: 280px; animation: rocketfumes2 .4s infinite; background-color: #f5f5f5;}
.rocket .exhaust-fumes li:nth-child(7){width: 100px; height: 100px; left: -100px; top: 320px; animation: rocketfumes2 .6s infinite; background-color: #f5f5f5;}
.rocket .exhaust-fumes li:nth-child(8){width: 110px; height: 110px; left: 70px; top: 340px; animation: rocketfumes2 .5s infinite; background-color: #f5f5f5;}
.rocket .exhaust-fumes li:nth-child(9){width: 90px; height: 90px; left: 200px; top: 380px; animation: rocketfumes .5s infinite; display: none;}
.star li{list-style: none; position: absolute;}
.star li:before, 
.star li:after{content: ""; position: absolute; background-color: #f5f5f5;}
.star li:before{width: 10px; height: 2px; border-radius: 50%;}
.star li:after{height: 8px; width: 2px; left: 4px; top: -3px;}
.star li:first-child{top: -30px; left: -210px; animation: rockettwinkle 0.4s infinite;}
.star li:nth-child(2){top: 0; left: 60px; animation: rockettwinkle 0.5s infinite;}
.star li:nth-child(2):before{height: 1px; width: 5px;}
.star li:nth-child(2):after{width: 1px; height: 5px; top: -2px; left: 2px;}
.star li:nth-child(3){left: 120px; top: 220px; animation: rockettwinkle 1s infinite;}
.star li:nth-child(4){left: -100px; top: 200px; animation: rockettwinkle 0.5s ease infinite;}
.star li:nth-child(5){left: 170px; top: 100px; animation: rockettwinkle 0.4s ease infinite;}
.star li:nth-child(6){top: 87px; left: -79px; animation: rockettwinkle 0.2s infinite;}
.star li:nth-child(6):before{height: 1px; width: 5px;}
.star li:nth-child(6):after{width: 1px; height: 5px; top: -2px; left: 2px;}

@keyframes rocketfumes{
	50%{transform: scale(1.5); background-color: transparent;}
	51%{transform: scale(0.8);}
	100%{background-color: #adadad; transform: scale(1);}
}
@keyframes rocketbounce{
	0% {transform: translate3d(0px, 0px, 0);}
	50%{transform: translate3d(0px, -4px, 0);}
	100%{transform: translate3d(0px, 0px, 0);}
}
@keyframes rocketexhaust{
	0%{background: linear-gradient(to bottom, transparent 10%, #f5f5f5 100%);}
	50%{background: linear-gradient(to bottom, transparent 8%, #f5f5f5 100%);}
	75%{background: linear-gradient(to bottom, transparent 12%, #f5f5f5 100%);}
}
@keyframes rocketfumes2{
	50%{transform: scale(1.1);}
}
@keyframes rockettwinkle{
	80%{transform: scale(1.1); opacity: 0.7;}
}