@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,400..900&family=Oswald:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

/* UAW Local 42 ? "PICKET SIGN" theme */

/* COLOR UPDATE: UAW yellow = #FFC72C, UAW blue = #0A3161 */

/* Paper + ink */
html body {
  background-color: #f3eee2 !important;
  background-image: radial-gradient(rgba(11, 11, 11, .07) 1px, transparent 1.2px) !important;
  background-size: 6px 6px !important;
  color: #0b0b0b !important;
}
html body *:not(i):not(.fa) {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif !important;
}
html body ::selection { background: #ffc72c; color: #0b0b0b; }
html body a:hover { text-decoration-color: #ffc72c; text-decoration-thickness: 3px; }

/* Let the paper show through the theme's white wrappers */
html body div[style*="background-color:#fff"]:not(.w3-card):not(#menuback),
html body div[style*="background-color:rgba(255,255,255,1.00)"]:not(.w3-card):not(#smallcalendarspot) {
  background-color: transparent !important;
}

/* Headlines */
html body :is(h1, h2):not(#x),
html body .tablediv .bigfont,
html body .highlighbox .whotext {
  font-family: 'Archivo', 'Oswald', Impact, sans-serif !important;
  font-stretch: 68%;
  font-weight: 900 !important;
  text-transform: uppercase;
}
html body h1 {
  font-size: clamp(64px, 11vw, 168px) !important;
  line-height: .82 !important;
  letter-spacing: -0.02em;
  color: #0a3161 !important;
  text-shadow: 6px 6px 0 #ffc72c, 9px 9px 0 #0b0b0b;
  margin: 12px 0 0 !important;
}
html body h2 {
  display: inline-block;
  font-size: clamp(34px, 4vw, 52px) !important;
  line-height: 1 !important;
  color: #ffc72c !important;
  background: #0b0b0b;
  padding: 8px 16px 6px !important;
  margin: 4px 0 12px !important;
  transform: rotate(-1.5deg);
}
html body div.mainelementcolor { color: #0a3161 !important; }

/* Header */
html body #menuback,
html body .maintopbackgroundcolor,
html body #menuback .tableback {
  background-color: #ffc72c !important;
}
html body #menuback {
  border: 0 !important;
  box-shadow: none !important;
  z-index: 10000 !important;
}
html body #menuback .tableback { padding: 14px 0 !important; }
html body #toplogo { transition: transform .3s; }
html body #toplogo:hover { transform: rotate(-8deg) scale(1.06); }
html body .tablediv .bigfont {
  font-size: clamp(34px, 5vw, 64px) !important;
  line-height: .88;
  letter-spacing: -0.01em;
  color: #0b0b0b !important;
}
html body .tablediv .smallerfont {
  display: inline-block;
  margin-top: 8px;
  padding: 5px 10px 4px;
  background: #0b0b0b;
  color: #ffc72c !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: .14em;
  transform: rotate(-2deg);
}
html body #deskmemberlogin .w3-button {
  background: #0b0b0b !important;
  color: #ffc72c !important;
  border: 3px solid #0b0b0b !important;
  border-radius: 0 !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  text-transform: uppercase;
  letter-spacing: .06em;
  box-shadow: 5px 5px 0 #0a3161;
  transition: transform .12s, box-shadow .12s !important;
}
html body #deskmemberlogin .w3-button:hover {
  transform: translate(-2px, -2px);
  box-shadow: 7px 7px 0 #0a3161;
}
html body #mobilehamburger { color: #0b0b0b !important; }

/* Menu */
html body #menuback .menudivplacelower,
html body #menuback #myMenu {
  background-color: #0b0b0b !important;
}
html body #menuback .menudivplacelower::after {
  content: "";
  display: block;
  height: 14px;
  background: repeating-linear-gradient(-45deg, #0b0b0b 0 14px, #ffc72c 14px 28px);
}
html body #myMenu {
  z-index: 10001 !important;
  display: flex !important;
  flex-wrap: wrap;
  width: 100% !important;
}
html body #myMenu,
html body #myMenu > li,
html body #myMenu > li > a {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0;
}
html body #myMenu > li {
  float: none !important;
  flex: 1 1 auto;
  text-align: center;
}
html body #myMenu > li > a {
  display: block;
  text-align: center;
  color: #ffc72c !important;
  font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  text-transform: uppercase;
  letter-spacing: .06em;
  transition: background-color .1s, color .1s;
}
html body #myMenu > li > a strong { font-family: inherit !important; font-weight: inherit; }
html body #myMenu > li > a:hover,
html body #myMenu > li:hover > a {
  color: #0b0b0b !important;
  background-color: #ffc72c !important;
}
html body #myMenu .nfSubC {
  background: #0b0b0b !important;
  border: 3px solid #ffc72c !important;
  box-shadow: 8px 8px 0 #0a3161 !important;
}
html body #myMenu .nfSubC .nfLink {
  color: #ffffff !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-size: 17px !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  border: 0 !important;
}
html body #myMenu .nfSubC .nfLink:hover { background: #ffc72c !important; color: #0b0b0b !important; }

/* Buttons */
html body .buttoncolor:not(#x) {
  background: #ffc72c !important;
  color: #0b0b0b !important;
  border: 3px solid #0b0b0b !important;
  border-radius: 0 !important;
  padding: 10px 24px !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  text-transform: uppercase;
  letter-spacing: .08em;
  box-shadow: 5px 5px 0 #0b0b0b;
  cursor: pointer;
  transition: transform .12s, box-shadow .12s;
}
html body .buttoncolor:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 #0b0b0b; }
html body .buttoncolor:active { transform: translate(3px, 3px); box-shadow: 2px 2px 0 #0b0b0b; }

/* Cards */
html body .w3-card,
html body .w3-card-4 {
  border: 3px solid #0b0b0b !important;
  border-radius: 0 !important;
  box-shadow: 8px 8px 0 #0b0b0b !important;
  overflow: visible;
}
html body .w3-modal-content { box-shadow: 12px 12px 0 #ffc72c !important; }

/* Calendar */
html body #smallcalendarspot { height: auto !important; padding: 6px !important; }
html body .calendarmoduletitle:not(#x) {
  color: #0a3161 !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-decoration: none !important;
}
html body .calendarmodulecontainer td {
  border: 0 !important;
  background: transparent !important;
  font-weight: 600;
  padding: 5px 2px !important;
}
html body .calendarmodulecontainer tr:first-child td {
  font-family: 'Oswald', sans-serif !important;
  color: #0a3161;
}
html body .calendarmodulecontainer td[style*="#0000ff"] {
  background: #ffc72c !important;
  outline: 3px solid #0b0b0b;
  outline-offset: -3px;
}
html body .calendarmodulecontainer td[style*="#0000ff"] a { color: #0b0b0b !important; font-weight: 800; }
html body .calendarmodulecontainer td[bgcolor="#ffffcc"] {
  background: #0a3161 !important;
  color: #ffffff !important;
}

/* Upcoming events */
html body .upcomingmodulecontent table.fadeitem {
  border: 3px solid #0b0b0b !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: 4px 4px 0 #ffc72c;
  transition: transform .15s;
}
html body .upcomingmodulecontent tr:nth-child(odd) table.fadeitem { transform: rotate(-3deg) !important; }
html body .upcomingmodulecontent tr:nth-child(even) table.fadeitem { transform: rotate(2deg) !important; }
html body .upcomingmodulecontent table.fadeitem:hover { transform: rotate(0) scale(1.08) !important; }
html body td.mainbackgroundcolor {
  background: #0a3161 !important;
  color: #ffc72c !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}
html body .upcomingmodulecontent table.fadeitem strong {
  font-family: 'Archivo', sans-serif !important;
  font-stretch: 68%;
  font-weight: 900;
  font-size: 30px;
}
html body a.upcomingmodulecontent {
  color: #0a3161 !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-weight: 700;
  font-size: 22px !important;
  text-transform: uppercase;
  letter-spacing: .02em;
}
html body a.upcomingmodulecontent:hover { background: #ffc72c; color: #0b0b0b !important; text-decoration: none; }

/* Highlight tiles */
html body .w3-container:has(> .highlighbox) {
  display: flex !important;
  flex-wrap: wrap;
  gap: 28px;
  justify-content: center;
  padding: 24px 16px !important;
}
html body .highlighbox {
  flex: 1 1 260px;
  width: auto !important;
  max-width: 400px !important;
  display: block !important;
  margin: 0 !important;
  padding: 18px 16px !important;
  background-image: radial-gradient(rgba(11, 11, 11, .12) 1.2px, transparent 1.5px) !important;
  background-size: 7px 7px !important;
  transition: transform .2s, box-shadow .2s;
}
html body .highlighbox:nth-child(1) { transform: rotate(-2deg); }
html body .highlighbox:nth-child(2) { transform: rotate(1.5deg) translateY(10px); }
html body .highlighbox:nth-child(3) { transform: rotate(-1deg); }
html body .highlighbox:hover {
  transform: rotate(0) translateY(-6px) scale(1.03);
  box-shadow: 14px 14px 0 #0b0b0b !important;
}
html body .highlighbox .whotext {
  font-size: clamp(30px, 3vw, 42px) !important;
  line-height: .95;
  display: inline-block;
  margin-top: 6px;
}
html body .highlighbox .smalliconshighlights {
  font-size: 64px !important;
  opacity: 1 !important;
}
html body .highlighbox .centerthis > div { font-weight: 600; font-size: 16px; }

/* Footer */
html body .bottomtable {
  position: relative;
  overflow: hidden;
  background-color: #0a3161 !important;
  color: #ffffff !important;
  margin-top: 40px !important;
  padding-top: 64px !important;
}
html body .bottomtable::before {
  content: "UAW LOCAL 42  \2605  CHATTANOOGA, TN  \2605  ESTABLISHED JULY 10, 2014  \2605  UAW LOCAL 42  \2605  CHATTANOOGA, TN  \2605  ESTABLISHED JULY 10, 2014  \2605  UAW LOCAL 42  \2605  CHATTANOOGA, TN  \2605  ESTABLISHED JULY 10, 2014  \2605  UAW LOCAL 42  \2605  CHATTANOOGA, TN  \2605  ESTABLISHED JULY 10, 2014  \2605  ";
  position: absolute;
  top: 0;
  left: 0;
  white-space: pre;
  padding: 10px 0 8px;
  background: #ffc72c;
  color: #0b0b0b;
  border-bottom: 3px solid #0b0b0b;
  font: 700 18px/1 'Oswald', 'Arial Narrow', sans-serif;
  letter-spacing: .12em;
  animation: uaw42-marquee 28s linear infinite;
}
@keyframes uaw42-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
html body .bottomtable,
html body .bottomtable * { letter-spacing: normal !important; }
html body .bottomtable::before { letter-spacing: .12em !important; }
html body .bottomtable a { color: #ffc72c !important; font-weight: 700; }
html body .bottomtable a:hover { color: #ffffff !important; }
html body .bottomtable .fa { color: #ffc72c !important; }
html body .bottomtable .iconssocialbottom:hover { color: #ffffff !important; }
html body .bottomtable .fadeitemstill { opacity: 1 !important; }
html body .bottomtable + .mainbackgroundcolor {
  background: #0b0b0b !important;
  color: #f3eee2 !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 14px;
}
html body .bottomtable + .mainbackgroundcolor a { color: #ffc72c !important; }

@media (max-width: 900px) {
  html body .highlighbox:nth-child(n) { transform: none; }
  html body h1 { text-shadow: 4px 4px 0 #ffc72c, 6px 6px 0 #0b0b0b; }
}
@media (prefers-reduced-motion: reduce) {
  html body .bottomtable::before { animation: none; }
  html body .buttoncolor,
  html body .highlighbox,
  html body #toplogo,
  html body .upcomingmodulecontent table.fadeitem { transition: none !important; }
}


/* KEPT FROM PREVIOUS THEME */

/* Members dropdown */
html body #menuback #myMenu > li.nfParent { position: static !important; }
html body #menuback #myMenu ul.nfSubC {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center;
  padding: 4px 12px !important;
  z-index: 10002 !important;
}
html body #menuback #myMenu ul.nfSubC > li {
  float: none !important;
  flex: 0 1 auto !important;
  width: auto !important;
  border: 0 !important;
}
html body #menuback #myMenu ul.nfSubC > li > a {
  width: auto !important;
  padding: 14px 18px !important;
  white-space: nowrap;
}

/* Our Contracts page */
html body .ccw { max-width: 1100px; margin: 8px auto 32px; font-family: 'Inter', Arial, sans-serif; color: #2b3448; }
html body .ccw-intro { font-size: 17px; margin: 0 0 22px; }
html body .ccw-feat {
  display: grid; grid-template-columns: auto 1fr auto; gap: 26px; align-items: center;
  background: linear-gradient(135deg, #0a3161, #061f3d); color: #fff;
  border-radius: 20px; padding: 30px 32px; box-shadow: 0 8px 24px rgba(16, 24, 48, .15);
}
html body .ccw-ic {
  width: 64px; height: 80px; background: #ffc72c; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  color: #061f3d !important; font: 900 16px 'Archivo', Arial, sans-serif !important;
}
html body .ccw-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #ffc72c !important; }
html body .ccw-feat h2 {
  font-size: 30px !important; line-height: 1.05; margin: 6px 0 8px !important; color: #ffffff !important;
}
html body .ccw-meta { font-size: 14px; color: rgba(255, 255, 255, .85) !important; }
html body .ccw-btns { display: flex; flex-direction: column; gap: 10px; }
html body a.ccw-btn {
  display: inline-block; text-align: center; border-radius: 999px; padding: 12px 24px;
  font-weight: 700; text-decoration: none !important; white-space: nowrap; transition: transform .15s;
}
html body a.ccw-btn:hover { transform: translateY(-1px); }
html body a.ccw-y { background: #ffc72c; color: #061f3d !important; }
html body a.ccw-o { border: 2px solid rgba(255, 255, 255, .55); color: #ffffff !important; }
html body a.ccw-b { background: #0a3161; color: #ffffff !important; }





html body .ccw-help {
  margin-top: 26px; display: flex; gap: 16px; align-items: center; justify-content: space-between;
  flex-wrap: wrap; background: #f1f3f8; border-radius: 16px; padding: 20px 24px;
}
html body .ccw-help b { color: #061f3d; font-size: 17px; }
html body .ccw-help span { font-size: 14px; color: #5d667c; }
@media (max-width: 760px) {
  html body .ccw-feat { grid-template-columns: 1fr; }
  html body .ccw-feat h2 { font-size: 24px !important; }
}


/* Picket Sign tweaks */
html body .bottomtable img[src*="UA_Logo"] {
  background: #ffffff;
  padding: 8px 10px;
  border: 3px solid #0b0b0b;
  box-shadow: 5px 5px 0 #ffc72c;
}


/* Fix: pop-ups must sit above the sticky header */
html body #menuback:not(#x) { z-index: 1000 !important; }
html body #myMenu:not(#x) { z-index: 1001 !important; }
html body #menuback #myMenu ul.nfSubC:not(#x) { z-index: 1002 !important; }
html body .w3-dropdown-hover,
html body .w3-dropdown-click { z-index: 20000 !important; }
html body .w3-dropdown-content { z-index: 20001 !important; }
html body .w3-modal:not(#x) { z-index: 20002 !important; }


/* Home page */
html body div:has(> #whatsnewbuttons) > .mainelementcolor { display: flex; align-items: flex-end; min-height: 260px; padding: 26px 30px !important; margin-bottom: 6px; background: linear-gradient(90deg, rgba(6,31,61,.88) 0%, rgba(6,31,61,.55) 50%, rgba(6,31,61,.1) 100%), url('/images/image.jpg') center 62% / cover no-repeat !important; border: 3px solid #0b0b0b; box-shadow: 8px 8px 0 #0b0b0b; }
html body div:has(> #whatsnewbuttons) > .mainelementcolor h1 { margin: 0 !important; color: #fff !important; text-shadow: 5px 5px 0 #0b0b0b !important; -webkit-text-stroke: 0 !important; }


/* Fix: footer text turned dark blue whenever the mouse was over */
html body .bottomtable.secondarybackcolor:hover,
html body .bottomtable.secondarybackcolor:hover span,
html body .bottomtable.secondarybackcolor:hover div {
  color: #ffffff !important;
}


/* ORDERING A VEHICLE page */
html body .cvx { max-width: 1100px; margin: 10px auto 30px; color: #0b0b0b; }
html body .cvx > div { width: 100% !important; box-sizing: border-box; }
html body .cvx-hero {
  background: #0a3161; color: #fff; border: 3px solid #0b0b0b; box-shadow: 8px 8px 0 #0b0b0b;
  padding: 26px 28px; display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center;
}
html body .cvx-hero h2 {
  background: none !important; transform: none !important; padding: 0 !important;
  color: #ffc72c !important; margin: 0 0 8px !important; font-size: 40px !important;
}
html body .cvx-hero p { margin: 0; font-size: 17px; color: #fff !important; }
html body .cvx-btns { display: flex; flex-direction: column; gap: 10px; }
html body a.cvx-b {
  display: block; text-align: center; padding: 12px 20px; text-decoration: none !important;
  border: 3px solid #0b0b0b; font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
}
html body a.cvx-y { background: #ffc72c; color: #0b0b0b !important; box-shadow: 4px 4px 0 #0b0b0b; }
html body a.cvx-w { background: #fff; color: #0a3161 !important; }
html body .cvx-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin: 28px 0; }
html body .cvx-f { background: #fff; border: 3px solid #0b0b0b; box-shadow: 5px 5px 0 #ffc72c; padding: 16px; }
html body .cvx-f b {
  display: block; font-family: 'Archivo', sans-serif !important; font-stretch: 68%;
  font-weight: 900; font-size: 30px; color: #0a3161; line-height: 1;
}
html body .cvx-f span { font-size: 14px; display: block; margin-top: 6px; }
html body .cvx h3.cvx-t {
  font-family: 'Oswald', sans-serif !important; text-transform: uppercase;
  font-size: 24px !important; margin: 26px 0 12px !important; color: #0b0b0b !important;
}
html body .cvx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
html body .cvx-grid a {
  display: flex; justify-content: space-between; gap: 8px; background: #fff;
  border: 2px solid #0b0b0b; padding: 12px 14px; font-weight: 700;
  color: #0a3161 !important; text-decoration: none !important;
}
html body .cvx-grid a:hover { background: #ffc72c; color: #0b0b0b !important; }
html body .cvx-grid a small { color: #5d667c; font-weight: 600; white-space: nowrap; }
html body .cvx-help {
  margin-top: 26px; background: #0b0b0b; color: #fff; padding: 18px 22px;
  display: flex; flex-wrap: wrap; gap: 24px; align-items: center;
}
html body .cvx-help b { color: #ffc72c; font-size: 22px; }
html body .cvx-help span { color: #fff !important; }
html body .cvx-help a { color: #ffc72c !important; }
html body .cvx iframe.pdfview { display: block; width: 100%; max-width: 900px; height: 800px; margin: 0 auto; border: 3px solid #0b0b0b; background: #fff; }
@media (max-width: 800px) {
  html body .cvx-hero { grid-template-columns: 1fr; }
  html body .cvx-facts { grid-template-columns: 1fr 1fr; }
  html body .cvx iframe.pdfview { height: 500px; }
}


/* COMMITTEES page: card grid + "get involved" banner */
html body #maincolumnspot:has(> table > tbody > tr.darkfont + tr + tr.darkfont) {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 26px;
  align-items: stretch;
  padding: 8px 4px 20px;
}
html body #maincolumnspot:has(> table > tbody > tr.darkfont + tr + tr.darkfont) > table:first-child {
  grid-column: 1 / -1; order: -2;
}
html body #maincolumnspot:has(> table > tbody > tr.darkfont + tr + tr.darkfont) > br { display: none; }
html body #maincolumnspot:has(> table > tbody > tr.darkfont + tr + tr.darkfont)::before {
  content: "WANT TO GET INVOLVED?  Every committee is open to Local 42 members. Talk to your steward or call the Local at (423) 531-4269.";
  grid-column: 1 / -1; order: -1;
  display: block;
  background: #ffc72c; color: #0b0b0b;
  border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0b0b0b;
  padding: 16px 20px;
  font: 600 17px/1.4 'Inter', Arial, sans-serif;
}
/* each committee = a card */
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) {
  width: 100% !important; height: 100%;
  background: #ffffff;
  border: 3px solid #0b0b0b !important;
  box-shadow: 6px 6px 0 #0a3161;
  border-collapse: separate;
}
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:first-child > td {
  background: #0a3161 !important; color: #ffc72c !important;
  padding: 14px 16px !important;
  border: 0 !important;
}
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:first-child * {
  color: #ffc72c !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-size: 21px !important; font-weight: 700 !important;
  text-transform: uppercase; letter-spacing: .03em;
  background: transparent !important;
}
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:nth-child(2) > td {
  padding: 14px 16px 6px !important; font-size: 15px; line-height: 1.55; vertical-align: top;
  background: #ffffff !important;
}
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) ul { margin: 6px 0 10px; padding-left: 20px; }
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td {
  padding: 12px 16px 14px !important; font-size: 14px;
  border-top: 2px dashed #0b0b0b !important;
  background: #f3eee2 !important; vertical-align: bottom;
}
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child a { color: #0a3161 !important; font-weight: 700; }
/* Committee cards */
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) { align-self: start !important; height: auto !important; }

/* Compact header on scroll */
html body #menuback { transition: top .4s ease-out, box-shadow .3s !important; }
html body #menuback:has(#toplogo[style*="65px"]) { top: -149px !important; }
html body #menuback .tableback { transition: padding .3s ease-out !important; }
html body #menuback:has(#toplogo[style*="65px"]) .tableback { padding-bottom: 0 !important; }
html body #menuback #myMenu > li > a { transition: padding .3s ease-out, color .2s, background-color .2s !important; }
html body #menuback:has(#toplogo[style*="65px"]) #myMenu > li > a { padding-top: 10px !important; padding-bottom: 10px !important; }

/* CONSTITUTION / BYLAWS page */
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) { display: block !important; width: 100% !important; }
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) > tbody { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 24px; margin: 12px 0 22px; }
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) > tbody > tr { display: block !important; }
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont {
  display: block !important; position: relative; box-sizing: border-box; height: 100%;
  background: linear-gradient(135deg, #0a3161, #061f3d) !important; color: #fff !important;
  border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0b0b0b;
  padding: 26px 26px 26px 112px !important; min-height: 150px; transition: transform .15s, box-shadow .15s;
}
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 #0b0b0b; }
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont img { display: none !important; }
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont::before {
  content: "PDF"; position: absolute; left: 26px; top: 26px; width: 62px; height: 78px;
  display: flex; align-items: center; justify-content: center;
  background: #ffc72c; color: #0a3161; border: 2px solid #0b0b0b; font: 900 16px 'Archivo', Arial, sans-serif;
}
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont a,
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont a * {
  color: #fff !important; text-decoration: none !important; font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif !important;
  font-size: 27px !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: .02em; line-height: 1.1;
}
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont a::after { content: ""; position: absolute; inset: 0; }
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont > font > font {
  display: block; margin-top: 4px; font-size: 14px !important; color: rgba(255, 255, 255, .8) !important;
}
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont::after {
  content: "OPEN PDF \2192"; display: inline-block; margin-top: 16px; padding: 8px 18px;
  background: #ffc72c; color: #0b0b0b; border: 2px solid #0b0b0b; font: 600 15px 'Oswald', Arial, sans-serif; letter-spacing: .06em;
}
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) > tbody::after {
  content: "LOCAL 42 BYLAWS \A Coming soon"; white-space: pre-line; display: flex; align-items: center; box-sizing: border-box; min-height: 150px;
  padding: 26px; border: 3px dashed #0a3161; background: #f3eee2; color: #0a3161; font: 600 24px/1.3 'Oswald', Arial, sans-serif; letter-spacing: .02em;
}

/* Constitution cards */
html body #maincolumnspot table:has(> tbody > tr > td.darkfont img[src*="filetypes"]) td.darkfont::before {
  content: "" !important; width: 70px !important; height: 70px !important; top: 24px !important;
  background: url('https://server5v3.unionactive.com/logos/UAW.png') center / contain no-repeat !important;
  border: 0 !important;
}

/* OFFICERS / REPS PAGE */
html body .ofx { max-width: 1200px; margin: 0 auto 30px; font-family: 'Inter', Arial, sans-serif; color: #1a1a1a; }
html body .ofx-intro { font-size: 17px; line-height: 1.55; margin: 6px 0 24px; }
html body .ofx-intro a { color: #0a3161 !important; font-weight: 700; }
html body .ofx-av {
  flex: 0 0 auto; width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: #ffc72c; color: #0a3161 !important; border: 2px solid #0b0b0b; font: 600 17px 'Oswald', Arial, sans-serif; letter-spacing: .03em;
}
html body .ofx-chair {
  display: flex; align-items: center; gap: 22px; padding: 26px 30px; margin-bottom: 10px;
  background: linear-gradient(135deg, #0a3161, #061f3d); color: #fff; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0b0b0b;
}
html body .ofx-chair .ofx-av { width: 74px; height: 74px; font-size: 26px; }
html body .ofx-eyebrow { font: 600 14px 'Oswald', Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #ffc72c !important; }
html body .ofx-bigname { font: 600 34px/1.05 'Oswald', Arial, sans-serif; text-transform: uppercase; color: #fff !important; }
html body .ofx h3.ofx-h {
  display: inline-block; margin: 34px 0 14px !important; padding: 6px 16px; background: #0a3161; color: #ffc72c !important;
  font: 600 22px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .04em; box-shadow: 4px 4px 0 #0b0b0b;
}
html body .ofx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
html body .ofx-grid.ofx-small { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
html body .ofx-card {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px; background: #fff;
  border: 3px solid #0b0b0b; box-shadow: 5px 5px 0 #0a3161;
}
html body .ofx-card b { display: block; font: 600 19px/1.15 'Oswald', Arial, sans-serif; text-transform: uppercase; color: #0a3161; letter-spacing: .02em; }
html body .ofx-card span:not(.ofx-av) { display: block; margin-top: 3px; font-size: 14px; line-height: 1.3; color: #444; }
html body .ofx-small .ofx-card { padding: 11px 14px; box-shadow: 4px 4px 0 #0a3161; }
html body .ofx-small .ofx-av { width: 38px; height: 38px; font-size: 14px; }
html body .ofx-small .ofx-card b { font-size: 17px; }





@media (max-width: 600px) {
  html body .ofx-bigname { font-size: 26px; }
  html body .ofx-chair { padding: 20px; }
}

/* Standard-page title banner when no header photo is set */
html body #pageheaderspace[style*="url('/pics/')"] {
  background: linear-gradient(135deg, #0a3161, #061f3d) !important; height: auto !important; min-height: 150px;
  border-bottom: 8px solid #ffc72c; box-sizing: border-box;
}
html body #pageheaderspace[style*="url('/pics/')"] #innerdarkdiv { background: transparent !important; }
html body #pageheaderspace[style*="url('/pics/')"] .pageheader {
  color: #fff !important; font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif !important; font-weight: 600 !important;
  text-transform: uppercase; letter-spacing: .03em;
}
html body #pageheaderspace[style*="url('/pics/')"] .subpageheader {
  color: #ffc72c !important; font-family: 'Oswald', Arial, sans-serif !important; font-size: 16px !important;
  text-transform: uppercase; letter-spacing: .12em;
}
html body div:has(> .descripspot) { background-color: #f3eee2 !important; }
html body .ofx .ofx-av, html body .ofx .ofx-eyebrow, html body .ofx .ofx-bigname, html body .ofx .ofx-card b { font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif !important; }

/* Officers page */
html body #maincolumnspot .ofx img.ofx-av { display: block !important; width: 46px !important; height: 46px !important; min-width: 0 !important; max-width: none !important; object-fit: cover; object-position: center 25%; padding: 0; box-sizing: border-box; background: #ffc72c; }
html body #maincolumnspot .ofx .ofx-chair img.ofx-av { width: 74px !important; height: 74px !important; }
html body #maincolumnspot .ofx .ofx-small img.ofx-av { width: 38px !important; height: 38px !important; }

/* OFFICE LOCATIONS page */
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) {
  display: block !important; width: auto !important; max-width: 960px; margin: 10px auto 30px !important; box-sizing: border-box;
  background: #fff !important; border: 3px solid #0b0b0b !important; border-radius: 0 !important; box-shadow: 8px 8px 0 #0a3161;
}
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) > tbody { display: block; }
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) > tbody > tr { display: flex !important; flex-wrap: wrap; }
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) > tbody > tr > td { display: block !important; flex: 1 1 260px; box-sizing: border-box; padding: 16px 24px !important; font-size: 16px; line-height: 1.6; text-align: left !important; white-space: normal !important; width: auto !important; }
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) > tbody > tr:first-child > td {
  background: #0a3161 !important; padding: 16px 24px !important;
}
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) > tbody > tr:first-child > td, html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) > tbody > tr:first-child > td * {
  color: #ffc72c !important; font: 600 28px 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .03em;
}
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) > tbody > tr:nth-child(2) > td:first-child { font-size: 19px; font-weight: 600; color: #0a3161; }
html body #maincolumnspot table.resptable[bgcolor="#ececec"]:has(> tbody > tr:first-child > td[colspan="2"][style*="#ccc"]) a { color: #0a3161 !important; font-weight: 700; }
html body .olx-btns { display: flex; flex-wrap: wrap; gap: 12px; margin: 2px 0 18px; }
html body #maincolumnspot a.olx-btn {
  display: inline-block; padding: 10px 20px; background: #ffc72c; color: #0b0b0b !important; border: 2px solid #0b0b0b; box-shadow: 3px 3px 0 #0b0b0b;
  font: 600 16px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .05em; text-decoration: none !important;
}
html body #maincolumnspot a.olx-btn.olx-o { background: #fff; }
html body #maincolumnspot a.olx-btn:hover { transform: translate(-1px, -1px); box-shadow: 4px 4px 0 #0b0b0b; }
html body #maincolumnspot iframe.olx-map { display: block; width: 100% !important; height: 380px; border: 3px solid #0b0b0b; box-sizing: border-box; }

/* Ordering a Vehicle */
html body #maincolumnspot a.cvx-f.cvx-flink { color: #0b0b0b !important; text-decoration: none !important; cursor: pointer; transition: transform .15s, box-shadow .15s; }
html body #maincolumnspot a.cvx-f.cvx-flink span { color: rgb(11, 11, 11) !important; text-decoration: none !important; }
html body #maincolumnspot a.cvx-f.cvx-flink em {
  display: inline-block; margin-top: 12px; padding: 5px 10px; font-style: normal; background: #0a3161; color: #ffc72c !important;
  font: 600 13px/1.25 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .05em;
}
html body #maincolumnspot a.cvx-f.cvx-flink:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 #ffc72c !important; }
html body #maincolumnspot a.cvx-f.cvx-flink:hover em { background: #0b0b0b; }

/* MEMBER HOME */
html body .mhx { max-width: 1200px; margin: 6px auto 26px; font-family: 'Inter', Arial, sans-serif; }
html body .mhx-hero {
  padding: 28px 30px; background: linear-gradient(135deg, #0a3161, #061f3d); color: #fff !important;
  border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0b0b0b; margin-bottom: 26px;
}
html body .mhx-eyebrow { font: 600 14px 'Oswald', Arial, sans-serif !important; letter-spacing: .12em; text-transform: uppercase; color: #ffc72c !important; }
html body .mhx-hero h2 { margin: 6px 0 10px !important; color: #fff !important; font: 600 32px/1.1 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; }
html body .mhx-hero p { margin: 0; font-size: 17px; line-height: 1.5; color: rgba(255,255,255,.92) !important; }
html body .mhx-hero a { color: #ffc72c !important; font-weight: 700; }
html body .mhx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; }
html body #maincolumnspot a.mhx-tile {
  display: block; position: relative; padding: 18px 44px 18px 20px; background: #fff; color: #0b0b0b !important; text-decoration: none !important;
  border: 3px solid #0b0b0b; box-shadow: 5px 5px 0 #0a3161; transition: transform .15s, box-shadow .15s;
}
html body #maincolumnspot a.mhx-tile::after { content: "\2192"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font: 600 22px 'Oswald', Arial, sans-serif; color: #0a3161; }
html body #maincolumnspot a.mhx-tile:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 #ffc72c; }
html body .mhx-tile b { display: block; font: 600 21px/1.15 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; color: #0a3161 !important; letter-spacing: .02em; }
html body .mhx-tile span { display: block; margin-top: 4px; font-size: 14px; line-height: 1.35; color: #444 !important; }




html body #maincolumnspot .mhx .mhx-hero h2 { display: block !important; background: none !important; transform: none !important; padding: 0 !important; box-shadow: none !important; letter-spacing: .01em !important; font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif !important; font-weight: 600 !important; font-size: 32px !important; color: #fff !important; }

/* Officers page */
html body .ofx .ofx-card span.ofx-sub { font-size: 12.5px !important; color: #6b6b6b !important; margin-top: 2px; }
html body .ofx .ofx-district .ofx-card span:not(.ofx-av):not(.ofx-sub) { font-weight: 600; color: #222 !important; }

/* Officers page */
html body .ofx .ofx-card.ofx-tbd { background: #f3eee2; border-style: dashed; box-shadow: none; }
html body .ofx .ofx-card.ofx-tbd .ofx-av { background: #fff; color: #888 !important; border-style: dashed; }
html body .ofx .ofx-card.ofx-tbd b { color: #777 !important; }

/* FIRESIDE 42 VIDEOS */
html body .fsx { max-width: 1100px; margin: 4px auto 30px; }
html body .fsx-intro { font-size: 17px; line-height: 1.55; margin: 0 0 18px; }
html body .fsx-player { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #0b0b0b; border: 3px solid #0b0b0b; box-shadow: 8px 8px 0 #0a3161; }
html body #maincolumnspot .fsx-player iframe { position: absolute; inset: 0; width: 100% !important; height: 100% !important; border: 0; }
html body .fsx-more { margin-top: 18px; font-size: 15px; color: #444; }
html body .fsx-more a { color: #0a3161 !important; font-weight: 700; }

/* Officers pages */
html body .ofx .ofx-intro.ofx-outro { margin: 34px 0 6px !important; padding-top: 18px; border-top: 3px solid #0a3161; font-size: 16px; }
/* Officers pages */
html body #maincolumnspot .ofx .ofx-chair { clear: both; }

/* Representatives page */
html body .ofx .ofx-has-mail { position: relative; cursor: pointer; transition: transform .15s, box-shadow .15s; }
html body .ofx .ofx-has-mail:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 #ffc72c !important; }
html body #maincolumnspot .ofx a.ofx-mailto {
  display: inline-block; margin-top: 6px; padding: 2px 8px; background: #0a3161; color: #ffc72c !important; text-decoration: none !important;
  font: 600 12px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .08em;
}
html body #maincolumnspot .ofx a.ofx-mailto::before { content: "\2709  "; }
html body #maincolumnspot .ofx a.ofx-mailto::after { content: ""; position: absolute; inset: 0; }
html body #maincolumnspot .ofx .ofx-chair a.ofx-mailto { background: #ffc72c; color: #0a3161 !important; margin-top: 8px; font-size: 13px !important; }

/* CONTACT MY REP page */
html body .crx-hero{padding:24px 26px;margin:4px 0 24px;background:linear-gradient(135deg,#0a3161,#061f3d);border:3px solid #0b0b0b;box-shadow:6px 6px 0 #0b0b0b;color:#fff!important}
html body .crx-hero .ofx-eyebrow{color:#ffc72c!important}
html body .crx-hero h2,html body .crx-hero .crx-h{margin:6px 0 8px!important;color:#fff!important;font:600 30px/1.1 'Oswald','Arial Narrow',Arial,sans-serif!important;text-transform:uppercase;background:none!important;padding:0!important;border:0!important}
html body .crx-hero p{margin:0!important;font-size:16px;line-height:1.5;color:rgba(255,255,255,.92)!important}
html body .crx-hero a{color:#ffc72c!important;font-weight:700}
html body .crx .ofx-chair{margin-top:28px}

/* MEMBER DIRECTORY */
html body #maincolumnspot:has(form[name="seerchusers"]) p:has(+ font){margin:4px 0 22px!important;padding:14px 18px;background:#fff;border:3px solid #0b0b0b;border-left:10px solid #ffc72c;box-shadow:4px 4px 0 #0a3161;max-width:900px}
html body #maincolumnspot:has(form[name="seerchusers"]) p:has(+ font) font{font-size:16px!important;color:#222!important}
html body #maincolumnspot:has(form[name="seerchusers"]) font[size="3"] > b, html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] font[size="3"] b{display:block;font:600 22px/1.1 'Oswald','Arial Narrow',Arial,sans-serif!important;text-transform:uppercase;letter-spacing:.03em;color:#0a3161!important;margin:6px 0 10px}
html body #maincolumnspot:has(form[name="seerchusers"]) font[size="2"] > font[size="1"]{display:flex;flex-wrap:wrap;gap:6px;font-size:0!important;color:transparent!important;margin:0 0 20px;max-width:900px}
html body #maincolumnspot:has(form[name="seerchusers"]) font[size="2"] > font[size="1"] a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;font:600 18px 'Oswald',Arial,sans-serif!important;color:#0a3161!important;background:#fff;border:2px solid #0b0b0b;box-shadow:2px 2px 0 #0a3161;text-decoration:none!important}
html body #maincolumnspot:has(form[name="seerchusers"]) font[size="2"] > font[size="1"] a:hover{background:#ffc72c;color:#0b0b0b!important}
html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"]{margin:0 0 24px;padding:16px 18px 18px;background:#f3eee2;border:3px dashed #0a3161;max-width:900px}
html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] table{width:100%}
html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] td[colspan] br{display:none}
html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] font[size="1"]{font-size:13px!important}
html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] select,html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] input[type=text]{height:44px;font-size:16px!important;border:2px solid #0b0b0b!important;border-radius:0!important;background:#fff;padding:0 10px}
html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] input[type=text]{width:100%!important}
html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable{border:3px solid #0b0b0b!important;box-shadow:5px 5px 0 #0a3161;background:#fff!important;margin-bottom:10px}
html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable tr:first-child td{background:#0a3161!important;color:#fff!important;border:0!important}
html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable tr:first-child td font,html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable tr:first-child td b{color:#fff!important;font:600 15px 'Oswald',Arial,sans-serif!important;text-transform:uppercase;letter-spacing:.06em}
html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable tr + tr td{border-bottom:1px solid #ddd!important}
html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable tr + tr:nth-child(odd) td{background:#f7f5ef!important}
html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable td font{font-size:16px!important}
html body #maincolumnspot:has(form[name="seerchusers"]) table.resptable a font{color:#0a3161!important;font-weight:600}
html body #maincolumnspot:has(form[name="seerchusers"]) form#frm{margin-top:10px;padding:18px 20px;background:#fff;border:3px solid #0b0b0b;box-shadow:5px 5px 0 #0b0b0b}
html body #maincolumnspot:has(form[name="seerchusers"]) form#frm img[src*="emailformicon"]{display:none}

html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] + table b font[size="3"]{display:block;margin:4px 0 8px;font:600 22px/1.1 'Oswald','Arial Narrow',Arial,sans-serif!important;text-transform:uppercase;letter-spacing:.03em;color:#0a3161!important}
html body #maincolumnspot:has(form[name="seerchusers"]) form[name="seerchusers"] td:first-child{width:1%}

/* NEWS FEEDS: NEWSLETTERS + SOCIAL */
html body #maincolumnspot h3.nlx-h { display: inline-block; margin: 34px 0 14px !important; padding: 6px 14px !important; background: #0a3161 !important; color: #fff !important; font: 600 24px/1.1 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .04em; box-shadow: 4px 4px 0 #ffc72c; border: 0 !important; }
html body #maincolumnspot h3.nlx-h:first-child { margin-top: 6px !important; }
html body .nlx { max-width: 1200px; font-family: 'Inter', Arial, sans-serif; margin-bottom: 26px; }
html body .nlx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
html body #maincolumnspot .nlx-card { display: block; position: relative; padding: 18px 44px 18px 20px; background: #fff; color: #0b0b0b !important; text-decoration: none !important; border: 3px solid #0b0b0b; box-shadow: 5px 5px 0 #0a3161; transition: transform .15s, box-shadow .15s; }
html body #maincolumnspot a.nlx-card::after { content: "\2197"; position: absolute; right: 16px; top: 16px; font: 600 20px 'Oswald', Arial, sans-serif; color: #0a3161; }
html body #maincolumnspot a.nlx-card:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 #ffc72c; }
html body #maincolumnspot .nlx-tag { display: inline-block; padding: 2px 8px; margin-bottom: 8px; background: #ffc72c; color: #0b0b0b !important; border: 2px solid #0b0b0b; font: 600 12px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .08em; }
html body .nlx-card b { display: block; font: 600 21px/1.15 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; color: #0a3161 !important; letter-spacing: .02em; }
html body .nlx-card > span:not(.nlx-tag) { display: block; margin-top: 4px; font-size: 14px; line-height: 1.4; color: #444 !important; }
html body #maincolumnspot .nlx-card.nlx-soon { background: #f3eee2; border-style: dashed; box-shadow: none; }
html body .nlx-note { margin: 0 0 14px !important; font-size: 15px; color: #333 !important; }
html body .nlx-social { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
html body #maincolumnspot a.nlx-soc { display: block; padding: 12px 14px; background: #fff; color: #0b0b0b !important; text-decoration: none !important; border: 2px solid #0b0b0b; box-shadow: 3px 3px 0 #0a3161; border-left: 8px solid #0a3161; transition: transform .15s, box-shadow .15s; }
html body #maincolumnspot a.nlx-soc:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0 #ffc72c; border-left-color: #ffc72c; }
html body .nlx-soc b { display: block; font: 600 18px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; color: #0a3161 !important; letter-spacing: .03em; }
html body .nlx-soc span { display: block; font-size: 13px; color: #555 !important; }

/* CONTACT: out of the top menu, big button in the footer Contact Us */
html body #myMenu li.nfItem:has(> a.nfLink[href*="contact.cfm"]){display:none!important}
html body tr:has(> td.mobilemenulinksapp a[href*="contact.cfm"]){display:none!important}
html body a[title="Contact Us"]:has(> i.iconssocialbottom){display:inline-flex!important;align-items:center;gap:12px;padding:16px 28px!important;background:#ffc72c!important;color:#0b0b0b!important;border:3px solid #0b0b0b;box-shadow:6px 6px 0 #0b0b0b;text-decoration:none!important;transition:transform .15s,box-shadow .15s}
html body a[title="Contact Us"]:has(> i.iconssocialbottom):hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 #0b0b0b;background:#fff!important}
html body a[title="Contact Us"] > i.iconssocialbottom{color:#0b0b0b!important;font-size:30px!important;margin:0!important;width:auto!important}
html body a[title="Contact Us"]:has(> i.iconssocialbottom)::after{content:"Contact Us";font:600 26px/1 'Oswald','Arial Narrow',Arial,sans-serif;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
html body td:has(> a[title="Contact Us"] > i.iconssocialbottom)::before,html body div:has(> a[title="Contact Us"] > i.iconssocialbottom)::before{content:"Questions about your contract or a problem at work?";display:block;margin:0 auto 14px;max-width:320px;color:#fff;font:500 17px/1.35 'Inter',Arial,sans-serif;text-align:center}

/* PHOTO GALLERY */
/* landing page banner */
html body #maincolumnspot #gallerylistspot::before {
  content: "Our Union in Pictures";
  display: flex; flex-direction: column; justify-content: flex-end; min-height: 300px; margin: 0 0 26px; padding: 28px 30px;
  background: linear-gradient(180deg, rgba(6,31,61,.05) 20%, rgba(6,31,61,.92) 100%), url('/pics/local42-uaw-01.jpg') center 35% / cover no-repeat;
  border: 3px solid #0b0b0b; box-shadow: 8px 8px 0 #ffc72c;
  color: #fff; font: 600 44px/1 'Oswald', 'Arial Narrow', Arial, sans-serif; text-transform: uppercase; letter-spacing: .02em;
}
/* album cards */
html body #maincolumnspot #gallerylistspot > table { width: 100% !important; }
html body #maincolumnspot #gallerylistspot > table > tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; }
html body #maincolumnspot #gallerylistspot tr.hoverrowset { display: flex; flex-direction: column; background: #fff !important; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0a3161; cursor: pointer; overflow: hidden; transition: transform .18s, box-shadow .18s; }
html body #maincolumnspot #gallerylistspot tr.hoverrowset:hover { transform: translate(-3px, -3px); box-shadow: 9px 9px 0 #ffc72c; }
html body #maincolumnspot #gallerylistspot tr.hoverrowset > td { display: block; width: auto !important; padding: 0 !important; background: transparent !important; }
html body #maincolumnspot #gallerylistspot tr.hoverrowset > td > div { width: 100% !important; height: 230px !important; border: 0 !important; border-bottom: 3px solid #0b0b0b !important; background-size: cover !important; background-position: center !important; transition: transform .4s; }
html body #maincolumnspot #gallerylistspot tr.hoverrowset:hover > td > div { transform: scale(1.04); }
html body #maincolumnspot #gallerylistspot a.galleryname { display: block; position: relative; z-index: 1; padding: 14px 44px 16px 18px; background: #fff; color: #0a3161 !important; text-decoration: none !important; font: 600 23px/1.15 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .02em; }
html body #maincolumnspot #gallerylistspot a.galleryname::after { content: "\2192"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: #0a3161; }
html body #maincolumnspot #gallerylistspot tr.hoverrowset:hover a.galleryname { background: #ffc72c; }
/* album covers */
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163123"] > td > div { background-image: url('/pics/local42-uaw-16.jpg') !important; }
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163124"] > td > div { background-image: url('/pics/local42-uaw-17.jpg') !important; }
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163125"] > td > div { background-image: url('/pics/local42-uaw-22.jpg') !important; }
/* featured album */
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163123"] { order: -1; grid-column: 1 / -1; }
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163123"] > td > div { height: 340px !important; background-position: center 30% !important; }
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163124"] { order: 1; }
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163125"] { order: 2; }
/* inside an album */
html body #maincolumnspot #wipepics { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; margin-top: 10px; }
html body #maincolumnspot #wipepics > table { display: block; width: auto !important; background: #fff; border: 3px solid #0b0b0b; box-shadow: 5px 5px 0 #0a3161; overflow: hidden; transition: transform .18s, box-shadow .18s; }
html body #maincolumnspot #wipepics > table:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 #ffc72c; }
html body #maincolumnspot #wipepics > table > tbody, html body #maincolumnspot #wipepics > table > tbody > tr, html body #maincolumnspot #wipepics > table > tbody > tr > td { display: block; padding: 0 !important; }
html body #maincolumnspot #wipepics > table > tbody > tr:first-child { display: none; }
html body #maincolumnspot #wipepics > table > tbody > tr > td { font-size: 0 !important; line-height: 0; }
html body #maincolumnspot #wipepics > table > tbody > tr > td > a { display: block; overflow: hidden; }
html body #maincolumnspot #wipepics > table > tbody > tr > td > a > img { display: block; float: none !important; width: 100% !important; max-width: none !important; height: 200px; object-fit: cover; margin: 0 !important; border: 0 !important; transition: transform .4s; }
html body #maincolumnspot #wipepics > table:hover img { transform: scale(1.06); }
html body #maincolumnspot #wipepics > table > tbody > tr > td > b, html body #maincolumnspot #wipepics > table > tbody > tr > td > br { display: none; }
html body #maincolumnspot #wipepics table table { width: 100% !important; padding: 6px 8px; line-height: normal; }
html body #maincolumnspot #wipepics table table td { font-size: 12px !important; line-height: normal; }
html body #maincolumnspot #wipepics table table input[type] { font: 600 12px Arial, sans-serif !important; padding: 4px 10px !important; height: auto !important; min-height: 0 !important; margin: 0 4px 0 0 !important; }

/* photo viewer */
html:has(.dijitDialogUnderlayWrapper[style*="display: block"]), html:has(.dijitDialogUnderlayWrapper[style*="display: block"]) body{overflow:hidden!important}
html body .dijitDialogUnderlay._underlay{opacity:.85!important;background:#061f3d!important}

/* gallery landing */
html body #maincolumnspot td:has(> div > #gallerynavlist){display:none!important}
/* gallery landing */
html body #maincolumnspot:has(#gallerylistspot) span.pageheader{display:none!important}
/* photo viewer above the sticky header */
html body .dijitDialogUnderlayWrapper{z-index:9998!important}
html body .dojoxLightbox.dijitDialog{z-index:9999!important}

/* gallery album, Thumbs mode */
html body #maincolumnspot #wipepics > a { display: block; overflow: hidden; background: #fff; border: 3px solid #0b0b0b; box-shadow: 5px 5px 0 #0a3161; transition: transform .18s, box-shadow .18s; }
html body #maincolumnspot #wipepics > a:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 #ffc72c; }
html body #maincolumnspot #wipepics > a > img { display: block; width: 100% !important; max-width: none !important; height: 200px !important; object-fit: cover; margin: 0 !important; border: 0 !important; transition: transform .4s; }
html body #maincolumnspot #wipepics > a:hover > img { transform: scale(1.06); }

/* album page header */
html body #maincolumnspot form#photogallery select { width: auto !important; max-width: 100%; padding: 4px 44px 4px 0 !important; border: 0 !important; border-bottom: 4px solid #ffc72c !important; border-radius: 0 !important; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='14' viewBox='0 0 22 14'%3E%3Cpath d='M2 2l9 9 9-9' fill='none' stroke='%230a3161' stroke-width='3.5'/%3E%3C/svg%3E") no-repeat right 6px center !important; -webkit-appearance: none; appearance: none; cursor: pointer; color: #0a3161 !important; font: 600 36px/1.15 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .02em; }
html body #maincolumnspot form#photogallery select option { font: 500 16px Arial, sans-serif; text-transform: none; color: #0b0b0b; }
html body #maincolumnspot #photospot > table:first-child > tbody > tr:nth-child(2) { display: none; }
html body #maincolumnspot #photospot > hr { display: none; }
html body #maincolumnspot #photospot > table b { font: 600 14px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .08em; color: #555 !important; }

/* NEWS ARTICLES */
/* home page news card */
html body #maincolumnspot div:has(> #whatsnewbuttons) table.responsive:has(a.whatsnewhometitle) { width: 100%; margin: 18px 0 8px; background: #fff; border: 3px solid #0b0b0b; border-left: 10px solid #ffc72c; box-shadow: 6px 6px 0 #0a3161; border-spacing: 0 !important; }
html body #maincolumnspot div:has(> #whatsnewbuttons) table.responsive:has(a.whatsnewhometitle) > tbody > tr > td { padding: 18px 22px !important; vertical-align: top; }
html body #maincolumnspot div:has(> #whatsnewbuttons) table.responsive td:has(> table.previewimagetablewhat):not(:has(img)) { display: none; }
html body #maincolumnspot div:has(> #whatsnewbuttons) table.responsive td:has(> table.previewimagetablewhat) img { display: block; width: 260px !important; max-width: 100%; height: 180px; object-fit: cover; border: 3px solid #0b0b0b; }
html body #maincolumnspot div.whatsnewhometitle { padding-bottom: 6px !important; }
html body #maincolumnspot a.whatsnewhometitle, html body #maincolumnspot a.whatsnewhometitle strong { color: #0a3161 !important; text-decoration: none !important; font: 600 28px/1.15 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .02em; }
html body #maincolumnspot a.whatsnewhometitle:hover strong { color: #0b0b0b !important; background: linear-gradient(transparent 62%, #ffc72c 62%); }
html body #maincolumnspot .whatsnewmodulecontent { padding: 4px 0 0 !important; font-size: 16px !important; line-height: 1.6 !important; color: #222 !important; }
html body #maincolumnspot .whatsnewmodulecontent a { display: inline-block; margin-top: 10px; padding: 7px 16px; background: #0a3161; color: #fff !important; font: 600 15px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .06em; text-decoration: none !important; box-shadow: 3px 3px 0 #ffc72c; }

/* article body */
html body .nwx { max-width: 860px; font-family: 'Inter', Arial, sans-serif; font-size: 17px; line-height: 1.65; color: #1a1a1a; }
html body .nwx-lead { font-size: 19px; line-height: 1.6; margin: 0 0 22px !important; }
html body .nwx-date { display: inline-block; margin-right: 4px; padding: 3px 10px; background: #ffc72c; color: #0b0b0b !important; border: 2px solid #0b0b0b; font: 600 15px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .06em; vertical-align: 2px; }
html body .nwx-box { margin: 0 0 24px; padding: 18px 22px; background: #fff; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0a3161; }
html body .nwx-box-h { margin: -18px -22px 14px; padding: 10px 22px; background: #0a3161; color: #fff !important; font: 600 20px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .04em; }
html body .nwx-box ul { list-style: none; margin: 0 !important; padding: 0 !important; }
html body .nwx-box li { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 9px 0; border-bottom: 1px solid #e3ddd0; }
html body .nwx-box li b { min-width: 190px; font: 600 15px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .05em; color: #0a3161; }
html body .nwx-box li.nwx-us { margin: 4px -10px 0; padding: 10px; background: #fff4cc; border: 2px solid #0b0b0b; }
html body .nwx-small { margin-top: 10px; font-size: 14px; color: #555; }
html body .nwx-h { margin: 6px 0 6px !important; font: 600 22px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; color: #0a3161 !important; }
html body #maincolumnspot a.nwx-link { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin: 24px 0 8px; padding: 18px 22px; background: #0a3161; color: #fff !important; text-decoration: none !important; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #ffc72c; transition: transform .15s, box-shadow .15s; }
html body #maincolumnspot a.nwx-link:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 #ffc72c; }
html body .nwx-link span { font-size: 17px; }
html body .nwx-link b { font: 600 22px 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .04em; color: #ffc72c !important; }
html body .nwx-credit { font-size: 13px; color: #666 !important; }

/* news */
html body #maincolumnspot div.articleheader, html body #maincolumnspot div.articleheader * { font: 600 40px/1.1 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .02em; color: #0a3161 !important; }
html body #maincolumnspot .nwx-box-h { font: 600 20px 'Oswald', Arial, sans-serif !important; }
html body #maincolumnspot .nwx-h { font: 600 22px 'Oswald', Arial, sans-serif !important; }
html body #maincolumnspot .nwx-date { font: 600 15px 'Oswald', Arial, sans-serif !important; }
html body #maincolumnspot .nwx-box li b { font: 600 15px 'Oswald', Arial, sans-serif !important; }
html body #maincolumnspot .nwx-link b { font: 600 22px 'Oswald', Arial, sans-serif !important; }
html body #maincolumnspot:has(.nwx) table:has(> tbody > tr > td.pagedates) { display: none !important; } /* hide the "last edited" date on styled news articles */

/* CONTACT US page */
html body #maincolumnspot:has(#contactform) span.pageheader { display: block; text-align: center; font: 600 48px/1.05 'Oswald', 'Arial Narrow', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .02em; color: #0a3161 !important; padding: 0 27px; max-width: 1400px; margin: 0 auto; }
html body #maincolumnspot:has(#contactform) span.pageheader::after { content: "Questions about your contract, a problem at work, or anything Local 42? Call, stop by, or send us a message."; display: block; margin-top: 10px; font: 400 18px/1.5 'Inter', Arial, sans-serif; text-transform: none; letter-spacing: 0; color: #333; max-width: 720px; margin-left: auto; margin-right: auto; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:empty, html body #maincolumnspot:has(#contactform) table.resptable td.respcell:not(:has(*)) { display: none; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) { display: grid !important; grid-template-columns: 1fr 1fr; gap: 6px 30px; padding: 22px 26px !important; background: #0a3161; color: #fff !important; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #ffc72c; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > b, html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > br { display: none; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(2) { grid-column: 1; grid-row: 1; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(3) { grid-column: 1; grid-row: 2; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(5) { grid-column: 2; grid-row: 1; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(6) { grid-column: 2; grid-row: 2; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(2), html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(5) { font: 600 16px 'Oswald', Arial, sans-serif !important; letter-spacing: .1em; color: #ffc72c !important; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(3), html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(6) { margin: 0 !important; font: 500 21px/1.4 'Inter', Arial, sans-serif !important; color: #fff !important; }
html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) i.fa { color: #ffc72c !important; margin-right: 6px; }
html body #maincolumnspot:has(#contactform) div:has(> #formspace) { margin-top: 30px !important; padding: 0 !important; background: #fff; border: 3px solid #0b0b0b !important; border-radius: 0 !important; box-shadow: 6px 6px 0 #0a3161; }
html body #maincolumnspot:has(#contactform) div:has(> #formspace) > div:first-child { font-size: 0 !important; padding: 14px 22px; background: #0b0b0b; }
html body #maincolumnspot:has(#contactform) div:has(> #formspace) > div:first-child i.fa { font-size: 22px !important; color: #ffc72c !important; margin-right: 10px; }
html body #maincolumnspot:has(#contactform) div:has(> #formspace) > div:first-child::after { content: "Send the Local a message"; font: 600 24px 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .04em; color: #fff; }
html body #maincolumnspot:has(#contactform) #formspace { padding: 12px 16px 18px; }
html body #maincolumnspot:has(#contactform) #contactform td { font: 600 15px 'Inter', Arial, sans-serif !important; color: #0a3161 !important; }
html body #maincolumnspot:has(#contactform) #contactform input[type=text], html body #maincolumnspot:has(#contactform) #contactform textarea { width: 100% !important; box-sizing: border-box; margin-top: 6px; padding: 12px 14px !important; background: #fff !important; border: 2px solid #0b0b0b !important; border-radius: 0 !important; font: 400 17px 'Inter', Arial, sans-serif !important; color: #111 !important; }
html body #maincolumnspot:has(#contactform) #contactform textarea { min-height: 150px; }
html body #maincolumnspot:has(#contactform) #contactform input[type=text]:focus, html body #maincolumnspot:has(#contactform) #contactform textarea:focus { outline: 3px solid #ffc72c; outline-offset: 0; }
html body #maincolumnspot:has(#contactform) #contactform button#sendemail { padding: 14px 30px !important; font-size: 18px !important; }
html body #maincolumnspot:has(#contactform) #contactform button#sendemail:disabled { opacity: .55; cursor: not-allowed; }
html body #maincolumnspot:has(#contactform) #confirmtext:not(:empty) { margin: 16px 22px 0; padding: 14px 18px; background: #fff4cc; border: 2px solid #0b0b0b; font-weight: 600; }
@media (max-width: 640px) { html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) { grid-template-columns: 1fr; } html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(5) { grid-column: 1; grid-row: 3; margin-top: 12px; } html body #maincolumnspot:has(#contactform) table.resptable td.respcell:has(.fa-map-marker) > div:nth-child(6) { grid-column: 1; grid-row: 4; } html body #maincolumnspot:has(#contactform) span.pageheader { font-size: 36px !important; } }
/* no need for the footer "Contact Us" button on the contact page itself */
html body:has(#contactform) div:has(> a[title="Contact Us"] > i.iconssocialbottom) { display: none !important; }

/* Fix: header flicker near the top of a page */
html, html body { overflow-anchor: none !important; }

/* news articles */
html body #maincolumnspot:has(.nwx) img.imagedisplay { display: block; width: 100% !important; max-width: 860px; height: 440px !important; object-fit: cover; object-position: center 50%; margin: 6px 0 18px; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0a3161; }
@media (max-width: 640px) { html body #maincolumnspot:has(.nwx) img.imagedisplay { height: 260px !important; } }
/* gallery */
html body #maincolumnspot #gallerylistspot tr[onclick*="galleryID=163131"] > td > div { background-image: url('/pics/local42-cap-board-02.jpg') !important; background-position: center 40% !important; }


/* news article photo */
html body #maincolumnspot:has(.nwx) #articleimagetable { width: 100%; max-width: 870px; margin: 6px 0 22px !important; border-collapse: separate; }
html body #maincolumnspot:has(.nwx) #articleimagetable img.imagedisplay { margin: 0 !important; }
html body #maincolumnspot:has(.nwx) #articleimagetable tr + tr td { padding-top: 14px !important; }
html body #maincolumnspot:has(.nwx) #articleimagetable tr + tr td b { display: block; font: italic 500 15px/1.4 'Inter', Arial, sans-serif !important; color: #444 !important; }

/* COMMITTEES: chair + co-chair on each card, chair's email as */
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td:has(.cmx-r) { font-size: 0 !important; line-height: 0; }
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td:has(.cmx-r) > b { display: none !important; }
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td .cmx-r { display: flex; align-items: baseline; gap: 10px; font: 600 15px/1.35 'Inter', Arial, sans-serif !important; color: #0b0b0b !important; margin: 0 0 6px; }
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td .cmx-k { flex: 0 0 74px; font: 700 12px/1.35 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .06em; color: #0a3161 !important; }
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td:has(.cmx-r) a { display: inline-block; margin-top: 6px; font: 700 14px/1.35 'Inter', Arial, sans-serif !important; color: #0a3161 !important; word-break: break-all; }


/* COMMITTEES fix: keep each chair email on one line */
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td:has(.cmx-r) a { display: block !important; white-space: nowrap; word-break: normal !important; overflow-wrap: normal !important; font-size: 13.5px !important; letter-spacing: -.005em; }
html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td:has(.cmx-r) a::before { content: "Email the chair" !important; display: block; margin-bottom: 2px; font: 700 11px/1.3 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .06em; color: #0a3161 !important; }
html body #maincolumnspot:has(> table > tbody > tr.darkfont + tr + tr.darkfont) { grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr)) !important; }
@media (max-width: 380px) { html body #maincolumnspot > table:has(> tbody > tr.darkfont + tr + tr.darkfont) > tbody > tr:last-child > td a { font-size: 12.5px !important; } }

/* NEWS FEEDS social: Local 42 row + UAW row */
html body #maincolumnspot .nlx p.nlx-sub { margin: 18px 0 10px !important; }
html body #maincolumnspot .nlx p.nlx-sub b { display: inline-block; background: #0b0b0b; color: #ffc72c !important; padding: 4px 10px; font: 700 13px/1.2 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .08em; }

/* HOME: member vote bar under Latest News */








/* HOME vote bar fix: sits above Latest News, lined up with the banner */




/* ONLINE VOTING page: themed header, info box, vote card */
html body #maincolumnspot:has(a[name=results]) .pageheader, html body #maincolumnspot:has(a[name=results]) .pageheader * { font: 700 46px/1.05 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; color: #0a3161 !important; letter-spacing: .01em; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type { font-size: 16px; line-height: 1.55; max-width: 900px; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b { display: block; margin-top: 4px; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b br { display: none; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b font { font: 700 15px/1.3 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .06em; color: #0b0b0b !important; display: inline-block; background: #ffc72c; padding: 4px 10px; margin-top: 14px; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b font + font { margin-left: -4px; padding-left: 0; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:nth-of-type(2) { max-width: 900px; background: #fff; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #0a3161; padding: 14px 18px; margin: 8px 0 26px; font-size: 15px; line-height: 1.7; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:nth-of-type(2) > b { display: block; margin-top: 10px; padding-top: 10px; border-top: 2px dashed #0b0b0b; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:nth-of-type(2) > b br { display: none; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:nth-of-type(2) > b font { font: 600 14px/1.4 'Inter', Arial, sans-serif !important; color: #0a3161 !important; }
/* the vote card */
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] { max-width: 900px; margin: 0 0 30px; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] > table { background: #fff !important; border: 3px solid #0b0b0b !important; box-shadow: 6px 6px 0 #0a3161; border-collapse: separate; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] > table > tbody > tr > td { padding: 0 !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] table, html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] td { background: transparent !important; border: 0 !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] > table > tbody > tr > td > table > tbody > tr > td { padding: 0 !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:first-child > td { background: #0a3161 !important; padding: 16px 20px !important; color: #fff !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:first-child > td * { color: #fff !important; font-size: 13px !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:first-child > td span, html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:first-child > td span b { display: block; color: #ffc72c !important; font: 700 26px/1.15 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .02em; margin-bottom: 4px; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:first-child > td strong { color: #ffc72c !important; font: 700 12px/1.3 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .08em; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:nth-child(2) > td { padding: 16px 20px 4px !important; font-size: 16px; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:nth-child(2) > td p { margin: 0; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr[valign=top]:not(.darkfont) > td { padding: 8px 20px 10px !important; }
/* each choice */
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] td:has(input[name=Result]):not(:has(td)) { display: block; background: #f3eee2 !important; border: 2px solid #0b0b0b !important; padding: 12px 14px !important; margin: 8px 0; transition: background .12s, box-shadow .12s; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] td:has(input[name=Result]):not(:has(td)):hover { background: #fff7d6 !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] td:has(input[name=Result]:checked):not(:has(td)) { background: #ffc72c !important; box-shadow: 4px 4px 0 #0b0b0b; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] td:has(input[name=Result]):not(:has(td)) br { display: none; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] td:has(input[name=Result]):not(:has(td)) b, html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] td:has(input[name=Result]):not(:has(td)) font { font: 600 16px/1.35 'Inter', Arial, sans-serif !important; color: #0b0b0b !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] input[name=Result] { accent-color: #0a3161; width: 20px; height: 20px; vertical-align: -4px; margin: 0 10px 0 0; cursor: pointer; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] input[name=Other] { display: block; width: 100%; max-width: 520px; box-sizing: border-box; margin-top: 10px; padding: 10px 12px; font: 16px 'Inter', Arial, sans-serif; border: 2px solid #0b0b0b; border-radius: 0; background: #fff; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] input[name=Other]:disabled { background: #e9e4d8; }
/* submit row */
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:last-child > td { background: #f3eee2 !important; border-top: 2px dashed #0b0b0b !important; padding: 16px 20px !important; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:last-child > td br { display: none; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:last-child > td font { display: inline-block; margin-left: 18px; font-size: 13px !important; color: #444 !important; vertical-align: middle; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:last-child > td font b { font: 700 12px 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .08em; color: #0a3161 !important; margin-right: 6px; }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] input[type=submit] { font: 700 18px 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .05em; background: #ffc72c !important; color: #0b0b0b !important; border: 3px solid #0b0b0b !important; box-shadow: 4px 4px 0 #0b0b0b; padding: 12px 26px !important; cursor: pointer; vertical-align: middle; }
/* results note */
html body #maincolumnspot:has(a[name=results]) a[name=results] { display: block; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > b:last-of-type font[color], html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > b:last-of-type font[color] * { font: 700 20px 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; color: #0a3161 !important; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > font[color], html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > font[color] font { color: #444 !important; font-size: 14px; }
@media (max-width: 600px) { html body #maincolumnspot:has(a[name=results]) .pageheader, html body #maincolumnspot:has(a[name=results]) .pageheader * { font-size: 32px !important; } html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] tr.darkfont:last-child > td font { display: block; margin: 12px 0 0; } }
html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] > table, html body #maincolumnspot:has(a[name=results]) form[name=CFForm_2] > table > tbody > tr > td > table { background: #fff !important; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b font + font { margin-left: -5px !important; padding-left: 0 !important; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b { display: table !important; background: #ffc72c; padding: 4px 10px; margin-top: 14px; }
html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b font, html body #maincolumnspot:has(a[name=results]) > table > tbody > tr > td > p:first-of-type > b font + font { background: none !important; padding: 0 !important; margin: 0 !important; display: inline !important; }

/* NEWS ARTICLES roster fix: fixed label column so names line up */
html body #maincolumnspot .nwx-box li > b { flex: 0 0 230px !important; min-width: 0 !important; }
@media (max-width: 600px) { html body #maincolumnspot .nwx-box li > b { flex: 0 0 100% !important; } }

/* CONTACT US: reps' office line , from Edit Contact Us Page Text */
html body #maincolumnspot p.ctx-reps { background: #fff; border: 3px solid #0b0b0b; border-left: 10px solid #ffc72c; box-shadow: 6px 6px 0 #0a3161; padding: 14px 18px; margin: 4px 8px 24px 0; font: 500 16px/1.45 'Inter', Arial, sans-serif !important; color: #0b0b0b !important; }
html body #maincolumnspot p.ctx-reps b { font: 700 15px 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .05em; color: #0a3161 !important; margin-right: 6px; }
html body #maincolumnspot p.ctx-reps a { color: #0a3161 !important; font-weight: 700; }

/* UNION GEAR page: member page linking to the Signature Imagewear store */
html body #maincolumnspot .gx { max-width: 1000px; }
html body #maincolumnspot .gx-hero { background: #0a3161; color: #fff; border: 3px solid #0b0b0b; box-shadow: 6px 6px 0 #ffc72c; padding: 28px 28px 30px; margin: 6px 10px 30px 0; }
html body #maincolumnspot .gx-eyebrow { display: inline-block; background: #ffc72c; color: #0b0b0b !important; padding: 4px 10px; font: 700 13px/1.2 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .08em; }
html body #maincolumnspot .gx-big { margin: 12px 0 8px; color: #fff !important; font: 700 44px/1.05 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; }
html body #maincolumnspot .gx-hero p { color: #fff !important; font: 500 17px/1.5 'Inter', Arial, sans-serif !important; max-width: 640px; margin: 0 0 22px; }
html body #maincolumnspot a.gx-btn { display: inline-block; background: #ffc72c; color: #0b0b0b !important; text-decoration: none !important; border: 3px solid #0b0b0b; box-shadow: 5px 5px 0 #0b0b0b; padding: 14px 28px; font: 700 20px/1 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .05em; transition: transform .15s, box-shadow .15s; }
html body #maincolumnspot a.gx-btn:hover { transform: translate(-2px,-2px); box-shadow: 7px 7px 0 #0b0b0b; }
html body #maincolumnspot .gx-h { font: 700 22px 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; color: #0a3161 !important; letter-spacing: .04em; margin: 0 0 12px; }
html body #maincolumnspot ul.gx-cats { list-style: none; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
html body #maincolumnspot ul.gx-cats li { background: #fff; border: 2px solid #0b0b0b; border-left: 8px solid #ffc72c; padding: 12px 14px; font: 600 16px 'Inter', Arial, sans-serif !important; color: #0b0b0b; margin: 0; }
html body #maincolumnspot .gx-note { font-size: 14px; color: #444; max-width: 760px; }
@media (max-width: 600px) { html body #maincolumnspot .gx-big { font-size: 32px !important; } html body #maincolumnspot .gx-hero { padding: 20px; } }

/* MEMBER HOME: move the built-in account bar */
html body #maincolumnspot:has(#membermessage) > table > tbody > tr > td { display: flex !important; flex-direction: column; }
html body #maincolumnspot:has(#membermessage) > table > tbody > tr > td > div.w3-card { order: 90; margin-top: 26px; }

/* MEMBER HOME: hide "Email Login" */
html body form[action*="unions-america.com"], html body td.welcomebuttons:has(> form[action*="unions-america.com"]) { display: none !important; }

/* MEMBER HOME: hide the "Member Home" page title */
html body #maincolumnspot:has(#membermessage) > table > tbody > tr > td > table:first-child .pageheader { display: none !important; }

/* CONTRACTS: "Other agreements" heading removed, keep space between */
html body #maincolumnspot .ccw .ccw-feat + .ccw-feat { margin-top: 22px !important; }

/* CONTRACTS: page header */
html body #maincolumnspot .ccw-head { margin: 4px 0 26px; padding-bottom: 18px; border-bottom: 3px solid #0b0b0b; }
html body #maincolumnspot .ccw-head .ccw-tag { display: inline-block; background: #ffc72c; color: #0b0b0b !important; border: 2px solid #0b0b0b; padding: 4px 10px; font: 700 13px/1.2 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .08em; }
html body #maincolumnspot .ccw-head h2.ccw-title { margin: 10px 0 6px !important; font: 700 46px/1.05 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; color: #0a3161 !important; background: none !important; padding: 0 !important; transform: none !important; }
html body #maincolumnspot .ccw-head p.ccw-intro { margin: 0 !important; font: 500 17px/1.5 'Inter', Arial, sans-serif !important; color: #0b0b0b !important; max-width: 720px; }
html body #maincolumnspot .ccw-head p.ccw-intro a { color: #0a3161 !important; font-weight: 700; text-decoration: underline; }
@media (max-width: 600px) { html body #maincolumnspot .ccw-head h2.ccw-title { font-size: 32px !important; } }

/* CONTRACTS fix */
html body #maincolumnspot .ccw-head .ccw-tag { display: table !important; margin: 0 0 10px !important; }
html body #maincolumnspot .ccw-head h2.ccw-title { display: block !important; width: auto !important; margin: 0 0 8px !important; }

/* MEMBER HOME: keep phone numbers on one line; 9 cards always 3 across on wide screens */
html body .mhx-hero a[href^="tel:"] { white-space: nowrap; }
@media (min-width: 900px) { html body .mhx-grid { grid-template-columns: repeat(3, 1fr) !important; } }

/* UNION GEAR: use the full page width; categories 4 across (2 even rows) on wide screens */
html body #maincolumnspot .gx { max-width: none !important; }
html body #maincolumnspot .gx-hero { margin-right: 10px !important; }
html body #maincolumnspot ul.gx-cats { grid-template-columns: repeat(4, 1fr) !important; margin-right: 10px; }
@media (max-width: 760px) { html body #maincolumnspot ul.gx-cats { grid-template-columns: repeat(2, 1fr) !important; } }
html body #maincolumnspot .gx-note { max-width: none !important; }

/* FOOTER SOCIAL ICONS: square stamped buttons beside the big Contact Us button */
html body .iconspot table td { vertical-align: bottom !important; }
html body .iconspot a:not([title="Contact Us"]):has(> i.iconssocialbottom) { display: inline-flex !important; align-items: center; justify-content: center; width: 64px; height: 64px; box-sizing: border-box; padding: 0 !important; margin-left: 8px; background: #0a3161; border: 3px solid #ffc72c; box-shadow: 5px 5px 0 #0b0b0b; text-decoration: none !important; transition: transform .15s, box-shadow .15s; }
html body .iconspot a:not([title="Contact Us"]):has(> i.iconssocialbottom):hover { transform: translate(-2px,-2px); box-shadow: 7px 7px 0 #0b0b0b; }
html body .iconspot a:not([title="Contact Us"]) > i.iconssocialbottom { font-size: 38px !important; color: #ffc72c !important; margin: 0 !important; line-height: 1 !important; }
html body .iconspot a:not([title="Contact Us"]) > i.iconssocialbottom::after { content: none !important; }
html body .bottomtable .iconspot a:not([title="Contact Us"]) > i.iconssocialbottom, html body .iconspot a:not([title="Contact Us"]) > i.iconssocialbottom::before { font-size: 38px !important; }
html body .iconspot a:not([title="Contact Us"]) > i.iconssocialbottom { width: auto !important; height: auto !important; padding: 0 !important; }

/* FOOTER SOCIAL ICONS: stack the social buttons centered under Contact Us */
html body .iconspot table, html body .iconspot table tbody { display: block !important; width: 100% !important; max-width: none !important; }
html body .iconspot table tr { display: flex !important; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px; }
html body .iconspot table tr > td:first-child { flex: 0 0 100%; display: flex !important; justify-content: center; }
html body .iconspot table tr > td + td { padding: 0 !important; }
html body .iconspot a:not([title="Contact Us"]):has(> i.iconssocialbottom) { margin: 4px 0 0 !important; }

/* PHOTO GALLERY: UnionActive's new album page (ua-photo-*) - fit phones, readable photo titles */
html body main.ua-photo-page { max-width: 100%; box-sizing: border-box; overflow-x: hidden; }
html body .ua-photo-head, html body .ua-photo-head > div { min-width: 0; max-width: 100%; }
html body h1.ua-photo-title { font-size: clamp(32px, 7vw, 64px) !important; line-height: 1 !important; overflow-wrap: anywhere; }
html body .ua-photo-toolbar { flex-wrap: wrap; gap: 10px; box-sizing: border-box; max-width: 100%; }
html body .ua-photo-picker { min-width: 0 !important; flex: 1 1 240px; max-width: 100%; box-sizing: border-box; }
html body #uaGalleryPicker { min-width: 0 !important; width: 100% !important; max-width: 100%; box-sizing: border-box; }
html body #uaOpenSlideshow { flex: 0 0 auto; }
html body .ua-photo-results-head { flex-wrap: wrap; gap: 8px; }
html body .ua-photo-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; }
html body .ua-photo-detail-list > * { min-width: 0; }
html body .ua-photo-card h2, html body .ua-photo-card h3, html body .ua-photo-detail-copy h2, html body .ua-photo-detail-copy h3 { background: none !important; box-shadow: none !important; transform: none !important; padding: 0 !important; margin: 0 0 6px !important; display: block !important; font: 700 22px/1.15 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .02em; color: #0a3161 !important; overflow-wrap: anywhere; }
html body .ua-photo-card h2 a, html body .ua-photo-card h3 a, html body .ua-photo-detail-copy h2 a, html body .ua-photo-detail-copy h3 a { color: #0a3161 !important; font: inherit !important; text-decoration: none !important; }
@media (max-width: 600px) { html body .ua-photo-detail-copy h2, html body .ua-photo-card h2, html body .ua-photo-card h3 { font-size: 18px !important; } }

/* PHONES: page-title rows with buttons (Print/PDF, Manage Calendars, iCal) wrap instead of pushing the page sideways */
@media (max-width: 600px) {
  html body #maincolumnspot table:has(span.pageheader):not(:has(table)) { display: block !important; width: 100% !important; }
  html body #maincolumnspot table:has(span.pageheader):not(:has(table)) > tbody { display: block !important; }
  html body #maincolumnspot table:has(span.pageheader):not(:has(table)) > tbody > tr { display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px; }
  html body #maincolumnspot table:has(span.pageheader):not(:has(table)) > tbody > tr > td { display: block !important; width: auto !important; padding: 2px 0 !important; }
  html body #maincolumnspot table:has(span.pageheader):not(:has(table)) > tbody > tr > td:first-child { flex: 0 0 100%; }
  html body #maincolumnspot input.buttoncolor { max-width: 100%; white-space: normal; }
  html body #maincolumnspot:has(form[action*="calendar"]) div:has(> form) { display: flex !important; flex-wrap: wrap; gap: 8px; align-items: center; max-width: 100%; }
  html body #maincolumnspot:has(form[action*="calendar"]) form { max-width: 100%; }
  html body #maincolumnspot:has(form[action*="calendar"]) select { max-width: 100%; }
}
/* PHOTO GALLERY: new album page - title spacing, 4-across grid on desktop */
html body h1.ua-photo-title { letter-spacing: 0 !important; word-spacing: .12em; }
html body .ua-photo-grid { grid-template-columns: repeat(auto-fill, minmax(min(260px, 45%), 1fr)) !important; }
html body .ua-photo-card h2, html body .ua-photo-card h3 { font-size: 17px !important; }


/* PHOTO GALLERY landing: UnionActive's new layout (ua-gallery-*) - theme cards, one even row, chosen album covers */
html body .ua-gallery-hero .pageheader, html body .ua-gallery-hero .ua-gallery-subtitle { display: none !important; }
html body .ua-gallery-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important; gap: 22px !important; padding: 4px 8px 10px 0; }
html body .ua-gallery-card { border-radius: 0 !important; border: 3px solid #0b0b0b !important; box-shadow: 6px 6px 0 #0a3161 !important; background: #fff !important; overflow: hidden; transition: transform .15s, box-shadow .15s; }
html body .ua-gallery-card:hover { transform: translate(-3px,-3px); box-shadow: 9px 9px 0 #ffc72c !important; }
html body .ua-gallery-card a.ua-gallery-cover { display: block; border-radius: 0 !important; border-bottom: 3px solid #0b0b0b; aspect-ratio: 4 / 3; overflow: hidden; }
html body .ua-gallery-card a.ua-gallery-cover img { width: 100% !important; height: 100% !important; object-fit: cover; border-radius: 0 !important; }
html body .ua-gallery-card-body { padding: 12px 14px 14px !important; }
html body .ua-gallery-card-body a, html body .ua-gallery-card-body h2, html body .ua-gallery-card-body h3 { font: 700 18px/1.2 'Oswald', 'Arial Narrow', sans-serif !important; text-transform: uppercase; letter-spacing: .02em; color: #0a3161 !important; text-decoration: none !important; background: none !important; box-shadow: none !important; transform: none !important; padding: 0 !important; }
html body a.ua-gallery-cover[href*="galleryID=163131"] { background: #0a3161 url('/pics/local42-cap-board-02.jpg') center 40% / cover no-repeat !important; }
html body a.ua-gallery-cover[href*="galleryID=163131"] img { opacity: 0 !important; }
html body a.ua-gallery-cover[href*="galleryID=163124"] { background: #0a3161 url('/pics/local42-uaw-17.jpg') center 50% / cover no-repeat !important; }
html body a.ua-gallery-cover[href*="galleryID=163124"] img { opacity: 0 !important; }
html body a.ua-gallery-cover[href*="galleryID=163125"] { background: #0a3161 url('/pics/local42-uaw-22.jpg') center 50% / cover no-repeat !important; }
html body a.ua-gallery-cover[href*="galleryID=163125"] img { opacity: 0 !important; }
html body a.ua-gallery-cover[href*="galleryID=163123"] { background: #0a3161 url('/pics/local42-uaw-16.jpg') center 50% / cover no-repeat !important; }
html body a.ua-gallery-cover[href*="galleryID=163123"] img { opacity: 0 !important; }
html body .ua-gallery-grid > .ua-gallery-card { width: auto !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; box-sizing: border-box; }

/* OFFICERS + REPS grids: center a short last row on wide screens */
@media (min-width: 900px) {
  html body .ofx-grid { display: flex !important; flex-wrap: wrap; justify-content: center; }
  html body .ofx-grid > * { flex: 0 1 282px; min-width: 0; box-sizing: border-box; }
  html body .ofx-grid.ofx-small > * { flex: 0 1 228px; }
}

/* PHOTO GALLERY landing: toolbar under the banner, themed */
html body main.ua-gallery-page { display: flex !important; flex-direction: column; }
html body main.ua-gallery-page > .ua-gallery-hero { order: 0; }
html body main.ua-gallery-page::before {
  content: "Our Union in Pictures"; order: 1;
  display: flex; flex-direction: column; justify-content: flex-end; min-height: 300px; margin: 0 0 22px; padding: 28px 30px; box-sizing: border-box;
  background: linear-gradient(180deg, rgba(6,31,61,.05) 20%, rgba(6,31,61,.92) 100%), url('/pics/local42-uaw-01.jpg') center 35% / cover no-repeat;
  border: 3px solid #0b0b0b; box-shadow: 8px 8px 0 #ffc72c;
  color: #fff; font: 600 44px/1 'Oswald', 'Arial Narrow', Arial, sans-serif; text-transform: uppercase; letter-spacing: .02em; }
html body #maincolumnspot main.ua-gallery-page #gallerylistspot::before { display: none !important; }
html body main.ua-gallery-page > .ua-gallery-toolbar { order: 2; }
html body main.ua-gallery-page > #gallerylistspot { order: 3; }
html body .ua-gallery-toolbar { display: flex !important; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
  background: #fff !important; border: 3px solid #0b0b0b !important; border-radius: 0 !important; box-shadow: 5px 5px 0 #0a3161 !important;
  padding: 10px 14px !important; margin: 0 8px 26px 0 !important; }
html body .ua-gallery-sort { display: flex !important; align-items: center; gap: 10px; margin: 0 !important; }
html body .ua-gallery-sort span { font: 600 15px/1 'Oswald','Arial Narrow',sans-serif !important; text-transform: uppercase; letter-spacing: .05em; color: #0a3161 !important; }
html body .ua-gallery-sort select { border: 2px solid #0b0b0b !important; border-radius: 0 !important; background-color: #fff !important; box-shadow: none !important;
  font: 600 15px/1.2 'Inter',Arial,sans-serif !important; color: #0b0b0b !important; padding: 7px 34px 7px 10px !important; min-height: 0 !important; height: auto !important; }
html body .ua-gallery-actions { display: flex !important; flex-wrap: wrap; gap: 10px; }
html body .ua-gallery-button { border: 2px solid #0b0b0b !important; border-radius: 0 !important; background: #fff !important; color: #0a3161 !important;
  font: 600 15px/1 'Oswald','Arial Narrow',sans-serif !important; text-transform: uppercase; letter-spacing: .05em; padding: 10px 16px !important;
  box-shadow: 3px 3px 0 #0b0b0b !important; cursor: pointer; transition: transform .12s, box-shadow .12s; }
html body .ua-gallery-button--primary { background: #ffc72c !important; color: #0b0b0b !important; }
html body .ua-gallery-button:hover { transform: translate(-2px,-2px); box-shadow: 5px 5px 0 #0b0b0b !important; }
@media (max-width: 600px) {
  html body main.ua-gallery-page::before { min-height: 200px; font-size: 30px; padding: 20px; }
  html body .ua-gallery-toolbar { justify-content: center; }
}

/* HOME highlights: Contact Us tile icon - gold envelope on the blue tile */
html body .highlighbox.w3-card a[href*="contact.cfm"] i.fa.smalliconshighlights.mainelementcolor { color: #ffc72c !important; }
html body .highlighbox.w3-card a[href*="contact.cfm"] i.fa.smalliconshighlights::before { content: "\f0e0" !important; }

/* NEWS ARTICLES: buttons inside posts (e.g. App Store / Google Play) */
html body .nwx p.nwx-btns { display: flex; flex-wrap: wrap; gap: 12px; margin: 16px 0 20px; }
html body .nwx a.nwx-btn { display: inline-block; background: #ffc72c; color: #0b0b0b !important; border: 3px solid #0b0b0b; box-shadow: 4px 4px 0 #0a3161; padding: 11px 18px; font: 600 17px/1.1 'Oswald','Arial Narrow',sans-serif; text-transform: uppercase; letter-spacing: .05em; text-decoration: none !important; transition: transform .12s, box-shadow .12s; }
html body .nwx a.nwx-btn:hover { transform: translate(-2px,-2px); box-shadow: 6px 6px 0 #0a3161; }
html body .nwx a.nwx-btn.nwx-btn-navy { background: #0a3161; color: #fff !important; box-shadow: 4px 4px 0 #ffc72c; }
