.overlay {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 !important;
    align-items: center;
    justify-content: center;
    border-radius: inherit;
    display: flex;
    position: fixed;
    transition: .3s cubic-bezier(.25,.8,.5,1),z-index 1ms;
    z-index: 5;

    &.overlay-absolute {
        position: absolute;
    }

    & .overlay-scrim {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: inherit;
        position: absolute;
        height: 100%;
        width: 100%;
        border-color: transparent;
        background-color: transparent;
        animation: animation-fadein ease 0.15s;
        -webkit-animation: animation-fadein ease 0.15s;
        -moz-animation: animation-fadein ease 0.15s;
        -o-animation: animation-fadein ease 0.15s;

        &.overlay-dark {
            border-color: var(--palette-overlay-dark);
            background-color: var(--palette-overlay-dark);
        }

        &.overlay-light {
            border-color: var(--palette-overlay-light);
            background-color: var(--palette-overlay-light);
        }
        &:hover {
            cursor: default;
        }
    }

    & .overlay-content {
        position: relative;
    }

    &.overlay-popover {
        z-index: var(--zindex-popover);
    }

    &.overlay-dialog {
        z-index: calc(var(--zindex-dialog) + 1);
    }

    &.overlay-drawer {
        z-index: calc(var(--zindex-appbar) + 1); //<-- Yes this is correct we want to display it on top of the Appbar
    }
}