.popup .content{
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%) scale(0);
  background: linear-gradient(90deg, rgb(215, 212, 255) 19%, rgb(240, 191, 217) 100%);
  width:350px;
  height:550px;
  z-index:2;
  text-align:center;
  padding:20px;
  box-sizing:border-box;
  margin-left:500px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.popup .close-btn{
  position:absolute;
  right:20px;
  top:20px;
  width:30px;
  height:30px;
  background:#222;
  color:#fff;
  font-size:25px;
  font-weight:600;
  line-height:30px;
  text-align:center;
  border-radius:50%;
}
.popup.active .overlay{
  display:block;
}
.popup.active .content{
  transition:all 300ms ease-in-out;
  transform:translate(-50%,-50%) scale(1);
}
.pop_element{
  margin-left: 0;
}

@media (min-width: 360px) {
    .pop_element {
       margin-left:-46vh;
    }
}
@media (min-width: 375px) {
    .pop_element {
        margin-left: -50vh;
    }
}
@media (window.innerWidth) {
    .pop_element {
        margin-right: -60%;
    }
}

@media (min-width: 600px) {
    .pop_element {
        margin-left: 10vh;
    }
}