*{box-sizing:border-box;}
HTML{scroll-behavior:smooth;overflow-y:scroll!important;}
BODY{margin:0;padding:0;background-color:#faf7f2;color:#171410;font-size:17px;}
BODY,INPUT,TEXTAREA,BUTTON{font-family:'Roboto','Roboto',Helvetica,Arial,Sans-Serif}
A, A:visited{color:#886624;text-decoration:none;cursor:pointer;}
.breadcrumbs,A.breadcrumbs{color:#888;text-decoration:none;font-weight:normal;font-size:small}
A.breadcrumbs:hover{text-decoration:underline;}
A.plain{color:#171410}
OL LI{padding:1em 0 0 1em;}
.dmcsForm{display:inline-block;}
:focus{outline:none;}
#fadeshow img{text-align:center;margin:0 auto;}
#fadeshow,#fadeshow{background-color:#faf7f2!important;}
.dmcsShowCell{display:block;}
.dmcsShowDiv{display:inline-block;}
.dmcsShowLi{display:list-item;}
.dmcsShowRow{display:table-row;}
.dmcsShowSelect{display:inline;}
.dmcsShowTable{display:table;}
.dmcsFooter{color:#171410;display:inline-block;padding:5px;vertical-align:top;}
.dmcsFooter A{color:#171410}
.dmcsFooter A:visited{color:#171410}
.middle{vertical-align:middle;text-align:center;margin:0 auto;}
.pagination{padding:5px;}
.pagination a,.pagination a:visited{padding:10px;padding-left:15px;padding-right:15px;text-decoration:none;color:#000;background-color:#eee;}
.pagination a.currentpage{background-color:#000;color:#fff;font-weight:bold;cursor:default;}
.pagination a:hover,.pagination a:active{background-color:#666;color:#fff;font-weight:bold;transition:.5s ease;}
.pagination li{list-style-type:none;display:inline;padding-bottom:1px;}
.pagination ul{margin:0;padding:0;}
.dmcsToolbar{display:inline-block;text-align:center;color:#171410;white-space:nowrap;padding:8px;border-radius:3px;margin-left:6px;margin-right:6px;}
.dmcsToolbar:visited{color:#171410!important}
.dmcsToolbar:hover{background:#000;color:#fff!important;transition:.7s ease;}
.dmcsToolbar A{display:inline-block;text-align:center;color:#171410;white-space:nowrap;padding:8px;border-radius:3px;}
.dmcsToolbar A:hover{background:#000;color:#fff!important;transition:.7s ease;}
.dmcsToolbar A:visited{color:#171410}
.dmcsMenuProducts{background-color:#faf7f2;color:#171410;}
.dmcsMenuProducts A,.dmcsMenuProducts A:visited{color:#171410;}
.dmcsMenuProducts A:hover{background:none;color:#886624!important;transition:.7s ease;}
/* No min-width/min-height here: those beat an element's own width/height regardless of specificity,
   so they silently forced the icons that set a smaller explicit size (18x20 in the toolbar basket
   link, 20x20 on two media_detail buttons) up to 24x24. The box is instead reserved from first
   paint by the font-size/line-height/display rule inlined in index.php's critical CSS, which uses
   different properties and so leaves explicit sizes alone. */
.material-symbols-outlined{width:fit-content;height:fit-content;overflow:hidden;vertical-align:middle;text-decoration:none;text-align:left;}
BUTTON{color:inherit;width:auto;border-radius:3px;font-weight:bold;cursor:pointer;padding:5px;padding-left:25px;padding-right:25px;margin:4px;border:0;}
/* Button set, refreshed. Notes on what changed and why, since these rules are the
   non-msh templates' entire button look (msh.css re-states nearly all of this under
   body.msh, so the redesign is unaffected either way):
     - display:inline-flex instead of inline, so a button that contains an icon plus a
       caption centres the two on the same optical line. It is still inline-level, so
       surrounding text flow is unchanged.
     - min-height:44px - the usual minimum touch target. The old rule had no height at
       all and relied on the caption's own line box.
     - filter:contrast(115%) is gone. It was applied permanently, so every brand's
       button rendered more saturated than the #171410 actually configured
       for it, and the 150% hover pushed that into a visible hue shift rather than
       reading as a darker shade. Hover is now a straight brightness step.
     - The heavy 3px/6px grey drop shadow gives way to a soft, close ambient one that
       lifts slightly on hover, and the press state moves the button instead.
     - border-radius 3px -> 8px, and the border is transparent rather than #888, so the
       shape carries the button instead of an outline drawn around a flat colour.
     - :focus-visible gets a real ring - previously keyboard focus showed only the UA
       default, which the background colour often swallowed. */
BUTTON.dmcsButton,A.dmcsButton{display:inline-flex;align-items:center;justify-content:center;gap:.5em;width:auto;min-height:44px;padding:11px 26px;border:1px solid transparent;border-radius:8px;background-color:#171410;color:#faf7f2;font-size:1rem;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.08);transition:filter .2s ease,box-shadow .2s ease,transform .1s ease;}
BUTTON.dmcsButton:hover,A.dmcsButton:hover{filter:brightness(.92);box-shadow:0 3px 8px rgba(0,0,0,.14);}
BUTTON.dmcsButton:active,A.dmcsButton:active{transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,.10);}
BUTTON.dmcsButton:focus-visible,A.dmcsButton:focus-visible{outline:2px solid #171410;outline-offset:2px;}
/* Secondary/neutral variants: same geometry as the primary so a row of mixed buttons
   lines up, distinguished only by weight and colour. */
BUTTON.dmcsButtonUnselected{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:44px;padding:11px 26px;border:1px solid #ccc;border-radius:8px;background-color:#fff;color:#000;font-size:1rem;font-weight:600;line-height:1.2;cursor:pointer;box-shadow:none;transition:border-color .2s ease,background-color .2s ease;}
BUTTON.dmcsButtonUnselected:hover{border-color:#888;background-color:#fafafa;}
BUTTON.dmcsButtonGrey{display:inline-flex;align-items:center;justify-content:center;gap:.5em;width:auto;min-height:44px;padding:11px 26px;border:1px solid #d0d0d0;border-radius:8px;background-color:#ececec;color:#222;font-size:1rem;font-weight:500;line-height:1.2;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.06);transition:background-color .2s ease,box-shadow .2s ease,transform .1s ease;}
BUTTON.dmcsButtonGrey:hover{background-color:#e0e0e0;box-shadow:0 3px 8px rgba(0,0,0,.10);}
BUTTON.dmcsButtonGrey:active{transform:translateY(1px);}
/* A.dmcsButton no longer needs the old line-height:40px shim to match a BUTTON's
   height - min-height plus centring does that for both now - but anchors still need
   their own vertical padding restated since UA styles differ. */
A.dmcsButton{padding-top:11px;padding-bottom:11px}
/* Icon-only variant of .dmcsButton, used by BulletButton() for compact form submits.
   It carries no caption on purpose - the label would need translating in six language
   files - so it only trims the wide horizontal padding a text button needs and centres
   the glyph; every other property (colour, border, radius, hover) is inherited from
   .dmcsButton so it tracks whatever the active template says a button looks like.
   Two classes plus an element beats msh.css's 'body.msh button.dmcsButton' (one class,
   two elements), so the padding override survives that sheet loading afterwards. */
BUTTON.dmcsButton.dmcsButtonIcon{display:inline-flex!important;align-items:center;justify-content:center;padding-left:14px!important;padding-right:14px!important;line-height:1!important;}
FORM,IMG{display:inline;margin:0;padding:0;border:0;}
H1,H2,H3,H4{overflow-wrap:break-word}
H1,H2{font-weight:400}
H3,H4{font-weight:normal;}
HR{height:1px;border:none;background-color:#ddd;}
IMG.grow{transition:0.4s ease}
IMG.grow:hover{transform:scale(1.1)!important}
INPUT{max-width:99%;font-size:medium}
INPUT[type='radio'],[type='checkbox']{width:20px;height:20px;vertical-align:sub;margin:4px 0 4px 0;accent-color:#000}
INPUT[type='text'],INPUT[type='number'],INPUT[type='email'],INPUT[type='password']{background-color:#fff;color:#000;padding:10px;padding-bottom:10px;border:1px solid #888;border-radius:3px;}
INPUT.toolbarsearch{-webkit-appearance:none;height:36px;width:300px;padding:5px;padding-left:14px;background:#fff;color:#000;white-space:nowrap;vertical-align:middle;margin:0;border-radius:0px;border-top-left-radius:18px;border-bottom-left-radius:18px;border:1px solid #888;border-right:0}
BUTTON.toolbarsearch{min-width:90px;text-align:left;-webkit-appearance:none;font-size:larger;padding:0;padding-left:12px;padding-right:10px;margin:0;display:inline-block;height:36px;background:#171410;color:#faf7f2;vertical-align:middle;border-radius:0px;border-top-right-radius:18px;border-bottom-right-radius:18px;border:1px solid #888;border-left:0;}
LABEL{display:inline-block;}
LABEL IMG{pointer-events:none;}
SELECT{padding:8px;padding-top:10px;padding-bottom:10px;border:1px solid #888;border-radius:3px;background-color:#fff;color:#000;font-size:medium}
TABLE{border-spacing:0;border-collapse:collapse;padding:0;}
#dmcsBordered,#dmcsBordered TD,#dmcsBordered TH{border-collapse:collapse;border-spacing:0;border:1px solid #888;padding:4px;}
TABLE.dmcsForegroundBox{vertical-align:top;color:#171410;background-color:#faf7f2;}
#dmcsSpacing10px,#dmcsSpacing10px TD,#dmcsSpacing10px TH{padding:2px;border-collapse:separate;border-spacing:8px;}
TD,TH{padding:0;text-align:left;}
TD.dmcsForegroundBox{color:#171410;background-color:#faf7f2;padding:5px;}
TD.dmcsForeground{color:#171410;background-color:#faf7f2;vertical-align:top;}
TD.dmcsMenu{background-color:#faf7f2;color:#171410;padding-left:4px;border:0;}
TD.dmcsTabArea{padding:10px!important;border:1px solid #666;border-top:0;}
TD.dmcsTab{background:#f7f7f7;color:#000;min-height:25px;margin:0;border:1px solid #ccc;display:inline-block;cursor:pointer;border-top-left-radius:10px;border-top-right-radius:10px;font-weight:normal;border-bottom:1px solid #666;text-align:center;}
TD.dmcsTabSelected{margin:0;min-height:25px;border:1px solid #666;border-bottom:none;display:inline-block;cursor:pointer;white-space:nowrap;border-top-left-radius:10px;border-top-right-radius:10px;font-weight:normal;text-align:center;}
TEXTAREA{color:#000;padding:10px;border:1px solid #888;}
SPAN.dmcsTickYes{color:#0c0;font-weight:bold;}
SPAN.dmcsTickNo{color:#980;font-weight:bold;}
DIV.dmcsTab{padding:4px;min-height:25px;margin:0;padding-left:16px;padding-right:10px;border:1px solid #888;display:inline-block;cursor:pointer;white-space:nowrap;border-top-left-radius:10px;border-top-right-radius:10px;font-weight:normal;font-size:larger;border-bottom:0;}
DIV.dmcsTabSelected{border:1px solid #666;padding:4px;margin:0;min-height:25px;padding-left:16px;padding-right:10px;display:inline-block;cursor:pointer;white-space:nowrap;border-top-left-radius:10px;border-top-right-radius:10px;font-weight:normal;font-size:larger;border-bottom:0;}
DIV.dmcsTabContent{padding:20px;padding-top:0;margin:0;width:99%;text-align:left;border-radius:3px;border:1px solid #666;}
DIV.dmcsDivFooter{margin:0 auto;border:0;max-width:1440px;}
DIV.dmcsDivFullWidthFooter{width:100%;margin:0 auto;border:0;background:#f3ede4;color:#171410;}
DIV.dmcsDivFullWidthFooter A{color:#171410;text-decoration:none;}
DIV.dmcsDivFullWidthFooter A:visited{color:#171410;text-decoration:none;}
DIV.dmcsDivToolbar{background:#faf7f2}
DIV.dmcsMiddle{background-color:#faf7f2;}
FIGURE{margin-top:0;}
#dmcsGallerySideMenu{display:inline-block;width:18%;vertical-align:top;margin:0;padding:0;text-align:left;font-size:smaller}
#dmcsGallerySideMenu A{color:#171410;}
[data-tooltip]{font-size:20px;color:#666;}
[data-tooltip]:hover::after{box-shadow:3px 3px 6px #ddd;display:block;position:absolute;content:attr(data-tooltip);border-radius:20px;background:#000;color:#fff;padding:10px 20px 10px 20px;font-size:14px;font-family:'Roboto','Roboto',Helvetica,Arial,Sans-Serif;}
a.skip-main{left:-999px;position:absolute;top:auto;width:1px;height:1px;z-index:-999;}
a.skip-main:focus, a.skip-main:active{color:#fff;background-color:#000;left:auto;top:auto;width:30%;height:auto;margin:10px 35%;padding:5px;border-radius:15px;border:4px solid yellow;text-align:center;font-size:larger;z-index:999;}
/* The skip link targets <main id=skipmain tabindex=-1>. tabindex makes the jump
   work in Safari (which does not honour the sequential-focus-navigation
   starting point for non-focusable fragment targets), but it also gives the
   whole content region a focus ring on arrival, which is noise - suppress it.
   ID specificity deliberately beats msh.css BODY.msh :focus-visible. */
main#skipmain:focus{outline:none;}
/* 30% of a phone viewport is ~100px - the focused link would wrap to five
   lines. Give it room on small screens. */
@media(max-width:600px){a.skip-main:focus,a.skip-main:active{width:auto;max-width:80%;margin:10px 10%;font-size:1rem;}}
select:focus{box-shadow:0px 0px 8px #aaa;}
.glider,.glider-contain{margin:0 auto;position:relative;-ms-overflow-style:none;scrollbar-width:none;}.glider,.glider-track{transform:translateZ(0)}.glider-dot,.glider-next,.glider-prev{border:0;padding:0;user-select:none;-webkit-user-select:none;outline:0}.glider-contain{width:100%}.glider{overflow-y:hidden;-webkit-overflow-scrolling:touch;-ms-overflow-style:none}.glider-track{width:100%;margin:0;padding:0;display:flex;z-index:1}.glider.draggable{user-select:none;-webkit-user-select:none;cursor:-webkit-grab;cursor:grab}.glider.draggable .glider-slide img{user-select:none;-webkit-user-select:none;pointer-events:none}.glider.drag{cursor:-webkit-grabbing;cursor:grabbing}.glider-slide{user-select:none;-webkit-user-select:none;justify-content:center;align-content:center;width:100%;min-width:150px}.glider-slide img{max-width:100%}.glider::-webkit-scrollbar{opacity:0;height:0}.glider-next,.glider-prev{position:absolute;background-color:rgba(255,255,255,0.8);border-radius:99px;border:1px solid #ddd;z-index:2;text-decoration:none;left:-23px;top:30%;cursor:pointer;opacity:1;line-height:1;transition:opacity .5s cubic-bezier(.17,.67,.83,.67),color .5s cubic-bezier(.17,.67,.83,.67)}.glider-next:focus,.glider-next:hover,.glider-prev:focus,.glider-prev:hover{color:#000}.glider-next{right:-23px;left:auto}.glider-next.disabled,.glider-prev.disabled{opacity:.25;color:#666;cursor:default}.glider-hide{opacity:0}.glider-dots{user-select:none;-webkit-user-select:none;display:flex;flex-wrap:wrap;justify-content:center;margin:0 auto;padding:0}.glider-dot{display:block;cursor:pointer;color:#ccc;border-radius:99px;background:#ccc;color:#000;width:12px;height:12px;margin:7px}.glider-dot:focus,.glider-dot:hover{background:#ddd;color:#000}.glider-dot.active{color:#000;background:#a89cc8}@media(max-width:36em){.glider::-webkit-scrollbar{opacity:1;-webkit-appearance:none;width:7px;height:3px}.glider::-webkit-scrollbar-thumb{opacity:1;border-radius:99px;background-color:rgba(156,156,156,.25);-webkit-box-shadow:0 0 1px rgba(255,255,255,.25);box-shadow:0 0 1px rgba(255,255,255,.25)}}
.glider-next:hover,.glider-prev:hover{background-color:#fff;}
.glider-track{align-items: baseline;}
.glider-contain{padding:0;width:fit-content;}
.glider::-webkit-scrollbar{display:none;}
.glider-prev{left:0;padding:6px 1px 6px 11px;margin:6px;box-shadow:none;}
.glider-next{right:0;padding:6px;margin:6px;box-shadow:none;}
.dmcsGridBox{vertical-align:top;display:inline-flex;padding:30px;width:100%;max-width:300px;height:300px;background-color:#f0f0f0;color:#000;margin-bottom:2px;align-items:center;border-radius:3px;}
.dmcsGridImage{box-shadow:3px 3px 6px #ddd;max-width:100%;max-height:240px;width:auto;height:auto;}
.accordion-item{border:1px solid #ddd;margin-bottom:20px;}
.accordion-header{padding:10px;cursor:pointer;font-size:larger;font-weight:bold;}
.accordion-header:hover{background-color:#eee;color:#000;}
.accordion-button{float:right;background:#3856dc;width:30px;height:30px;border-radius:15px;text-align:center;color:#fff;font-weight:lighter;align-content:center}
.accordion-content{padding:10px;display:none;}
.dot-typing{position:relative;left:-9999px;width:6px;height:6px;border-radius:3px;box-shadow:9984px 0 0 0 #888, 9999px 0 0 0 #888, 10014px 0 0 0 #888;animation:dot-typing 1.5s infinite linear;}
@keyframes dot-typing{
0%{box-shadow: 9984px 0 0 0 #888, 9999px 0 0 0 #888, 10014px 0 0 0 #888;}
16.667%{box-shadow: 9984px -10px 0 0 #888, 9999px 0 0 0 #888, 10014px 0 0 0 #888;}
33.333%{box-shadow: 9984px 0 0 0 #888, 9999px 0 0 0 #888, 10014px 0 0 0 #888;}
50%{box-shadow: 9984px 0 0 0 #888, 9999px -10px 0 0 #888, 10014px 0 0 0 #888;}
66.667%{box-shadow: 9984px 0 0 0 #888, 9999px 0 0 0 #888, 10014px 0 0 0 #888;}
83.333%{box-shadow: 9984px 0 0 0 #888, 9999px 0 0 0 #888, 10014px -10px 0 0 #888;}
100%{box-shadow: 9984px 0 0 0 #888, 9999px 0 0 0 #888, 10014px 0 0 0 #888;}
}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
input[type=number]{appearance:textfield;}
DIV.dmcsThumbGrid,DIV.dmcsThumbGridGallery,DIV.dmcsThumbGridSearch{padding:15px 0 15px 0;}
H1,H2,H3,H4,B{color:#171410;}
H1,H2{font-family:'Source Serif 4','Roboto','Roboto',Helvetica,Arial,Sans-Serif;}
.dmcsHeaderColour{background:#faf7f2;color:#171410;}
.dmcsHeaderColour A{color:#171410;}

:target{scroll-margin-top:250px;}
@supports not (scroll-margin-top: 0) { DIV { scroll-snap-margin-top:250px; } }

.msh-ticker{background:#3b3737;color:#fff;font-size:13px;overflow:hidden;padding:5px 0;}
.msh-ticker-track{display:flex;gap:48px;width:max-content;animation:msh-ticker 46s linear infinite;}
.msh-ticker:hover .msh-ticker-track{animation-play-state:paused;}
.msh-ticker span{white-space:nowrap;}
.msh-ticker A{color:#fff;text-decoration:none;}
@keyframes msh-ticker{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.msh-ticker-track{animation:none;}}
@media (max-width:600px){.msh-ticker{display:none;}}

