/* ============================= */
/* POPUP OVERLAY */
/* ============================= */

.sbf-popup{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.75);
display:none;
z-index:999999 !important;
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
}

/* ============================= */
/* POPUP BOX */
/* ============================= */

.sbf-box{
background:white;
width:420px;
padding:40px;
border-radius:14px;
position:fixed;
top:50%;
left:50%;
transform:translate(-50%,-50%);
box-shadow:0 25px 80px rgba(0,0,0,0.25);
animation:sbfFade .35s ease;
z-index:9999999 !important;
}

/* ============================= */
/* ANIMATION */
/* ============================= */

@keyframes sbfFade{
from{
opacity:0;
transform:translate(-50%,-60%);
}
to{
opacity:1;
transform:translate(-50%,-50%);
}
}

/* ============================= */
/* HEADING UI */
/* ============================= */

.sbf-box h3{
    font-size: 24px;
    margin-bottom: 25px;
    font-weight: 600;
    color: #000000;
}

.sbf-subtext{
color:#666;
margin-bottom:25px;
font-size:14px;
line-height:1.5;
}

/* ============================= */
/* FORM */
/* ============================= */

.sbf-form input{
width:100%;
padding:14px;
margin-bottom:15px;
border:1px solid #ddd !important;
border-radius:8px;
outline:none;
transition:.3s;
font-size:14px;
}

.sbf-form input:focus{
border-color:#61BEC4;
box-shadow:0 0 0 2px rgba(97,190,196,0.15);
}

/* ============================= */
/* BUTTON STYLE GLOBAL */
/* ============================= */

.sbf-open,
.sbf-form button,
.sbf-redirect-btn{

padding:15px 30px;
background:#61BEC4;
color:white;
border:none;
border-radius:6px;
cursor:pointer;
transition:0.3s ease;
font-weight:500;
display:inline-block;
text-decoration:none;

}

.sbf-open:hover,
.sbf-form button:hover,
.sbf-redirect-btn:hover{

background:black;
color:white;

}

/* Submit Button Full Width */

.sbf-form button{
width:100%;
margin-top:5px;
background:#61bec4 !important
}

/* ============================= */
/* SUCCESS SECTION */
/* ============================= */

.sbf-success{
display:none;
text-align:center;
animation:sbfFade .35s ease;
}

.sbf-success h4{
color:#61BEC4;
margin-bottom:10px;
font-size:20px;
}

.sbf-small{
font-size:12px;
color:#888;
margin-top:10px;
}

/* ============================= */
/* CLOSE BUTTON */
/* ============================= */

.sbf-close{
position:absolute;
top:15px;
right:20px;
cursor:pointer;
font-size:22px;
transition:.3s;
color: black;
}

.sbf-close:hover{
transform:rotate(90deg);
}

/* ============================= */
/* PREVENT BACKGROUND SCROLL */
/* ============================= */

body.sbf-active{
overflow:hidden;
}

/* ============================= */
/* RESPONSIVE */
/* ============================= */

@media(max-width:480px){

.sbf-box{
width:90%;
padding:25px;
}

.sbf-box h3{
font-size:20px;
}

}