.body-ctr{
min-height:100vh;
filter: blur(0);

}

.blurred, .blurbox{
filter: blur(4px);
}

.alertx-ctr *{
box-sizing:border-box;
}

.alertx-ctr{
display: flex;
justify-content: center;
align-items: center;
position:absolute;
left:15px;
right:15px;
top:15px;
bottom:15px;
}


.alertx-notify .alertx-head, .alertx-notify .alertx-foot, .alertx-notify .alertx-bg{display:none;}


.alertx-bg{
position:fixed;
left:0;
right:0;
top:0;
bottom:0;
}

.alertx-border{
box-shadow:0 0 4px #000;
position:fixed;
max-width:400px;
min-width: 200px;
}

.alertx-out{
background-color:#fff;
font:12px verdana, sans-serif;
color:#333;
}

.alertx-head{
background-color:gray;
color:#fff;
padding:7px 15px;
font:18px arial, sans-serif;
}

.alertx-content{
padding:10px;
}

.alertx-foot{
padding:10px;
border-top:1px solid silver;
}

.alertx-foot:before, .alertx-foot:after, .alertx-content:before, .alertx-content:after{
content:' ';
display:block;
clear:both;
}


.alertx-btn{
background-color:#666;
color:#fff;
border:0;
padding:5px 10px;
cursor:pointer;
font-weight:bold;
opacity:1;
display:inline-block;
text-decoration:none;
}

.alertx-foot .alertx-btn{float:right;margin-left:10px;}

.alertx-btn:hover{opacity:0.6;}

.alertx-icon{
float: left;
width: 32px;
height: 32px;
background-image: url(../svg/info.svg);
margin-right: 10px;
}

.alertx-icon-info{background-image:url(../svg/info.svg)}
.alertx-icon-warning{background-image:url(../svg/warning.svg)}
.alertx-icon-success{background-image:url(../svg/success.svg)}
.alertx-icon-danger{background-image:url(../svg/danger.svg)}
.alertx-icon-question{background-image:url(../svg/question.svg)}
.alertx-icon-none{display:none}



/* simple theme */
.alertx-theme-simple .alertx-bg{
background-color:rgba(0,0,0,0.3);
background-image:url('../svg/stripes.svg');
background-size:8px;
}





/* end simple theme */



/* letter theme */
.alertx-theme-letter .alertx-border{
background-image:url(../images/retro-stripes.png);
padding:10px;
}

.alertx-theme-letter  .alertx-out{
background-color:#F6F7BD;
}

.alertx-theme-letter  .alertx-content{
background-color:#F6F7BD;
}

.alertx-theme-letter .alertx-head{
background-color:transparent;
color:maroon;
padding-top:15px;
text-align:center;
text-decoration:underline;
}

.alertx-theme-letter .alertx-bg{
background-color:rgb(170,51,51);
background-image:url('../svg/confetti-doodles.svg');
background-size:800px;
background-position:center center;
background-repeat:repeat;
}
/* letter theme ends */


/* glass theme */

.alertx-theme-glass .alertx-border{
background: rgba(209,231,254,0.7);
padding:15px;
border-radius:10px;
}

.alertx-theme-glass  .alertx-out{
border-radius:6px;
}

.alertx-theme-glass  .alertx-head{
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}

.alertx-theme-glass .alertx-bg{
background-color:rgba(255,255,255,0.4);
background-image:url('../svg/stripes.svg');
background-size:8px;
background-position:bottom center;
background-repeat:repeat;
}

/* glass theme ends */


/* dark theme */
.alertx-theme-dark .alertx-border{
background: rgba(0,0,0,0.7);
padding:15px;
border-radius:10px;
}

.alertx-theme-dark  .alertx-out{
border-radius:6px;
background-color:#aaa;
color:#000;
}

.alertx-theme-dark  .alertx-head{
border-top-left-radius: 6px;
border-top-right-radius: 6px;
color:#ddd;
}


.alertx-theme-dark .alertx-bg{
background-image:url('../svg/stripes.svg');
background-size:20px;
background-color:rgba(0,0,0,0.6);
}

/* dark theme ends */


/* neon theme */

.alertx-theme-neon .alertx-border{
background: #000;
padding:30px;
box-shadow:
0 0 6px #fff,
inset 0 0 6px #fff,
0 0 14px #f00,
inset 0 0 14px #f00; 
border: 2px solid #FFB0B0;
}

.alertx-theme-neon .alertx-out{
color: #fff;
box-shadow:
0 0 .5rem #fff,
inset 0 0 .5rem #fff,
0 0 2rem #08f,
inset 0 0 2rem #08f,
0 0 4rem #08f,
inset 0 0 4rem #08f; 
background:#000;
border: 2px solid #fff;
}

.alertx-theme-neon .alertx-head{
border-top-left-radius: 6px;
border-top-right-radius: 6px;
color:#FFF;
background-color:transparent;
padding:10px;
text-align:center;
border-bottom:1px solid #fff;
font:22px arial;
}


.alertx-theme-neon .alertx-bg{
background-color:rgba(0,0,0,0.8);
}

/* neon theme ends */

/* no animation */
[data-anim="alertx-anim-no-in"] .alertx-border, 
[data-anim="alertx-anim-no-out"] .alertx-border{ 
transition:none;
}
/* no animation ends */

/* fade animation */
[data-anim="alertx-anim-fade-in"] .alertx-border, 
[data-anim="alertx-anim-fade-out"] .alertx-border{ 
transition:opacity 0.5s;
}

[data-anim="alertx-anim-fade-in"] .alertx-border{
opacity:1;
}

[data-anim="alertx-anim-fade-out"] .alertx-border{
opacity:0.01;
}
/* fade animation ends */


/* zoomin animation */
[data-anim="alertx-anim-zoomin-in"] .alertx-border, 
[data-anim="alertx-anim-zoomin-out"] .alertx-border{ 
transition:transform 0.5s;
}

[data-anim="alertx-anim-zoomin-in"] .alertx-border{
transform:scale(1);
}

[data-anim="alertx-anim-zoomin-out"] .alertx-border{
transform:scale(0.02);
}
/* zoomin animation ends */

/* zoomout animation */
[data-anim="alertx-anim-zoomout-in"] .alertx-border, 
[data-anim="alertx-anim-zoomout-out"] .alertx-border{ 
transition:transform 0.5s, opacity 0.5s;
}

[data-anim="alertx-anim-zoomout-in"] .alertx-border{
transform:scale(1);
opacity:1;
}

[data-anim="alertx-anim-zoomout-out"] .alertx-border{
transform:scale(4);
opacity:0.01;
}
/* zoomout animation ends */

/* fall animation */
[data-anim="alertx-anim-fall-in"] .alertx-border, 
[data-anim="alertx-anim-fall-out"] .alertx-border{ 
transition:transform 0.5s;
}

[data-anim="alertx-anim-fall-in"] .alertx-border{
transform:translateY(0);
}

[data-anim="alertx-anim-fall-out"] .alertx-border{
transform:translateY(-100vh);
}
/* fall animation ends */

/* rise animation */
[data-anim="alertx-anim-rise-in"] .alertx-border, 
[data-anim="alertx-anim-rise-out"] .alertx-border{ 
transition:transform 0.5s;
}

[data-anim="alertx-anim-rise-in"] .alertx-border{
transform:translateY(0);
}

[data-anim="alertx-anim-rise-out"] .alertx-border{
transform:translateY(100vh);
}
/* rise animation ends */


/* bounce animation */
[data-anim="alertx-anim-bounce-in"] .alertx-border, 
[data-anim="alertx-anim-bounce-out"] .alertx-border{ 
transition:transform 0.5s;
}

[data-anim="alertx-anim-bounce-in"] .alertx-border{
transform:rotateX(360deg) scale(1) translateY(0);
}

[data-anim="alertx-anim-bounce-out"] .alertx-border{
transform:rotateX(0deg) scale(0.02) translateY(-150vh);
}
/* bounce animation ends */

/* shake animation */
[data-anim="alertx-anim-shake-in"] .alertx-border, 
[data-anim="alertx-anim-shake-out"] .alertx-border{ 

}

[data-anim="alertx-anim-shake-in"] .alertx-border{
animation: shakein 0.5s;
animation-iteration-count: 1;
}

[data-anim="alertx-anim-shake-out"] .alertx-border{
animation: shakeout 0.5s;
animation-iteration-count: 1;
transition:transform 0.1s;
}

@keyframes shakein {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

@keyframes shakeout {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
/* shake animation ends */



.alertx-btn.red, .alertx-head.red{background-color:rgba(179,0,0,1);}
.alertx-bg.red{background-color:rgba(179,0,0,0.7);}

.alertx-btn.green, .alertx-head.green{background-color:rgba(96,159,0,1);}
.alertx-bg.green{background-color:rgba(96,159,0,0.7);}

.alertx-btn.teal, .alertx-head.teal{background-color:rgba(0,128,128,1);}
.alertx-bg.teal{background-color:rgba(0,128,128,0.7);}

.alertx-btn.blue, .alertx-head.blue{background-color:rgba(65,105,225,1);}
.alertx-bg.blue{background-color:rgba(65,105,225,0.7);}

.alertx-btn.purple, .alertx-head.purple{background-color:rgba(160,32,240,1);}
.alertx-bg.purple{background-color:rgba(160,32,240,0.7);}

.alertx-btn.gold, .alertx-head.gold{background-color:rgba(212,175,55,1);}
.alertx-bg.gold{background-color:rgba(212,175,55,0.7);}

.alertx-btn.orange, .alertx-head.orange{background-color:rgba(255,140,0,1);}
.alertx-bg.orange{background-color:rgba(255,140,0,0.7);}

.alertx-btn.pink, .alertx-head.pink{background-color:rgba(255,0,128,1);}
.alertx-bg.pink{background-color:rgba(255,0,128,0.7);}

.alertx-btn.brown, .alertx-head.brown{background-color:rgba(133,68,66,1);}
.alertx-bg.brown{background-color:rgba(133,68,66,0.7);}
