.vmodal{
}

.vmodal.open .modal-overlay,
.vmodal.open .modal-window{
   opacity: 1;
   visibility: visible;
}

.modal-overlay, .modal-window{
   opacity: 0;
   z-index: 50;
   visibility: hidden;
}

.modal-overlay{
   overflow-y: auto;
   content: '';
   position: fixed;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background: rgba(0,0,0,0.7);
   cursor: pointer;
   transition: opacity 0.6s, visibility 0.6s;
}

.modal-window{
   cursor: default;
   padding: 20px 15px;
   border-radius: 5px;
   background: #fff;
   position: relative;
   z-index: 2;
   transition: 0.6s;
   transform: translate(0, -50%);
}
.vmodal.open .modal-window{
   transform: translate(0, 0%);
}

.modal-header{
   display: flex;
   justify-content: space-between;
   align-items: center;
}

.modal-header span:first-child{
   margin-right: 10px;
}

.modal-body{
   margin: 20px 0;
   font-size: 21px;
   line-height: 120%;
}

.modal-title{
   font-size: 20px;
   font-weight: 600;
}
.modal-close{
   cursor: pointer;
}
.modal-footer{
   text-align: right;
   border-top: #eee;
}

.modal-footer button{
   font-size: 17px;
   font-weight: 500;
}

.myModal .modal-window {
   max-width: 80%;
   margin: 15px auto 0;
}

@media(max-width: 768px){
   .myModal .modal-window{
      max-width: 100%;
   }
}