.Overlay {
    position:fixed;
    top:0; left:0;
    width:100%;
    display:none;
    height:100%;
    opacity:0.8;
    background-color:var(--bg-light);
    z-index:100;
}
span.popupLauncher{
    position:relative;
    display:inline-block;
    /* 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:0px;
    border: 2px solid var(--accent-color);
    text-align:left;
    max-height: calc(100vh - 5em);
    overflow:auto;
}
.popup {
    position:absolute;
    width:19rem;
}
.bigPopup {
    position:fixed;
    width:70vw;
    left:15vw;
}
.popup.right{
    margin-left:-19rem;
}
.popup.center{
    margin-left:-9.5rem;
}