/* Image Advertising: the original red, blue, charcoal and editorial imagery. */
:root {
  --red: #c80d0d;
  --blue: #075c9c;
  --blue-deep: #064777;
  --ink: #24272b;
  --muted: #7e8ea0;
  --paper: #fff;
  --canvas: #cccccc;
  --line: #dce0e4;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--canvas); color: var(--ink); font: 1rem/1.7 "Trebuchet MS", Arial, sans-serif; }
::selection { background: var(--red); color: white; }
html { background: var(--canvas); scrollbar-color: var(--blue) var(--canvas); }
a { color: var(--blue); text-underline-offset: .2em; }
a:hover { color: var(--red); }
:focus-visible { outline: 3px solid #e68118; outline-offset: 4px; }
input, textarea, select { caret-color: var(--red); }
.skip-link { position: absolute; left: 16px; top: -100px; z-index: 1001; padding: 12px 20px; background: white; }
.skip-link:focus { top: 12px; }
table#maintable { display: block; width: min(1440px, 100%); margin: 0 auto; border: 0; background: white; }
#maintable > tbody { display: contents; }
#maintable > tbody > tr { display: grid; grid-template-columns: minmax(0, 1fr); }
#maintable > tbody > tr > td { min-width: 0; }
#maintable td.shadowtd, #maintable #midtd { display: none; }
#maintable td#toptd { padding: 0; background: #303236; border-bottom: 6px solid var(--blue); }
.site-header { display: flex; flex-direction: column; gap: 24px; padding: 24px; }
.brand { display: flex; align-items: center; gap: 16px; color: white; text-decoration: none; font-size: clamp(1.35rem, 3vw, 2.25rem); line-height: 1.15; letter-spacing: -.025em; font-weight: bold; }
.brand:hover { color: white; }
.brand-mark { flex: 0 0 80px; width: 80px; height: 80px; display: grid; place-items: center; background: var(--red); border-radius: 50%; }
.brand-mark img { width: 56px; height: 56px; object-fit: contain; background: white; }
.utility-nav { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; font-size: .875rem; }
.utility-nav a { color: white; min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
.utility-nav a:hover { text-decoration: underline; }
.utility-nav .contact-link { padding: 0 18px; background: var(--red); border-radius: 6px; }
#maintable td#lefttd { width: auto; padding: 16px; background: var(--blue); }
#navig { width: auto; float: none; padding: 0; background: none; }
/* Without JavaScript the complete cached link index remains available. */
#navig [class^="menucontainer_"] { position: static; display: block; width: auto; max-width: none; margin: 0; border: 0; background: none; }
#navig .submenu { background: none; }
#navig a, #navig summary { display: block; padding: 12px; margin: 0; border: 0; font: inherit; font-size: .9375rem; line-height: 1.45; letter-spacing: 0; color: white; text-decoration: none; overflow-wrap: anywhere; cursor: pointer; }
#navig a:hover, #navig summary:hover { background: var(--blue-deep); color: white; text-decoration: none; }
#navig details { border-bottom: 1px solid #ffffff30; }
#navig > .navigation-disclosure { border: 0; }
#navig .nav-unlinked { display: block; padding: 12px; color: #deebf5; font-size: .875rem; line-height: 1.45; }
#navig summary { display: list-item; list-style-position: inside; }
#navig summary > a { display: inline; padding: 0; }
#navig details > .nav-children { margin: 0 0 10px 12px; border-left: 1px solid #ffffff50; }
#navig .nav-children a, #navig .nav-children summary { font-size: .875rem; }
#navig a[aria-current="page"] { background: white; color: var(--blue-deep); font-weight: bold; border-radius: 4px; }
#maintable td#contenttd { width: auto; padding: 24px; background: white; overflow-wrap: anywhere; }
#contenttd h1 { clear: both; font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.12; font-style: normal; font-weight: bold; letter-spacing: -.03em; text-wrap: balance; margin: 24px 0 32px; }
#contenttd h2 { font-size: 1.5rem; line-height: 1.3; font-style: normal; margin: 36px 0 16px; }
#contenttd h3 { font-size: 1.2rem; margin: 28px 0 12px; }
#contenttd h4 { padding: 12px 16px; }
#contenttd p { text-align: start; margin: 0 0 20px; max-width: 72ch; }
#contenttd img { max-width: 100%; height: auto; }
#contenttd table { max-width: 100%; }
#contenttd iframe, #contenttd object { max-width: 100%; }
#contenttd ul, #contenttd ol { padding-left: 24px; }
#contenttd #languagebar { float: none; display: flex; align-items: center; justify-content: flex-end; gap: 10px; width: auto; margin: 0 0 24px; padding: 0; background: none; border: 0; color: var(--muted); font-size: .8125rem; }
#languagebar a { min-width: 44px; min-height: 44px; display: inline-flex; justify-content: center; align-items: center; border: 1px solid var(--line); border-radius: 4px; }
#maintable td#phototd { width: auto; padding: 20px; background: #151719; color: white; }
#phototd img { width: 100%; height: auto; display: block; }
.catalogphoto { margin: 0 0 20px; }
#quote { width: auto; padding: 12px 4px 20px; font-size: .9375rem; line-height: 1.6; font-weight: normal; }
#quote p { text-align: start; }
#maintable > tbody > tr:last-child { display: block; padding: 24px; background: #303236; color: white; }
#maintable td#footerleft { display: block; background: none; color: white; font-size: .8125rem; }
#footerleft > img, #footerright { display: none; }
#footeraddress { position: static; display: block; width: auto; height: auto; font-size: inherit; }
#footeraddress a { color: white; }
.contact { width: 100%; max-width: 40rem; padding: 20px; border: 1px solid var(--line); background: #f5f6f7; }
input:not([type="checkbox"]):not([type="radio"]), textarea, select { max-width: 100%; font: inherit; min-height: 44px; padding: 9px 12px; border: 1px solid #9ca5ae; border-radius: 4px; background: white; color: var(--ink); }
textarea { width: 100%; min-height: 150px; resize: vertical; }
button, input[type="submit"], input[type="button"], input[type="reset"] { font: inherit; min-height: 44px; padding: 10px 20px; border: 0; border-radius: 4px; background: var(--red); color: white; cursor: pointer; }
button:hover, input[type="submit"]:hover { background: #a60a0a; }
button:disabled, input:disabled { opacity: .55; cursor: not-allowed; }
.msgok, .msgerr { padding: 16px; border-radius: 4px; }
.msgok { color: #244719; background: #e9f3e4; }
.msgerr { color: #841a1a; background: #fbeaea; }
#pic { max-width: calc(100vw - 24px); }
@media (min-width: 700px) {
  .site-header { flex-direction: row; align-items: center; justify-content: space-between; padding: 28px 32px; }
  #maintable > tbody > tr { grid-template-columns: 220px minmax(0, 1fr); }
  #maintable td#toptd { grid-column: 1 / -1; }
  #navig > .navigation-disclosure > summary { display: none; }
  #maintable td#lefttd { padding: 24px 14px; grid-column: 1; grid-row: 1 / span 2; }
  #maintable td#contenttd { padding: 32px; grid-column: 2; }
  #maintable td#phototd { grid-column: 2; }
}
@media (min-width: 1100px) {
  body { padding: 32px; }
  #maintable > tbody > tr { grid-template-columns: 220px minmax(0, 1fr) 290px; }
  #maintable td#lefttd { grid-row: 1; }
  #maintable td#contenttd { padding: 36px 48px 56px; }
  #maintable td#phototd { grid-column: 3; padding: 20px; }
  .brand-mark { width: 104px; height: 104px; flex-basis: 104px; }
  .brand-mark img { width: 64px; height: 64px; }
}
@media (prefers-reduced-motion: no-preference) {
  .brand-mark { animation: brand-arrive .65s cubic-bezier(.16, 1, .3, 1) both; }
  @keyframes brand-arrive { from { transform: translateY(-6px); } to { transform: translateY(0); } }
}
