#popup-container{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.7);
    display: block;
    z-index: 9999;
    transition: backdrop-filter 1s ease;
    backdrop-filter: blur(3px);
}

    #popup-container:has(.close-button:hover){
        backdrop-filter: blur(0);
    }

    #popup-container .close-button{
        display: block;
        position: absolute;
        font-family: 'Montserrat-Bold', sans-serif;
        font-size: 50pt;
        line-height: 1;
        right: 20px;
        top: 20px;
        cursor: pointer;
        opacity: .7;
        color: white;
        transition: transform .5s ease;
    }

    #popup-container .close-button:hover{
            opacity: 1;
            transform: rotate(90deg);
        }

    #popup-container > .full-image{
        position: absolute;
        display: block;
        width: 80%;
        height: 80%;
        top: 10%;
        left: 10%;
        -o-object-fit: contain;
           object-fit: contain;
        -o-object-position: center;
           object-position: center;
    }

    #popup-container #modal{
        position: absolute;

        min-width: 40%;
        max-width: 50%;
    }

    @media (max-width: 670px) {
            #popup-container #modal {
                max-width: 90%;
                min-width: 80%;
            }
        }

    #popup-container #modal{

        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
}

#notify{
    display: block;
    background-color: black;
    padding: var(--spacing) calc(var(--spacing) + 20px) var(--spacing) var(--spacing);
    position: fixed;
    bottom: var(--spacing);
    right: var(--spacing);
    border-radius: var(--radius);
    color: white;
    max-width: 50%;
    opacity: 0;
    z-index: 99999;
}

@media (max-width: 670px) {
        #notify {
            max-width: calc(100% - var(--spacing) * 2);
        }
    }

#notify a{
        color:white !important;
        font-family: 'Montserrat-Bold', sans-serif !important;
    }

#notify .close-button{
        display: block;
        position: absolute;
        font-family: 'Montserrat-Bold', sans-serif;
        font-size: 20pt;
        line-height: .78;
        right: var(--spacing);
        top: var(--spacing);
        cursor: pointer;
        opacity: .5;
        color: white;
        transition: transform .5s ease;
    }

#notify .close-button:hover{
            opacity: 1;
            transform: rotate(90deg);
        }