/* 1.46.24 Homepage product panels (Apple's method: one product per panel, two buttons) and phone clean-up. Colours from home19.css. */
.h24{background:var(--h-cream,#FBF8F2);padding:28px 0 8px}
.h24-grid{max-width:1240px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.h24-p{border-radius:18px;padding:44px 32px 38px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;border:1px solid var(--h-line,#E6E1D6)}
.h24-wide{grid-column:1 / -1;min-height:340px}
.h24-white{background:#fff}
.h24-cream{background:#F6F1E7}
.h24-mint{background:var(--h-mint,#F4F9F9);border-color:var(--h-mline,#D3E5E7)}
.h24-navy{background:var(--h-navy,#0B2545);border-color:var(--h-navy,#0B2545);color:#fff}
.h24 .h24-k{margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--h-amber,#8A5A08)}
.h24-navy .h24-k{color:var(--h-gold2,#F3D08A)}
.h24 .h24-t{margin:0;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:40px;line-height:1.1;letter-spacing:-.01em;color:var(--h-navy,#0B2545)}
.h24-wide .h24-t{font-size:52px}
.h24-navy .h24-t{color:#fff}
.h24 .h24-l{margin:12px auto 0;max-width:620px;font-size:18px;line-height:1.5;color:var(--h-text,#3E5163)}
.h24-navy .h24-l{color:#D6E2EE}
.h24 .h24-pr{margin:10px 0 0;font-size:15px;font-weight:600;color:var(--h-teal,#0A5C63)}
.h24-navy .h24-pr{color:var(--h-gold2,#F3D08A)}
.h24-a{margin-top:22px;display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap}
.h24 .h24-b1{display:inline-flex;align-items:center;min-height:46px;padding:0 24px;border-radius:999px;background:#f2a33a;color:#14212b;font-weight:800;font-size:16px;text-decoration:none}
.h24 .h24-b1:hover{background:#ffb84d;color:#14212b}
.h24 .h24-b2{font-weight:700;font-size:16px;color:var(--h-teal,#0A5C63);text-decoration:none}
.h24 .h24-b2:hover{text-decoration:underline}
.h24-navy .h24-b2{color:#fff}
.h24-all{max-width:1240px;margin:16px auto 0;padding:0 20px;text-align:center;font-weight:700}
.h24-all a{color:var(--h-teal,#0A5C63);text-decoration:none}
@media (max-width:760px){
  .h24{padding-top:18px}
  .h24-grid{grid-template-columns:1fr;gap:10px;padding:0 12px}
  .h24-p,.h24-wide{min-height:0;padding:30px 20px 26px;border-radius:16px}
  .h24 .h24-t,.h24-wide .h24-t{font-size:30px}
  .h24 .h24-l{font-size:16px}
  .h24-a{gap:14px;margin-top:16px}
}
/* phones: one thing at a time. The side tabs (Explore, MyDoctor Social) stay on computers; their links are in the menu and footer. */
@media (max-width:640px){
  .m13d,.m13f{display:none!important}
  .mdf .mdf-appsd ul{margin-top:8px}
}
.mdf .mdf-appsd{grid-column:1 / -1;margin-top:8px}
.mdf .mdf-appsd > summary{list-style:none;cursor:default}
@media (max-width:640px){.mdf .mdf-appsd > summary{cursor:pointer}}

/* 1.46.24 hero: Buy now beside See how it works; on phones the buttons come right under the headline */
.h26 .hx-btn-buy{background:#f2a33a;color:#14212b!important;font-weight:800;box-shadow:0 10px 24px rgba(242,163,58,.25)}
.h26 .hx-btn-buy:hover{background:#ffb84d}
@media (max-width:760px){
  .h26 .hx-hero-t{display:flex;flex-direction:column}
  .h26 .hx-hero-t > *{order:5}
  .h26 .hx-hero-t > .hx-eye2{order:1}
  .h26 .hx-hero-t > h1{order:2}
  .h26 .hx-hero-t > .hx-acts{order:3;margin:14px 0 16px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .h26 .hx-hero-t > .hx-acts .hx-btn{width:100%;min-height:48px;font-size:16px;padding:0 10px}
  .h26 .hx-hero-t > .hx-acts .hx-mid{grid-column:1 / -1;justify-content:center}
  .h26 .hx-hero-t > .hx-by{order:4}
  .mdx .ck-note{padding:8px 10px;max-height:30vh}
  .mdx .ck-note p{font-size:12.5px;line-height:1.4}
}

/* 1.46.24 polish: "Compare every plan" is a text link on phones; on computers the three buttons fit on one line */
@media (min-width:761px){
  .h26 .hx-v3 .hx-acts{flex-wrap:nowrap;gap:10px}
  .h26 .hx-v3 .hx-acts .hx-btn{padding:0 20px;min-height:50px;font-size:16px}
  .h26 .hx-v3 .hx-acts .hx-cmpb{padding:0 18px;white-space:nowrap}
}
@media (max-width:760px){
  .h26 .hx-hero-t > .hx-acts .hx-cmpb{background:none!important;box-shadow:none!important;border:0!important;min-height:0!important;padding:4px 0!important;color:#0a5c63!important;text-decoration:underline;font-size:15px!important}
}

.h24-world{max-width:1240px;margin:18px auto 0;padding:0 20px;text-align:center;font-size:15px;color:var(--h-text,#3E5163)}

/* 1.46.24 "I am a..." row and "Everything you can buy" (mydoctor.social and modernushealth.in) */
.h24-iam{max-width:1240px;margin:0 auto 16px;padding:0 20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.h24-iam-h{margin:0;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8a5a08}
.h24-iam-l{display:flex;flex-wrap:wrap;gap:8px}
.h24-iam-l a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border:1px solid #d3e5e7;border-radius:10px;background:#fff;color:#0b2545;font-weight:700;font-size:15px;text-decoration:none}
.h24-iam-l a:hover{border-color:#0a5c63;color:#0a5c63}
.h24c{background:#fff;padding:40px 0 30px;border-top:1px solid #e6e1d6}
.h24c-w{max-width:1240px;margin:0 auto;padding:0 20px}
.h24c .h24c-k{margin:0 0 6px;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8a5a08}
.h24c .h24c-t{margin:0 0 18px;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:36px;line-height:1.1;color:#0b2545}
.h24c-co .h24c-t{font-family:"Bricolage Grotesque",sans-serif}
.h24c-g{border-top:1px solid #e6e1d6;padding:6px 0}
.h24c-g > summary{list-style:none;cursor:default;font-weight:800;font-size:18px;color:#0b2545;padding:12px 0}
.h24c-g > summary::-webkit-details-marker{display:none}
.h24c-g > summary small{font-weight:600;color:#6b7c8c;margin-left:6px}
.h24c-l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding-bottom:14px}
.h24c-i{border:1px solid #e6e1d6;border-radius:14px;padding:16px 16px 14px;display:flex;flex-direction:column;gap:6px;background:#fbf8f2}
.h24c-i b{font-size:16px;color:#0b2545}
.h24c-d{font-size:14px;line-height:1.45;color:#3e5163}
.h24c-p{font-size:14px;font-weight:700;color:#0a5c63}
.h24c-a{margin-top:auto;padding-top:8px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.h24c .h24c-b1{display:inline-flex;align-items:center;min-height:38px;padding:0 16px;border-radius:999px;background:#f2a33a;color:#14212b!important;font-weight:800;font-size:14px;text-decoration:none}
.h24c .h24c-b2{font-weight:700;font-size:14px;color:#0a5c63;text-decoration:none}
.h24c-all{margin:12px 0 0;font-weight:700}.h24c-all a{color:#0a5c63;text-decoration:none}
@media (max-width:900px){.h24c-l{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .h24-iam{padding:0 12px;gap:8px}.h24-iam-l{gap:6px}.h24-iam-l a{min-height:38px;padding:0 11px;font-size:14px}
  .h24c .h24c-t{font-size:26px}.h24c-l{grid-template-columns:1fr}
  .h24c-g > summary{cursor:pointer}.h24c-g > summary:after{content:" ›";color:#0a5c63}
}

/* 1.46.24 the product groups are closed rows on every screen; tap to open */
.h24c-g > summary{cursor:pointer!important;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;padding:16px 0}
.h24c-g > summary:after{content:"›";margin-left:auto;font-size:22px;color:#0a5c63;transition:transform .2s}
.h24c-g[open] > summary:after{transform:rotate(90deg)}
.h24c-gp{font-weight:500;font-size:14px;color:#6b7c8c}
.h24c-g > summary:hover .h24c-gn{color:#0a5c63}
@media (max-width:640px){.h24c-gp{flex-basis:100%;order:3}.h24c-g > summary:after{content:"›"}}

/* 1.46.24 header with the menu (1.46.35: one line from 1024 px; folds into Menu at 1023 px and below) */
@media (min-width:1024px){
  .mdh .mdh-in{max-width:1400px;gap:16px}
  .mdh .mdh-nav{gap:16px;font-size:14.5px}
  .mdh .mdh-panel{gap:14px}
}

/* 1.46.24 menus (founder, 2 Nov 21:48 and 22:01 "keep our signature colors but menu can be like this"): Tesla's menu in MyDoctor colours.
   Names sit in soft pills; the open one is mint. The panel: picture tiles (name, Learn and an action) on the left, a plain list on the right,
   and the page behind dims. Computer: opens on hover (touch screens: first tap). Menu button (1240 px and below): tap a name, its tiles
   become rows with a small picture. Colours: navy #0B2545, teal #0A5C63 / #0E7C86, mint #EAF4F4, amber #F2A33A. */
.mdh .mdh-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mdh .mdh-dd{display:flex;align-items:center}
.mdh .mdh-ddb{display:inline-grid;place-items:center;padding:0;border:0;background:none;color:#0b2545;cursor:pointer;border-radius:6px}
.mdh .mdh-ddb:before{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.mdh .mdh-dd.is-open > .mdh-ddb:before{transform:translateY(1px) rotate(225deg)}
.mdh .mdh-ddb:focus-visible{outline:2px solid #0e7c86;outline-offset:1px}
.mdh .mdh-ddp{display:none}
.mdh .mdh-tiles{display:grid;gap:26px 22px}
.mdh .mdh-tile{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.mdh .mdh-nav .mdh-timg{display:block;border:0;padding:0;line-height:0;width:100%}
.mdh .mdh-timg img{width:100%;max-width:230px;height:auto;aspect-ratio:240/150;transition:transform .25s ease}
.mdh .mdh-tile:hover .mdh-timg img{transform:translateY(-3px) scale(1.02)}
.mdh .mdh-tn{display:block;margin:10px 0 6px;font:600 18px/1.25 'Public Sans',system-ui,sans-serif;color:#0b2545;letter-spacing:-.005em}
.mdh .mdh-ta{display:flex;gap:18px;justify-content:center}
.mdh .mdh-nav .mdh-ta a{padding:0;border:0;font-size:14.5px;font-weight:500;color:#3e5163;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#9fb3c2;white-space:nowrap}
.mdh .mdh-nav .mdh-ta a:hover{color:#0a5c63;text-decoration-color:#0a5c63}
.mdh .mdh-nav .mdh-ta a + a{color:#0a5c63;text-decoration-color:#f2a33a}
.mdh .mdh-dl{list-style:none;margin:0;padding:0}
.mdh .mdh-nav .mdh-dl a{display:block;border:0;padding:7px 0;font-size:16px;font-weight:600;color:#0b2545;white-space:normal;line-height:1.3}
.mdh .mdh-nav .mdh-dl a:hover{color:#0a5c63}
@keyframes mdhdd{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (min-width:1024px){
  .mdh .mdh-nav{align-items:center;gap:4px}
  .mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 13px;border:0;border-radius:8px;transition:background .15s,color .15s}
  .mdh .mdh-nav > a:hover,.mdh .mdh-dd:hover > .mdh-ddt,.mdh .mdh-dd.is-open > .mdh-ddt{background:#eaf4f4;color:#0a5c63}
  .mdh .mdh-nav > a[aria-current],.mdh .mdh-nav .mdh-ddt[aria-current]{background:#eaf4f4;color:#0a5c63;border:0}
  .mdh .mdh-ddb{width:0;height:30px;overflow:hidden;margin:0}
  .mdh .mdh-ddb:focus-visible{width:22px}
  .mdh .mdh-ddp{position:absolute;left:0;right:0;top:100%;z-index:60;background:#fff;border-top:1px solid #efeae0;box-shadow:0 24px 40px rgba(11,37,69,.14)}
  .mdh .mdh-ddp:after{content:"";position:absolute;left:0;right:0;top:100%;height:100vh;background:rgba(11,37,69,.22);pointer-events:none} /* the page behind dims */
  .mdh:has(.mdh-dd.is-open),.mdh:has(.mdh-dd:hover){z-index:9000}
  .mdh .mdh-ddp:before{content:"";position:absolute;left:0;right:0;top:-26px;height:26px} /* keeps the panel open while the mouse moves down to it */
  .mdh .mdh-dd.is-open > .mdh-ddp{display:block;animation:mdhdd .2s ease-out}
  .mdh .mdh-ddi{max-width:1320px;margin:0 auto;padding:40px 32px 48px;display:grid;grid-template-columns:1fr 280px;align-items:start;cursor:default}
  .mdh .mdh-ddi0{grid-template-columns:1fr}
  .mdh .mdh-n3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mdh .mdh-n4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .mdh .mdh-tiles{padding-right:40px}
  .mdh .mdh-dl{border-left:1px solid #e6e1d6;padding:4px 0 4px 44px;align-self:stretch}
}
@media (min-width:1024px) and (hover:hover) and (pointer:fine){
  .mdh .mdh-dd:hover > .mdh-ddp{display:block;animation:mdhdd .2s ease-out}
}
@media (max-width:1023px){
  .mdh .mdh-panel{max-height:calc(100vh - 70px);max-height:calc(100dvh - 70px);overflow-y:auto;overscroll-behavior:contain}
  .mdh .mdh-dd{display:grid;grid-template-columns:1fr 48px;align-items:center;border-bottom:1px solid #efeae0}
  .mdh .mdh-nav .mdh-ddt{border-bottom:0}
  .mdh .mdh-ddb{width:48px;height:44px}
  .mdh .mdh-dd.is-open > .mdh-ddt{color:#0a5c63}
  .mdh .mdh-ddp{grid-column:1 / -1}
  .mdh .mdh-dd.is-open > .mdh-ddp{display:block;animation:mdhdd .16s ease-out}
  .mdh .mdh-ddi{padding:4px 0 14px}
  .mdh .mdh-tiles{grid-template-columns:1fr 1fr;gap:10px}
  .mdh .mdh-tile{display:grid;grid-template-columns:1fr;justify-items:center;padding:12px 8px 14px;border-radius:14px;background:#f7fafa}
  .mdh .mdh-timg img{max-width:118px}
  .mdh .mdh-tile{padding:10px 6px 12px}
  .mdh .mdh-tn{font-size:15px;margin:4px 0 4px}
  .mdh .mdh-ta{gap:14px}
  .mdh .mdh-nav .mdh-ta a{font-size:14.5px;padding:4px 0}
  .mdh .mdh-dl{margin-top:8px}
  .mdh .mdh-nav .mdh-dl a{padding:11px 4px;font-size:15.5px;border-bottom:1px solid #f1ede5}
  .mdh .mdh-dl li:last-child a{border-bottom:0}
}
@media (max-width:380px){
  .mdh .mdh-tn{font-size:14.5px}
  .mdh .mdh-ta{flex-wrap:wrap;gap:4px 12px}
}

/* 1.46.24 (founder, 2 Nov 22:33 "keep MyDoctor header too visible"): the header stays at the top while scrolling on every page,
   as on modernushealth.in, modernusgroup.com and eservices.world. Links to a section stop below it. */
.mdx > header.mdh{position:sticky;top:0;z-index:60;box-shadow:0 1px 0 rgba(11,37,69,.04),0 6px 18px rgba(11,37,69,.06)}
html{scroll-padding-top:88px}
@media (max-width:1023px){html{scroll-padding-top:76px}}
/* bars that also stay on screen sit below the header: checkout summary, the progress bar of health checks */
.mdx .co-box{top:92px}
.mdx .m12-prog{top:84px}
@media (max-width:1023px){.mdx .co-box{top:80px}.mdx .m12-prog{top:70px}}


/* 1.46.35 (founder, 3 Nov 2026, 09:38 and 09:44 "header in same line ... full menu on big ipad and laptop"): ONE line from 1024 px.
   Sizes step down with the screen so all 8 menus, the 9 dots, the country button and the Sign in icon always fit; See how it works
   joins the line from 1560 px (on the homepage it sits in the hero). Measured at 1024 to 1920 px: nothing overlaps or is cut off. */
@media (min-width:1024px){
  .mdh .mdh-in{max-width:1400px;padding:12px 24px;gap:14px}
  .mdh .mdh-panel{gap:12px}
  .mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 11px}
  .mdh .mdh-demo{display:none}
}
@media (min-width:1024px) and (max-width:1365px){
  .mdh .mdh-in{padding:10px 16px;gap:10px}
  .mdh .mdh-panel{gap:8px}
  .mdh .mdh-nav{gap:2px;font-size:14px}
  .mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 8px}
}
@media (min-width:1024px) and (max-width:1199px){
  .mdh .mdh-in{padding:10px 14px;gap:8px}
  .mdh .mdh-mark{width:38px;height:38px}
  .mdh .mdh-word{font-size:22px}
  .mdh .mdh-nav{font-size:13.5px;gap:0}
  .mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 6px}
  .mdh .mdh-rxb{width:44px;padding:0;justify-content:center}
  .mdh .mdh-rxb .mdh-rxl,.mdh .mdh-rxb .mdh-rxc{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .mda-b{min-width:36px;padding:0 6px}
}
@media (min-width:1560px){
  .mdh .mdh-in{max-width:1520px}
  .mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 13px}
  .mdh .mdh-demo{display:inline-flex}
}
/* 1.46.35 the 9 dots ("All MyDoctor") show on every screen in the MyDoctor header, phones and iPads too (was inside the Menu below 1241 px) */
.mdh .mda{display:flex!important}
.mdh .mda-b{display:inline-flex!important}
.mdh .mda-row{display:none!important}
@media (max-width:1023px){.mdh .mda-p{top:72px}}
@media (max-width:560px){
  .mdh .mdh-in{gap:6px}
  .mdh .mda-b{min-width:38px;height:38px;padding:0 6px}
  .mdh .mdh-demo{padding:0 12px;font-size:13.5px}
}
@media (max-width:400px){
  .mdh .mdh-in{padding:8px 12px;gap:5px}
  .mdh .mdh-brand{gap:6px}
  .mdh .mdh-mark{width:34px;height:34px}
  .mdh .mdh-word{font-size:19px}
  .mdh .mda-b{min-width:36px;height:36px;padding:0 5px}
  .mdh .mdh-menu{width:40px;min-width:40px;min-height:40px}
  .mdh .mdh-demo{padding:0 10px;font-size:13px;min-height:40px}
}
/* 1.46.36.1 (founder, 3 Nov 14:12 "the menu is hidden down"): Services got a 9th picture (MyDoctor Ventures), which fell to a third row
   below the bottom of a laptop screen. Menus with 9 or more pictures use 5 smaller columns (two rows), and any open menu scrolls inside
   itself when the screen is short, so nothing is ever out of reach. */
@media (min-width:1024px){
  .mdh .mdh-n5{grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 18px}
  .mdh .mdh-n5 .mdh-timg img{max-width:190px}
  .mdh .mdh-n5 .mdh-tn{font-size:16px;margin:8px 0 4px}
  .mdh .mdh-n5 .mdh-ta{gap:14px}
  .mdh .mdh-ddi{max-height:calc(100vh - 96px);max-height:calc(100dvh - 96px);overflow-y:auto;overscroll-behavior:contain}
}
@media (min-width:1024px) and (max-width:1365px){
  .mdh .mdh-ddi{padding:28px 24px 32px;grid-template-columns:1fr 240px}
  .mdh .mdh-ddi0{grid-template-columns:1fr}
  .mdh .mdh-tiles{padding-right:24px}
  .mdh .mdh-dl{padding-left:28px}
  .mdh .mdh-n5{gap:18px 12px}
  .mdh .mdh-n5 .mdh-tn{font-size:15px}
}
/* 1.46.57 (founder, 4 Nov 20:12 "make it all look professional... neatly arranged...also visible properly"): every drop-down fits the
   screen (it scrolls inside when the window is short); the list on the right has small group headings and even spacing. */
.mdh .mdh-dl .mdh-dlh{margin:18px 0 4px;font:700 12px/1.3 'Public Sans',system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#55707a}
.mdh .mdh-dl .mdh-dlh:first-child{margin-top:0}
@media (min-width:1024px){
  .mdh .mdh-ddp{max-height:calc(100vh - 80px);overflow-y:auto;overscroll-behavior:contain}
  .mdh .mdh-ddp:after{display:none}
  .mdh .mdh-ddp{box-shadow:0 24px 40px rgba(11,37,69,.14),0 0 0 100vmax rgba(11,37,69,.22);clip-path:inset(0 -100vmax -100vmax -100vmax)} /* the page behind dims, the header does not */
  .mdh .mdh-ddi{padding:32px 32px 36px;grid-template-columns:1fr 300px}
  .mdh .mdh-tiles{gap:22px 22px}
  .mdh .mdh-dl{padding:2px 0 2px 36px}
  .mdh .mdh-nav .mdh-dl a{padding:5px 0;font-size:15px;font-weight:600}
}
@media (min-width:1024px) and (max-height:820px){
  .mdh .mdh-ddi{padding:22px 32px 26px}
  .mdh .mdh-timg img{max-height:118px;width:auto}
  .mdh .mdh-tn{margin:6px 0 4px;font-size:16.5px}
}
/* 1.46.57.70 the city button (1.46.53) made the one-line header too wide: menus ran under the country and city buttons from 1440 px.
   The city name shows from 1600 px (the pin below), See how it works from 1920 px, and the line is wider there. Measured 1024 to 2560 px. */
@media (min-width:1024px) and (max-width:1599px){
  .mdh .mdh-cxb{justify-content:center;width:44px;padding:0}
  .mdh .mdh-cxb .mdh-cxl,.mdh .mdh-cxb .mdh-rxc{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (min-width:1024px) and (max-width:1199px){.mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 4px}}
@media (min-width:1200px) and (max-width:1365px){.mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 5px}}
@media (min-width:1366px) and (max-width:1559px){.mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 7px}}
@media (min-width:1560px) and (max-width:1919px){.mdh .mdh-demo{display:none}.mdh .mdh-nav > a,.mdh .mdh-nav .mdh-ddt{padding:8px 10px}}
@media (min-width:1920px){.mdh .mdh-in{max-width:1800px}}
@media (min-width:1200px) and (max-width:1299px){ /* "United States" is long: the globe only here, like below 1200 px */
  .mdh .mdh-rxb{width:44px;padding:0;justify-content:center}
  .mdh .mdh-rxb .mdh-rxl,.mdh .mdh-rxb .mdh-rxc{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
}