.alertribbon__base {
    background-color: #404040
}

.alertribbon__base--maintenance {
    background-color: #f4f3ee
}

.alertribbon__content {
    padding-top: .9375em;
    padding-bottom: .9375em;
    display: flex;
    flex-direction: column
}

@media(min-width: 768px) {
    .alertribbon__content {
        flex-direction: row;
        justify-content: space-between
    }
}

.alertribbon__title {
    font: 300 1.125rem / 1.375rem Frutiger, Arial, Helvetica, sans-serif;
    color: #fff
}

.alertribbon__base--maintenance .alertribbon__title {
    color: #1c1c1c
}

.alertribbon__textContent {
    font: 300 0.875rem / 1.25rem Frutiger, Arial, Helvetica, sans-serif;
    margin-top: 10px;
    color: #fff
}

.alertribbon__textContent a {
    color: #fff;
    text-decoration: underline
}

.alertribbon__textContent ul {
    list-style: inside
}

.alertribbon__base--maintenance .alertribbon__textContent {
    font: 300 0.875rem / 1.25rem Frutiger, Arial, Helvetica, sans-serif;
    color: #1c1c1c
}

.alertribbon__closeButton {
    font: 300 0.875rem / 1.25rem Frutiger, Arial, Helvetica, sans-serif;
    margin-bottom: 11.5px;
    padding-right: 28px;
    padding-left: 15px;
    color: #fff;
    align-items: center;
    align-self: flex-end;
    cursor: pointer;
    display: flex;
    justify-content: flex-end;
    min-width: 10%;
    position: relative
}

@media(min-width: 768px) {
    .alertribbon__closeButton {
        margin-top: 2px;
        align-self: flex-start
    }
}

.alertribbon__base--maintenance .alertribbon__closeButton {
    color: #1c1c1c
}

.alertribbon__closeButtonIcon {
    right: 0em;
    margin-top: -1px;
    display: flex;
    align-items: center;
    justify-content: center
}

.alertribbon__closeButtonIcon::before,
.alertribbon__closeButtonIcon::after {
    height: 1px;
    width: 22px;
    background-color: #fff;
    content: "";
    display: block;
    position: absolute;
    right: 0
}

.alertribbon__base--maintenance .alertribbon__closeButtonIcon::before,
.alertribbon__base--maintenance .alertribbon__closeButtonIcon::after {
    background-color: #1c1c1c
}

.alertribbon__closeButtonIcon::after {
    transform: rotate(45deg)
}

.alertribbon__closeButtonIcon::before {
    transform: rotate(-45deg)
}