/* 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(35px, 4.4vw, 46px);
}
h1.mega, .h1.mega {
font-size: clamp(36px, 4.7vw, 70px);
}
h1.ultra, .h1.ultra {
font-size: clamp(37px, 5.3vw, 95px);
}
h2, .h2 {
font-size: clamp(32px, 4vw, 42px);
}
h3, .h3 {
font-size: clamp(29px, 3.6vw, 37px);
}
h4, .h4 {
font-size: clamp(26px, 3.2vw, 32px);
}
h5, .h5 {
font-size: clamp(23px, 2.8vw, 27px);
}
h6, .h6 {
font-size: clamp(20px, 2.4vw, 22px);
}
body {
font-size: clamp(15px, 2vw, 18px);
}
.btn {
white-space: normal;
}
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 {
color: white !important;
}
.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: red;
}
.text-right.addToCart {
text-align: left !important;
}
.blog-detail-page {
background: var(--light);
}
.blog-detail-page .blog {
border-radius: 12px;
padding: 1.5rem;
background: white;
box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}
.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;
}
/* ============================================================
NCMA DENVER | GLOBAL SITE STYLES
Loads after Bootstrap 4 and the Omnia template CSS.
Palette comes from the CMS: var(--primary) #002742, var(--primary-alt) #FABC10
============================================================ */
/* ---------- Typography ---------------------------------- */
body,
.navbar,
.btn {
font-family: "Hind", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
body {
font-size: 1rem;
line-height: 1.7;
}
p {
line-height: 1.75;
}
/* Small uppercase label that sits above a section heading */
.nc-eyebrow {
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.18em;
text-transform: uppercase;
line-height: 1.4;
margin-bottom: 0.5rem;
}
/* Light intro paragraph under a heading */
.nc-lead {
font-size: 1.125rem;
line-height: 1.7;
max-width: 46rem;
}
/* Short gold accent rule */
.nc-rule {
display: block;
width: 56px;
height: 3px;
background: var(--primary-alt);
}
.nc-rule-center {
margin-left: auto;
margin-right: auto;
}
/* ---------- Hero ---------------------------------------- */
.nc-hero {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
padding-top: 4rem;
padding-bottom: 4rem;
}
.nc-hero-overlay {
top: 0;
right: 0;
bottom: 0;
left: 0;
background: linear-gradient(180deg, rgba(0, 39, 66, 0.7) 0%, rgba(0, 39, 66, 0.5) 55%, rgba(0, 39, 66, 0.72) 100%);
}
.nc-hero .container {
z-index: 3;
}
.nc-hero-mark {
width: 72px;
max-width: 100%;
}
.nc-hero-title {
font-size: 1.75rem;
line-height: 1.25;
}
.nc-hero .nc-lead {
margin-left: auto;
margin-right: auto;
}
@media (min-width: 576px) {
.nc-hero-title {
font-size: 2.25rem;
}
}
@media (min-width: 992px) {
.nc-hero {
padding-top: 6rem;
padding-bottom: 6rem;
}
.nc-hero-mark {
width: 88px;
}
.nc-hero-title {
font-size: 3rem;
}
}
/* ---------- Ratio image box ----------------------------- */
/* Base CSS forces img height to auto, so feature crops use a
background image with a padding ratio instead of an img tag. */
.nc-ratio {
width: 100%;
height: 0;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.nc-ratio-4x3 {
padding-bottom: 75%;
}
.nc-ratio-1x1 {
padding-bottom: 100%;
}
/* ---------- Image band with overlay --------------------- */
.nc-band {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
padding-top: 3.5rem;
padding-bottom: 3.5rem;
}
.nc-band-overlay {
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 39, 66, 0.88);
}
.nc-band .container {
z-index: 3;
}
.nc-band .nc-lead {
margin-left: auto;
margin-right: auto;
}
@media (min-width: 992px) {
.nc-band {
padding-top: 5rem;
padding-bottom: 5rem;
}
}
/* ---------- Membership ---------------------------------- */
.nc-membership {
background: linear-gradient(180deg, var(--light) 0%, #fff 100%);
}
.nc-join-box {
border-top: 3px solid var(--primary-alt);
}
/* ---------- Subpage header ------------------------------ */
/* Reused on every interior page. Swap the background image and the
two lines of text; everything else stays put. */
.nc-pagehead {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
padding-top: 3rem;
padding-bottom: 3rem;
}
.nc-pagehead-overlay {
top: 0;
right: 0;
bottom: 0;
left: 0;
background: linear-gradient(180deg, rgba(0, 39, 66, 0.74) 0%, rgba(0, 39, 66, 0.62) 100%);
}
.nc-pagehead .container {
z-index: 3;
}
@media (min-width: 992px) {
.nc-pagehead {
padding-top: 5rem;
padding-bottom: 5rem;
}
}
/* ---------- Board bios ---------------------------------- */
.nc-bio {
border: 1px solid rgba(0, 39, 66, 0.1);
}
.nc-bio-bordered {
background: transparent;
}
.nc-bio-photo {
width: 88px;
max-width: 100%;
flex: 0 0 88px;
aspect-ratio: 1 / 1;
object-fit: cover;
object-position: center top;
border-radius: 50%;
}
.nc-bio-role {
color: var(--primary);
font-weight: 600;
font-size: 0.9rem;
line-height: 1.35;
}
.nc-bio-link {
font-size: 0.85rem;
font-weight: 500;
}
/* Source file is only 659px wide, so it upscales across the container.
Fine for a soft-focus photo of the trophy table. */
.nc-awards {
width: 100%;
max-width: 100%;
display: block;
}
/* ---------- Values list --------------------------------- */
.nc-values li {
display: flex;
align-items: baseline;
font-weight: 300;
margin-bottom: 0.75rem;
}
.nc-values li i {
flex: 0 0 auto;
margin-right: 0.6rem;
}
/* ---------- Member savings rows ------------------------- */
.nc-savings li {
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
gap: 0.25rem 1rem;
padding: 0.7rem 0;
border-bottom: 1px solid rgba(0, 39, 66, 0.12);
font-weight: 300;
}
.nc-savings li:first-child {
border-top: 1px solid rgba(0, 39, 66, 0.12);
}
.nc-savings-value {
color: var(--primary);
font-weight: 600;
white-space: nowrap;
}
/* ---------- Membership rate rows ------------------------ */
.nc-rates li {
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
gap: 0.25rem 1.5rem;
padding: 0.9rem 0;
border-bottom: 1px solid rgba(0, 39, 66, 0.12);
}
.nc-rates li:first-child {
border-top: 1px solid rgba(0, 39, 66, 0.12);
}
.nc-rate-info {
flex: 1 1 16rem;
}
.nc-rate-name {
display: block;
color: var(--primary);
font-weight: 600;
line-height: 1.35;
}
.nc-rate-desc {
display: block;
font-weight: 300;
font-size: 0.9rem;
line-height: 1.5;
}
.nc-rate-price {
color: var(--primary);
font-size: 1.25rem;
font-weight: 700;
white-space: nowrap;
}
.nc-callout {
border-left: 3px solid var(--primary-alt);
}
/* ---------- Advisor cards ------------------------------- */
.nc-advisor {
border: 1px solid rgba(0, 39, 66, 0.12);
border-top: 3px solid var(--primary-alt);
}
.nc-advisor-role {
font-weight: 300;
font-size: 0.95rem;
line-height: 1.5;
}
/* ---------- Conference cards ---------------------------- */
.nc-conf {
border: 1px solid rgba(0, 39, 66, 0.12);
border-top: 3px solid var(--primary-alt);
}
.nc-conf-meta li {
display: flex;
align-items: baseline;
font-weight: 300;
font-size: 0.95rem;
line-height: 1.5;
margin-bottom: 0.5rem;
}
.nc-conf-meta li i {
flex: 0 0 auto;
margin-right: 0.6rem;
}
/* ---------- Small screen and touch polish --------------- */
.btn,
.nav-link {
touch-action: manipulation;
}
.btn:active {
transform: none;
}
@media (max-width: 400px) {
.nc-hero-title {
font-size: 1.5rem;
}
.nc-lead {
font-size: 1rem;
}
.btn {
white-space: normal;
}
.nc-bio {
padding: 1.25rem !important;
}
.nc-bio-photo {
width: 68px;
flex: 0 0 68px;
}
}
/* PAGE SPECIFIC */
/* FOOTER */