.sceneContainer{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    visibility: hidden;
}

.visible{
    visibility: visible;
}

.scene{
    --presenta-sw: calc(var(--presenta-w) / var(--presenta-p) / var(--presenta-fz));
    --presenta-sh: calc(var(--presenta-h) / var(--presenta-p) / var(--presenta-fz));
    --presenta-scal: calc(var(--presenta-pw) / var(--presenta-p) / var(--presenta-pw) / var(--presenta-fz));
    
    width: var(--presenta-sw);
    height: var(--presenta-sh);
    font-family: serif;
    /* user-select: none; */
    --sceneColorBack: var(--colorBack);
}


.promise{
    visibility: hidden;
}

.wrapper{
    width: var(--presenta-w);
    height: var(--presenta-h);
    transform: scale(1);
    transform: scale(var(--presenta-scal));
    transform-origin: top left;
    /* overflow: hidden; */

    padding: var(--scenePadding);
    background: var(--sceneColorBack);
}



.content{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    /* overflow: hidden; */
}



.viewport{
    width: 100%;
    height: 100%;
    position: relative;
    flex:1;
    overflow: hidden;
    
    display: flex;
    flex-direction: row;
}
/* .viewport > div{
    height: 100%;
} */