/* POPUP ELEMENT */
    #popupCtr {
        position: fixed;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        width: 100vw;
        background: #aaaaaa88;
        visibility: hidden;
        opacity: 0;
        transition: opacity 0.3s;
        z-index: 10;
    }
    .popup {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 1rem;
        height: min(500px, 45vh);
        width: min(800px, 80vw);
        padding: var(--gutter);
        background: var(--colorBackground);
    }
    #popupButtons1, #popupButtons2 {
        display: none;
    }
    #popupCtr button {
        width: 5rem;
        padding: 0 0.5rem;
        margin: 0 0.5rem;
        border: 0.1rem solid var(--colorFade);
    }
/* USER ALERT MESSAGE */
    .resMsg {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 100vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 0 var(--gutter);
        background: var(--colorBackground);
        z-index: 10;
    }
    .resMsg h2 {
        text-align: center;
    }
/* FULLSCREEN */
    .fullscreen {
        display: none;
        align-items: center;
        justify-content: center;
        height: 100vh;
        height: 100lvh;
        width: 100vw;
    }
    .fullscreen:fullscreen {
        touch-action: pinch-zoom;
        background-color: #fff;
        overflow: auto;
    }
    .fullscreen > .artCtr {
        height: 100%;
        width: auto;
        max-height: 800px;
    }
    
/* ROTATE MOBILE DEVICE */
@media screen and (max-height: 480px), (min-aspect-ratio: 5/4) and (max-width: 1023px) {  /* NOTHING CAN BE LANDSCAPE UNTIL 1024 WIDTH */
    nav, main {
        display: none;
    }
    body {
        background-image: url("/assets/images/phone.svg");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100px;
    }
    .fullscreen {
        display: flex;
    }
}