.gds-info-banner {
    border-bottom: 4px solid;
    padding: var(--spacer-l);
    border-radius: 4px 4px 0 0;
    border-radius: var(--border-radius-secondary) var(--border-radius-secondary) 0 0;
    background-color: #eaf7fd;
    background-color: var(--color-info-bg);
    border-color: #08c;
    border-color: var(--color-info)
}
 
.gds-info-banner__inner {
    width: 800px;
    max-width: 100%;
    display: flex
}
 
@media screen and (min-width: 0) {
    .gds-info-banner__inner {
        flex-direction:column
    }
}
 
@media screen and (min-width: 768px) {
    .gds-info-banner__inner {
        flex-direction:row
    }
}
 
.gds-info-banner__content .gds-heading {
    margin-bottom: var(--spacer-xs)
}
 
.gds-info-banner--align-center .gds-info-banner__content .gds-heading {
    margin-bottom: var(--spacer-base)
}
 
.gds-info-banner--align-center .gds-info-banner__inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin: 0 auto
}
 
.gds-info-banner--align-center .gds-info-banner__icon-container {
    width: 48px;
    height: 48px;
    margin-right: 0
}
 
.gds-info-banner--align-center .heading {
    margin-bottom: calc(var(--spacer-s))
}
 
@media print {
    .gds-info-banner {
        border: 3px solid #08c;
        border: 3px solid var(--color-info);
        border-radius: 4px;
        border-radius: var(--border-radius-secondary)
    }
}
 
.gds-info-banner--secondary {
    background-color: #fff !important
}
 
.gds-info-banner--secondary {
    border-radius: 4px;
    border-radius: var(--border-radius-secondary);
    border-width: 1px;
    border-style: solid
}
 
.gds-info-banner--success {
    background-color: #e1fee6;
    background-color: var(--color-success-bg);
    border-color: #008000;
    border-color: var(--color-success)
}
 
.gds-info-banner--warning {
    background-color: #fff8e0;
    background-color: var(--color-alert-bg);
    border-color: #ffc200;
    border-color: var(--color-alert)
}
 
.gds-info-banner--error {
    background-color: #fdebeb;
    background-color: var(--color-error-bg);
    border-color: #c00;
    border-color: var(--color-error)
}
 
.gds-info-banner__icon-container {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    border-radius: var(--border-radius-circle);
    width: 32px;
    height: 32px;
    margin-bottom: var(--spacer-m);
    margin-right: calc(var(--spacer-m)*.75);
    background-color: #08c;
    background-color: var(--color-info);
    flex-shrink: 0
}
 
.gds-info-banner__icon-container path {
    fill: #fff;
    fill: var(--color-light)
}
 
@media print {
    .gds-info-banner__icon-container {
        background-color: #fff;
        border: 2px solid #08c;
        border: 2px solid var(--color-info)
    }
 
    .gds-info-banner__icon-container path {
        fill: #08c;
        fill: var(--color-info)
    }
}
 
.gds-info-banner__icon-container--success {
    background-color: #008000;
    background-color: var(--color-success)
}
 
@media print {
    .gds-info-banner__icon-container--success {
        background-color: #fff;
        border: 2px solid #008000;
        border: 2px solid var(--color-success)
    }
 
    .gds-info-banner__icon-container--success path {
        fill: #008000;
        fill: var(--color-success)
    }
}
 
.gds-info-banner__icon-container--warning {
    background-color: #ffc200;
    background-color: var(--color-alert)
}
 
@media print {
    .gds-info-banner__icon-container--warning {
        background-color: #fff;
        border: 2px solid #ffc200;
        border: 2px solid var(--color-alert)
    }
 
    .gds-info-banner__icon-container--warning path {
        fill: #ffc200;
        fill: var(--color-alert)
    }
}
 
.gds-info-banner__icon-container--error {
    background-color: #c00;
    background-color: var(--color-error)
}
 
@media print {
    .gds-info-banner__icon-container--error {
        background-color: #fff;
        border: 2px solid #c00;
        border: 2px solid var(--color-error)
    }
 
    .gds-info-banner__icon-container--error path {
        fill: #c00;
        fill: var(--color-error)
    }
}
 
.gds-info-banner--visibility-print {
    display: none
}
 
.gds-info-banner+.gds-info-banner {
    margin-top: 10vh
}
 
@media print {
    .gds-info-banner--visibility-screen {
        display: none
    }
 
    .gds-info-banner--visibility-print {
        display: block
    }
}
