/* https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_callout */
.callout {
    position: fixed;
    bottom: 35px;
    right: 10rem;
    margin-left: 20px;
    max-width: 600px;
    z-index: 50;
}

.callout-header {
    padding: 10px 10px;
    background: #555;
    font-size: 15px;
    color: white;
}

.callout-container {
    padding: 15px;
    background-color: #ccc;
    color: black
}

.closebtn {
    position: absolute;
    top: 0px;
    right: 15px;
    color: white;
    font-size: 30px;
    cursor: pointer;
}

    .closebtn:hover {
        color: lightgrey;
    }

.callout-success > .callout-header {
    background: #555;
    color: white;
}
.callout-success > .callout-container {
    background-color: #e2e3e5;
    color: #41464b
}

.callout-danger > .callout-header {
    background: #842029;
    color: #f8d7da;
}
.callout-danger > .callout-container {
    background-color: #f8d7da;
    color: #842029
}

.callout-warning > .callout-header {
    background: #664d03;
    color: #fff3cd;
}
.callout-warning > .callout-container {
    background-color: #fff3cd;
    color: #664d03
}

.callout-info > .callout-header {
    background: #055160;
    color: #cff4fc;
}

.callout-info > .callout-container {
    background-color: #cff4fc;
    color: #055160
}