.obscure {
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  content: '';
  background: rgba(9, 9, 9, 0.67);
  z-index: 1;
}

.popup {
  width: 50% ;
padding: 10px 30px;
transform: translate(-50%, -50%) scale(0.5);
position: absolute;
top: 50%;
left: 50%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 5px;
background: #fff;
z-index: 3;
}
.popup div.popup-content{
  height: 500px ;
  overflow-y: scroll; 
}
.popup div.popup-content p{
  margin: 0 ;
}
.popup .closeBtn {
color: #fff;

}
.popup .div.popup-footer{
  
}

.popup hr{
  border-top: 1px solid #747777;
}

.animationOpen, .animationClose {
  display: block;
  -webkit-transition: all ease .2s;
  transition: all ease .2s;
}

.animationOpen {
  -webkit-transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.animationClose {
	opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(.5);
  transform: translate(-50%, -50%) scale(.5);
}

@media screen and (max-width: 600px ) {
obscure h1 {
margin-bottom: 10px;
font-size: 22px;
}

obscure h2 {
font-size: 15px;
line-height: 15px;
margin-bottom: 30px;
}
.popup{width: 80%;
padding: 10px 5%;}
}