
/* Core styles */

.page-overlay {
    background-color: rgba(255,255,255,0.7);
    backdrop-filter: blur(2px) brightness(120%) saturate(0%);
}

.page-overlay .overlay-content {
    position: relative;
    padding: 1em 0.5em;
    max-width: 1100px;

    margin: 0 8vw;
    padding: 2em 3em;

    font-size: 1.2em;
}
@media screen and (max-width:991px) {
    .page-overlay .overlay-content {
    }
}
@media screen and (max-width:767px) {
    .page-overlay .overlay-content {
        margin: 0;
        padding: 1em 2em;
    }
}
@media screen and (max-width:479px) {
    .page-overlay .overlay-content {
        padding: 0.5em;
    }
}

/* Purely a UI hint as clicking anywhere will do. */
.page-overlay .back-button {
    width: 1.6em;
    height: 1.6em;
    margin-top: 2em;

    align-self: flex-end;

    opacity: 0; /* Becoming visible if parent has .overlay-visible (see below) */

    background-color: #444;
}
