@import "general.css";

/* Grid Format */
.grid-container{
    gap: var(--mb-2);
    width: 90%;
    transition: all .5s ease;
}

.grid-unity-open{
    display: grid;
    grid-template-columns: max-content 1fr;
}

.grid-unity-close{
    display: grid;
    grid-template-columns: 100% 0;
}

/* Unity Format */
#unity-container {
    width: 100%;
    height: 100%;
}

#unity-canvas {
    background: #231F20;
    width: 100%;
    max-width: 100vw;
    height: 100%;
    max-height: calc(100vh - var(--header-height) * 2);
}

#unity-loading-bar {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: none
}

#optics-logo {
    width: 300px;
    height: 300px;
    position: center;
    background: url("../resources/images/optics-logo.gif") no-repeat center
}

#unity-progress-bar-empty {
    width: 300px;
    height: 18px;
    margin-top: 20px;
    margin-left: 7px;
    position: center;
    background: url('../resources/images/progress-bar-empty-dark.png') no-repeat center
}

#unity-progress-bar-full {
    width: 0;
    height: 18px;
    margin-top: 20px;
    position: center;
    background: url('../resources/images/progress-bar-full-dark.png') no-repeat center
}

#unity-warning {
    position: absolute;
    left: 50%;
    top: 5%;
    transform: translate(-50%);
    background: white;
    padding: 10px;
    display: none
}