/* GLOBAL */
/* ==== */
html {
scroll-behavior: smooth;
}
#savecontent {
margin-top: -2px;
}
.anchor {
scroll-margin-top: 150px;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {
color: inherit;
}
h1, .h1 {
font-size: clamp(36px, 4.6vw, 52px);
}
h1.mega, .h1.mega {
font-size: clamp(40px, 5.6vw, 76px);
}
h1.ultra, .h1.ultra {
font-size: clamp(42px, 6.6vw, 100px);
}
h2, .h2 {
font-size: clamp(32px, 4vw, 46px);
}
h3, .h3 {
font-size: clamp(27px, 3.2vw, 34px);
}
h4, .h4 {
font-size: clamp(22px, 2.6vw, 26px);
}
h5, .h5 {
font-size: clamp(19px, 2.2vw, 22px);
}
h6, .h6 {
font-size: clamp(17px, 2vw, 19px);
}
body {
font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
font-size: clamp(15px, 0.633vw + 10.14px, 18px);
line-height: 1.65;
color: #14202f;
}
.btn {
white-space: normal;
font-size: 1.05rem;
font-weight: 600;
letter-spacing: .01em;
padding: .8rem 1.6rem;
border-radius: 4px;
transition: background-color .14s linear, border-color .14s linear, color .14s linear;
}
a:hover img,
a.bg-img:hover a.bg-image:hover {
opacity: .85;
}
#savecontent img {
max-width: 100% !important;
height: auto !important;
}
.rightfloat {
float: right;
margin: 0 0 .5rem 1rem;
width: 40%;
}
@media (max-width: 767px) {
.rightfloat {
float: none;
margin: 0 0 1rem 0;
width: 100%;
}
}
.btn-primary,
.btn-primary:disabled,
.btn-primary.disabled {
color: #fff !important;
background: var(--primary);
border-color: var(--primary);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
color: #fff !important;
background: #0b2f66;
border-color: #0b2f66;
}
.btn-primary-alt,
.btn-primary-alt:disabled,
.btn-primary-alt.disabled {
color: #fff !important;
background: var(--primary-alt);
border-color: var(--primary-alt);
}
.btn-primary-alt:hover,
.btn-primary-alt:focus,
.btn-primary-alt:not(:disabled):not(.disabled):active {
color: #fff !important;
background: #ad0111;
border-color: #ad0111;
}
.btn-outline-primary {
color: var(--primary);
border-color: var(--primary);
border-width: 2px;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
color: #fff;
background: var(--primary);
border-color: var(--primary);
}
.btn-outline-light { border-width: 2px; }
.btn-outline-light:hover,
.btn-outline-light:focus { color: #06182b; background: #fff; border-color: #fff; }
.round {
border-radius: 12px;
}
.carousel-control-next-icon,
.carousel-control-prev-icon {
background-color: rgba(0, 0, 0, 0.9);
padding: 1rem;
background-size: 20px;
}
@media(min-width: 1600px) {
.container {
max-width: 1300px;
}
}
@media(min-width: 1600px) {
.container.container-wide {
width: 1500px !important;
max-width: 1500px !important;
}
}
.product-image {
background-size: cover !important;
min-height: auto !important;
padding-bottom: 75%;
}
#savecontent form label {
font-weight: bold;
}
#savecontent form .checkbox-group label,
#savecontent form .radio-group label {
font-weight: normal;
}
.formbuilder-required {
color: var(--primary-alt);
}
.text-right.addToCart {
text-align: left !important;
}
.blog-detail-page {
background: #eef2f7;
}
.blog-detail-page .blog {
border-radius: 8px;
padding: 1.5rem;
background: white;
box-shadow: 0 8px 24px rgba(0, 20, 50, 0.08);
}
.blog-detail-page .blog h4 {
margin-top: 1rem;
}
form li p {
margin-bottom: 0;
}
form label {
font-weight: bold;
}
form .checkbox-group label,
form .radio-group label {
font-weight: normal;
}
.formbuilder-checkbox,
.formbuilder-radio {
margin-bottom: 4px;
}
/* ==================================================================
ADCOM911 / SITE PATTERNS
Shared by the homepage and every subpage recycled from it.
Palette, written as literal hex (no custom colour tokens):
ink #06182b deep blue-black, the main dark surface
midnight #0a2540 ink's gradient partner
cobalt #1f4fd8 the bright end of dark gradients, used as light
signal #3cc8e8 thin cyan accents on dark (live dots, rules)
ember #ff6a5c warm accent on dark (italic em, glows)
fog #eef2f7 the light surface; white is used sparingly
Brand navy and red stay on buttons and small marks only.
Type: Newsreader (editorial serif) for h1-h3 and big numerals,
Inter for everything else.
================================================================== */
/* --- type ------------------------------------------------------------ */
h1, h2, h3, .h1, .h2, .h3,
.adc-serif {
font-family: 'Newsreader', Georgia, 'Times New Roman', serif;
font-weight: 500;
font-optical-sizing: auto;
letter-spacing: -.015em;
line-height: 1.08;
}
h1 strong, h2 strong, h3 strong,
.h1 strong, .h2 strong, .h3 strong { font-weight: 700; }
h4, h5, h6, .h4, .h5, .h6 {
font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
font-weight: 600;
letter-spacing: -.01em;
line-height: 1.25;
}
h1 em, h2 em, h3 em { font-style: italic; font-weight: inherit; color: var(--primary-alt); }
.adc-dark h1 em, .adc-dark h2 em, .adc-dark h3 em,
.adc-hero h1 em,
.adc-phero h1 em { color: #ff6a5c; }
/* --- fixed header offset -------------------------------------------
omsBs4.js sets body padding-top to the .omsNav height once at load;
js.js re-applies it on resize and publishes --adc-navh. */
.snipOuter[id] { scroll-margin-top: 110px; }
@media (min-width: 992px) {
.snipOuter[id] { scroll-margin-top: 130px; }
}
/* --- focus: keyboard only, never on mouse clicks --------------------- */
a:focus,
button:focus,
.btn:focus,
[tabindex]:focus { outline: 0; box-shadow: none; }
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
[tabindex]:focus-visible {
outline: 2px solid #3c7bff;
outline-offset: 3px;
}
.adc-dark a:focus-visible,
.adc-dark button:focus-visible,
.adc-dark .btn:focus-visible { outline-color: #fff; }
/* --- section header kit ---------------------------------------------
eyebrow: small caps with a short gradient rule, then a serif
heading, then a light Inter lead. */
.adc-eyebrow {
display: flex;
align-items: center;
gap: .75rem;
font-size: .78rem;
font-weight: 700;
letter-spacing: .18em;
text-transform: uppercase;
color: #0a2540;
margin-bottom: 1rem;
}
.adc-eyebrow::before {
content: "";
flex: 0 0 auto;
width: 28px;
height: 2px;
background: linear-gradient(90deg, var(--primary-alt), #ff6a5c);
}
.adc-eyebrow-light { color: rgba(255,255,255,.86); }
.adc-eyebrow-light::before { background: linear-gradient(90deg, #3cc8e8, #3c7bff); }
.adc-eyebrow-center { justify-content: center; }
.adc-lead {
font-size: 1.2em;
font-weight: 300;
line-height: 1.6;
color: #2b3646;
}
.adc-dark .adc-lead,
.bg-dark .adc-lead { color: rgba(255,255,255,.82); }
.adc-rule {
border: 0;
border-top: 1px solid #dfe4ec;
margin: 0;
}
/* --- numerals -------------------------------------------------------- */
.adc-num {
font-family: 'Newsreader', Georgia, serif;
font-weight: 500;
font-variant-numeric: tabular-nums;
letter-spacing: -.02em;
line-height: 1;
}
/* --- links inside copy ---------------------------------------------- */
#savecontent p a:not(.btn),
#savecontent li a:not(.btn) {
color: #0b2f66;
font-weight: 600;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: .15em;
transition: color .14s linear;
}
#savecontent p a:not(.btn):hover,
#savecontent li a:not(.btn):hover {
color: var(--primary-alt);
}
/* arrow link: label plus arrow, arrow nudges on hover */
.adc-more {
display: inline-flex;
align-items: center;
gap: .45rem;
font-weight: 600;
color: #0b2f66;
text-decoration: none;
transition: color .14s linear;
}
.adc-more i { transition: transform .14s linear; }
.adc-more:hover,
.adc-more:focus { color: var(--primary-alt); text-decoration: none; }
.adc-more:hover i,
.adc-more:focus i { transform: translateX(4px); }
/* phones: the arrow link is a tap target, so give it the full 44px
without changing how it looks (it is already inline-flex, centred) */
@media (max-width: 767.98px) {
.adc-more { min-height: 44px; }
}
.adc-dark .adc-more { color: #fff; }
.adc-dark .adc-more:hover,
.adc-dark .adc-more:focus { color: #3cc8e8; }
/* --- surfaces ---------------------------------------------------------
.adc-dark ink field with a soft cobalt light in one corner
.adc-cobalt the ink-to-cobalt band, for one statement section
.adc-fog cool light grey with a faint vertical fade */
.adc-dark {
position: relative;
color: #fff;
background-color: #06182b;
background-image:
radial-gradient(90% 70% at 100% 0%, rgba(31,79,216,.32) 0%, rgba(31,79,216,0) 60%),
linear-gradient(180deg, #06182b 0%, #0a2540 100%);
}
.adc-dark h1, .adc-dark h2, .adc-dark h3, .adc-dark h4 { color: #fff !important; }
.adc-cobalt {
background-color: #06182b;
background-image: linear-gradient(112deg, #06182b 0%, #0a2a5c 48%, #1f4fd8 100%);
}
.adc-fog {
background-color: #eef2f7;
background-image: linear-gradient(180deg, #f5f7fb 0%, #e9eef5 100%);
}
/* the blue/red lightbar glow, the static echo of the intro */
.adc-bloom {
background-image:
radial-gradient(ellipse 45% 70% at 6% 25%, rgba(47,107,255,.34) 0%, rgba(47,107,255,0) 70%),
radial-gradient(ellipse 40% 65% at 96% 80%, rgba(255,72,92,.26) 0%, rgba(255,72,92,0) 70%),
linear-gradient(180deg, #06182b 0%, #0a2540 100%);
background-repeat: no-repeat;
}
/* the lightbar: the intro overlay's blue and red blooms, turned down for use
inside a dark section. Two soft glows breathe in turn like a light bar,
slower and fainter than the intro. Size and place each one per section. */
.adc-lightbar { border-radius: 50%; will-change: opacity; }
.adc-lightbar-l {
background: radial-gradient(circle, rgba(47,107,255,.55) 0%, rgba(47,107,255,.18) 30%, rgba(47,107,255,0) 62%);
animation: adcBarL 3.2s linear infinite;
}
.adc-lightbar-r {
background: radial-gradient(circle, rgba(230,20,50,.5) 0%, rgba(230,20,50,.16) 30%, rgba(230,20,50,0) 62%);
animation: adcBarR 3.2s linear infinite;
}
@keyframes adcBarL { 0% { opacity: .35; } 25% { opacity: 1; } 50% { opacity: .35; } 75% { opacity: .2; } 100% { opacity: .35; } }
@keyframes adcBarR { 0% { opacity: .2; } 25% { opacity: .35; } 50% { opacity: .35; } 75% { opacity: 1; } 100% { opacity: .2; } }
@media (prefers-reduced-motion: reduce) {
.adc-lightbar-l, .adc-lightbar-r { animation: none; opacity: .5; }
}
/* --- background shapes (.adc-shapes) --------------------------------
An absolutely positioned layer of soft geometry behind a section's
content: signal rings, glowing orbs, dot grids and thin arcs. Each
shape is positioned per section. Content above sits at z-index 1. */
.adc-shapes {
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
overflow: hidden;
pointer-events: none;
z-index: 0;
}
.adc-shapes + .container,
.adc-shapes ~ .container { position: relative; z-index: 1; }
.adc-shapes > span { position: absolute; display: block; }
.adc-ring {
border-radius: 50%;
background: repeating-radial-gradient(circle, rgba(255,255,255,.09) 0 1px, rgba(255,255,255,0) 1px 34px);
-webkit-mask-image: radial-gradient(circle, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 70%);
mask-image: radial-gradient(circle, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 70%);
}
.adc-ring-ink { background: repeating-radial-gradient(circle, rgba(10,37,64,.1) 0 1px, rgba(10,37,64,0) 1px 34px); }
.adc-orb { border-radius: 50%; filter: blur(10px); }
.adc-orb-cobalt { background: radial-gradient(circle, rgba(47,107,255,.5) 0%, rgba(47,107,255,0) 65%); }
.adc-orb-ember { background: radial-gradient(circle, rgba(255,106,92,.34) 0%, rgba(255,106,92,0) 65%); }
.adc-orb-cyan { background: radial-gradient(circle, rgba(60,200,232,.3) 0%, rgba(60,200,232,0) 65%); }
.adc-orb-sky { background: radial-gradient(circle, rgba(120,160,255,.35) 0%, rgba(120,160,255,0) 65%); }
.adc-dots {
background-image: radial-gradient(rgba(255,255,255,.16) 1px, rgba(255,255,255,0) 1.5px);
background-size: 22px 22px;
-webkit-mask-image: linear-gradient(135deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 70%);
mask-image: linear-gradient(135deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 70%);
}
.adc-dots-ink { background-image: radial-gradient(rgba(10,37,64,.18) 1px, rgba(10,37,64,0) 1.5px); }
.adc-arc {
border-radius: 50%;
border: 1px solid rgba(255,255,255,.14);
}
.adc-arc-ink { border-color: rgba(10,37,64,.12); }
/* radio pulse: rings that grow and fade, forever, very slowly */
.adc-signal { width: 0; height: 0; }
.adc-signal i {
position: absolute;
left: -300px;
top: -300px;
width: 600px;
height: 600px;
border-radius: 50%;
border: 1px solid rgba(120,170,255,.35);
transform: scale(.1);
opacity: 0;
animation: adcSignal 7.5s linear infinite;
}
.adc-signal i:nth-child(2) { animation-delay: 2.5s; }
.adc-signal i:nth-child(3) { animation-delay: 5s; }
@keyframes adcSignal {
0% { transform: scale(.1); opacity: 0; }
10% { opacity: .9; }
100% { transform: scale(1); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
.adc-signal i { animation: none; opacity: .3; transform: scale(.6); }
}
/* --- glass panels ---------------------------------------------------- */
.adc-glass {
background: rgba(10,37,64,.46);
-webkit-backdrop-filter: blur(18px) saturate(140%);
backdrop-filter: blur(18px) saturate(140%);
border: 1px solid rgba(255,255,255,.14);
}
/* --- split headings (js.js adds .adc-split and .is-in) ----------------
Letters rise out of each word's clip box in a wave, the Oliver Wyman
move. Nothing is hidden until js.js has split the heading. */
.adc-split .adc-w {
display: inline-block;
overflow: hidden;
vertical-align: top;
padding: 0 .06em .16em;
margin: 0 -.06em -.16em;
}
.adc-split .adc-l {
display: inline-block;
transform: translate3d(0, 115%, 0) rotate(9deg);
transform-origin: 0 100%;
}
.adc-split.is-in .adc-l {
transform: none;
transition: transform .6s linear;
transition-delay: calc(var(--i) * 15ms);
}
[data-adc-weight] .adc-l { transition: font-weight .12s linear, transform .6s linear; }
/* --- 3D and scroll effects (js.js adds html.adc-fx) ------------------ */
.adc-fx [data-adc-parallax],
.adc-fx [data-adc-drift] { will-change: transform; }
.adc-fx [data-adc-tilt] {
transform-origin: 50% 0;
transform: perspective(1600px) rotateX(calc((1 - var(--p, 1)) * -26deg)) scale(calc(.92 + var(--p, 1) * .08));
}
/* --- horizontal rails (.adc-rail) -----------------------------------
Native overflow gives touch swipe; js.js adds mouse drag, trackpad
deltaX, arrow buttons and a click guard. */
.adc-rail-wrap { position: relative; }
.adc-rail {
display: flex;
gap: 1.25rem;
overflow-x: auto;
scroll-snap-type: x proximity;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
-ms-overflow-style: none;
padding: .25rem .25rem 1.25rem;
cursor: grab;
}
.adc-rail::-webkit-scrollbar { display: none; }
.adc-rail.is-dragging { cursor: grabbing; scroll-behavior: auto; }
.adc-rail img { -webkit-user-drag: none; user-select: none; pointer-events: none; }
.adc-rail > * { scroll-snap-align: start; flex: 0 0 auto; }
.adc-rail-nav { display: none; }
.adc-rail-btn {
width: 48px; height: 48px;
margin-left: .5rem;
border-radius: 50%;
border: 1px solid rgba(10,37,64,.25);
background: #fff;
color: #0a2540;
font-size: 1rem;
line-height: 1;
align-items: center;
justify-content: center;
transition: background-color .14s linear, color .14s linear, border-color .14s linear;
}
.adc-rail-btn:hover:not(:disabled) { background: #0a2540; border-color: #0a2540; color: #fff; }
.adc-rail-btn:disabled { opacity: .3; cursor: default; }
@media (min-width: 992px) {
.adc-rail-wrap.has-overflow .adc-rail-nav { display: block; }
.adc-rail-wrap.has-overflow .adc-rail-btn { display: inline-flex; }
}
/* --- tap feedback on phones ------------------------------------------ */
.btn:active,
.adc-mcard:active,
.adc-logo:active { transform: scale(.985); }
.btn, .adc-mcard, .adc-logo, .adc-stack-link { touch-action: manipulation; }
/* ==================================================================
ADCOM911 / SUBPAGE KIT
Every subpage is a short hero plus a few sections. All of the styling
lives here on purpose: the markup a page carries in the CMS editor
stays short and plain, so the client can retype a paragraph or add a
row without breaking a layout. Decoration is a class, never markup
someone has to preserve while editing.
================================================================== */
/* >>>>>>>>>>>>>>>>>> THE STATIC SUBPAGE HERO PHOTO <<<<<<<<<<<<<<<<<<
ONE photo for every static page: about, records requests, resources,
mapping, careers, contact and so on. Change the two lines below and
every one of those pages changes with it. Nothing else to edit: a
page never carries a hero image of its own.
NOT affected, on purpose: /documentation and /board-meetings. Those
two are rendered by custom/2747/documents.cfm, which sets its own
photo per page on a plain .adc-phero-img (no .adc-phero-static), and
an inline style beats a stylesheet rule regardless. To change those
two, edit pageCfg.photo / pageCfg.pos in that file.
Keep the URL unquoted: the CMS strips quotes inside url().
Current photo: Denver at night. */
.adc-phero-static .adc-phero-img {
background-image: url(https://images.unsplash.com/photo-1619856699906-09e1f58c98b1?auto=format&fit=crop&w=1800&q=75);
background-position: 50% 78%;
}
/* the scrim is tuned to that photo: lighten it for a darker image,
deepen it for a brighter one, so the white heading always holds up */
.adc-phero-static .adc-phero-scrim {
background: linear-gradient(180deg, rgba(4,15,28,.3) 0%, rgba(4,15,28,.5) 45%, rgba(6,24,43,.88) 100%);
}
/* --- page hero (.adc-phero) -------------------------------------
The homepage hero at a third of the height: one photo, one scrim,
eyebrow + h1 + one line. No carousel, no stats, no intro overlay. */
.adc-phero {
position: relative;
overflow: hidden;
background-color: #06182b;
}
.adc-phero::after {
content: "";
position: absolute;
left: 0; right: 0; bottom: 0;
z-index: 5;
height: 4px;
background: linear-gradient(90deg, #3cc8e8 0%, #3c7bff 45%, #ff6a5c 100%);
}
.adc-phero-media {
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
overflow: hidden;
}
.adc-phero-img {
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.adc-phero-scrim {
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
background: linear-gradient(180deg, rgba(4,15,28,.42) 0%, rgba(4,15,28,.58) 45%, rgba(6,24,43,.86) 100%);
}
.adc-phero .adc-shapes { z-index: 3; }
.adc-phero .adc-phero-inner {
position: relative;
z-index: 4;
min-height: clamp(300px, 30vw, 430px);
display: flex;
align-items: flex-end;
padding-top: 3.5rem;
padding-bottom: 2.6rem;
}
.adc-phero h1 {
color: #fff !important;
margin-bottom: .9rem;
text-shadow: 0 2px 30px rgba(4,15,28,.45);
}
.adc-phero .adc-phero-sub {
font-size: 1.15em;
font-weight: 300;
line-height: 1.55;
max-width: 36em;
margin-bottom: 0;
color: rgba(255,255,255,.9);
text-shadow: 0 1px 16px rgba(4,15,28,.6);
}
.adc-phero-stat {
display: inline-flex;
align-items: baseline;
gap: .5rem;
margin-top: 1.6rem;
padding-top: 1rem;
border-top: 1px solid rgba(255,255,255,.18);
color: rgba(255,255,255,.8);
font-size: .82rem;
font-weight: 600;
letter-spacing: .12em;
text-transform: uppercase;
}
.adc-phero-stat .adc-num { font-size: 1.6rem; color: #fff; letter-spacing: 0; }
/* live numbers that only make sense when the call-stats API answered */
html.adc-stats-offline .adc-live-only { display: none; }
/* --- copy zone (.adc-prose) --------------------------------------
Wrap the part of a page the client types into. Everything inside is
styled by tag, so a pasted heading, list or table still lands on the
design instead of falling back to the browser default. */
.adc-prose { max-width: 46em; }
.adc-prose > *:first-child { margin-top: 0; }
.adc-prose > *:last-child { margin-bottom: 0; }
.adc-prose h2 { margin: 2.6rem 0 1rem; }
.adc-prose h3 { margin: 2.2rem 0 .8rem; }
.adc-prose h4, .adc-prose h5 { margin: 1.8rem 0 .6rem; }
.adc-prose p { margin-bottom: 1.15rem; }
.adc-prose ol { margin: 0 0 1.3rem; padding-left: 1.3rem; }
.adc-prose li { margin-bottom: .5rem; }
.adc-prose ul { list-style: none; margin: 0 0 1.3rem; padding-left: 0; }
.adc-prose ul li { position: relative; padding-left: 1.5rem; }
.adc-prose ul li::before {
content: "";
position: absolute;
left: 0;
top: .62em;
width: 7px;
height: 7px;
border-radius: 2px;
background: linear-gradient(135deg, #3c7bff, #1f4fd8);
}
.adc-prose table { width: 100%; margin-bottom: 1.5rem; border-collapse: collapse; }
.adc-prose th, .adc-prose td {
padding: .7rem .9rem;
border-bottom: 1px solid #dfe4ec;
text-align: left;
vertical-align: top;
}
.adc-prose th { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: #0a2540; }
.adc-prose-wide { max-width: none; }
/* --- CMS module mount (.adc-module) -------------------------------
Document Repository, Jobs and Blog render their own markup into the
page. Wrapping it in this card pulls module output onto the site's
type, spacing and link styling instead of the bare template look.
The rules are deliberately generic (tag and attribute based) so a
change upstream cannot leave a page looking broken. */
.adc-module {
position: relative;
background: #fff;
border: 1px solid #dfe4ec;
border-radius: 12px;
padding: 1.6rem;
box-shadow: 0 1px 2px rgba(10,37,64,.04), 0 22px 50px -30px rgba(10,37,64,.28);
}
@media (min-width: 768px) {
.adc-module { padding: 2.2rem; }
}
.adc-module h2, .adc-module h3, .adc-module h4 { color: #0a2540; }
.adc-module h2 { font-size: clamp(26px, 3vw, 32px); margin-bottom: 1.2rem; }
.adc-module h3 { font-size: clamp(22px, 2.4vw, 26px); margin: 2rem 0 .9rem; }
.adc-module table { width: 100%; border-collapse: collapse; }
.adc-module th, .adc-module td { padding: .75rem .9rem; border-bottom: 1px solid #e6eaf0; vertical-align: middle; }
.adc-module th { font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #0a2540; }
.adc-module tr:last-child td { border-bottom: 0; }
.adc-module .nav-tabs { border-bottom: 1px solid #dfe4ec; }
.adc-module .nav-tabs .nav-link {
border: 0;
border-bottom: 2px solid transparent;
border-radius: 0;
padding: .6rem .9rem;
font-weight: 600;
color: #4a5768;
transition: color .14s linear, border-color .14s linear;
}
.adc-module .nav-tabs .nav-link:hover { color: #0a2540; border-bottom-color: #c9d3e0; }
.adc-module .nav-tabs .nav-link.active { color: #0a2540; border-bottom-color: var(--primary-alt); background: transparent; }
/* any link to a document gets a file mark, whatever generated the row */
.adc-module a[href$=".pdf"],
.adc-module a[href$=".PDF"],
.adc-module a[href$=".doc"],
.adc-module a[href$=".docx"],
.adc-module a[href$=".xls"],
.adc-module a[href$=".xlsx"] {
display: inline-flex;
align-items: baseline;
gap: .6rem;
font-weight: 600;
color: #0b2f66;
text-decoration: none;
transition: color .14s linear;
}
.adc-module a[href$=".pdf"]::before,
.adc-module a[href$=".PDF"]::before,
.adc-module a[href$=".doc"]::before,
.adc-module a[href$=".docx"]::before,
.adc-module a[href$=".xls"]::before,
.adc-module a[href$=".xlsx"]::before {
content: "";
flex: 0 0 auto;
width: .6em;
height: .78em;
border: 2px solid var(--primary-alt);
border-radius: 2px;
box-shadow: inset 0 -.22em 0 -.12em var(--primary-alt);
}
.adc-module a[href$=".pdf"]:hover,
.adc-module a[href$=".PDF"]:hover,
.adc-module a[href$=".doc"]:hover,
.adc-module a[href$=".docx"]:hover,
.adc-module a[href$=".xls"]:hover,
.adc-module a[href$=".xlsx"]:hover { color: var(--primary-alt); text-decoration: underline; }
/* nothing uploaded into the folder yet */
.adc-module-empty {
padding: 2.5rem 1.5rem;
text-align: center;
color: #4a5768;
border: 1px dashed #c9d3e0;
border-radius: 10px;
}
/* --- child-page tiles (.adc-tiles) --------------------------------
The landing-page list: one entry per child page, thin rules instead
of boxes, the number set in the serif. Hover shifts colour only. */
.adc-tiles { display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) {
.adc-tiles { grid-template-columns: 1fr 1fr; column-gap: 2.5rem; }
}
.adc-tile {
display: block;
position: relative;
padding: 1.5rem 3rem 1.5rem 0;
border-top: 1px solid #dfe4ec;
color: #14202f;
text-decoration: none;
transition: border-color .14s linear;
}
.adc-tile:hover,
.adc-tile:focus { text-decoration: none; color: #14202f; border-top-color: var(--primary-alt); }
.adc-tile-n {
display: block;
font-family: 'Newsreader', Georgia, serif;
font-size: 1rem;
color: #8a95a5;
margin-bottom: .5rem;
}
.adc-tile-t {
display: block;
font-family: 'Newsreader', Georgia, serif;
font-size: clamp(22px, 2.4vw, 27px);
font-weight: 600;
line-height: 1.15;
letter-spacing: -.015em;
color: #06182b;
margin-bottom: .4rem;
transition: color .14s linear;
}
.adc-tile:hover .adc-tile-t,
.adc-tile:focus .adc-tile-t { color: var(--primary-alt); }
.adc-tile-d { display: block; color: #4a5768; font-size: .96em; line-height: 1.55; }
.adc-tile-go {
position: absolute;
right: .4rem;
top: 1.85rem;
color: #8a95a5;
transition: transform .14s linear, color .14s linear;
}
.adc-tile:hover .adc-tile-go,
.adc-tile:focus .adc-tile-go { color: var(--primary-alt); transform: translateX(4px); }
/* --- callout (.adc-note) ------------------------------------------
One short standing notice: a fee, a phone number, a warning. */
.adc-note {
display: flex;
gap: 1rem;
padding: 1.2rem 1.3rem;
background: #fff;
border: 1px solid #dfe4ec;
border-left: 3px solid var(--primary-alt);
border-radius: 8px;
}
.adc-note i { flex: 0 0 auto; margin-top: .2rem; color: var(--primary-alt); }
.adc-note p:last-child { margin-bottom: 0; }
.adc-note-dark {
background: rgba(255,255,255,.06);
border-color: rgba(255,255,255,.16);
border-left-color: #3cc8e8;
color: rgba(255,255,255,.88);
}
.adc-note-dark i { color: #3cc8e8; }
/* --- closing band (.adc-cta) --------------------------------------
Ends a subpage the way the homepage ends: ink to cobalt, one line,
two buttons. */
.adc-cta { position: relative; overflow: hidden; }
.adc-cta .adc-ring { width: 900px; height: 900px; right: -380px; top: -300px; }
.adc-cta .adc-dots { left: 0; bottom: 0; width: 38%; height: 70%; }
.adc-cta h2 { color: #fff !important; }
.adc-cta .btn { margin: 0 .75rem .75rem 0; }
/* PAGE SPECIFIC */
/* FOOTER */