#toast-container.toast-bottom-center > div,
.ui-guide-code-example-container .toast {
    width: 100%;
    max-width: 1110px;
    padding: 1.25rem 0.9375rem 1.25rem 4.0625rem;
}

button.toast-close-button {
    color: #FFFFFF !important;
    opacity: 1 !important;
    padding: 0.625rem;
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
}

#toast-container > .toast-error,
.toast-error,
.ui-guide-code-example-container .toast-error {
    background-image: none !important;
}

#toast-container .toast,
.ui-guide-code-example-container .toast {
    font-family: var(--ui-font-UniversLTStd-BoldCn);
    font-size: 0.9375rem;
    font-size: 16px;
    line-height: 16px;
    font-weight: 100;
    color: var(--ui-color-primary-grey);
    background-color: #fff;
    opacity: 1 !important;
    border: 0;
    border-radius: 0;
    box-shadow: 0 2px 7px rgba(147, 147, 147, 0.5);
}

.toast p:last-of-type {
    margin-bottom: 0;
}

#toast-container .toast:hover,
.ui-guide-code-example-container .toast:hover {
    box-shadow: 0 2px 7px rgba(147, 147, 147, 0.5);
}

#toast-container .toast:after,
.ui-guide-code-example-container .toast:after {
    font-family: 'Font Awesome 5 Pro';
    font-size: 1.5rem;
    font-weight: bold;
    position: absolute;
    top: 20px;
    left: 20px;
}

#toast-container > .toast-error,
#toast-container > .toast-info,
#toast-container > .toast-success,
#toast-container > .toast-warning {
    background-image: none !important;
}


.toast-error {
    color: #FFFFFF !important;
    background-color: var(--ui-color-indicator-red) !important;
    background-image: none !important;
}

.toast-error:after {
    content: "\f071";
    color: #FFFFFF;
}

.toast-info {
    color: #FFFFFF !important;
    background-color: var(--ui-color-secondary-blue-darker) !important;
    background-image: none !important;
}

.toast-info:after {
    content: "\f05a";
    color: #FFFFFF;
}

.toast-success {
    color: #FFFFFF !important;
    background-color: var(--ui-color-information-green-dark) !important;
    background-image: none !important;
}

.toast-success:after {
    content: "\f164";
    color: #FFFFFF;
}

.toast-warning {
    color: var(--ui-color-secondary-black) !important;
    background-color: var(--ui-color-information-yellow) !important;
    background-image: none !important;
}

.toast-warning:after {
    content: "\f05a";
    color: var(--ui-color-secondary-black);
}

.toast-warning .toast-close-button {
    color: var(--ui-color-secondary-black) !important;;
}

.toast-message {
    letter-spacing: 1px;
}