/* Inline <style> blocks from the live page /about/accessibility-statement (winndixie.com), extracted verbatim.
   The live site ships these inside the CMS-authored HTML; the Contentstack entries hold
   only structured content, so they are re-attached here per page. */

/* Un-caps the shared page shell for /about/accessibility-statement only — the global
   .container-fluid__full rule in _app-wd-legacy-content.scss caps it at max-width:1170px for
   page templates with no nested .container of their own. Scoped to this page's own linked
   stylesheet (see DynamicPage.razor.cs's PageCssMap) rather than the shared DynamicPage shell. */
.container-fluid__full {
    max-width: 100%;
}

@media screen and (min-width: 1200px) {
.recipes-details .image-slider .image {
min-height: 850px !important;
}
}
#herotitle {
    display: flex;
    background: var(--wd-color-surface-alt) !important;
    align-items: center;
    }
    #herotitle h1 {
    margin: 0px 20px 0px 80px;
    margin-left:96px;
    font-weight:700;
    color:var(--wd-color-text);
    font-size:2.25em;
    }
    body {
    background: #fff !important;
    margin: 0;
    }
    h2 {
    font-family: var(--wd-font-body) !important;
    font-weight: 700;
    color: var(--wd-color-brand-red);
    font-size: 1.375em;
    }
    /* "p > a" neutralized (not deleted, kept for provenance): live's own copy of this rule is
       HTML-escaped in its source <style> tag ("p &gt; a"), so the child-combinator selector is
       unreadable to any CSS parser there and NEVER actually fires on live — confirmed via a
       computed-style measurement pass showing live's mailto:/tel: links (plain <a> tags nested
       in a <p>, no explicit class) render default link blue/normal-weight, not this rule's red/
       bold. This app's copy is a literal (non-escaped) extraction, so the selector is genuinely
       valid CSS here and WOULD fire, diverging from live — neutralized to reproduce live's actual
       (buggy) behavior rather than "fixing" a bug live itself never fixed. Same documented bug as
       JsonRte.cs's own "p > a" comment and the removed LegalPageAccessibilityStatement.razor.cs
       WrapChildrenWithLinkClass/InsertNbspBeforeLinks logic, which routed around it with an
       explicit class for the one link that DOES need this red styling on live.
    p > a {
    color: var(--wd-color-brand-red) !important;
    text-decoration: none;
    font-weight:bold;
    } */
    .container-fluid {
    max-width: 100% !important;
    }
    .BrdCrmbTbl {
    display: none !important;
    }
    .accessibility__statement .card {
    width: 100%;
    padding: 42px 80px;
    margin-left: auto;
    margin-right: auto;
    }
    @media (max-width: 767px){
    .card{
    padding: 25px 24px !important;
    }
    }
    @media (min-width:768px) and (max-width: 1024px){
    .card{
    padding: 42px 32px !important;
    }
    }
    .text-primary {
    color: var(--wd-color-brand-red) !important;
    text-decoration: none;
    font-weight:bold;
    }
    /* Not part of the verbatim extract above — added locally. Overrides the "p > a" red/bold
       rule for the mailto/tel contact links (class-name "email"/"phnlink", added by
       InsertNbspBeforeLinks in LegalPageAccessibilityStatement.razor.cs). */
    .email, .phnlink {
    color: rgb(51, 122, 183) !important;
    font-weight: normal !important;
    }
    .email:hover, .phnlink:hover, .email:focus, .phnlink:focus {
    color: rgb(35, 82, 124) !important;
    }
    @media (min-width:768px) and (max-width: 1024px) {
    #herotitle h1{
    margin: 0px 20px 0px 32px !important;}
    }
    @media (max-width:767px) {
    #herotitle h1 {
    text-align: center;
    margin: 24px;
    height: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
    }
    #herotitle {
    display: flex;
    background: var(--wd-color-surface-alt) !important;
    flex-direction: column-reverse;
    }
    }
    @media (min-width: 768px){
    .container {
    width: 100%;
    }
    }
    /* Not part of the verbatim extract above — added locally. The live rule above only sets
       width:100% at >=768px, but the global .container class (bundles/css/refresh.min.css) also
       sets max-width:1170px (unaffected by that) and 15px horizontal padding — confirmed via
       computed-style measurement 2026-08-03 that live's .card is genuinely full-viewport-width
       edge to edge at EVERY width (375/768/1440 all measured with zero inset), not just >=768. */
    .accessibility__statement.container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    }
    #herotitle img{
    margin-left: auto;
    }
    .card p{
    color: var(--wd-color-text);
    }
    @media (min-width:1200px){
    .card p{
    font-size:1.125em;
    }
    }
    @media (min-width:920px){
    #herotitle h1 {
    width:400px;
    }
    }
    .card a{
    font-size:18px;
    }
    /* Not part of the verbatim extract above — added locally. The entry's own pagetext blob
       carries class="email"/"phnlink" on the mailto:/tel: links (semantic hooks with no CSS rule
       anywhere in this file), so with "p > a" correctly neutralized above (see that rule's own
       comment) nothing sets their text-decoration, and the global bundles/css/app-wd-global.css
       "a, a:focus, a:hover, a:visited { text-decoration: underline }" rule wins the cascade over
       bundles/css/refresh.min.css's "a { text-decoration: none }" (same specificity, later in
       load order) — underlining them, unlike live. Confirmed via computed-style measurement that
       live shows both links with no underline (plain default-blue text). */
    .email, .phnlink {
    text-decoration: none;
    }
    .card a:focus {
    display: initial;
    }
    .card a:hover,.card a:focus {
    text-decoration: underline;
    }
.z-banner {
        z-index: 55555 !important;
    }

    .ps-fixed {
        position: fixed !important;
    }

    .bg-yellow-700 {
        background-color: #F8EC74;
        opacity: .92;
    }

    .fc-black {
        color: #000;
    }

    .wmx8 {
        max-width: 64.8205128rem;
    }

    .mx-auto {
        margin-left: auto;
        margin-right: auto;
    }

    .grid {
        display: flex;
    }

    .jc-center {
        justify-content: center;
    }

    .mr12 {
        margin-right: 10%;
        font-size : 1em;
    }

    #cookieBar a {
        cursor: pointer;
        text-decoration: underline;
    }
 #cookieBar p {
    margin-bottom : 0px;
  }
    .svgClose {
        float: right;
        margin-top: -21px;
        margin-right: 33px;
    }

    .paddingBar {
        padding: 20px;
        right: 0px;
        left: 0px;
        bottom: 0px;
    }


    .s-link {
        color: #000 !important;
    }

      @media screen and (min-width:100px) and (max-width:992px) {
        .paddingBar {
            right: -27px;
        }
    }
@media screen and (min-width:320px) and (max-width:568px) {
.svgClose {
    float: right;
    margin-top: -43px;
    margin-right: 20px;
}
.mx-auto {
    margin-left: -7px;
}
}
@media screen and (min-width:375px) and (max-width:667px) {
.mr12 {
    margin-right: 31px;
}
.svgClose {
    margin-top: -30px;
}
}
.async-hide {
			opacity: 0 !important;
		}