/*#region Global */

body {
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}

html {
  scroll-behavior: smooth;
}

/*#endregion*/

/*#region Variables */

:root {
    --gold: rgba(196,154,108,1);
    --royal-blue: rgba(19,9,68,1);
    --lavendar: rgba(125,102,252,1);
    --pale-blue: rgba(225,223,255,1);
    --pale-blue-faded: rgba(225,223,255,0.3);
    --black: rgba(0,0,0,1);
    --dark: rgba(29,24,39,1);
    --steel: rgba(35,31,32,1);
    --green: rgba(25,176,89,1);
    --pale-green: rgba(236,255,244,1);
    --sand: rgba(223,208,167,1);
    --creame: rgba(245,240,225,1);
    --white: rgba(255,255,255,1);
    --page-width: 1400px;
    --font-smaller: 0.9em;
    --heading: 2.0rem;
    --h2: 2.3rem;
    --h2w: 700;
    --h3: 1.3rem;
    --h3w: 700;
}

/*#endregion*/

/*#region Fonts */

@font-face {
  font-family: 'signature';
  src: url('/cdn/shop/files/the-signature-font.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

html, body, p, h1, h2, h3, h4, h5, ul, ol, li, a, label, span {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 160%;
}

.fancyscript {
    font-family: font-family: "Corinthia", cursive;
    font-weight: 400;
    font-style: normal;
}

h1 {
    font-weight: 700;
    font-size: 2.8em;
    margin: 0px;
    padding: 0px;
    line-height: 120%;
}

h2 {
    font-weight: 700;
    font-size: 2.3em;
    margin: 0px;
    padding: 0px;
    line-height: 120%;
}

h3 {
    font-weight: 700;
    font-size: 1.3rem;
    margin: 0px;
    padding: 0px;
    line-height: 120%;
    color: var(--royal-blue);
}

h4 {
    font-weight: 300;
    font-size: 1rem;
    margin: 0px;
    padding: 0px;
    line-height: 120%;
    color: var(--black);
}


a {
    text-decoration: none;
}

@media(max-width:749px){
  h1 {
    font-size: 2.1em;
  }
  
  h2 {
      font-size: 1.7em;
  }
  
  h3 {
      font-size: 1.3rem;
  }
}

/*#endregion*/

/*#region Header */

/* Header */

body > div > .header {
    position: fixed;
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0px;
    padding: 0px;
    justify-content: flex-start;
    align-items: center;
    background:var(--white);
    z-index:9999;
    top:0px;
}

    .header .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 100%;
        margin: 0px;
        padding: 8px 0px 4px 0px;
        justify-content: space-between;
        align-items: center;
        max-width: var(--page-width);
    }

        .header .contents .logo {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 25%;
            max-width: 180px;
            min-width: 120px;
            margin: 0px;
            padding: 0px 20px 0px 0px;
            justify-content: flex-start;
            align-items: flex-start;
        }

            .header .contents .logo img {
                width: calc(100% - 20px);
                max-width: calc(100% - 20px);
            }

        .header .contents .navigation {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 50%;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
        }

            .header .contents .navigation ul {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: space-between;
                align-items: flex-start;
                list-style-type: none;
            }

                .header .contents .navigation ul li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: flex-start;
                }

                    .header .contents .navigation ul li a {
                        font-weight: 700;
                        color: var(--royal-blue);
                        text-decoration: none;
                    }


                        .header .contents .navigation ul li.has-children .submenu {
                            position:fixed;
                            display: none;
                            flex-direction:row;
                            width: calc(100vw - 80px);
                            top: 113px;
                            z-index: 9999;
                            background: rgba(255,255,255,0.975);
                            padding: 0px 40px;
                            left:0px;
                            border-top:1px solid var(--royal-blue);
                            justify-content:center;
                            align-items:stretch;
                        }

                        

                        .header .contents .navigation ul li.has-children.open .submenu {
                            display: flex;
                        }

                        .header .contents .navigation ul li.has-children.open .submenu li {
                            display: flex;
                            flex-direction:row;
                            flex:1 1 calc(33% - 40px);
                            padding:20px;
                            border-right:1px solid var(--royal-blue);
                        }

                        .header .contents .navigation ul li.has-children.open .submenu li:last-of-type {
                            border-right:0px;
                        }

                        .header .contents .navigation ul li.has-children.open .submenu li img {
                            overflow:hidden;
                            border-radius:20px;
                            min-width:100px;
                        }

                        .header .contents .navigation ul li.has-children .submenu li div {
                            margin-left:15px;
                        }

                        .header .contents .navigation ul li.has-children .submenu li div a {
                            font-weight:500;
                        }

                        .header .contents .navigation ul li.has-children .submenu li div p {
                            font-weight:400;
                            font-size:0.85em;
                            max-width:320px;
                        }


        .header .contents .items {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 25%;
            margin: 0px;
            padding: 0px;
            justify-content: flex-end;
            align-items: center;
        }

            .header .contents .items .basket {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
                background: var(--pale-blue);
                border-radius: 10px;
            }

                .header .contents .items .basket .icon {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 8px;
                    justify-content: flex-start;
                    align-items: center;
                    background: var(--gold);
                    border-radius: 10px;
                }

                    .header .contents .items .basket .icon img {
                        color: #FFF;
                    }

                .header .contents .items .basket .value, .header .contents .items .basket .volume {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px 12px;
                    justify-content: center;
                    align-items: flex-start;
                    font-weight: 700;
                    min-width: 90px;
                    color:var(--black);
                }

                .header .contents .items .basket .value {
                    display:none;
                    color:var(--black);
                }

            .header .contents .items .user {
                position: relative;
                display: flex;
                flex-direction: column;
                margin: 0px;
                padding: 0px 12px;
                justify-content: center;
                align-items: flex-start;
            }

                .header .contents .items .user img {
                }

                .header .contents .items .hamburger {
                  display:none;
                  position: relative;
                  flex-direction: column;
                  list-style-type: none;
                  width: 35px;
                  margin: 0px 10px 0px 0px;
                  padding: 0px;
                  cursor: pointer;
                  height: 35px;
                  align-items: flex-end;
                }

                    .header .contents .items .hamburger li {
                        display: flex;
                        width: 100%;
                        background: var(--black);
                        height: 2px;
                        margin-top: 8px;
                        -moz-transition: all ease-in-out .2s;
                        -o-transition: all ease-in-out .2s;
                        -webkit-transition: all ease-in-out .2s;
                        transition: all ease-in-out .2s;
                        position: absolute;
                    }

                    .header .contents .items .hamburger li:nth-of-type(1) {
                        top: 0;
                    }
                    
                    .header .contents .items .hamburger li:nth-of-type(2) {
                        top: 10px;
                        width: 80%;
                    }
                    
                    .header .contents .items .hamburger li:nth-of-type(3) {
                        top: 20px;
                    }
                    
                    .header .contents .items .hamburger.active li:nth-of-type(1) {
                        transform: rotate(45deg);
                        top: 11px;
                    }
                    
                    .header .contents .items .hamburger.active li:nth-of-type(2) {
                        visibility: hidden;
                        opacity: 0;
                    }
                    
                    .header .contents .items .hamburger.active li:nth-of-type(3) {
                        transform: rotate(-45deg);
                        top: 11px;
                    }

@media(max-width:1085px){
        .header .contents .navigation ul li.has-children .submenu li div p {
            display:none;
        }
}
@media(max-width:1049px){
  .header .contents .navigation {
    display:none;
    position:absolute;
    top:112px;
    left:0px;
    width:calc(100vw);
    padding:0x 20px;
    margin:0px;
    z-index: 12;
    background: var(--royal-blue);
  }

  .header .contents .navigation.active {
    display:flex;
  }
  
  .header .contents .navigation ul {
    position:relative;
    flex-direction:column;
    width:100%;
    margin:0px;
    padding:0px;
    justify-content:start;
    align-items:center;
  }

  .header .contents .navigation ul li {
    position:relative;
    flex-direction:column;
    width:100%;
    margin:0px;
    padding:10px;
    justify-content:start;
    align-items:center;
  }
  
  .header .contents .navigation ul li a {
    color:var(--white);
  }

  .header .contents .navigation ul li.has-children .submenu {
                            position:relative;
                            display: none;
                            flex-direction:column;
                            width: 100%;
                            background: var(--royal-blue);
                            padding: 10px;
                            justify-content:center;
                            align-items:center;
                            top:0px;
                            padding:0px;
                        }

                        header .contents .navigation ul li.has-children.open .submenu {
                            display: flex;
                        }

                        .header .contents .navigation ul li.has-children.open .submenu li {
                            display: flex;
                            flex-direction:column;
                            flex:1 1 calc(100% - 40px);
                            padding:10px;
                            border:0px;
                        }

                        .header .contents .navigation ul li.has-children.open .submenu li img {
                            display:none;
                        }

                        .header .contents .navigation ul li.has-children .submenu li div {
                            margin-left:0px;
                        }

                        .header .contents .navigation ul li.has-children .submenu li div a {
                            font-weight:500;
                        }

                        .header .contents .navigation ul li.has-children .submenu li div p {
                            display:none;
                        }






  .header .contents .items .hamburger  {
    display:flex;
  }

  .header .contents .logo, .header .contents .items {
    width:50%;
  }
}

@media(max-width:549px){
  .header .contents .logo {
    width:30%;
  }
   .header .contents .items {
    width:70%;
  }

  .header .contents .logo img {
    min-width:120px;
  }

  .header .contents .items .user img {
    width:22px;
  }

  .header .contents .navigation {
    top:95px;
  }

  .header .contents .items .hamburger {
    width:30px;
    height:30px;
  }

  .header .contents .items .hamburger li {
    margin-top: 4px;
  }

  .header .contents .items .basket .value, .header .contents .items .basket .volume {
    font-size:0.95em;
    min-width: 80px;
  }
}

/*#endregion*/

/*#region Buttons */

a.button-blue {
    position: relative;
    display: flex;
    flex-direction: column;
    margin: 0px;
    padding: 14px 28px;
    background: var(--royal-blue);
    color: var(--white);
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    width: fit-content;
    font-weight: 600;
}

a.button-gold {
    position: relative;
    display: flex;
    flex-direction: column;
    margin: 0px;
    padding: 14px 28px;
    background: var(--gold);
    color: var(--white);
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    width: fit-content;
    font-weight: 600;
}


/*#endregion */

/*#region Hero */

/* Hero Section */

.hero {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100vw * 0.555);
    margin: 0px;
    padding: 0px;
    justify-content: flex-start;
    align-items: center;
    background: var(--royal-blue);
    overflow-y: hidden;
}

.hero:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right,rgba(19,9,68,0.40),rgba(19,9,68,0));
    pointer-events: none;
    z-index:1;
}

    .hero video {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .hero .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100% - 40px);
        height: 100%;
        margin: 0px 20px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
        max-width: var(--page-width);
        z-index:2;
    }

    .hero .contents .intro {
        position: relative;
        display: flex;
        flex-direction: column;
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: 640px;
    }

        .hero .contents .intro sub {
            color: var(--white);
            font-weight:600;
        }

        .hero .contents .intro h1 {
            color: var(--white);
        }

        .hero .contents .intro h2 {
            color: var(--sand);
        }

        .hero .contents .intro p {
            color: var(--white);
            max-width: 420px;
        }

    .hero .contents .actions {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
    }

        .hero .contents .actions ul {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 100%;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
            list-style-type: none;
            gap: 15px;
        }

            .hero .contents .actions ul li {
                position: relative;
                display: flex;
                flex-direction: column;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
                list-style-type: none;
            }

                .hero .contents .actions ul li a {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 10px 30px;
                    border-radius: 10px;
                    background: var(--white);
                    font-weight: 700;
                    color: var(--black);
                    border: 2px solid var(--white);
                }

                .hero .contents .actions ul li:nth-of-type(2) a {
                    color: var(--white);
                    background: unset;
                }

    .hero .contents .icons {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 20px 0px 0px 0px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
    }

        .hero .contents .icons ul {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 100%;
            margin: 30px 0px 0px 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
            list-style-type: none;
            gap: 15px 40px;
        }

            .hero .contents .icons ul li {
                position: relative;
                display: flex;
                flex-direction: column;
                margin: 0px;
                padding: 0px;
                justify-content: center;
                align-items: center;
                list-style-type: none;
                border-radius: 50%;
                background: var(--white);
                width: 90px;
                height: 90px;
            }

                .hero .contents .icons ul li:nth-of-type(1) {
                    background: var(--gold);
                    border: 2px solid var(--gold);
                }

                .hero .contents .icons ul li:nth-of-type(2) {
                    background: unset;
                    border: 2px solid var(--white);
                }

                .hero .contents .icons ul li:nth-of-type(3) {
                    background: unset;
                    border: 1px solid var(--white);
                }

                .hero .contents .icons ul li img {
                    position: relative;
                    width: 50%;
                    max-height: 60px;
                }

                .hero .contents .icons ul li:nth-of-type(1) img {
                }

                .hero .contents .icons ul li label {
                    display: flex;
                    position: absolute;
                    bottom: -30px;
                    font-weight: 500;
                    color: var(--white);
                }

    .hero .contents .afterpay {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 100%;
        margin: 60px 0px 0px 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: center;
    }

        .hero .contents .afterpay img {
            width: 45px;
        }

        .hero .contents .afterpay label {
            color: var(--white);
            margin-left: 15px;
        }

@media(max-width:1400px) {
    .hero {
        margin-top:113px !important;
    }
}

@media(max-width:990px) {
    .hero {
        min-height:460px;
        overflow:hidden;
    }
    .hero video {
        position: absolute;
        width: 100%;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: right;
    }
    .hero .contents .actions, .hero .contents .icons {
        display: none;
    }
}

@media(max-width:700px) {
    .hero {
        margin-top:90px;
    }
}

/*#endregion*/

/*#region Hero Short */

.hero-short {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 420px;
    margin: 0px;
    padding: 0px;
    justify-content: flex-start;
    align-items: center;
    background: var(--royal-blue);
    background-image:var(--bg-desktop);
    overflow-y: hidden;
    margin-top:113px;
}

.hero-short:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right,rgba(19,9,68,0.60),rgba(19,9,68,0));
    pointer-events: none;
    z-index:3;
}

    .hero-short .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        margin: 0px 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: center;
        z-index:4
    }

        .hero-short .contents ul.slide {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 100%;
            height: 100%;
            margin: 0px;
            padding: 0px;
            justify-content: center;
            align-items: flex-start;
            list-style-type: none;
        }

            .hero-short .contents ul.slide li {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100% - 40px);
                height: 100%;
                margin: 0px;
                padding: 0px 20px;
                justify-content: center;
                align-items: flex-start;
                max-width: var(--page-width);
            }

                .hero-short .contents ul.slide li h1 {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    width: 100%;
                    margin: 0px;
                    padding: 0px;
                    color: var(--white);
                }

                .hero-short .contents ul.slide li p {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    width: 100%;
                    margin: 0px;
                    padding: 0px;
                    color: var(--white);
                    max-width:540px;
                }


                .hero-short .contents ul.slide li a {
                    display: flex;
                    margin: 20px 0px 0px 0px;
                    padding: 12px 24px;
                    background: var(--white);
                    color: var(--royal-blue);
                    font-weight: 700;
                    border-radius: 10px;
                }

        .hero-short .contents ul.navigate {
            position: absolute;
            display: flex;
            flex-direction: row;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
            list-style-type: none;
            width: 100%;
            max-width: var(--page-width);
            bottom: 20px;
            gap: 10px;
        }

            .hero-short .contents ul.navigate li {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 18px;
                justify-content: flex-start;
                align-items: center;
                border-radius: 50%;
                background: var(--pale-blue);
            }

                .hero-short .contents ul.navigate li.active {
                    background: var(--sand);
                }

@media(max-width:600px){
  .hero-short {
      min-height:500px;
      height: calc(100vw * 1.2);
      background-image:var(--bg-mobile);
      background-size:cover;
  }

  .hero-short:before {
    background: linear-gradient(to right, rgba(19, 9, 68, 0.90), rgba(19, 9, 68, 0.25));
  }
  
}

/*#endregion */

/*#region slider */

.slider {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0px;
    padding: 0px;
    justify-content: center;
    align-items: center;
    background: var(--royal-blue);
}

    .slider ul {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 100%;
        margin: 0px;
        padding: 0px;
        justify-content: space-between;
        align-items: center;
        background: var(--royal-blue);
        overflow-x: hidden;
        gap: 20px;
        flex-wrap: nowrap;
    }

        .slider ul li {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            margin: 0px;
            padding: 0px;
            justify-content: center;
            align-items: center;
            overflow-y:hidden;
        }

            .slider ul li .item {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 100%;
                margin: 0px;
                padding: 18px 0px;
                justify-content: center;
                align-items: center;
            }

                .slider ul li .item img {
                    height: 23px;
                    margin-right: 10px;
                    filter:invert(1);
                }

                .slider ul li .item > label {
                    font-size: var(--font-smaller);
                }

                .slider ul li .item label {
                    font-weight: 600;
                    color:var(--white);
                }

                .slider ul li .item label span {
                  font-family: 'signature';
                  position: absolute;
                  font-size: 3.7em;
                  top: -6px;
                  color: var(--gold);
                }

                .slider ul li .item.text-only label > label {
                    padding-left:50px;
                }

@media(max-width:1449px){
  .slider ul {
    flex-wrap:nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    cursor: grab;
  }
  .slider ul::-webkit-scrollbar {
    display: none;
  }
  .slider ul li {
    flex: 0 0 calc(25% - 20px);
    scroll-snap-align: start;
    scroll-snap-type: x proximity;
  }
}

@media(max-width:1049px){
  .slider ul li {
    flex: 0 0 calc(33% - 20px);
  }
}

@media(max-width:749px){
  .slider ul li {
    flex: 0 0 calc(50% - 20px);
  }
}

@media(max-width:549px){
  .slider ul li {
    flex: 0 0 100%;
  }
}

/*#endregion*/

/*#region Product Hero */

.product-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 0px 0px 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
    background:var(--royal-blue);
    overflow:hidden;
    margin-top:113px;
}

.product-hero:before {
    content: "";
    display: block;
    width: 390px;
    height: 210px;
    /*background-image: url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-icon-grid-2.svg);*/
    background:var(--royal-blue);
    background-size: cover;
    background-position: left;
    position: absolute;
    top: 0;
    right: 0;
}

    .product-hero .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        height: 170px;
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .product-hero .contents h1 {
          font-weight:400;
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:130%;
        }
        
            .product-hero .contents h1 span {
              font-weight:700;
              font-size:unset;
              padding:0px;
              margin:0px;
              line-height:130%;
            }

      .product-hero .contents p {
          font-size:var(--h3);
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:100%;
        }

@media(max-width:749px){
  .product-hero:before {
    display:none;
  }
}
/*#endregion */

/*#region product */

.product {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .product .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
        gap: 80px;
    }

        .product .contents .left {
            position: relative;
            display: flex;
            flex-direction: column;
            width: calc(50% - 80px);
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
        }

            .product .contents .left .image {
                position: relative;
                display: flex;
                flex-direction: column;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                min-height: 400px;
                border-radius: 20px;
                overflow: hidden;
            }

                .product .contents .left .image ul {
                    display: flex;
                    position: relative;
                    flex-direction: row;
                    overflow-x: hidden;
                    width: 100%;
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: flex-start;
                    gap: 0px;
                    list-style-type: none;
                    flex-wrap: nowrap;
                    height: 100%;
                    aspect-ratio: 1 / 1;
                }

                    .product .contents .left .image ul li {
                        display: flex;
                        position: absolute;
                        flex-direction: row;
                        width: 100%;
                        flex: 0 0 100%;
                        margin: 0px;
                        padding: 0px;
                        justify-content: flex-end;
                        align-items: flex-start;
                        transition: all 1s ease-in-out;
                        opacity:0;
                    }

                    .product .contents .left .image ul li.active {
                        opacity:1;
                    }


                        .product .contents .left .image ul li img {
                            width: 100%;
                            max-width: 100%;
                            min-width: 100%;
                            display:block;
                        }

            .product .contents .left .assets {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 100%;
                margin: 10px 0px 0px 0px;
                padding: 0px;
                justify-content: space-between;
                align-items: flex-start;
                gap: 20px;
            }

                .product .contents .left .assets ul {
                    position: relative;
                    display: flex;
                    flex-direction: row;
                    width: calc(75% - 20px);
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: flex-start;
                    list-style-type: none;
                    flex-wrap: nowrap;
                    gap: 10px;
                }

                    .product .contents .left .assets ul li {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        width: calc(33% - 10px);
                        margin: 0px;
                        padding: 0px;
                        justify-content: flex-start;
                        align-items: flex-start;
                        cursor:pointer;
                    }

                        .product .contents .left .assets ul li img {
                            width: 100%;
                        }

                .product .contents .left .assets .health-rating {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    width: calc(25% - 20px);
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: flex-end;
                    list-style-type: none;
                }

                    .product .contents .left .assets .health-rating img {
                        width: 70px;
                    }

        .product .contents .right {
            position: relative;
            display: flex;
            flex-direction: column;
            width: calc(50% - 80px);
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
        }

            .product .contents .right .top {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: space-between;
                align-items: flex-start;
                gap: 20px;
            }

                .product .contents .right .top h1 {
                    width: calc(80% - 20px);
                }

                .product .contents .right .top span {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    font-size: var(--h2);
                    font-weight: var(--h2w);
                    justify-content: flex-start;
                    align-items: flex-end;
                    line-height:100%;
                }

                    .product .contents .right .top span span {
                        position: absolute;
                        top: 10px;
                        left: -14px;
                        font-size: 1rem;
                    }

                    .product .contents .right .top span s {
                      font-size:0.60em;
                    }

            .product .contents .right .rating {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
                gap: 4px;
            }

                .product .contents .right .rating img {
                }

                .product .contents .right .rating p {
                    margin-left: 10px;
                }

            .product .contents .right .description {
                position:relative;
                padding-right:60px;
            }

            .product .contents .right .description:before {
                content: "";
                display: block;
                width: 16px;
                height: 16px;
                background-image: url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-right-arrow-thin-icon.svg);
                background-size: cover;
                background-position: center;
                position: absolute;
                top: 26px;
                right: 0;
                cursor:pointer;
            } 

                .product .contents .right .description.active:before {
                    transform:rotate(90deg);
                }

            .product .contents .right .extended {
                display:none;
            }

            .product .contents .right .extended.active {
                display:flex;
                flex-direction:column;
            }

            .product .contents .right .points {
                position: relative;
                display: flex;
                flex-direction: column;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: center;
                align-items: flex-start;
                gap: 0px;
            }

                .product .contents .right .points li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    width: 100%;
                    margin: 0px;
                    padding: 0px 0px 0px 30px;
                    justify-content: flex-start;
                    align-items: flex-start;
                }

                    .product .contents .right .points li:before {
                        content: "";
                        display: block;
                        width: 20px;
                        height: 20px;
                        background-image: url('https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-tick.svg');
                        background-size: cover;
                        background-position: center;
                        position: absolute;
                        top: 3px;
                        left: 0;
                    }

            .product .contents .right > .purchase {
                position: relative;
                display: flex;
                flex-direction: row;
                width: calc(100% - 40px);
                margin: 20px 0px 0px 0px;
                padding: 20px 20px;
                justify-content: space-between;
                align-items: center;
                border: 1px solid var(--gold);
                border-radius: 20px;
            }

                .product .contents .right .purchase .selector {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: center;
                }

                    .product .contents .right .purchase .selector > label {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 0px;
                        justify-content: flex-start;
                        align-items: flex-start;
                        padding: 8px 14px;
                        border-radius: 20px;
                        font-size: 1rem;
                    }

                        .product .contents .right .purchase .selector > label > span:first-of-type {
                            font-weight: 700;
                        }

                          .product .contents .right .purchase .selector > label > span:not(:first-of-type) {
                              font-size:var(--font-smaller);
                        }


                    .product .contents .right .purchase .selector ul {
                        position: absolute;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 0px;
                        width: 100%;
                        justify-content: flex-start;
                        align-items: flex-start;
                        list-style-type: none;
                        flex-wrap: nowrap;
                        gap: 0px;
                        border: 1px solid var(--royal-blue);
                        border-radius: 20px;
                        z-index: 9999;
                        background: var(--white);
                        visibility: hidden;
                        opacity: 0;
                    }

                .product .contents .right .purchase ul.active {
                    visibility: visible;
                    opacity: 1;
                }

                .product .contents .right .purchase ul li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 8px 24px;
                    height: 30px;
                    width: calc(100% - 48px);
                    justify-content: center;
                    align-items: flex-start;
                    border-radius: 23px;
                    border: none;
                    color: var(--black);
                    cursor: pointer;
                    font-weight: 600;
                    text-transform: uppercase;
                }

                .product .contents .right .purchase .action {
                    position: relative;
                    display: flex;
                    flex-direction: row;
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: flex-start;
                }


                    .product .contents .right .purchase .action ul {
                        position: relative;
                        display: flex;
                        flex-direction: row;
                        margin: 0px;
                        padding: 0px;
                        justify-content: flex-start;
                        align-items: center;
                        gap: 15px;
                        flex-wrap: nowrap;
                        width: unset;
                        list-style-type: none;
                    }

                        .product .contents .right .purchase .action ul li {
                            position: relative;
                            display: flex;
                            flex-direction: column;
                            margin: 0px;
                            padding: 0px;
                            justify-content: center;
                            align-items: center;
                            width: unset;
                            background: unset;
                            cursor: pointer;
                            height: unset;
                        }

                            .product .contents .right .purchase .action ul li .minus {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 8px;
                                width: 26px;
                                height: 26px;
                                justify-content: center;
                                align-items: center;
                                background: var(--pale-blue);
                                border-radius: 21px;
                            }

                            .product .contents .right .purchase .action ul li .plus {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 8px;
                                width: 26px;
                                height: 26px;
                                justify-content: center;
                                align-items: center;
                                background: var(--royal-blue);
                                border-radius: 21px;
                            }

                                .product .contents .right .purchase .action ul li .quantity-dropdown {
                                    position: relative;
                                    display: inline-block;
                                    cursor: pointer;
                                    user-select: none;
                                }
                                .product .contents .right .purchase .action ul li .quantity-dropdown .value {
                                    position:relative;
                                    padding: 6px 10px;
                                    border-radius: 4px;
                                    background: #fff;
                                    min-width: 36px;
                                    text-align: center;
                                }
                                .product .contents .right .purchase .action ul li .quantity-dropdown .value:before {
                                    content: "";
                                    display: block;
                                    width: 16px;
                                    height: 16px;
                                    background-image: url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-right-arrow-thin-icon.svg);
                                    background-size: cover;
                                    background-position: center;
                                    position: absolute;
                                    bottom: -10px;
                                    right: calc(50% - 8px);
                                    cursor:pointer;
                                    transform:rotate(90deg);
                                } 

                                .product .contents .right .purchase .action ul li .quantity-dropdown .options {
                                    position: absolute;
                                    top: calc(100% + 6px);
                                    left: 0;
                                    list-style: none;
                                    margin: 0;
                                    padding: 6px 0;
                                    display: none; /* toggled by JS */
                                    background: #fff;
                                    border: 1px solid #ddd;
                                    box-shadow: 0 4px 8px rgba(0,0,0,0.06);
                                    z-index: 40;
                                    min-width: 60px;
                                    max-height: 150px;      /* limit visible height */
                                    overflow-y: auto;       /* allow scrolling */
                                    scrollbar-width: none;  /* Firefox hide scrollbar */
                                }

                                /* Chrome, Safari, Edge */
                                .product .contents .right .purchase .action ul li .quantity-dropdown .options::-webkit-scrollbar {
                                    width: 0;
                                    height: 0;
                                }

                                .product .contents .right .purchase .action ul li .quantity-dropdown.open .options {
                                    display: block;
                                }

                                .product .contents .right .purchase .action ul li .quantity-dropdown.open .options { 
                                    display: block; 
                                }
                                .product .contents .right .purchase .action ul li .quantity-dropdown .options li {
                                    padding: 6px 10px;
                                    cursor: pointer;
                                }
                                .product .contents .right .purchase .action ul li .quantity-dropdown .options li:hover { background: #f5f5f5; }

                     .product .contents .right .purchase .action ul li div img {
                                width: 20px;
                                min-width: 20px;
                                max-width: 20px;
                            }

                    .product .contents .right .purchase .action li p {
                        font-weight: 700;
                        font-size: var(--h3);
                        color: var(--black);
                        margin: 0px;
                        padding: 0px;
                        min-width:30px;
                    }

            .product .contents .right .info {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 0px;
                width: 100%;
                justify-content: flex-start;
                align-items: flex-start;
            }

                .product .contents .right .info ul {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 20px 0px 0px 0px;
                    padding: 0px;
                    width: 100%;
                    justify-content: flex-start;
                    align-items: flex-start;
                    list-style-type: none;
                }

                    .product .contents .right .info ul li {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 0px;
                        width: 100%;
                        height: unset;
                        justify-content: flex-start;
                        align-items: flex-start;
                        cursor:pointer;
                    }

                        .product .contents .right .info ul li span:before {
                            content: "";
                            display: block;
                            width: 16px;
                            height: 16px;
                            background-image: url('https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-right-arrow-thin-icon.svg');
                            background-size: cover;
                            background-position: center;
                            position: absolute;
                            top: 26px;
                            right: 0;
                        }

                        .product .contents .right .info ul li span.active:before {
                            transform:rotate(90deg);
                        }

                        .product .contents .right .info ul li span {
                            position: relative;
                            display: flex;
                            flex-direction: row;
                            margin: 0px;
                            padding: 20px 60px 20px 0px;
                            width: calc(100% - 60px);
                            justify-content: flex-start;
                            align-items: flex-start;
                            border-bottom: 1px solid var(--creame);
                            font-weight: 700;
                        }

                        .product .contents .right .info ul li p, .product .contents .right .info ul li > ul {
                            display: none;
                            font-size:var(--font-smaller);
                        }

                        .product .contents .right .info ul li > ul {
                            display: none;
                            position:relative;
                            flex-direction:row;
                            flex-wrap:wrap;
                            width:100%;
                            margin:10px 0px 0px 0px;
                            padding:0px;
                            justify-content:flex-start;
                            align-items:flex-start;
                            gap:10px;
                            font-size:var(--font-smaller);
                            list-style-type:none;
                            flex-wrap:wrap;
                        }

                            .product .contents .right .info ul li > ul li {
                                display: flex;
                                position:relative;
                                flex-direction:column;
                                flex-wrap:wrap;
                                width:100%;
                                margin:0px;
                                padding:10px 0px;
                                justify-content:center;
                                align-items:center;
                                background:var(--pale-blue);
                                width:calc(25% - 10px);
                                font-weight:600;
                            }

                            .product .contents .right .info ul li > ul li sub {
                                font-weight:400;
                                font-size:10px;
                                text-transform:uppercase;
                            }

                            .product .contents .right .info ul li p.active, .product .contents .right .info ul li > ul.active {
                                display: flex;
                            }

@media(max-width:1049px){
  .product .contents {
    gap:30px;
    flex-wrap:wrap;
  }
  .product .contents .left {
    width: calc(35% - 30px);
  }
.product .contents .left .image {
    min-height:200px;
  }  
  .product .contents .right {
    width: calc(65% - 30px);
  }
  .product .contents .left .assets ul {
    flex-wrap:wrap;
  }
  .product .contents .left .assets ul li {
    width: calc(50% - 10px);
  }
}

@media(max-width:799px){
  .product .contents {
    gap:0px;
    row-gap:30px;
  }
  .product .contents .left {
    width: calc(100%);
  }
  .product .contents .right {
    width: calc(100%);
  }
  .product .contents .left .assets ul li {
    width: calc(25% - 10px);
  }
  .product .contents .right .info ul li > ul li {
    width:calc(33% - 10px);
  }
  .product .contents .right > .purchase 
  {
    flex-direction:column;
    justify-content: flex-start;
    align-items: flex-start;
  }  
}

/*#endregion */

/*#region Product Grid */

.product-grid {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .product-grid .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .product-grid .contents .header {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
            gap:15px;
        }

            .product-grid .contents .header label {
                font-size: var(--heading);
                color: var(--royal-blue);
                font-weight: 500;
                margin-right: 60px;
            }

                .product-grid .contents .header label span {
                    font-weight: 800;
                    font-size: var(--heading);
                }

            .product-grid .contents .header > ul {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
                list-style-type: none;
                gap: 20px;
                flex-wrap: nowrap;
            }

                .product-grid .contents .header > ul > li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 8px 24px;
                    height: 30px;
                    justify-content: center;
                    align-items: center;
                    border-radius: 23px;
                    border: 1px solid var(--royal-blue);
                    color: var(--black);
                    cursor: pointer;
                    font-weight: 600;
                    text-transform: uppercase;
                }

                .product-grid .contents .header > ul > li.divide {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 8px 0px;
                    height: 30px;
                    border-radius: 0px;
                    border: 0px;
                    border-right:1px solid var(--gold);
                    cursor: none;
                }

                .product-grid .contents .header > ul > li:not(.active):hover {
                    background:var(--gold);
                    border: 1px solid var(--gold);
                    color: var(--white);
                }

                    .product-grid .contents .header > ul > li.active {
                        background: var(--royal-blue);
                        color: var(--white);
                    }

            .product-grid .contents .header .selector {
                position: relative;
                display: flex;
                flex-direction: column;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
            }

            .product-grid .contents .header h2 {
                font-size:1.75rem;
            }

                .product-grid .contents .header .selector label {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: flex-start;
                    border: 1px solid var(--royal-blue);
                    padding: 15px 132px 15px 24px;
                    border-radius: 10px;
                    font-size: 1rem;
                    font-weight: 700;
                    cursor:pointer;
                }

                .product-grid .contents .header .selector label:before {
                    content: "";
                    display: block;
                    width: 18px;
                    height: 16px;
                    background-image: url('https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-down-arrow-blue-icon.svg');
                    background-size: cover;
                    background-position: center;
                    position: absolute;
                    top: 20px;
                    right: 12px;
                    transform:rotate(-90deg);
                }

                .product-grid .contents .header .selector ul {
                    position: absolute;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    width: 100%;
                    justify-content: flex-start;
                    align-items: flex-start;
                    list-style-type: none;
                    flex-wrap: nowrap;
                    gap: 0px;
                    border: 1px solid var(--royal-blue);
                    border-radius: 10px;
                    z-index: 9999;
                    background: var(--white);
                    visibility: hidden;
                    opacity: 0;
                }

                    .product-grid .contents .header .selector ul.active {
                        visibility: visible;
                        opacity: 1;
                    }

                    .product-grid .contents .header .selector ul li {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 8px 24px;
                        height: 30px;
                        width: calc(100% - 48px);
                        justify-content: center;
                        align-items: flex-start;
                        border-radius: 23px;
                        border: none;
                        color: var(--black);
                        cursor: pointer;
                        font-weight: 600;
                        text-transform: uppercase;
                    }

                        .product-grid .contents .header .selector ul li a {
                            font-weight:unset;
                        }

                    .product-grid .contents .header .selector ul li:hover {
                        
                    }

        .product-grid .contents .products {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            margin: 60px 0px 0px 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
        }

            .product-grid .contents .products ul {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                list-style-type: none;
                gap: 20px;
                flex-wrap: wrap;
                width: 100%;
                opacity:1;
                transition:opacity 1s ease-in-out;
            }

            .product-grid .contents .products ul.updating {
                opacity:0;
            }

                .product-grid .contents .products ul li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    justify-content: space-between;
                    align-items: center;
                    width: calc(25% - 20px);
                    background: var(--pale-blue-faded);
                }

                    .product-grid .contents .products ul li .image {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 0px;
                        width: 100%;
                        overflow: hidden;
                    }

                        .product-grid .contents .products ul li .image img {
                            display: block;
                            width: 100%;
                            height: auto;
                            transition: opacity 0.4s ease-in-out;
                        }

                        .product-grid .contents .products ul li .image .secondary-image {
                            position: absolute;
                            top: 0;
                            left: 0;
                            opacity: 0;
                        }

                        .product-grid .contents .products ul li .image:hover .secondary-image {
                            opacity: 1;
                        }

                        .product-grid .contents .products ul li .image:hover .primary-image {
                            opacity: 0;
                        }







                        .product-grid .contents .products ul li .image .discount {
                            position: absolute;
                            display: flex;
                            flex-direction: column;
                            margin: 0px;
                            padding: 20px;
                            width: 40px;
                            height: 40px;
                            left: 10px;
                            top: 10px;
                            border-radius: 50%;
                            background: var(--gold);
                            color: var(--white);
                            font-weight: 600;
                            justify-content: center;
                            align-items: center;
                            font-size: 1.3em;
                            font-weight: 800;
                            text-align: center;
                            line-height: 100%;
                        }

                        .product-grid .contents .products ul li .image img {
                            width: 100%;
                            max-width: 100%;
                            min-width: 100%;
                        }

                    .product-grid .contents .products ul li .info {
                        position: relative;
                        display: flex;
                        flex-direction: row;
                        margin: 0px;
                        padding: 15px 15px 0px 15px;
                        justify-content: space-between;
                        align-items: flex-start;
                        width: calc(100% - 30px);
                        min-height: 65px;
                    }

                        .product-grid .contents .products ul li .info h3 {
                            padding: 0px 40px 0px 0px;
                            font-size: 1rem;
                        }

                        .product-grid .contents .products ul li .info > span {
                            position: relative;
                            display: flex;
                            margin: 0px;
                            padding: 0px;
                            font-size: 1.2rem;
                            font-weight: var(--h3w)
                        }

                            .product-grid .contents .products ul li .info > span > span {
                                position: absolute;
                                top: 4px;
                                left: -12px;
                                font-size: 0.75rem;
                            }

                    .product-grid .contents .products ul li .detail {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 15px 15px 20px 15px;
                        justify-content: flex-start;
                        align-items: flex-start;
                        width: calc(100% - 30px);
                    }

                        .product-grid .contents .products ul li .detail ul {
                            position: relative;
                            display: flex;
                            flex-direction: row;
                            margin: 0px;
                            padding: 0px;
                            justify-content: space-between;
                            align-items: center;
                            width: 100%;
                            gap: 5px;
                            list-style-type: none;
                        }

                            .product-grid .contents .products ul li .detail ul li {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 0px;
                                justify-content: center;
                                align-items: center;
                                font-size: var(--font-smaller);
                                width: calc(19% - 5px);
                                background: unset;
                            }

                                .product-grid .contents .products ul li .detail ul li sub {
                                    font-size: 9px;
                                    font-weight: 600;
                                    line-height:100%;
                                }

                                .product-grid .contents .products ul li .detail ul li:last-of-type {
                                    align-items: flex-end;
                                }

                                .product-grid .contents .products ul li .detail ul li:first-of-type {
                                    align-items: flex-start;
                                    width: calc(24% - 5px);
                                }


                    .product-grid .contents .products ul li .action {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 10px 0px 40px 0px;
                        justify-content: center;
                        align-items: center;
                        width: 100%;
                    }

                        .product-grid .contents .products ul li .action ul {
                            position: relative;
                            display: flex;
                            flex-direction: row;
                            margin: 0px;
                            padding: 0px;
                            justify-content: flex-start;
                            align-items: center;
                            gap: 15px;
                            flex-wrap: nowrap;
                            width: unset;
                            list-style-type: none;
                        }

                            .product-grid .contents .products ul li .action ul li {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 0px;
                                justify-content: center;
                                align-items: center;
                                width: unset;
                                background: unset;
                                cursor: pointer;
                            }

                                .product-grid .contents .products ul li .action ul li .minus {
                                    position: relative;
                                    display: flex;
                                    flex-direction: column;
                                    margin: 0px;
                                    padding: 8px;
                                    width: 24px;
                                    height: 24px;
                                    justify-content: center;
                                    align-items: center;
                                    background: var(--pale-blue);
                                    border-radius: 20px;
                                }

                                .product-grid .contents .products ul li .action ul li .plus {
                                    position: relative;
                                    display: flex;
                                    flex-direction: column;
                                    margin: 0px;
                                    padding: 8px;
                                    width: 24px;
                                    height: 24px;
                                    justify-content: center;
                                    align-items: center;
                                    background: var(--royal-blue);
                                    border-radius: 20px;
                                }

                                
                                .product-grid .contents .products ul li .action ul li .quantity-dropdown {
                                    position: relative;
                                    display: inline-block;
                                    cursor: pointer;
                                    user-select: none;
                                }
                                .product-grid .contents .products ul li .action ul li .quantity-dropdown .value {
                                    position:relative;
                                    padding: 6px 10px;
                                    border-radius: 4px;
                                    min-width: 36px;
                                    text-align: center;
                                }
                                .product-grid .contents .products ul li .action ul li .quantity-dropdown .value:before {
                                    content: "";
                                    display: block;
                                    width: 16px;
                                    height: 16px;
                                    background-image: url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-right-arrow-thin-icon.svg);
                                    background-size: cover;
                                    background-position: center;
                                    position: absolute;
                                    bottom: -10px;
                                    right: calc(50% - 8px);
                                    cursor:pointer;
                                    transform:rotate(90deg);
                                } 

                                .product-grid .contents .products ul li .action ul li .quantity-dropdown .options {
                                    position: absolute;
                                    top: calc(100% + 6px);
                                    left: 0;
                                    list-style: none;
                                    margin: 0;
                                    padding: 6px 0;
                                    display: none; /* toggled by JS */
                                    background: #fff;
                                    border: 1px solid #ddd;
                                    box-shadow: 0 4px 8px rgba(0,0,0,0.06);
                                    z-index: 40;
                                    min-width: 60px;
                                    max-height: 150px;      /* limit visible height */
                                    overflow-y: auto;       /* allow scrolling */
                                    scrollbar-width: none;  /* Firefox hide scrollbar */
                                }

                                /* Chrome, Safari, Edge */
                                .product-grid .contents .products ul li .action ul li .quantity-dropdown .options::-webkit-scrollbar {
                                    width: 0;
                                    height: 0;
                                }

                                .product-grid .contents .products ul li .action ul li .quantity-dropdown.open .options {
                                    display: block;
                                }

                                .product-grid .contents .products ul li .action ul li .quantity-dropdown.open .options { 
                                    display: block; 
                                }
                                .product-grid .contents .products ul li .action ul li .quantity-dropdown .options li {
                                    padding: 6px 10px;
                                    cursor: pointer;
                                }
                                .product-grid .contents .products ul li .action ul li .quantity-dropdown .options li:hover { background: #f5f5f5; }

                                .product-grid .contents .products ul li .action ul li div img {
                                    width: 16px;
                                    min-width: 16px;
                                    max-width: 16px;
                                }

@media(max-width:1149px){
  .product-grid .contents .products ul li {
        width: calc(33.3% - 20px);
  }
}

@media(max-width:1049px){
  .product-grid .contents .header {
    flex-direction:column;
    align-items:center;
  }
  .product-grid .contents .header label {
    margin:0px;
  }
  .product-grid .contents .header > ul {
    justify-content:center;
    align-items:center;
    margin-top:20px;
    flex-wrap:wrap;
  }
}

@media(max-width:849px){
  .product-grid .contents .products ul li {
        width: calc(50% - 20px);
  }
}

@media(max-width:599px){
  .product-grid .contents .products ul {
    gap:0px;
    row-gap:20px;
  }
  .product-grid .contents .products ul li {
        width: 100%;
  }
}


/*#endregion*/

/*#region Reviews */

.reviews {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .reviews .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .reviews .contents h2 {
        }

        .reviews .contents ul {
            position: relative;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            width: 100%;
            margin: 20px 0px 0px 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
            list-style-type: none;
            gap: 40px;
        }

            .reviews .contents ul li {
                position: relative;
                display: flex;
                flex-direction: column;
                flex-wrap: nowrap;
                width: calc(25% - 40px);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
            }

                .reviews .contents ul li .top {
                    position: relative;
                    display: flex;
                    flex-direction: row;
                    flex-wrap: nowrap;
                    width: 100%;
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: center;
                }

                    .reviews .contents ul li .top .initials {
                        position: relative;
                        display: flex;
                        flex-direction: row;
                        flex-wrap: nowrap;
                        width: 100%;
                        margin: 0px;
                        padding: 10px;
                        width: 50px;
                        height: 40px;
                        justify-content: center;
                        align-items: center;
                        background: var(--pale-blue);
                        border-radius: 50%;
                        color: var(--royal-blue);
                        font-weight: 700;
                        font-size: 0.9em;
                    }

                    .reviews .contents ul li .top .name {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        flex-wrap: nowrap;
                        width: 100%;
                        margin: 0px 0px 0px 10px;
                        padding: 0px;
                        justify-content: flex-start;
                        align-items: flex-start
                    }

                        .reviews .contents ul li .top .name label {
                        }

                        .reviews .contents ul li .top .name .stars {
                        }

                            .reviews .contents ul li .top .name .stars img {
                            }

                .reviews .contents ul li .bottom {
                }

                    .reviews .contents ul li .bottom p {
                    }

/*#endregion */

/*#region Luxury Promo */

.luxury-promo {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .luxury-promo .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100% - 120px);
        margin: 0px;
        padding: 80px 60px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
        background: var(--creame);
        border-radius: 40px;
        overflow: hidden;
    }

        /*.luxury-promo .contents:before {
            content: "";
            display: block;
            width: 300px;
            height: 300px;
            background-image: url('https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-icon-grid.svg');
            background-size: cover;
            background-position: center;
            position: absolute;
            top: 0;
            right: 0;
        }*/

        .luxury-promo .contents h2 {
            font-weight: 500;
            margin-bottom:10px;
        }

            .luxury-promo .contents h2 span {
                font-size: var(--h2);
                font-weight: var(--h2w);
            }


        .luxury-promo .contents > ul {
            position: relative;
            display: flex;
            flex-direction: row;
            list-style-type:none;
            width: 100%;
            height:360px;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
            overflow-x:hidden;
            flex-wrap:nowrap;
            gap:0px;
        }

            .luxury-promo .contents > ul > li {
                position: absolute;
                display: flex;
                flex-direction: column; 
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                overflow-x: hidden;
                flex-wrap: nowrap;
                flex:0 0 100%;
                opacity:0;
                pointer-events: none;
                transition:opacity 1s ease-in-out;
            }

            .luxury-promo .contents > ul > li.active {
                opacity:1;
                pointer-events:unset;
            }

            .luxury-promo .contents ul li .item {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
            }

                .luxury-promo .contents ul li .item:before {
                    content: "";
                    display: block;
                    width: 200px;
                    height: 360px;
                    background: var(--white);
                    position: absolute;
                    top: 0px;
                    left: 80px;
                    border-radius: 40px 0px 0px 40px;
                }

                .luxury-promo .contents ul li .item .image {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    width: 240px;
                    height: 240px;
                    margin: 0px;
                    padding: 0px;
                    justify-content: center;
                    align-items: center;
                    border-radius: 40px;
                    overflow: hidden;
                }            

                    .luxury-promo .contents ul li .item .image img {
                        width: 100%;
                        max-width: 100%;
                        min-width: 100%;
                        margin: 0px;
                        padding: 0px;
                        transition: opacity 0.4s ease-in-out;
                    }

                        .luxury-promo .contents ul li .item .image .secondary-image {
                            position: absolute;
                            top: 0;
                            left: 0;
                            opacity: 0;
                        }

                        .luxury-promo .contents ul li .item .image:hover .secondary-image {
                            opacity: 1;
                        }

                        .luxury-promo .contents ul li .item .image:hover .primary-image {
                            opacity: 0;
                        } 

                .luxury-promo .contents ul li .item .content {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    width: calc(80% - 280px);
                    height: 360px;
                    margin: 0px;
                    padding: 0px 60px 0px 20px;
                    justify-content: center;
                    align-items: flex-start;
                    background: var(--white);
                    border-radius: 40px;
                }

                    .luxury-promo .contents ul li .item .content .top {
                      position: relative;
                      display: flex;
                      flex-direction: row;
                      width:100%;
                      margin: 0px;
                      padding: 0px;
                      justify-content: space-between;
                      align-items: flex-start;
                    }

                    .luxury-promo .contents ul li .item .content .top .left {
                      position: relative;
                      display: flex;
                      flex-direction: column;
                      width:100%;
                      margin: 0px;
                      padding: 0px;
                      justify-content: flex-start;
                      align-items: flex-start;
                      flex:0 0 70%;
                    }

                    .luxury-promo .contents ul li .item .content .top .left h4 {
                    }

                    .luxury-promo .contents ul li .item .content .top .left h3 {
                        max-width: 75%;
                    }

                        .luxury-promo .contents ul li .item .content .top .left h3 a {
                            font-size: unset;
                            color: unset;
                            font-weight: unset;
                        }

                    .luxury-promo .contents ul li .item .content .top .right {
                      position: relative;
                      display: flex;
                      flex-direction: column;
                      width:100%;
                      margin: 0px;
                      padding: 0px;
                      justify-content: flex-start;
                      align-items: flex-end;
                    }

                        .luxury-promo .contents ul li .item .content .top .right > span {
                            position: relative;
                            display: flex;
                            margin: 0px;
                            padding: 0px;
                            font-size: 1.7rem;
                            font-weight: var(--h3w)
                        }

                            .luxury-promo .contents ul li .item .content .top .right > span > span {
                                position: absolute;
                                top: 6px;
                                left: -12px;
                                font-size: 0.85rem;
                            }




                    .luxury-promo .contents ul li .item .content .detail {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 0px;
                        justify-content: flex-start;
                        align-items: flex-start;
                        width: 100%;
                    }

                        .luxury-promo .contents ul li .item .content .detail ul {
                            position: relative;
                            display: flex;
                            flex-direction: row;
                            margin: 0px;
                            padding: 0px;
                            justify-content: flex-start;
                            align-items: center;
                            width: 100%;
                            gap: 5px;
                            list-style-type: none;
                        }

                            .luxury-promo .contents ul li .item .content .detail ul li {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 0px 20px 0px 0px;
                                justify-content: center;
                                align-items: center;
                                font-size: var(--font-smaller);
                                background: unset;
                                flex:unset;
                                width:fit-content;
                            }

                    .luxury-promo .contents ul li .item .content > p {
                        max-width: 75%;
                    }

                    .luxury-promo .contents ul li .item .content .lower {
                        position: relative;
                        display: flex;
                        flex-direction: row;
                        margin: 0px;
                        padding: 0px;
                        justify-content: space-between;
                        align-items: flex-start;
                        width: 100%;
                    }

                        .luxury-promo .contents ul li .item .content .lower .action {
                            position: relative;
                            display: flex;
                            flex-direction: column;
                            margin: 0px;
                            padding: 10px 0px;
                            justify-content: flex-start;
                            align-items: flex-start;
                        }

                            .luxury-promo .contents ul li .item .content .lower .action ul {
                                position: relative;
                                display: flex;
                                flex-direction: row;
                                margin: 0px;
                                padding: 0px;
                                justify-content: flex-start;
                                align-items: center;
                                gap: 15px;
                                flex-wrap: nowrap;
                                width: unset;
                                list-style-type: none;
                            }

                                .luxury-promo .contents ul li .item .content .lower .action ul li {
                                    position: relative;
                                    display: flex;
                                    flex-direction: column;
                                    margin: 0px;
                                    padding: 0px;
                                    justify-content: center;
                                    align-items: center;
                                    width: unset;
                                    background: unset;
                                    cursor: pointer;
                                    flex:unset;
                                }

                                    .luxury-promo .contents ul li .item .content .lower .action ul li .minus {
                                        position: relative;
                                        display: flex;
                                        flex-direction: column;
                                        margin: 0px;
                                        padding: 8px;
                                        width: 26px;
                                        height: 26px;
                                        justify-content: center;
                                        align-items: center;
                                        background: var(--pale-blue);
                                        border-radius: 21px;
                                    }

                                    .luxury-promo .contents ul li .item .content .lower .action ul li .plus {
                                        position: relative;
                                        display: flex;
                                        flex-direction: column;
                                        margin: 0px;
                                        padding: 8px;
                                        width: 26px;
                                        height: 26px;
                                        justify-content: center;
                                        align-items: center;
                                        background: var(--royal-blue);
                                        border-radius: 21px;
                                    }

                                        .luxury-promo .contents ul li .item .content .lower .action ul li .plus img, .luxury-promo .contents ul li .item .content .lower .action ul li .minus img {
                                            width: 20px;
                                            min-width: 20px;
                                            max-width: 20px;
                                        }

                        .luxury-promo .contents ul li .item .content .lower > ul {
                            position: relative;
                            display: flex;
                            flex-direction: row;
                            margin: 0px;
                            padding: 0px;
                            justify-content: flex-start;
                            align-items: center;
                            gap: 20px;
                            flex-wrap: nowrap;
                            width: unset;
                            list-style-type: none;
                        }

                            .luxury-promo .contents ul li .item .content .lower > ul li {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 0px;
                                justify-content: center;
                                align-items: center;
                                width: 70px;
                                flex:unset;
                            }

                                .luxury-promo .contents ul li .item .content .lower > ul li img {
                                    width: 45px;
                                }

                                .luxury-promo .contents ul li .item .content .lower > ul li:first-of-type img {
                                    width: 70px;
                                }

                                .luxury-promo .contents ul li .item .content .lower > ul li label {
                                    font-weight: 700;
                                    font-size: var(--font-smaller);
                                    margin-top:4px;
                                }

        .luxury-promo .contents .navigate {
            position: absolute;
            display: flex;
            flex-direction: column;
            margin: 0px;
            padding: 0px;
            justify-content: center;
            align-items: flex-end;
            width: 80px;
            top: calc(50%);
            right: 200px;
        }

                .luxury-promo .contents .navigate .right {
                    position: relative;
                    display: flex;
                    flex-direction: row;
                    margin: 0px;
                    padding: 0px;
                    justify-content: center;
                    align-items: center;
                    width: 40px;
                    height: 40px;
                    background: var(--royal-blue);
                    border-radius: 50%;
                    padding: 10px;
                    cursor: pointer;
                }

              .luxury-promo .contents .navigate .right:hover {
                    background: var(--gold);
                }

                    .luxury-promo .contents .navigate .right img {
                        width: 20px;
                        min-width: 20px;
                        max-width: 20px;
                    }

@media(min-width:1400px){
      .luxury-promo .contents {
        width: 1280px;
    }
}

@media(max-width:1249px){
  #shopify-section-luxury-feature {
    display:none;
  }
}

/*#endregion*/

/*#region Try Promo */

.try-promo {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
    background: var(--pale-blue-faded);
}

    .try-promo .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: calc(100% - 120px);
        margin: 0px;
        padding: 80px 60px;
        justify-content: flex-start;
        align-items: center;
        max-width: var(--page-width);
    }

        /*.try-promo .contents:before {
            content: "";
            display: block;
            width: 300px;
            height: 300px;
            background-image: url('https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-icon-grid-1.svg');
            background-size: cover;
            background-position: center;
            position: absolute;
            top: 0;
            right: 0;
        }*/

        .try-promo .contents .image {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 320px;
            height: 320px;
            margin: 0px;
            border-radius: 40px;
            background: var(--black);
            overflow: hidden;
        }

            .try-promo .contents .image img {
                width: 100%;
                max-width: 100%;
                min-width: 100%;
                position: absolute;
                object-fit: cover;
                height: 100%;
            }

        .try-promo .contents .details {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 640px;
            margin: 0px;
            padding: 0px 30px;
            max-width: 100%;
        }

            .try-promo .contents .details h2 {
            }

            .try-promo .contents .details p {
              font-size:1.1em;
            }

            .try-promo .contents .details p span {
              font-weight:700;
            }

            .try-promo .contents .details p span.code {
              color: var(--gold);
              font-weight: 800;
              font-size: 1.3em;
            }

        .try-promo .contents .value {
            position: relative;
            display: flex;
            flex-direction: column;
            margin: 0px;
            padding: 20px;
            background: var(--royal-blue);
            color: var(--white);
            justify-content: center;
            align-items: center;
            border-radius: 50%;
            width: 140px;
            height: 140px;
            font-weight: 600;
            min-width: 140px;
            text-align: center;
        }

            .try-promo .contents .value span {
                margin: 0px;
                padding: 0px;
                font-size: 2em;
                font-weight: 700;
            }

            .try-promo .contents .value p {
                text-transform:uppercase;
                font-weight: 600;
            }

@media(min-width:1400px){
      .try-promo .contents {
        width: 1280px;
    }
}


@media(min-width:1299px){
  .try-promo .contents .value {
      width: 200px;
      height: 200px;
      min-width: 200px;
  }
  .try-promo .contents .value p{
      font-size: 1.2em; 
  }
}

@media(max-width:899px){

      .try-promo .contents {
        flex-direction: column;
        width: calc(100% - 40px);
        margin: 0px;
        padding: 40px 20px 20px 20px;
    }

    .try-promo .contents .details {
        padding: 40px 30px;
        justify-content: flex-start;
        align-items: center;
    }

  .try-promo .contents .value{
    display:none;
  }

  .try-promo .contents .details p {
      text-align: center;
      max-width: calc(100% - 20px);
  }

  .try-promo .contents .image {
    height: unset;
    max-width: 100%;
  }

  .try-promo .contents .image img{
    position:relative;
  }
  
}

/*#endregion*/

/*#region Niutrition Promo */

.nutrition-promo {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .nutrition-promo .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: calc(100% - 140px);
        margin: 0px;
        padding: 80px 60px;
        justify-content: flex-start;
        align-items: center;
        max-width: var(--page-width);
        border: 1px solid var(--creame);
        overflow: hidden;
    }

        .nutrition-promo .contents:before {
            content: "";
            display: block;
            width: 600px;
            height: 600px;
            background-image: url('./images/yes-chef-background-wave.svg');
            background-size: contain;
            background-repeat: no-repeat;
            background-position: flex-start;
            position: absolute;
            top: 0px;
            right: 0;
        }



        .nutrition-promo .contents .copy {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 60%;
            margin: 0px;
            padding: 0px 80px 0px 0px;
            justify-content: flex-start;
            align-items: flex-start;
        }

            .nutrition-promo .contents .copy h2 {
            }

            .nutrition-promo .contents .copy p {
            }

            .nutrition-promo .contents .copy a {
            }

        .nutrition-promo .contents .images {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 40%;
            margin: 0px;
            padding: 0px;
            justify-content: center;
            align-items: center;
        }

            .nutrition-promo .contents .images ul {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 340px;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                list-style-type: none;
                gap: 10px;
                flex-wrap: wrap;
            }

                .nutrition-promo .contents .images ul li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    width: calc(50% - 10px);
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: flex-start;
                }

                    .nutrition-promo .contents .images ul li img {
                        display: flex;
                        width: 160px;
                        height: 160px;
                        max-width: 100%;
                        min-width: 100%;
                    }

/*#endregion*/

/*#region Fresh Promo */

.fresh-promo {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .fresh-promo .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 100%;
        min-height: 400px;
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .fresh-promo .contents .image {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 200px;
            height: 440px;
            min-height: 100%;
            margin: 0px 20px 0px 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
            border-radius: 20px;
            background: var(--black);
        }

            .fresh-promo .contents .image img {
                height: 100%;
                min-height: 100%;
                max-height: 100%;
            }

            .fresh-promo .contents .image label {
            }

        .fresh-promo .contents .content {
            position: relative;
            display: flex;
            flex-direction: column;
            width: calc(100% - 220px);
            margin: 0px 20px 0px 0px;
            padding: 80px;
            justify-content: flex-start;
            align-items: flex-start;
            border-radius: 20px;
            border: 1px solid var(--gold);
        }

            .fresh-promo .contents .content h2 {
            }

            .fresh-promo .contents .content p {
            }

            .fresh-promo .contents .content ul {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-end;
                list-style-type: none;
                gap: 20px;
                flex-wrap: nowrap;
            }

                .fresh-promo .contents .content ul li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    justify-content: flex-start;
                    align-items: bottom;
                }

                    .fresh-promo .contents .content ul li img {
                        width: 70px;
                        max-width: 70px;
                        min-width: 70px;
                        filter: invert();
                    }

                    .fresh-promo .contents .content ul li span {
                        display: flex;
                        background: var(--gold);
                        width: 70px;
                        height: 4px;
                        margin: 10px 0px 0px 0px;
                    }

/*#endregion*/

/*#region Newsletter */

.newsletter {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .newsletter .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: center;
        max-width: var(--page-width);
    }

        .newsletter .contents h2 {
            text-align: center;
            max-width: 960px;
            font-weight:400;
        }

            .newsletter .contents h2 span {
                font-size: var(--h2);
                font-weight: var(--h2w)
            }

        .newsletter .contents p {
            text-align: center;
            max-width: 720px;
        }

        .newsletter .contents form {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            max-width: 640px;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
        }

            .newsletter .contents form .item {
                position: relative;
                display: flex;
                flex-direction: column;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
            }

                .newsletter .contents form .item input {
                    border-radius: 10px;
                    border: none;
                    background: var(--pale-blue-faded);
                    color: var(--black);
                    padding: 18px;
                    width: 100%;
                    text-align: center;
                    font-weight: 600;
                    font-size: 1rem;
                    max-width:340px;
                }

                .newsletter .contents form .item button {
                    border-radius: 10px;
                    border: none;
                    background: var(--gold);
                    color: var(--white);
                    padding: 18px;
                    width: 100%;
                    margin: 10px 0px 0px 0px;
                    text-align: center;
                    font-weight: 600;
                    font-size: 1rem;
                    max-width:380px;
                }

@media(max-width:549px){
  .newsletter .contents form .item input {
     width:calc(100% - 36px); 
  }  
}

/*#endregion*/

/*#region Contact */

.contact {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .contact .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: center;
        max-width: var(--page-width);
    }

        .contact .contents h2 {
            text-align: center;
            max-width: 960px;
            font-weight:400;
        }

            .contact .contents h2 span {
                font-size: var(--h2);
                font-weight: var(--h2w)
            }

        .contact .contents p {
            text-align: center;
            max-width: 720px;
        }

        .contact .contents form {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            max-width: 840px;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
        }

            .contact .contents form .item {
                position: relative;
                display: flex;
                flex-direction: column;
                width: 100%;
                margin: 0px 0px 10px 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
            }

          .contact .contents form .item.double {
                flex-direction: row;
                gap:10px;
                justify-content: space-between;
            }


                .contact .contents form .item input, textarea {
                    border-radius: 10px;
                    border: none;
                    border: 1px solid var(--royal-blue);
                    color: var(--black);
                    padding: 18px;
                    width: calc(100% - 36px);
                    text-align: left;
                    font-weight: 400;
                    font-size: 1rem;
                    font-family: "Montserrat", sans-serif;
                }

                .contact .contents form .item button {
                    border-radius: 10px;
                    border: none;
                    background: var(--gold);
                    color: var(--white);
                    padding: 18px;
                    width: 100%;
                    margin: 10px 0px 0px 0px;
                    text-align: center;
                    font-weight: 600;
                    font-size: 1rem;
                    max-width:380px;
                }

@media(max-width:849px){
            .contact .contents form .item.double {
                flex-direction: column;
                gap:10px;
                justify-content: space-between;
            }
}

@media(max-width:549px){
  .contact .contents form .item input {
     width:calc(100% - 36px); 
  }  
}

/*#endregion*/

/*#region Footer Promo */

.footer-promo {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 20px 0px 20px;
    padding: 0px;
    justify-content: flex-start;
    align-items: center;
}

    .footer-promo .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0px;
        padding: 20px;
        justify-content: flex-start;
        align-items: center;
        max-width: var(--page-width);
    }

        .footer-promo .contents ul {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 100%;
            margin: 0px;
            padding: 0px;
            justify-content: space-between;
            align-items: center;
            gap: 20px;
            list-style-type: none;
            max-width:1000px;
        }

            .footer-promo .contents ul li {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(33.3% - 20px);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                border-radius: 20px;
                overflow: hidden;
            }

            .footer-promo .contents ul li:before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: linear-gradient(to bottom right,rgba(19,9,68,0.9) 0%,rgba(19,9,68,0.6) 40%,rgba(19,9,68,0) 70%);
                pointer-events: none;
                z-index:1;
            }

                .footer-promo .contents ul li p {
                    position: absolute;
                    display: flex;
                    margin: 0px 0px 0px 20px;
                    padding: 0px;
                    color: var(--white);
                    font-weight: 600;
                    top: 20px;
                    z-index:2;
                }


                .footer-promo .contents ul li span {
                    position: absolute;
                    display: flex;
                    margin: 0px 0px 0px 20px;
                    padding: 0px;
                    color: var(--gold);
                    font-weight: 600;
                    top: 50px;
                    font-family:signature;
                    font-size: 3.5em;
                    z-index:2;
                }

                .footer-promo .contents ul li a {
                    display:flex;
                    width:100%;
                    max-width:100%;
                }

                .footer-promo .contents ul li a img {
                    width:100%;
                    max-width:100%;
                }

@media (max-width: 949px) {
    .footer-promo .contents ul {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        cursor: grab;
    }
    .footer-promo .contents ul li {
          flex: 0 0 calc(50% - 20px);
    }
}

@media (max-width: 649px) {
    .footer-promo .contents ul li span {
          font-size:3em;
    }
}

@media (max-width: 549px) {
    .footer-promo .contents ul li {
          flex: 0 0 calc(100%);
    }
}

@media (max-width: 449px) {
    .footer-promo .contents ul li span {
          font-size:2.5em;
    }
}


/*#endregion*/

/*#region Footer Promo 2 */

.footer-promo-2 {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 20px;
    padding: 0px;
    justify-content: flex-start;
    align-items: center;
}

    .footer-promo-2 .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0px;
        padding: 20px;
        justify-content: flex-start;
        align-items: center;
        max-width: var(--page-width);
    }

        .footer-promo-2 .contents h2 {
            max-width: 720px;
            text-align: center;
        }

        .footer-promo-2 .contents p {
            max-width: 720px;
            text-align: center;
        }

        .footer-promo-2 .contents ul {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 100%;
            margin: 0px;
            padding: 0px;
            justify-content: center;
            align-items: center;
            gap: 20px;
            list-style-type: none;
        }

            .footer-promo-2 .contents ul li {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(33% - 20px);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: center;
                background: var(--royal-blue);
                border-radius: 20px;
                overflow: hidden;
                min-height: 400px;
                max-width:280px;
                max-height: 400px;
            }

              .footer-promo-2 .contents ul li:before {
                  content: "";
                  position: absolute;
                  top: 0;
                  left: 0;
                  width: 100%;
                  height: 100%;
                  background: linear-gradient(to top,rgba(19,9,68,1) 0%,rgba(19,9,68,0.4) 40%,rgba(19,9,68,0) 90%);
                  pointer-events: none;
                  z-index:1;
              }

                .footer-promo-2 .contents ul li a {
                    max-height: 400px;
                    max-width: 100%;
                }

                .footer-promo-2 .contents ul li a img {
                    height: 100%;
                    min-height: 400px;
                    display: flex;
                    max-height: 400px;
                }

                .footer-promo-2 .contents ul li p {
                    position: absolute;
                    display: flex;
                    margin: 0px;
                    padding: 0px;
                    color: var(--white);
                    font-weight: 600;
                    bottom: 20px;
                    z-index:2;
                }

@media(max-width:770px){
  .footer-promo-2 .contents ul {
    flex-wrap:nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    cursor: grab;
    justify-content: flex-start;
  }
  .footer-promo-2 .contents ul::-webkit-scrollbar {
    display: none;
  }
  .footer-promo-2 .contents ul li {
    width: calc(50% - 20px);
    scroll-snap-align: start;
    scroll-snap-type: x proximity;
    overflow:unset;
    max-width:unset;
  }  
  .footer-promo-2 .contents ul li a {
    overflow:hidden;
  }
}

@media(max-width:570px){
  .footer-promo-2 .contents ul li {
                width: calc(100%);
            }
}


/*#endregion*/

/*#region Try Our */

body.modal:before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background:rgba(245,250,255,0.75);
  z-index:99998;
}

.modal-try {
    display: none;
    position: fixed;
    top: 15vh;
    align-self: center;
    justify-self: center;
    width: calc(90vw - 60px);
    max-width: 520px;
    z-index: 99999;
    left: 50%;
    transform: translateX(-50%);
    flex-direction: column;
    background: var(--white);
    border-radius: 20px;
    box-shadow: 0px 0px 25px rgba(0, 50, 100, 0.25);
    padding: 30px;
    max-height: calc(70vh - 60px);
}

body.modal .modal-try {
  display:flex;
}

.modal-try .button-blue {
  width:calc(100% - 60px); 
  margin-top:20px;
}

.modal-try .product-grid {
    width: calc(100%);
    margin: 20px 0px;
    padding: 0px;
}

.modal-try .product-grid .contents {
    overflow: hidden;
}

.modal-try .product-grid .contents .products {
  margin:0px;
  max-height:calc(70vh - 240px);
  overflow-y:auto;

  /* Firefox */
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.5) transparent;
}

/* WebKit browsers */
.modal-try .product-grid .contents .products::-webkit-scrollbar {
    width: 6px; /* Adjust the width as needed */
}

.modal-try .product-grid .contents .products::-webkit-scrollbar-track {
    background: transparent; /* Optional: style the track */
}

.modal-try .product-grid .contents .products::-webkit-scrollbar-thumb {
    background-color: var(--royal-blue); /* Customize the thumb color */
    border-radius: 3px; /* Optional: round the edges */
}

.modal-try .product-grid .contents .products ul {
  flex-direction:column;
  max-width:calc(100% - 20px);
}

.modal-try .product-grid .contents .products ul li {
  flex-direction:row;
  width: 100%;
  background:unset;
  align-items: center;
}

.modal-try .product-grid .contents .products ul li .image {
    border-radius: 10px;
    overflow: hidden;
    width:120px;
}

.modal-try .product-grid .contents .products ul li .image a {
    display:flex;
}

.modal-try .product-grid .contents .products ul li .info {
  flex-direction:column;
  padding:0px 15px;
  height:100px;
  width:calc(100% - 280px);
}

.modal-try .product-grid .contents .products ul li .info h3 {
  padding: 5px 0px;
  font-size:0.95rem;
}

.modal-try .product-grid .contents .products ul li .price  {
  height:100px;
  width:120px;
  display: flex;
  flex-direction:column;
  align-items:flex-end;
}

.modal-try .product-grid .contents .products ul li .price > span {
                            position: relative;
                            display: flex;
                            margin: 0px;
                            padding: 0px;
                            font-size: 1.15rem;
                            font-weight: var(--h3w)
                        }

                           .modal-try .product-grid .contents .products ul li .price > span > span {
                                position: absolute;
                                top: 4px;
                                left: -12px;
                                font-size: 0.70rem;
                            }

.modal-try .product-grid .contents .products ul li .action {
  width:unset;
  padding:0px;
  margin-top:20px;
}


/*#endregion*/

/*#region Footer */

.footer {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px 0px 0px;
    padding: 0px 20px 60px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .footer .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 100%;
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
        gap: 10px;
    }

        .footer .contents .logo {
            position: relative;
            display: flex;
            flex-direction: column;
            margin: 0px;
            padding: 0px;
            width: calc(20% - 10px);
            justify-content: flex-start;
            align-items: flex-start;
        }

            .footer .contents .logo img {
                width: 160px;
            }

        .footer .contents .navigation-1, .footer .contents .navigation-2, .footer .contents .navigation-3, .footer .contents .social {
            position: relative;
            display: flex;
            flex-direction: column;
            margin: 0px;
            padding: 0px;
            width: calc(20% - 10px);
            justify-content: flex-start;
            align-items: flex-start;
        }

            .footer .contents .navigation-1 p, .footer .contents .navigation-2 p, .footer .contents .navigation-3 p, .footer .contents .social p {
                font-weight: 700;
                margin: 0px 0px 10px 0px;
                padding: 0px;
            }

            .footer .contents .navigation-1 ul, .footer .contents .navigation-2 ul, .footer .contents .navigation-3 ul {
                position: relative;
                display: flex;
                flex-direction: column;
                margin: 0px;
                padding: 0px;
                width: 100%;
                list-style-type: none;
            }

                .footer .contents .navigation-1 ul li, .footer .contents .navigation-2 ul li, .footer .contents .navigation-3 ul li {
                    padding: 2px 0px;
                }

                    .footer .contents .navigation-1 ul li a, .footer .contents .navigation-2 ul li a, .footer .contents .navigation-3 ul li a {
                        font-weight: 600;
                        font-size: var(--font-smaller);
                        color: var(--dark);
                    }

            .footer .contents .social p {
            }

            .footer .contents .social ul {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 0px;
                width: 100%;
                justify-content: flex-start;
                align-items: flex-start;
                flex-wrap: nowrap;
                list-style-type: none;
                gap: 10px;
            }

                .footer .contents .social ul li {
                    position: relative;
                    display: flex;
                    flex-direction: row;
                    margin: 0px;
                    padding: 0px;
                }

                    .footer .contents .social ul li a {
                    }

                        .footer .contents .social ul li a img {
                        }

@media(max-width:949px){
  .footer .contents {
    flex-wrap:wrap;
  }

  .footer .contents .navigation-1, .footer .contents .navigation-2, .footer .contents .navigation-3 {
    width:calc(25% - 10px);
  }
  
  .footer .contents .social {
    width:100%;
    align-items:center;
  }
  .footer .contents .social ul {
    width:unset;
  }
}

@media(max-width:849px){
  
  .footer .contents .navigation-1, .footer .contents .navigation-2, .footer .contents .navigation-3 {
    width:calc(33.3% - 10px);
    align-items:center;
  }

  .footer .contents .navigation-1 ul, .footer .contents .navigation-2 ul, .footer .contents .navigation-3 ul {
    align-items:center;
  }
  
  .footer .contents .logo {
    width:100%;
    align-items:center;
  }

}

@media(max-width:599px){

  .footer .contents .navigation-1, .footer .contents .navigation-2, .footer .contents .navigation-3, .footer .contents .social {
    width:calc(50% - 10px);
  }

}

@media(max-width:499px){

  .footer .contents .navigation-1, .footer .contents .navigation-2, .footer .contents .navigation-3, .footer .contents .social {
    width:100%;
  }

}

/*#endregion*/

/*#region Copyright */

.copyright {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0px;
    padding: 30px 0px;
    justify-content: flex-start;
    align-items: center;
    background: var(--royal-blue);
    overflow: hidden;
}

    /*.copyright:before {
        content: "";
        display: block;
        width: 390px;
        height: 210px;
        background-image: url('https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-icon-grid-2.svg');
        background-size: cover;
        background-position: left;
        position: absolute;
        top: 0;
        right: 0;
    }*/

    .copyright .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: calc(100% - 40px);
        min-height: 140px;
        margin: 0px;
        padding: 0px 20px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .copyright .contents p {
            color: var(--white);
            font-weight: 500;
            max-width:600px;
        }

        .copyright .contents p a {
            color: var(--white);
        }

/*#endregion*/

/*#region Cart Hero */

.cart-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 0px 0px 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
    background:var(--royal-blue);
    overflow:hidden;
    margin-top:113px;
}

/*.cart-hero:before {
    content: "";
    display: block;
    width: 390px;
    height: 210px;
    background-image: url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-icon-grid-2.svg);
    background-size: cover;
    background-position: left;
    position: absolute;
    top: 0;
    right: 0;
}*/

    .cart-hero .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        height: 200px;
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .cart-hero .contents h1 {
          font-weight:400;
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:130%;
          max-width:580px;
        }
        
            .cart-hero .contents h1 span {
              font-weight:700;
              font-size:unset;
              padding:0px;
              margin:0px;
              line-height:130%;
            }

      .cart-hero .contents p {
          font-size:var(--h3);
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:100%;
        }

/*#endregion */

/*#region Cart */

.cart {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .cart .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: space-between;
        align-items: flex-start;
        max-width: var(--page-width);
        gap:40px;
    }

        .cart .contents .left {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(60% - 40px);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                flex: 0 0 calc(60% - 40px);
        }

        .cart .contents .left .header {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 100%;
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
        }           

        .cart .contents .left .products {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            margin: 20px 0px 0px 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
        }

            .cart .contents .left .products ul {
                position: relative;
                display: flex;
                flex-direction: row;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                list-style-type: none;
                gap: 20px;
                flex-wrap: wrap;
                width: 100%;
                opacity:1;
                transition:opacity 1s ease-in-out;
            }

            .cart .contents .left .products ul.updating {
                opacity:0;
            }

                .cart .contents .left .products ul li {
                    position: relative;
                    display: flex;
                    flex-direction: column;
                    margin: 0px;
                    padding: 0px;
                    justify-content: space-between;
                    align-items: center;
                    width: calc(33.3% - 20px);
                    background: var(--pale-blue-faded);
                }

                    .cart .contents .left .products ul li .image {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 0px;
                        width: 100%;
                    }

                        .cart .contents .left .products ul li .image .discount {
                            position: absolute;
                            display: flex;
                            flex-direction: column;
                            margin: 0px;
                            padding: 20px;
                            width: 40px;
                            height: 40px;
                            left: 10px;
                            top: 10px;
                            border-radius: 50%;
                            background: var(--gold);
                            color: var(--white);
                            font-weight: 600;
                            justify-content: center;
                            align-items: center;
                            font-size: 1.3em;
                            font-weight: 800;
                            text-align: center;
                            line-height: 100%;
                        }

                        .cart .contents .left .products ul li .image img {
                            width: 100%;
                            max-width: 100%;
                            min-width: 100%;
                        }

                    .cart .contents .left .products ul li .info {
                        position: relative;
                        display: flex;
                        flex-direction: row;
                        margin: 0px;
                        padding: 15px 15px 0px 15px;
                        justify-content: space-between;
                        align-items: flex-start;
                        width: calc(100% - 30px);
                        min-height: 65px;
                    }

                        .cart .contents .left .products ul li .info h3 {
                            padding: 0px 40px 0px 0px;
                            font-size: 1rem;
                        }

                        .cart .contents .left .products ul li .info > span {
                            position: relative;
                            display: flex;
                            margin: 0px;
                            padding: 0px;
                            font-size: 1.2rem;
                            font-weight: var(--h3w)
                        }

                            .cart .contents .left .products ul li .info > span > span {
                                position: absolute;
                                top: 4px;
                                left: -12px;
                                font-size: 0.75rem;
                            }

                    .cart .contents .left .products ul li .detail {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 15px 15px 20px 15px;
                        justify-content: flex-start;
                        align-items: flex-start;
                        width: calc(100% - 30px);
                    }

                        .cart .contents .left .products ul li .detail ul {
                            position: relative;
                            display: flex;
                            flex-direction: row;
                            margin: 0px;
                            padding: 0px;
                            justify-content: space-between;
                            align-items: center;
                            width: 100%;
                            gap: 5px;
                            list-style-type: none;
                        }

                            .cart .contents .left .products ul li .detail ul li {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 0px;
                                justify-content: center;
                                align-items: center;
                                font-size: var(--font-smaller);
                                width: calc(19% - 5px);
                                background: unset;
                            }

                                .cart .contents .left .products ul li .detail ul li sub {
                                    font-size: 9px;
                                    font-weight: 600;
                                    line-height:100%;
                                }

                                .cart .contents .left .products ul li .detail ul li:last-of-type {
                                    align-items: flex-end;
                                }

                                .cart .contents .left .products ul li .detail ul li:first-of-type {
                                    align-items: flex-start;
                                    width: calc(24% - 5px);
                                }


                    .cart .contents .left .products ul li .action {
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        margin: 0px;
                        padding: 10px 0px 40px 0px;
                        justify-content: center;
                        align-items: center;
                        width: 100%;
                    }

                        .cart .contents .left .products ul li .action ul {
                            position: relative;
                            display: flex;
                            flex-direction: row;
                            margin: 0px;
                            padding: 0px;
                            justify-content: flex-start;
                            align-items: center;
                            gap: 20px;
                            flex-wrap: nowrap;
                            width: unset;
                            list-style-type: none;
                        }

                            .cart .contents .left .products ul li .action ul li {
                                position: relative;
                                display: flex;
                                flex-direction: column;
                                margin: 0px;
                                padding: 0px;
                                justify-content: center;
                                align-items: center;
                                width: unset;
                                background: unset;
                                cursor: pointer;
                            }

                                .cart .contents .left .products ul li .action ul li .minus {
                                    position: relative;
                                    display: flex;
                                    flex-direction: column;
                                    margin: 0px;
                                    padding: 8px;
                                    width: 24px;
                                    height: 24px;
                                    justify-content: center;
                                    align-items: center;
                                    background: var(--pale-blue);
                                    border-radius: 20px;
                                }

                                .cart .contents .left .products ul li .action ul li .plus {
                                    position: relative;
                                    display: flex;
                                    flex-direction: column;
                                    margin: 0px;
                                    padding: 8px;
                                    width: 24px;
                                    height: 24px;
                                    justify-content: center;
                                    align-items: center;
                                    background: var(--royal-blue);
                                    border-radius: 20px;
                                }

                                .cart .contents .left .products ul li .action ul li div img {
                                    width: 16px;
                                    min-width: 16px;
                                    max-width: 16px;
                                }

        .cart .contents .right {
            position: relative;
            display: flex;
            flex-direction: column;
            width: calc(40% - 20px);
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: flex-start;
        }

             .cart .contents .right h3:not(:first-of-type) {
                 margin-top:70px;
             }

            .cart .contents .right div.form-group {
                position: relative;
                display: flex;
                flex-direction: row;
                width: 100%;
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                gap:20px;
                flex-wrap:nowrap;
            }

                .cart .contents .right div.form-group input {
                    padding:14px 24px;
                    border-radius:10px;
                    background:var(--pale-blue-faded);
                    font-weight:600;
                    color:var(--black);
                    border:none;
                    width:calc(50% - 20px);
                }

                .cart .contents .right div.form-group textarea {
                    padding:14px 24px;
                    border-radius:10px;
                    background:var(--pale-blue-faded);
                    font-weight:600;
                    color:var(--black);
                    border:none;
                    width: calc(100% - 48px);
                    height:120px;
                }

                .cart .contents .right div.form-group:first-of-type input {
                    font-size:1.4em;
                }

                .cart .contents .right div.form-group button {
                    padding:18px 24px;
                    border-radius:10px;
                    background:var(--gold);
                    font-weight:600;
                    color:var(--white);
                    border:none;
                    width:calc(50% - 20px);
                    font-size:1.1em;
                    cursor:pointer;
                }

            .cart .contents .right .sub-totals {
                  display:flex;
                  flex-direction:column;
                  position:relative;
                  margin:70px 0px 0px 0px;
                  padding:0px;
                  justify-content:flex-start;
                  align-items:flex-start;
                  flex-wrap:nowrap;
                  width:100%;
                  gap:1px;
            }

            .cart .contents .right .sub-totals li {
                  display:flex;
                  flex-direction:row;
                  position:relative;
                  margin:0px;
                  padding:16px;
                  justify-content:space-between;
                  align-items:center;
                  flex-wrap:nowrap;
                  width:calc(100% - 32px);
                  background:var(--pale-blue);
            }

            .cart .contents .right .sub-totals li span {
                font-weight:600;
            }

                .cart .contents .right > a {
                    padding:16px;
                    width:calc(100% - 32px);
                    background:var(--royal-blue);
                    color:var(--white);
                    border-radius:0px 0px 10px 10px;
                    margin:0px 0px 0px 0px;
                    border:none;
                    font-weight:600;
                    cursor:pointer;
                    text-align:center;
                }

                .cart .contents .right > a:hover {
                    background:var(--gold);
                    color:var(--white);
                }

                .cart .contents .right > a.warning {
                  background:rgba(240,40,70,1);
                }

                .cart .contents .right #cart_available_days {
                  display:flex;
                  position:relative;
                  width:100%;
                  flex-direction:column;
                  margin:20px 0px 0px 0px;
                  padding:0px;
                  justify-content:flex-start;
                  align-items:flex-start;
                }

                .cart .contents .right #cart_available_days label {
                  display:flex;
                  position:relative;
                  width:100%;
                  flex-direction:column;
                  margin:20px 0px 0px 0px;
                  padding:0px;
                  justify-content:flex-start;
                  align-items:flex-start;
                  
                }
                
                .cart .contents .right #cart_available_days.active label {
                    border:1px solid var(--royal-blue);
                    padding:20px;
                    border-radius:10px;
                    width:calc(100% - 40px);
                }

                .cart .contents .right #cart_available_days.active label:before {
                    content: "";
                            display: block;
                            width: 16px;
                            height: 16px;
                            background-image: url('https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-right-arrow-thin-icon.svg');
                            background-size: cover;
                            background-position: center;
                            position: absolute;
                            top: 26px;
                            right: 20px;
                }

                .cart .contents .right #cart_available_days ul {
                  display:flex;
                  position:absolute;
                  width:100%;
                  flex-direction:column;
                  margin:20px 0px 0px 0px;
                  padding:0px;
                  justify-content:flex-start;
                  align-items:flex-start;
                  display:none;
                  list-style-type:none;
                  background: var(--white);
                  border:1px solid var(--royal-blue);
                  border-radius: 10px;
                  z-index: 5;
                }

                .cart .contents .right #cart_available_days ul.active {
                  display:flex;
                }

                .cart .contents .right #cart_available_days ul li {
                  display:flex;
                  position:relative;
                  width:calc(100%- 40px);
                  flex-direction:column;
                  margin:0px;
                  padding:12px 20px;
                  justify-content:flex-start;
                  align-items:flex-start;
                  cursor:pointer;
                }
@media(max-width:1399px){
  .cart .contents .right div.form-group {
    flex-direction:column;
  }
  .cart .contents .right div.form-group input {
    width:calc(100% - 48px);
  }
  .cart .contents .right div.form-group button {
    width:calc(100%);
  }
  .cart .contents .left .products ul li {
    width:calc(50% - 20px)
  }
}

@media(max-width:999px){
  .cart .contents {
    gap:20px;
  }
    .cart .contents .left {
        flex: 0 0 calc(60% - 20px);
        width: calc(60% - 20px);
  }
  .cart .contents .right {
        flex: 0 0 calc(40% - 20px);
        width: calc(40% - 20px);
  }  
}

@media(max-width:849px){
  .cart .contents {
    gap:0px;
    row-gap:20px;
    flex-direction:column;
  }
    .cart .contents .left {
        flex: 0 0 calc(100%);
        width: calc(100%);
  }
  .cart .contents .right {
        flex: 0 0 calc(100%);
        width: calc(100%);
        padding-top:40px;
        margin-top:40px;
        border-top:1px solid var(--royal-blue);
  }  
}

@media(max-width:549px){
  .cart .contents .left .products ul {
    gap:0px;
    row-gap:20px;
  }
  .cart .contents .left .products ul li {
    width:100%;
  }
}
/*#endregion */

/*#region Page */

.page {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px 120px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .page .contents {
        position: relative;
        display: flex;
        flex-direction: row;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
        max-width: var(--page-width);
        gap:40px;
    }

        .page .contents .form {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100%);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                max-width:520px;
        }

        .page .contents .form form {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100%);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
        }

            .page .contents .form form input {
                margin:10px 0px 0px 0px;
                padding:16px;
                width:calc(100% - 32px);
                border:none;
                border-radius:10px;
                background:var(--pale-blue-faded);
                color:var(--black);
                font-size:1em;
            }

            .page .contents .form form button {
                margin:10px 0px 0px 0px;
                padding:16px;
                width:calc(100%);
                border:none;
                border-radius:10px;
                background:var(--gold);
                color:var(--white);
                font-weight:600;
                font-size:1em;
                cursor:pointer;
            }

.page .contents .form form a {
    margin:0px 0px;
    font-weight:400;
    color:var(--black);
}

.page .contents .form form > a:first-of-type {
    margin-top:20px;
    font-weight:400;
    color:var(--black);
}

/*#endregion 

/*#region Page Promo Hero */

.page-promo-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 0px 0px 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
    background:var(--royal-blue);
    overflow:hidden;
}

/*.page-promo-hero:before {
    content: "";
    display: block;
    width: 390px;
    height: 210px;
    background-image: url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-icon-grid-2.svg);
    background-size: cover;
    background-position: left;
    position: absolute;
    top: 0;
    right: 0;
}*/

    .page-promo-hero .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        height: 200px;
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .page-promo-hero .contents h1 {
          font-weight:400;
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:130%;
          max-width:580px;
        }
        
            .page-promo-hero .contents h1 span {
              font-weight:700;
              font-size:unset;
              padding:0px;
              margin:0px;
              line-height:130%;
            }

      .page-promo-hero .contents p {
          font-size:var(--h3);
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:100%;
        }

/*#endregion */

/*#region Page - Promo */

.page-promo {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px 120px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

    .page-promo .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: center;
        max-width: var(--page-width);
        gap:40px;
    }

    .page-promo .contents .promo-content {
            position: relative;
            display: flex;
            flex-direction: column;
            width: calc(100%);
            margin: 0px;
            padding: 0px;
            justify-content: center;
            align-items: center;
        }
    
          .page-promo .contents .promo-content .header {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100%);
                margin: 0px;
                padding: 0px;
                justify-content: center;
                align-items: center;
            }

              .page-promo .contents .promo-content .header h1 {
                    text-align:center;
              }

          .page-promo .contents .promo-content > img {
                width:100%;
                max-width:460px;
                margin-top:30px;
            }

          .page-promo .contents .promo-content .promo-text {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100%);
                margin: 0px;
                padding: 0px;
                justify-content: center;
                align-items: center;
                text-align:center;
                max-width:720px;
            }


        .page-promo .contents .form {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100%);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
                max-width:520px;
        }

        .page-promo .contents .form form {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100%);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
        }

            .page-promo .contents .form form div {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100%);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
            }

            .page-promo .contents .form form input {
                margin:10px 0px 0px 0px;
                padding:16px;
                width:calc(100% - 32px);
                border:none;
                border-radius:10px;
                background:var(--pale-blue);
                color:var(--black);
                font-weight: 300;
                font-size: 1.1em;
            }

            .page-promo .contents .form form button {
                margin:10px 0px 0px 0px;
                padding:16px;
                width:calc(100%);
                border:none;
                border-radius:10px;
                background:var(--gold);
                color:var(--white);
                font-weight:500;
                font-size:1em;
            }

          .page-promo .contents .form form h2 {
                text-align:center;
            }

.page-promo .contents .form form a {
    margin:0px 0px;
    font-weight:400;
    color:var(--black);
}

.page-promo .contents .form form > a:first-of-type {
    margin-top:20px;
    font-weight:400;
    color:var(--black);
}

/*#endregion */

/*#region Page Hero */

.page-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 0px 0px 90px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
    background:var(--royal-blue);
    overflow:hidden;
        margin-top:113px;
}

/*.page-hero:before {
    content: "";
    display: block;
    width: 390px;
    height: 210px;
    background-image: url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/yes-chef-icon-grid-2.svg);
    background-size: cover;
    background-position: left;
    position: absolute;
    top: 0;
    right: 0;
}*/

    .page-hero .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        height: 200px;
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: flex-start;
        max-width: var(--page-width);
    }

        .page-hero .contents h1 {
          font-weight:400;
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:130%;
          max-width:580px;
        }
        
            .page-hero .contents h1 span {
              font-weight:700;
              font-size:unset;
              padding:0px;
              margin:0px;
              line-height:130%;
            }

      .page-hero .contents p {
          font-size:var(--h3);
          color:var(--white);
          padding:0px;
          margin:0px;
          line-height:100%;
        }

/*#endregion */

/*#region Page Content */

.page-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin: 90px 0px 120px 0px;
    padding: 0px 20px;
    justify-content: flex-start;
    align-items: center;
}

.page-content.full {
    width: calc(100%);
    padding: 0px;
}

    .page-content .contents {
        position: relative;
        display: flex;
        flex-direction: column;
        width: calc(100%);
        margin: 0px;
        padding: 0px;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: var(--page-width);
        gap:40px;
    }

    .page-content.full .contents {
      width: calc(100%);
      max-width: unset;
      background:var(--royal-blue);
    }

        .page-content .contents .page-body {
            position: relative;
            display: flex;
            flex-direction: row;
            width: calc(100%);
            margin: 0px;
            padding: 0px;
            justify-content: flex-start;
            align-items: center;
            max-width: var(--page-width);
            gap:40px;
            flex-wrap:wrap;
        }

        .page-content.full .contents .page-body {
            max-width: unset;
            justify-content: space-between;
            align-items:stretch;
        }

        .page-content .contents .page-body .page-block {
            display:flex;
            flex-direction:row;
            justify-content:flex-start;
            align-items:center;
            margin:0px;
            padding:40px 0px;
            width:100%;  
            gap:40px;
        }

          .page-content .contents .page-body .page-block:nth-of-type(1) {
              background:var(--pale-blue-faded);
              padding:30px;
              border-radius:20px;
          }

          .page-content .contents .page-body .page-block:nth-of-type(1) img {
              border-radius:30px;
          }

          .page-content .contents .page-body .page-block:nth-of-type(2), .page-content .contents .page-body .page-block:nth-of-type(4) {
              padding:80px 0px;
          }

          .page-content .contents .page-body .page-block:nth-of-type(3) {
              border:1px solid var(--royal-blue);
              border-radius:30px;
              padding:30px;
          }

          .page-content .contents .page-body .page-block:nth-of-type(3) img {
              border-radius:30px;
          }

          .page-content .contents .page-body .page-block:nth-of-type(5) {
              background:var(--creame);
              padding:0px 30px;
          }



            .page-content .contents .page-body .text-block {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(50% - 40px);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
            }

            .page-content.full .contents .page-body .text-block {
                align-items:flex-end;
                padding:0px 20px;
                width:calc(50% - 80px);
            }

            .page-content.full .contents .page-body .text-block .constrained {
                max-width:640px;
                justify-content:column;
                width:100%;
                padding:60px 0px;
            }

            .page-content.full .contents .page-body .text-block .constrained ul {
                list-style-type:none;
                position:relative;
                display:flex;
                flex-direction:row;
                flex-wrap:wrap;
                margin:20px 0px;
                padding:0px;
                gap:20px;
            }

            .page-content.full .contents .page-body .text-block .constrained ul li {
                display:flex;
            }

            .page-content.full .contents .page-body .text-block .constrained ul li a {
                border-radius:20px;
                background:var(--gold);
                color:var(--white);
                padding:10px 30px; 
                font-weight:600;
            }

            .page-content.full .contents .page-body .text-block .constrained h2, .page-content.full .contents .page-body .text-block .constrained p {
                color:var(--white);
            }

            .page-content .contents .page-body .text-block.full-width {
                width:calc(100% - 40px);
                justify-content: flex-start;
                align-items: center;
            }

          .page-content .contents .page-body .text-block.full-width h2, .page-content .contents .page-body .text-block.full-width p {
                text-align:center;
                max-width:720px;
              
            }

            .page-content .contents .page-body .text-block-full {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(100% - 40px);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
            }

            .page-content .contents .page-body .image-block {
                position: relative;
                display: flex;
                flex-direction: column;
                width: calc(50% - 40px);
                margin: 0px;
                padding: 0px;
                justify-content: flex-start;
                align-items: flex-start;
            }

       .page-content .contents .page-body .page-block .image-block {
              justify-content: center;
              align-items: center;
        }

                .page-content.full .contents .page-body .image-block {
                    align-items: flex-end;
                    width: calc(50%);
                }

      .page-content .contents .page-body .page-block:nth-of-type(3) .image-block {
        justify-content: center;
                align-items: flex-start;
      }

       .page-content .contents .page-body .page-block .image-block img {
            max-width:70%;
        }

 .page-content.full .contents .page-body .image-block img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

.page-content.full .contents .page-body .image-block::after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: -5px;
    width: 190px;
    height: 100%;
    background-image: url('http://yeschefmeals.com.au/cdn/shop/t/3/assets/yeschefmeals-swirl.svg');
    background-size: cover;
    background-repeat: no-repeat;
    pointer-events: none;
}

@media(max-width:1150px) {

            .page-content .contents .page-body {
                gap:0px;
                row-gap:40px;
            }
  
            .page-content .contents .page-body .text-block {
                width: calc(100%);
            }

            .page-content .contents .page-body .image-block {
                width: calc(100%);
            }
}

@media(max-width:990px){
  .page-content.full .contents .page-body {
            flex-direction:column;
        }

  .page-content.full .contents .page-body .text-block {
    width:calc(100% - 80px);
  }

  .page-content.full .contents .page-body .image-block {
      align-items: center;
      width: calc(100%);
  }  

    .page-content.full .contents .page-body .image-block img {
      width:100%;
  }  

  .page-content .contents .page-body .page-block:nth-of-type(1){
         padding: 40px;
      flex-direction: column;
      justify-content: flex-start;
  }
  .page-content .contents .page-body .page-block:nth-of-type(3){
         padding: 40px;
      flex-direction: column;
      justify-content: center;
      text-align: center; 
  }
  .page-content .contents .page-body .page-block:nth-of-type(3) .image-block {
    align-items:center;
  }
  .page-content .contents .page-body .page-block:nth-of-type(5) {
      padding: 40px;
      flex-direction: column;
      justify-content: center;
      text-align: center;
  }
  .page-content .contents .page-body .page-block .text-block {
    align-items:center;
  }
}

/*#endregion */

/*#region Announcement */

.announcement {
  display:flex;
  flex-direction:column;
  margin:0px;
  padding:0px;
  width:100%;
  background:var(--gold);
  justify-content:center;
  align-items:center;
}

.announcement ul {
  display:flex;
  list-style-type:none;
  flex-direction:column;
  margin:0px;
  padding:0px;
  width:90%;
  justify-content:center;
  align-items:center;
}

.announcement ul li {
  display:flex;
  flex-direction:column;
  margin:0px;
  padding:15px;
  width:100%;
  color:var(--white);
  font-size:1em;
  font-weight:600;
  justify-content:center;
  align-items:center;
  text-align:center;
}

@media(max-width:849px){
  .announcement ul li {
    font-size:0.95em;
    font-weight:500;
  }
}

/*#end region */

/*#region Side By Side */

.side-by-side {
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  width:100%;
}

.side-by-side .left{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  margin:0px;
  padding:0px;
  width:60%;
}

.side-by-side .right{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  margin:0px;
  padding:0px;
  flex: 0 1 40%;
}

@media(max-width:890px){
  .side-by-side {
    flex-direction:column;
    justify-content:flex-start;
  }
  
  .side-by-side .left{
    width:100%;
  }
  
  .side-by-side .right{
    width:100%;
  }
}

/*#region stockists */

.stockist_locator {
  display:flex;
  flex-direction:row;
  justify-content:flex-start;
  align-items:flex-start;
  margin:0px;
  padding:0px;
  width:100%;
  height:600px;
  gap:20px;

}

.stockist_locator .find {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:center;
  margin:0px;
  padding:20px;
  width:35%;
    background: var(--royal-blue);
}

.stockist_locator .find p {
  width:100%;
  text-align:left;
  color:var(--white);
}

.stockist_locator .find p a {
  color:var(--white);
  font-weight:600;
}

.stockist_locator .map_container {
  position:relative;
  display:flex;
  flex-direction:column;
  margin:0px;
  padding:0px;
  height:100%;
  flex: 1 1 100%;
  border:1px solid var(--royal-blue);
}

.stockist_locator .map_container #map {
  height:100%;
  width:100%;
}

.stockist_locator input {
      padding: 15px;
    font-size: 1.5em;
    border: 1px solid var(--royal-blue);
    color: var(--royal-blue);
    font-weight: 600;
  border-radius: 10px;
  width:calc(100% - 30px);
}

.stockist_locator button {
      margin: 20px 0px;
    padding: 20px;
    border: none;
    background: var(--gold);
    color: var(--white);
    font-weight: 600;
    font-size: 1em;
    border-radius: 10px;
    width:calc(100%);
  cursor:pointer;
}

.stockist_locator .map-results{
	position:relative;
	display:flex;
	width:100%;
	height:100%;
	max-height:320px;
	overflow-y:scroll;
	margin:20px 0px 0px 0px;
    visibility:hidden;
    opacity:0;
    transition:all ease-in-out 0.25s;
}

.stockist_locator .map-results.active {
	visibility:visible;
    opacity:1;
}

.stockist_locator .map-results::-webkit-scrollbar-track
{
	
	border-radius: 0px;
	background-color: #FFF;
}

.stockist_locator .map-results::-webkit-scrollbar
{
    width: 8px;
}

.stockist_locator .map-results::-webkit-scrollbar-thumb
{
    border-radius: 0px;
	-webkit-box-shadow: inset 0 0 20px rgb(207 184 124);	
}

.stockist_locator .map-results ul.map-scroll {
	display:flex;
	list-style-type:none;
	flex-direction:column;
	padding:0px 20px 20px 0px;
}	

.listing-display {
  position:relative;
  list-style-type:none;
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-items:flex-start;
  margin:0px;
  padding:0px;
  gap:30px;
  flex-wrap:wrap;
}

.listing-display li {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  margin:0px;
  padding:30px;
  width:calc(33% - 90px);
  border:3px solid var(--gold);
}

.listing-display li p:first-of-type() {
  height:60px;
}

.listing-display li p:nth-of-type(2) {
  height:80px;
}


@media(max-width:890px){
  .stockist_locator {
    flex-direction:column;
    gap:20px;
    height:unset;
  }
  
  .stockist_locator .find {
    width:calc(100% - 40px);
  }
  .stockist_locator .map_container {
    width: 100%;
    height:400px;
  }
  .stockist_locator .map_container #map {
    height:400px;
  }

  .listing-display li {
    width:calc(50% - 90px);
  }  
}

@media(max-width:590px){
  .listing-display li {
    width: 100%;
  }  
}

/*#endregion */

/*#region Image Cloud */

ul.image-cloud {
  list-style-type:none;
  position:relative;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  width:80%;
  gap:20px;
  justify-content:center;
  align-items:center;
  margin:0px;
  padding:0px;
}

ul.image-cloud li img {
  width:160px;
}

@media(max-width:749px){
  ul.image-cloud li img {
    width:120px;
  } 
}

/*#endregion */

/*#region faq*/

#faq {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: calc(100% - 40px);
    background: var(--creame);
    border-top: 2px solid var(--white); 
    margin: 0px;
    padding: 60px 20px 90px 20px;
}

    #faq > div {
        display: flex;
        width: 100%;
        max-width: 1200px;
        position: relative;
        flex-direction: column;
        justify-content:center;
        align-items:center;
        text-align:center;
    }


#faq ul.questions {
    list-style-type: none;
    display: flex;
    width: 100%;
    max-width:1200px;
    position: relative;
    flex-direction: column;
    margin-top: 30px;
    padding: 0px;
}

    #faq ul.questions > li {
        display: flex;
        flex-direction: column;
        position: relative;
        width: 100%;
        margin: 0px;
        padding: 0px;
        background: var(--white);
        border-bottom:2px solid var(--creame);
    }

    #faq ul.questions li div.question {
        display: flex;
        flex-direction: row;
        position: relative;
        width: 100%;
        margin: 0px;
        padding: 0px;
        justify-content: center;
        align-items: center;
        cursor: pointer;
    }

        #faq ul.questions li div.question p {
            display: flex;
            width: 80%;
            flex-grow: 1;
            margin: 0px;
            padding: 0px 0px 0px 20px;
            font-weight: 600;
            font-size: 1em;
        }


        #faq ul.questions li div.question ul.toggle {
            list-style-type: none;
            display: flex;
            flex-direction: column;
            width: 60px;
            height: 60px;
            min-width: 40px;
            background: var(--white);
            position: relative;
            justify-content: center;
            align-items: center;
            margin: 0px 0px 0px 0px;
            padding: 0px;
            border: 0px;
        }

            #faq ul.questions li div.question ul.toggle li {
                display: flex;
                width: 26px;
                border-top: 2px solid var(--royal-blue);
                padding: 4px 0px;
                background: var(--white);
                transition: all 0.025s linear;
            }

                #faq ul.questions li div.question ul.toggle li:nth-of-type(2) {
                    transform: rotate(90deg);
                    position: absolute;
                    background: unset;
                    right: 20px;
                    top: 22px;
                }

            #faq ul.questions li div.question ul.toggle.active li:nth-of-type(1) {
                transform: rotate(45deg);
                top: 27px;
                position: absolute;
                right: 19px;
            }

            #faq ul.questions li div.question ul.toggle.active li:nth-of-type(2) {
                transform: rotate(-45deg);
                background: unset;
                top: 27px;
                position: absolute;
                right: 14px;
            }

            #faq ul.questions li div.question ul.toggle li:nth-of-type(3) {
                display: none;
            }

#faq ul.questions li div.response {
    display: flex;
    flex-direction: column;
    height: 1px;
    visibility: hidden;
    opacity: 0;
    transition: all 0.0s linear;
    padding: 0px;
}


    #faq ul.questions li div.response ul {
        margin-top: 10px;
    }


    #faq ul.questions li div.response.active {
        background: var(--white);
        border: 1px solid var(--creame);
        padding: 20px;
    }

    #faq ul.questions li div.response p {
        font-size: 1em;
        max-width: 1180px;
        margin:0px;
    }

    


@media(max-width:1199px) {

    
}

@media(max-width:899px) {
    
}

/*#endregion */

/*#region Blog */

.page-body.blog.article {
  display:flex;
  flex-direction:column;
  align-items:center;
}

.page-body.blog.article article {
  max-width:900px;
}

.blog > h1 {}

.blog > ul {
  position:relative;
  list-style-type:none;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  margin:0px;
  padding:0px;
  justify-content:flex-start;
  align-items:flex-start;
  gap:40px;
}

.blog > ul > li {
  display:flex;
  flex-direction:column;
  margin:0px;
  padding:0px;
  justify-content:flex-start;
  align-items:flex-start;
  width:calc(33% - 40px);
  
}

.blog ul li a {}

.blog ul li a img {
  max-width:100%;
  width:100%;
}

.blog ul li a h2 {
  font-size:1.25rem;
  margin:10px 0px;
  color:var(--royal-blue);
}

.blog ul li p {
  margin:10px 0px;
  max-width:100%;
}

.blog-product-images {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

.blog-product-images li {
  flex: 0 0 calc(33.333% - 1rem);
  box-sizing: border-box;
}

.blog-product-images img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
}

@media (max-width: 999px) {
  .blog-product-images {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;

    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
  }

  .blog-product-images::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
  }

  .blog-product-images li {
    flex: 0 0 calc(50% - 1rem);
    scroll-snap-align: start;
  }

  .blog > ul > li {
    width:calc(50% - 40px); 
  }
}

@media (max-width: 599px) {
  .blog-product-images li {
    flex: 0 0 100%;
  }
  .blog > ul > li {
    width:calc(100%); 
  }
}
/*#end region */

/*#region Account */

.page .contents .account {
  display:flex;
  flex-direction:row;
  justify-content: flex-start;
  align-items:flex-start;
  width:100%;
  margin:0px;
  padding:0px;
  gap:60px;
  min-height:400px;
}

.page .contents .account .customer_sidebar {
  display:flex;
  flex-direction:column;
  justify-content: flex-start;
  align-items:flex-start;
  width:calc(30% - 20px);
  margin:0px;
  padding:0px;
}

.page .contents .account .customer_sidebar .customer_detail {
  display:flex;
  flex-direction:column;
  justify-content: flex-start;
  align-items:flex-start;
  width:100%;
  margin:20px 0px;
  padding:20px 0px;
  border:1px solid var(--royal-blue);
  border-radius:10px;
}

.page .contents .account .customer_sidebar .customer_detail > p {
  margin:10px 20px;
}

.page .contents .account .customer_sidebar .customer_detail > a {
  background:var(--pale-blue-faded);
  padding:10px 30px;
  color:var(--steel);
  font-weight:600;
  margin:0px 20px;
  width:calc(100% - 100px);
  border-radius:10px;
}

.page .contents .account .customer_sidebar .customer_detail .address {
  display:flex;
  flex-direction:column;
  justify-content: flex-start;
  align-items:flex-start;
  width:calc(100% - 40px);
  margin:0px;
  padding:20px;
  background:var(--pale-blue-faded);
}

.page .contents .account .customer_orders  {
  display:flex;
  flex-direction:column;
  justify-content: flex-start;
  align-items:flex-start;
  width:calc(100% - 40px);
  margin:0px;
  padding:0px;
}

.page .contents .account .customer_orders table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
  font-family: sans-serif;
  font-size: 14px;
}

.page .contents .account .customer_orders table thead {
  background-color: var(--gold);
}

.page .contents .account .customer_orders table thead th {
  text-align: left;
  padding: 12px 10px;
  font-weight: bold;
  color:var(--white);
}

.page .contents .account .customer_orders table tbody td {
  padding: 12px 10px;
  color:var(--black);
}

.page .contents .account .customer_orders table tbody tr.odd {
  background-color: var(--pale-blue-faded);
}

.page .contents .account .customer_orders table tbody tr.even {
  background-color: var(--white);
}

.page .contents .account .customer_orders table tbody tr.cancelled_order {
  background-color: #fffAfA;
  text-decoration: line-through;
}

.page .contents .account .customer_orders .status_paid {
  color: var(--green);
  font-weight: bold;
}

.page .contents .account .customer_orders table tbody td .status_pending {
  color: var(--gold);
  font-weight: bold;
}

.page .contents .account .customer_orders table tbody td .status_refunded,
.page .contents .account .customer_orders table tbody td .status_voided {
  color: #c62828;
  font-weight: bold;
}

.page .contents .account .customer_orders table tbody td .status_fulfilled {
  color: var(--green);
  font-weight: bold;
}

.page .contents .account .customer_orders table tbody td .status_unfulfilled {
  color: var(--gold);
  font-weight: bold;
}

.page .contents .account .customer_orders table tbody td .total.money {

}

/*#endregion */

/*#region Customer Orders */

.page .contents .order {
  display:flex;
  flex-direction:column;
  width:100%;
  margin:0px;
  padding:0px;
  justify-content:flex-start;
  align-items:flex-start;
}
.page .contents .order .top {
  display:flex;
  flex-direction:column;
  width:calc(100% - 60px);
  margin:0px 0px 30px 0px;
  padding:30px;
  justify-content:flex-start;
  align-items:flex-start;
  border-radius:10px;
  border:1px solid var(--royal-blue);
}
.page .contents .order .top .dates {
  display:flex;
  flex-direction:row;
  width:100%;
  margin:0px;
  padding:30px 0px 0px 0px;
  justify-content:flex-start;
  align-items:flex-start;
  gap:20px;
}
.page .contents .order .top .dates .order_cancelled {
  background:#FFA9A9;
  padding:5px 10px;
  border-radius:10px;
  color:var(--white)
}
.page .contents .order .top .dates .download_receipt {
  background:var(--pale-blue-faded);
  padding:5px 10px;
  border-radius:10px;
}
.page .contents .order .top .dates .order_placed {
  background:var(--pale-blue-faded);
  padding:5px 10px;
  border-radius:10px;
}
.page .contents .order .details {
  display:flex;
  flex-direction:row;
  width:100%;
  margin:0px;
  padding:0px;
  justify-content:flex-start;
  align-items:flex-start;
  gap:60px;
}
.page .contents .order .details .order_address {
  display:flex;
  flex-direction:column;
  width:calc(30%);
  margin:0px;
  padding:0px;
  justify-content:flex-start;
  align-items:flex-start; 
}
.page .contents .order .details .order_address .order_payment {
  display:flex;
  flex-direction:column;
  width:calc(100% - 60px);
  margin:0px 0px 30px 0px;
  padding:30px;
  justify-content:flex-start;
  align-items:flex-start; 
  background:var(--pale-blue-faded);
  border-radius:10px;
}
.page .contents .order .details .order_address .order_payment h3 {}
.page .contents .order .details .order_address .order_payment p {}
.page .contents .order .details .order_address .order_payment .status_paid {
  padding:8px 20px;
  background: var(--green);
  color:var(--white);
  border-radius:10px;
  margin-left:10px;
}
.page .contents .order .details .order_address .order_payment .status_pending {
  padding:8px 20px;
  background: var(--gold);
  color:var(--white);
  border-radius:10px;
  margin-left:10px;
}
.page .contents .order .details .order_address .order_payment .status_refunded {
  padding:8px 20px;
  background: #fffAfA;
  color:var(--white);
  border-radius:10px;
  margin-left:10px;
}
.page .contents .order .details .order_address .order_payment .status_voided {
  padding:8px 20px;
  background: #fffAfA;
  color:var(--white);
  border-radius:10px;
  margin-left:10px;
}
.page .contents .order .details .order_address .order_payment .address {}
.page .contents .order .details .order_address .order_payment .address.note {}
.page .contents .order .details .order_address .order_payment .address.note p {
  margin:2px 0px;
  padding:0px;
}
.page .contents .order .details .order_address .order_shipping {
  display:flex;
  flex-direction:column;
  width:calc(100% - 60px);
  margin:0px 0px 30px 0px;
  padding:30px;
  justify-content:flex-start;
  align-items:flex-start; 
  background:var(--pale-blue-faded);
  border-radius:10px;
}
.page .contents .order .details .order_address .order_shipping h3 {}
.page .contents .order .details .order_address .order_shipping p {}
.page .contents .order .details .order_address .order_shipping .status_fulfilled {
  padding:8px 20px;
  background: var(--green);
  color:var(--white);
  border-radius:10px;
  margin-left:10px;
}
.page .contents .order .details .order_address .order_shipping .status_unfulfilled {
  padding:8px 20px;
  background: var(--gold);
  color:var(--white);
  border-radius:10px;
  margin-left:10px;
}
.page .contents .order .details .order_address .order_shipping .address {}
.page .contents .order .details .order_address .order_shipping .address.note {}
.page .contents .order .details .order_address .order_shipping .address.note p {
  margin:2px 0px;
  padding:0px;
}
.page .contents .order .details .order_items {
  display:flex;
  flex-direction:column;
  width:calc(70%);
  margin:0px;
  padding:0px;
  justify-content:flex-start;
  align-items:flex-start; 
}
.page .contents .order .details .order_items .order_details {
  width: 100%;
  border-collapse: collapse;
  font-family: sans-serif;
  font-size: 14px;  
}
.page .contents .order .details .order_items .order_details thead {
  background-color: var(--gold);  
}
.page .contents .order .details .order_items .order_details thead tr {}
.page .contents .order .details .order_items .order_details thead tr th {
  text-align: left;
  padding: 12px 10px;
  font-weight: bold;
  color:var(--white);  
}
.page .contents .order .details .order_items .order_details thead tr .center {}
.page .contents .order .details .order_items .order_details thead tr .total {}
.page .contents .order .details .order_items .order_details tbody {}
.page .contents .order .details .order_items .order_details tbody tr {
  height:40px;
  border-bottom:1px solid var(--pale-blue);
}
.page .contents .order .details .order_items .order_details tbody tr .product-line {}
.page .contents .order .details .order_items .order_details tbody tr .product-line img {
  margin:10px 0px;
  border-radius:10px;
}
.page .contents .order .details .order_items .order_details tbody tr .product-line a {
  color:var(--royal-blue);
}
.page .contents .order .details .order_items .order_details tbody tr .product-line .note {}
.page .contents .order .details .order_items .order_details tbody tr .money {}
.page .contents .order .details .order_items .order_details tbody tr .quantity {}
.page .contents .order .details .order_items .order_details tbody tr .cente {}
.page .contents .order .details .order_items .order_details tbody tr .total {}
.page .contents .order .details .order_items .order_details tbody tr .total.money {}
.page .contents .order .details .order_items .order_details tfoot {}
.page .contents .order .details .order_items .order_details tfoot tr.order_summary {}
.page .contents .order .details .order_items .order_details tfoot tr.note {}
.page .contents .order .details .order_items .order_details tfoot tr.discount {}
.page .contents .order .details .order_items .order_details tfoot tr.order_total {}
.page .contents .order .details .order_items .order_details tfoot tr .label {}
.page .contents .order .details .order_items .order_details tfoot tr .total {}
.page .contents .order .details .order_items .order_details tfoot tr .total.money {}

@media(max-width:1280px){
  .page .contents .order .details {
    gap:20px;
  }
  .page .contents .order .details .order_address {
    width:calc(40%);
  }
  .page .contents .order .details .order_items {
    width:calc(60%);
  }
}

@media(max-width:950px){
  .page .contents .order .details {
    gap:20px;
    flex-wrap:wrap;
  }
  .page .contents .order .details .order_address {
    width:calc(100%);
  }
  .page .contents .order .details .order_items {
    width:calc(100%);
  }
  .page .contents .order .details .order_items .order_details tbody tr .product-line span {
    display:none !important;
  }
  .page .contents .order .top .dates {
    flex-wrap:wrap;
  }
  .page .contents .order .top .dates .order_placed, .page .contents .order .top .dates .order_cancelled {
    width:100%;
  }
}
/*#endregion */

/*#region Errors */

.errors ul {
  list-style-type:none;
  margin:20px 0px;
  padding:0px;
}

.errors ul li {
  color:#C40000;
}

/*#endregion */

/*#region stockist promo */

div.stockist-block {
  display:flex;
  flex-direction:row;
  justify-content:flex-start;
  align-items:flex-start;
  width:100%;
  margin:0px;
  padding:0px;
  gap:20px;
}

div.stockist-block .video {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  width:calc(40% - 20px);
  margin:0px;
  padding:0px;
}

div.stockist-block .video video {
  width:100%;
  border-radius:20px;
}

div.stockist-block .video video > source {
  
}

.page-content .contents .page-body div.stockist-block .video div.image-block {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:center;
  width:100%;
  margin:0px;
  padding:0px; 
}
div.stockist-block .video div.image-block > img {
  width:80%;
}

div.stockist-block div.content {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  width:calc(60% - 20px);
  margin:0px;
  padding:0px;
}

div.stockist-block div.content > h2.block-headline {
  
}
div.stockist-block div.content > div.block-content {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  width:100%;
  margin:0px;
  padding:0px; 
}

div.stockist-block div.content > div.block-content .extra {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  width:100%;
  margin:0px;
  padding:0px;  
}

@media(max-width:850px){
  div.stockist-block {
    flex-direction:column;
  }

  div.stockist-block .video {
    width:100%;
  }
  
  div.stockist-block div.content {
    width:100%;
  }  
}

/*#endregion */

/*#region button group */

.button-group {
  list-style-type:none;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  width:100%;
  justify-content:flex-start;
  align-items:flex-start;
  margin:0px;
  padding:0px;
  gap:10px;
}

.button-group li {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  margin:0px;
  padding:0px;
}

.button-group li a {
  padding:10px 20px;
  background:var(--royal-blue);
  color:var(--white);
  font-weight:500;
  border-radius:10px;
}

.button-group li a:hover {
    background:var(--gold);
}

/*#endregion */

.action.purchase ul li p {
  font-weight: 700;
  font-size: 1.2rem;
  color: var(--black);
  margin: 0px;
  padding: 0px;
  min-width:28px;
  text-align:center;
}

.action.purchase .plus.active:before, .action.purchase .minus.active:before, .action.purchase.thinking-plus .plus:before, .action.purchase.thinking-minus .minus:before   {
    content: "";
    display: block;
    width: 42px;
    height: 42px;
    background: var(--white) url(https://yeschefmeals.com.au/cdn/shop/t/2/assets/loading-spinner.svg) no-repeat center center / cover;
    background-size: cover;
    background-position: center;
    position: absolute;
    top: -1px;
    left: -1px;
    border-radius: 50%;
    border: 1px solid #FFF;  
    animation: spin 1s linear infinite;
}

.action.purchase .minus.active:before {
    animation: spinreverse 1s linear infinite;
}

.product-grid .contents .products ul li .action.purchase ul li .minus.visible{
    background:var(--royal-blue);
}

.action.purchase ul li .minus.visible:hover, .action.purchase ul li .plus:hover {
    background:var(--gold) !important;
}



@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes spinreverse {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(-360deg);
    }
}


