#fw-section-custom-html-2485c894-4257-43c5-b86b-8f4c6008f0f1 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-64fab108-eb1d-483c-8039-ea2bbb779fd2 {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-444090db-cc1c-4c2b-bdfb-7ecb6d47fea4 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-custom-html-195f1c6e-5ad7-42f0-a1f2-81daa57a5e1b {
/* ===============================
TRASH FANZ – MLB SITEMAP
MLB mobile layout + NBA desktop/hover behavior
=============================== */
/* Remove underlines globally within MLB directory */
.mlb-directory a,
.mlb-directory a:hover,
.mlb-directory a:active,
.mlb-directory a:focus {
text-decoration: none !important;
}
/* Universal tap feedback (mobile + desktop) */
.mlb-directory a:active {
transform: scale(.97) !important;
filter: brightness(0.88) !important;
}
/* Label long/short swap */
.mlb-directory .label-short { display:none; }
.mlb-directory .label-long { display:inline; }
@media (max-width:780px){
.mlb-directory .label-long { display:none !important; }
.mlb-directory .label-short { display:inline !important; }
}
/* Center the top pills block within the MLB section */
.mlb-directory {
text-align: center !important;
}
/* ===============================
CONFERENCE PILLS – SIZE & CENTER
=============================== */
/* Mobile + tablet */
@media (max-width:780px){
.mlb-directory .label-pill{
display:block !important;
width:100% !important;
max-width:420px !important;
text-align:center !important;
/* bigger pill */
min-height:44px !important;
padding:10px 22px !important;
margin:8px auto 14px !important;
border-radius:999px !important;
/* text a bit larger */
font-size:14px !important;
line-height:1.2 !important;
letter-spacing:.04em !important;
white-space:normal !important;
}
}
/* Desktop */
@media (min-width:781px){
.mlb-directory .home-card .label-pill,
.mlb-directory .rivals-card .label-pill{
display:flex !important;
align-items:center !important;
justify-content:center !important;
text-align:center !important;
max-width:420px !important;
width:100% !important;
margin:10px auto 18px !important;
/* bigger pill */
min-height:52px !important;
padding:12px 28px !important;
border-radius:999px !important;
/* text a bit larger */
font-size:15px !important;
line-height:1.2 !important;
letter-spacing:.05em !important;
white-space:normal !important;
}
}
/* Keep pills themselves centered as inline-flex chips */
.mlb-directory .section-pill {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* -----------------------------------
Long-name handling: DIAMONDBACKS
Show as "D-BACKS" everywhere
----------------------------------- */
.mlb-directory a[href*="diamondbacks"] {
position: relative;
color: transparent !important; /* hide long team name text */
}
.mlb-directory a[href*="diamondbacks"]::after {
content: "D-BACKS";
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
color: #fff !important;
font: inherit;
letter-spacing: .02em !important;
text-transform: uppercase !important;
}
/* ===============================
MOBILE LAYOUT – USE MLB VERSION
=============================== */
@media (max-width:780px){
/* Stack each division vertically and center contents */
.mlb-directory .divisions-grid{
display:block !important;
padding-top:4px !important;
row-gap:6px !important;
text-align:center !important;
}
/* Team links become clean centered rows */
.mlb-directory .divisions-grid a{
display:block !important;
background:transparent !important;
border:0 !important;
border-radius:0 !important;
min-height:auto !important;
line-height:1.35 !important;
padding:10px 6px !important;
margin:0 auto !important;
font-size:14px !important;
letter-spacing:.02em !important;
color:#ddd !important;
text-align:center !important;
justify-content:center !important;
white-space:normal !important; /* allow wrapping */
box-shadow:none !important;
transform:none !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
max-width:90%;
}
.mlb-directory .divisions-grid a:last-child{
border-bottom:0 !important;
}
/* Section pills – full-width-ish, centered, tappable */
.mlb-directory .section-pill{
width:80% !important;
max-width:340px !important;
min-height:40px !important;
line-height:40px !important;
padding:8px 14px !important;
margin:8px auto 14px !important;
font-size:13px !important;
border-radius:12px !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
color:#f5f5f5 !important;
}
/* League label pills (AL/NL HOME, AL/NL RIVALS) */
.mlb-directory .label-pill{
display:block !important;
width:100% !important;
text-align:center !important;
min-height:36px !important;
line-height:36px !important;
padding:0 10px !important;
font-size:12px !important;
letter-spacing:.02em !important;
border-radius:10px !important;
margin:6px auto 10px !important;
}
/* Division headers (AL EAST, NL WEST, …) */
.mlb-directory .divisions-grid > a:first-child{
display:inline-block !important;
background:#1a1a1a !important;
border:1px solid rgba(255,255,255,.18) !important;
border-radius:10px !important;
padding:6px 12px !important;
margin:4px auto 8px !important;
text-align:center !important;
font-weight:700 !important;
font-size:13px !important;
text-transform:uppercase;
width:auto !important;
/* prevent "NL CENTRAL" wrap */
white-space:nowrap !important;
min-width:112px !important;
}
/* Press colors (mobile): Home = blue, Rivals = red */
.mlb-directory a[href*="-mlb-home-locker"]:active,
.mlb-directory a[href*="-home-locker"]:active,
.mlb-directory .divisions-grid > a:first-child[href*="-home"]:active{
background:#162030 !important;
color:#40a0ff !important;
border-color:rgba(64,160,255,.45) !important;
box-shadow:0 0 0 2px rgba(64,160,255,.18) !important,
0 0 18px rgba(64,160,255,.4) !important;
}
.mlb-directory a[href*="-mlb-rival-locker"]:active,
.mlb-directory a[href*="-rival-locker"]:active,
.mlb-directory .divisions-grid > a:first-child[href*="-rivals"]:active{
background:#2a1a1a !important;
color:#ff3838 !important;
border-color:rgba(255,56,56,.45) !important;
box-shadow:0 0 0 2px rgba(255,56,56,.18) !important,
0 0 18px rgba(255,56,56,.4) !important;
}
/* Diamondbacks: mobile sizing */
.mlb-directory a[href*="diamondbacks"] {
width:auto !important;
max-width:95% !important;
margin:0 auto !important;
padding:10px 6px !important;
}
.mlb-directory a[href*="diamondbacks"]::after {
font-size:14px !important;
line-height:1.35 !important;
}
}
/* Tiny phones (≤360px) */
@media (max-width:360px){
.mlb-directory .divisions-grid a{
font-size:12px !important;
padding:8px 4px !important;
max-width:95% !important;
}
.mlb-directory .label-pill{
font-size:11px !important;
line-height:32px !important;
min-height:32px !important;
}
}
/* ===============================
DESKTOP LAYOUT – USE NBA VERSION
=============================== */
@media (min-width:781px){
/* 4-column grid of team pills */
.mlb-directory .divisions-grid{
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:10px !important;
row-gap:10px !important;
padding-top:0 !important;
text-align:initial !important;
}
.mlb-directory .divisions-grid a{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:34px !important;
line-height:34px !important;
padding:0 14px !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
background:#151515 !important;
border:1px solid rgba(255,255,255,.14) !important;
border-radius:12px !important;
box-shadow:none !important;
transform:none !important;
margin:0 !important;
}
/* Division headers span full row */
.mlb-directory .divisions-grid > a:first-child{
grid-column:1 / -1 !important;
background:#111 !important;
border-color:rgba(255,255,255,.22) !important;
font-weight:800 !important;
min-height:34px !important;
line-height:34px !important;
padding:0 12px !important;
margin-top:5px !important; /* little buffer above header */
}
/* Diamondbacks: desktop sizing */
.mlb-directory a[href*="diamondbacks"] {
padding: 0 14px !important;
min-width: auto !important;
}
.mlb-directory a[href*="diamondbacks"]::after {
font-size:14px !important;
line-height:34px !important; /* matches pill height */
}
/* League Section Pills – desktop rectangles (NBA style) */
.mlb-directory .section-pill{
min-height:44px !important;
line-height:44px !important;
padding:0 32px !important;
margin:10px auto 20px !important;
border-radius:10px !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
text-transform:uppercase;
letter-spacing:.14em;
font-size:11px;
font-weight:600;
color:#f5f5f5 !important;
min-width:320px !important;
max-width:420px !important;
}
/* Center conference label pills in cards */
.mlb-directory .home-card .label-pill,
.mlb-directory .rivals-card .label-pill {
display:flex !important;
align-items:center !important;
justify-content:center !important;
text-align:center !important;
width:100% !important;
margin:6px auto 10px !important;
}
/* Extra buffer below division’s last team */
.mlb-directory .divisions-grid a:not(:first-child):last-of-type {
margin-bottom:6px !important;
}
}
/* ===============================
HOVER / ACTIVE COLORS (DESKTOP)
=============================== */
@media (hover:hover) and (pointer:fine){
/* HOME team/division pills = blue */
.mlb-directory .divisions-grid a[href*="-mlb-home-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-home-locker"]:hover,
.mlb-directory .divisions-grid > a:first-child[href*="-home"]:hover{
background:#1a1f27 !important;
border-color:rgba(64,160,255,.55) !important;
outline:2px solid rgba(64,160,255,.35) !important;
outline-offset:0 !important;
box-shadow:none !important;
}
/* RIVALS team/division pills = red */
.mlb-directory .divisions-grid a[href*="-mlb-rival-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-rival-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-rivals"]:hover,
.mlb-directory .divisions-grid > a:first-child[href*="-rivals"]:hover{
background:#241718 !important;
border-color:rgba(255,56,56,.55) !important;
outline:2px solid rgba(255,56,56,.35) !important;
outline-offset:0 !important;
box-shadow:none !important;
}
/* Division headers hover glow inside Home/Rivals cards */
.mlb-directory .home-card .divisions-grid > a:first-child:hover {
background:#1a1f27 !important;
border-color:rgba(64,160,255,.65) !important;
box-shadow:
0 0 0 1px rgba(64,160,255,.35) !important,
0 0 12px rgba(64,160,255,.85) !important;
}
.mlb-directory .rivals-card .divisions-grid > a:first-child:hover {
background:#241718 !important;
border-color:rgba(255,56,56,.65) !important;
box-shadow:
0 0 0 1px rgba(255,56,56,.35) !important,
0 0 12px rgba(255,56,56,.85) !important;
}
/* Section pills hover (league-wide Home / Rivals buttons) */
.mlb-directory .section-pill[href*="home-locker"]:hover {
background:#1a1f27 !important;
border-color:rgba(64,160,255,.65) !important;
box-shadow:0 0 14px rgba(64,160,255,1) !important;
color:#fff !important;
}
.mlb-directory .section-pill[href*="rivals-locker"]:hover,
.mlb-directory .section-pill[href*="rival-locker"]:hover {
background:#241718 !important;
border-color:rgba(255,56,56,.65) !important;
box-shadow:0 0 14px rgba(255,56,56,1) !important;
color:#fff !important;
}
}
/* Tap / active feedback for conference labels (cards) */
.mlb-directory .home-card > div > a:active,
.mlb-directory .home-card .divisions-grid > a:first-child:active {
background:#162030 !important;
color:#40a0ff !important;
border-color:rgba(64,160,255,.45) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.18) !important,
0 0 18px rgba(64,160,255,.4) !important;
}
.mlb-directory .rivals-card > div > a:active,
.mlb-directory .rivals-card .divisions-grid > a:first-child:active {
background:#2a1a1a !important;
color:#ff3838 !important;
border-color:rgba(255,56,56,.45) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.18) !important,
0 0 18px rgba(255,56,56,.4) !important;
}
/* Keep pill text white on hover/active */
.mlb-directory .divisions-grid a:hover,
.mlb-directory .divisions-grid a:active,
.mlb-directory .home-card > div > a:hover,
.mlb-directory .home-card > div > a:active,
.mlb-directory .rivals-card > div > a:hover,
.mlb-directory .rivals-card > div > a:active {
color:#fff !important;
}/* === NBA Division Header Stretch Fix (append at end) === */
@media (min-width:781px){
/* make sure the grid is actually a 4-col grid */
.mlb-directory .divisions-grid{
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:10px !important;
}
/* full-row division header pill */
.mlb-directory .divisions-grid > a:first-child{
grid-column:1 / -1 !important; /* span across all 4 columns */
display:flex !important; /* allow centering text */
align-items:center !important;
justify-content:center !important;
width:100% !important; /* stretch to full row width */
box-sizing:border-box !important;
min-height:38px !important;
line-height:38px !important;
padding:0 14px !important;
border-radius:12px !important;
/* neutral base look (card decides color on hover) */
background:#111 !important;
border:1px solid rgba(255,255,255,.22) !important;
/* undo mobile min width constraints */
min-width:auto !important;
max-width:none !important;
}
/* keep team pills as chips */
.mlb-directory .divisions-grid a:not(:first-child){
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
}
/* BLUE hover for headers inside HOME cards */
.mlb-directory .home-card .divisions-grid > a:first-child:hover{
background:#1a1f27 !important;
border-color:rgba(64,160,255,.65) !important;
outline:2px solid rgba(64,160,255,.35) !important;
outline-offset:0 !important;
color:#fff !important;
}
/* RED hover for headers inside RIVALS cards */
.mlb-directory .rivals-card .divisions-grid > a:first-child:hover{
background:#241718 !important;
border-color:rgba(255,56,56,.65) !important;
outline:2px solid rgba(255,56,56,.35) !important;
outline-offset:0 !important;
color:#fff !important;
}
}
/* === NBA CONFERENCE HEADER HOVER EFFECTS === */
/* Blue hover for NBA Home headers */
.nba-directory .home-card a:hover {
background: #1a1f2f !important;
border-color: rgba(64,160,255,0.8) !important;
outline: 2px solid rgba(64,160,255,0.8) !important;
outline-offset: 0 !important;
color: #ffffff !important;
box-shadow: 0 0 12px rgba(64,160,255,0.8), 0 0 20px rgba(64,160,255,0.6);
transition: all 0.25s ease-in-out;
}
/* Red hover for NBA Rival headers */
.nba-directory .rivals-card a:hover {
background: #2a1111 !important;
border-color: rgba(255,86,86,0.8) !important;
outline: 2px solid rgba(255,86,86,0.8) !important;
outline-offset: 0 !important;
color: #ffffff !important;
box-shadow: 0 0 12px rgba(255,86,86,0.8), 0 0 20px rgba(255,86,86,0.6);
transition: all 0.25s ease-in-out;
}
/* Reset any pill background for these header titles */
.nba-directory .home-card a,
.nba-directory .rivals-card a {
background: transparent !important;
border-radius: 0 !important;
padding: 6px 14px !important;
font-weight: 600 !important;
text-decoration: none !important;
}
/* === end fix === */
/* =========================================
NBA conference header hover/tap glow
(keeps headers as text, not pills)
========================================= */
/* Base header link (Home/Rivals title row in each card) */
.mlb-directory .home-card > div > a,
.mlb-directory .rivals-card > div > a,
.nba-directory .home-card > div > a,
.nba-directory .rivals-card > div > a{
display:inline-block !important;
background:transparent !important;
border:0 !important;
padding:6px 0 !important;
margin:0 auto 12px !important;
color:#ddd !important;
text-decoration:none !important;
border-radius:12px !important; /* used only for glow mask */
transition: box-shadow .18s ease,
text-shadow .18s ease,
color .18s ease !important;
}
/* Desktop hover glow */
@media (hover:hover) and (pointer:fine){
/* HOME = blue */
.mlb-directory .home-card > div > a:hover,
.nba-directory .home-card > div > a:hover{
color:#fff !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.35) inset,
0 0 14px rgba(64,160,255,.85) !important;
text-shadow:0 0 10px rgba(64,160,255,.9) !important;
}
/* RIVALS = red */
.mlb-directory .rivals-card > div > a:hover,
.nba-directory .rivals-card > div > a:hover{
color:#fff !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.35) inset,
0 0 14px rgba(255,56,56,.9) !important;
text-shadow:0 0 10px rgba(255,56,56,.95) !important;
}
}
/* Keyboard focus (accessibility) */
.mlb-directory .home-card > div > a:focus-visible,
.nba-directory .home-card > div > a:focus-visible{
outline:2px solid rgba(64,160,255,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
.mlb-directory .rivals-card > div > a:focus-visible,
.nba-directory .rivals-card > div > a:focus-visible{
outline:2px solid rgba(255,56,56,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
/* Mobile tap feedback (same colors you liked on MLB) */
@media (max-width:780px){
.mlb-directory .home-card > div > a:active,
.nba-directory .home-card > div > a:active{
color:#40a0ff !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28) inset,
0 0 18px rgba(64,160,255,.55) !important;
}
.mlb-directory .rivals-card > div > a:active,
.nba-directory .rivals-card > div > a:active{
color:#ff3838 !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28) inset,
0 0 18px rgba(255,56,56,.55) !important;
}
}
}
#fw-section-custom-html-49bc4b56-d229-4f93-9269-0f4710a78433 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-e3b0e03e-47f7-4af1-8d8b-3be3fbf5cd6c {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-83283652-785b-471e-9dc3-6959ffdaf971 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-custom-html-f6652d11-da67-4178-aefc-a5331e98ddcc {
/* ===============================
TRASH FANZ – MLB SITEMAP
MLB mobile layout + NBA desktop/hover behavior
=============================== */
/* Remove underlines globally within MLB directory */
.mlb-directory a,
.mlb-directory a:hover,
.mlb-directory a:active,
.mlb-directory a:focus {
text-decoration: none !important;
}
/* Universal tap feedback (mobile + desktop) */
.mlb-directory a:active {
transform: scale(.97) !important;
filter: brightness(0.88) !important;
}
/* Label long/short swap */
.mlb-directory .label-short { display:none; }
.mlb-directory .label-long { display:inline; }
@media (max-width:780px){
.mlb-directory .label-long { display:none !important; }
.mlb-directory .label-short { display:inline !important; }
}
/* Center the top pills block within the MLB section */
.mlb-directory {
text-align: center !important;
}
/* Keep pills themselves centered as inline-flex chips */
.mlb-directory .section-pill {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* -----------------------------------
Long-name handling: DIAMONDBACKS
Show as "D-BACKS" everywhere
----------------------------------- */
.mlb-directory a[href*="diamondbacks"] {
position: relative;
color: transparent !important; /* hide long team name text */
}
.mlb-directory a[href*="diamondbacks"]::after {
content: "D-BACKS";
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
color: #fff !important;
font: inherit;
letter-spacing: .02em !important;
text-transform: uppercase !important;
}
/* ===============================
MOBILE LAYOUT – USE MLB VERSION
=============================== */
@media (max-width:780px){
/* Stack each division vertically and center contents */
.mlb-directory .divisions-grid{
display:block !important;
padding-top:4px !important;
row-gap:6px !important;
text-align:center !important;
}
/* Team links become clean centered rows */
.mlb-directory .divisions-grid a{
display:block !important;
background:transparent !important;
border:0 !important;
border-radius:0 !important;
min-height:auto !important;
line-height:1.35 !important;
padding:10px 6px !important;
margin:0 auto !important;
font-size:14px !important;
letter-spacing:.02em !important;
color:#ddd !important;
text-align:center !important;
justify-content:center !important;
white-space:normal !important; /* allow wrapping */
box-shadow:none !important;
transform:none !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
max-width:90%;
}
.mlb-directory .divisions-grid a:last-child{
border-bottom:0 !important;
}
/* Section pills – full-width-ish, centered, tappable */
.mlb-directory .section-pill{
width:80% !important;
max-width:340px !important;
min-height:40px !important;
line-height:40px !important;
padding:8px 14px !important;
margin:8px auto 14px !important;
font-size:13px !important;
border-radius:12px !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
color:#f5f5f5 !important;
}
/* League label pills (AL/NL HOME, AL/NL RIVALS) */
.mlb-directory .label-pill{
display:block !important;
width:100% !important;
text-align:center !important;
min-height:36px !important;
line-height:36px !important;
padding:0 10px !important;
font-size:12px !important;
letter-spacing:.02em !important;
border-radius:10px !important;
margin:6px auto 10px !important;
}
/* Division headers (AL EAST, NL WEST, …) */
.mlb-directory .divisions-grid > a:first-child{
display:inline-block !important;
background:#1a1a1a !important;
border:1px solid rgba(255,255,255,.18) !important;
border-radius:10px !important;
padding:6px 12px !important;
margin:4px auto 8px !important;
text-align:center !important;
font-weight:700 !important;
font-size:13px !important;
text-transform:uppercase;
width:auto !important;
/* prevent "NL CENTRAL" wrap */
white-space:nowrap !important;
min-width:112px !important;
}
/* Press colors (mobile): Home = blue, Rivals = red */
.mlb-directory a[href*="-mlb-home-locker"]:active,
.mlb-directory a[href*="-home-locker"]:active,
.mlb-directory .divisions-grid > a:first-child[href*="-home"]:active{
background:#162030 !important;
color:#40a0ff !important;
border-color:rgba(64,160,255,.45) !important;
box-shadow:0 0 0 2px rgba(64,160,255,.18) !important,
0 0 18px rgba(64,160,255,.4) !important;
}
.mlb-directory a[href*="-mlb-rival-locker"]:active,
.mlb-directory a[href*="-rival-locker"]:active,
.mlb-directory .divisions-grid > a:first-child[href*="-rivals"]:active{
background:#2a1a1a !important;
color:#ff3838 !important;
border-color:rgba(255,56,56,.45) !important;
box-shadow:0 0 0 2px rgba(255,56,56,.18) !important,
0 0 18px rgba(255,56,56,.4) !important;
}
/* Diamondbacks: mobile sizing */
.mlb-directory a[href*="diamondbacks"] {
width:auto !important;
max-width:95% !important;
margin:0 auto !important;
padding:10px 6px !important;
}
.mlb-directory a[href*="diamondbacks"]::after {
font-size:14px !important;
line-height:1.35 !important;
}
}
/* Tiny phones (≤360px) */
@media (max-width:360px){
.mlb-directory .divisions-grid a{
font-size:12px !important;
padding:8px 4px !important;
max-width:95% !important;
}
.mlb-directory .label-pill{
font-size:11px !important;
line-height:32px !important;
min-height:32px !important;
}
}/* Make mobile team pills taller and easier to tap */
@media (max-width:780px){
#wnba-directory .team-link{
min-height:48px !important; /* taller tap target */
line-height:48px !important;
font-size:14px !important; /* slightly larger text */
border-radius:14px !important;
}
}
/* ===============================
DESKTOP LAYOUT – USE NBA VERSION
=============================== */
@media (min-width:781px){
/* 4-column grid of team pills */
.mlb-directory .divisions-grid{
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:10px !important;
row-gap:10px !important;
padding-top:0 !important;
text-align:initial !important;
}
.mlb-directory .divisions-grid a{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:34px !important;
line-height:34px !important;
padding:0 14px !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
background:#151515 !important;
border:1px solid rgba(255,255,255,.14) !important;
border-radius:12px !important;
box-shadow:none !important;
transform:none !important;
margin:0 !important;
}
/* Division headers span full row */
.mlb-directory .divisions-grid > a:first-child{
grid-column:1 / -1 !important;
background:#111 !important;
border-color:rgba(255,255,255,.22) !important;
font-weight:800 !important;
min-height:34px !important;
line-height:34px !important;
padding:0 12px !important;
margin-top:5px !important; /* little buffer above header */
}
/* Diamondbacks: desktop sizing */
.mlb-directory a[href*="diamondbacks"] {
padding: 0 14px !important;
min-width: auto !important;
}
.mlb-directory a[href*="diamondbacks"]::after {
font-size:14px !important;
line-height:34px !important; /* matches pill height */
}
/* League Section Pills – desktop rectangles (NBA style) */
.mlb-directory .section-pill{
min-height:44px !important;
line-height:44px !important;
padding:0 32px !important;
margin:10px auto 20px !important;
border-radius:10px !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
text-transform:uppercase;
letter-spacing:.14em;
font-size:11px;
font-weight:600;
color:#f5f5f5 !important;
min-width:320px !important;
max-width:420px !important;
}
/* Center conference label pills in cards */
.mlb-directory .home-card .label-pill,
.mlb-directory .rivals-card .label-pill {
display:flex !important;
align-items:center !important;
justify-content:center !important;
text-align:center !important;
width:100% !important;
margin:6px auto 10px !important;
}
/* Extra buffer below division’s last team */
.mlb-directory .divisions-grid a:not(:first-child):last-of-type {
margin-bottom:6px !important;
}
}
/* ===============================
HOVER / ACTIVE COLORS (DESKTOP)
=============================== */
@media (hover:hover) and (pointer:fine){
/* HOME team/division pills = blue */
.mlb-directory .divisions-grid a[href*="-mlb-home-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-home-locker"]:hover,
.mlb-directory .divisions-grid > a:first-child[href*="-home"]:hover{
background:#1a1f27 !important;
border-color:rgba(64,160,255,.55) !important;
outline:2px solid rgba(64,160,255,.35) !important;
outline-offset:0 !important;
box-shadow:none !important;
}
/* RIVALS team/division pills = red */
.mlb-directory .divisions-grid a[href*="-mlb-rival-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-rival-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-rivals"]:hover,
.mlb-directory .divisions-grid > a:first-child[href*="-rivals"]:hover{
background:#241718 !important;
border-color:rgba(255,56,56,.55) !important;
outline:2px solid rgba(255,56,56,.35) !important;
outline-offset:0 !important;
box-shadow:none !important;
}
/* Division headers hover glow inside Home/Rivals cards */
.mlb-directory .home-card .divisions-grid > a:first-child:hover {
background:#1a1f27 !important;
border-color:rgba(64,160,255,.65) !important;
box-shadow:
0 0 0 1px rgba(64,160,255,.35) !important,
0 0 12px rgba(64,160,255,.85) !important;
}
.mlb-directory .rivals-card .divisions-grid > a:first-child:hover {
background:#241718 !important;
border-color:rgba(255,56,56,.65) !important;
box-shadow:
0 0 0 1px rgba(255,56,56,.35) !important,
0 0 12px rgba(255,56,56,.85) !important;
}
/* Section pills hover (league-wide Home / Rivals buttons) */
.mlb-directory .section-pill[href*="home-locker"]:hover {
background:#1a1f27 !important;
border-color:rgba(64,160,255,.65) !important;
box-shadow:0 0 14px rgba(64,160,255,1) !important;
color:#fff !important;
}
.mlb-directory .section-pill[href*="rivals-locker"]:hover,
.mlb-directory .section-pill[href*="rival-locker"]:hover {
background:#241718 !important;
border-color:rgba(255,56,56,.65) !important;
box-shadow:0 0 14px rgba(255,56,56,1) !important;
color:#fff !important;
}
}
/* Tap / active feedback for conference labels (cards) */
.mlb-directory .home-card > div > a:active,
.mlb-directory .home-card .divisions-grid > a:first-child:active {
background:#162030 !important;
color:#40a0ff !important;
border-color:rgba(64,160,255,.45) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.18) !important,
0 0 18px rgba(64,160,255,.4) !important;
}
.mlb-directory .rivals-card > div > a:active,
.mlb-directory .rivals-card .divisions-grid > a:first-child:active {
background:#2a1a1a !important;
color:#ff3838 !important;
border-color:rgba(255,56,56,.45) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.18) !important,
0 0 18px rgba(255,56,56,.4) !important;
}
/* Keep pill text white on hover/active */
.mlb-directory .divisions-grid a:hover,
.mlb-directory .divisions-grid a:active,
.mlb-directory .home-card > div > a:hover,
.mlb-directory .home-card > div > a:active,
.mlb-directory .rivals-card > div > a:hover,
.mlb-directory .rivals-card > div > a:active {
color:#fff !important;
}
/* ================================
WNBA conference header glow
(match NBA/MLB look & spacing)
================================ */
/* Base header link (Eastern/Western … Home/Rivals) */
.wnba-directory .home-card > div > a,
.wnba-directory .rivals-card > div > a{
display: inline-block !important;
background: transparent !important;
border: 0 !important;
padding: 10px 26px !important; /* same pill size as NBA/MLB */
margin: 0 auto 18px !important; /* breathing room below header */
color: #ddd !important;
text-decoration: none !important;
border-radius: 50px !important; /* pill silhouette for the glow mask */
transition: box-shadow .20s ease, text-shadow .20s ease, color .20s ease !important;
}
/* Desktop hover glow */
@media (hover:hover) and (pointer:fine){
/* HOME = blue */
.wnba-directory .home-card > div > a:hover{
color:#fff !important;
background: rgba(64,160,255,.15) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.45) inset,
0 0 20px rgba(64,160,255,.85) !important;
}
/* RIVALS = red */
.wnba-directory .rivals-card > div > a:hover{
color:#fff !important;
background: rgba(255,56,56,.15) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.45) inset,
0 0 20px rgba(255,56,56,.90) !important;
}
}
/* Keyboard focus (accessibility) */
.wnba-directory .home-card > div > a:focus-visible{
outline:2px solid rgba(64,160,255,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
.wnba-directory .rivals-card > div > a:focus-visible{
outline:2px solid rgba(255,56,56,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
/* Mobile tap feedback */
@media (max-width:780px){
.wnba-directory .home-card > div > a:active{
color:#40a0ff !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28) inset, 0 0 18px rgba(64,160,255,.55) !important;
}
.wnba-directory .rivals-card > div > a:active{
color:#ff3838 !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28) inset, 0 0 18px rgba(255,56,56,.55) !important;
}
}
/* Safety: keep these centered on every card */
.wnba-directory .home-card > div > a,
.wnba-directory .rivals-card > div > a{
margin-left:auto !important;
margin-right:auto !important;
}/* ================================
WNBA – match NBA pill + glow exactly
(stronger specificity + !important everywhere)
================================ */
/* Base header links (Eastern/Western … Home/Rivals) */
.wnba-directory .home-card > div > a,
.wnba-directory .rivals-card > div > a,
.wnba-directory .home-card > div > a.label-pill,
.wnba-directory .rivals-card > div > a.label-pill{
display:inline-block !important;
text-decoration:none !important;
color:#ddd !important;
/* pill silhouette + size (NBA match) */
padding:12px 28px !important;
border-radius:9999px !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
/* spacing (NBA match) */
margin:0 auto 18px !important;
/* reset any prior shadows/outlines */
box-shadow:none !important;
outline:0 !important;
transition:
box-shadow .20s ease,
color .20s ease,
background-color .20s ease !important;
/* keep centered */
margin-left:auto !important;
margin-right:auto !important;
}
/* Desktop hover glow = IDENTICAL recipe to NBA */
@media (hover:hover) and (pointer:fine){
/* HOME (blue) */
.wnba-directory .home-card > div > a:hover,
.wnba-directory .home-card > div > a.label-pill:hover{
color:#fff !important;
background:rgba(64,160,255,.15) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.45) inset,
0 0 20px rgba(64,160,255,.85) !important;
}
/* RIVALS (red) */
.wnba-directory .rivals-card > div > a:hover,
.wnba-directory .rivals-card > div > a.label-pill:hover{
color:#fff !important;
background:rgba(255,56,56,.15) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.45) inset,
0 0 20px rgba(255,56,56,.90) !important;
}
}
/* Keyboard focus (accessibility) */
.wnba-directory .home-card > div > a:focus-visible,
.wnba-directory .home-card > div > a.label-pill:focus-visible{
outline:2px solid rgba(64,160,255,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
.wnba-directory .rivals-card > div > a:focus-visible,
.wnba-directory .rivals-card > div > a.label-pill:focus-visible{
outline:2px solid rgba(255,56,56,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
/* Mobile tap feedback (same as NBA/MLB) */
@media (max-width:780px){
.wnba-directory .home-card > div > a:active,
.wnba-directory .home-card > div > a.label-pill:active{
color:#40a0ff !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.28) inset,
0 0 18px rgba(64,160,255,.55) !important;
}
.wnba-directory .rivals-card > div > a:active,
.wnba-directory .rivals-card > div > a.label-pill:active{
color:#ff3838 !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.28) inset,
0 0 18px rgba(255,56,56,.55) !important;
}
}/* ==== WNBA — copy NBA header pill glow & spacing (FINAL OVERRIDES) ==== */
/* Base: treat the conference header like a pill even if it's or */
.wnba-directory .home-card > div > a,
.wnba-directory .home-card > div > span,
.wnba-directory .home-card > div > strong,
.wnba-directory .home-card .label-pill,
.wnba-directory .rivals-card > div > a,
.wnba-directory .rivals-card > div > span,
.wnba-directory .rivals-card > div > strong,
.wnba-directory .rivals-card .label-pill{
display:inline-block !important;
background:transparent !important;
border:0 !important;
padding:12px 28px !important; /* pill size = NBA */
margin:0 auto 18px !important; /* breathing room under header */
color:#ddd !important;
text-decoration:none !important;
border-radius:9999px !important; /* pill silhouette for glow mask */
transition:box-shadow .20s ease, text-shadow .20s ease, color .20s ease !important;
line-height:1.2 !important;
}
/* Keep them centered no matter what */
.wnba-directory .home-card,
.wnba-directory .rivals-card{ text-align:center !important; }
.wnba-directory .home-card > div > a,
.wnba-directory .home-card > div > span,
.wnba-directory .home-card > div > strong,
.wnba-directory .rivals-card > div > a,
.wnba-directory .rivals-card > div > span,
.wnba-directory .rivals-card > div > strong{
margin-left:auto !important; margin-right:auto !important;
}
/* Desktop hover glow — EXACT NBA look */
@media (hover:hover) and (pointer:fine){
/* HOME = blue */
.wnba-directory .home-card > div > a:hover,
.wnba-directory .home-card > div > span:hover,
.wnba-directory .home-card > div > strong:hover,
.wnba-directory .home-card .label-pill:hover{
color:#fff !important;
background:rgba(64,160,255,.15) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.45) inset,
0 0 20px rgba(64,160,255,.90) !important;
text-shadow:0 0 10px rgba(64,160,255,.90) !important;
}
/* RIVALS = red */
.wnba-directory .rivals-card > div > a:hover,
.wnba-directory .rivals-card > div > span:hover,
.wnba-directory .rivals-card > div > strong:hover,
.wnba-directory .rivals-card .label-pill:hover{
color:#fff !important;
background:rgba(255,56,56,.15) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.45) inset,
0 0 20px rgba(255,56,56,.90) !important;
text-shadow:0 0 10px rgba(255,56,56,.95) !important;
}
}
/* Keyboard focus for accessibility (matches NBA/MLB) */
.wnba-directory .home-card > div > a:focus-visible{
outline:2px solid rgba(64,160,255,.65) !important; outline-offset:2px !important; color:#fff !important;
}
.wnba-directory .rivals-card > div > a:focus-visible{
outline:2px solid rgba(255,56,56,.65) !important; outline-offset:2px !important; color:#fff !important;
}
/* Mobile tap feedback */
@media (max-width:780px){
.wnba-directory .home-card > div > a:active,
.wnba-directory .home-card > div > span:active{
color:#40a0ff !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28) inset, 0 0 18px rgba(64,160,255,.55) !important;
}
.wnba-directory .rivals-card > div > a:active,
.wnba-directory .rivals-card > div > span:active{
color:#ff3838 !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28) inset, 0 0 18px rgba(255,56,56,.55) !important;
}
}/* ================================
WNBA — match NBA pill glow + spacing
and custom 3×3 / 3-over-4 grids
================================ */
/* Treat the conference headers like glowing pills */
#wnba-directory .home-card > div > a.label-pill,
#wnba-directory .rivals-card > div > a.label-pill{
display:inline-block !important;
background:transparent !important;
border:0 !important;
padding:12px 28px !important; /* pill size (matches NBA) */
margin:0 auto 18px !important; /* spacing below header */
color:#ddd !important;
text-decoration:none !important;
border-radius:9999px !important; /* pill silhouette for glow mask */
line-height:1.2 !important;
transition:box-shadow .2s ease, text-shadow .2s ease, color .2s ease !important;
}
/* Keep headers centered no matter what */
#wnba-directory .home-card,
#wnba-directory .rivals-card{ text-align:center !important; }
#wnba-directory .home-card > div > a.label-pill,
#wnba-directory .rivals-card > div > a.label-pill{ margin-left:auto !important; margin-right:auto !important; }
/* Desktop hover glow = EXACT NBA look */
@media (hover:hover) and (pointer:fine){
/* HOME = blue */
#wnba-directory .home-card > div > a.label-pill:hover{
color:#fff !important;
background:rgba(64,160,255,.15) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.45) inset,
0 0 20px rgba(64,160,255,.90) !important;
text-shadow:0 0 10px rgba(64,160,255,.90) !important;
}
/* RIVALS = red */
#wnba-directory .rivals-card > div > a.label-pill:hover{
color:#fff !important;
background:rgba(255,56,56,.15) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.45) inset,
0 0 20px rgba(255,56,56,.95) !important;
text-shadow:0 0 10px rgba(255,56,56,.95) !important;
}
}
/* Keyboard focus parity with NBA/MLB */
#wnba-directory .home-card > div > a.label-pill:focus-visible{
outline:2px solid rgba(64,160,255,.65) !important; outline-offset:2px !important; color:#fff !important;
}
#wnba-directory .rivals-card > div > a.label-pill:focus-visible{
outline:2px solid rgba(255,56,56,.65) !important; outline-offset:2px !important; color:#fff !important;
}
/* Mobile tap feedback */
@media (max-width:780px){
#wnba-directory .home-card > div > a.label-pill:active{
color:#40a0ff !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28) inset, 0 0 18px rgba(64,160,255,.55) !important;
}
#wnba-directory .rivals-card > div > a.label-pill:active{
color:#ff3838 !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28) inset, 0 0 18px rgba(255,56,56,.55) !important;
}
}
/* ---------- Team grid layouts ---------- */
/* 3 × 3 grid (Eastern has 6 teams -> 3 over 3) */
#wnba-directory .divisions-grid.grid-3-3{
display:grid !important;
grid-template-columns:repeat(3, minmax(0,1fr)) !important;
gap:12px !important;
}
/* 3 over 4 grid (Western has 7 teams -> 3 top, 4 bottom) */
#wnba-directory .divisions-grid.grid-3-4{
display:grid !important;
grid-template-columns:repeat(4, minmax(0,1fr)) !important;
gap:12px !important;
position:relative !important;
}
/* Invisible spacer to reserve the 4th slot on the first row */
#wnba-directory .divisions-grid.grid-3-4::before{
content:"" !important;
display:block !important;
grid-column:4 !important; /* occupy col 4 in row 1 */
height:0 !important;
margin:0 !important;
padding:0 !important;
pointer-events:none !important;
visibility:hidden !important;
}
/* Style team links as pills (same family as other leagues) */
#wnba-directory .divisions-grid .team-link{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:34px !important;
line-height:34px !important;
padding:0 14px !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
background:#151515 !important;
border:1px solid rgba(255,255,255,.14) !important;
border-radius:12px !important;
}
/* WNBA: keep conference header pills on a single line (desktop/tablet only) */
@media (min-width: 781px){
#wnba-directory .label-pill{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
/* prevent wrapping */
white-space: nowrap !important;
text-wrap: nowrap !important; /* modern browsers */
word-break: normal !important;
/* avoid width constraints from parents */
width: auto !important;
max-width: none !important;
min-width: 0 !important;
flex: 0 0 auto !important;
align-self: center !important;
/* optional: a touch less horizontal padding if you want more room */
padding-left: 22px !important;
padding-right: 22px !important;
}
}
/* Mobile: stack cleanly */
@media (max-width:780px){
#wnba-directory .divisions-grid.grid-3-3,
#wnba-directory .divisions-grid.grid-3-4{
display:block !important;
}
#wnba-directory .divisions-grid.grid-3-4::before{ display:none !important; }
}
/* ===============================
WNBA – Team pill hover & bottom glow fix
=============================== */
/* Smooth uniform border & subtle base shadow */
#wnba-directory .team-link {
position: relative !important;
background: #151515 !important;
border: 1px solid rgba(255,255,255,0.14) !important;
border-radius: 12px !important;
color: #ddd !important;
box-shadow:
0 1px 2px rgba(255,255,255,0.05) inset,
0 0 6px rgba(255,255,255,0.08) !important; /* base even highlight */
transition: all 0.2s ease-in-out !important;
}
/* ======================
Desktop Hover Effects
====================== */
@media (hover:hover) and (pointer:fine){
/* HOME teams = blue glow */
#wnba-directory .home-card .team-link:hover {
color: #fff !important;
background: rgba(64,160,255,0.15) !important;
border-color: rgba(64,160,255,0.45) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,0.35) inset,
0 0 14px rgba(64,160,255,0.85) !important;
}
/* RIVALS teams = red glow */
#wnba-directory .rivals-card .team-link:hover {
color: #fff !important;
background: rgba(255,56,56,0.15) !important;
border-color: rgba(255,56,56,0.45) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,0.35) inset,
0 0 14px rgba(255,56,56,0.85) !important;
}
}
/* ======================
Mobile Tap Feedback
====================== */
@media (max-width:780px){
#wnba-directory .home-card .team-link:active {
color:#40a0ff !important;
box-shadow:
0 0 0 2px rgba(64,160,255,0.28) inset,
0 0 18px rgba(64,160,255,0.55) !important;
}
#wnba-directory .rivals-card .team-link:active {
color:#ff3838 !important;
box-shadow:
0 0 0 2px rgba(255,56,56,0.28) inset,
0 0 18px rgba(255,56,56,0.55) !important;
}
}/* =========================================
WNBA — Mobile: vertical, even team list
(one team per row, centered & full-width-ish)
========================================= */
@media (max-width:780px){
/* Force any grids to stack cleanly on mobile */
#wnba-directory .divisions-grid,
#wnba-directory .divisions-grid.grid-3-3,
#wnba-directory .divisions-grid.grid-3-4{
display:block !important;
}
/* Kill the fake spacer used for 3-over-4 on desktop */
#wnba-directory .divisions-grid.grid-3-4::before{
display:none !important;
}
/* One team per row, same width for every item */
#wnba-directory .divisions-grid .team-link{
display:block !important;
width:92% !important; /* nice breathing room on sides */
max-width:520px !important; /* keeps things tidy on big phones */
margin:0 auto 10px !important; /* evenly spaced stack */
text-align:center !important;
/* keep pill look consistent with desktop */
min-height:auto !important;
line-height:1.35 !important;
padding:12px 12px !important;
border-radius:12px !important;
background:#151515 !important;
border:1px solid rgba(255,255,255,.14) !important;
box-shadow:
0 1px 2px rgba(255,255,255,.05) inset,
0 0 6px rgba(255,255,255,.08) !important;
}
#wnba-directory .divisions-grid .team-link:last-child{
margin-bottom:0 !important;
}
/* Keep conference header pills single-line & centered */
#wnba-directory .home-card > div > a.label-pill,
#wnba-directory .rivals-card > div > a.label-pill{
display:inline-block !important;
white-space:nowrap !important; /* no wrapping “Eastern …” */
margin:6px auto 12px !important;
padding:10px 20px !important;
border-radius:9999px !important;
}/* =========================================================
WNBA — MOBILE FORCE STACK (one team per row, vertical)
Highest-specificity, grid/flex killer. Desktop untouched.
========================================================= */
@media (max-width:780px){
/* 1) Kill any grid/flex/inline-flex at the container level */
#wnba-directory .divisions-grid{
display:block !important;
grid-template-columns:initial !important;
grid-auto-flow:initial !important;
gap:0 !important;
row-gap:0 !important;
column-gap:0 !important;
flex-wrap:nowrap !important;
align-items:stretch !important;
justify-content:initial !important;
}
/* 2) If a 3-over-4 spacer exists, hide it */
#wnba-directory .divisions-grid.grid-3-4::before{
display:none !important;
content:none !important;
}
/* 3) Force **every child** to be a full-width block */
#wnba-directory .divisions-grid > *,
#wnba-directory .divisions-grid > * > a{
/* neutralize layout */
display:block !important;
float:none !important;
clear:both !important;
flex:none !important;
grid-column:auto !important;
/* width + spacing */
width:92% !important;
max-width:520px !important;
margin:0 auto 10px !important;
box-sizing:border-box !important;
/* make it look like your desktop pills */
text-align:center !important;
padding:12px 12px !important;
line-height:1.35 !important;
border-radius:12px !important;
background:#151515 !important;
border:1px solid rgba(255,255,255,.14) !important;
color:#ddd !important;
box-shadow:
0 1px 2px rgba(255,255,255,.05) inset,
0 0 6px rgba(255,255,255,.08) !important;
/* prevent odd truncation */
white-space:normal !important;
overflow:visible !important;
text-overflow:clip !important;
}
/* 4) Keep the division header pill inline-sized & centered */
#wnba-directory .divisions-grid > a:first-child,
#wnba-directory .divisions-grid > li:first-child > a{
display:inline-block !important;
width:auto !important;
max-width:none !important;
margin:6px auto 12px !important;
padding:10px 20px !important;
border-radius:9999px !important;
background:#1a1a1a !important;
border:1px solid rgba(255,255,255,.18) !important;
font-weight:700 !important;
white-space:nowrap !important;
}
/* 5) Remove extra bottom gap on the last team */
#wnba-directory .divisions-grid > *:last-child,
#wnba-directory .divisions-grid > *:last-child > a{
margin-bottom:0 !important;
}
/* 6) Mobile tap feedback matches your scheme */
#wnba-directory .home-card .divisions-grid > *:active,
#wnba-directory .home-card .divisions-grid > * > a:active{
color:#40a0ff !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28) inset,
0 0 18px rgba(64,160,255,.55) !important;
}
#wnba-directory .rivals-card .divisions-grid > *:active,
#wnba-directory .rivals-card .divisions-grid > * > a:active{
color:#ff3838 !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28) inset,
0 0 18px rgba(255,56,56,.55) !important;
}
}/* ===============================
WNBA — EXACT TWO-COLUMN LAYOUT
(Eastern left / Western right; teams stacked)
Keeps all existing styles; layout only.
=============================== */
/* Desktop/tablet: 2 columns */
@media (min-width:781px){
/* A wrapper that holds the two columns */
.wnba-directory .two-col {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 20px !important;
align-items: start !important;
}
/* Make each conference column stack its items top→bottom */
.wnba-directory .east-col .divisions-grid,
.wnba-directory .west-col .divisions-grid {
display: block !important; /* kill any 3x3 or 3-over-4 grids */
}
/* Force each team entry onto its own line in the column */
.wnba-directory .east-col .divisions-grid > * ,
.wnba-directory .west-col .divisions-grid > * {
display: block !important; /* works for , , wrappers */
width: 100% !important;
max-width: 100% !important;
grid-column: 1 / -1 !important; /* safe no-op when not grid */
margin-left: 0 !important;
margin-right: 0 !important;
}
/* Division header inside each column stays inline-sized pill */
.wnba-directory .east-col .divisions-grid > a:first-child,
.wnba-directory .west-col .divisions-grid > a:first-child {
display: inline-block !important; /* keep the small header pill look */
width: auto !important;
max-width: none !important;
margin: 6px auto 10px !important; /* centered header in the column */
}
}
/* Mobile: collapse to a single column in order (East first, West next) */
@media (max-width:780px){
.wnba-directory .two-col {
display: block !important;
}
.wnba-directory .east-col,
.wnba-directory .west-col {
margin-bottom: 14px !important;
}
}/* WNBA conference buttons (Eastern/Western Rivals) */
.wnba-conference-box {
text-align: center;
margin-bottom: 10px;
}
.wnba-conference-link {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 20px;
height: 40px;
border-radius: 999px;
background: #151515;
border: 1px solid rgba(255,255,255,.45);
color: #fff;
font-weight: 800;
letter-spacing: .04em;
text-transform: uppercase;
text-decoration: none;
line-height: 1;
transition: all .18s ease;
}
/* hover / focus glow */
.wnba-conference-link:hover,
.wnba-conference-link:focus-visible {
border-color: #ffffff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 8px 22px rgba(0,0,0,.55);
transform: translateY(-1px);
outline: none;
}/* ========== WNBA RIVALS ROW ========== */
.wnba-rivals-row{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:32px;
margin:28px auto 40px;
max-width:1120px;
}
/* Card container */
.wnba-rivals-card{
background:#111;
border-radius:24px;
padding:22px 26px 20px;
box-sizing:border-box;
max-width:520px;
width:100%;
box-shadow:0 18px 40px rgba(0,0,0,.45);
}
/* Conference title pill (fully clickable) */
.wnba-rivals-title{
display:inline-flex;
align-items:center;
justify-content:center;
padding:0 26px;
height:40px;
margin:0 auto 18px;
border-radius:999px;
background:#151515;
border:1px solid rgba(255,255,255,.45);
color:#fff;
font-weight:800;
letter-spacing:.04em;
text-transform:uppercase;
text-decoration:none;
line-height:1;
transition:all .18s ease;
position:relative;
z-index:5; /* sits above anything in the card */
}
/* Hover/focus */
.wnba-rivals-title:hover,
.wnba-rivals-title:focus-visible{
border-color:#fff;
box-shadow:0 0 0 2px rgba(255,255,255,.30),
0 10px 22px rgba(0,0,0,.55);
transform:translateY(-1px);
outline:none;
}
/* Team pills grid */
.wnba-rivals-teams{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
}
/* Team pills themselves */
.wnba-rivals-team-pill{
display:flex;
align-items:center;
justify-content:center;
min-height:34px;
padding:0 12px;
border-radius:999px;
background:#151515;
border:1px solid rgba(255,255,255,.20);
color:#fff;
font-size:12px;
font-weight:600;
letter-spacing:.03em;
text-transform:capitalize;
text-decoration:none;
transition:all .16s ease;
}
.wnba-rivals-team-pill:hover,
.wnba-rivals-team-pill:focus-visible{
border-color:rgba(255,255,255,.55);
box-shadow:0 0 0 2px rgba(255,255,255,.16);
transform:translateY(-1px);
outline:none;
}
/* ---------- Mobile tweaks ---------- */
@media (max-width:780px){
.wnba-rivals-row{
flex-direction:column;
gap:24px;
padding:0 12px;
margin:22px auto 32px;
}
.wnba-rivals-card{
max-width:100%;
padding:18px 16px 18px;
}
.wnba-rivals-title{
font-size:12px;
padding:0 18px;
margin-bottom:14px;
}
.wnba-rivals-teams{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.wnba-rivals-team-pill{
font-size:11px;
padding:0 10px;
}
}/* HARD FIX – make WNBA conference header pills fully clickable */
#wnba-directory .card {
position: relative !important;
}
#wnba-directory .card-inner {
position: relative !important;
}
/* If any decorative pseudo-elements exist, they can't block clicks */
#wnba-directory .card-inner::before,
#wnba-directory .card-inner::after {
pointer-events: none !important;
}
/* Eastern/Western Home/Rivals pills: sit above everything */
#wnba-directory .label-pill {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
position: relative !important;
z-index: 10 !important;
pointer-events: auto !important;
cursor: pointer !important;
}
}/* --- WNBA conference header pills: force full clickable area --- */
/* Make the header pills sit on top and behave like proper buttons */
#wnba-directory .card.home-card .label-pill,
#wnba-directory .card.rivals-card .label-pill {
position: relative !important;
z-index: 5 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
padding: 12px 28px !important;
min-height: 40px !important;
pointer-events: auto !important;
}
/* Make sure the team grids sit *under* the header pill and don't steal clicks */
#wnba-directory .card.home-card,
#wnba-directory .card.rivals-card {
position: relative !important;
}
#wnba-directory .card.home-card .grid-east,
#wnba-directory .card.home-card .grid-west,
#wnba-directory .card.rivals-card .grid-east,
#wnba-directory .card.rivals-card .grid-west {
position: relative !important;
z-index: 1 !important;
pointer-events: auto !important;
}
}
#fw-section-custom-html-bbacd22f-ca7e-41de-a1bc-6d7de3e2e67a {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-cc239888-86f3-495c-9fb7-49489f04eb12 {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-0655365c-fbba-4f90-a3a8-edb58521f1ab {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 0 !important; /* we now handle spacing from parent block */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules (keep dropdown above header) === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
}
/* === PREMIUM LOCKER - Gold Button === */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37;
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85);
transform: translateY(-1px);
color: #ffffff;
}
/* === SEASONAL LOCKER - White Hollow Button === */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff;
border: 1px solid #ffffff;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9);
background: rgba(255, 255, 255, 0.08);
transform: translateY(-1px);
}
/* === TEAM SEARCH block wrapper === */
#tf-team-search-block {
margin: 28px auto 28px !important; /* adds space above & below the whole block */
text-align: center;
}
/* === TEAM SEARCH title === */
.tf-team-search-title {
margin: 0 0 20px !important; /* increased from 12px → 20px for cleaner spacing */
font-size: 18px;
letter-spacing: 0.18em;
text-transform: uppercase;
}
/* === Remove search wrapper margin (handled by parent) === */
#tf-header-search {
margin-top: 0 !important;
margin-bottom: 0 !important;
}/* TEAM SEARCH block: title + search bar */
#tf-team-search-block {
margin: 12px auto 24px !important; /* reduced top spacing */
text-align: center;
}
/* TEAM SEARCH heading */
.tf-team-search-title {
margin: 0 0 20px !important;
font-size: 18px;
letter-spacing: 0.18em;
text-transform: uppercase;
}
}
#fw-section-custom-html-084b0795-4baa-47ce-89d1-80dcb0e75008 {
/* ==========================
LEAGUE DIRECTORY BUTTONS – FINAL
========================== */
/* Section wrapper: extra breathing room so pills never look cut off */
#tf-league-directory {
margin-top: 16px !important;
margin-bottom: 120px !important; /* big push above footer */
padding-bottom: 32px !important;
}
/* Desktop / tablet – 4 across */
#tf-league-directory .tf-league-grid {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 18px !important;
max-width: 760px !important;
margin: 20px auto 0 !important;
}
/* Base button style – rectangular, not oval */
#tf-league-directory .tf-league-btn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 14px 24px !important;
border-radius: 10px !important; /* <-- rectangle with soft corners */
background: #050505 !important;
border: 1px solid rgba(255,255,255,0.30) !important;
color: #ffffff !important;
font-size: 12px !important;
font-weight: 600 !important;
letter-spacing: 0.14em !important;
text-transform: uppercase !important;
text-decoration: none !important;
box-shadow:
0 0 0 1px rgba(255,255,255,0.06),
0 8px 20px rgba(0,0,0,0.70) !important;
transition: all 0.18s ease-out !important;
}
/* Hover – WHITE glow (desktop only) */
@media (hover:hover) and (pointer:fine) {
#tf-league-directory .tf-league-btn:hover {
background: #141414 !important;
border-color: #ffffff !important;
box-shadow:
0 0 10px rgba(255,255,255,1),
0 0 26px rgba(255,255,255,0.80),
inset 0 0 10px rgba(255,255,255,0.45) !important;
}
}
/* Mobile – stack vertically, still rectangular */
@media (max-width: 480px) {
#tf-league-directory .tf-league-grid {
grid-template-columns: 1fr !important;
max-width: 320px !important;
margin-top: 16px !important;
}
#tf-league-directory .tf-league-btn {
padding: 16px 20px !important; /* a bit taller for thumbs */
}
}
/* ==========================
TEAM SEARCH HEADROOM
========================== */
/* Desktop: pull the bar closer to "TEAM SEARCH" */
@media (min-width: 769px) {
#tf-header-search {
margin-top: -10px !important; /* negative = tighter gap */
margin-bottom: 16px !important;
padding-bottom: 0 !important;
}
}/* ======================================================
FINAL VERTICAL SPACING FIX FOR LEAGUE DIRECTORY
====================================================== */
/* Desktop + Tablet */
@media (min-width: 769px) {
/* Reduce empty space ABOVE pills */
#tf-league-directory {
margin-top: 0px !important;
padding-top: 0px !important;
}
/* Reduce empty space BELOW pills (stop footer clipping) */
#tf-league-directory {
margin-bottom: 16px !important;
padding-bottom: 6px !important;
}
}
/* Mobile */
@media (max-width: 768px) {
#tf-league-directory {
margin-top: 4px !important;
padding-top: 0 !important;
margin-bottom: 24px !important;
padding-bottom: 4px !important;
}
}/* ============================================
MICRO TIGHTEN — REMOVE EXTRA TOP SPACE
============================================ */
@media (min-width: 769px) {
#tf-league-directory {
margin-top: -10px !important; /* pulls pills up tighter */
padding-top: 0 !important;
}
}
@media (max-width: 768px) {
#tf-league-directory {
margin-top: -6px !important; /* subtle but clean on mobile */
padding-top: 0 !important;
}
}/* ============================
FINAL DESKTOP TOP REDUCTION
============================ */
@media (min-width: 769px) {
#tf-league-directory {
margin-top: -6px !important; /* subtle lift */
}
}/* ==========================
DESKTOP – FINAL LEAGUE BLOCK SPACING
========================== */
@media (min-width: 769px) {
/* Pull the whole league section closer to the search bar */
section:has(#tf-league-directory) {
margin-top: 0 !important;
padding-top: 0 !important;
}
/* Fine-tune the pills block itself */
#tf-league-directory {
margin-top: -20px !important; /* tighten gap under search bar */
margin-bottom: 32px !important; /* space before footer */
padding-top: 0 !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-custom-html-5a71b7b9-e420-4d0e-8a6d-2a1c591a043d {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-7d79c287-d760-4176-a53c-f7a31407d0a6 {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-e58c043f-a6de-4546-aac6-7073815f98d4 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-rich-text-532d86fc-8672-4dde-944d-f799e374c866 {
/* Resize the section heading */
section h2,
.rich-text h2 {
font-size: 20px !important; /* adjust down until it matches the second screenshot */
line-height: 1.2em !important;
font-weight: 600; /* keeps it bold but not oversized */
}
}
#fw-section-collections-list-1b79dc2d-c352-4e7b-8542-1481fd97c39b {
/* Centered text + hover glow for collection cards (all devices) */
.collections-list a[href*="/collections/"] {
display: inline-flex;
flex-direction: column;
align-items: center;
text-align: center;
transition: transform 0.25s ease, box-shadow 0.25s ease;
border-radius: 12px;
}
.collections-list a[href*="/collections/"]:hover {
transform: translateY(-4px);
box-shadow: 0 0 18px rgba(255, 0, 0, 0.6),
0 0 36px rgba(255, 0, 0, 0.3);
}
/* MOBILE: shrink & center all cards */
@media (max-width: 768px) {
.collections-list {
text-align: center !important;
}
/* shrink card width and center it */
.collections-list a[href*="/collections/"] {
width: 85% !important;
max-width: 260px !important;
margin: 14px auto 10px !important;
}
/* make sure images scale nicely */
.collections-list img {
width: 100% !important;
height: auto !important;
border-radius: 12px !important;
display: block !important;
}
/* titles under cards */
.collections-list .collection-card__title {
font-size: 12px !important;
margin-top: 6px !important;
line-height: 1.3 !important;
text-align: center !important;
}
}
}
#fw-section-custom-html-e79cd247-b986-4d80-b1a5-f8c150f24e7b {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-76e7543d-cfe8-4620-bc66-0a4f999ca25a {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-79af5ede-c5bd-4d49-b743-dd42099ec51c {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-custom-html-3a1bb681-e4bb-4f9e-adae-d2fd1fd9fce9 {
/* ===============================
NFL Sitemap – TRASH FANZ
=============================== */
/* Remove underlines in both MLB & NFL directories */
.mlb-directory a,
.mlb-directory a:hover,
.mlb-directory a:active,
.mlb-directory a:focus,
.nfl-directory a,
.nfl-directory a:hover,
.nfl-directory a:active,
.nfl-directory a:focus {
text-decoration: none !important;
}
/* ===============================
MOBILE (≤ 780px)
=============================== */
@media (max-width: 780px){
/* Stack each division vertically and center contents */
.nfl-directory .divisions-grid{
display:block !important;
padding-top:4px !important;
row-gap:6px !important;
text-align:center !important;
}
/* Team links become clean centered rows */
.nfl-directory .divisions-grid a{
display:block !important;
background:transparent !important;
border:0 !important;
border-radius:0 !important;
min-height:auto !important;
line-height:1.35 !important;
padding:10px 6px !important;
margin:0 auto !important;
font-size:14px !important;
letter-spacing:.02em !important;
color:#ddd !important;
text-align:center !important;
justify-content:center !important;
white-space:normal !important; /* allow wrapping */
box-shadow:none !important;
transform:none !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
max-width:90% !important; /* neat centered column */
}
.nfl-directory .divisions-grid a:last-child{
border-bottom:0 !important;
}
/* Section pills (NFL Home Lockers / Rivals Lockers) – mobile */
.nfl-directory .section-pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
margin:8px auto 14px !important;
min-height:40px !important;
padding:8px 16px !important;
font-size:13px !important;
border-radius:10px !important;
text-align:center !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
color:#f5f5f5 !important;
}
/* Conference label pills (NFC HOME, AFC RIVALS, etc.) */
.nfl-directory .label-pill{
display:block !important;
width:100% !important;
text-align:center !important;
min-height:36px !important;
line-height:36px !important;
padding:0 10px !important;
font-size:12px !important;
letter-spacing:.02em !important;
border-radius:10px !important;
margin:6px auto 10px !important;
}
/* Division header pills (NFC EAST, AFC WEST, etc.) */
.nfl-directory .divisions-grid > a:first-child{
display:inline-block !important;
background:#1a1a1a !important;
border:1px solid rgba(255,255,255,.18) !important;
border-radius:10px !important;
padding:6px 12px !important;
margin:4px auto 8px !important;
text-align:center !important;
font-weight:700 !important;
font-size:13px !important;
text-transform:uppercase;
width:auto !important;
min-width:90px;
}
/* Tap colors (mobile): Home = blue, Rivals = red */
.nfl-directory a[href*="home-locker"]:active,
.nfl-directory a[href*="-home"]:active {
background:#162030 !important;
color:#40a0ff !important;
border-color:rgba(64,160,255,.45) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.18) !important,
0 0 18px rgba(64,160,255,.4) !important;
}
.nfl-directory a[href*="rivals-locker"]:active,
.nfl-directory a[href*="-rivals"]:active {
background:#2a1a1a !important;
color:#ff3838 !important;
border-color:rgba(255,56,56,.45) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.18) !important,
0 0 18px rgba(255,56,56,.4) !important;
}
}
/* Universal tap feedback */
.nfl-directory a:active{
transform:scale(.97) !important;
filter:brightness(0.88) !important;
}
/* Tiny legacy phones (≤360px) */
@media (max-width:360px){
.nfl-directory .divisions-grid a{
font-size:12px !important;
padding:8px 4px !important;
max-width:95% !important;
}
.nfl-directory .label-pill{
font-size:11px !important;
line-height:32px !important;
min-height:32px !important;
}
}
/* ===============================
DESKTOP BASE (≥ 781px)
=============================== */
@media (min-width:781px){
/* Divisions grid layout */
.nfl-directory .divisions-grid{
display:grid !important;
grid-template-columns:repeat(5,minmax(0,1fr)) !important;
gap:10px !important;
row-gap:10px !important;
padding-top:0 !important;
text-align:initial !important;
}
/* Team / division pills */
.nfl-directory .divisions-grid a{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:34px !important;
line-height:34px !important;
padding:0 10px !important; /* slightly tighter */
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
background:#151515 !important;
border:1px solid rgba(255,255,255,.14) !important;
border-radius:12px !important;
box-shadow:none !important;
transform:none !important;
margin:0 !important;
font-size:13px !important; /* lets long names fit */
}
/* Division headers (NFC EAST, AFC WEST, etc.) */
.nfl-directory .divisions-grid > a:first-child{
background:#111 !important;
border-color:rgba(255,255,255,.22) !important;
font-weight:800 !important;
min-height:34px !important;
line-height:34px !important;
padding:0 12px !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* NFC HOME / AFC HOME / NFC RIVALS / AFC RIVALS label pills */
.nfl-directory .label-pill{
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:100% !important;
margin:6px auto 12px !important;
min-height:34px !important;
line-height:34px !important;
font-size:13px !important;
border-radius:10px !important;
background:#111 !important;
border:1px solid rgba(255,255,255,.18) !important;
white-space:nowrap !important;
transition:all .2s ease-in-out !important;
}
/* Section jump pills – NFL Home Lockers / NFL Rivals Lockers on desktop */
.nfl-directory .section-pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:40px !important;
line-height:40px !important;
padding:0 26px !important;
margin:10px auto 18px !important;
border-radius:12px !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
text-transform:uppercase;
letter-spacing:.14em;
font-size:11px;
font-weight:600;
color:#f5f5f5 !important;
}
/* Tiny fit fix just for "Commanders" (home + rivals) */
.nfl-directory a[href*="commanders"]{
font-size:12px !important;
padding:0 10px !important;
letter-spacing:.01em !important;
}
}
/* ===============================
DESKTOP HOVER EFFECTS
=============================== */
@media (hover:hover) and (pointer:fine){
/* TEAM / DIVISION pills – Home = blue, Rivals = red (unchanged) */
.nfl-directory .divisions-grid a[href*="home-locker"]:hover,
.nfl-directory .divisions-grid a[href*="-home"]:hover{
background:#1a1f27 !important;
border-color:rgba(64,160,255,.55) !important;
box-shadow:none !important;
outline:2px solid rgba(64,160,255,.35) !important;
outline-offset:0 !important;
}
.nfl-directory .divisions-grid a[href*="rivals-locker"]:hover,
.nfl-directory .divisions-grid a[href*="-rivals"]:hover{
background:#241718 !important;
border-color:rgba(255,56,56,.55) !important;
box-shadow:none !important;
outline:2px solid rgba(255,56,56,.35) !important;
outline-offset:0 !important;
}
/* Conference label pills – NFC/AFC HOME & RIVALS (what you already liked) */
/* HOME labels – vivid blue glow */
.nfl-directory .label-pill[href*="home-locker"]:hover{
background:#102444 !important;
border-color:#3da0ff !important;
box-shadow:
0 0 10px rgba(64,160,255,.9),
0 0 25px rgba(64,160,255,.75),
inset 0 0 14px rgba(64,160,255,.5) !important;
color:#fff !important;
}
/* RIVALS labels – vivid red glow */
.nfl-directory .label-pill[href*="rivals-locker"]:hover{
background:#3a0e0e !important;
border-color:#ff4040 !important;
box-shadow:
0 0 10px rgba(255,56,56,.9),
0 0 25px rgba(255,56,56,.75),
inset 0 0 14px rgba(255,56,56,.5) !important;
color:#fff !important;
}
/* NEW: top section pills – NFL Home Lockers / NFL Rivals Lockers */
/* NFL Home Lockers – blue glow */
.nfl-directory .section-pill[href*="nfl-home-locker"]:hover{
background:#102444 !important;
border-color:#3da0ff !important;
box-shadow:
0 0 10px rgba(64,160,255,.9),
0 0 25px rgba(64,160,255,.75),
inset 0 0 14px rgba(64,160,255,.5) !important;
color:#fff !important;
}
/* NFL Rivals Lockers – red glow */
.nfl-directory .section-pill[href*="nfl-rivals-locker"]:hover{
background:#3a0e0e !important;
border-color:#ff4040 !important;
box-shadow:
0 0 10px rgba(255,56,56,.9),
0 0 25px rgba(255,56,56,.75),
inset 0 0 14px rgba(255,56,56,.5) !important;
color:#fff !important;
}
}
/* Keep label text white when active as well */
.nfl-directory .label-pill:active{
color:#fff !important;
}
/* ==========================
REFINEMENT – Top Section Pills
========================== */
/* Limit width and balance padding on desktop */
@media (min-width:781px){
.nfl-directory .section-pill{
padding:0 18px !important;
min-width:260px !important; /* moderate pill width */
max-width:320px !important;
}
}
/* Mobile stays full width for easy tapping */
@media (max-width:780px){
.nfl-directory .section-pill{
width:80% !important;
max-width:340px !important;
}
}/* ==========================================
FIX: Top row NFC / AFC EAST not hovering
Reason: overlap / stacking at some zooms
========================================== */
/* Give the whole NFL directory its own stacking context */
.nfl-directory{
position: relative;
z-index: 0;
}
/* Desktop-only, since this bug is showing up there */
@media (min-width: 781px){
/* Ensure the divisions grid + individual team pills
sit above any labels or other wrappers */
.nfl-directory .divisions-grid{
position: relative;
z-index: 2;
}
.nfl-directory .divisions-grid a{
position: relative;
z-index: 3;
pointer-events: auto; /* always clickable / hoverable */
}
/* Put label and section pills *below* the teams in the stack */
.nfl-directory .label-pill,
.nfl-directory .section-pill{
position: relative;
z-index: 1;
}
/* Small extra breathing room under the NFC/AFC RIVALS labels.
This helps even if the overlap is only 1–2px at certain zooms. */
.nfl-directory .label-pill{
margin-bottom: 14px !important;
}
}
}
#fw-section-custom-html-e70a2581-2630-4f52-80df-34e46653130d {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-cc2e763e-619c-438f-be00-a2ec13d6b4be {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-09b37b91-6c2e-4aca-8fd2-0b88ab8af506 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-rich-text-0c4df878-9d54-4716-88d1-ca4486c5a8d0 {
/* Resize the section heading for Home Locker */
section h2,
.rich-text h2 {
font-size: 20px !important; /* matches Rival Locker */
line-height: 1.2em !important;
font-weight: 600; /* keeps bold look */
}
}
#fw-section-collections-list-77eced40-0700-4e38-82d6-af0f4959bac6 {
/* Centered text + hover glow for collection cards (all devices) */
.collections-list a[href*="/collections/"] {
display: inline-flex;
flex-direction: column;
align-items: center;
text-align: center;
transition: transform 0.25s ease, box-shadow 0.25s ease;
border-radius: 12px;
}
.collections-list a[href*="/collections/"]:hover {
transform: translateY(-4px);
box-shadow: 0 0 18px rgba(255, 0, 0, 0.6),
0 0 36px rgba(255, 0, 0, 0.3);
}
/* MOBILE: shrink & center all cards */
@media (max-width: 768px) {
.collections-list {
text-align: center !important;
}
/* shrink card width and center it */
.collections-list a[href*="/collections/"] {
width: 85% !important;
max-width: 260px !important;
margin: 14px auto 10px !important;
}
/* make sure images scale nicely */
.collections-list img {
width: 100% !important;
height: auto !important;
border-radius: 12px !important;
display: block !important;
}
/* titles under cards */
.collections-list .collection-card__title {
font-size: 12px !important;
margin-top: 6px !important;
line-height: 1.3 !important;
text-align: center !important;
}
}
}
#fw-section-custom-html-c69e6d48-927b-4a16-8e81-91bb4df14772 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-1e71fdd1-0221-4773-8821-abe5b1fdddbf {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-1cde2a46-1c28-4ffd-888c-2ed8f6b62d0e {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-custom-html-cdc4af0a-47d3-4ab8-bc2f-18cf0ebf1801 {
/* ===============================
MLB Sitemap / Directory — ONE BLOCK
=============================== */
/* Base: remove link underlines + center whole block */
.mlb-directory,
.mlb-directory * { box-sizing: border-box; }
.mlb-directory { text-align: center !important; }
.mlb-directory a,
.mlb-directory a:hover,
.mlb-directory a:active,
.mlb-directory a:focus { text-decoration: none !important; }
/* ---------- Shared pills (section/league/labels) ---------- */
.mlb-directory .section-pill,
.mlb-directory .league-pill,
.mlb-directory .al-home-pill,
.mlb-directory .nl-home-pill,
.mlb-directory .al-rivals-pill,
.mlb-directory .nl-rivals-pill,
.mlb-directory .label-pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:40px !important;
line-height:1.2 !important;
padding:8px 16px !important;
margin:10px auto 14px !important;
border-radius:12px !important;
background:#141414 !important;
border:1px solid rgba(255,255,255,.25) !important;
color:#f5f5f5 !important;
white-space:nowrap !important;
text-transform:uppercase;
letter-spacing:.05em;
transition:all .25s ease-in-out !important;
}
/* Hover glow (desktop pointers) */
@media (hover:hover) and (pointer:fine){
.mlb-directory .section-pill:hover,
.mlb-directory .league-pill:hover,
.mlb-directory .al-home-pill:hover,
.mlb-directory .nl-home-pill:hover,
.mlb-directory .al-rivals-pill:hover,
.mlb-directory .nl-rivals-pill:hover,
.mlb-directory .label-pill:hover{
color:#fff !important;
border-color:#fff !important;
box-shadow:
0 0 6px rgba(255,255,255,.45),
0 0 22px rgba(255,255,255,.35) !important;
transform:translateY(-1px);
}
}
/* Universal tap feedback */
.mlb-directory a:active{
transform:scale(.97) !important;
filter:brightness(.88) !important;
}
/* ----- Division grids + headers ----- */
.mlb-directory .divisions-grid{
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:10px !important;
row-gap:10px !important;
padding-top:0 !important;
text-align:initial !important;
}
.mlb-directory .divisions-grid a{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:34px !important;
line-height:34px !important;
padding:0 14px !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
background:#151515 !important;
border:1px solid rgba(255,255,255,.14) !important;
border-radius:12px !important;
box-shadow:none !important;
transform:none !important;
margin:0 !important;
}
/* Division headers inside each grid card */
.mlb-directory .divisions-grid > a:first-child{
display:flex !important;
align-items:center !important;
justify-content:center !important;
grid-column:1 / -1 !important;
width:100% !important;
margin:0 0 8px !important;
background:#111 !important;
border-color:rgba(255,255,255,.22) !important;
font-weight:800 !important;
min-height:34px !important;
line-height:34px !important;
padding:0 12px !important;
text-transform:uppercase;
}
/* ----- Team layout inside a division: 3 on top / 2 below ----- */
.mlb-directory .division-teams{
display:grid !important;
grid-template-columns:repeat(3, minmax(0,1fr));
column-gap:12px;
row-gap:12px;
justify-items:center;
}
.mlb-directory .division-teams .team-pill{
width:100%;
max-width:160px;
justify-content:center;
text-align:center;
}
/* ----- Long-name handling (Arizona Diamondbacks → D-BACKS) ----- */
.mlb-directory a[href*="diamondbacks"]{
position:relative; color:transparent !important;
}
.mlb-directory a[href*="diamondbacks"]::after{
content:"D-BACKS";
position:absolute; inset:0;
display:flex; align-items:center; justify-content:center;
color:#fff !important; font:inherit; letter-spacing:.02em !important;
text-transform:uppercase !important;
}
/* ----- Label long/short swap ----- */
.mlb-directory .label-short{ display:none; }
.mlb-directory .label-long{ display:inline; }
/* ---------- Desktop hover color hints for team pills ---------- */
@media (hover:hover) and (pointer:fine){
/* HOME = blue */
.mlb-directory .divisions-grid a[href*="-mlb-home-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-home-locker"]:hover,
.mlb-directory .divisions-grid > a:first-child[href*="-home"]:hover{
background:#1a1f27 !important;
border-color:rgba(64,160,255,.55) !important;
outline:2px solid rgba(64,160,255,.35) !important;
outline-offset:0 !important;
}
/* RIVALS = red */
.mlb-directory .divisions-grid a[href*="-mlb-rival-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-rival-locker"]:hover,
.mlb-directory .divisions-grid a[href*="-rivals"]:hover,
.mlb-directory .divisions-grid > a:first-child[href*="-rivals"]:hover{
background:#241718 !important;
border-color:rgba(255,56,56,.55) !important;
outline:2px solid rgba(255,56,56,.35) !important;
outline-offset:0 !important;
}
}
/* ==================================
RESPONSIVE
================================== */
/* Desktop refinements (≥781px) */
@media (min-width:781px){
.mlb-directory a[href*="diamondbacks"]{ padding:0 14px !important; }
.mlb-directory a[href*="diamondbacks"]::after{
font-size:14px !important; line-height:34px !important;
}
/* Section pills sizing on desktop */
.mlb-directory .section-pill{
min-height:40px !important; line-height:40px !important;
padding:0 20px !important; margin:10px auto 18px !important;
min-width:260px !important; max-width:320px !important;
letter-spacing:.14em; font-size:11px; font-weight:600;
}
}
/* Mobile (≤780px) */
@media (max-width:780px){
/* Stack each division vertically and center contents */
.mlb-directory .divisions-grid{
display:block !important;
padding-top:4px !important;
row-gap:6px !important;
text-align:center !important;
}
/* Team links as full-width rows */
.mlb-directory .divisions-grid a{
display:block !important;
background:transparent !important;
border:0 !important; border-radius:0 !important;
min-height:auto !important; line-height:1.35 !important;
padding:10px 6px !important; margin:0 auto !important;
font-size:14px !important; letter-spacing:.02em !important; color:#ddd !important;
text-align:center !important; justify-content:center !important;
white-space:normal !important; box-shadow:none !important; transform:none !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
max-width:90% !important;
}
.mlb-directory .divisions-grid a:last-child{ border-bottom:0 !important; }
/* Division headers → centered pill on mobile */
.mlb-directory .divisions-grid > a:first-child{
display:inline-flex !important; align-items:center !important; justify-content:center !important;
margin:4px auto 8px !important; width:auto !important;
background:#1a1a1a !important; border:1px solid rgba(255,255,255,.18) !important;
border-radius:10px !important; padding:6px 12px !important;
font-weight:700 !important; font-size:13px !important; text-transform:uppercase; white-space:nowrap !important;
min-width:112px !important; grid-column:auto !important;
}
/* Top “Home/Rivals” pills */
.mlb-directory .section-pill{ width:80% !important; max-width:340px !important; }
/* League label pills */
.mlb-directory .label-pill{ width:auto !important; max-width:90% !important; }
/* Label swaps */
.mlb-directory .label-long{ display:none !important; }
.mlb-directory .label-short{ display:inline !important; }
/* Diamondbacks label sizing */
.mlb-directory a[href*="diamondbacks"]{
width:auto !important; max-width:95% !important; margin:0 auto !important; padding:10px 6px !important;
}
.mlb-directory a[href*="diamondbacks"]::after{ font-size:14px !important; line-height:1.35 !important; }
}
/* Tiny phones (≤360px) */
@media (max-width:360px){
.mlb-directory .divisions-grid a{ font-size:12px !important; padding:8px 4px !important; max-width:95% !important; }
.mlb-directory .label-pill{ font-size:11px !important; line-height:32px !important; min-height:32px !important; }
}
/* === OVERRIDES (append at end) =================================== */
/* 1) Desktop: force 4 columns in each division grid so the header pill
exactly matches the row of 4 team pills below it */
@media (min-width:781px){
.mlb-directory .divisions-grid{
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
}
/* division header spans the whole 4-col row */
.mlb-directory .divisions-grid > a:first-child{
grid-column: 1 / -1 !important;
}
}
/* 2) Correct hover colors (stop the white glow) */
/* -- League label pills (American/National) ----------------------- */
/* HOME = blue */
@media (hover:hover) and (pointer:fine){
.mlb-directory .home-card > div > a.label-pill:hover{
background:#102444 !important;
border-color:#3da0ff !important;
box-shadow:
0 0 10px rgba(64,160,255,.90),
0 0 25px rgba(64,160,255,.75),
inset 0 0 14px rgba(64,160,255,.50) !important;
color:#fff !important;
}
/* RIVALS = red */
.mlb-directory .rivals-card > div > a.label-pill:hover{
background:#3a0e0e !important;
border-color:#ff4040 !important;
box-shadow:
0 0 10px rgba(255,56,56,.90),
0 0 25px rgba(255,56,56,.75),
inset 0 0 14px rgba(255,56,56,.50) !important;
color:#fff !important;
}
/* -- Big section pills at the top ("MLB Home Lockers" / "MLB Rivals Lockers") */
.mlb-directory .section-pill[href*="mlb-home-locker"]:hover{
background:#1a1f27 !important;
border-color:rgba(64,160,255,.65) !important;
box-shadow:0 0 14px rgba(64,160,255,1) !important;
color:#fff !important;
}
.mlb-directory .section-pill[href*="mlb-rivals-locker"]:hover{
background:#241718 !important;
border-color:rgba(255,56,56,.65) !important;
box-shadow:0 0 14px rgba(255,56,56,1) !important;
color:#fff !important;
}
}
/* 3) Keep pills centered everywhere */
.mlb-directory .section-pill,
.mlb-directory .label-pill{
margin-left:auto !important;
margin-right:auto !important;
}/* === FORCE DIVISION HEADERS TO SPAN THE 4-COLUMN GRID === */
.mlb-directory .divisions-grid{
/* safety: lock to 4 cols no matter what inline styles say */
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
/* The first link inside each division grid is the header (e.g., "AL EAST") */
.mlb-directory .divisions-grid > a:first-child{
grid-column: 1 / -1 !important; /* span all 4 columns */
justify-self: stretch !important; /* fill the grid area’s width */
align-self: center !important;
display: block !important;
width: 100% !important;
max-width: none !important; /* defeat any global caps */
margin: 0 0 8px !important;
}
/* Keep header styling consistent (desktop) */
@media (min-width: 781px){
.mlb-directory .divisions-grid > a:first-child{
background:#111 !important;
border:1px solid rgba(255,255,255,.22) !important;
border-radius:12px !important;
min-height:34px !important;
line-height:34px !important;
font-weight:800 !important;
text-transform:uppercase;
}
}
/* Mobile rules already switch headers to centered chips;
make sure desktop rule above overrides them */
@media (max-width:780px){
.mlb-directory .divisions-grid > a:first-child{
width:auto !important; /* keep your mobile chip look */
justify-self:center !important;
}
}
/* Optional: if any global styles target links broadly, add extra specificity */
.mlb-directory .home-card .divisions-grid > a:first-child,
.mlb-directory .rivals-card .divisions-grid > a:first-child{
width:100% !important;
justify-self:stretch !important;
}/* ===============================
MLB: make conference headings text-links (like NBA)
=============================== */
/* Desktop */
@media (min-width:781px){
/* Remove pill look on the card headings */
.mlb-directory .home-card .label-pill,
.mlb-directory .rivals-card .label-pill{
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
min-height: auto !important;
line-height: 1.35 !important;
padding: 0 !important;
margin: 6px 0 12px !important;
display: inline-block !important;
/* Typography for “category title” look */
font-weight: 600 !important;
letter-spacing: .02em !important;
text-transform: none !important;
color: #ddd !important;
}
/* Hover feedback stays blue/red, no box */
.mlb-directory .home-card .label-pill:hover,
.mlb-directory .home-card .label-pill:focus{
color: #8fbcff !important;
text-shadow: 0 0 8px rgba(64,160,255,.6) !important;
outline: none !important;
}
.mlb-directory .rivals-card .label-pill:hover,
.mlb-directory .rivals-card .label-pill:focus{
color: #ff6a6a !important;
text-shadow: 0 0 8px rgba(255,56,56,.6) !important;
outline: none !important;
}
}
/* Mobile */
@media (max-width:780px){
.mlb-directory .home-card .label-pill,
.mlb-directory .rivals-card .label-pill{
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
min-height: auto !important;
line-height: 1.35 !important;
padding: 0 !important;
margin: 6px 0 10px !important;
display: inline-block !important;
font-size: 14px !important;
font-weight: 600 !important;
color: #ddd !important;
}
.mlb-directory .home-card .label-pill:active{
color: #8fbcff !important;
text-shadow: 0 0 8px rgba(64,160,255,.55) !important;
}
.mlb-directory .rivals-card .label-pill:active{
color: #ff6a6a !important;
text-shadow: 0 0 8px rgba(255,56,56,.55) !important;
}
}/* === MLB HEADER ILLUMINATED PILL STYLE (match NBA) === */
.mlb-directory .home-card > div > a,
.mlb-directory .rivals-card > div > a {
display:inline-block !important;
padding:10px 26px !important;
border-radius:50px !important;
transition:all .25s ease-in-out !important;
margin-bottom:18px !important; /* extra breathing room */
}
/* Blue Home glow */
.mlb-directory .home-card > div > a:hover {
background:rgba(64,160,255,.15) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.45) inset,
0 0 20px rgba(64,160,255,.85) !important;
color:#fff !important;
}
/* Red Rivals glow */
.mlb-directory .rivals-card > div > a:hover {
background:rgba(255,56,56,.15) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.45) inset,
0 0 20px rgba(255,56,56,.9) !important;
color:#fff !important;
}/* =========================================
MLB headers = EXACT NBA look/feel
(American/National • Home/Rivals headings)
========================================= */
/* Reset the MLB header links to “text-with-pill-glow” like NBA */
.mlb-directory .home-card > div > a,
.mlb-directory .rivals-card > div > a{
display:inline-block !important;
background:transparent !important;
border:0 !important;
/* match NBA spacing */
padding:10px 26px !important;
margin:0 auto 18px !important;
/* pill silhouette for the glow */
border-radius:999px !important;
color:#ddd !important;
text-decoration:none !important;
/* kill any earlier shadows/outlines */
box-shadow:none !important;
outline:0 !important;
transition: box-shadow .18s ease, text-shadow .18s ease, color .18s ease !important;
}
/* Desktop hover: same glow as NBA */
@media (hover:hover) and (pointer:fine){
/* HOME = blue */
.mlb-directory .home-card > div > a:hover{
color:#fff !important;
/* same two-layer ring + soft fill as NBA */
box-shadow:
0 0 0 2px rgba(64,160,255,.35) inset,
0 0 14px rgba(64,160,255,.85) !important;
text-shadow:0 0 10px rgba(64,160,255,.90) !important;
}
/* RIVALS = red */
.mlb-directory .rivals-card > div > a:hover{
color:#fff !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.35) inset,
0 0 14px rgba(255,56,56,.90) !important;
text-shadow:0 0 10px rgba(255,56,56,.95) !important;
}
}
/* Keyboard focus (accessibility) — same as NBA */
.mlb-directory .home-card > div > a:focus-visible{
outline:2px solid rgba(64,160,255,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
.mlb-directory .rivals-card > div > a:focus-visible{
outline:2px solid rgba(255,56,56,.65) !important;
outline-offset:2px !important;
color:#fff !important;
}
/* Mobile tap feedback — same colors as NBA */
@media (max-width:780px){
.mlb-directory .home-card > div > a:active{
color:#40a0ff !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28) inset,
0 0 18px rgba(64,160,255,.55) !important;
}
.mlb-directory .rivals-card > div > a:active{
color:#ff3838 !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28) inset,
0 0 18px rgba(255,56,56,.55) !important;
}
}/* === MLB: match NBA header pill glow + spacing === */
/* Base: make the header text behave like a pill (same as NBA) */
.mlb-directory .home-card > div > a,
.mlb-directory .rivals-card > div > a{
display: inline-block !important;
background: transparent !important;
border: 0 !important;
padding: 10px 26px !important; /* same pill size as NBA */
margin: 0 auto 18px !important; /* extra breathing room under header */
color: #ddd !important;
border-radius: 50px !important; /* rounded pill edge */
transition: box-shadow .18s ease, text-shadow .18s ease, color .18s ease !important;
}
/* Nuke any older white-glow/box styles that might still win */
.mlb-directory .home-card .label-pill:hover,
.mlb-directory .rivals-card .label-pill:hover{
box-shadow: none !important;
border-color: transparent !important;
}
/* Desktop hover glow — identical values to NBA */
@media (hover:hover) and (pointer:fine){
/* HOME = blue */
.mlb-directory .home-card > div > a:hover{
color:#fff !important;
box-shadow:
inset 0 0 0 2px rgba(64,160,255,.35),
0 0 14px rgba(64,160,255,.85) !important;
text-shadow: 0 0 10px rgba(64,160,255,.90) !important;
}
/* RIVALS = red */
.mlb-directory .rivals-card > div > a:hover{
color:#fff !important;
box-shadow:
inset 0 0 0 2px rgba(255,56,56,.35),
0 0 14px rgba(255,56,56,.90) !important;
text-shadow: 0 0 10px rgba(255,56,56,.95) !important;
}
}
/* Mobile tap feedback (same colors you liked) */
@media (max-width:780px){
.mlb-directory .home-card > div > a:active{
color:#40a0ff !important;
box-shadow:
inset 0 0 0 2px rgba(64,160,255,.28),
0 0 18px rgba(64,160,255,.55) !important;
}
.mlb-directory .rivals-card > div > a:active{
color:#ff3838 !important;
box-shadow:
inset 0 0 0 2px rgba(255,56,56,.28),
0 0 18px rgba(255,56,56,.55) !important;
}
}
/* Add a touch more space between header and the division grid */
.mlb-directory .home-card .divisions-grid,
.mlb-directory .rivals-card .divisions-grid{
margin-top: 12px !important;
}/* ===== MLB headers: match NBA pill glow exactly ===== */
/* Base pill look + spacing (desktop & mobile) */
.mlb-directory .home-card > div > a.label-pill,
.mlb-directory .rivals-card > div > a.label-pill{
display:inline-block !important;
padding:12px 28px !important; /* same thickness as NBA */
margin:10px auto 18px !important; /* same breathing room as NBA */
border-radius:9999px !important; /* fully rounded pill */
background:#141414 !important;
border:1px solid rgba(255,255,255,.14) !important;
color:#ddd !important;
text-decoration:none !important;
letter-spacing:.02em !important;
transition:box-shadow .22s ease, color .22s ease, background .22s ease !important;
box-shadow:none !important;
}
/* Desktop hover: HOME = blue */
@media (hover:hover) and (pointer:fine){
.mlb-directory .home-card > div > a.label-pill:hover{
color:#fff !important;
background:rgba(16, 28, 48, .85) !important; /* deep blue bed like NBA */
border-color:rgba(64,160,255,.45) !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.45) inset, /* inner ring */
0 6px 22px rgba(64,160,255,.35), /* outer bloom */
0 0 28px rgba(64,160,255,.55) !important; /* halo */
}
/* Desktop hover: RIVALS = red */
.mlb-directory .rivals-card > div > a.label-pill:hover{
color:#fff !important;
background:rgba(44, 10, 10, .88) !important; /* deep red bed like NBA */
border-color:rgba(255,56,56,.45) !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.45) inset,
0 6px 22px rgba(255,56,56,.35),
0 0 28px rgba(255,56,56,.55) !important;
}
}
/* Mobile tap feedback */
@media (max-width:780px){
.mlb-directory .home-card > div > a.label-pill:active{
color:#40a0ff !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.28) inset,
0 0 18px rgba(64,160,255,.55) !important;
}
.mlb-directory .rivals-card > div > a.label-pill:active{
color:#ff3838 !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.28) inset,
0 0 18px rgba(255,56,56,.55) !important;
}
}
/* Safety: defeat any earlier “text-only header” rules on MLB */
@media (min-width:0){
.mlb-directory .home-card .label-pill,
.mlb-directory .rivals-card .label-pill{
background:#141414 !important;
border:1px solid rgba(255,255,255,.14) !important;
border-radius:9999px !important;
padding:12px 28px !important;
margin:10px auto 18px !important;
}/* MLB mobile: hard-center the four small header pills (AL/NL HOME + RIVALS) */
@media (max-width:780px){
/* Section header pills like "AL HOME", "NL HOME", "AL RIVALS", "NL RIVALS" */
.mlb-directory .label-pill,
.mlb-directory .section-pill,
/* division header pills inside each card (e.g., AL EAST / NL EAST) */
.mlb-directory .divisions-grid > a:first-child{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
text-align:center !important;
/* kill any leftover width constraints that cause right-bias */
width:auto !important;
min-width:unset !important;
max-width:none !important;
/* balanced padding so the text sits dead center */
padding-left:22px !important;
padding-right:22px !important;
/* make sure they sit centered in their container */
margin-left:auto !important;
margin-right:auto !important;
}
/* some themes add odd inner spacing; normalize line height */
.mlb-directory .label-pill,
.mlb-directory .section-pill{
line-height:1 !important;
min-height:36px !important;
}
}/* MLB — Diamondbacks label: show "D-BACKS" on desktop, "Diamondbacks" on mobile */
@media (max-width:780px){
.mlb-directory a[href*="diamondbacks"]{
color: inherit !important; /* show the real text again */
}
.mlb-directory a[href*="diamondbacks"]::after{
content: none !important; /* kill the overlay label on mobile */
display: none !important;
}
}
/* (Desktop keeps the short label you already have)
.mlb-directory a[href*="diamondbacks"] { color: transparent !important; }
.mlb-directory a[href*="diamondbacks"]::after { content:"D-BACKS"; ... }
*/
}.mlb-directory a[href*="diamondbacks"]::after {
content: "D-backs";
text-transform: none !important; /* preserve the mixed-case look */
font-size: inherit !important;
font-weight: 500 !important;
letter-spacing: normal !important;
line-height: 1.2em !important;
}/* ===== MLB hub: make every team pill glow, never clip the glow ===== */
.mlb-hub .pill-row,
.mlb-hub .team-pills { overflow: visible !important; } /* stop shadow clipping */
.mlb-hub .pill-row a,
.mlb-hub .team-pills a {
position: relative;
display: inline-flex !important; /* keeps current size but centers contents */
align-items: center !important;
justify-content: center !important;
text-align: center !important;
}
/* unified hover/focus glow for ALL team pills (home + rivals) */
.mlb-hub .pill-row a:hover,
.mlb-hub .pill-row a:focus-visible,
.mlb-hub .team-pills a:hover,
.mlb-hub .team-pills a:focus-visible{
box-shadow: 0 0 0 2px rgba(255,255,255,.28), 0 0 24px rgba(255,255,255,.75) !important;
transform: translateY(-1px);
outline: none !important;
}/* ===== Center the text inside the league header pills (desktop only) ===== */
@media (min-width: 781px){
.mlb-hub .league-toggle a {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
vertical-align: middle !important;
line-height: 1 !important;
}/* ============================================
MLB DIRECTORY OVERRIDES
- Fix header pill centering/width
- Make ALL team pills glow (incl. White Sox + Reds)
============================================ */
/* 1) DESKTOP: widen + hard-center the 4 league header pills */
@media (min-width:781px){
.mlb-directory .home-card > div > a.label-pill,
.mlb-directory .rivals-card > div > a.label-pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
text-align:center !important;
/* tweak these two if you want slightly bigger/smaller pills */
min-width:260px !important; /* makes room for the long titles */
padding:12px 32px !important;
line-height:1.2 !important;
}
}
/* 2) DESKTOP HOVER: color all team pills by card instead of URL
(this catches White Sox + Reds 100% of the time) */
@media (hover:hover) and (pointer:fine){
/* HOME = blue (left card) — every team link except the division header */
.mlb-directory .home-card .divisions-grid a:not(:first-child):hover{
background:#1a1f27 !important;
border-color:rgba(64,160,255,.55) !important;
outline:2px solid rgba(64,160,255,.35) !important;
outline-offset:0 !important;
color:#fff !important;
}
/* RIVALS = red (right card) — every team link except the division header */
.mlb-directory .rivals-card .divisions-grid a:not(:first-child):hover{
background:#241718 !important;
border-color:rgba(255,56,56,.55) !important;
outline:2px solid rgba(255,56,56,.35) !important;
outline-offset:0 !important;
color:#fff !important;
}
}/* ===== MLB Hub: guarantee glow on every team pill (incl. White Sox & Reds) ===== */
/* Base layout for any pill child (link, span, etc.) */
.mlb-hub .pill-row > *,
.mlb-hub .team-pills > * {
position: relative;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
}
/* Unified hover/focus glow for ALL pills */
.mlb-hub .pill-row > *:hover,
.mlb-hub .pill-row > *:focus-visible,
.mlb-hub .team-pills > *:hover,
.mlb-hub .team-pills > *:focus-visible {
box-shadow: 0 0 0 2px rgba(255,255,255,.28),
0 0 24px rgba(255,255,255,.75) !important;
transform: translateY(-1px);
outline: none !important;
}/* === EMERGENCY PATCH: make White Sox + Reds pills glow like the others === */
/* White Sox (any URL format) */
a[href*="white-sox"]:hover,
a[href*="whitesox"]:hover,
a[href*="white_sox"]:hover,
/* Reds (any URL format) */
a[href*="/reds"]:hover,
a[href*="-reds"]:hover,
a[href*="reds-mlb"]:hover {
box-shadow: 0 0 0 2px rgba(255,255,255,.28),
0 0 24px rgba(255,255,255,.75) !important;
transform: translateY(-1px);
outline: none !important;
}/* ==== FIX: full hover/click area for White Sox + Reds pills ==== */
.mlb-hub a[href*="white-sox-mlb-home-locker"],
.mlb-hub a[href*="reds-mlb-home-locker"]{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:34px !important;
line-height:34px !important;
padding:0 14px !important;
}/* ============================================
MLB DIRECTORY – FINAL HOVER/FULL-PILL FIX
(especially White Sox + Reds)
============================================ */
/* All team pills: make the sit on top and fill the pill box */
.mlb-directory .divisions-grid a{
position: relative !important;
z-index: 5 !important; /* above any overlapping layers */
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
}
/* Never let pseudo-elements steal hover/click */
.mlb-directory .divisions-grid a::before,
.mlb-directory .divisions-grid a::after{
pointer-events: none !important;
}
/* Belt-and-suspenders: make sure these two pills have a full-height box */
.mlb-directory .divisions-grid a[href*="white-sox-mlb-home-locker"],
.mlb-directory .divisions-grid a[href*="reds-mlb-home-locker"]{
min-height: 34px !important;
line-height: 34px !important;
padding: 0 14px !important;
}
}/* =======================================
DIAMONDBACKS LABEL FIX
- Desktop: show "D-backs" only
- Mobile: show "Diamondbacks" only
======================================= */
/* Desktop: hide real text, show centered "D-backs" overlay */
@media (min-width:781px){
.mlb-directory a[href*="diamondbacks"]{
position: relative !important;
color: transparent !important; /* hide "Diamondbacks" */
}
.mlb-directory a[href*="diamondbacks"]::after{
content: "D-backs" !important;
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
color: #fff !important;
font: inherit !important;
letter-spacing: .02em !important;
text-transform: none !important;
pointer-events: none !important; /* don’t block hover/click */
}
}
/* Mobile: use the real text, kill the overlay completely */
@media (max-width:780px){
.mlb-directory a[href*="diamondbacks"]{
color: inherit !important; /* show "Diamondbacks" */
}
.mlb-directory a[href*="diamondbacks"]::after{
content: none !important;
display: none !important;
}
}/* =======================================
FINAL DIAMONDBACKS / D-BACKS FIX
- Desktop: only show "D-backs"
- Mobile: only show "Diamondbacks"
======================================= */
/* Desktop (≥781px): hide real label completely, draw clean overlay */
@media (min-width:781px){
.mlb-directory a[href*="diamondbacks"]{
position: relative !important;
font-size: 0 !important; /* kill original "Diamondbacks" text */
color: transparent !important;
text-shadow: none !important;
}
.mlb-directory a[href*="diamondbacks"]::after{
content: "D-backs" !important;
position: absolute !important;
inset: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
/* visual style for the label */
font-size: 14px !important;
font-weight: 500 !important;
letter-spacing: .02em !important;
line-height: 1 !important;
color: #ffffff !important;
text-shadow: none !important;
pointer-events: none !important; /* don’t block hover/click */
}
}
/* Mobile (≤780px): show the normal "Diamondbacks" text, no overlay */
@media (max-width:780px){
.mlb-directory a[href*="diamondbacks"]{
font-size: 14px !important;
color: inherit !important;
text-shadow: none !important;
}
.mlb-directory a[href*="diamondbacks"]::after{
content: none !important;
display: none !important;
}
}/* ============================================
FINAL FIX — UNIFY TEAM PILL HOVER STYLES
(White Sox + Reds now match perfectly)
============================================ */
/* --- HOME CARD (left side) — blue glow for ALL team pills --- */
@media (hover:hover) and (pointer:fine){
.mlb-directory .home-card .divisions-grid a:not(:first-child):hover {
background: #1a1f27 !important;
border-color: rgba(64,160,255,.55) !important;
outline: 2px solid rgba(64,160,255,.35) !important;
outline-offset: 0 !important;
box-shadow:
0 0 0 2px rgba(64,160,255,.45) inset,
0 6px 22px rgba(64,160,255,.35),
0 0 28px rgba(64,160,255,.55) !important;
color: #fff !important;
}
}
/* --- RIVALS CARD (right side) — red glow for ALL team pills --- */
@media (hover:hover) and (pointer:fine){
.mlb-directory .rivals-card .divisions-grid a:not(:first-child):hover {
background: #241718 !important;
border-color: rgba(255,56,56,.55) !important;
outline: 2px solid rgba(255,56,56,.35) !important;
outline-offset: 0 !important;
box-shadow:
0 0 0 2px rgba(255,56,56,.45) inset,
0 6px 22px rgba(255,56,56,.35),
0 0 28px rgba(255,56,56,.55) !important;
color: #fff !important;
}
}
}
#fw-section-rich-text-e62b62a3-25d1-47e3-bf2e-fa025ed9bed4 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-ad9799d1-7ae8-41fb-adde-dedb4a5e18cc {
/* ============================================
TRASH FANZ – NFL HOME LOCKER PILL SYSTEM
(Quick-nav + division pills)
============================================ */
/* ===== Team pill containers (NFC + AFC) ===== */
.nfc-teams,
.afc-teams {
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
/* ===== Division pill grids (4 across) ===== */
.nfc-divisions-grid,
.afc-divisions-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 10px;
overflow: visible;
padding-top: 6px;
}
/* ===== Shared division pill style (Bills / Dolphins / etc.) ===== */
.nfc-chip,
.afc-chip {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 0.03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition:
box-shadow 0.18s ease,
transform 0.18s ease,
border-color 0.18s ease,
background 0.18s ease;
position: relative;
}
.nfc-chip:hover,
.afc-chip:hover {
transform: translateY(-1px);
border-color: rgba(255, 255, 255, 0.45);
background: #1f1f1f;
box-shadow:
0 0 0 2px rgba(255, 255, 255, 0.18),
0 10px 22px rgba(0, 0, 0, 0.35);
z-index: 5;
}
/* ===== QUICK NAV (FIND YOUR TEAM / NFL SITEMAP) ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: 0.03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255, 255, 255, 0.70);
transition: all 0.18s ease;
}
/* Hover / focus */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow:
0 0 0 2px rgba(255, 255, 255, 0.30),
0 0 24px rgba(255, 255, 255, 0.80);
transform: translateY(-1px);
outline: none;
}
/* ===== MOBILE (≤ 780px): 2 equal nav pills + tighter division pills ===== */
@media (max-width: 780px) {
/* Quick-nav: two equal buttons */
.nfl-quick-nav {
max-width: 300px;
margin: 10px auto 14px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 5px);
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 6px;
}
/* Division pills 4 across, slightly shorter */
.nfc-divisions-grid,
.afc-divisions-grid {
grid-template-columns: repeat(4, 1fr);
gap: 8px;
}
.nfc-chip,
.afc-chip {
min-height: 48px;
font-size: 12px;
letter-spacing: 0.02em;
padding: 0 8px;
}
}
/* ===== DESKTOP (≥ 781px): equal-width quick-nav ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center;
gap: 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px; /* matches AFC East Rivals look */
height: 46px;
}
}/* ===== AFC pills (scoped) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-36433022-53e5-4cf7-a9a5-ba3be954a1c9 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-cde280ff-25c6-40b5-a6ec-861e610b8a71 {
/* ===== AFC pills (scoped) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-2d769aa3-25ce-4062-8e90-84bd8224f621 {
/* ===== Mobile: two pills on one line (exact same width as team pills) ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 320px; /* matches your 4-pill grid width */
margin: 6px auto 10px; /* perfect vertical spacing */
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px; /* same gap as team pills */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 5px); /* same column math as 4-pill grid */
height: 42px;
font-size: 12px;
padding: 0 8px; /* matches team pill padding */
}
}
}
#fw-section-custom-html-a479b5bc-6658-4393-bf14-7aae0f41390f {
/* ===== AFC HOME DIVISIONS — fully scoped so nothing else interferes ===== */
/* Wrapper just for AFC Home Divisions */
.afc-teams.afc-home-divisions{
max-width: 840px;
margin: 14px auto 28px;
padding: 0 12px 24px; /* extra bottom padding so nothing gets cut */
box-sizing: border-box;
overflow: visible !important; /* show full glow + rounded corners */
position: relative;
isolation: isolate;
width: 100%;
}
/* Grid: 4 across (only inside AFC Home Divisions) */
.afc-home-divisions .afc-divisions-grid{
display: grid !important;
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
/* Pills (AFC Home only) */
.afc-home-divisions .afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative;
}
.afc-home-divisions .afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
.afc-home-divisions .afc-chip:focus-visible{
outline: none;
box-shadow: 0 0 0 3px rgba(255,255,255,.35),
0 10px 22px rgba(0,0,0,.35);
}
/* Mobile tweaks (AFC Home only) */
@media (max-width: 780px){
.afc-teams.afc-home-divisions{
padding: 0 10px 20px;
max-width: 640px;
}
.afc-home-divisions .afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr;
gap: 8px;
}
.afc-home-divisions .afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Quick Nav — scoped so it doesn't fight global .nfl-quick-nav ===== */
.afc-home-divisions .nfl-quick-nav{
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
.afc-home-divisions .nfl-nav-btn{
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.afc-home-divisions .nfl-nav-btn:hover,
.afc-home-divisions .nfl-nav-btn:focus-visible{
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* Mobile: two pills on one line (AFC Home only) */
@media (max-width: 780px){
.afc-home-divisions .nfl-quick-nav{
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.afc-home-divisions .nfl-nav-btn{
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* Desktop: centered & equal width (AFC Home only) */
@media (min-width: 781px){
.afc-home-divisions .nfl-quick-nav{
justify-content: center;
gap: 14px;
}
.afc-home-divisions .nfl-nav-btn{
flex: 0 0 240px;
height: 46px;
}
}.afc-home-divisions {
margin-bottom: 32px !important;
}
}
#fw-section-rich-text-13b4b820-c028-4cbf-8ea9-5f6d6d67b16e {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-94429ca7-5d1a-4604-b597-ffb55a04ce57 {
/* AFC North Home – scoped pills */
.afc-north-home{max-width:840px;margin:14px auto 22px;padding:0 12px;box-sizing:border-box;position:relative;isolation:isolate}
.afc-north-home .pill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;overflow:visible;padding-top:6px}
.afc-north-home .pill{
display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;width:100%;
min-height:56px;padding:0 12px;background:#151515;border:1px solid rgba(255,255,255,.14);
border-radius:12px;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.03em;
font-weight:800;font-size:14px;line-height:1.1;transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease,background .18s ease;position:relative
}
.afc-north-home .pill:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.45);background:#1f1f1f;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 10px 22px rgba(0,0,0,.35);z-index:5}
@media (max-width:780px){
.afc-north-home .pill-grid{grid-template-columns:repeat(4,1fr);gap:8px}
.afc-north-home .pill{min-height:48px;font-size:12px;letter-spacing:.02em;padding:0 8px}
}/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}/* === MOBILE QUICK-NAV WIDTH FIX (force exact fit) === */
@media (max-width:780px){
/* Tighten the quick-nav rail to match the pill rail below */
.nfl-quick-nav{
max-width: 300px !important; /* try 300–320; start at 300 for safest fit */
margin: 10px auto 14px !important;
display: flex !important;
flex-wrap: nowrap !important;
justify-content: space-between !important;
gap: 10px !important;
}
/* Make each button exactly half of the rail minus the gap */
.nfl-quick-nav .nfl-nav-btn{
flex: 0 0 calc(50% - 5px) !important;
width: auto !important; /* let flex sizing win */
height: 42px !important;
font-size: 12px !important;
padding: 0 6px !important;
}
}
}
#fw-section-rich-text-25b212ba-ea47-4f1f-a535-1a9071c650cc {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-444ff3ce-6f16-404f-9ff4-ecdc989b641f {
/* ===== AFC pills (scoped) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-e1749c8a-789d-4466-9cee-37deb2ed193a {
/* Only affects the text element’s own spacing */
.custom-rival-heading {
font-weight: 800;
text-transform: uppercase;
text-align: center;
letter-spacing: .06em;
color: #fff;
font-size: clamp(24px, 3vw, 42px);
line-height: 1.2;
/* Desktop/tablet spacing */
margin: 20px 0 10px; /* top 20, bottom 10 */
}
/* Mobile: pull pills closer to the title */
@media (max-width: 780px) {
.custom-rival-heading {
margin-bottom: 0;
}
}
}
#fw-section-custom-html-82ff2bcd-dca2-404a-b17a-fa231117646d {
/* ===== AFC HOME & RIVALS – PERFECTED LAYOUT ===== */
/* Wrapper */
.afc-divisions{
max-width: 840px;
margin: 24px auto 28px;
padding: 6px 12px;
box-sizing: border-box;
overflow-x: hidden;
}
/* 4-across grid (desktop + mobile) */
.afc-divisions-grid{
display: grid !important;
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 14px;
max-width: 100%;
overflow: visible;
box-sizing: border-box;
}
/* Pills */
.afc-chip{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
width:100%;
min-height:56px;
padding:0 12px;
background:#151515;
border:1px solid rgba(255,255,255,.14);
border-radius:12px;
color:#fff;
text-transform:uppercase;
letter-spacing:.03em;
font-weight:800;
font-size:14px;
line-height:1.1;
white-space:nowrap;
transition:box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
}
.afc-chip:hover{
transform:translateY(-1px);
border-color:rgba(255,255,255,.45);
background:#1f1f1f;
box-shadow:0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index:5;
}
/* ===== Quick Nav (neutral, white outline) ===== */
.nfl-quick-nav{
display:flex;
justify-content:center;
gap:14px;
margin:12px auto 18px;
flex-wrap:wrap;
}
.nfl-quick-nav .nfl-nav-btn{
display:inline-flex;
align-items:center;
justify-content:center;
height:46px;
padding:0 16px;
border-radius:10px;
background:#151515;
color:#fff;
font-weight:800;
letter-spacing:.03em;
text-transform:uppercase;
border:1px solid rgba(255,255,255,.7);
transition:all .18s ease;
}
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible{
border-color:#fff;
box-shadow:0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.80);
transform:translateY(-1px);
outline:none;
}
/* Close gap under Quick Nav */
.nfl-quick-nav + .afc-divisions{
margin-top:8px;
}
/* ===== Mobile (≤ 780px) ===== */
@media (max-width:780px){
.afc-divisions{
padding:8px 10px;
max-width:640px;
}
.afc-divisions-grid{
gap:10px;
grid-template-columns:repeat(4,1fr);
}
.afc-chip{
min-height:48px;
font-size:12px;
padding:0 8px;
}
.nfl-quick-nav{
max-width:300px;
margin:10px auto 12px;
flex-wrap:nowrap;
justify-content:space-between;
gap:8px;
}
.nfl-quick-nav .nfl-nav-btn{
flex:0 0 calc(50% - 4px);
height:42px;
font-size:12px;
padding:0 8px;
}
.nfl-quick-nav + .afc-divisions{
margin-top:6px;
}
}
/* ===== Desktop hover-glow safety ===== */
@media (min-width:781px){
.afc-divisions{
position:relative;
isolation:isolate;
margin-top:28px;
padding-top:10px;
padding-bottom:10px;
}
.afc-divisions-grid{
overflow:visible;
}
.nfl-quick-nav .nfl-nav-btn{
flex:0 0 240px;
height:46px;
}
}/* ===== Remove underline from Quick Nav links ===== */
.nfl-quick-nav .nfl-nav-btn {
text-decoration: none !important;
}
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
text-decoration: none !important;
}
}
#fw-section-rich-text-5c886b6b-da0d-4aa9-8e7c-dd7656b5bf99 {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-62deb0c1-5c95-485a-b554-2cec43e5e314 {
/* AFC South Home – scoped pills */
.afc-south-home{max-width:840px;margin:14px auto 22px;padding:0 12px;box-sizing:border-box;position:relative;isolation:isolate}
.afc-south-home .pill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;overflow:visible;padding-top:6px}
.afc-south-home .pill{
display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;width:100%;
min-height:56px;padding:0 12px;background:#151515;border:1px solid rgba(255,255,255,.14);
border-radius:12px;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.03em;
font-weight:800;font-size:14px;line-height:1.1;transition:box-shadow .18s,transform .18s,border-color .18s,background .18s;position:relative
}
.afc-south-home .pill:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.45);background:#1f1f1f;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 10px 22px rgba(0,0,0,.35);z-index:5}
@media (max-width:780px){
.afc-south-home .pill-grid{grid-template-columns:repeat(4,1fr);gap:8px}
.afc-south-home .pill{min-height:48px;font-size:12px;letter-spacing:.02em;padding:0 8px}
}
/* ===== Trash Fanz Quick Nav – neutral, white-outlined pills ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 6px auto 10px; /* tighter vertical spacing */
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (neutral white glow) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30), 0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line (same visual width as team chips) ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 300px; /* tweak 300–320 to match your chip rail */
margin: 4px auto 10px; /* reduced space above/below for mobile */
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
gap: 8px; /* a little tighter between buttons */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 4px); /* exactly two across with equal width */
height: 42px;
font-size: 12px;
padding: 0 6px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center;
gap: 14px;
margin: 8px auto 14px; /* slight buffer for perfect alignment */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px; /* uniform width on desktop */
height: 46px;
}
}
}
#fw-section-rich-text-d553c7d1-2f79-4178-91af-3f6a316c035d {
/* Only affects the text element’s own spacing */
.custom-rival-heading {
font-weight: 800;
text-transform: uppercase;
text-align: center;
letter-spacing: .06em;
color: #fff;
font-size: clamp(24px, 3vw, 42px);
line-height: 1.2;
/* Desktop/tablet spacing */
margin: 20px 0 10px; /* top 20, bottom 10 */
}
/* Mobile: pull pills closer to the title */
@media (max-width: 780px) {
.custom-rival-heading {
margin-bottom: 0;
}
}
/* Style for "Select your division" sub-label */
.custom-rival-subheading {
font-size: 14px; /* smaller than main heading */
font-weight: 400; /* lighter weight */
color: rgba(255,255,255,0.7); /* softer gray-white */
text-align: center;
margin-top: 6px; /* small spacing from main title */
margin-bottom: 12px; /* spacing before pills */
letter-spacing: .02em;
}
}
#fw-section-custom-html-b4a88be7-bfbb-4e67-ae87-d53c32c2a654 {
/* ===== AFC pills (scoped) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none; /* <- make sure no underline */
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-5e4fd934-4a26-44f8-b1ed-17954679135f {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-cd761eb6-ae10-4bbb-937d-794f2431d275 {
/* AFC West Home – scoped pills */
.afc-west-home{max-width:840px;margin:14px auto 22px;padding:0 12px;box-sizing:border-box;position:relative;isolation:isolate}
.afc-west-home .pill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;overflow:visible;padding-top:6px}
.afc-west-home .pill{
display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;width:100%;
min-height:56px;padding:0 12px;background:#151515;border:1px solid rgba(255,255,255,.14);
border-radius:12px;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.03em;
font-weight:800;font-size:14px;line-height:1.1;transition:box-shadow .18s,transform .18s,border-color .18s,background .18s;position:relative
}
.afc-west-home .pill:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.45);background:#1f1f1f;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 10px 22px rgba(0,0,0,.35);z-index:5}
@media (max-width:780px){
.afc-west-home .pill-grid{grid-template-columns:repeat(4,1fr);gap:8px}
.afc-west-home .pill{min-height:48px;font-size:12px;letter-spacing:.02em;padding:0 8px}
}
/* ===== Trash Fanz Quick Nav – neutral, white-outlined pills ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 6px auto 10px; /* tighter vertical spacing */
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (neutral white glow) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30), 0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line (same visual width as team chips) ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 300px; /* tweak 300–320 to match your chip rail */
margin: 4px auto 10px; /* reduced space above/below for mobile */
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
gap: 8px; /* a little tighter between buttons */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 4px); /* exactly two across with equal width */
height: 42px;
font-size: 12px;
padding: 0 6px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center;
gap: 14px;
margin: 8px auto 14px; /* slight buffer for perfect alignment */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px; /* uniform width on desktop */
height: 46px;
}
}
}
#fw-section-rich-text-0ad5094d-fdc5-42b2-9246-828bfdfc1ca1 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-4e28227f-19f1-49f9-9f90-f929300ec48e {
/* ===== AFC pills (scoped) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none; /* no underline */
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-custom-html-31905b8f-8ed3-4a92-bc99-38549ba0d27f {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-custom-html-928fd942-4d00-4962-8e9c-936020d533be {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-custom-html-ccb9b1e3-e403-44a2-8b45-87ef4b02fa50 {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-rich-text-151690d7-da0f-4001-b11e-6398ab5d2fb0 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-4f68946b-2c8a-45b7-af00-7dbbc3f9981e {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-rich-text-a76e426b-9e87-461d-a540-d83436e8610b {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-67e496ea-267b-4084-a49f-a0533f8602ed {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-rich-text-eedd5c4d-73d6-47c8-aede-ca31fc18acd0 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-a7e999f1-eae1-4857-a321-236fa480b989 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-c1cf976d-fe02-4bbc-a89d-5581e47b72b6 {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-custom-html-3172df92-d8ec-4be3-9c74-c0de3bb320b5 {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-rich-text-13c64d96-a9ed-4b27-b8c1-51c621f1b4ad {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-4310b8c0-b16e-4de3-9e2f-93d8c1a9e3cc {
/* ==========================================
DIVISION PILLS (AL + NL)
- Desktop: use theme pill styles
- Mobile: 3-up layout + extra breathing room
========================================== */
/* All viewports: make sure wrapper never clips the pills
and has a little air under it so the next section
doesn't sit on top of the glow */
.al-divisions,
.nl-divisions {
overflow: visible !important;
margin-bottom: 24px !important;
}
/* Mobile: 3-in-a-row for NL/AL division pills */
@media (max-width: 780px){
/* Turn the division wrappers into 3-column grids */
.al-divisions,
.nl-divisions {
display: grid !important;
grid-template-columns: repeat(3, minmax(0,1fr)) !important;
gap: 10px !important;
max-width: 360px;
margin: 16px auto 28px !important; /* extra bottom space so nothing looks chopped */
padding: 0 !important;
}
/* Let the chips fill their grid cells, keep the default pill look */
.al-divisions .al-chip,
.nl-divisions .nl-chip {
min-width: 0 !important; /* allow shrinking */
width: 100% !important;
margin: 0 !important; /* kill inline spacing */
text-align: center;
white-space: nowrap;
box-sizing: border-box;
}
/* CTA + Sitemap pills span the full row */
.al-divisions .al-chip--cta,
.al-divisions .al-chip--sitemap,
.nl-divisions .nl-chip--cta,
.nl-divisions .nl-chip--sitemap {
grid-column: 1 / -1 !important;
}
}
}
#fw-section-custom-html-6f429a3d-e725-4d46-ae9a-7d91fe4eb26e {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-a10128ae-e0e5-4dd9-8212-5926db1724b0 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* Universal forced spacing below search bar */
#tf-header-search,
#tf-hs-input,
[placeholder="Search your team..."],
.tf-search-bar,
.search-bar,
.section--search-bar {
margin-bottom: 16px !important;
}
}
#fw-section-custom-html-a1c8631a-a426-4583-b654-a62e3a8bf174 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-cfc7641e-f737-4070-9534-2655ce922105 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-custom-html-62247356-5dad-4e71-9637-25842bdaf7dc {
/* === MLB mobile: make Rivals Locker slightly smaller than Sitemap (like NFL) === */
@media (max-width:780px){
/* Sitemap stays full-width */
.home-grid .mlb-sitemap-wrap{
max-width: 360px !important;
margin: 6px auto 18px !important;
}
.home-grid .mlb-sitemap-pill{
width: 100% !important;
height: 44px !important;
font-size: 12px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
line-height: 1 !important;
}
/* Rivals Locker pill: slightly narrower than Sitemap + vertically centered text */
.home-grid .tf-mobile-grid.home-pills a.rivals-link{
grid-column: 1 / -1 !important; /* sits on its own row */
width: 92% !important; /* smaller than Sitemap */
margin: 6px auto 6px !important; /* center + tighten spacing */
height: 42px !important; /* slightly shorter */
font-size: 12px !important;
display: flex !important; /* flex centers content */
align-items: center !important; /* vertical centering */
justify-content: center !important; /* horizontal centering */
text-align: center !important;
line-height: 1 !important; /* keep text tight & balanced */
}
}
}
#fw-section-collections-list-2de74781-d240-4ee4-a9a1-ba673139dd86 {
/* ===== MLB Home Locker (Collections) — BLUE hover glow, no dots ===== */
/* 0) Nuke any built-in dot/indicator */
.collections-list .card::after,
.collections-list .collection-card::after,
.collections-list .collection-item::after,
.collections-list [class*="dot"],
.collections-list [class*="indicator"]{
display:none !important;
content:none !important;
}
/* 1) Make both the visible card containers and the link good hover targets */
.collections-list .card,
.collections-list .collection-card,
.collections-list .collection-item,
.collections-list a{
position:relative;
border-radius:16px;
overflow:visible !important;
display:block;
isolation:isolate; /* keeps our glow above the image */
}
/* 2) Blue glow overlay (hidden by default) */
.collections-list .card::before,
.collections-list .collection-card::before,
.collections-list .collection-item::before,
.collections-list a[href*="home-locker"]::before{
content:"";
position:absolute;
inset:0;
border-radius:16px;
pointer-events:none;
opacity:0;
transition:opacity .18s ease, box-shadow .18s ease;
box-shadow:
0 0 0 2px rgba(64,160,255,.35),
0 10px 24px rgba(64,160,255,.45),
0 0 36px rgba(64,160,255,.35);
}
/* 3) Show glow when either the card or its link is hovered/focused */
.collections-list .card:hover::before,
.collections-list .collection-card:hover::before,
.collections-list .collection-item:hover::before,
.collections-list a[href*="home-locker"]:hover::before,
.collections-list .card:focus-within::before,
.collections-list .collection-card:focus-within::before,
.collections-list .collection-item:focus-within::before,
.collections-list a[href*="home-locker"]:focus-visible::before{
opacity:1;
}
/* 4) Optional: pop the artwork a bit */
.collections-list .card:hover img,
.collections-list .collection-card:hover img,
.collections-list .collection-item:hover img,
.collections-list a[href*="home-locker"]:hover img,
.collections-list .card:focus-within img,
.collections-list .collection-card:focus-within img,
.collections-list .collection-item:focus-within img,
.collections-list a[href*="home-locker"]:focus-visible img{
filter:
drop-shadow(0 0 6px rgba(64,160,255,.55))
drop-shadow(0 0 18px rgba(64,160,255,.35));
}
/* 5) Mobile: slightly softer glow */
@media (max-width:780px){
.collections-list .card::before,
.collections-list .collection-card::before,
.collections-list .collection-item::before,
.collections-list a[href*="home-locker"]::before{
box-shadow:
0 0 0 1px rgba(64,160,255,.28),
0 6px 18px rgba(64,160,255,.35);
}
}
}
#fw-section-custom-html-c69c16e1-4177-4faa-9522-50d73bbd5085 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-89f1054b-b057-4681-97eb-477a405a223d {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-collections-list-bcb0e370-412f-415b-8685-f9035270834f {
/* Kill any built-in gray orb those cards add */
.collections-list .card::after,
.collections-list .collection-card::after,
.collections-list .collection-item::after { content: none !important; }
/* Make the card link the positioning context */
.collections-list a {
position: relative !important;
display: block !important;
overflow: visible !important;
text-decoration: none;
}
/* Force rivals color + draw our neon orb */
.collections-list a[href*="rivals-locker"] { color: #ff3838 !important; } /* red */
.collections-list a[href*="rivals-locker"]::after{
content: "";
position: absolute;
right: 18px;
bottom: 10px;
width: 12px; height: 12px;
border-radius: 999px;
background: currentColor; /* uses red above */
opacity: 1; /* always visible (no hover needed) */
filter:
drop-shadow(0 0 6px currentColor)
drop-shadow(0 0 18px currentColor)
drop-shadow(0 0 36px currentColor);
pointer-events: none;
}
@media (max-width: 780px){
.collections-list a[href*="rivals-locker"]::after{ right: 14px; bottom: 8px; }
}
/* Optional: also give the image a soft red glow on hover */
.collections-list a[href*="rivals-locker"]:hover img{
filter: drop-shadow(0 0 8px #ff3838) drop-shadow(0 0 22px #ff3838);
}
}
#fw-section-custom-html-984f1018-df02-4168-b6b7-00b21683c076 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-61f64fec-c960-49c6-b301-db82aca9ab3e {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* Universal forced spacing below search bar */
#tf-header-search,
#tf-hs-input,
[placeholder="Search your team..."],
.tf-search-bar,
.search-bar,
.section--search-bar {
margin-bottom: 24px !important;
}
}
#fw-section-custom-html-bd2a00c3-cff5-4d1a-b832-924d6fa979ba {
/* =====================================
Hide "Trash Fanz Home" on Desktop
===================================== */
@media (min-width: 781px) {
.mlb-quick-nav .mlb-nav-btn[href="https://trashfanz.com"] {
display: none !important;
}@media (min-width:781px){
.mlb-quick-nav{
--pill-nudge: 120px; /* ← adjust */
transform: translateX(var(--pill-nudge)) !important;
}
}
}
}
#fw-section-custom-html-73ddf253-395b-4e90-a60e-d051bf5d3301 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-rich-text-6f47714f-0ff5-458a-886c-b79d680219da {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-fd51df53-64ea-4f7e-866c-51ceb001d0b8 {
/* ===== FIX: 3 pills across on mobile ===== */
@media (max-width: 768px){
.nlr-divisions{
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
grid-column-gap: 8px !important;
grid-row-gap: 6px !important;
justify-items: stretch !important;
align-items: stretch !important;
max-width: 360px;
margin: 16px auto 22px;
}
.nlr-chip{
min-width: 0 !important;
width: 100% !important;
height: 40px !important;
font-size: 11px !important;
margin: 0 !important;
}
/* keep CTA + Sitemap full-width below */
.nlr-chip--home, .nlr-chip--sitemap{
grid-column: 1 / -1 !important;
height: 44px !important;
font-size: 12px !important;
}
}
}
#fw-section-custom-html-30034909-723e-4689-86e9-95434f5300b9 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-custom-html-4dc37f99-62d6-42d9-ad21-3b9b866e908d {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-rich-text-e5ccfee1-81e4-4c4e-8323-046628b59cb4 {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-7985cbe9-f1a1-47ab-929c-98b99aeed18b {
/* ===== NFC EAST HOME – scoped pill + quick-nav layout (matches AFC formula) ===== */
/* Wrapper */
.nfc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
/* 4 across grid */
.nfc-divisions-grid{
display: grid !important; /* force grid */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
/* Pill style */
.nfc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition:
box-shadow .18s ease,
transform .18s ease,
border-color .18s ease,
background .18s ease;
position: relative; /* for z-index on hover */
}
.nfc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow:
0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.nfc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.nfc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral, white-outlined pills ===== */
.nfl-quick-nav{
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
.nfl-quick-nav .nfl-nav-btn{
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible{
border-color: #fff;
box-shadow:
0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line (same visual width as team chips) ===== */
@media (max-width: 780px){
.nfl-quick-nav{
max-width: 300px;
margin: 10px auto 14px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
}
.nfl-quick-nav .nfl-nav-btn{
flex: 0 0 calc(50% - 5px);
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px){
.nfl-quick-nav{
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn{
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-custom-html-a7df4d3a-f5d6-45f8-8090-5064434292e5 {
/* ===== NFC page chips (RIVALS – matches AFC East Rivals look) ===== */
.nfc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.nfc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.nfc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
/* Long labels (Cowboys / Commanders) – tiny safe padding boost */
.cowboys-chip,
.commanders-chip{
padding-left: 14px;
padding-right: 14px;
}
@media (max-width: 780px){
.cowboys-chip,
.commanders-chip{
padding-left: 12px;
padding-right: 12px;
}
}
.nfc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.nfc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.nfc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* extra safety: kill any theme underline */
.nfl-quick-nav a {
text-decoration: none !important;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-f6cecd47-a65b-4188-bfda-0c7461fafecc {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-d6356680-4b2c-43e5-a24d-ae1433a27db2 {
/* ===== NFC pills (scoped, mirrors working AFC block) ===== */
.nfc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.nfc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.nfc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.nfc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.nfc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.nfc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none !important; /* no underline */
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-21e32dc4-7476-4b40-a379-786e4e97ac7b {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-8d4fe814-595b-40b6-839c-56392fd4ce9e {
/* NFC North Home – scoped pills */
.nfc-north-home{max-width:840px;margin:14px auto 22px;padding:0 12px;box-sizing:border-box;position:relative;isolation:isolate}
.nfc-north-home .pill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;overflow:visible;padding-top:6px}
.nfc-north-home .pill{
display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;width:100%;
min-height:56px;padding:0 12px;background:#151515;border:1px solid rgba(255,255,255,.14);
border-radius:12px;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.03em;
font-weight:800;font-size:14px;line-height:1.1;transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease,background .18s ease;position:relative
}
.nfc-north-home .pill:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.45);background:#1f1f1f;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 10px 22px rgba(0,0,0,.35);z-index:5}
@media (max-width:780px){
.nfc-north-home .pill-grid{grid-template-columns:repeat(4,1fr);gap:8px}
.nfc-north-home .pill{min-height:48px;font-size:12px;letter-spacing:.02em;padding:0 8px}
}
/* ===== Trash Fanz Quick Nav – neutral, white-outlined pills ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 6px auto 10px; /* tighter vertical spacing */
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (neutral white glow) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30), 0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line (same visual width as team chips) ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 300px; /* tweak 300–320 to match your chip rail */
margin: 4px auto 10px; /* reduced space above/below for mobile */
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
gap: 8px; /* a little tighter between buttons */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 4px); /* exactly two across with equal width */
height: 42px;
font-size: 12px;
padding: 0 6px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center;
gap: 14px;
margin: 8px auto 14px; /* slight buffer for perfect alignment */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px; /* uniform width on desktop */
height: 46px;
}
}
}
#fw-section-rich-text-1be9a969-3caf-4550-bfa7-32b6fc724fd1 {
/* Only affects the text element’s own spacing */
.custom-rival-heading {
font-weight: 800;
text-transform: uppercase;
text-align: center;
letter-spacing: .06em;
color: #fff;
font-size: clamp(24px, 3vw, 42px);
line-height: 1.2;
/* Desktop/tablet spacing */
margin: 20px 0 10px; /* top 20, bottom 10 */
}
/* Mobile: pull pills closer to the title */
@media (max-width: 780px) {
.custom-rival-heading {
margin-bottom: 0;
}
}
/* Style for "Select your division" sub-label */
.custom-rival-subheading {
font-size: 14px; /* smaller than main heading */
font-weight: 400; /* lighter weight */
color: rgba(255,255,255,0.7); /* softer gray-white */
text-align: center;
margin-top: 6px; /* small spacing from main title */
margin-bottom: 12px; /* spacing before pills */
letter-spacing: .02em;
}
}
#fw-section-custom-html-d1cba4cb-172a-4994-9bec-9a469528ce34 {
/* ===== AFC / NFC RIVALS PILL SYSTEM (shared) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-3d0096b4-e3d7-4522-ba2e-149a3fb20b62 {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-eefe81ec-3861-4d05-85ac-d2664c2b61a2 {
/* ===== AFC / NFC division pills (shared) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-rich-text-4bbc9f01-7276-4167-a47b-c00c7fe57c2b {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-31b777b6-16b3-4071-9805-2e3a54b6e3fe {
/* NFC South Home – scoped pills */
.nfc-south-home{max-width:840px;margin:14px auto 22px;padding:0 12px;box-sizing:border-box;position:relative;isolation:isolate}
.nfc-south-home .pill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;overflow:visible;padding-top:6px}
.nfc-south-home .pill{
display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;width:100%;
min-height:56px;padding:0 12px;background:#151515;border:1px solid rgba(255,255,255,.14);
border-radius:12px;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.03em;
font-weight:800;font-size:14px;line-height:1.1;transition:box-shadow .18s,transform .18s,border-color .18s,background .18s;position:relative
}
.nfc-south-home .pill:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.45);background:#1f1f1f;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 10px 22px rgba(0,0,0,.35);z-index:5}
@media (max-width:780px){
.nfc-south-home .pill-grid{grid-template-columns:repeat(4,1fr);gap:8px}
.nfc-south-home .pill{min-height:48px;font-size:12px;letter-spacing:.02em;padding:0 8px}
}
/* ===== Trash Fanz Quick Nav – neutral, white-outlined pills ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 6px auto 10px; /* tighter vertical spacing */
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (neutral white glow) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30), 0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line (same visual width as team chips) ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 300px; /* tweak 300–320 to match your chip rail */
margin: 4px auto 10px; /* reduced space above/below for mobile */
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
gap: 8px; /* a little tighter between buttons */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 4px); /* exactly two across with equal width */
height: 42px;
font-size: 12px;
padding: 0 6px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center;
gap: 14px;
margin: 8px auto 14px; /* slight buffer for perfect alignment */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px; /* uniform width on desktop */
height: 46px;
}
}
}
#fw-section-rich-text-7eaa9921-7949-4ef1-89a9-ac2dac230906 {
/* Only affects the text element’s own spacing */
.custom-rival-heading {
font-weight: 800;
text-transform: uppercase;
text-align: center;
letter-spacing: .06em;
color: #fff;
font-size: clamp(24px, 3vw, 42px);
line-height: 1.2;
/* Desktop/tablet spacing */
margin: 20px 0 10px; /* top 20, bottom 10 */
}
/* Mobile: pull pills closer to the title */
@media (max-width: 780px) {
.custom-rival-heading {
margin-bottom: 0;
}
}
/* Style for "Select your division" sub-label */
.custom-rival-subheading {
font-size: 14px; /* smaller than main heading */
font-weight: 400; /* lighter weight */
color: rgba(255,255,255,0.7); /* softer gray-white */
text-align: center;
margin-top: 6px; /* small spacing from main title */
margin-bottom: 12px; /* spacing before pills */
letter-spacing: .02em;
}
}
#fw-section-custom-html-c7ebda35-9527-4792-86d9-b6bc93ed4940 {
/* ===== NFC page chips ===== */
.nfc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.nfc-divisions-grid{
display: grid;
grid-template-columns: repeat(4, minmax(0,1fr));
gap: 10px;
}
.nfc-chip{
display: flex;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
}
.nfc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
}
/* Mobile tweaks */
@media (max-width: 780px){
.nfc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill wider */
gap: 8px;
}
.nfc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
.commanders-chip{
font-size: 11px; /* slightly smaller text just for Commanders */
padding: 0 10px;
}
}
/* === tiny, safe padding bump for long labels (keeps your hover intact) */
.cowboys-chip,
.commanders-chip{
padding-left: 14px;
padding-right: 14px;
}
@media (max-width: 780px){
.cowboys-chip,
.commanders-chip{
padding-left: 12px;
padding-right: 12px;
}
}
/* Let the pills breathe outside the wrapper */
.nfc-teams,
.nfc-divisions-grid{
overflow: visible; /* was overflow-x: hidden on .nfc-teams */
padding-top: 6px; /* buffer so the -1px lift stays inside */
}
/* Ensure the hovered chip paints above neighbors */
.nfc-chip{ position: relative; }
.nfc-chip:hover{ z-index: 5; } /* raises only during hover *//* ===== Trash Fanz Quick Nav – neutral, white-outlined pills ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 6px auto 10px; /* tighter vertical spacing */
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (neutral white glow) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30), 0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line (same visual width as team chips) ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 300px; /* tweak 300–320 to match your chip rail */
margin: 4px auto 10px; /* reduced space above/below for mobile */
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
gap: 8px; /* a little tighter between buttons */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 4px); /* exactly two across with equal width */
height: 42px;
font-size: 12px;
padding: 0 6px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center;
gap: 14px;
margin: 8px auto 14px; /* slight buffer for perfect alignment */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px; /* uniform width on desktop */
height: 46px;
}
}
}
#fw-section-rich-text-3dcbdead-1639-48f5-90b6-ad88064ac4fb {
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-613d04cb-6112-4823-b502-b92218dc3332 {
/* NFC West Home – scoped pills */
.nfc-west-home{max-width:840px;margin:14px auto 22px;padding:0 12px;box-sizing:border-box;position:relative;isolation:isolate}
.nfc-west-home .pill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;overflow:visible;padding-top:6px}
.nfc-west-home .pill{
display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;width:100%;
min-height:56px;padding:0 12px;background:#151515;border:1px solid rgba(255,255,255,.14);
border-radius:12px;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.03em;
font-weight:800;font-size:14px;line-height:1.1;transition:box-shadow .18s,transform .18s,border-color .18s,background .18s;position:relative
}
.nfc-west-home .pill:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.45);background:#1f1f1f;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 10px 22px rgba(0,0,0,.35);z-index:5}
@media (max-width:780px){
.nfc-west-home .pill-grid{grid-template-columns:repeat(4,1fr);gap:8px}
.nfc-west-home .pill{min-height:48px;font-size:12px;letter-spacing:.02em;padding:0 8px}
}
/* ===== Trash Fanz Quick Nav – neutral, white-outlined pills ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 6px auto 10px; /* tighter vertical spacing */
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (neutral white glow) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30), 0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line (same visual width as team chips) ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 300px; /* tweak 300–320 to match your chip rail */
margin: 4px auto 10px; /* reduced space above/below for mobile */
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
gap: 8px; /* a little tighter between buttons */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 calc(50% - 4px); /* exactly two across with equal width */
height: 42px;
font-size: 12px;
padding: 0 6px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center;
gap: 14px;
margin: 8px auto 14px; /* slight buffer for perfect alignment */
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px; /* uniform width on desktop */
height: 46px;
}
}
}
#fw-section-custom-html-e4c72b7e-b842-4752-88cb-49951b84495c {
/* ===== NFC WEST RIVALS – pills (reusing AFC pill system) ===== */
.afc-teams{
max-width: 840px;
margin: 14px auto 22px;
padding: 0 12px;
box-sizing: border-box;
overflow-x: hidden;
position: relative;
isolation: isolate;
width: 100%;
}
.afc-divisions-grid{
display: grid !important; /* force grid in case something overrides */
grid-template-columns: repeat(4, minmax(0,1fr)) !important;
gap: 10px;
overflow: visible;
padding-top: 6px; /* room for hover lift */
}
.afc-chip{
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
min-width: 0;
width: 100%;
min-height: 56px;
padding: 0 12px;
background: #151515;
border: 1px solid rgba(255,255,255,.14);
border-radius: 12px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .03em;
font-weight: 800;
font-size: 14px;
line-height: 1.1;
transition: box-shadow .18s ease, transform .18s ease,
border-color .18s ease, background .18s ease;
position: relative; /* for z-index on hover */
}
.afc-chip:hover{
transform: translateY(-1px);
border-color: rgba(255,255,255,.45);
background: #1f1f1f;
box-shadow: 0 0 0 2px rgba(255,255,255,.18),
0 10px 22px rgba(0,0,0,.35);
z-index: 5;
}
/* Mobile tweaks */
@media (max-width: 780px){
.afc-divisions-grid{
grid-template-columns: 1fr 1fr 1fr 1.3fr; /* last pill a touch wider */
gap: 8px;
}
.afc-chip{
min-height: 48px;
font-size: 12px;
letter-spacing: .02em;
padding: 0 8px;
}
}
/* ===== Trash Fanz Quick Nav – neutral white navigation ===== */
.nfl-quick-nav {
display: flex;
justify-content: center;
gap: 14px;
margin: 12px auto 18px;
flex-wrap: wrap;
}
/* Shared button style */
.nfl-quick-nav .nfl-nav-btn {
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #fff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.7);
transition: all .18s ease;
}
/* Hover/focus (white glow, neutral theme) */
.nfl-quick-nav .nfl-nav-btn:hover,
.nfl-quick-nav .nfl-nav-btn:focus-visible {
border-color: #fff;
box-shadow: 0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* ===== Mobile: two pills on one line ===== */
@media (max-width: 780px) {
.nfl-quick-nav {
max-width: 360px;
flex-wrap: nowrap;
justify-content: space-between;
gap: 10px;
margin: 10px auto 14px;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 1 1 0;
min-width: 0;
height: 42px;
font-size: 12px;
padding: 0 10px;
}
}
/* ===== Desktop: centered & equal width ===== */
@media (min-width: 781px) {
.nfl-quick-nav {
justify-content: center !important;
gap: 14px !important;
}
.nfl-quick-nav .nfl-nav-btn {
flex: 0 0 240px !important;
height: 46px !important;
}
}
}
#fw-section-custom-html-3ef680fd-5245-4e87-8031-eb2b35f58e3d {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-custom-html-0dac3096-4cae-46db-8f58-621861f10d04 {
/* ===== Unified Locker Titles (Rivals + Home): consistent look across all leagues ===== */
.nfl-rivals-locker-title,
.nfc-rivals-locker-title,
.afc-rivals-locker-title,
.nfl-home-locker-title,
.nfc-home-locker-title,
.afc-home-locker-title {
font-weight: 900;
text-align: center;
text-transform: uppercase;
letter-spacing: 1.5px;
color: #fff;
line-height: 1.1;
font-size: 32px; /* slightly smaller default for mobile fit */
margin: 28px 0 40px;
white-space: nowrap; /* keep title on one line */
}
/* Fine-tuned for smaller mobile widths */
@media (max-width: 480px) {
.nfl-rivals-locker-title,
.nfc-rivals-locker-title,
.afc-rivals-locker-title,
.nfl-home-locker-title,
.nfc-home-locker-title,
.afc-home-locker-title {
font-size: 26px; /* ensures "NFL HOME LOCKER" fits in one line */
letter-spacing: 1px;
margin: 24px 0 32px;
}
}
/* Desktop tweak for larger screens */
@media (min-width: 1024px) {
.nfl-rivals-locker-title,
.nfc-rivals-locker-title,
.afc-rivals-locker-title,
.nfl-home-locker-title,
.nfc-home-locker-title,
.afc-home-locker-title {
font-size: 40px; /* desktop size */
margin-top: 60px; /* headroom under navbar */
margin-bottom: 60px; /* space above cards */
white-space: normal; /* allow wrapping if space permits */
}
}
}
#fw-section-custom-html-6288af22-160d-4c5c-9368-2e83f04f3e8b {
/* =========================
NFL HOME LOCKER — CLEAN DROP-IN
========================= */
/* 1) DESKTOP: hide the league sitemap pill */
@media (min-width:781px){
.home-grid .nfl-sitemap-center,
.home-grid .nfl-sitemap-wrap,
.home-grid .nfl-sitemap-center .nfl-sitemap-pill,
.home-grid a.nfl-sitemap-pill{
display:none !important;
}
}
/* 2) MOBILE: force ALL division rows to a true 2×2 grid (no stagger) */
@media (max-width:780px){
/* catch every container variant that has the 4 division chips */
.home-grid .nfl-pills,
.home-grid .tf-mobile-grid.home-pills,
.home-grid .tf-mobile-grid.nfl-pills,
.home-grid .pill-row,
.home-grid .division-pills{
/* kill flex & inline styles */
display:grid !important;
grid-auto-flow:row !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
column-gap:10px !important;
row-gap:10px !important;
justify-items:stretch !important;
align-items:stretch !important;
margin:14px 12px 0 !important; /* breathing room under banner */
}
/* normalize every pill inside those rows */
.home-grid .nfl-pills a,
.home-grid .tf-mobile-grid.home-pills a,
.home-grid .tf-mobile-grid.nfl-pills a,
.home-grid .pill-row a,
.home-grid .division-pills a{
box-sizing:border-box !important;
/* kill leftover width caps / auto margins from older rules */
width:100% !important;
max-width:none !important;
min-width:0 !important;
margin:0 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
min-height:48px !important; /* comfortable tap target */
padding:0 16px !important;
border-radius:12px !important;
text-align:center !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
line-height:1 !important;
}
/* extra top spacing for the FIRST pill row inside each NFC/AFC card */
.home-grid .card .nfl-pills:first-of-type,
.home-grid .card .tf-mobile-grid.home-pills:first-of-type{
margin-top:16px !important;
}
}
/* 3) COLOR ENFORCEMENT (this page)
Home pill rows = BLUE, Rivals pill rows (on this page) = RED */
.home-grid .home-pills a{
background:#151515 !important;
border:1px solid rgba(64,160,255,.45) !important;
}
.home-grid .home-pills a:hover,
.home-grid .home-pills a:focus-visible{
background:#1b2230 !important;
border-color:rgba(64,160,255,.72) !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28),
0 8px 22px rgba(64,160,255,.20) !important;
transform:translateY(-1px);
outline:none !important;
}
.home-grid .rival-pills a{
background:#151515 !important;
border:1px solid rgba(255,56,56,.45) !important;
}
.home-grid .rival-pills a:hover,
.home-grid .rival-pills a:focus-visible{
background:#241718 !important;
border-color:rgba(255,56,56,.72) !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28),
0 8px 22px rgba(255,56,56,.18) !important;
transform:translateY(-1px);
outline:none !important;
}
/* 4) “Rivals Locker” CTA — consistent sizing/hover */
.home-grid .rival-cta{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-width:220px !important;
height:46px !important;
padding:0 16px !important;
border-radius:10px !important;
font-weight:800 !important;
letter-spacing:.03em !important;
border:1px solid rgba(255,56,56,.28) !important;
transition:all .25s ease-in-out !important;
}
.home-grid .rival-cta:hover,
.home-grid .rival-cta:focus-visible{
border-color:rgba(255,56,56,.6) !important;
background:#241718 !important;
box-shadow:0 0 0 2px rgba(255,56,56,.3),
0 8px 22px rgba(255,56,56,.25) !important;
transform:translateY(-1px);
outline:none !important;
}
}
#fw-section-rich-text-ba8d7e68-aa04-4f7f-b3dd-3cfabd27d927 {
/* ========= SITEMAP PILLS (NFL + MLB) ========= */
/* NFL: uses .nfl-sitemap-top .nfl-sitemap-pill (your current markup) */
.nfl-sitemap-top{
text-align: center !important;
margin: 18px auto 34px !important;
}
.nfl-sitemap-top .nfl-sitemap-pill{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
padding: 12px 48px !important; /* wider look */
min-width: 220px !important; /* keeps it substantial */
height: 46px !important;
border-radius: 12px !important;
background: #151515 !important;
color: #fff !important;
border: 1px solid rgba(255,255,255,.7) !important;
text-transform: uppercase !important;
font-weight: 800 !important;
letter-spacing: .04em !important;
font-size: 14px !important;
text-decoration: none !important;
transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
.nfl-sitemap-top .nfl-sitemap-pill:hover,
.nfl-sitemap-top .nfl-sitemap-pill:focus-visible{
border-color: #fff !important;
box-shadow: 0 0 0 2px rgba(255,255,255,.35), 0 0 30px rgba(255,255,255,.75) !important;
transform: translateY(-1px) !important;
outline: none !important;
}
/* MLB: if your MLB page uses .mlb-sitemap-wrap .mlb-sitemap-pill */
.mlb-sitemap-wrap{
text-align: center !important;
margin: 18px auto 34px !important;
}
.mlb-sitemap-wrap .mlb-sitemap-pill{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
padding: 12px 48px !important;
min-width: 220px !important;
height: 46px !important;
border-radius: 12px !important;
background: #151515 !important;
color: #fff !important;
border: 1px solid rgba(255,255,255,.7) !important;
text-transform: uppercase !important;
font-weight: 800 !important;
letter-spacing: .04em !important;
font-size: 14px !important;
text-decoration: none !important;
transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
.mlb-sitemap-wrap .mlb-sitemap-pill:hover,
.mlb-sitemap-wrap .mlb-sitemap-pill:focus-visible{
border-color: #fff !important;
box-shadow: 0 0 0 2px rgba(255,255,255,.35), 0 0 30px rgba(255,255,255,.75) !important;
transform: translateY(-1px) !important;
outline: none !important;
}
/* Mobile sizing */
@media (max-width: 780px){
.nfl-sitemap-top .nfl-sitemap-pill,
.mlb-sitemap-wrap .mlb-sitemap-pill{
font-size: 12.5px !important;
height: 42px !important;
min-width: 180px !important;
padding: 11px 38px !important;
}
}
}
#fw-section-custom-html-0ad6792e-18de-488f-a51d-30886952083d {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-5d838b30-4cbf-4f8f-8542-106735ee4c04 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-custom-html-2f341249-1f99-4468-9d0c-8bd0b481e3de {
/* Rivals Locker titles: simple, crisp, consistent */
.nfl-rivals-locker-title,
.nfc-rivals-locker-title,
.afc-rivals-locker-title {
font-weight: 900;
text-align: center;
text-transform: uppercase;
letter-spacing: 1.5px;
color: #fff;
line-height: 1.1;
font-size: 32px; /* slightly smaller default to fit one line */
margin: 28px 0 40px;
white-space: nowrap; /* keep title on one line */
}
/* Fine-tuned for small mobile widths */
@media (max-width: 480px) {
.nfl-rivals-locker-title,
.nfc-rivals-locker-title,
.afc-rivals-locker-title {
font-size: 26px; /* ensures "NFL RIVALS LOCKER" fits in one line */
letter-spacing: 1px;
margin: 24px 0 32px;
}
}
/* Desktop tweak */
@media (min-width: 1024px) {
.nfl-rivals-locker-title,
.nfc-rivals-locker-title,
.afc-rivals-locker-title {
font-size: 40px; /* desktop size */
margin-top: 60px;
margin-bottom: 60px;
white-space: normal; /* allow wrapping on large screens if needed */
}
}
}
#fw-section-custom-html-fdbb9a5f-a730-4dc2-a544-0d2178be219a {
/* ===== 4-up grid + neutral pill base (kept as-is) ===== */
.conf-grid .tf-mobile-grid{
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
overflow:visible;
padding-top:6px;
}
.conf-grid .tf-mobile-grid a{
display:flex; align-items:center; justify-content:center;
min-width:0; white-space:nowrap; width:100%;
min-height:48px; padding:0 10px; border-radius:12px;
background:#151515; border:1px solid rgba(255,255,255,.14);
color:#fff; text-decoration:none; text-transform:uppercase;
font-weight:800; font-size:12px; letter-spacing:.02em; line-height:1.1;
box-shadow:none;
transition:transform .18s ease, box-shadow .18s ease,
border-color .18s ease, background .18s ease;
position:relative;
}
.conf-grid .tf-mobile-grid a:hover,
.conf-grid .tf-mobile-grid a:focus-visible{
transform:translateY(-1px);
border-color:rgba(255,56,56,.45);
background:#1b1b1b;
box-shadow:0 0 0 2px rgba(255,56,56,.35), 0 10px 22px rgba(0,0,0,.35);
outline:none; z-index:5;
}
/* If you use .home-btn anywhere, keep the blue hover */
.rival-pills a.home-btn{
border-color:rgba(64,160,255,.25);
}
.rival-pills a.home-btn:hover,
.rival-pills a.home-btn:focus-visible{
transform:translateY(-1px);
background:#1b2230;
border-color:rgba(64,160,255,.50);
box-shadow:0 0 0 2px rgba(64,160,255,.28), 0 8px 22px rgba(64,160,255,.18);
outline:none;
}
/* ===== NFL Rivals – DESKTOP ONLY: divisions RED; Home Locker BLUE + centered ===== */
@media (min-width:781px){
/* keep the four division pills centered as a group */
.nfl-grid .nfl-pills{
justify-content:center !important;
gap:12px !important;
flex-wrap:wrap !important;
}
/* Division pills: RED outline at rest + red hover */
.nfl-grid .nfl-pills a.division{
border-color:rgba(255,56,56,.45) !important;
background:#151515 !important;
}
.nfl-grid .nfl-pills a.division:hover,
.nfl-grid .nfl-pills a.division:focus-visible{
background:#241718 !important;
border-color:rgba(255,56,56,.72) !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28),
0 8px 22px rgba(255,56,56,.18) !important;
transform:translateY(-1px);
outline:none !important;
}
/* row that contains the “NFC/AFC Home Locker” pill: center it */
.nfl-grid .nfl-cta-wrap{
display:flex !important;
justify-content:center !important;
margin-top:8px !important;
}
/* the “Home Locker” pill: BLUE outline + standard size */
.nfl-grid .nfl-cta-wrap .rival-cta{
border-color:rgba(64,160,255,.48) !important;
min-width:260px !important; height:46px !important; padding:0 18px !important;
display:inline-flex !important; align-items:center !important; justify-content:center !important;
}
.nfl-grid .nfl-cta-wrap .rival-cta:hover,
.nfl-grid .nfl-cta-wrap .rival-cta:focus-visible{
background:#1b2230 !important;
border-color:rgba(64,160,255,.72) !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28),
0 8px 22px rgba(64,160,255,.20) !important;
transform:translateY(-1px);
outline:none !important;
}
} /* <-- closes DESKTOP block */
/* ===== NFL Rivals – MOBILE ONLY: mirror desktop colors (layout unchanged) ===== */
@media (max-width:780px){
/* Division pills = RED */
.nfl-grid .nfl-pills a.division{
border-color:rgba(255,56,56,.45) !important;
background:#151515 !important;
}
.nfl-grid .nfl-pills a.division:hover,
.nfl-grid .nfl-pills a.division:focus-visible{
background:#241718 !important;
border-color:rgba(255,56,56,.70) !important;
box-shadow:0 0 0 2px rgba(255,56,56,.28),
0 8px 22px rgba(255,56,56,.18) !important;
transform:translateY(-1px);
outline:none !important;
}
/* Home Locker pills = BLUE */
.nfl-grid .nfl-cta-wrap .rival-cta{
border-color:rgba(64,160,255,.48) !important;
background:#151515 !important;
}
.nfl-grid .nfl-cta-wrap .rival-cta:hover,
.nfl-grid .nfl-cta-wrap .rival-cta:focus-visible{
background:#1b2230 !important;
border-color:rgba(64,160,255,.72) !important;
box-shadow:0 0 0 2px rgba(64,160,255,.28),
0 8px 22px rgba(64,160,255,.20) !important;
transform:translateY(-1px);
outline:none !important;
}
}/* === Hide the single NFL Sitemap pill on DESKTOP only === */
@media (min-width: 781px){
.nfl-sitemap-center,
.nfl-sitemap-center .nfl-sitemap-pill{
display:none !important;
}
}
/* === Mobile division pill fit & tap-target tweaks === */
@media (max-width: 780px){
/* Make the row wrap nicely and give a little more space between pills */
.nfl-grid .nfl-pills{
display:flex !important;
flex-wrap:wrap !important;
justify-content:center !important;
gap:10px !important;
}
/* Ensure labels never get clipped and are easy to tap */
.nfl-grid .nfl-pills a{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
padding:0 16px !important; /* more side room for “AFC SOUTH/NORTH” */
min-height:46px !important; /* taller tap target */
white-space:nowrap !important; /* keep on one line */
overflow:visible !important; /* don’t hide text */
text-overflow:clip !important; /* no ellipsis clipping */
min-width:auto !important;
max-width:none !important;
line-height:1 !important;
}/* === Mobile pills: same size + two per row + breathing space === */
@media (max-width: 780px){
.nfl-grid .nfl-pills {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important; /* two per row */
gap: 10px !important;
justify-items: center !important;
align-items: center !important;
margin: 16px auto 0 auto !important; /* added breathing room above */
padding-top: 6px !important; /* slight buffer for polish */
}
.nfl-grid .nfl-pills a {
display: flex !important;
align-items: center !important;
justify-content: center !important;
height: 48px !important;
width: 100% !important;
max-width: 150px !important; /* consistent pill width */
border-radius: 12px !important;
text-align: center !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
font-size: 12px !important;
}
}
}
}
#fw-section-collection-template-collection-rivals-locker {
/* Neon split-glow effect */
.nfl-rivals-locker-title {
font-size: 44px; /* mobile size stays as-is */
font-weight: 900;
text-align: center;
text-transform: uppercase;
letter-spacing: 2px;
/* Split color gradient fill */
background: linear-gradient(to right, #ff0000 0%, #ff0000 50%, #0000ff 50%, #0000ff 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Glow shadows */
text-shadow:
0 0 8px #ffffff,
0 0 15px #ffffff,
-2px 0 20px #ff0000,
2px 0 20px #0000ff,
-4px 0 40px #ff0000,
4px 0 40px #0000ff;
margin-bottom: 28px;
}
/* Slightly larger on desktop only */
@media screen and (min-width: 1024px) {
.nfl-rivals-locker-title {
font-size: 72px; /* was 64px; bumped slightly */
letter-spacing: 3px;
}
}
}
#fw-section-custom-html-8914cdc6-1993-4a02-af8e-299bd90f6834 {
/* Add spacing so NFC/AFC pills align perfectly under their cards */
.rl-wrap {
margin-top: 24px; /* increase from ~10–12px to 24px */
}
@media (min-width: 1024px) {
.rl-wrap {
margin-top: 32px; /* extra breathing room on desktop */
}
}
/* --- Mobile-only: turn pills into simple text links --- */
@media (max-width: 780px) {
.rl-wrap { margin-top: 20px; margin-bottom: 20px; }
.rl-grid {
grid-template-columns: 1fr; /* one column list */
gap: 6px;
}
.rl-chip {
background: transparent;
border: 0;
box-shadow: none;
padding: 8px 2px;
border-radius: 0;
font-weight: 800;
letter-spacing: .04em;
text-align: left;
justify-content: flex-start;
width: 100%;
}
.rl-chip::after {
content: "›";
margin-left: 6px;
opacity: .45;
}
.rl-chip:hover {
transform: none;
text-decoration: underline;
}
}
}
#fw-section-custom-html-d2b8831e-fc80-4e6c-b6b1-4cb6dba4deb4 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-9afe3a29-821f-4433-adcb-e9523ca8d990 {
/* Universal forced spacing below search bar */
#tf-header-search,
#tf-hs-input,
[placeholder="Search your team..."],
.tf-search-bar,
.search-bar,
.section--search-bar {
margin-bottom: 24px !important;
}
}
#fw-section-custom-html-f65b88d7-0484-462d-81e9-2278fb46c200 {
/* ===== Quick Nav (NEW / BEST SELLERS / NFL SITEMAP) ===== */
.nfl-quick-nav.four-up{
display: grid;
grid-template-columns: repeat(3, minmax(0,1fr)); /* 3 pills in one row */
gap: 14px;
max-width: 720px;
margin: 24px auto 18px !important; /* <-- SPACE under search + center */
padding: 0 12px;
box-sizing: border-box;
}
.nfl-quick-nav.four-up .nfl-nav-btn{
display: inline-flex;
align-items: center;
justify-content: center;
height: 46px;
padding: 0 16px;
border-radius: 10px;
background: #151515;
color: #ffffff;
text-decoration: none;
font-weight: 800;
letter-spacing: .03em;
text-transform: uppercase;
line-height: 1;
border: 1px solid rgba(255,255,255,.70);
text-align: center;
white-space: nowrap;
transition: all .18s ease;
}
.nfl-quick-nav.four-up .nfl-nav-btn:hover,
.nfl-quick-nav.four-up .nfl-nav-btn:focus-visible{
border-color: #ffffff;
box-shadow:
0 0 0 2px rgba(255,255,255,.30),
0 0 24px rgba(255,255,255,.8);
transform: translateY(-1px);
outline: none;
}
/* Mobile: 2×2 grid */
@media (max-width:780px){
.nfl-quick-nav.four-up{
grid-template-columns: repeat(2, minmax(0,1fr));
gap: 8px;
max-width: 360px;
margin: 12px auto 10px !important;
padding: 0;
}
.nfl-quick-nav.four-up .nfl-nav-btn{
height: 42px;
font-size: 12px;
padding: 0 8px;
}
}
/* Desktop-only: hide the TrashFanz.com pill if it still exists */
@media (min-width:781px){
.nfl-quick-nav .nfl-nav-btn[href="https://trashfanz.com"]{
display: none !important;
}
}
}
#fw-section-custom-html-4c940277-efaa-4384-88cd-ac36ebd5d5bb {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-47337467-f973-4c0a-b82c-d9a1d2ca7fb3 {
/* === Fix hero text vertical centering (Brewers pill alignment) === */
#nlc-home .team-chip.hero {
display: flex !important;
align-items: center !important;
justify-content: center !important;
line-height: 1 !important;
height: 40px !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
transform: translateY(0) !important;
}/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-custom-html-27473eb9-aa78-4bee-be06-77c892d8a0c0 {
/* --- NL Central Rivals: bullet-proof vertical centering on mobile --- */
@media (max-width:820px){
#nl-central-rivals .team-chip,
#nl-central-rivals .team-chip.hero{
display: flex !important;
align-items: center !important;
justify-content: center !important;
height: 40px !important; /* fixed height */
padding: 0 12px !important; /* no top/bottom padding mismatch */
box-sizing: border-box !important;
line-height: 1 !important; /* keep text from nudging */
}
}
}
#fw-section-custom-html-420ad532-82e7-4308-8ce3-dd276c38052a {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-rich-text-b80205ac-ac15-4e7a-8b6a-1b7158a5dd11 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-ea2b178b-1064-4a49-b24c-e2ec8d5b65a5 {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-rich-text-507270df-0c24-4417-8dc2-3cef68459d43 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-rich-text-ccf21ae5-53ab-4088-818b-ec98647deb92 {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-86e2f438-f3fd-491f-88ac-d339280f0b40 {
/* === FIX: keep NL divisions perfectly 3-across on mobile === */
@media (max-width: 768px){
.nl-divisions{
max-width: 360px;
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
column-gap: 8px;
row-gap: 6px;
padding: 0;
}
.nl-divisions .nl-chip{
min-width: 0 !important;
width: 100% !important;
height: 40px !important;
font-size: 11px !important;
padding: 0 12px !important;
margin: 0 !important;
white-space: nowrap;
}
.nl-divisions .nl-chip + .nl-chip{ margin-left: 0 !important; }
/* Keep red & white pills full-width below */
.nl-divisions .nl-chip--cta,
.nl-divisions .nl-chip--sitemap{
grid-column: 1 / -1 !important;
height: 44px !important;
font-size: 12px !important;
}
}
}
#fw-section-custom-html-1e9648f3-d858-4bc2-bf53-00f037b82af7 {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-rich-text-fe0087a8-7bf9-44c3-81b0-db2933e73a4f {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-ec3a30a0-1e4b-44a4-9c7b-3d701df4aea2 {
/* ===== Mobile fix: make "Find Your Team" fit in its pill (no wrap) ===== */
@media (max-width:780px){
/* two pills per row, same widths you’re using on other pages */
.pill-row{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
max-width:340px !important; /* tiny breathing room */
margin:8px auto 12px !important;
}
.pill-row .pill{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
padding:0 10px !important;
white-space:nowrap !important; /* keep on one line */
overflow:hidden !important;
text-overflow:ellipsis !important;
font-size:12px !important;
letter-spacing:.02em !important;
}
/* Nudge just the FIRST pill (typically "Find Your Team") a hair smaller */
.pill-row .pill:first-child{
font-size:11px !important;
padding:0 8px !important;
}
}
}
#fw-section-rich-text-31c0f7fe-2841-42f7-8d3a-6a9a0775433a {
/* Unify NFC + AFC Home Locker headings (balanced size) */
.rich-text h2 {
font-size: clamp(18px, 2.2vw, 30px) !important;
letter-spacing: .06em;
text-transform: uppercase;
text-align: center;
line-height: 1.2;
font-weight: 800;
}
}
#fw-section-custom-html-eb38bd51-c765-4870-845c-debd79203ef6 {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-eb6fb8c3-7030-4c14-9030-a8f9543359c9 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-412e8838-6df4-4b67-afe4-9dc8cd7ba72d {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-custom-html-3377b6d8-9971-4008-92c1-cb11a1435c51 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-8e09df2d-ddfc-4a5e-9d43-d7e4b8ed88e6 {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-87d9b8bd-2266-4db0-822f-7322c3eee27b {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-custom-html-5c400129-6da9-48e2-a429-51dfec5e4e93 {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}
#fw-section-custom-html-e87dde65-b992-4ab8-9dcd-0f6ceb1c6f01 {
/* =========================================
1B – FINAL: HIDE JSON2 LOCKER SECTION
(inner wrapper + FW outer section)
========================================= */
/* Hide our inner wrapper completely */
#tf-lockers-json2-wrapper,
.tf-hidden-json2 {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Hide the Fourthwall SECTION that contains our wrapper.
This kills the empty block above the search bar. */
section:has(#tf-lockers-json2-wrapper) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
}
#fw-section-custom-html-c4482640-614a-4668-bddd-a8713e6dc7d0 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}/* PREMIUM LOCKER - Gold Button */
#tf-header-search .tf-hs-btn.locker-premium {
background: #d4af37; /* gold */
color: #111111;
border: 1px solid #d4af37;
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-premium:hover {
box-shadow: 0px 0px 12px rgba(212, 175, 55, 0.85); /* gold glow */
transform: translateY(-1px);
color: #ffffff; /* text becomes white on hover */
}
/* SEASONAL LOCKER - White Hollow Button */
#tf-header-search .tf-hs-btn.locker-seasonal {
background: transparent;
color: #ffffff; /* white text */
border: 1px solid #ffffff; /* white outline */
transition: all 0.15s ease-in-out;
}
#tf-header-search .tf-hs-btn.locker-seasonal:hover {
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.9); /* white glow */
background: rgba(255, 255, 255, 0.08); /* subtle haze */
transform: translateY(-1px);
}
}
#fw-section-hero-video-5295e09d-1ef7-46a3-82c5-4ccc1144589f {
section[data-section-type="video-banner"] .button {
margin-top: 60px !important;
}
}
#fw-section-custom-html-69dfcf75-3403-432a-ac14-6d6373492dd7 {
/* ============================
Desktop-only adjustments
============================ */
@media (min-width: 900px) {
.tf-pre-choose {
font-size: clamp(20px, 1.6vw, 22px);
margin-top: -16px !important; /* tighter spacing above text */
margin-bottom: 42px !important; /* balanced space before “CHOOSE A SIDE” */
display: block;
text-align: center;
}
}
/* ============================
Mobile-only adjustments
============================ */
@media (max-width: 768px) {
.tf-pre-choose {
margin-bottom: 26px !important; /* consistent breathing room on mobile */
}
}
}
#fw-section-hero-1731032338 {
@media (max-width: 780px){
section[id*="hero-1731032338"] {
outline: 3px solid red !important; /* DEBUG: draws red box */
background: rgba(255,0,0,0.05) !important; /* faint background */
}
}/* --- Mobile: tighten hero top/bottom space + pull image up a bit --- */
@media (max-width: 780px){
/* 1) Trim the hero section itself (use its ID + fallback) */
section[id*="hero-1731032338"],
.section-1731032338 {
padding-top: 0 !important;
padding-bottom: 6px !important;
margin-top: 0 !important;
margin-bottom: 6px !important;
}
/* 2) Pull the image crop up (cap closer to the top) */
section[id*="hero-1731032338"] img,
section[id*="hero-1731032338"] .image,
section[id*="hero-1731032338"] .media,
section[id*="hero-1731032338"] .background,
.section-1731032338 img {
object-fit: cover !important;
object-position: center 12% !important; /* try 10–18% to taste */
}
/* 3) Reduce the gap before the next section ("Choose a side") */
section[id*="hero-1731032338"] + section,
.section-1731032338 + section {
margin-top: 8px !important; /* was larger */
}
/* 4) Extra tightening for mobile spacing (above & below hero) */
.hero, .hero-section, .tf-hero-image {
margin-top: -8px !important; /* tighten above hero */
padding-top: 0 !important;
padding-bottom: 10px !important; /* tighten below hero */
}
}
}
#fw-section-footer {
/* ============================
FOOTER – horizontal legal links
============================ */
/* Make the footer center its inline content nicely */
footer {
text-align: center;
}
/* Contact / Terms / Privacy / Returns links:
force them into a horizontal row with wrap */
footer a[href*="contact"],
footer a[href*="terms-of-service"],
footer a[href*="privacy-policy"],
footer a[href*="returns"] {
display: inline-block !important;
margin: 0 14px 4px !important; /* spacing left/right + a bit bottom */
font-size: 13px !important;
opacity: 0.9;
}
/* Hover polish */
@media (hover:hover) and (pointer:fine){
footer a[href*="contact"]:hover,
footer a[href*="terms-of-service"]:hover,
footer a[href*="privacy-policy"]:hover,
footer a[href*="returns"]:hover {
opacity: 1;
}
}
/* Mobile: slightly tighter row so it can wrap cleanly */
@media (max-width: 780px){
footer a[href*="contact"],
footer a[href*="terms-of-service"],
footer a[href*="privacy-policy"],
footer a[href*="returns"] {
margin: 2px 10px !important;
font-size: 12px !important;
}
}
}
#fw-section-header {
/* =========================================
TRASH FANZ – HEADER / HERO / SEARCH TWEAKS
========================================= */
/* ==========================
1) MOBILE HEADER + HERO
========================== */
/* Keep header under announcement bar + tighten hero spacing on mobile */
@media (max-width: 780px){
/* If your announcement bar height is different, change this number */
:root {
--annc-h: 44px;
}
/* Announcement bar should sit above header */
.announcement,
.announcement-bar {
position: relative;
z-index: 60;
}
/* Push the header (logo/nav) down by the bar height */
header,
.site-header,
.header,
.fw-header {
margin-top: var(--annc-h) !important;
position: relative !important;
z-index: 100 !important;
}
/* Neutralize transparent/absolute header on mobile */
.header--transparent,
.site-header.is-transparent,
.site-header[style*="absolute"],
.fw-header[style*="absolute"] {
position: relative !important;
top: 0 !important;
}
/* Tighten hero top/bottom spacing */
.image-banner,
section[id*="hero"],
[data-section-type*="hero"],
.tf-hero-image,
.section-hero,
.hero,
.banner {
padding-top: 0 !important;
padding-bottom: 8px !important;
margin-top: 0 !important;
margin-bottom: 8px !important;
}
/* Pull the visible portion of the hero image up a bit */
.image-banner img,
section[id*="hero"] img,
.tf-hero-image img,
.section-hero img,
.hero img,
.banner img {
object-fit: cover !important;
object-position: center 12% !important; /* tweak 8–18% to taste */
}
/* Reduce gap before next section (e.g. “Choose a side”) */
.image-banner + section,
section[id*="hero"] + section,
.tf-hero-image + section,
.section-hero + section,
.hero + section,
.banner + section {
margin-top: 8px !important;
}
}
/* ==========================
2) MOBILE SEARCH FIX
(Keep search usable, kill blocking overlays)
========================== */
@media (max-width: 780px){
/* Keep header/search above the hero and clickable */
header,
.site-header,
.fw-header {
position: relative !important;
z-index: 1000 !important;
overflow: visible !important;
}
/* Make sure the search input itself is always tappable */
#tf-hs-input,
#tf-header-search,
.team-search,
.team-search *,
.search,
.search-bar,
.search input[type="search"] {
position: relative !important;
z-index: 1001 !important;
pointer-events: auto !important;
}
/* By default, kill scrims/overlays that can block taps */
#tf-hs-scrim,
#tf-hs-backdrop,
#tf-hs-results-backdrop,
.fw-header__search-overlay,
.fw-search-overlay,
.header-scrim,
.search-backdrop {
pointer-events: none !important;
opacity: 0 !important;
visibility: hidden !important;
}
/* When the search is actually open, allow the overlay again */
body.search-open #tf-hs-scrim,
body.search-open #tf-hs-backdrop,
body.search-open #tf-hs-results-backdrop,
body.search-open .fw-header__search-overlay,
body.search-open .fw-search-overlay,
body.search-open .header-scrim,
body.search-open .search-backdrop {
pointer-events: auto !important;
opacity: 1 !important;
visibility: visible !important;
}
/* Keep the rest of the page clickable */
main,
.page,
[role="main"],
.content {
position: relative !important;
z-index: 1 !important;
pointer-events: auto !important;
}
}
/* ==========================
3) DESKTOP NAV: force dropdowns to open downward
========================== */
@media (min-width: 821px){
/* Adjust selectors if your theme uses slightly different ones */
.fw-header [class*="dropdown"],
.fw-header [data-menu*="dropdown"],
.fw-header .menu-dropdown,
.fw-header .header-dropdown {
top: 100% !important; /* below the parent */
bottom: auto !important; /* not pinned to top */
transform: translateY(8px) !important; /* small gap under nav */
}
/* Don’t clip dropdowns */
.fw-header,
header.site-header {
overflow: visible !important;
}
}/* NAVIGATION HOVER GLOW EFFECT */
nav a:hover,
nav a:focus {
color: #ffffff !important;
text-shadow: 0 0 6px rgba(255, 255, 255, 0.85),
0 0 12px rgba(255, 255, 255, 0.65);
transition: all 0.18s ease-in-out;
}nav a:hover {
text-shadow: 0 0 6px #fff,
0 0 10px #fff,
0 0 18px #fff;
}/* Soft Glacier White Text Shadow */
.home-field-text,
.premium-locker-heading,
.rival-locker-heading {
text-shadow:
0px 1px 2px #f2f2f2, /* Soft Glacier White glow */
0px 0px 8px #f2f2f2; /* Broader ambient haze */
}
}
#fw-section-announcement-bar-1731032338 {
--color-primary: #d00000;
--color-primary-rgb: 208, 0, 0;
--color-background: #ffffff;
--color-background-rgb: 255, 255, 255;
--color-on-primary: #ffffff;
--color-on-primary-rgb: 255, 255, 255;
--color-on-background: #FFFFFF;
--color-on-background-rgb: 255, 255, 255;
--color-product-image-background: #FFFFFF;
--color-background-brightness: 255;
background-color: var(--color-background);
color: var(--color-on-background);
}
#fw-section-custom-html-a131b636-de65-4643-8e61-ea88186ca567 {
/* === Fix search bar spacing & perfect vertical alignment === */
@media (min-width: 769px) {
#tf-header-search {
display: block !important;
margin-top: 28px !important; /* reduced from 60px for tighter alignment */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* optional subtle shadow */
#tf-hs-input {
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
header {
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 6px;
}
}
/* === Layering rules === */
@media (min-width: 769px){
header{
position: relative !important;
z-index: 5000 !important;
}
#tf-header-search{
position: relative !important;
z-index: 2000 !important;
margin-top: 28px !important; /* must match the value above */
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
#tf-hs-results{
z-index: 2200 !important;
top: 46px;
}
}
/* === Mobile clean layout === */
@media (max-width: 768px){
#tf-header-search{
margin-top: 14px !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
}
}
}
#fw-section-custom-html-7c71bb1b-2f56-4f63-8aa6-35c913806c0f {
/* Completely hide the Team data (JSON) section so it takes up no space */
section:has(#tf-teams-json) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
/* Optional: tighten the spacing above the search bar section */
section:has(#tf-team-search) {
margin-top: 10px !important; /* adjust this number up/down to taste */
padding-top: 10px !important;
}
}