:root {
    --cms-blue-950: #102a43;
    --cms-blue-800: #1f4f78;
    --cms-blue-650: #2f6f9f;
    --cms-blue-150: #dbeaf5;
    --cms-blue-075: #eef6fb;
}

body.cms-template-neutralblue {
    background: linear-gradient(145deg, #f8fbfd 0%, var(--cms-blue-075) 100%);
    color: #263746;
}

.cms-neutral-blue-shell {
    min-height: 100vh;
}

.cms-template-neutralblue .top-bar,
.cms-template-neutralblue .top-bar ul {
    background: var(--cms-blue-950);
}

.cms-template-neutralblue .top-bar a,
.cms-template-neutralblue .top-bar button {
    color: #fff;
}

.cms-template-neutralblue .top-bar a:hover,
.cms-template-neutralblue .top-bar a:focus {
    background: var(--cms-blue-800);
}

.cms-neutral-blue-content {
    padding-top: 1.25rem;
    padding-bottom: 2rem;
}

.cms-template-neutralblue a {
    color: var(--cms-blue-800);
}

.cms-template-neutralblue .button.primary,
.cms-template-neutralblue .button:not(.secondary):not(.success):not(.warning):not(.alert) {
    background: var(--cms-blue-650);
}

.cms-template-neutralblue .callout.primary {
    border-color: var(--cms-blue-650);
    background: var(--cms-blue-075);
    color: var(--cms-blue-950);
}

.cms-template-neutralblue .card,
.cms-template-neutralblue .callout {
    border-radius: .35rem;
    box-shadow: 0 .2rem .8rem rgb(16 42 67 / 8%);
}