/* ==========================================
   Remon Code Popup
========================================== */

#popupOverlay{

position:fixed;
top:0;
left:0;
width:100%;
height:100%;

display:none;

justify-content:center;
align-items:center;

background:rgba(0,0,0,.55);

backdrop-filter:blur(6px);
-webkit-backdrop-filter:blur(6px);

z-index:999999;

padding:15px;

box-sizing:border-box;

}

#popupBox{

width:90%;
max-width:320px;

background:#fff;

border-radius:18px;

overflow:hidden;

box-shadow:0 15px 40px rgba(0,0,0,.30);

animation:popup .25s ease;

font-family:'Cairo',sans-serif;

}

.popupHeader{

background:linear-gradient(135deg,#0d47a1,#1976d2);

padding:16px;

text-align:center;

color:#fff;

}

.popupHeader img{

width:55px;
height:55px;

background:#fff;

border-radius:50%;

padding:6px;

margin-bottom:8px;

}

.popupHeader h2{

margin:0;

font-size:19px;

}

.popupBody{

padding:18px;

text-align:center;

line-height:1.9;

font-size:14px;

color:#555;

}

.popupBody h3{

margin:0 0 10px;

color:#0d47a1;

font-size:18px;

}

.popupDev{

margin-top:18px;

padding-top:15px;

border-top:1px solid #eee;

}

.popupDev b{

display:block;

font-size:18px;

color:#0d47a1;

margin-bottom:5px;

}

.popupPray{

margin-top:12px;

font-size:15px;

font-weight:bold;

color:#1565c0;

}

.popupFooter{

padding:15px;

background:#fafafa;

}

.popupBtn{

width:100%;

border:none;

background:#0d47a1;

color:#fff;

padding:12px;

border-radius:10px;

font-size:15px;

font-family:'Cairo',sans-serif;

cursor:pointer;

}

.popupBtn:active{

transform:scale(.98);

}

@keyframes popup{

from{

opacity:0;
transform:scale(.9);

}

to{

opacity:1;
transform:scale(1);

}

}