.simple-site-banner {
    display: block;
    box-sizing: border-box;
    /* make the banner span the full viewport width even inside centered containers */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 12px 16px;
    text-align: center;
    font-size: 18px;
    color: #000;
}

/* Default (no strong color) */
.simple-site-banner { background-color: transparent; }

/* Pale red */
.simple-site-banner--red { background-color: #ffecec; border-bottom: 1px solid #f5c6c6; }

/* Pale orange */
.simple-site-banner--orange { background-color: #fff4e6; border-bottom: 1px solid #ffd8b3; }

/* Pale green */
.simple-site-banner--green { background-color: #eaffea; border-bottom: 1px solid #bfeabf; }