@charset "UTF-8"; /* CSS Document */ /* Content ====================================================== 0. BRANDING 1. TYPOGRAPHY 2. ICONS / FONTAWESOME 3. NAVIGATION 4. SIGNATURES / BANDS 5. CARDS / CONTENT BLOCKS 6. FOOTER 7. HELPER CLASSES / UTILITIES 8. FONTS / CUSTOM TYPEFACES 9. MISC / ONE OFFS 10. ACCESSIBILIY 11. RESPONSIVE / MEDIA QUERIES 12. Buttons 13. Google SEARCH 14. Stories/Alum/Students ====================================================== */ /* 0. BRANDING / BASELINE ====================================================== ====================================================== */ html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; scroll-behavior: smooth; font-size: 16px; line-height: 1.3; } /*page scrolling w/ nav adjust*/ :target { scroll-margin-top: 110px; } .scroll-offset { scroll-margin-top: 200px; position: relative; top: -110px; height: 1px; } html, body { min-height: 100%; } body { margin: 0; padding: 0; font-family: "Manrope", sans-serif; font-size: 1rem; font-weight: 475; letter-spacing: 0.15px; font-synthesis: style; color: #151515; line-height: 1.9; text-wrap: pretty; } p { font-size: 1rem; line-height: 1.8; margin: 0 0 clamp(1.4rem, 2.2vw, 2.2rem); } /* Links inside paragraphs */ p a { font-weight: 750; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; transition: text-decoration-thickness 0.2s ease; letter-spacing: 0.05px; } p a:hover, p a:focus-visible { text-decoration-thickness: 2px; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, .h1 a:hover, .h2 a:hover, .h3 a:hover, .h4 a:hover, .h5 a:hover, .h6 a:hover { text-decoration-thickness: 2px; text-underline-offset: 4px; } p strong, p b { font-weight: 700; letter-spacing: -0.1px; } ul.no-bullets { list-style: none; padding-left: 0; margin: 20px 0 0; } ul.no-bullets li { margin: 0 40px 20px 60px; } p.bhc-typeoncard { line-height: clamp(1.2, 1.1vw, 1.45) !important; margin-bottom: 0; } p.contact { line-height: 1.55; } p.contact a { font-weight: 750; } p.contact .contact-name { font-family: "YankeeBoldItalic"; font-size: 1.1rem; font-weight: 700; font-style: italic; line-height: 1.1; } /*Scroll Behavior */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } } p.bhc-callout { font-size: clamp(1.1rem, 1.61vw, 1.2rem); line-height: 1.75; letter-spacing: -0.0025em; font-family: "Yankeebold", "Helvetica Neue", Arial, sans-serif; font-weight: 650; color: #f6f6f6; margin-bottom: 25px !important; } /* COLOR DECLARATIONS. ====================================================== */ /*BHC GOLD: #ba9500 Search Gold e3b95b Donate Gold: #d9a22a Hover Gold: #a1791f; */ .t-blk { color: #151515; } .t-wht { color: #f6f6f6; } .t-gray { color: #909090; } .t-gray-dk { color: #363636; } .t-gold-lt-ultra { color: #e3b95b; } .t-gold-lt { color: #d9a22a; } .t-gold-dk { color: #a1791f; } .t-green { color: #184211 /*#367C2B*/ ; } .bg-gold-lt { background-color: #d9a22a; } .bg-gold-lt-ultra { background-color: #e3b95b; } .bg-gold-dk { background-color: #a1791f; } .bg-blk { background-color: #151515; } .bg-blk-ultra { background-color: #000000; } .bg-wht { background-color: #F6F6F6; } .bg-E6 { background-color: #e5e2e1; } .bg-C4 { background-color: #dddddd; } .bg-gray { background-color: #909090; } .bg-gray-dk { background-color: #363636; } .bg-red { background-color: #ae0c0c; } .bg-blue { background-color: #0085ca; } .bg-natural30 { background-color: rgba(189, 182, 175, 0.30); } .bg-natural15 { background-color: rgba(189, 182, 175, 0.15); } /* TYPOGRAPHY ====================================================== */ h1, h2, h3, h4, h5, h6 { color: #151515; margin: 0 0 0.5em 0; text-wrap: balance; } /* Weight + family */ h1 { font-family: "YankeeBlack", "Helvetica Neue", Arial, sans-serif; font-weight: 900; } h2, h3, h4, h5, h6 { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; } /* Sizes, line-heights, tracking */ h1 { font-size: clamp(1.84rem, 4.89vw, 3.22rem); line-height: clamp(1.18, 1.9 - 1.2vw, 1.1); letter-spacing: -0.03em; } h2 { font-size: clamp(1.67rem, 4.14vw, 2.65rem); line-height: clamp(1.30, 2.1 - 1.2vw, 1.2); letter-spacing: -0.0225em; } h3 { font-size: clamp(1.54rem, 3.45vw, 2.24rem); line-height: 1.2; letter-spacing: -0.02em; } h4 { font-size: clamp(1.47rem, 2.88vw, 1.9rem); line-height: 1.25; letter-spacing: -0.015em; } h5 { font-size: clamp(1.44rem, 2.42vw, 1.63rem); line-height: 1.375; letter-spacing: -0.01em; } h6 { font-size: clamp(1.27rem, 1.61vw, 1.4rem); line-height: 1.5; letter-spacing: -0.005em; } /*h class overide btm margins*/ .h-no-mb h1, .h-no-mb h2, .h-no-mb h3, .h-no-mb h4, .h-no-mb h5, .h-no-mb h6 { margin-bottom: 3px; color: #a1791f; padding-bottom: 2px; border-bottom: 1px solid #a1791f; } /* h1 modifier .h1-bar { position: relative; display: inline-block; padding-bottom: 2rem; } */ .h1-bar { position: relative; display: block; width: 100%; padding-bottom: clamp(0.65rem, 2.5vw, 1.25rem); color: #040b10; margin-bottom: 20px !important; } .h1-bar::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 5px /*clamp(6px, 0.8vw, 15px)*/ ; background-color: #cba144; } .intro-h6 { font-size: clamp(1.27rem, 1.61vw, 1.4rem); line-height: 1.5; letter-spacing: -0.005em; font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; color: #040b10; padding-top: 5px; } .no-head-spacing :is(h1, h2, h3, h4, h5, h6) { margin-top: 0; } * + h1, * + h2, * + h3, * + h4, * + h5, * + h6 { margin-top: clamp(2.5rem, 4vw, 6rem); } .event-hd { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; font-size: clamp(1.47rem, 2.88vw, 1.9rem); line-height: 1.25; letter-spacing: -0.015em; color: #151515; margin: 20px 0 0.25em 0; text-wrap: balance; } .event-hd a { color: inherit; text-decoration: none; } .event-hd a:hover { text-decoration: underline; } /* text weight utilities */ .txt-400 { font-family: "YankeeRegular", "Helvetica Neue", Arial, sans-serif !important; font-weight: 400 !important; } .txt-500 { font-family: "YankeeMedium", "Helvetica Neue", Arial, sans-serif !important; font-weight: 500 !important; } .txt-600 { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif !important; font-weight: 600 !important; } .txt-700 { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif !important; font-weight: 700 !important; } .txt-800 { font-family: "YankeeBlack", "Helvetica Neue", Arial, sans-serif !important; font-weight: 800 !important; } .h-black { font-family: "YankeeBlack", "Helvetica Neue", Arial, sans-serif; font-weight: 900 !important; } /* Kickers */ .bhc-kick-news { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif !important; font-weight: 700 !important; color: #a1791f /*#B90909*/ ; line-height: 1.2; text-transform: uppercase; letter-spacing: 0.25em; font-size: 0.85rem; margin: 20px 0 15px !important; } .bhc-kick-newshp { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif !important; font-weight: 700 !important; /*color: #a1791f #B90909;*/ line-height: 1.2; text-transform: uppercase; letter-spacing: 0.25em; font-size: 0.85rem; margin: 10px 0 0px !important; padding-top: 25px; border-top: 1px solid #F6F6F6; display: block; width: 100%; } .bhc-kick { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; /* -webkit-text-stroke: 0.2px currentColor; */ color: rgba(246, 246, 246, 0.60); /* #B90909 */ line-height: 1.2; text-transform: uppercase; letter-spacing: 0.125em; font-size: clamp(0.915rem, calc(0.635rem + 1.065vw), 1.665rem); margin: 10px 0 15px !important; display: block; } .bhc-kick-lg { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; color: #f6f6f6; font-size: clamp(1.83rem, calc(1.27rem + 2.13vw), 3.33rem); line-height: 1.1; letter-spacing: -0.02em; margin-top: 5px !important; } .bhc-kick-tight { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; color: #f6f6f6; font-size: clamp(1.5rem, calc(0.95rem + 1.6vw), 2.5rem); line-height: 1.2; letter-spacing: -0.0225em; margin-bottom: 0px !important; } .bhc-kick-hp { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; color: #f6f6f6; font-size: clamp(2.75rem, calc(1.9rem + 3.2vw), 5rem); line-height: 1.1; letter-spacing: -0.02em; margin-top: 5px !important; } /* ========================== Links ========================== */ a, a:visited { color: inherit; text-decoration: none; transition: text-decoration-color 0.2s ease, color 0.2s ease; } a:hover, a:focus { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; color: inherit; } /* Fine Print */ .bhc-fp { font-size: clamp(0.8rem, 0.9vw, 0.875rem); line-height: 1.5; font-weight: 500; font-style: italic !important; letter-spacing: 0.2px; margin: 0 0 clamp(1rem, 1.5vw, 1.4rem); font-synthesis: style; } .bhc-f a { color: inherit; font-weight: 700; font-style: italic !important; } /* Signature block spacing (clean + tight) */ .signature-block a { color: inherit; text-decoration: none; } .signature-block a:hover, .signature-block a:focus { text-decoration: underline; } .signature-block p { margin: 0; } .signature-block .signature-intro { margin-bottom: 4px; } .signature-block img { display: block; margin: 4px 0 6px; } .signature-block p.signature { line-height: 1.5; font-size: .875rem !important; font-family: "YankeeRegularItalic"; font-style: italic; font-weight: 600; margin: 0; } /* emphasize the name */ .signature-block p.signature strong { font-family: "YankeeBoldItalic"; font-size: 1.1rem !important; font-weight: 700 !important; font-style: italic; } /*BHC BOARD LIST*/ .board-list { margin: 0 0 1.3rem; } /* UL: column behavior */ .board-list > ul { list-style: none; margin: 0; padding: 0; column-count: 2; column-gap: 40px; } /* LI: spacing + column safety */ .board-list > ul > li { margin: 0 0 2.5rem; break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid; } /* Board member typography — matches signature body */ .board-member { line-height: 1.375; font-size: 0.875rem; font-family: "YankeeMediumItalic"; font-style: italic; font-weight: 500; } /* Name — matches signature name */ .board-member strong { display: inline-block; font-family: "YankeeBold"; font-size: 1.1rem; font-weight: 700; font-style: normal; letter-spacing: 0.15px; } /* Phones: single column */ @media (max-width: 575.98px) { .board-list > ul { column-count: 1; column-gap: 0; margin-bottom: 1.75rem; } } /* ========================== NEWS SPECIAL ========================== */ .bhcf-figure { margin: 0; } .bhcf-figure-inner { display: inline-block; max-width: 100%; } .bhcf-figure-inner img { display: block; width: 100%; height: auto; } .bhcf-caption { display: block; max-width: 750px; box-sizing: border-box; font-family: "Manrope", sans-serif; font-weight: 500; font-style: italic !important; font-size: 0.8rem; margin: 10px 0 50px; padding: 0 2px 5px; border-bottom: 1px solid #858585; } .bhcf-caption strong { font-family: "YankeeBoldItalic"; font-size: 0.95rem; font-weight: 700; font-style: italic; } .bhcf-figure-inner iframe { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; } /* ========================== SM ALERT BANNER ========================== */ .band-alert { padding: 20px 0 25px 0; } .band-alert-sm { min-height: 40px; padding: 10px 0; display: flex; align-items: center; } .alert-ban-lt, .alert-ban-dk { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; text-transform: uppercase; line-height: 1.5; font-size: 0.9rem; letter-spacing: 0.05em; margin: 0; } .alert-ban-lt { color: #CCCCCC; } .alert-ban-dk { color: #151515; } .alert-ban-lt a, .alert-ban-dk a { color: inherit; text-decoration: none; transition: text-decoration 0.3s ease; } .alert-ban-lt a:hover, .alert-ban-dk a:hover { text-decoration: underline; } /* ========================== STORY CONTENT - MAY NOT BE USED ========================== */ .story-content h2:not(:first-child), .story-content h3:not(:first-child), .story-content h4:not(:first-child), .story-content .h-black:not(:first-child), .story-content .h-gold:not(:first-child) { margin-top: 2rem; } /* ========================================================= Under-bar utilities ========================================================= */ .ubar { border-top: 10px solid #cba144; display: inline-block; padding-top: 2rem; } .ubar150 { position: relative; display: inline-block; padding-top: 2rem; } .ubar150::before { content: ""; position: absolute; top: 0; left: 0; width: 175px; height: clamp(5px, 1.2vw, 15px); background-color: #cba144; } /* Fixed-width bar */ .ubar75 { position: relative; display: inline-block; padding-top: 15px; } .ubar75::before { content: ""; position: absolute; top: 0; left: 0; width: 175px; height: clamp(5px, 0.8vw, 12px); background-color: #cba144; } .ubar100b { position: relative; display: inline-block; padding-bottom: 2rem; } .ubar100b::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: clamp(7px, 0.8vw, 15px); background-color: #cba144; } /* Centering the bar left: 50%; transform: translateX(-50%); */ .h1-with-bar { position: relative; display: inline-flex; align-items: center; } .h1-with-bar::before { content: ""; display: inline-block; width: 80px; height: 2px; background-color: #d32339; /* red bar */ margin-right: 15px; vertical-align: middle; } /* 2. ICONS / FONTAWESOME ====================================================== ====================================================== */ .fa, .fas, .far, .fal, .fab { vertical-align: middle; } /* Accessibility Links */ a[href]::after { content: "\f178"; /* fa-arrow-up-right-from-square \f35d */ font-family: "Font Awesome 6 Free"; font-weight: 900; display: inline-block; margin-left: 20px; line-height: 1; font-size: 0.8rem; vertical-align: 0.08em; opacity: 0.95; } a[href]:has(img)::after { content: none; } /* No Font Awesome arrow on image/graphic links */ a[href]:has(img, svg, picture)::after { content: none !important; display: none !important; } /* Disable link arrows inside Elfsight */ div[class^="elfsight-app-"] a[href]::after { content: none !important; } /* Site Directory / disable arrows */ .sitemap-links ul { list-style: none; padding: 0; margin: 0 0 1.5rem; } .sitemap-links li { margin-bottom: 0.5rem; } .no-link-arrows a { font-family: "Manrope", sans-serif; font-weight: 550; font-size: 1rem; line-height: 1.5rem; text-decoration: none; } .no-link-arrows a:hover, .no-link-arrows a:focus { text-decoration: underline; } .no-link-arrows a::after { content: none !important; } /* No Font Awesome arrow on heading links (H tags + .h1-.h6 utility classes) */ :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .event-hd) a[href]::after { content: none !important; display: none !important; } /* Headings: force same icon size as body copy h1 a[href]::after, h2 a[href]::after, h3 a[href]::after, h4 a[href]::after, h5 a[href]::after, h6 a[href]::after { font-size: 0.8rem; vertical-align: 0.05em; } */ /* Exclusions: nav, mega menu, footer */ .ss-custom-navbar a[href]::after, .ss-mega-menu-container a[href]::after, .ss-footer-holder a[href]::after { content: none; } /* Exclusions: utility/system + card overlay links */ a[href^="mailto:"]::after, a[href^="tel:"]::after, a[href^="javascript:"]::after, a.card-link[href]::after, a[href]:empty::after { content: none; } /* Inline body copy: tighter spacing */ p a[href]::after, li a[href]::after { margin-left: 0.25em; margin-right: 0.35em; } /* Buttons: match button text strength */ [class^="usa-button-"] a::after { margin-left: 6px; font-size: 0.75em; opacity: 1; } /* For divs with no icon wanted */ .no-link-icons a[href]::after { content: none; } /* 3. NAVIGATION ====================================================== referrer ====================================================== */ /* 4A. Signatures ====================================================== ====================================================== */ /* Shared base */ .band-hp-signature, .band-home-signature, .band-secdary-signature { position: relative; overflow: hidden; display: flex; justify-content: flex-start; text-align: left; background-color: #FFFFFF; background-size: cover; background-repeat: no-repeat; } /* Homepage signature (unchanged) */ .band-hp-signature { align-items: flex-end; padding: 75px 0 10px; } .band-home-signature { align-items: flex-end; padding: 75px 0 50px; } /* Secondary signature (custom bottom padding) */ .band-secdary-signature { align-items: center; padding: 75px 0 25px; } .band-hp-solidblock { position: relative; overflow: hidden; display: flex; justify-content: flex-end; align-items: flex-start; text-align: left; padding: 75px 25px 25px; flex-direction: column; min-height: clamp(250px, 35vw + 225px, 300px); } .band-hp-solidblock-transp { position: relative; overflow: hidden; display: flex; justify-content: flex-end; align-items: flex-start; text-align: left; padding: 75px 25px 25px; flex-direction: column; min-height: clamp(250px, 35vw + 225px, 300px); } @media (max-width: 767.98px) { .band-hp-solidblock-transp { padding-left: 0 !important; padding-right: 0 !important; } } .band-hp-subsig { position: relative; overflow: hidden; display: flex; justify-content: flex-end; align-items: flex-start; text-align: left; /* background-color: #FFFFFF; */ background-size: cover; background-repeat: no-repeat; padding: 75px 25px 25px; flex-direction: column; } /* Heights */ .band-hp-signature, .band-home-signature, .band-secdary-signature { min-height: clamp(550px, 35vw + 225px, 725px); } .band-hp-subsig { min-height: clamp(250px, 35vw + 225px, 300px); } .band-promoblks { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; text-align: left; width: 100%; aspect-ratio: 1 / 1; background-color: #ffffff; background-size: cover; background-repeat: no-repeat; background-position: center; padding: 75px 25px 25px; } .band-promoblks { min-height: clamp(250px, 35vw + 225px, 300px); } .band-450-signature { position: relative; overflow: hidden; display: flex; justify-content: flex-start; align-items: flex-end; text-align: left; background-color: #FFFFFF; background-size: cover; background-repeat: no-repeat; padding: clamp(40px, 8vw, 110px) 0; min-height: clamp(0px, 50vw, 625px); } /* Content over overlay */ .band-hp-signature > *, .band-home-signature > *, .band-promoblks > *, .band-hp-subsig > *, .band-450-signature > *, .band-secdary-signature > * { position: relative; z-index: 1; } /* Shared overlay base */ .band-hp-signature::before, .band-home-signature::before, .band-promoblks::before, .band-hp-subsig::before, .band-450-signature::before, .band-secdary-signature::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; } /* Overlays */ .band-home-signature::before, .band-hp-signature::before { background: linear-gradient(to bottom, rgba(0, 0, 0, 5) 0%, rgba(0, 0, 0, 0) 40%), linear-gradient(to top right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 40%), linear-gradient(to bottom left, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 40%), linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 40%); } .band-promoblks::before { background: linear-gradient(to top, rgba(0, 0, 0, 5) 0%, rgba(0, 0, 0, 0) 60%); } .band-hp-subsig::before { background: linear-gradient(to top right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 40%), linear-gradient(to top, rgba(0, 0, 0, 5) 0%, rgba(0, 0, 0, 0) 60%); } .band-secdary-signature::before { background: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 50%), linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 40%); } .band-450-signature::before { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 40%), linear-gradient(to right, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 60%), linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 40%); } /*450 Right */ .band-450-sig-rt { position: relative; overflow: hidden; display: flex; justify-content: flex-start; align-items: flex-end; text-align: left; background-color: #FFFFFF; background-size: cover; background-repeat: no-repeat; padding: clamp(40px, 8vw, 110px) 0; min-height: clamp(0px, 50vw, 625px); } /* Content over overlay */ .band-450-sig-rt > * { position: relative; z-index: 1; } /* Overlay */ .band-450-sig-rt::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 40%), linear-gradient(to left, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 60%), linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 40%); } .band-alert { padding: 20px 0 25px 0; } .band-callout { position: relative; overflow: hidden; display: flex; justify-content: center; align-items: center; /* vertically center text */ text-align: center; background-color: #ffffff; background-size: cover; background-repeat: no-repeat; padding: 60px 0; min-height: 475px; } .band-callout::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0) 50%); z-index: 0; pointer-events: none; } .band-callout > * { position: relative; z-index: 1; } .band-040b10 { position: relative; overflow: hidden; display: flex; align-items: center; background-color: #151515 /* cool green #547541*/ ; background-size: cover; background-repeat: no-repeat; padding: clamp(24px, 3.5vw, 42px) 0 clamp(14px, 2vw, 24px); } .band-d9a22a { position: relative; overflow: hidden; display: flex; align-items: center; background-color: #a1791f /* cool green #547541 #a1791f #d9a22a*/ ; background-size: cover; background-repeat: no-repeat; padding: clamp(24px, 3.5vw, 42px) 0 clamp(14px, 2vw, 24px); } .band-040b10-10 { position: relative; overflow: hidden; display: flex; align-items: center; background-color: #151515 /* cool green #547541*/ ; background-size: cover; background-repeat: no-repeat; padding: clamp(45px, 6vw, 75px) 10%; } .band-utility { position: relative; overflow: hidden; display: flex; justify-content: flex-start; align-items: flex-end; text-align: left; background-color: #0064b9 /* #1A6A53 Old site blue #05348a #0068b2 #003577 #00379b */ ; background-image: url("../img/common/1346213986-70.png"); background-blend-mode: luminosity; background-size: cover; background-position: right center; background-repeat: no-repeat; padding: 75px 0 5px; min-height: clamp(250px, 24vw, 420px); /* border-bottom: 1px solid #cba144; */ } .band-utility::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: /* linear-gradient(to top right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%), */ linear-gradient(to top left, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 90%); z-index: 0; pointer-events: none; } .band-utility > * { position: relative; z-index: 1; } .band-utility.band-tall { min-height: 500px; } /* Div Padding */ .band-p25 { padding: 25px; border-radius: 2px; } .band-p50 { padding: 50px; border-radius: 2px; } /* Signature Imgs ====================================================== */ /*========= TESTY */ .sigimg-test { background-image: url("../img/test/t2300-920-3.jpg"); background-position: top center; } .sigimg-execwel { background-image: url("../img/about-us/kimberly-nordstrom.jpg"); background-position: top right; } .sigimg-test2 { background-image: url("../img/test/t2300-920-1.jpg"); background-position: right center; } .sigimg-test3 { background-image: url("../img/test/t750500.jpg"); background-position: top center; } /*========= ABCA */ .sigimg-abca { background-image: url("../img/test/abca.jpg"); background-position: right center; } .abca-sigalum { background-image: url("../img/abca/bhc-abca-507480872.jpg"); background-position: right center; } .abca-callout1 { background-image: url("../img/abca/bhc-abca-img5.jpg"); background-position: center center; } /*========= ABOUT */ .sigimg-about { background-image: url("../img/about-us/bhc-east-signature.jpg"); background-position: right center; } /* about numbers */ .aboutnum1 { background-image: url("../img/test/number-test.png"); background-position: center center; } .about-scho-donors { background-image: url("../img/about-us/bhc-scholarshipdonors2425.jpg"); background-position: top center; } .about-scho-stu { background-image: url("../img/about-us/bchstudent-4_2618.jpg"); background-position: top center; } /*========= ALUMNI */ .sigimg-alufrnds { background-image: url("../img/alumni-friends/bhc-east-alfri-sig.jpg"); background-position: right center; } /* ALUMNI STORIES */ .sigimg-alumstor { background-image: url("../img/alumni-friends/alum-stor/bhcef-dsc1065.jpg"); background-position: right center; } .sigimg-alumstor2 { background-image: url("../img/alumni-friends/alum-stor/bhcef-dsc4645.jpg"); background-position: center center; } /*========= GIVING */ .sigimg-giving { background-image: url("../img/test/t2300-920-3.jpg"); background-position: top right; } .giving-1 { background-image: url("../img/giving/bhc-efd_2791.jpg"); background-position: top center; } .giving-2 { background-image: url("../img/giving/bhc-is-669775688.jpg"); background-position: right center; } .giving-3 { background-image: url("../img/giving/bhc-efd_3357.jpg"); background-position: center center; } .giving-4 { background-image: url("../img/giving/bhc-studstor564789.jpg"); background-position: right center; } .ways-1 { background-image: url("../img/giving/bhc-greatest-615817810_super.jpg"); background-position: right center; } .ways-2 { background-image: url("../img/giving/bhc-plannedgiving-489582781.jpg"); background-position: top center; } .ways-3 { background-image: url("../img/giving/bhc-create-502848770_super.jpg"); background-position: right center; } /*========= recognition */ .recog-awards { background-image: url("../img/about-us/bhc-recog-is-875024182.jpg"); background-position: top center; } /*========= HOMEPAGE */ .sig-hp { background-image: url("../img/hp/bhc-east-foundation.jpg"); background-position: center center; } .sig-hp-btm { background-image: url("../img/hp/bhc-eastfoundation-sunset564789132.jpg"); background-position: bottom right; } .hp-alum0626 { background-image: url("../img/hp/bhc-alum-is157438057.jpg"); background-position: right center; } .hpexplore-1 { background-image: url("../img/about-us/jeremy-thomas.jpg"); background-position: center right; } .hpexplore-2 { background-image: url("../img/hp/bhc-donna-irvin.jpg"); background-position: center center; } .hpexplore-3 { background-image: url("../img/hp/bhc-students5897.jpg"); background-position: top center; } .hpexplore-4 { background-image: url("../img/hp/bhc-east-fb-5789.jpg"); background-position: center center; } .hpexplore-5 { background-image: url("../img/hp/bhc-eBeVZv6bSflY.jpg"); background-position: center center; } .hpexplore-6 { background-image: url("../img/hp/bhc-abca.jpg"); background-position: center center; } .hpexplore-7 { background-image: url("../img/hp/bhc-students2226385991.jpg"); background-position: center center; } .hpexplore-8 { background-image: url("../img/hp/bhc-i117148156.jpg"); background-position: center center; } .hpexplore-9 { background-image: url("../img/hp/bhc-alumnibg-bhc546879.jpg"); background-position: center center; } .hpexplore-10 { background-image: url("../img/hp/bhc-temp-isto-2232573252.jpg"); background-position: top right; } .hpexplore-11 { background-image: url("../img/about-us/kimberly-nordstrom.jpg"); background-position: center right; } .hpnews-1 { background-image: url("../img/news/2025/brandon-hall.jpg"); background-position: top center; } .hpnews-2 { background-image: url("../img/about-us/events-bhc-456978312.jpg"); background-position: center top; } .hpnews-3 { background-image: url("../img/hp/bhc-donna-irvin.jpg"); background-position: center top; } .hpnews-4 { background-image: url("../img/about-us/bhc-is-867402268.jpg"); background-position: center top; } .hpnewsblk { background-image: url("../img/hp/bhc-students2226385991.jpg"); background-position: center center; } .hp-studstories { background-image: url("../img/hp/bhc-east1588289977.jpg"); background-position: right center; } .hp-studstories21 { background-image: url("../img/hp/bhc-her-str-is80160126.jpg"); background-position: right center; } .hp-studstories22 { background-image: url("../img/hp/bhc-east-is157403823.jpg"); background-position: left center; } .hp-sscholar { background-image: url("../img/hp/bhc-student522854574.jpg"); background-position: top right; } /*========= EVENTS */ .sigimg-events { background-image: url("../../_assets-bhc/imgs/destinations/signatures/usathlete-tours-custom.jpg"); background-position: left center; } /*========= NEWS */ .sigimg-news { background-image: url("../../_assets-bhc/imgs/destinations/signatures/usathlete-tours-custom.jpg"); background-position: left center; } /*========= STUDENTS */ .sigimg-studstor { background-image: url("../img/students/student-stories/bhcef-536751313.jpg"); background-position: right center; } .sigimg-students { background-image: url("../img/students/bhc-east-foundation1314945933.jpg"); background-position: right center; } .sigimg-students2 { background-image: url("../img/students/scholarships/bhcef-sig2.jpg"); background-position: right center; } .sigimg-students3 { background-image: url("../img/students/scholarships/bhcef-597958694.jpg"); background-position: right center; } .sigimg-studscholar { background-image: url("../img/students/scholarships/bhcef-1384332902.jpg"); background-position: center center; } .img-studresour1 { background-image: url("../img/students/resources/bhcef-2178703008.jpg"); background-position: top center; } .img-studresour2 { background-image: url("../img/students/resources/bhcef-QYPTNOAM5RQ-u.jpg"); background-position: center center; } .img-studresour3 { background-image: url("../img/news/2025/2025americanroyal.jpg"); background-position: center center; } .img-studresour4 { background-image: url("../img/students/resources/bhcef-Ugox6Ohrzl8-u.jpg"); background-position: center center; } .usa-band-ut { background-color: #505050 !important; } /* 4. Page Bands ====================================================== ====================================================== */ .container { width: 94% !important; max-width: 1600px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; } @media (max-width: 767.98px) { .container { padding-left: 10px !important; padding-right: 10px !important; } } /***SPECIAL WIDE BANDS***/ .nav-matched { width: 94%; max-width: 1600px; margin: 0 auto; padding: 0; } .usa-base { padding: clamp(55px, 6.7vw, 110px) 0; } .usa-base-first { padding: clamp(55px, 6.7vw, 110px) 0; } .usa-base-firstunder { padding: 10px 0 50px; } .usa-base-body { padding: 50px 0px; } .usa-base-ut { padding: 50px 0; } .base-band-grad { background-color: #151515; background-image: linear-gradient(135deg, #002f59 0%, transparent 40%), linear-gradient(315deg, #6b0000 0%, transparent 40%); background-blend-mode: normal; } .usa-adblock { padding: clamp(55px, 6.7vw, 110px) 250px; } /** ====================================================== SIGNARTURE PAGES BAND STRUCTURE **/ .band-signa-first { padding: clamp(55px, 6.7vw, 110px) 0 0; } .band-signa-mid { padding: clamp(55px, 6.7vw, 110px) 0; } .band-signa-end { padding: 0 0 clamp(55px, 6.7vw, 110px) 0; } /* 5. CARDS / CONTENT BLOCKS ====================================================== ====================================================== */ /* general card .card { background-color: rgba(0, 0, 0, 0.0); border: 1px solid rgba(0, 0, 0, 0.0); word-wrap: normal; } */ .usacol { margin-bottom: clamp(25px, 4vw, 50px); } .usacard { display: flex; flex-direction: column; height: 100%; border-radius: 2px; } .spacer { flex-grow: 1; } .usacard-body { display: flex; flex-direction: column; flex-grow: 1; background-color: #E6E6E6; padding: 10px 15px 2px 15px; border: 5px solid #E6E6E6; border-top: none; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; text-transform: none; } .usacard-body2 { display: flex; flex-direction: column; flex-grow: 1; background-color: #F6F6F6; padding: 10px 15px 2px 15px; border: 5px solid #F6F6F6; border-top: none; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; text-transform: none; } .usa-source { font-family: 'PBSSans', sans-serif; font-weight: 400; font-size: .825rem; font-style: normal; color: #2e2e2e; margin-top: 1em; } .usa-source::before { content: "[ "; } .usa-source::after { content: " ]"; } .usarow-gap { margin-left: -15px; margin-right: -15px; } .usarow-gap > .usacol { padding-left: 15px; padding-right: 15px; } .usa-feature-row { display: block; } .usa-feature-row .usa-feature-text { padding-top: 20px; } /* From md and up (when columns sit side by side): enable centering */ @media (min-width: 768px) { /* Make the row a flex container ONLY for this component */ .usa-feature-row { display: flex; align-items: center; } /* Vertically center ONLY the text column */ .usa-feature-row .usa-feature-text { display: flex; flex-direction: column; justify-content: center; } } /* List */ /* Tour highlight items */ .small-tour-list p { font-size: 1rem; margin: 5px 0px 30px 0px; border-top: 2px solid #a4a4a4; padding: 10px 0px 7px 0px; width: 100%; line-height: 1.35; } @media (max-width: 1000px) { .small-tour-list p { font-size: 1rem; margin: 5px 0px 15px 0px; border-top: 1px solid #565656; padding: 5px 0px 5px 0px; width: 100%; line-height: 1.15; } } /* 6. FOOTER ====================================================== ====================================================== */ /* =============================== */ /* FOOTER TYPOGRAPHY */ /* =============================== */ /* MOBILE FOOTER NAV */ /* =============================== */ /* =============================== */ /* FOOTER LAYOUT FIXES */ /* =============================== */ .link-separator { margin: 0 0.25rem; color: #FFFFFF; } /* Optional container spacing */ .usa-base { padding: clamp(50px, 8vw, 100px) 0; } /* Adjust mobile spacing */ @media (max-width: 767.98px) { .usa-base { padding: clamp(30px, 6vw, 70px) 0; } } .band-super .container { display: flex; flex-direction: column; justify-content: space-between; flex-grow: 1; height: 100%; position: relative; z-index: 1; } /* 7. HELPER CLASSES / UTILITIES ====================================================== ====================================================== */ /* FLOATS */ .img-float-left { float: left; margin: 0 30px 10px 0; /* right space = 25px */ max-width: 40%; /* optional, prevents it from overpowering text */ } @media (max-width: 768px) { .img-float-left { float: none; display: block; margin: 0 0 10px 0; max-width: 100%; } } /* image border radius global also applied to imgzoom-wrapper */ body img { border-radius: 2px; } .ss-custom-navbar img, .ss-mega-menu-container img, .ss-footer-holder img { border-radius: 0; } .row.equalize { align-items: stretch; /* columns align to tallest sibling */ } /* nav image radius */ .ss-custom-navbar img { border-radius: 2px; } /* Never round logos */ .ss-custom-navbar .navbar-brand img, .ss-custom-navbar .navbar-brand span.logo, .ss-custom-navbar .ss-menu-item_media img[src*="bhcef"], .ss-custom-navbar .ss-menu-item_media img[src*="logo"], .ss-custom-navbar .ss-menu-item_media img[src*="blk"] { border-radius: 0; } /* image border radius global also applied to imgzoom-wrapper */ .grow { transition: all .5s ease-in-out; } .grow:hover { transform: scale(0.65); } /* ===== inside div === */ imgzoom img { opacity: 1; -webkit-transition: .4s ease-in-out; -webkit-transform: scale(1); transition: .4s ease-in-out; } imgzoom:hover img { /**** DEACTIVE opacity: .7; OR -webkit-filter: brightness(60%);****/ transform: scale(1.1); } .imgzoom-wrapper { overflow: hidden; border-radius: 2px; } .imgzoom-wrapper img { display: block; /* kills inline-img baseline gaps */ width: 100%; /* keeps it clean in bootstrap cols */ height: auto; border-radius: 2px; /* optional, but helps consistency */ } /* ===== inside ad or logo === */ imgzoom-ad img { opacity: 1; -webkit-transition: .4s ease-in-out; -webkit-transform: scale(1); transition: .4s ease-in-out; } imgzoom-ad:hover img { /**** DEACTIVE opacity: .7; OR -webkit-filter: brightness(60%);****/ transform: scale(1.05); } .space-25 { height: 25px; } .space-50 { height: 50px; } .space-75 { height: 75px; } .space-100 { height: 100px; } .space-150 { height: 150px; } .space-200 { height: 200px; } /* 8. FONTS / CUSTOM TYPEFACES ====================================================== ====================================================== */ @font-face { font-family: "YankeeLight"; src: url('../webFonts/YankeeLight/font.woff2') format('woff2'), url('../webFonts/YankeeLight/font.woff') format('woff'); } @font-face { font-family: "YankeeLightItalic"; src: url('../webFonts/YankeeLightItalic/font.woff2') format('woff2'), url('../webFonts/YankeeLightItalic/font.woff') format('woff'); } @font-face { font-family: "YankeeRegular"; src: url('../webFonts/YankeeRegular/font.woff2') format('woff2'), url('../webFonts/YankeeRegular/font.woff') format('woff'); } @font-face { font-family: "YankeeRegularItalic"; src: url('../webFonts/YankeeRegularItalic/font.woff2') format('woff2'), url('../webFonts/YankeeRegularItalic/font.woff') format('woff'); } @font-face { font-family: "YankeeMedium"; src: url('../webFonts/YankeeMedium/font.woff2') format('woff2'), url('../webFonts/YankeeMedium/font.woff') format('woff'); } @font-face { font-family: "YankeeBold"; src: url('../webFonts/YankeeBold/font.woff2') format('woff2'), url('../webFonts/YankeeBold/font.woff') format('woff'); } @font-face { font-family: "YankeeBoldItalic"; src: url('../webFonts/YankeeBoldItalic/font.woff2') format('woff2'), url('../webFonts/YankeeBoldItalic/font.woff') format('woff'); } @font-face { font-family: "YankeeBlack"; src: url('../webFonts/YankeeBlack/font.woff2') format('woff2'), url('../webFonts/YankeeBlack/font.woff') format('woff'); } @font-face { font-family: "YankeeBlackItalic"; src: url('../webFonts/YankeeBlackItalic/font.woff2') format('woff2'), url('../webFonts/YankeeBlackItalic/font.woff') format('woff'); } /* 9. MISC / ONE OFFS ====================================================== ====================================================== */ /* 10. ACCESSIBILIY ====================================================== ====================================================== */ /* Remove default outlines only on mouse click, not keyboard nav */ :focus { outline: 2px solid #5a9bd4; /* neutral soft blue focus */ outline-offset: 3px; } /* Optional: make focus rings appear only for keyboard users */ :focus:not(:focus-visible) { outline: none; } /* Add a nice transition for smooth focus appearance */ a, button, input, textarea { transition: outline-color 0.2s ease, box-shadow 0.2s ease; } /* Optional subtle enhancement */ a:focus-visible, button:focus-visible { box-shadow: 0 0 0 3px rgba(90, 155, 212, 0.35); /* soft glow */ border-radius: 3px; } /* 11. RESPONSIVE / MEDIA QUERIES ====================================================== ====================================================== */ /* 12. Buttons ====================================================== ====================================================== */ [class^="usa-button-"] a { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-optical-sizing: auto !important; font-size: 14px; font-weight: 700; line-height: 1; display: inline-block; margin: 10px 25px 20px 0; padding: 12px 20px 10px 15px; border-radius: 3px; text-decoration: none; letter-spacing: 0.1em; transition: all 0.5s ease; text-transform: uppercase; } /* Modifier: zero bottom margin */ .usa-button-10mb a { margin-bottom: 10px; margin-top: 0px; } /* Variants */ .usa-button-wht a { border: 1px solid #7a7a7a; color: #151515; background: #FFFFFF; } .usa-button-wht a:hover { background: #000000; color: #F6F6F6; border: 1px solid #FFFFFF; } .usa-button-dnt a { border: 1px solid #e3b95c; color: #151515; background: #e3b95c; } .usa-button-dnt a:hover { background: #d9a22a; color: #151515; border: 1px solid #d9a22a; } .usa-button-light a { border: 1px solid #151515; color: #F6F6F6; background: #151515; } .usa-button-light a:hover { background: #F6F6F6; color: #151515; border: 1px solid #151515; } .usa-button-dark a { border: 1px solid #F6F6F6; color: #151515; background: #F6F6F6; } .usa-button-dark a:hover { background: #151515; color: #F6F6F6; border: 1px solid #F6F6F6; } .usa-button-tle a { border: 1px solid #151515; color: #151515; background: rgba(21, 21, 21, 0.00); } .usa-button-tle a:hover { background: #151515; color: #F6F6F6; border: 1px solid #151515; } .usa-button-tdk a { border: 1px solid #F6F6F6; color: #F6F6F6; background: rgba(21, 21, 21, 0.00); } .usa-button-tdk a:hover { background: #F6F6F6; color: #151515; border: 1px solid #F6F6F6; } .usa-button-red a { background: #D7263D; border-color: #D7263D; color: #fff; } .usa-button-blue a { background: #007BFF; border-color: #007BFF; color: #fff; } .usa-button-dkblue a { background: #262561; border-color: #262561; color: #fff; } .usa-button-red a:hover, .usa-button-blue a:hover, .usa-button-dkblue a:hover { background: #fff; color: inherit; } /* White Button */ .usa-button-white a { background: #fff; border: 1px solid #fff; color: #000; font-family: 'PBSSans-Bold', sans-serif; font-size: 18px; font-weight: 700; margin-top: 25px; padding: 0.75em 1.5em; border-radius: 3px; } .usa-button-white a:hover { background: #000; color: #fff; border-color: #fff; } .btn-row { display: flex; flex-wrap: wrap; gap: 15px; align-items: center; } @media (max-width: 576px) { [class^="usa-button-"] a { transform: scale(0.85); transform-origin: left center; } } /* nav-only button */ .ss-custom-navbar .usa-nav-button > a { font-size: 12px; display: inline-block; line-height: 1; text-decoration: none; } .ss-custom-navbar .usa-nav-button > a::after { content: "\f178"; font-family: "Font Awesome 6 Free"; font-weight: 900; display: inline-block; font-size: 0.7rem; line-height: 1; vertical-align: 0.08em; opacity: 0.95; } .ss-custom-navbar .usa-nav-button > a:has(img)::after { content: none; } /*ALERT BAND BUTTON STYLING*/ .btn-row-alert { display: flex; /* reinforce flex for safety */ flex-wrap: wrap; justify-content: center; /* center on all screens */ align-items: center; gap: clamp(18px, 3vw, 36px); /* responsive spacing between buttons */ } /* Remove global button margins for this band only */ .btn-row-alert [class^="usa-button-"] a { margin: 0; } /* Small screens: stack vertically but stay centered */ @media (max-width: 575.98px) { .btn-row-alert { flex-direction: column; align-items: center; } } /* 13. Google SEARCH ====================================================== ====================================================== */ #search-wrap { --search-gold: #d9a22a; --search-gold-hover: #a1791f; --search-blue: #0085ca; --search-text: #151515; --search-bg: #f6f6f6; --search-border: rgba(21, 21, 21, 0.12); --search-radius: 5px; --search-shadow: 0 8px 30px rgba(0, 0, 0, 0.05); font-family: "Manrope", sans-serif; color: var(--search-text); } /* ====================================================== SEARCH FORM ====================================================== */ #search-wrap .gsc-control-cse { padding: 0 !important; border: 0 !important; background: transparent !important; } #search-wrap form.gsc-search-box, #search-wrap table.gsc-search-box { margin: 0 0 40px !important; width: 100% !important; border-spacing: 0 !important; } #search-wrap table { width: 100% !important; } /* ====================================================== SEARCH INPUT ====================================================== */ #search-wrap .gsc-input-box { position: relative !important; border: 1px solid var(--search-border) !important; border-radius: var(--search-radius) !important; background: #ffffff !important; height: 68px !important; padding: 0 22px 0 58px !important; box-shadow: none !important; transition: all 0.3s ease; } #search-wrap .gsc-input-box:hover, #search-wrap .gsc-input-box:focus-within { border-color: var(--search-gold) !important; box-shadow: 0 0 0 4px rgba(217, 162, 42, 0.12) !important; } /* Hide Google's tiny icon */ #search-wrap .gsib_b { display: none !important; } /* SVG-style magnifying glass */ #search-wrap .gsc-input-box::before { content: ""; position: absolute; left: 22px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); border: 2px solid #909090; border-radius: 50%; pointer-events: none; z-index: 5; } #search-wrap .gsc-input-box::after { content: ""; position: absolute; left: 38px; top: 38px; width: 8px; height: 2px; background: #909090; transform: rotate(45deg); border-radius: 2px; pointer-events: none; z-index: 5; } #search-wrap input.gsc-input { background: transparent !important; font-family: "Manrope", sans-serif !important; font-size: 1.08rem !important; font-weight: 550 !important; color: #151515 !important; padding: 0 !important; height: 64px !important; line-height: 64px !important; box-shadow: none !important; vertical-align: middle !important; } #search-wrap input.gsc-input::placeholder { color: #7d7d7d !important; opacity: 1; } /* Remove weird Google backgrounds */ #search-wrap .gsc-input-box table, #search-wrap .gsc-input-box td { background: transparent !important; border: 0 !important; } /* ====================================================== SEARCH BUTTON ====================================================== */ #search-wrap .gsc-search-button { margin-left: 14px !important; } #search-wrap input.gsc-search-button, #search-wrap button.gsc-search-button { height: 68px !important; min-width: 140px !important; border: 0 !important; border-radius: var(--search-radius) !important; background: var(--search-gold) !important; color: #151515 !important; font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif !important; font-size: 0.95rem !important; font-weight: 700 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; transition: all 0.3s ease !important; cursor: pointer !important; padding: 0 28px !important; box-shadow: none !important; } #search-wrap input.gsc-search-button:hover, #search-wrap button.gsc-search-button:hover { background: var(--search-gold-hover) !important; color: #f6f6f6 !important; transform: translateY(-1px); } /* ====================================================== RESULTS WRAPPER ====================================================== */ #search-wrap .gsc-results-wrapper-overlay, #search-wrap .gsc-results-wrapper-visible, #search-wrap .gsc-resultsbox-visible, #search-wrap .gsc-results { width: 100% !important; overflow: visible !important; padding: 0 !important; } /* ====================================================== RESULTS HEADER ====================================================== */ #search-wrap .gsc-result-info { border: 0 !important; padding: 0 0 24px !important; font-family: "Manrope", sans-serif !important; font-size: 1rem !important; font-weight: 650 !important; color: #363636 !important; } /* ====================================================== INDIVIDUAL RESULT CARDS ====================================================== */ #search-wrap .gsc-webResult.gsc-result, #search-wrap .gsc-result { border: 1px solid var(--search-border) !important; border-radius: var(--search-radius) !important; background: #ffffff !important; padding: 32px !important; margin: 0 0 24px !important; box-shadow: var(--search-shadow); transition: all 0.3s ease; } #search-wrap .gsc-webResult.gsc-result:hover, #search-wrap .gsc-result:hover { transform: translateY(-2px); border-color: rgba(217, 162, 42, 0.35) !important; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08); } /* ====================================================== RESULT TITLES ====================================================== */ #search-wrap .gs-title, #search-wrap .gs-title b { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif !important; font-size: clamp(1.35rem, 2vw, 1.7rem) !important; line-height: 1.2 !important; font-weight: 700 !important; color: #151515 !important; text-decoration: none !important; } #search-wrap .gs-title:hover { color: var(--search-blue) !important; } /* ====================================================== URL LINE ====================================================== */ #search-wrap .gs-visibleUrl, #search-wrap .gs-visibleUrl-short { color: #a1791f !important; font-size: 0.92rem !important; font-weight: 700 !important; letter-spacing: 0.02em; margin-bottom: 10px !important; } /* ====================================================== DESCRIPTION ====================================================== */ #search-wrap .gs-snippet { font-family: "Manrope", sans-serif !important; font-size: 1rem !important; line-height: 1.85 !important; color: #363636 !important; margin-top: 12px !important; } /* ====================================================== THUMBNAILS ====================================================== */ #search-wrap .gs-image-box img { border-radius: 12px !important; } /* ====================================================== PAGINATION ====================================================== */ #search-wrap .gsc-cursor-box { margin-top: 50px !important; text-align: center !important; } #search-wrap .gsc-cursor-page { display: inline-flex !important; align-items: center; justify-content: center; width: 48px; height: 48px; margin: 0 6px !important; border-radius: 999px; border: 1px solid var(--search-border); background: #ffffff; color: #151515 !important; font-weight: 700 !important; text-decoration: none !important; transition: all 0.25s ease; } #search-wrap .gsc-cursor-page:hover { background: var(--search-gold); border-color: var(--search-gold); } #search-wrap .gsc-cursor-current-page { background: #151515 !important; border-color: #151515 !important; color: #f6f6f6 !important; } /* ====================================================== REMOVE GOOGLE DEFAULT CLUTTER ====================================================== */ #search-wrap .gcsc-branding, #search-wrap .gsc-branding, #search-wrap .gsc-adBlock, #search-wrap .gsc-above-wrapper-area { border: 0 !important; } #search-wrap .gs-web-image-box, #search-wrap .gs-promotion-image-box { margin-right: 20px !important; } /* ====================================================== MOBILE ====================================================== */ @media (max-width: 767px) { #search-wrap .gsc-webResult.gsc-result, #search-wrap .gsc-result { padding: 24px !important; } #search-wrap .gsc-input-box { height: 60px !important; padding-left: 52px !important; } #search-wrap .gsc-input-box::before { width: 16px; height: 16px; left: 20px; } #search-wrap .gsc-input-box::after { left: 34px; top: 34px; } #search-wrap input.gsc-search-button, #search-wrap button.gsc-search-button { height: 60px !important; min-width: 110px !important; padding: 0 20px !important; } #search-wrap .gs-title, #search-wrap .gs-title b { font-size: 1.35rem !important; } } /* 14. FAQ ====================================================== ====================================================== */ /* ========================================================= /* ========================================================= FAQ (matches ss-footer style + behavior) - top rule via ::before (Bootstrap 4 gutter aware) - question headings: 1.5em (uppercase, YankeeBold) - answers inherit site base type size - chevron uses Font Awesome (no gray box) ========================================================= */ .usa-faq { position: relative; margin-top: 2rem; padding-top: 1.25rem; /* space below the rule */ border-top: 0; } /* top rule like .ss-footer-container::before */ .usa-faq::before { content: ""; position: absolute; top: 0; /* left: 15px; right: 15px; border-top: 1px solid #FFCC00; */ } /* item separators like footer accordion */ .usa-faq-item { border: 0; padding-bottom: 5px; border-bottom: 1px solid #151515; } .usa-faq-item:last-child { border-bottom: 1px solid #d2d2d2; margin-bottom: 25px; } .usa-faq h5 { position: sticky; top: 0; z-index: 10; border-bottom: 5px solid #cba144; padding-bottom: 5px; margin-bottom: 20px; margin-top: 50px; } /* ========================= Question button (heading) ========================= */ .usa-faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 0; background: transparent; border: 0; cursor: pointer; text-align: left; color: #111; font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif !important; font-weight: 750; font-size: 1.25em; line-height: 1.2; text-transform: none; letter-spacing: 0.02em; transition: color 0.3s ease, text-decoration 0.3s ease; } .usa-faq-q:hover, .usa-faq-q:focus { color: #000; text-decoration: underline; } /* Remove any pseudo-icons if a project-wide rule ever hits buttons */ .usa-faq-q::after { content: none !important; } .usa-faq-qtext { flex: 1 1 auto; } /* ========================= Chevron icon (Font Awesome) ========================= */ .usa-faq-icon { flex: 0 0 auto; width: 38px; height: 38px; display: grid; place-items: center; background: transparent; border-radius: 0; transition: transform 0.4s ease-in-out; } .usa-faq-icon::before { content: "\f078"; /* fa-chevron-down */ font-family: "Font Awesome 6 Free"; font-weight: 900; /* solid */ font-size: 15px; line-height: 1; color: #151515; } /* ========================= Answer panel animation ========================= */ .usa-faq-a { max-height: 0; overflow: hidden; transition: max-height 0.4s ease-in-out; } /* padding inside answer */ .usa-faq-inner { padding: 0 0 30px 0; } /* Answers: match site base size (no downscaling) */ .usa-faq-inner, .usa-faq-inner p, .usa-faq-inner li { font-family: "Manrope", sans-serif; font-weight: 400; font-size: inherit; /* key: use whatever the siteâ€™s base type is */ line-height: 1.8; letter-spacing: 0.025em; color: #151515; margin: 0; } /* spacing between paragraphs/lists (kept subtle) */ .usa-faq-inner p + p { margin-top: 0.85em; } .usa-faq-inner ul, .usa-faq-inner ol { margin: 0.85em 0 0 1.1em; padding: 0; } .usa-faq-inner li + li { margin-top: 0.4em; } /* Headings inside answers */ .usa-faq-inner h1, .usa-faq-inner h2, .usa-faq-inner h3, .usa-faq-inner h4, .usa-faq-inner h5, .usa-faq-inner h6 { font-family: "YankeeBold", "Helvetica Neue", Arial, sans-serif; font-weight: 700; font-size: 1.5em; line-height: 1.3; margin: 0 0 0.5em; } /* links in answers like footer links */ .usa-faq-inner a { color: inherit; text-decoration: underline; transition: color 0.3s ease, text-decoration 0.3s ease; } .usa-faq-inner a:hover, .usa-faq-inner a:focus { text-decoration: underline !important; color: #151515; } /* ========================= Open state hooks ========================= */ /* JS sets .usa-faq-a max-height to scrollHeight for smooth open/close */ .usa-faq-item.is-open .usa-faq-a {} /* rotate chevron when open */ .usa-faq-item.is-open .usa-faq-icon { transform: rotate(180deg); } /* ========================= DONOR LISTS ========================= */ .don-list { margin: 0 0 2.0rem; } .don-list > ul.don-list-ul { list-style: none; margin: 0; padding: 0; column-count: 5; /* XL */ column-gap: 60px; } .don-list > ul.don-list-ul > li { margin: 0 0 2.5rem; break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid; /* NAME (default) */ font-family: "YankeeBold"; font-size: 1.1rem; font-weight: 700; font-style: normal; letter-spacing: 0.15px; color: #151515; line-height: 1.2; } /* SECOND LINE ONLY */ .don-list > ul.don-list-ul > li .don-sub { display: block; margin-top: 0.25rem; font-family: "YankeeMediumItalic"; font-size: 0.875rem; font-style: italic; font-weight: 500; letter-spacing: 0; color: #363636; line-height: 1.375; } /* XL: 4 columns */ @media (max-width: 1399.98px) { .don-list > ul.don-list-ul { column-count: 4; } } /* LG: 3 columns */ @media (max-width: 1199.98px) { .don-list > ul.don-list-ul { column-count: 3; } } /* MD: 2 columns */ @media (max-width: 991.98px) { .don-list > ul.don-list-ul { column-count: 2; } } /* SM: 1 column */ @media (max-width: 575.98px) { .don-list > ul.don-list-ul { column-count: 1; column-gap: 0; } .don-list > ul.don-list-ul > li { margin-bottom: 2rem; } } /* ========================= SCHOLARSHIP LIST (2-COLUMN, VERTICAL ORDER) ========================= */ .schol-block { background: rgba(255, 255, 255, 0.8); padding: 15px 25px 15px; margin-bottom: 30px; border-radius: 2px; width: 100%; border: 1px solid rgba(21, 21, 21, 0.35); } .schol-block h5 { margin: 0 0 0.5rem; color: #151515; line-height: 1.2; } .schol-block p { margin: 0; line-height: 1.5rem; font-size: .9rem; } /* ========================= NEWS GRID (MINIMAL) ========================= */ .news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 60px 40px; } @media (max-width: 1200px) { .news-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 775px) { .news-grid { grid-template-columns: 1fr; gap: 25px; } } /* Card */ .news-card { display: flex; flex-direction: column; height: 100%; border: 1px solid rgba(189, 182, 175, 0.80); border-radius: 2px; overflow: hidden; /* ensures clean edges */ } /* Image wrapper (zoom clip only) */ .news-card .imgzoom-wrapper { border-radius: 2px 2px 0 0; overflow: hidden; } /* Image */ .news-card .imgzoom-wrapper img { width: 100%; display: block; border-radius: 0 !important; } /* Body */ .news-cardbody h5 { line-height: 1.275; } .news-cardbody p { line-height: 1.5; } .news-cardbody { display: flex; flex-direction: column; flex: 1; background: rgba(189, 182, 175, 0.20); padding: 18px 15px 0px; } /* Text spacing */ .news-cardbody h5 { margin: 0 0 0.6rem; } .news-cardbody p { margin: 0; } /* Spacer keeps button pinned */ .news-cardbody .spacer { flex: 1; } /* Kill Font Awesome arrows on text links */ .news-card h5 a::after, .news-card p a::after { content: none !important; display: none !important; } .news-card h5 a, .news-card p a { background-image: none !important; padding-right: 0 !important; } /* NEWS card leader*/ @media (min-width: 1201px) { .news-card-featured { grid-column: span 2; } } @media (max-width: 1200px) and (min-width: 776px) { .news-card-featured { grid-column: span 2; } } /*column image */ .band-col-block-sec { position: relative; overflow: hidden; display: flex; justify-content: flex-end; align-items: flex-start; text-align: left; background-size: cover; background-repeat: no-repeat; padding: 75px 25px 25px; flex-direction: column; min-height: 320px; } .band-col-block-sec::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(to top right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 40%), linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 60%); } .band-col-block-sec > * { position: relative; z-index: 2; } .band-col-block-sec::after { content: ""; position: absolute; inset: 0; z-index: 0; background-image: inherit; background-position: inherit; background-size: cover; background-repeat: no-repeat; transform: scale(1); transition: transform .4s ease-in-out; transform-origin: center; } .band-col-block-sec:hover::after { transform: scale(1.1); } .band-col-block-sec-link { position: absolute; inset: 0; z-index: 3; display: block; } .band-col-block { margin-left: 0; margin-right: 0; } .band-col-block > [class^="col-"], .band-col-block > [class*=" col-"] { padding: 25px; } /* 14. Stories / Stud / Alum ====================================================== ====================================================== */ .bhc-stories-h-left { position: relative; overflow: hidden; justify-content: center /*flex-end*/ ; align-items: flex-end; text-align: right; background-size: cover; background-repeat: no-repeat; padding: clamp(50px, 10vw, 100px) 50px clamp(50px, 10vw, 100px) 0; min-height: 300px; } .bhc-stories-t-right { position: relative; overflow: hidden; text-align: left; padding: clamp(50px, 10vw, 100px) 50px clamp(50px, 10vw, 100px) 0; min-height: 300px; } @media (max-width: 991.98px) { .bhc-stories-h-left { text-align: left; padding-left: 0; padding-right: 0; padding-bottom: 0; } .bhc-stories-t-right { padding-left: 0; padding-right: 0; padding-top: 0; } } .bhc-stories-h-right { position: relative; overflow: hidden; justify-content: flex-end; align-items: flex-end; text-align: left; background-size: cover; background-repeat: no-repeat; padding: clamp(50px, 10vw, 100px) 0 clamp(50px, 10vw, 100px) 50px; min-height: 300px; } .bhc-stories-t-left { position: relative; overflow: hidden; text-align: right; padding: clamp(50px, 10vw, 100px) 0 clamp(50px, 10vw, 100px) 50px; min-height: 300px; } @media (max-width: 991.98px) { .bhc-stories-h-right { text-align: left; padding-left: 0; padding-right: 0; padding-bottom: 0; } .bhc-stories-t-left { padding-left: 0; padding-right: 0; padding-top: 0; text-align: left; } } @media (max-width: 991.98px) { .bhc-stories-t-left { order: 2; /* text column goes second */ } .bhc-stories-h-right { order: 1; /* image/name column comes first */ } }