.message {
    position: fixed;
    left: 1rem;
    right: 1rem;
    z-index: 1055;
    pointer-events: none;
}

    .message .alert {
        display: block;
        min-width: 160px;
        max-width: 480px;
        white-space: normal;
        opacity: 0;
        top: -20px;
        bottom: unset;
        margin: 1rem auto 0 auto;
        transition: opacity .3s linear, top .3s linear, bottom .3s linear;
        pointer-events: auto;
    }

        .message .alert.show {
            opacity: 1;
            bottom: unset;
            top: 20px;
        }

    .message.is-bottom .alert {
        top: unset;
        bottom: -20px;
    }

        .message.is-bottom .alert.show {
            top: unset;
            bottom: 20px;
        }
