body {
    animation: fadeInAnimation ease 5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    overflow: hidden;
 
}


@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
     }
}


#main {
	/*background-image: url("/static/dji_fly_20220904_100740_263_1662311944143_photo_optimized.JPG"); no-repeat;
    background-size: cover;
    background-position: center;*/
    position:relative;
    background: black;
    overflow: hidden;
   z-index: 0;


}


a {font-family: Staatliches;
		font-size: 40px;
		color:white;
		 white-space: normal;
		 line-height: 68px;

		letter-spacing: 4px;
		text-decoration: none; margin: 30px;
		padding; 2px
		-webkit-transition: fill 0.25s, color 0.25s, oppacity 0.25s, stroke 0.25s;
	    -moz-transition: fill 0.25s, color 0.25s, oppacity 0.25s, stroke 0.25s;
	    transition: fill 0.25s, color 0.25s, oppacity 0.25s, stroke 0.25s;}
	
a:hover {color:slategray;}

#floater {
width: 100vw;
  height: 100vh;
  position: relative;
  top: 0;
  left: 0;
 margin: 0 auto; overflow: hidden; text-align: center;
}


div #floated{

width: 800px;
max-width: 80vw;

  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
z-index: 10;
}


#main iframe {
  width: 100vw;
  height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
  min-height: 100vh;
  min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}