body { padding: 0; margin: 0; background-color: black; overflow: hidden }
#unity-container { position: absolute; }
/*#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }*/
#unity-container.unity-mobile { width: 100%; height: 100% }
#unity-canvas { background: url('../img/loading.jpg'); background-position: center; background-repeat: no-repeat; background-size: cover; }
.unity-mobile #unity-canvas { width: 100%; height: 100% }
#unity-loading-bar { position: absolute; left: 50%; top: 55%; transform: translate(-50%, -50%); display: none}
#unity-progress-bar-empty { width: 387px; height: 16px; background: url('../img/loading_empty_small.png'); background-repeat: no-repeat}
#unity-progress-bar-full {width: 0%; height: 100%; background: url('../img/loading_full_small.png'); background-repeat: no-repeat}
#unity-footer { position: relative; }
.unity-mobile #unity-footer { display: none }
#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }
/*#intro-video-container, #outro-video-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) }
.video-container { width: 100%; border-radius: 8px; margin: 0 auto; position: relative; display: flex; flex-direction: column; justify-content: center; box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.4); }
.video-wrapper { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }*/
video {  width: 100%; height: 100%; }
#flipbook-viewer { z-index: 20; position: absolute; top: 0%; left: 0%; right: 0%; bottom: 0%; }
#video-viewer { z-index: 20; position: absolute; top: 0%; left: 0%; right: 0%; bottom: 0%; background-color: black; }