.alert-box{position:fixed;top:-60px;left:50%;transform:translateX(-50%);padding:10px 20px;border-radius:5px;font-size:16px;color:#fff;text-align:center;opacity:0;transition:opacity .5s ease-out,top .5s ease-out;z-index:9999;animation-duration:.5s;animation-timing-function:ease-out}.alert-box.success{background-color:green}.alert-box.error{background-color:red}@keyframes slideIn{0%{top:-60px;opacity:0}to{top:50px;opacity:1}}@keyframes slideOut{0%{top:50px;opacity:1}to{top:150px;opacity:0}}.alert-box.show{animation:slideIn .5s forwards}.alert-box.hide{animation:slideOut .5s forwards}