/* Hand-written overrides for this migration.
 *
 * DELIBERATELY OUTSIDE site/public/styles/ (gotcha 49): tools/port-css.mjs owns
 * that directory and clears its own hashed outputs on every run, so a hand-written
 * sheet placed there is deleted by the next port with no error anywhere — on one
 * site that silently removed the sheet that hides the inactive device bands, and
 * all three headers then rendered at every width.
 *
 * Keep this file minimal. Anything that can come from the ported cascade should.
 */

/* The honeypot. Positioned off-screen rather than display:none — bots skip
 * obviously-hidden fields, and taking it out of flow means it costs no layout,
 * which the pixel gate would otherwise measure. */
.mg-hp {
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* SPECIFICITY NOTE — read before editing any rule below.
 *
 * Duda emits a per-widget rule for EVERY widget on the site, shaped
 *
 *     #dm .dmBody div.u_1213107879 { display: block !important }
 *
 * That is specificity (1,2,1) and it is `!important`. A hide written as a plain
 * `.mg-only-t { display:none !important }` is (0,1,0), so `!important` on both
 * sides means SPECIFICITY decides and Duda's rule wins — the element stays
 * visible and nothing in the console says so.
 *
 * Measured: with the plain selector, /blog rendered all THREE per-device widget
 * copies at once — 30 cards against live's 10, document height 7640px against
 * live's 3548px, and the gate scored 59.4%.
 *
 * So every gate below repeats its class three times behind `#dm`, giving (1,3,0),
 * which outranks (1,2,1) on class count without relying on source order. Do not
 * "tidy" the repetition away.
 */

/* Blog index: THIS SITE DOES HAVE A PAGER, and it withholds most of the posts.
 *
 * Measured on live: /blog declares data-paginate-total-elements="29" and
 * visible-items="10", and renders exactly 10 distinct data-blog-post-alias values.
 * The control is an APPEND-style <a class="more-posts-text-container"> ("Show
 * More"), not a numbered nav — driving it goes 10 -> 20 -> 29, after which the
 * control removes itself. blog.rss independently declares 29 items.
 *
 * A static build has no Duda backend, so all 26 cards ship and the extras are
 * stamped mg-blog-hidden with data-mg-blog-page in live's own batch size;
 * runtime.js reveals them a batch at a time. This rule is what hides them
 * initially, so unlike the port it came from it is NOT a no-op here. */
#dm .mg-blog-hidden.mg-blog-hidden.mg-blog-hidden {
  display: none !important;
}

/* display:none DOES NOT CHANGE CHILD INDICES, so shipping the withheld cards
 * silently moves which card is :last-child.
 *
 * Duda's own rule is `.postArticle:not(:last-child){padding-bottom:Npx}` — this
 * cascade carries it at 100px, 20px and 10px for the three bands. On live the
 * 10th card IS the last child and takes none of it. In our build the 10th card is
 * followed by 19 hidden siblings, so it stops matching :last-child and GAINS that
 * padding, pushing the control and the whole footer down by a constant amount at
 * every width — the signature of one shared element rather than a per-page fault.
 *
 * Keyed on `:has(+ .mg-blog-hidden)` rather than on a stamped class, because that
 * tracks the SEQUENCE as batches are revealed instead of pinning the initial
 * state; runtime.js does not have to re-stamp anything as cards appear.
 *
 * Specificity: Duda's rule is (0,2,1) and not !important, so this (0,4,1) plain
 * rule wins on merit without needing one. */
#dm .postArticle:not(.mg-blog-hidden):has(+ .postArticle.mg-blog-hidden) {
  padding-bottom: 0;
}

/* PER-DEVICE WIDGET FORKS.
 *
 * Duda builds .dmPhotoGallery and .mainBlog client-side and the three device
 * documents genuinely differ, so build-pages.py emits each widget three times and
 * stamps the copies mg-only-d / mg-only-t / mg-only-m. Without these rules ALL
 * THREE render at every width — which is exactly what the first gate run showed:
 * / came back at 77% with a +10458px height delta and /blog at 62% with +10150,
 * both of them simply the same widget painted three times over.
 *
 * The band boundaries are Duda's own, read out of the ported cascade: mobile
 * <=767, tablet 768-1024, desktop >=1025.
 *
 * These hide rather than remove, deliberately — the elements stay in the document
 * so the runtime can still address them, and display:none costs no layout.
 *
 * Only the INACTIVE bands are hidden, inside the media queries. The active band is
 * never touched, so it keeps whatever `display` the ported cascade gives it — an
 * earlier version hid all three and restored one with `display: revert`, which
 * reverts past the author cascade to the UA default and would have replaced the
 * widget's real display value with a plain `block`. */
@media (max-width: 767px) {
  #dm .mg-only-d.mg-only-d.mg-only-d,
  #dm .mg-only-t.mg-only-t.mg-only-t {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  #dm .mg-only-d.mg-only-d.mg-only-d,
  #dm .mg-only-m.mg-only-m.mg-only-m {
    display: none !important;
  }
}

@media (min-width: 1025px) {
  #dm .mg-only-t.mg-only-t.mg-only-t,
  #dm .mg-only-m.mg-only-m.mg-only-m {
    display: none !important;
  }
}

/* MEDIA-SLIDER FILM ROLE — NO OVERRIDE, and that is the measured answer.
 *
 * An earlier revision added a filmstrip rule here, reasoning from the SERVED html
 * where the film role carries `.gDtRCy` with position:absolute, right:-200%,
 * flex-direction:row and translateX(-0%). That was WRONG, and it is recorded
 * rather than quietly deleted because the reasoning is seductive.
 *
 * The served html is the authority for what the RUNTIME WRITES, but this rule is
 * not something the runtime writes — it belongs to the pre-hydration render. Once
 * the component hydrates it re-renders under a different generated class and the
 * filmstrip rule is simply not applied.
 *
 * MEASURED on live, settled, at 1440:
 *     class="sc-gEvEer jKjUdt"  position:relative  display:block
 *     left:0px  right:0px  transform:none  children:2
 *
 * which is precisely what this build already produced WITHOUT any override. So
 * the correct action here is to add nothing.
 *
 * INHERITED CONTEXT, RETARGETED TWICE NOW. The paragraph that stood here described
 * a slider on a client two migrations back, and the retarget before this one
 * replaced it with a claim about cristosgaragedoors' /reviews page — a page this
 * site does not have. Neither was ever a fact about insulationspecialistusa.net.
 * The general lesson both recorded still holds and is why the block above adds
 * nothing: a slider showing a different photograph than live is usually the CAPTURE
 * landing on a different slide, not a CSS defect, and the remedy is to exclude it
 * from the pixel gate and verify it per element.
 *
 * CENSUSED ON THIS SITE (tools/census-structure.mjs, 93 captures, <style>/<script>
 * stripped first): .flexslider is on 6 of 31 pages, identically on all three bands.
 * There are ZERO .bgGallerySlide elements on any band, and exactly ONE photo
 * gallery, on a single page. Whether any of them auto-advances is measured BEFORE
 * anything is excluded,
 * and each exclusion is recorded in visual-diff.config.json's hiddenRegions with the
 * measurement behind it — a hidden region gets no pixel coverage at all, so the
 * per-element check is the only coverage it has.
 */

/* ---------------------------------------------------------------------------
 * ACCORDION OPEN STATE — recovering a rule the live CSS read could not see.
 *
 * Duda's FAQ accordion is a styled-component driven by Duda's runtime, which is
 * correctly not ported. The markup and the ported cascade both arrive intact, so
 * the widget PAINTS in its settled state and the pixel gate scores the page
 * 0.000% — while every click is inert. CENSUSED HERE: an accordion (matched on
 * data-grab, not on a class token — styled-components generate their class names,
 * so a class regex finds nothing on these) is present on 27 of 31 pages, identically
 * on all three bands.
 *
 * The state is a generated class on the panel host, and the two names are NOT
 * hardcoded here for the reason gotcha 75 gives: styled-components mint a fresh
 * instance name per render. What IS measured is the mechanism —
 *
 *     closed: .dygwmn { overflow:hidden; transition:max-height .3s ease-out;
 *                       height:auto; max-height:0px; }
 *
 * — so the transition runs on MAX-HEIGHT, and opening means raising it.
 *
 * THE OPEN RULE IS ABSENT FROM THE PORTED CASCADE, and that is not a porting
 * mistake. styled-components insert their rules through the CSSOM, so a class
 * only exists in a document's sheet if that component actually RENDERED with it.
 * No panel is ever open on a freshly loaded page, so `.gnWefg` — the open class
 * live uses — appears in ZERO of the ported sheets while `.dygwmn` appears in 4.
 * Restoring it is recovering a sheet the live read could not reach, which is the
 * same situation gotcha 46 describes for a slider's resting state, arrived at
 * from the opposite direction.
 *
 * Keyed on our own class rather than Duda's generated one so nothing here depends
 * on a name that changes per render. Repeated behind #dm to clear Duda's own
 * per-widget `!important` display rules (gotcha 70).
 *
 * Lives in gm/, NOT in styles/: port-css cleans its own hashed output from that
 * directory on every run and would take this file with it (gotcha 49).
 * ------------------------------------------------------------------------- */
/* FALLBACK ONLY. runtime.js drives max-height inline from the panel's own
 * scrollHeight so the 0.3s transition interpolates the real travel instead of a
 * ceiling — a flat 2000px here made a 96px panel finish in ~14ms of the 300ms,
 * which reads as a snap. Inline styles outrank this selector, so this value now
 * applies only in the instant between the class landing and the inline write. */
#dm .mg-acc-open.mg-acc-open.mg-acc-open {
  max-height: 2000px;
}



/* ---------------------------------------------------------------------------
 * DRAWER SUBMENU CARET — a real touch target without moving the caret.
 *
 * The caret is an inline-block <span class="icon"> inside the label's anchor,
 * measured 33x22 / 27x22 on phone. Sizing the span itself to 44px turns it into
 * a box wide enough to wrap and floats the caret above-right of its label, so
 * the area is supplied by an invisible ::after instead (::before carries the
 * glyph; ::after is unused, content:none on both bands). The span already holds
 * a per-band transform, which makes it the containing block for this overlay.
 * gy-added.
 * ------------------------------------------------------------------------- */
#dm .layout-drawer a.unifiednav__item_has-sub-nav .icon::after {
  content: '';
  position: absolute;
  top: -11px;
  bottom: -11px;
  left: -8px;
  right: -8px;
}

/* DRAWER SUBMENU TRANSITION ON EVERY PAGE.
 *
 * The 0.3s max-height transition on the drawer's sub-nav comes from a stylesheet
 * that only some pages load. Measured on phone: on / the Services group computes
 * `max-height 0.3s ease-in-out`; on /commercial-electrical-services-scotch-plains-nj
 * — a page INSIDE that group — it computes the initial `all 0s`, so the group
 * snapped open there and nowhere else. Values are the ones / already computes.
 * gy-added. */
/* !important because the thing it has to beat is Duda's current-section rule,
 *   #dm .main-navigation.unifiednav[data-nav-structure='VERTICAL']
 *     [data-show-vertical-sub-items='HIDE']>.unifiednav__container:not([data-depth])
 *     >.unifiednav__item-wrap .unifiednav__item.dmNavItemSelected
 *     ~.unifiednav__container[data-depth] { transition:unset; max-height:50em }
 * at (1,11,0). That rule auto-expands the visitor's own section with no motion;
 * runtime.js already overrides its max-height inline so every group starts
 * closed (house standard), but its `transition: unset` still applied, so the
 * group snapped open on exactly the pages that belong to it. Scoped to the
 * drawer's sub-navs and to `transition` alone. */
#dm .layout-drawer .main-navigation.unifiednav .unifiednav__container.unifiednav__container_sub-nav {
  transition: transform 0.3s ease-in-out, opacity 0.6s ease-out, max-height 0.3s ease-in-out !important;
}

/* ---------------------------------------------------------------------------
 * LEGAL PAGES AND LEGAL LINKS — gy-added during review (neither page existed).
 * ------------------------------------------------------------------------- */

/* Footer line under the copyright: white on the footer blue, like the
 * copyright itself (13px, centred on every band — measured, not assumed). */
#dm .mg-legal-links.mg-legal-links {
  margin-top: 6px;
  text-align: center;
  font-size: 13px;
  line-height: 1.6;
  color: rgb(255, 255, 255);
}
#dm .mg-legal-links.mg-legal-links a {
  color: rgb(255, 255, 255);
  text-decoration: underline;
}

/* Contact form: one line, after every field, UNDER the submit button.
 * .dmformsubmit is floated, so being last in the markup is not enough —
 * clear:both is what puts the line beneath it. ~15px of space above, as
 * PADDING: a margin collapses against the floated widget's box and buys
 * nothing. Dark ink on the form's light ground. */
#dm .mg-form-legal.mg-form-legal {
  clear: both;
  display: block;
  width: 100%;
  padding-top: 15px;
  text-align: left;
  font-size: 14px;
  line-height: 1.5;
  white-space: nowrap;
  color: rgb(43, 43, 43);
}
#dm .mg-form-legal.mg-form-legal a {
  color: rgb(43, 43, 43);
  text-decoration: underline;
}

/* The legal pages themselves. Duda's reset zeroes margin on p, ul and h2, so a
 * page built from the template would render as one unbroken slab; the rhythm
 * is set explicitly here. Lists get their bullets back for the same reason. */
#dm .mg-legal-row.mg-legal-row {
  padding: 60px 40px 70px;
}
#dm .mg-legal.mg-legal {
  max-width: 900px;
  margin: 0 auto;
  text-align: left;
  color: rgb(43, 43, 43);
  font-size: 16px;
  line-height: 1.7;
}
#dm .mg-legal.mg-legal h2 {
  margin: 36px 0 12px;
  font-size: 26px;
  line-height: 1.3;
}
#dm .mg-legal.mg-legal h3 {
  margin: 24px 0 10px;
  font-size: 20px;
  line-height: 1.3;
}
#dm .mg-legal.mg-legal p {
  margin: 0 0 14px;
}
/* Bullets come from Duda's own `.dmNewParagraph[data-version] ul > li::before
 * { content: "•" }`, as on every other list on the site — no list-style here,
 * or they would double. */
#dm .mg-legal.mg-legal ul {
  margin: 0 0 16px;
  padding-left: 8px;
}
#dm .mg-legal.mg-legal li {
  margin: 0 0 6px;
}
#dm .mg-legal.mg-legal a {
  color: var(--color_4);
  text-decoration: underline;
}
.dmMobileBody #dm .mg-legal-row.mg-legal-row {
  padding: 40px 20px 50px;
}
.dmMobileBody #dm .mg-legal.mg-legal h2 {
  font-size: 22px;
}

/* HOMEPAGE FORM: its own blue panel (.u_1430551854, rgb(46,153,223)) with
 * WHITE field labels — so the legal line under the submit button is white here,
 * like the labels above it. Reviewer's request, 2026-09-10. /contact's form sits
 * on a light ground and keeps the dark ink set above. */
#dm .u_1430551854 .mg-form-legal.mg-form-legal,
#dm .u_1430551854 .mg-form-legal.mg-form-legal a {
  color: rgb(255, 255, 255);
}

/* TABLET HEADER — the phone buttons must clear the menu button.
 *
 * The tablet header row ([id=1598365696], present in the tablet header only)
 * lays out logo / 908-789-2345 / Emergency across its full width with 40px of
 * right padding, while the menu button is position:fixed at right:18px, 52px
 * wide — i.e. it occupies the row's last ~30px. On the 960px canvas the tablet
 * viewport meta asks for, that left a 13px gap; in any browser that does not
 * honour that meta (a resized desktop window, some tablets) the Emergency button
 * ran UNDER the menu button: measured -30px at 768 and 820, -7px at 900.
 * Reserving the button's footprint (18 + 52 + 16px gap = 86px) moves the button
 * group left together, keeping the 30px between the two phone buttons.
 * Reviewer's request, 2026-09-10. gy-added. */
.dmTabletBody #dm #hamburger-header [id="1598365696"].dmRespRow.dmRespRow {
  padding-right: 86px;
}

/* ===========================================================================
 * DRAWER REDESIGN (tablet + phone) — reviewer's request, 2026-09-10.
 *
 * Before: tablet set 12px-visual capitals in 24px rows at the top of an empty
 * white panel, with the current sub-page as a solid orange block; phone set
 * rgb(147,147,147) text (3.1:1) with no dividers. Neither had branding or a way
 * to call, and on pages inside a section the parent's caret pointed UP while
 * the group was closed (the current-section rule rotates it).
 *
 * Now one design on both bands: logo on top, full-width rows with hairline
 * dividers, dark ink, the current page in brand blue with an accent bar, groups
 * on a tinted indented panel, a CSS chevron driven ONLY by the open class, and
 * two call buttons under the menu. Selectors use #dm#dm: Duda sets the row
 * padding with !important at (1,7,0), which a single #dm cannot outrank. Behaviour (runtime.js) is untouched: the
 * caret is still the toggle and still carries its ::after tap overlay.
 * All selectors are scoped to .layout-drawer, so the desktop header is not
 * touched. The sub-nav <ul> gets no padding or border, so max-height:0 still
 * collapses it to nothing.
 * ========================================================================= */
#dm#dm .layout-drawer.layout-drawer {
  box-shadow: -14px 0 40px rgba(10, 30, 50, 0.22);
}
#dm#dm .layout-drawer .middleDrawerRow.middleDrawerRow {
  padding: 0 0 24px !important;
  text-align: left !important;
}
#dm#dm .layout-drawer .middleDrawerRow .dmRespColsWrapper,
#dm#dm .layout-drawer .middleDrawerRow .dmRespCol {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

/* logo */
#dm#dm .layout-drawer .mg-drawer-brand {
  display: block;
  padding: 18px 24px 16px;
  border-bottom: 1px solid rgba(15, 40, 60, 0.08);
  line-height: 0;
}
#dm#dm .layout-drawer .mg-drawer-brand img {
  width: 170px;
  max-width: 62%;
  height: auto;
}

/* top-level rows */
#dm#dm .layout-drawer .main-navigation.unifiednav {
  width: 100% !important;
  margin: 0 !important;
}
#dm#dm .layout-drawer .main-navigation > .unifiednav__container {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}
#dm#dm .layout-drawer .main-navigation > .unifiednav__container > .unifiednav__item-wrap {
  border-bottom: 1px solid rgba(15, 40, 60, 0.08);
  margin: 0 !important;
  padding: 0 !important;
}
#dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item {
  display: flex !important;
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 14px 14px 14px 21px !important;
  border-left: 3px solid transparent;
  background: transparent !important;
  transition: background-color 0.2s ease, color 0.2s ease;
}
#dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item .nav-item-text {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  font-family: Poppins, "Poppins Fallback", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.2px !important;
  text-transform: none !important;
  color: rgb(34, 40, 46) !important;
  text-align: left !important;
}
/* Duda's hover/current effects (underline bars, colour swaps) off inside the drawer */
#dm#dm .layout-drawer .unifiednav__item .nav-item-text::before,
#dm#dm .layout-drawer .unifiednav__item .nav-item-text::after {
  display: none !important;
}
#dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item:hover,
#dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item:focus-visible {
  background: rgba(46, 153, 223, 0.06) !important;
}

/* sub-menus: a tinted, indented panel */
#dm#dm .layout-drawer .unifiednav__container_sub-nav {
  background: rgb(243, 247, 251) !important;
  margin: 0 !important;
  box-shadow: none !important;
}
#dm#dm .layout-drawer .unifiednav__container_sub-nav > .unifiednav__item-wrap {
  border-top: 1px solid rgba(15, 40, 60, 0.05);
  margin: 0 !important;
  padding: 0 !important;
}
#dm#dm .layout-drawer .unifiednav__container_sub-nav > .unifiednav__item-wrap > a.unifiednav__item {
  padding: 11px 14px 11px 37px !important;
}
#dm#dm .layout-drawer .unifiednav__container_sub-nav > .unifiednav__item-wrap > a.unifiednav__item .nav-item-text {
  font-size: 15px !important;
  font-weight: 400 !important;
  color: rgb(55, 62, 70) !important;
}
#dm#dm .layout-drawer .unifiednav__container_sub-nav .unifiednav__container_sub-nav {
  background: rgb(233, 241, 249) !important;
}
#dm#dm .layout-drawer .unifiednav__container_sub-nav .unifiednav__container_sub-nav > .unifiednav__item-wrap > a.unifiednav__item {
  padding-left: 53px !important;
}

/* where the visitor is: the page itself strongly, its section lightly */
#dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item[aria-current="page"] {
  border-left-color: rgb(46, 153, 223);
  background: rgba(46, 153, 223, 0.10) !important;
}
#dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item[aria-current="page"] .nav-item-text {
  color: rgb(28, 108, 160) !important;
  font-weight: 600 !important;
}
#dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item.dmNavItemSelected:not([aria-current]) .nav-item-text {
  color: rgb(28, 108, 160) !important;
}

/* chevron: drawn in CSS, turned ONLY by the open class */
#dm#dm .layout-drawer a.unifiednav__item_has-sub-nav .icon {
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: -4px 0 -4px 12px !important;
  border-radius: 50%;
  transform: none !important;
  /* the caret's ::after tap overlay is position:absolute and used to be anchored
     by the per-band scale() this rule removes — without a positioned caret it
     anchors to a far ancestor, covers the whole row, and every label tap becomes
     a caret tap */
  position: relative !important;
  color: rgb(95, 104, 113);
  transition: background-color 0.2s ease, color 0.2s ease;
}
#dm#dm .layout-drawer a.unifiednav__item_has-sub-nav .icon::before {
  content: '' !important;
  display: block;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  font-size: 0 !important;
  /* the port draws icons as an SVG mask over background-color; drop both, or the
     mask shrinks this border chevron to a dot */
  -webkit-mask-image: none !important;
  mask-image: none !important;
  background: transparent !important;
  transform: translateY(-2px) rotate(45deg) !important;
  transition: transform 0.25s ease;
}
#dm#dm .layout-drawer li.unifiednav__item-wrap_open > a.unifiednav__item_has-sub-nav .icon {
  background: rgba(46, 153, 223, 0.14);
  color: rgb(28, 108, 160);
}
#dm#dm .layout-drawer li.unifiednav__item-wrap_open > a.unifiednav__item_has-sub-nav .icon::before {
  transform: translateY(2px) rotate(-135deg) !important;
}

/* call buttons */
#dm#dm .layout-drawer .mg-drawer-cta {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 22px 24px 8px;
}
#dm#dm .layout-drawer .mg-drawer-call {
  display: block;
  padding: 13px 16px;
  border-radius: 6px;
  background: rgb(37, 130, 177);
  color: rgb(255, 255, 255) !important;
  font-family: Poppins, "Poppins Fallback", sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  text-decoration: none !important;
}
#dm#dm .layout-drawer .mg-drawer-call--alt {
  background: transparent;
  color: rgb(28, 108, 160) !important;
  box-shadow: inset 0 0 0 2px rgb(37, 130, 177);
}

/* tablet renders on a 960px canvas scaled to the device, so sizes go up to read
 * the same as phone on a real tablet */
.dmTabletBody #dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item .nav-item-text {
  font-size: 19px !important;
}
.dmTabletBody #dm#dm .layout-drawer .unifiednav__container_sub-nav > .unifiednav__item-wrap > a.unifiednav__item .nav-item-text {
  font-size: 17px !important;
}
.dmTabletBody #dm#dm .layout-drawer .unifiednav__item-wrap > a.unifiednav__item {
  padding-top: 17px !important;
  padding-bottom: 17px !important;
}
.dmTabletBody #dm#dm .layout-drawer .unifiednav__container_sub-nav > .unifiednav__item-wrap > a.unifiednav__item {
  padding-top: 13px !important;
  padding-bottom: 13px !important;
}
.dmTabletBody #dm#dm .layout-drawer .mg-drawer-brand {
  padding: 26px 28px 20px;
}
.dmTabletBody #dm#dm .layout-drawer .mg-drawer-brand img {
  width: 210px;
}
.dmTabletBody #dm#dm .layout-drawer .mg-drawer-call {
  font-size: 17px;
  padding: 15px 18px;
}
.dmTabletBody #dm#dm .layout-drawer .mg-drawer-cta {
  padding: 26px 28px 10px;
}