#operoModal{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,.65);
display:flex;
justify-content:center;
align-items:center;
opacity:0;
visibility:hidden;
transition:.3s;
z-index:999999;
}

#operoModal.active{
opacity:1;
visibility:visible;
}

.modal-box{

width:95%;
max-width:500px;

background:#fff;

border-radius:20px;

padding:30px;

position:relative;

animation:popup .35s;

}

@keyframes popup{

from{

transform:translateY(40px);

opacity:0;

}

to{

transform:translateY(0);

opacity:1;

}

}

.close-modal{

position:absolute;

left:20px;

top:20px;

cursor:pointer;

font-size:26px;

font-weight:bold;

}

.modal-title{

font-size:28px;

font-weight:bold;

margin-bottom:20px;

text-align:center;

}

.modal-sub{

text-align:center;

margin-bottom:25px;

color:#666;

}

.modal-input{

width:100%;

padding:15px;

margin-bottom:15px;

border:1px solid #ddd;

border-radius:10px;

font-size:15px;

outline:none;

}

.modal-input:focus{

border-color:#ff6a00;

}

.modal-btn{

width:100%;

padding:16px;

background:#ff6a00;

color:#fff;

font-size:16px;

border:none;

border-radius:12px;

cursor:pointer;

transition:.3s;

}

.modal-btn:hover{

background:#e95d00;

}

.modal-btn:disabled{

opacity:.6;

cursor:not-allowed;

}

.success{

display:none;

text-align:center;

font-size:20px;

padding:30px;

color:#16a34a;

}