﻿

.PopupView {
    position: fixed;
    top: 70%;
    left: 50%;
    width:80%;
    transform: translate(-50%, -70%);
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
    text-align:center;
    background: var(--ThemeColor);
    color: var(--FontOppositeColor);
    padding: 20px 15px;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    z-index: var(--PopupDepth);
}

@keyframes flipIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.show {
    display: block;
    animation: flipIn 0.6s ease-out forwards;
}