.alert-snack:not(.hidden){color:#fff;z-index:10;border-radius:4px;align-items:center;width:400px;margin-top:12px;padding:14px 24px 14px 16px;font-size:.875rem;display:flex;position:fixed;top:0;left:calc(50% - 200px);box-shadow:0 3px 5px -1px #0003,0 6px 10px #00000024,0 1px 18px #0000001f}.alert-snack>p{align-items:center;display:flex}.alert-snack[type=error]{background-color:#f44336;border-color:#f44336}.alert-snack[type=success]{background-color:#4caf50!important;border-color:#4caf50!important}.alert-snack[type=info]{background-color:#2196f3!important;border-color:#2196f3!important}.alert-snack[type=error]>p:before{content:"";padding-right:6px;font-family:"Font Awesome 5 Free";font-size:24px;font-weight:900}.alert-snack[type=error]>button{text-transform:uppercase;letter-spacing:.025rem;letter-spacing:.0892857em;height:36px;margin-left:6px;padding:0 16px;font-weight:500;position:relative}.alert-snack[type=error]>button:before{color:#f0f8ff;content:"";opacity:0;pointer-events:none;background-color:currentColor;border-radius:4px;transition:opacity .2s cubic-bezier(.4,0,.6,1);position:absolute;inset:0}.alert-snack[type=error]>button:hover:before{opacity:.08}@media screen and (width<=600px){.alert-snack:not(.hidden){width:calc(100vw - 24px);left:12px;top:unset;bottom:78px}}