.popup {
    display: none;
    position: fixed;
    width: 100%;
    z-index: 99999999;
    background: #fff;
    left: 50%;
    top: 50%;
    max-width: 336px;
    transform: translate(-50%,-50%);
}
.active-popup:before{ content:""; position:fixed; left:0; top:0; background:rgba(0,0,0,0.5); width:100%; height:100%; z-index:9999999; }

.popup.active {
    display: block;
}
.popup .close-popup{width: 40px; height: 40px; border-radius: 50%; background: #f04e37; color: #fff; font-size: 20px; display: flex; align-items: center; justify-content: center;border: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: translate(50%, -50%);}