.Overlay {
    position:fixed;
    top:0; left:0;
    width:100%;
    display:none;
    height:100%;
    opacity:0.8;
    background-color:var(--bg-light);
    z-index:901;
}
span.popupLauncher{
    position:relative;
    /* z-index:1000; */
}
@keyframes clipFade {
  from {
    opacity: 0; clip-path: inset(0 0 100% 0); 
  }
  to {
    opacity: 1; clip-path: inset(0 0 0 0);
  }
}

.popup, .bigPopup {
    animation: clipFade 0.4s ease-out forwards;
    z-index:1000;
    background-color:var(--card-bg);
    padding:2rem;
    border: 2px solid var(--accent-color);
    text-align:left;
    max-height: calc(100vh - 5em);
    overflow:auto;
}
.popup {
    position:fixed;
    height:96vh;
    width:70vw;
    left:15vw;
    top:2vh;
    display:block;
}


.bigPopup {
    position:fixed;
    width:70vw;
    left:15vw;
    top:1em;
}
.popup.right{
}
.popup.center{
}