*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;width:100%}#flex_simu_vid{display:flex;height:100vh}#simulator{flex:1;height:100%}#simulator_canvas{width:100%;height:100%;display:block;background-color:#444}#video_player_div{display:flex;max-width:50%;background-color:#000;height:100%}#video_player_div video{max-height:100%;max-width:100%}.controls{position:fixed;bottom:5%;left:50%;transform:translateY(-50%) translate(-50%);width:70%;min-width:10rem;max-width:30rem;height:7%;min-height:2rem;max-height:3rem;display:flex;justify-content:space-evenly;align-items:center;background-color:#f0f0f03b;border-radius:1rem}.play-button{display:flex;justify-content:center;align-items:center;height:2rem;max-width:2rem}.slider{flex:.8;height:1rem}.icon{height:100%}@media screen and (max-width: 600px){.play-button,.slider{width:50%}}#wait_screen{top:0;left:0;width:100%;height:100%;position:absolute;backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center}#wait_screen div{flex-direction:column;background-color:#000;border-radius:5px}#wait_screen p{color:#fff;padding:.5rem;margin:0;user-select:none}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade_out{animation:fadeOut .5s forwards}.fade_in{animation:fadeOut .5s backwards}