h1 {color:blue;}
body{height:5000px;}

#gate1a{
  background-color:yellow;
  height:73px;
  width:15px;
  position:fixed; 
  border: 2px solid black;
  border-radius:1em;
  left:16em;
  top:23em;
}
#gate1b{
  background-color:yellow;
  height:73px;
  width:15px;
  position:fixed;
  border: 2px solid black;
  border-radius:1em;
  left:24em;
  top:23em;
}
#gate2a{
  background-color:red;
  height:25px;
  width:25px;
  position:fixed;
  aspect-ratio: 1/cos(30deg);
  clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
  left:22em;
  top:13em;
}
#gate2b{
  background-color:red;
  height:25px;
  width:25px;
  position:fixed;
  aspect-ratio: 1/cos(30deg);
  clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
  left:28em;
  top:13em;
}
#gate3a{
  background-color:green;
  height:25px;
  width:15px;
  position:fixed;
  left:5em;
  top:41em;
}
#gate3b{
  background-color:green;
  height:25px;
  width:15px;
  position:fixed;
  left:13em;
  top:41em;
}
#apex{
  background-color:red;
  height:10px;
  width:110px;
  position:fixed;
  left:17em;
  top:27em;
}
#fox1 {
  height:20px;
  width: 20px;
  animation: leftlift 10s infinite;
  position: fixed;
}
#fox2 {
  height:20px;
  width: 20px;
  animation: leftlift 16s infinite;
  position: fixed;
}
#fox3 {
  height:20px;
  width: 20px;
  animation: leftlift 19s infinite;
  position: fixed;
}
#nav {
  background-color:#e09237;
  font-size:30px;
  padding:0.5em;
  text-shadow:3px 1px 2px #f02070f1;
  box-shadow:5px 3px 4px #f02070f1;
  width:100%;
  border:3px solid black;
  text-align:center;
  position: sticky;
  top:5px;
  z-index:1;
}
#paws{
  background-color: #f02070f1;
  padding: 0.5em;
  display:inline-block;
  border: 2px solid black;
  border-radius:1em;
  position:fixed;
  right:10px;
  bottom:50px;
  z-index:1;
 
}
#gate1a_2{
  background-color:yellow;
  height:73px;
  width:15px;
  position:fixed;
  left:47em;
  top:23em;
}
#gate1b_2{
  background-color:yellow;
  height:73px;
  width:15px;
  position:fixed;
  border: 2px solid black;
  border-radius:1em;
  left:55em;
  top:23em;
}
#gate2a_2{
  background-color:red;
  height:25px;
  width:25px;
  position:fixed;
  aspect-ratio: 1/cos(30deg);
  clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
  left:72em;
  top:19em;
}
#gate2b_2{
  background-color:red;
  height:25px;
  width:25px;
  position:fixed;
  aspect-ratio: 1/cos(30deg);
  clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
  left:78em;
  top:19em;
}
#gate3a_2{
  background-color:green;
  height:25px;
  width:15px;
  position:fixed;
  left:54em;
  top:41em;
}
#gate3b_2{
  background-color:green;
  height:25px;
  width:15px;
  position:fixed;
  left:61em;
  top:41em;
}
#apex_2{
  background-color:red;
  height:10px;
  width:110px;
  position:fixed;
  left:48em;
  top:27em;
}
#fox1_2 {
  height:20px;
  width: 20px;
  position: fixed;
  animation: rightlift 10s infinite;
}
#fox2_2 {
  height:20px;
  width:20px;
  position: fixed;
  animation: rightlift 16s infinite;
}
#fox3_2 {
  height:20px;
  width: 20px;
  position: fixed;
  animation: rightlift 19s infinite;
}
#gradient{
  background-color:#e09237;
  height:100%;
  width:100%;
  padding:0.5em;
  text-align:center;
  margin-bottom:1em;
  position: sticky;
  top:0;
/*
* Created with https://www.css-gradient.com
* Gradient link: https://www.css-gradient.com/?c1=ffffff&c2=2a4cff&gt=r&gd=dbb
*/
background: #FFFFFF;
background: radial-gradient(at center top, #FFFFFF, #2A4CFF);
}
.bunny,.wait{
  border: 2px solid black;
  border-radius:1em;
}
.fox{
  border: 2px solid black;
}
  
@-webkit-keyframes leftlift {
0%{
  left:80em;
  top: 0;
  background-color: blue;
	transform:scale(.5);
}
25%{
	left:25em;
	top: 13em;
  background-color: lightblue;
	transform: scale(2);
}
50%{
	left:311px;
	top: 387px;
  background-color: darkblue;
	transform: scale(3);
	}
 
75%{
	left:-50px;
  top:1000px;
  background-color: lightblue;
	transform: scale(.5);
}
100%{
  left:-50px;
  top:3000px;
  background-color: #FF000011;
}
}
@-webkit-keyframes rightlift {
0%{
  left:1em;
  top: 0;
  background-color: pink;
	transform:scale(.5);
}
25%{
	left:75em;
	top: 300px;
  background-color: pink;
	transform: scale(2);
}
50%{
	left:50em;
	top: 390px;
  background-color: purple;
	transform: scale(3);
}
  
75%{
	left:1000px;
  top:800px;
  background-color: pink;
	transform: scale(.5);
}
100%{
  left:1000px;
  top:3000px;
  background-color: #FF000011;
}
}