HTML, BODY {
    height: 100% !important; 
    width: 100% !important; 
    height: 100vh !important; 
    width: 100vw !important; 
    margin:0 !important; 
    padding:
        env(safe-area-inset-top, 0px)
        env(safe-area-inset-right, 0px)
        env(safe-area-inset-bottom, 0px)
        env(safe-area-inset-left, 0px) !important;
    /* required to prevent rogue scrollbars */
    overflow: hidden !important; 
    /* cosmetic stuff: */
    background-color:#ffffff00 !important; 
    background-image: url("../img/body.gif") !important;
    background-size: cover !important;
}

.app-wrap {
    max-width: 100% !important;
    max-height: 96% !important;
    max-width: 100vw !important;
    max-height: 96vh !important;
    height: 96% !important; 
    width: 100% !important; 
    height: 96vh !important; 
    width: 100vw !important; 
    min-height: 96% !important; 
    min-width: 100% !important; 
    min-height: 96vh !important; 
    min-width: 100vw !important; 
    top:0 !important; 
    left:0 !important; 
    right:0 !important; 
    bottom:0 !important; 
    padding:
        env(safe-area-inset-top, 0px)
        env(safe-area-inset-right, 0px)
        env(safe-area-inset-bottom, 0px)
        env(safe-area-inset-left, 0px) !important;
    margin:0 !important; 
    position: fixed !important;
  /* if you want the content to scroll normally: */
    overflow: hidden !important; 
    /* cosmetic stuff: */
    background-color:#ffffff00 !important; 
    background-size: cover !important;
    flex-direction: column;
}

.player-bg {
    background-image: url("../img/bg.gif") !important;
    max-width: 100% !important;
    max-height: 100% !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    height: 100% !important; 
    width: 100% !important; 
    height: 100vh !important; 
    width: 100vw !important; 
    min-height: 100% !important; 
    min-width: 100% !important; 
    min-height: 100vh !important; 
    min-width: 100vw !important; 
    top:0 !important; 
    left:0 !important; 
    right:0 !important; 
    bottom:0 !important; 
    padding:0 !important; 
    margin:0 !important; 
    position:fixed !important; 
  /* if you want the content to scroll normally: */
    overflow: auto !important; 
    /* cosmetic stuff: */
    background-color:#ffffff00 !important; 
    background-size: cover !important;
    flex-direction: column;
}

.player-layout {
    color: floralwhite !important;
}

.fx-slide-left {
    color: #00ffeb !important;
}

.text-small {
    color: #ff00e4 !important;
}

.text-faded {
    color: #10ff00 !important;
}

.player-layout .player-header>h2 {
    color: floralwhite !important;
}

@media (pointer:none), (pointer:coarse) {
    .player-wrap .player-canvas {
        visibility: hidden;
    }
}
