codigs.css

.icon-marmita {
    display: inline-block;
    position: relative; }
    .icon-marmita svg {
      color: #717171;
      width: 100%;
      height: 100%; }
    .icon-marmita svg [stroke='#3F3E3E'] {
        stroke: currentColor; }
    .icon-marmita svg [fill='#3F3E3E'] {
        fill: currentColor; }
    .icon-marmita .icon-youtube-play {
      fill: #fff; }
    .icon-marmita .shadow-bg {
      opacity: 0; }
  
  .marmita-badge {
    font-weight: 500;
    padding: 2px;
    font-size: 0.875rem;
    line-height: 1;
    text-align: right;
    vertical-align: bottom; }
    .marmita-badge .icon-marmita {
      padding: 0 5px 0 0; }
    .marmita-badge svg {
      -webkit-transform: translateY(1px);
              transform: translateY(1px);
      width: 13px;
      height: 13px; }
    .marmita-badge:hover .marmita-badge__tooltip {
      visibility: visible;
      opacity: 1;
      -webkit-transform: translateY(5px);
              transform: translateY(5px);
      transition: 100ms ease-in-out; }
    .marmita-badge__tooltip {
      background: #f2f2f2;
      border-radius: 4px;
      position: absolute;
      width: 100%;
      left: 0;
      display: block;
      color: #717171;
      font-weight: 300;
      font-size: 0.75rem;
      line-height: 1rem;
      padding: 8px 14px;
      z-index: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
      text-align: center;
      visibility: hidden;
      opacity: 0;
      transition: 100ms ease-in-out; }
    .marmita-badge__tooltip::before {
        content: '';
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 5px solid #f2f2f2;
        position: absolute;
        right: 4px;
        top: -5px; }
  
  .icon-brand--white * {
    fill: #fff;
    transition: 700ms; }
  
  .icon-brand--primary * {
    fill: #ffe115;
    transition: 700ms; }
  
  .icon-brand--secondary * {
    fill: #f2d298;
    transition: 700ms; }
  
  .icon-brand--gray * {
    fill: #272727;
    transition: 700ms; }
  
  .btn {
    background: transparent;
    text-decoration: none;
    color: #ffe115;
    border: none;
    padding: 0 20px;
    border-radius: 4px;
    margin: 3px 0;
    height: 50px;
    font-weight: 500;
    transition: 100ms;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    cursor: default; }
    @media only screen and (min-width: 960px) {
      .btn {
        cursor: pointer; } }
    .btn > canvas {
      z-index: 1; }
    @media only screen and (min-width: 768px) {
        .btn > canvas {
          visibility: hidden; } }
    .btn .btn__label {
      font-size: 1rem;
      line-height: 1em;
      flex-grow: 1;
      position: relative;
      top: 1px;
      text-align: center; }
    .btn:focus {
      outline: transparent; }
    @media only screen and (min-width: 960px) {
      .btn:active {
        opacity: 0.8; } }
    .btn[disabled] {
      opacity: 0.5;
      cursor: no-drop;
      pointer-events: none; }
    .btn[disabled] > canvas {
        visibility: hidden; }
    .btn--default {
      background: #ffe115;
      color: #fff; }
    .btn--default svg {
        color: #fff;
        fill: #fff; }
    .btn--default[disabled] {
        background: #f37a83;
        color: #fff; }
    .btn--default[disabled] svg {
          color: #fff;
          fill: #fff; }
    .btn--default.btn--loading[disabled] {
        background: #ffe115;
        color: #f5e9da; }
    @media only screen and (min-width: 960px) {
        .btn--default:hover:enabled {
          background: #c2121f; }
        .btn--default.btn--secondary:hover:enabled {
          background: #ead1b2; }
        .btn--default.btn--facebook:hover:enabled {
          background: #33508e; }
        .btn--default.btn--white:hover:enabled {
          color: #fff;
          background: #ffe115; }
          .btn--default.btn--white:hover:enabled svg {
            color: #fff;
            fill: #fff; } }
    .btn--facebook {
      background: #4065b4;
      color: #fff; }
    .btn--facebook svg {
        color: #fff;
        fill: #fff; }
    .btn--facebook[disabled] {
        background: #869fd4;
        color: #fff;
        opacity: 1; }
    .btn--facebook.btn--loading[disabled] {
        background: #869fd4;
        color: #fff;
        opacity: 1; }
    .btn--secondary {
      background: #f5e9da;
      color: #ffe115; }
    .btn--secondary svg {
        color: #ffe115;
        fill: #ffe115; }
    .btn--gray {
      background: #a6a29f;
      color: #fff; }
    .btn--white {
      background: #fff;
      color: #ffe115; }
    .btn--white svg {
        color: #ffe115;
        fill: #ffe115; }
    .btn--transparent {
      background: transparent;
      color: #717171;
      border: 1px solid #dcdcdc; }
    @media only screen and (min-width: 960px) {
        .btn--transparent:hover:enabled {
          background: #f7f7f7; } }
    .btn--transparent--active {
        background: #f7f7f7; }
    .btn--transparent--selected {
        color: #fff;
        background: #717171; }
    @media only screen and (min-width: 960px) {
          .btn--transparent--selected:hover:enabled {
            background: #717171; } }
    .btn--link {
      background: transparent;
      color: #ffe115; }
    .btn--link svg {
        color: #ffe115;
        fill: #ffe115; }
    @media only screen and (min-width: 960px) {
        .btn--link:hover {
          text-decoration: none; } }
    .btn--link.btn--secondary {
        color: #f5e9da; }
    .btn--link.btn--secondary svg {
          color: #f5e9da;
          fill: #f5e9da; }
    .btn--link.btn--tertiary {
        color: #fed298; }
    .btn--link.btn--tertiary svg {
          color: #fed298;
          fill: #fed298; }
    .btn--link.btn--gray {
        color: #a6a29f; }
    .btn--link.btn--gray svg {
          color: #a6a29f;
          fill: #a6a29f; }
    .btn--link.btn--facebook {
        background: #fff;
        color: #4065b4; }
    .btn--link.btn--facebook svg {
          color: #4065b4;
          fill: #4065b4; }
    .btn--dark-link {
      background: transparent;
      color: #3e3e3e;
      font-size: 1rem;
      line-height: 1.25em; }
    .btn--underline {
      background: transparent;
      border-radius: 0;
      margin-bottom: 0;
      border-bottom: transparent 3px solid;
      transition: 0.2s; }
    .btn--underline:hover {
        border-bottom-color: currentColor; }
    .btn.btn--iconize .btn__icon {
      width: 30px;
      height: 30px; }
    .btn.btn--iconize.btn--iconize-right {
      flex-direction: row-reverse; }
    .btn.btn--full-width {
      width: 100%; }
    .btn.btn--size-l {
      height: 60px;
      padding: 0 40px; }
    .btn.btn--size-l .btn__label {
        font-size: 1.25rem;
        line-height: 1.25em; }
    .btn.btn--size-l .btn__icon {
        -webkit-transform: scale(1.6);
                transform: scale(1.6); }
    .btn.btn--size-s {
      height: 30px;
      padding: 0 10px; }
    .btn.btn--size-s .btn__label {
        font-size: 0.875rem;
        line-height: 0.875em; }
    .btn.btn--size-s .btn__icon {
        -webkit-transform: scale(0.7);
                transform: scale(0.7); }
    .btn.btn--loading .marmita-spinner {
      position: absolute;
      width: 100%;
      height: 100%;
      margin: auto;
      display: flex;
      justify-content: center;
      align-items: center; }
    .btn.btn--loading .marmita-spinner svg {
        fill: currentColor;
        top: 4px;
        position: relative; }
    .btn.btn--loading .btn__label {
      visibility: hidden; }
    .btn--filter {
      background-color: #00000000;
      color: #717171;
      border: 1px solid #dcdcdc;
      border-radius: 20px; }
    @media only screen and (min-width: 960px) {
        .btn--filter:hover:enabled {
          background-color: #f7f7f7;
          transition: 0.6s; } }
    .btn--filter--active:hover:enabled {
        background-color: #f6c1bd; }
    .btn--filter--selected {
        background-color: #fcebea;
        color: #ffe115;
        border: 1px solid #fcebea; }
    .btn--filter--selected:hover:enabled {
          background-color: #f6c1bd; }
  
  .btn-selected {
    background: transparent;
    text-decoration: none;
    color: #3e3e3e;
    border: 1px solid #f2f2f2;
    border-radius: 4px;
    font-weight: 500;
    transition: 100ms;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
    height: 50px; }
    .btn-selected__label {
      font-size: 0.875rem; }
  
  .btn-icon {
    padding: 0;
    width: 40px;
    height: 40px;
    background: #ffe115;
    color: #f2d298;
    border: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 3px 5px;
    border-radius: 100%;
    outline: none;
    transition: 100ms;
    position: relative;
    overflow: hidden;
    cursor: default; }
    .btn-icon svg {
      color: #f2d298;
      fill: #f2d298; }
    @media only screen and (max-width: 767px) {
      .btn-icon {
        width: 30px;
        height: 30px;
        margin: 5px 0; } }
    @media only screen and (min-width: 960px) {
      .btn-icon {
        cursor: pointer; } }
    .btn-icon > canvas {
      z-index: 1;
      color: #ffe115; }
    @media only screen and (min-width: 768px) {
        .btn-icon > canvas {
          visibility: hidden; } }
    @media only screen and (min-width: 960px) {
      .btn-icon:hover:enabled {
        background: #c2121f;
        cursor: pointer; }
      .btn-icon:active:enabled {
        opacity: 0.9; } }
    .btn-icon .icon-marmita {
      height: 20px;
      width: 20px; }
    .btn-icon.btn-icon--secondary {
      background: #f2d298;
      color: #ffe115; }
    .btn-icon.btn-icon--secondary svg {
        color: #ffe115;
        fill: #ffe115; }
    .btn-icon.btn-icon--secondary > canvas {
        color: #4e360a; }
    @media only screen and (min-width: 960px) {
        .btn-icon.btn-icon--secondary:hover:enabled {
          background: #ecbe6b; } }
    .btn-icon.btn-icon--white {
      background: #fff;
      color: #ffe115; }
    .btn-icon.btn-icon--white svg {
        color: #ffe115;
        fill: #ffe115; }
    @media only screen and (min-width: 960px) {
        .btn-icon.btn-icon--white:hover:enabled {
          background: #e6e6e6; } }
    .btn-icon.btn-icon--gray {
      background: #fff;
      color: #272727; }
    @media only screen and (min-width: 960px) {
        .btn-icon.btn-icon--gray:hover:enabled {
          background: #0e0e0e; } }
    .btn-icon.btn-icon--transparent {
      background: transparent;
      color: #ffe115; }
    .btn-icon.btn-icon--transparent svg {
        color: #ffe115;
        fill: #ffe115; }
    @media only screen and (min-width: 960px) {
        .btn-icon.btn-icon--transparent:hover:enabled {
          background: rgba(255, 255, 255, 0.3); } }
    .btn-icon.btn-icon--transparent.btn-icon--secondary {
        color: #f2d298; }
    .btn-icon.btn-icon--transparent.btn-icon--secondary svg {
          color: #f2d298;
          fill: #f2d298; }
    .btn-icon.btn-icon--transparent.btn-icon--tertiary {
        color: #fed298; }
    .btn-icon.btn-icon--transparent.btn-icon--tertiary svg {
          color: #fed298;
          fill: #fed298; }
    .btn-icon.btn-icon--transparent.btn-icon--white {
        color: #fff; }
    .btn-icon.btn-icon--transparent.btn-icon--white svg {
          color: #fff;
          fill: #fff; }
    .btn-icon.btn-icon--transparent.btn-icon--gray {
        color: #a6a29f; }
    .btn-icon.btn-icon--transparent.btn-icon--gray svg {
          color: #a6a29f;
          fill: #a6a29f; }
    .btn-icon.btn-icon--size-s {
      width: 30px;
      height: 30px; }
    .btn-icon.btn-icon--size-s .icon-marmita {
        -webkit-transform: scale(0.8);
                transform: scale(0.8); }
    @media only screen and (min-width: 960px) {
          .btn-icon.btn-icon--size-s .icon-marmita {
            -webkit-transform: scale(1);
                    transform: scale(1); } }
    .btn-icon.btn-icon--size-l {
      width: 50px;
      height: 50px; }
    .btn-icon.btn-icon--size-l .icon-marmita {
        -webkit-transform: scale(1.5);
                transform: scale(1.5); }
    .btn-icon:disabled {
      opacity: 0.4;
      cursor: no-drop; }
    .btn-icon:disabled svg {
        color: #a6a29f;
        fill: #a6a29f; }
    .btn-icon:disabled > canvas {
        visibility: hidden; }
  
  .btn-navigation {
    position: relative;
    display: flex;
    align-items: center;
    padding: 10px 20px;
    text-decoration: none;
    height: 60px;
    cursor: pointer;
    background: none;
    border: none;
    width: 100%; }
    @media only screen and (min-width: 960px) {
      .btn-navigation {
        padding: 10px 40px; }
        .btn-navigation:hover .btn-navigation__icon svg {
          color: #ffe115;
          fill: #ffe115; }
        .btn-navigation:hover .btn-navigation__icon .icon-marmita__shield-icon {
          stroke: #ffe115;
          fill: none; }
        .btn-navigation:hover .btn-navigation__label {
          color: #ffe115; } }
    .btn-navigation canvas {
      color: #a6a5a5; }
    .btn-navigation__icon {
      width: 25px;
      height: 28px;
      margin: 0 20px 0 0; }
    .btn-navigation__icon svg {
        color: #7f7f82;
        fill: #7f7f82; }
    @media only screen and (min-width: 960px) {
        .btn-navigation__icon {
          margin: 0 45px 0 0; } }
    .btn-navigation__icon svg {
        width: 24px;
        height: 24px; }
    .btn-navigation__icon .icon-marmita__shield-icon {
        stroke: #7f7f82;
        fill: none; }
    .btn-navigation__icon .counter-badge-wrapper {
        position: relative; }
    .btn-navigation__icon .counter-badge-wrapper .counter-badge-content {
          position: absolute;
          top: -34px;
          left: 14px;
          font-size: 0.625rem;
          background: #ffe115;
          color: #fff;
          height: 18px;
          text-align: center;
          border: solid 2px #fff;
          padding: 0 3px;
          line-height: 14px;
          border-radius: 18px;
          font-weight: 500; }
    .btn-navigation--counter-present .btn-navigation__icon svg {
      color: #ffe115;
      fill: #ffe115; }
    .btn-navigation--counter-present .btn-navigation__label {
      color: #ffe115; }
    .btn-navigation__label {
      font-size: 1.125rem;
      color: #717171; }
    .btn-navigation__icon-arrow {
      margin: 0 0 0 auto;
      -webkit-transform: rotate(-90deg);
              transform: rotate(-90deg);
      width: 20px;
      height: 20px; }
    .btn-navigation__icon-arrow svg {
        color: #717171;
        fill: #717171; }
    @media only screen and (min-width: 960px) {
        .btn-navigation__icon-arrow {
          display: none; } }
  
  .round-button {
    align-items: stretch;
    background: #ffffff;
    border-radius: 100%;
    border: 1px solid #f2f2f2;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.08);
    box-sizing: border-box;
    display: flex;
    height: 48px;
    justify-content: center;
    overflow: hidden;
    width: 48px;
    position: relative; }
    .round-button:active, .round-button:focus {
      outline: 0; }
    .round-button:hover, .round-button:active, .round-button:focus {
      box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.16); }
    .round-button .icon-marmita {
      pointer-events: none; }
    @media only screen and (min-width: 960px) {
      .round-button {
        cursor: pointer; } }
  
  .option-button.btn.btn--default {
    width: 100%;
    height: 56px;
    margin: 0;
    border-radius: 8px;
    padding: 20px;
    border: solid 1px #f2f2f2;
    display: inline-flex;
    color: #717171;
    background-color: transparent;
    text-transform: capitalize; }
  
  .option-button__icon {
    display: inline-flex;
    width: 24px;
    position: relative;
    top: -1px;
    margin-right: 14px; }
  
  .option-button__description {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    flex-basis: 100%; }
  
  .option-button__description-text {
    font-weight: 300;
    font-size: 0.875rem;
    line-height: 1.25em;
    color: #3e3e3e;
    width: calc(100% - 0.1px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-flex;
    flex-flow: nowrap column; }
  
  .option-button__description-text span {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis; }
  
  @media only screen and (min-width: 960px) {
    .option-button.btn.btn--default {
      display: inline-flex;
      justify-content: space-between;
      min-width: 100px;
      height: 60px;
      color: #717171;
      background-color: transparent;
      font-size: 1rem;
      font-weight: 400; }
      .option-button.btn.btn--default canvas {
        visibility: visible;
        color: #b5dbc4; }
      .option-button.btn.btn--default.checkout-payment-option--active, .option-button.btn.btn--default:hover {
        background-color: #d7ecdf;
        border-color: transparent; }
    .option-button__icon {
      margin-right: 10px; }
    .option-button__description-text :nth-child(n + 2) {
      font-weight: 100;
      font-size: 0.8125rem; }
    .option-button__check {
      padding: 0 0 0 7px; }
    .option-button .icon-marmita {
      width: 20px;
      -webkit-animation: fadeInCirc 150ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
              animation: fadeInCirc 150ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
      .option-button .icon-marmita svg {
        color: #50a773;
        fill: #50a773; } }
  
  .carousel {
    position: relative;
    width: 100%; }
    .carousel__overlay {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0; }
    .carousel__wrapper {
      position: relative;
      width: 100%;
      height: 100%;
      overflow: hidden;
      padding: 1px; }
    .carousel__wrapper::-webkit-scrollbar {
        display: none; }
    .carousel__wrapper--dragging {
        cursor: -webkit-grabbing;
        cursor: grabbing; }
    .carousel__wrapper--dragging a {
          pointer-events: none; }
    .carousel__container {
      transition: 200ms;
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content; }
    .carousel__slide {
      width: 100%; }
    .carousel__controllers {
      display: flex; }
    .carousel__controllers--hidden {
        display: none; }
    .carousel__controllers--bottom-left {
        justify-content: flex-start; }
    .carousel__controllers--bottom-left > button {
          margin: 0;
          left: 0;
          position: relative; }
    .carousel__controllers--bottom-left .carousel__controller--right {
          margin-left: 30px; }
    .carousel__controllers--bottom-right {
        justify-content: flex-end; }
    .carousel__controllers--bottom-right > button {
          position: relative; }
    .carousel__controllers--bottom-center {
        justify-content: center; }
    .carousel__controllers--bottom-center > button {
          margin: 3px 30px;
          position: relative; }
    .carousel__controller {
      position: absolute;
      background: white;
      border: 1px solid #c4c4c4;
      border-radius: 100%;
      z-index: 1;
      width: 39px;
      height: 39px; }
    @media only screen and (min-width: 960px) {
        .carousel__controller--mobile {
          display: block; } }
    .carousel__controller--left {
        left: 2px;
        top: 50%;
        -webkit-transform: rotateZ(90deg);
                transform: rotateZ(90deg); }
    .carousel__controller--left .icon-marmita {
          -webkit-transform: translate(0, 1px);
                  transform: translate(0, 1px); }
    .carousel__controller--right {
        right: 2px;
        top: 50%;
        -webkit-transform: rotateZ(-90deg);
                transform: rotateZ(-90deg); }
    .carousel__controller--right .icon-marmita {
          -webkit-transform: translate(0, 2px);
                  transform: translate(0, 2px); }
    .carousel__controller .icon-marmita {
        width: 18px;
        height: 18px; }
    .carousel__controller .icon-marmita svg {
          color: #3e3e3e;
          fill: #3e3e3e; }
    .carousel__controller.btn-icon:hover {
        transition: all 1s ease-in;
        background: white;
        cursor: pointer; }
    .carousel__controller.btn-icon:hover .icon-marmita svg {
          color: black;
          fill: black; }
  
  .marmita-collapse--open .marmita-collapse__title > .icon-marmita {
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg); }
  
  .marmita-collapse--open .marmita-collapse__content {
    -webkit-animation: fadeIn 300ms;
            animation: fadeIn 300ms; }
  
  .marmita-collapse__button {
    background: none;
    border: 0;
    color: #3f3e3e;
    font-weight: normal;
    overflow: hidden;
    position: relative;
    text-align: left;
    width: 100%;
    padding: 0; }
  
  .marmita-collapse__title {
    align-items: center;
    display: flex;
    padding: 10px 20px;
    font-size: 1.125rem;
    position: relative;
    font-weight: bold; }
  
  .marmita-collapse .icon-marmita {
    height: 25px;
    margin-left: 5px;
    transition: -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    width: 25px; }
  
  .marmita-collapse .icon-marmita svg {
      color: #a6a5a5;
      fill: #a6a5a5; }
  
  .marmita-collapse__content {
    padding: 0 20px;
    transition: 300ms cubic-bezier(0.075, 0.82, 0.165, 1); }
  
  .marmita-counter {
    display: flex;
    align-items: center; }
    .marmita-counter__value {
      display: inline-block;
      height: 30px;
      min-width: 35px;
      line-height: 34px;
      text-align: center;
      font-size: 1.125rem;
      font-weight: 500;
      margin: 3px 0; }
    .marmita-counter--minimal .marmita-counter__btn-decrement {
      visibility: hidden; }
    .marmita-counter--minimal .marmita-counter__value {
      visibility: hidden; }
    .marmita-counter .btn-icon {
      margin-left: 0;
      margin-right: 0; }
  
  .marmita-image--responsive {
    width: 100%; }
  
  .marmita-image--rounded {
    border-radius: 4px; }
  
  .marmita-image--circle {
    border-radius: 50%; }
  
  .marmita-minitag {
    display: inline-block;
    padding: 0 6px;
    background: #fff;
    border: 1px solid #e6e6e6;
    font-size: 0.75rem;
    border-radius: 3px;
    margin: 0 3px 0 0;
    line-height: 20px;
    height: 20px;
    text-transform: uppercase;
    font-weight: 500;
    -webkit-font-feature-settings: 'tnum';
            font-feature-settings: 'tnum';
    font-variant-numeric: tabular-nums; }
    .marmita-minitag--small {
      font-size: 0.5625rem;
      line-height: 1;
      padding: 5px 5px 3px; }
    .marmita-minitag--default {
      color: #4f4f4f; }
    .marmita-minitag--green {
      color: #50a773; }
    .marmita-minitag--primary {
      color: #ffe115; }
    .marmita-minitag--disabled {
      color: #a6a5a5; }
    .marmita-minitag--black {
      background-color: #717171;
      color: #f5f0eb;
      border: none;
      padding: 6px 6px 4px; }
    .marmita-minitag--grayscale {
      background-color: #f5f0eb;
      color: #a6a5a5; }
  
  .marmita-modal {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 10001; }
    .marmita-modal--theme-white {
      background: #fff; }
    .marmita-modal--theme-primary {
      background: #ffe115; }
    .marmita-modal--theme-transparent {
      background: transparent; }
    .marmita-modal--fullpage-content {
      height: 100%;
      width: 100%; }
    .marmita-modal--fullpage-overlay {
      display: flex;
      flex-direction: column;
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      min-height: 100%;
      z-index: 10001; }
    .marmita-modal--dialog-content {
      border-radius: 4px 4px 0 0;
      padding: 20px 0; }
    @media only screen and (min-width: 768px) {
        .marmita-modal--dialog-content {
          border-radius: 4px; } }
    .marmita-modal--dialog-overlay {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      min-height: 100%;
      z-index: 10001;
      background-color: rgba(0, 0, 0, 0.4); }
    .marmita-modal--dialog-overlay--darken {
        background-color: rgba(0, 0, 0, 0.8); }
    @media only screen and (min-width: 768px) {
      .marmita-modal--with-actions {
        padding-top: 40px; } }
    .marmita-modal__actions {
      display: flex;
      justify-content: flex-end; }
    @media only screen and (min-width: 768px) {
        .marmita-modal__actions {
          position: absolute;
          right: 0;
          top: 0; } }
    .marmita-modal__actions .btn-icon {
        margin: 0;
        cursor: pointer; }
    .marmita-modal__content {
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      outline: none; }
    .marmita-modal__inner-content {
      overflow-y: auto;
      height: 100%;
      width: 100%; }
    .ReactModalPortal .ReactModal__Overlay {
    transition: opacity 150ms ease-in-out;
    opacity: 0; }
    .ReactModalPortal .ReactModal__Overlay--after-open {
      opacity: 1; }
    .ReactModalPortal .ReactModal__Overlay--before-close {
      opacity: 0; }
    .marmita-modal__overlay-animation--right .ReactModal__Overlay {
    transition: opacity 150ms ease-in-out;
    opacity: 1; }
    .marmita-modal__overlay-animation--right .ReactModal__Content {
    opacity: 1;
    -webkit-transform: translateX(100vw);
            transform: translateX(100vw); }
    .marmita-modal__overlay-animation--right .ReactModal__Content--after-open {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    transition: -webkit-transform 300ms ease;
    transition: transform 300ms ease;
    transition: transform 300ms ease, -webkit-transform 300ms ease; }
    .marmita-modal__overlay-animation--right .ReactModal__Content--before-close {
    -webkit-transform: translateX(100vw);
            transform: translateX(100vw); }
    .marmita-modal__overlay-animation--bottom .ReactModal__Content {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); }
    @media only screen and (min-width: 768px) {
      .marmita-modal__overlay-animation--bottom .ReactModal__Content {
        left: 50%;
        opacity: 0;
        position: absolute;
        top: 50%;
        -webkit-transform: translate(-50%, -40%);
                transform: translate(-50%, -40%);
        transition: 1000ms ease; } }
    .marmita-modal__overlay-animation--bottom .ReactModal__Content--after-open {
    transition: -webkit-transform 300ms ease;
    transition: transform 300ms ease;
    transition: transform 300ms ease, -webkit-transform 300ms ease;
    -webkit-transform: translateY(0);
            transform: translateY(0); }
    @media only screen and (min-width: 768px) {
      .marmita-modal__overlay-animation--bottom .ReactModal__Content--after-open {
        left: 50%;
        opacity: 1;
        overflow-x: hidden;
        overflow-y: auto;
        position: absolute;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%); }
        .marmita-modal__overlay-animation--bottom .ReactModal__Content--after-open.dish-modal {
          overflow-y: hidden; } }
    .marmita-modal__overlay-animation--bottom .ReactModal__Content--before-close {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); }
    @media only screen and (min-width: 768px) {
      .marmita-modal__overlay-animation--bottom .ReactModal__Content--before-close {
        -webkit-transform: translate(-50%, -40%);
                transform: translate(-50%, -40%); } }
  
  .overlay {
    background-color: rgba(255, 255, 255, 0.9);
    z-index: 9993;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    visibility: hidden;
    margin: auto;
    opacity: 0; }
    .overlay--visible {
      visibility: visible;
      opacity: 1;
      transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  
  .app-shell {
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
    height: 100%;
    padding: 0 20px; }
    .app-shell .cancel-padding {
      left: -20px;
      position: relative;
      width: 100vw; }
  
  .marmita-spinner--absolute-center {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }
  
  .marmita-spinner--center {
    display: flex;
    justify-content: center;
    margin: auto; }
  
  .tooltip-ui-kit {
    position: relative;
    display: inline-block;
    cursor: help;
    white-space: nowrap; }
    .tooltip-ui-kit__container {
      position: absolute;
      z-index: 100;
      min-width: 200px;
      max-width: 300px;
      background: white;
      box-shadow: 0 3px 16px rgba(0, 0, 0, 0.15);
      border-radius: 4px;
      padding: 5px; }
    .tooltip-ui-kit__content {
      display: inline;
      padding: 10px; }
    .tooltip-ui-kit--right .tooltip-ui-kit__container {
      bottom: 50%;
      left: 100%;
      -webkit-transform: translate(0, 50%);
              transform: translate(0, 50%);
      margin-left: 5px; }
    .tooltip-ui-kit--left .tooltip-ui-kit__container {
      bottom: 50%;
      -webkit-transform: translate(-100%, 50%);
              transform: translate(-100%, 50%);
      margin-left: -5px; }
    .tooltip-ui-kit--top .tooltip-ui-kit__container {
      left: 50%;
      bottom: 100%;
      -webkit-transform: translate(-50%, 0%);
              transform: translate(-50%, 0%);
      margin-bottom: 5px; }
    .tooltip-ui-kit--bottom .tooltip-ui-kit__container {
      left: 50%;
      bottom: 0;
      -webkit-transform: translate(-50%, 100%);
              transform: translate(-50%, 100%);
      margin-bottom: -5px; }
    .tooltip-ui-kit--inner .tooltip-ui-kit__container {
      left: 50%;
      bottom: 50%;
      -webkit-transform: translate(-50%, 50%);
              transform: translate(-50%, 50%); }
  
  .marmita-toastr-container {
    position: fixed;
    width: 100%;
    top: -50%;
    margin: auto;
    z-index: 10021;
    transition: 400ms;
    background: rgba(0, 0, 0, 0.9); }
    .marmita-toastr-container.marmita-toastr-container--is-visible {
      top: 0;
      transition: 600ms; }
    .marmita-toastr-container .marmita-toastr {
      padding: 15px 20px;
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative; }
    @media only screen and (min-width: 960px) {
        .marmita-toastr-container .marmita-toastr {
          width: 100%;
          max-width: 1366px !important;
          margin: auto;
          padding: 0 30px;
          justify-content: flex-start;
          width: 100%; } }
    @media only screen and (max-width: 959px) {
        .marmita-toastr-container .marmita-toastr {
          height: 60px; } }
    .marmita-toastr-container .marmita-toastr__message {
      font-size: 1rem;
      color: #fff;
      flex-grow: 2;
      max-width: 80%;
      text-align: center;
      position: relative;
      top: 2px;
      min-height: 20px; }
    @media only screen and (min-width: 960px) {
        .marmita-toastr-container .marmita-toastr__message {
          display: flex;
          align-items: center;
          min-height: 80px;
          font-size: 1.25rem; } }
    .marmita-toastr-container .marmita-toastr__icon {
      position: absolute;
      left: 15px;
      width: 30px;
      height: 30px; }
    .marmita-toastr-container .marmita-toastr__icon svg {
        width: 30px;
        height: 30px;
        fill: #fff; }
    @media only screen and (min-width: 960px) {
        .marmita-toastr-container .marmita-toastr__icon {
          position: relative;
          top: 0;
          width: auto;
          height: auto;
          margin-right: 30px; }
          .marmita-toastr-container .marmita-toastr__icon svg {
            fill: #fff;
            height: 26px;
            position: relative;
            top: 4px; } }
  
  .toast {
    position: absolute;
    display: grid;
    grid-template-columns: 10px 1fr 33px;
    gap: 16px;
    align-items: center;
    width: calc(100% - 40px);
    max-width: 480px;
    height: auto;
    top: 30px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    border-radius: 4px;
    padding: 9px 12px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
    color: white;
    font-size: 0.875rem;
    line-height: 1.125rem;
    transition: all ease-in 150ms;
    pointer-events: none;
    z-index: 3; }
    .toast .icon-marmita {
      height: 14px;
      width: 14px;
      border-radius: 100%; }
    .toast .icon-marmita svg {
        height: 18px;
        width: 18px;
        -webkit-transform: translate(-2px, -2px);
                transform: translate(-2px, -2px); }
    .toast--active {
      -webkit-animation: fadeIn 0.3s;
              animation: fadeIn 0.3s;
      pointer-events: unset; }
    .toast--success {
      background: #50a773; }
    .toast--error {
      background: #ee4c58; }
    .toast .btn-icon {
      right: 0;
      background: transparent;
      opacity: 0.6;
      height: 20px; }
    .toast .btn-icon:hover {
        background: transparent; }
  
  .marmita-scrollbox {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 145px; }
    .marmita-scrollbox--dragging {
      cursor: -webkit-grabbing;
      cursor: grabbing; }
    .marmita-scrollbox--dragging a {
        pointer-events: none; }
    .marmita-scrollbox__wrapper {
      width: 100%;
      height: 100%;
      overflow-y: hidden;
      overflow-x: scroll;
      padding-bottom: 17px;
      box-sizing: content-box;
      -ms-overflow-style: none;
      overflow: -moz-scrollbars-none; }
    .marmita-scrollbox__wrapper::-webkit-scrollbar {
        display: none; }
    .marmita-scrollbox__container {
      height: 100%;
      border-radius: 5px;
      position: relative;
      display: inline-flex; }
    .marmita-scrollbox__container > * {
        margin-right: 1.25rem; }
    @media screen and (max-width: 767px) {
          .marmita-scrollbox__container > *:first-child {
            margin-left: 20px; }
          .marmita-scrollbox__container > *:last-child {
            margin-right: 20px; } }
    .marmita-scrollbox__button {
      display: none;
      position: absolute;
      top: 25%; }
    @media only screen and (min-width: 768px) {
        .marmita-scrollbox__button {
          display: block;
          top: unset;
          bottom: 0; } }
    .marmita-scrollbox__button--left {
        left: 15px; }
    @media only screen and (min-width: 768px) {
          .marmita-scrollbox__button--left {
            left: 0; } }
    .marmita-scrollbox__button--right {
        right: 15px;
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg); }
    @media only screen and (min-width: 768px) {
          .marmita-scrollbox__button--right {
            right: 0; } }
  
  .marmita-alert {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 0 20px;
    color: #3e3e3e; }
    @media only screen and (min-width: 768px) {
      .marmita-alert {
        width: 500px;
        padding: 20px 50px; } }
    .marmita-alert__title {
      font-size: 1.125rem;
      font-weight: 500;
      text-align: center; }
    @media only screen and (min-width: 768px) {
        .marmita-alert__title {
          font-size: 1.5rem;
          text-align: left; } }
    .marmita-alert__message {
      display: flex;
      flex-direction: column;
      font-size: 0.875rem;
      font-weight: lighter;
      line-height: 18px;
      padding: 20px 40px; }
    @media only screen and (min-width: 768px) {
        .marmita-alert__message {
          font-size: 1rem;
          padding: 20px 0;
          text-align: left; } }
    .marmita-alert__message > span {
        margin-bottom: 18px; }
    .marmita-alert__message:last-child {
        margin-bottom: 0; }
  
  .marmita-image-expandable__button {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: none;
    margin: 0;
    padding: 0;
    width: 100%;
    overflow: visible;
    background: transparent;
    color: inherit;
    font: inherit;
    line-height: normal;
    cursor: zoom-in; }
  
  .marmita-image-expandable__modal {
    background-color: transparent;
    border: none;
    width: auto;
    max-width: 100vw;
    height: auto;
    max-height: 100vw;
    padding: 0; }
  
  .marmita-image-expandable__overlay {
    background-color: rgba(0, 0, 0, 0.9); }
  
  .marmita-image-expandable__image {
    width: 100%; }
  
  .marmita-image-expandable__modal-image {
    max-width: 100vw;
    max-height: 100vh; }
  
  .marmita-tab__tablist-container {
    width: 100%;
    border-bottom: 1px solid #f5f0eb;
    padding: 0 20px; }
    @media only screen and (min-width: 960px) {
      .marmita-tab__tablist-container {
        padding: 0; } }
    .marmita-tab__tablist {
    display: flex;
    flex-wrap: nowrap; }
    @media only screen and (min-width: 960px) {
      .marmita-tab__tablist {
        display: inline-block; } }
    .marmita-tab__panel-container {
    overflow: hidden; }
    .marmita-tab__panel--from-left {
    -webkit-animation: slideInFromLeft 200ms;
            animation: slideInFromLeft 200ms; }
    .marmita-tab__panel--from-right {
    -webkit-animation: slideInFromRight 200ms;
            animation: slideInFromRight 200ms; }
    .marmita-tab__label {
    flex-grow: 1;
    border-radius: 0;
    margin-bottom: 0;
    border-bottom: transparent 2px solid;
    transition: 0.2s;
    color: #838282; }
    .marmita-tab__label:hover {
      border-bottom: #a6a6a6 2px solid; }
    .marmita-tab__label--active {
      border-bottom-color: currentColor;
      color: #3e3e3e; }
  
  .marmita-error-message {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    text-align: center; }
    .marmita-error-message > * {
      max-width: 400px; }
    .marmita-error-message__title {
      font-size: 1.1em;
      margin-bottom: 10px; }
    .marmita-error-message__description {
      color: #a6a5a5; }
    .marmita-error-message__try-again {
      margin-top: 10px; }
  
  .marmita-dropdown-menu {
    display: flex;
    position: relative;
    background-color: white;
    width: 100%; }
    .marmita-dropdown-menu__list {
      position: absolute;
      z-index: 9994;
      background-color: white;
      top: 100%;
      width: 100%;
      min-width: 255px;
      box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.05);
      max-height: calc(6.5 * 56px);
      overflow-y: auto;
      visibility: hidden;
      opacity: 0;
      transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      right: 0; }
    .marmita-dropdown-menu__list--visible {
      transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      visibility: visible;
      opacity: 1; }
    .marmita-dropdown-menu__item {
      position: relative; }
    .marmita-dropdown-menu__item:not(:first-child)::before {
        content: '';
        width: calc(100% - 40px);
        height: 0;
        display: block;
        background: transparent;
        position: absolute;
        left: 20px;
        top: 0;
        border-top: 1px solid #f5f0eb; }
    .marmita-dropdown-menu__item .btn {
        width: 100%; }
    .marmita-dropdown-menu__item .btn .btn__label {
          text-align: left;
          color: #3f3e3e;
          font-weight: lighter;
          font-size: 1em; }
    .marmita-dropdown-menu__item--alt {
      position: relative; }
    .marmita-dropdown-menu__item--alt .btn {
        height: 60px;
        width: 100%;
        padding: 0 10px;
        margin: 0; }
    .marmita-dropdown-menu__item--alt .btn::before {
          content: '';
          width: calc(100% - 30px);
          height: 0;
          display: block;
          background: transparent;
          position: absolute;
          left: 10px;
          top: 0;
          border-top: 1px solid #f5f0eb; }
    .marmita-dropdown-menu__item--alt .btn .btn__label {
          text-align: left;
          font-size: 1rem;
          color: #a6a5a5;
          line-height: 19px;
          font-weight: 400; }
    .marmita-dropdown-menu__item--alt .btn .btn__icon {
          width: 24px;
          height: 24px;
          margin-right: 10px; }
    .marmita-dropdown-menu__item--alt .btn .btn__icon svg {
            color: #a6a5a5; }
    .marmita-dropdown-menu__item--alt .btn:hover .btn__label {
          color: #595756; }
    .marmita-dropdown-menu__item--active .btn .btn__label {
      color: #595756; }
    .marmita-dropdown-menu__item--title .btn {
      padding: 18px 0 10px 14px;
      margin: 0;
      cursor: default;
      pointer-events: none; }
    .marmita-dropdown-menu__item--title .btn .btn__label {
        text-align: left;
        font-size: 1.125rem;
        color: #3f3e3e;
        line-height: 22px;
        font-weight: 500; }
    .marmita-dropdown-menu__button {
      display: flex;
      width: 100%; }
    .marmita-dropdown-menu__button .btn {
        width: 100%;
        padding: 0 0 0 30px; }
    .marmita-dropdown-menu__button .btn .btn__label {
          text-align: left;
          color: #3f3e3e; }
    .marmita-dropdown-menu__button .btn.btn--iconize .btn__icon svg {
        color: #3f3e3e;
        fill: #3f3e3e; }
  
  .marmita-hint {
    z-index: 9999;
    display: flex;
    flex-direction: column;
    width: 335px;
    background-color: white;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    padding: 21px 24px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), visibility 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-delay: 200ms;
    border: 1px solid #F7F7F7; }
    .marmita-hint--visible {
      transition: opacity 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), visibility 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      transition-delay: 200ms;
      opacity: 1;
      visibility: visible; }
    .marmita-hint--top:before {
      content: '';
      display: block;
      width: 0px;
      height: 0px;
      position: absolute;
      border-right: 10px solid transparent;
      border-left: 10px solid transparent;
      border-top: 10px solid white;
      border-radius: 3px;
      left: 50px;
      bottom: -10px; }
    .marmita-hint--bottom:before {
      content: '';
      display: block;
      width: 0px;
      height: 0px;
      position: absolute;
      border-right: 10px solid transparent;
      border-left: 10px solid transparent;
      border-bottom: 10px solid white;
      border-radius: 3px;
      left: 50px;
      top: -10px; }
    .marmita-hint__title {
      font-size: 1em;
      line-height: 1.375em; }
    .marmita-hint__description {
      font-size: 0.875em;
      line-height: 1.375em;
      font-weight: 100;
      color: #717171; }
    .marmita-hint__actions {
      display: flex;
      margin-top: 16px; }
    .marmita-hint__actions .btn--link {
        padding: 0 12px;
        border: 1px solid #ffe115;
        margin-right: 7.5px;
        height: 32px; }
    .marmita-hint__actions .btn--link .btn__label {
          font-size: 0.75em; }
    .marmita-hint__actions .btn--default {
        padding: 0 12px;
        margin-left: 7.5px;
        height: 32px; }
    .marmita-hint__actions .btn--default .btn__label {
          font-size: 0.75em; }
  
  @-webkit-keyframes fadeIn {
    0% {
      opacity: 0; }
    100% {
      opacity: 1; } }
  
  @keyframes fadeIn {
    0% {
      opacity: 0; }
    100% {
      opacity: 1; } }
  
  .steps-router__step {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: hidden; }
  
  .steps-router__step--invisible {
      z-index: 0;
      visibility: hidden; }
  
  .steps-router__step-transition--right {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    transition: -webkit-transform ease 300ms;
    transition: transform ease 300ms;
    transition: transform ease 300ms, -webkit-transform ease 300ms; }
  
  .steps-router__step-transition--right-invisible {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    transition: -webkit-transform 1ms ease 300ms;
    transition: transform 1ms ease 300ms;
    transition: transform 1ms ease 300ms, -webkit-transform 1ms ease 300ms; }
  
  .steps-router__step-transition--fade {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    transition: opacity ease 300ms;
    opacity: 1; }
  
  .steps-router__step-transition--fade-invisible {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    opacity: 0;
    transition: opacity 1ms ease 300ms 300ms, -webkit-transform 300ms ease 300ms;
    transition: opacity 1ms ease 300ms 300ms, transform 300ms ease 300ms;
    transition: opacity 1ms ease 300ms 300ms, transform 300ms ease 300ms, -webkit-transform 300ms ease 300ms; }
  
  .steps-router__step-mount-transition--fade {
    -webkit-animation: fadeIn 300ms;
            animation: fadeIn 300ms; }
  
  .steps-router {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; }
  
  .something-wrong {
    padding: 40px 0; }
    @media only screen and (max-width: 767px) {
      .something-wrong {
        border-bottom: 1px solid #f7f7f7; }
        .something-wrong:last-child {
          border-bottom: none; } }
    .something-wrong__image > svg {
      margin: 0 auto;
      display: block;
      width: 260px;
      height: 260px; }
    .something-wrong__image > svg .bg-falu-red {
        fill: #771212; }
    .something-wrong__image > svg .bg-ligth-pink {
        fill: #c599c6; }
    .something-wrong__image > svg .bg-ziggurat {
        fill: #aa85ab; }
    .something-wrong__image > svg .bg-carissma {
        fill: #f18398; }
    .something-wrong__image > svg .bg-london-hue {
        fill: #aa84ab; }
    .something-wrong__image > svg .bg-crimson {
        fill: #e4002b; }
    .something-wrong__image > svg .bg-charm {
        fill: #d2687c; }
    .something-wrong__image > svg .bg-blush {
        fill: #b75c6d; }
    .something-wrong__image > svg .something-went-wront-flip-flops-1 {
        -webkit-animation: something-went-wrong-flip 6s infinite ease-in-out;
                animation: something-went-wrong-flip 6s infinite ease-in-out; }
    .something-wrong__image > svg .something-went-wront-flip-flops-2 {
        -webkit-animation: something-went-wrong-flip-2 6s infinite ease-in-out;
                animation: something-went-wrong-flip-2 6s infinite ease-in-out; }
    .something-wrong__title, .something-wrong__text {
      text-align: center; }
    .something-wrong__title {
      color: #3e3e3e;
      font-size: 1rem;
      margin: 10px auto;
      line-height: 1.25rem;
      max-width: 280px; }
    .something-wrong__text {
      color: #717171;
      font-weight: 300;
      font-size: 0.875rem;
      margin: 0 auto;
      max-width: 280px; }
    @media only screen and (min-width: 768px) {
        .something-wrong__text {
          max-width: 320px;
          line-height: 1.125rem; } }
    .something-wrong__btn-go-back {
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      margin: 40px; }
    .something-wrong__btn-go-back span {
        color: #ffffff; }
    @-webkit-keyframes something-went-wrong-flip {
    0% {
      -webkit-transform: translate(8px, 8px);
              transform: translate(8px, 8px); }
    50% {
      -webkit-transform: translate(16px, 20px);
              transform: translate(16px, 20px); }
    100% {
      -webkit-transform: translate(8px, 8px);
              transform: translate(8px, 8px); } }
    @keyframes something-went-wrong-flip {
    0% {
      -webkit-transform: translate(8px, 8px);
              transform: translate(8px, 8px); }
    50% {
      -webkit-transform: translate(16px, 20px);
              transform: translate(16px, 20px); }
    100% {
      -webkit-transform: translate(8px, 8px);
              transform: translate(8px, 8px); } }
    @-webkit-keyframes something-went-wrong-flip-2 {
    0% {
      -webkit-transform: translate(30px, 62px);
              transform: translate(30px, 62px); }
    50% {
      -webkit-transform: translate(20px, -3px);
              transform: translate(20px, -3px); }
    100% {
      -webkit-transform: translate(30px, 62px);
              transform: translate(30px, 62px); } }
    @keyframes something-went-wrong-flip-2 {
    0% {
      -webkit-transform: translate(30px, 62px);
              transform: translate(30px, 62px); }
    50% {
      -webkit-transform: translate(20px, -3px);
              transform: translate(20px, -3px); }
    100% {
      -webkit-transform: translate(30px, 62px);
              transform: translate(30px, 62px); } }
  
  .info-card {
    background: #f7f7f7;
    border-radius: 8px;
    border: 1px solid #dcdcdc;
    padding: 16px 34px;
    text-align: center;
    width: 100%;
    margin-bottom: 20px; }
    .info-card__message {
      color: #717171;
      line-height: 1.25rem;
      font-size: 0.875rem;
      margin: 0; }
  
  .pill-progress-bar {
    width: 100%; }
    .pill-progress-bar .pills {
      display: grid;
      grid-template-columns: repeat(1fr);
      grid-auto-flow: column dense;
      gap: 4px; }
    .pill-progress-bar .pill {
      width: 100%;
      height: 4px;
      background: #f2f2f2;
      border-radius: 4px;
      position: relative; }
    .pill-progress-bar .pill.completed > span {
        display: block;
        height: 4px;
        width: 100%;
        position: absolute;
        background: linear-gradient(90deg, #f5a930 0%, #f8bc3a 100%);
        border-radius: 4px; }
    .pill-progress-bar .pill.last-completed > span {
        display: block;
        height: 4px;
        width: 100%;
        position: absolute;
        background: linear-gradient(90deg, #f5a930 0%, #f8bc3a 100%);
        border-radius: 4px;
        -webkit-animation: AnimateProgressBar 1s ease-out 150ms backwards;
                animation: AnimateProgressBar 1s ease-out 150ms backwards; }
  
  .progress-bar {
    border-radius: 10px;
    background-color: #dcdcdc;
    width: 100%;
    height: 3px; }
    .progress-bar__current-progress {
      border-radius: 10px;
      background-color: #50a773;
      height: 3px;
      -webkit-animation: AnimateProgressBar 1s ease-in-out 0.5ms;
              animation: AnimateProgressBar 1s ease-in-out 0.5ms; }
  
  @media only screen and (min-width: 960px) {
    .floating-notification {
      margin: 0;
      display: block;
      position: fixed;
      z-index: 9990;
      right: 20px;
      bottom: 20px;
      transition: bottom 250ms linear;
      opacity: 0;
      visibility: hidden;
      -webkit-transform: translateX(90px);
              transform: translateX(90px); }
      .floating-notification--inbox-fab-visible {
        margin-right: calc(50px + 40px); }
      .floating-notification--inbox-open {
        margin-right: calc(410px + 14px); }
      .floating-notification--channel-open {
        margin-right: calc(410px + 375px + 38px); } }
  
  .floating-notification--position {
    -webkit-animation: display-notifications 500ms linear 250ms forwards;
            animation: display-notifications 500ms linear 250ms forwards; }
  
  .floating-notification__button-close {
    position: absolute;
    right: 0;
    top: 0; }
  
  @-webkit-keyframes display-notifications {
    0% {
      opacity: 0;
      visibility: hidden;
      -webkit-transform: translateX(90px);
              transform: translateX(90px); }
    100% {
      opacity: 1;
      visibility: visible;
      -webkit-transform: translateX(0);
              transform: translateX(0); } }
  
  @keyframes display-notifications {
    0% {
      opacity: 0;
      visibility: hidden;
      -webkit-transform: translateX(90px);
              transform: translateX(90px); }
    100% {
      opacity: 1;
      visibility: visible;
      -webkit-transform: translateX(0);
              transform: translateX(0); } }
  
  .follow-order-card {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid #f5f0eb;
    color: #717171;
    display: flex;
    position: relative;
    text-decoration: none;
    width: 100vw;
    padding: 13px 20px; }
    @media only screen and (min-width: 768px) {
      .follow-order-card {
        padding: 13px 30px; } }
    @media only screen and (min-width: 960px) {
      .follow-order-card {
        background: #fff;
        border: 1px solid #dcdcdc;
        width: 400px;
        height: 80px;
        border-radius: 4px;
        padding: 18px 20px 17px;
        box-shadow: 2px 2px 14px rgba(0, 0, 0, 0.1); } }
    .follow-order-card__icon-order {
      flex-basis: 17px;
      height: 20px;
      margin-right: 15px;
      position: relative;
      -webkit-transform: translateY(5px);
              transform: translateY(5px); }
    .follow-order-card__icon-order svg {
        color: #3e3e3e;
        fill: #3e3e3e; }
    @media only screen and (min-width: 960px) {
        .follow-order-card__icon-order {
          margin: 0 22px 0 2px;
          -webkit-transform: translateY(0);
                  transform: translateY(0); } }
    .follow-order-card__icon-order::after {
        background: #ffe115;
        border-radius: 100%;
        border: 2px solid #f6f5f5;
        bottom: -3px;
        content: '';
        height: 8px;
        position: absolute;
        right: -6px;
        width: 8px; }
    .follow-order-card__title {
      font-size: 0.875rem;
      margin: 0 5px 0 0;
      color: #717171; }
    @media only screen and (min-width: 960px) {
        .follow-order-card__title {
          font-size: 1rem;
          font-weight: 300;
          margin-bottom: 7px;
          margin-top: 0; } }
    .follow-order-card__restaurant {
      color: #3e3e3e;
      font-size: 0.875rem;
      margin: 0;
      font-weight: 500; }
    @media only screen and (min-width: 960px) {
        .follow-order-card__restaurant {
          font-size: 16px; } }
    .follow-order-card__icon-arrow {
      margin-left: auto;
      -webkit-transform: translate(10px, 7px) rotate(-90deg);
              transform: translate(10px, 7px) rotate(-90deg);
      width: 28px; }
    .follow-order-card__icon-arrow svg {
        color: #a6a5a5;
        fill: #a6a5a5; }
    @media only screen and (min-width: 960px) {
        .follow-order-card__icon-arrow {
          width: 34px;
          -webkit-transform: translate(10px, 0px) rotate(-90deg);
                  transform: translate(10px, 0px) rotate(-90deg); } }
  
  .ph-highlights-carousel-item {
    width: 100%; }
    .ph-highlights-carousel-item__figure {
      width: 100%;
      height: 140px;
      margin: 0;
      border-radius: 4px; }
    @media only screen and (min-width: 768px) {
        .ph-highlights-carousel-item__figure {
          height: 200px; } }
  
  .ph-restaurant-menu {
    padding: 20px;
    height: 120px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eeeeee; }
    @media only screen and (min-width: 960px) {
      .ph-restaurant-menu {
        width: calc(50% - 20px);
        padding: 20px;
        border: 1px solid #eeeeee;
        border-radius: 4px;
        margin: 30px 0 10px; } }
    @media only screen and (min-width: 960px) {
      .ph-restaurant-menu-container {
        padding: 0 30px; } }
    @media only screen and (min-width: 1248px) {
      .ph-restaurant-menu-container {
        max-width: calc(1366px - 430px);
        margin: auto; } }
    @media only screen and (min-width: 1440px) {
      .ph-restaurant-menu-container {
        padding-right: 0; } }
    .ph-restaurant-menu-container .ph-restaurant-menu-title {
      display: none;
      width: 250px;
      height: 27px;
      margin-top: 40px; }
    @media only screen and (min-width: 960px) {
        .ph-restaurant-menu-container .ph-restaurant-menu-title {
          display: flex; } }
    @media only screen and (min-width: 960px) {
      .ph-restaurant-menu-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between; } }
    .ph-restaurant-menu .lines {
      width: 80%; }
    .ph-restaurant-menu .lines > * {
        margin: 5px 0; }
    .ph-restaurant-menu .lines *:nth-child(1) {
        width: 65%; }
    .ph-restaurant-menu .lines *:nth-child(2) {
        width: 75%; }
    .ph-restaurant-menu .lines *:nth-child(3) {
        width: 70%; }
    .ph-restaurant-menu .lines *:nth-child(4) {
        width: 30%;
        margin: 15px 0 0 0; }
    .ph-restaurant-menu__rect {
      width: 90px;
      height: 90px; }
  
  .ph-cuisine-item {
    display: inline-block; }
    .ph-cuisine-item__figure {
      margin: 0;
      border-radius: 50%;
      width: 80px;
      height: 80px; }
    @media only screen and (min-width: 960px) {
        .ph-cuisine-item__figure {
          width: 110px;
          height: 110px;
          border-radius: 50%;
          margin: 0 auto; } }
    .ph-cuisine-item__figure.ph-loading {
        border-radius: 50%; }
    .ph-cuisine-item__title {
      margin-top: 20px;
      height: 16px; }
  
  .delivery-input-wrapper {
    flex: 0 0 1; }
    .delivery-input-wrapper__title {
      font-size: 0.875rem;
      height: 12px;
      color: #a6a5a5;
      text-transform: uppercase;
      margin: 0 0 5px 0; }
    .delivery-input {
    display: flex;
    flex-direction: row;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    border: none;
    background-color: #fff;
    padding: 0;
    height: 25px;
    cursor: default; }
    @media only screen and (min-width: 768px) {
      .delivery-input {
        cursor: pointer; } }
    .delivery-input__item {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center; }
    .delivery-input__item:first-child {
        margin-right: 12px; }
    .delivery-input__icon-map {
      width: 20px;
      flex-shrink: 0;
      margin: 0 5px 0 0;
      display: none; }
    .delivery-input__icon-map svg {
        color: #3e3e3e;
        fill: #3e3e3e; }
    @media only screen and (min-width: 960px) {
        .delivery-input__icon-map {
          display: flex; } }
    .delivery-input__icon-arrow {
      width: 25px;
      height: 25px;
      flex-shrink: 0; }
    .delivery-input__icon-arrow svg {
        color: #ffe115;
        fill: #ffe115; }
    @media only screen and (min-width: 960px) {
        .delivery-input__icon-arrow svg {
          color: #3e3e3e;
          fill: #3e3e3e; } }
    .delivery-input__address-number {
      margin: 0 0 0 3px;
      flex-shrink: 0; }
    .delivery-input__address {
      font-size: 1rem;
      margin-left: 3px;
      color: #3e3e3e;
      display: flex;
      align-items: center;
      font-weight: 500;
      text-align: left; }
    @media only screen and (min-width: 768px) {
        .delivery-input__address {
          margin-left: 3px;
          font-size: 1rem;
          font-weight: 300;
          color: #3e3e3e; } }
  
  .ph-restaurant-card {
    border: 1px solid #f2f2f2;
    display: grid;
    transition: 200ms;
    height: 90px;
    padding: 12px;
    border-radius: 4px;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
    text-decoration: none;
    width: 100%;
    grid-template-columns: 60px 1px 1fr;
    grid-template-areas: "figure divider content";
    grid-column-gap: 12px; }
    @media only screen and (min-width: 960px) {
      .ph-restaurant-card {
        height: 130px;
        grid-template-columns: 85px 1px 1fr;
        grid-column-gap: 20px;
        padding: 20px; } }
    .ph-restaurant-card:before {
      grid-area: divider;
      content: '';
      width: 1px;
      background-color: #f2f2f2; }
    .ph-restaurant-card__figure {
      grid-area: figure; }
    .ph-restaurant-card__content {
      grid-area: content;
      display: grid;
      grid-template-rows: 1fr 20px; }
    .ph-restaurant-card__header {
      width: 85%;
      height: 18px;
      margin-bottom: 6px; }
    .ph-restaurant-card__info {
      width: 65%;
      height: 14px; }
    .ph-restaurant-card__footer {
      width: 45%;
      height: 14px; }
  
  .home-header {
    background: #fff;
    padding: 20px 20px 14px 20px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 9997;
    border-top: none;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2); }
    .home-header .delivery-input__address {
      margin-left: 0; }
    .home-header .delivery-input-wrapper {
      flex: 1; }
  
  .ph-waiting-steps {
    width: 100%; }
    .ph-waiting-steps .ph-step-icon {
      height: 20px;
      width: 20px;
      border-radius: 100%;
      margin-top: 12px;
      margin-right: 12px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-steps .ph-step-icon {
          height: 24px;
          width: 24px;
          margin-right: 40px; } }
    .ph-waiting-steps .ph-step {
      display: flex; }
    .ph-waiting-steps .ph-step-items {
      width: 100%; }
    .ph-waiting-steps .ph-step-title {
      width: 35%;
      height: 15px;
      margin-bottom: 2px;
      margin-top: 12px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-steps .ph-step-title {
          height: 20px;
          margin-bottom: 2px;
          margin-top: 0; } }
    .ph-waiting-steps .ph-step-time {
      width: 15%;
      height: 13px;
      margin-bottom: 5px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-steps .ph-step-time {
          height: 18px;
          margin-bottom: 3px; } }
    .ph-waiting-steps .ph-step-description {
      width: 85%;
      height: 13px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-steps .ph-step-description {
          height: 18px;
          margin-bottom: 35px; } }
    .ph-waiting-steps .ph-step-call {
      width: 75%;
      height: 14px;
      margin-top: 25px;
      margin-bottom: 5px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-steps .ph-step-call {
          display: none; } }
    .ph-waiting-steps .ph-step-contact {
      height: 14px;
      width: 85%;
      margin-bottom: 20px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-steps .ph-step-contact {
          display: none; } }
  
  .nav-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    overflow: hidden;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    left: 0;
    min-height: 60px;
    z-index: 9997; }
    .nav-header--primary {
      background: #fff;
      box-shadow: 0px -1px 4px rgba(0, 0, 0, 0.1); }
    .nav-header--primary .nav-header__title {
        color: #3e3e3e; }
    @media only screen and (min-width: 960px) {
        .nav-header--primary .btn-icon {
          cursor: pointer; } }
    .nav-header--primary .btn-icon .icon-marmita svg {
        color: #ffe115;
        fill: #ffe115; }
    .nav-header--fixed {
      position: fixed;
      width: 100%; }
    .nav-header--transparent {
      background: transparent; }
    .nav-header--transparent .nav-header__title {
        color: #717171; }
    .nav-header--transparent .btn-icon .icon-marmita svg {
        color: #ffe115;
        fill: #ffe115; }
    .nav-header--tertiary .nav-header__title {
      color: #fff; }
    .nav-header--tertiary .btn-icon .icon-marmita svg {
      color: #fed298;
      fill: #fed298; }
    .nav-header--with-padding {
      padding: 10px 20px; }
    .nav-header__title {
      font-size: 0.75rem;
      font-weight: 500;
      left: 0;
      margin: 0;
      padding: 2px 50px 0 50px;
      position: absolute;
      text-align: center;
      text-transform: uppercase;
      width: 100%;
      z-index: 0; }
    .nav-header__subtitle {
      font-size: 0.9375rem;
      font-weight: 300;
      text-transform: capitalize;
      color: #a6a6a6; }
    .nav-header .btn-icon {
      margin: 0;
      z-index: 1;
      border-radius: 0;
      height: 40px;
      width: 50px;
      left: -17px;
      padding: 0 0 0 14px; }
    .nav-header__left-button {
      justify-content: flex-start; }
  
  .ph-waiting-restaurant-name {
    position: absolute;
    right: 0;
    top: 10px;
    width: 100%; }
    @media only screen and (min-width: 960px) {
      .ph-waiting-restaurant-name {
        bottom: 0;
        top: auto;
        padding-left: 22px; } }
    .ph-waiting-restaurant-name .ph-restaurant-title {
      width: 75%;
      height: 25px;
      margin-bottom: 2px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-restaurant-name .ph-restaurant-title {
          width: 90%;
          height: 50px;
          margin-bottom: 5px; } }
    .ph-waiting-restaurant-name .ph-restaurant-order {
      width: 35%;
      height: 14px;
      margin-bottom: 2px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-restaurant-name .ph-restaurant-order {
          width: 45%;
          height: 18px; } }
    .ph-waiting-restaurant-name .ph-step-call {
      display: none;
      width: 75%;
      height: 14px;
      margin-top: 150px;
      margin-bottom: 5px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-restaurant-name .ph-step-call {
          display: block; } }
    .ph-waiting-restaurant-name .ph-step-contact {
      display: none;
      height: 14px;
      width: 85%;
      margin-bottom: 60px; }
    @media only screen and (min-width: 960px) {
        .ph-waiting-restaurant-name .ph-step-contact {
          display: block; } }
  
  .restaurant-info--loading {
    border-bottom: 10px solid #e6e6e6;
    border-radius: 4px 4px 0 0;
    color: #595856;
    padding: 40px 20px 0 20px;
    margin-top: 70px;
    position: relative;
    top: -5px;
    min-height: 165px;
    display: flex;
    flex-direction: column; }
    @media only screen and (min-width: 960px) {
      .restaurant-info--loading {
        border-bottom: 0;
        border-radius: 0;
        padding: 0;
        margin: 30px 0 0;
        top: 0; } }
    @media only screen and (min-width: 1248px) {
      .restaurant-info--loading {
        max-width: calc(1366px - 430px);
        margin: auto;
        margin-top: 30px; } }
    @media only screen and (min-width: 960px) {
      .restaurant-info--loading-wrapper {
        padding: 0 30px; } }
    @media only screen and (min-width: 1248px) {
      .restaurant-info--loading-wrapper {
        padding-right: 0; } }
    .restaurant-info--loading .ph-loading {
      margin: 0 0 10px 0; }
    .restaurant-info--loading .restaurant-info__title {
      width: 50%; }
    .restaurant-info--loading .restaurant-info__logo {
      border-radius: 100%; }
    .restaurant-info--loading .restaurant-info__link-more {
      margin: 30px 0 0;
      width: 50px; }
    .restaurant-info__subtitle--loading {
    width: 60%;
    height: 25px; }
  
  .search-targeted {
    position: absolute;
    background: #fff;
    border: 1px solid #f7f7f7;
    box-sizing: border-box;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    left: 17px;
    right: 9px;
    padding: 20px 30px; }
    .search-targeted__title {
      font-size: 16px;
      margin: 0 0 10px; }
    .search-targeted .search-targeted__options .search-targeted__option {
      font-size: 14px; }
    .search-targeted .search-targeted__options .search-targeted__option .btn {
        color: #a6a6a6;
        font-weight: initial;
        height: 40px;
        padding: 0;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-start; }
    .search-targeted .search-targeted__options .search-targeted__option .btn:focus, .search-targeted .search-targeted__options .search-targeted__option .btn:hover, .search-targeted .search-targeted__options .search-targeted__option .btn:active {
          color: #717171; }
    .search-targeted .search-targeted__options .search-targeted__option .btn:focus svg,
          .search-targeted .search-targeted__options .search-targeted__option .btn:focus path, .search-targeted .search-targeted__options .search-targeted__option .btn:hover svg,
          .search-targeted .search-targeted__options .search-targeted__option .btn:hover path, .search-targeted .search-targeted__options .search-targeted__option .btn:active svg,
          .search-targeted .search-targeted__options .search-targeted__option .btn:active path {
            fill: #717171;
            color: #717171; }
    .search-targeted .search-targeted__options .search-targeted__option .icon-marmita {
        width: 20px;
        margin: 0 5px 0 0; }
    @media only screen and (min-width: 375px) {
          .search-targeted .search-targeted__options .search-targeted__option .icon-marmita {
            margin: 0 15px 0 0; } }
    .search-targeted .search-targeted__options .search-targeted__option .icon-marmita svg,
        .search-targeted .search-targeted__options .search-targeted__option .icon-marmita path {
          fill: #a6a6a6;
          color: #a6a6a6; }
    .search-targeted__text {
      color: #3e3e3e;
      white-space: nowrap;
      max-width: 84px;
      overflow: hidden;
      text-overflow: ellipsis; }
    @media only screen and (min-width: 334px) and (max-width: 359px) {
        .search-targeted__text {
          max-width: 100px; } }
    @media only screen and (min-width: 360px) and (max-width: 400px) {
        .search-targeted__text {
          max-width: 130px; } }
    @media only screen and (min-width: 420px) and (max-width: 499px) {
        .search-targeted__text {
          max-width: 160px; } }
    @media only screen and (min-width: 500px) and (max-width: 767px) {
        .search-targeted__text {
          max-width: 200px; } }
    @media only screen and (min-width: 768px) and (max-width: 960px) {
        .search-targeted__text {
          max-width: 400px; } }
    @media only screen and (min-width: 960px) and (max-width: 1248px) {
        .search-targeted__text {
          max-width: 100px; } }
    @media only screen and (min-width: 1248px) {
        .search-targeted__text {
          max-width: 160px; } }
    .search-targeted__text-dot {
      width: 5px;
      background-color: #3e3e3e;
      border-radius: 50%;
      height: 5px;
      display: inline-block;
      vertical-align: middle;
      margin: 0 6px; }
    @media only screen and (min-width: 375px) {
        .search-targeted__text-dot {
          margin: 0 10px; } }
  
  .ph-address-btn {
    height: 78px;
    width: 100%;
    border-radius: 8px;
    border: 1px solid #f2f2f2;
    min-height: 80px;
    display: grid;
    grid-template-columns: 60px 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas: "icon title" "icon subtitle";
    gap: 0 10px; }
    .ph-address-btn__icon {
      grid-area: icon;
      height: 30px;
      width: 30px;
      justify-self: center;
      align-self: center;
      border-radius: 4px; }
    .ph-address-btn__title {
      grid-area: title;
      height: 16px;
      align-self: end;
      width: 60%;
      border-radius: 4px; }
    .ph-address-btn__subtitle {
      grid-area: subtitle;
      height: 12px;
      margin-top: 10px;
      width: 80%;
      border-radius: 4px; }
  
  .search-input {
    width: 100%; }
    @media only screen and (min-width: 960px) {
      .search-input {
        max-width: 450px;
        min-width: 370px;
        padding: 0 9px 0 17px;
        position: relative; } }
    .search-input__icon-search {
      width: 24px;
      height: 24px; }
    .search-input__icon-search svg {
        color: #ffe115;
        fill: #ffe115; }
    @media only screen and (min-width: 960px) {
        .search-input__icon-search {
          width: 26px;
          height: 26px;
          left: 20px;
          top: 50%;
          position: absolute;
          -webkit-transform: translateY(-50%);
                  transform: translateY(-50%);
          pointer-events: none; }
          .search-input__icon-search svg {
            color: #414143;
            fill: #414143; } }
    .search-input__form {
      display: grid;
      grid-template: 1fr / 1fr;
      height: 40px;
      position: relative; }
    @media only screen and (min-width: 960px) {
        .search-input__form {
          height: 100%; } }
    .search-input .btn {
      padding: 0 0 0 10px;
      margin: 0; }
    .search-input .btn-visibility--hidden {
        visibility: hidden; }
    .search-input__field-wrapper {
      flex-grow: 1;
      display: flex;
      align-items: center;
      background-color: #f6f5f5;
      padding: 0 5px 0 12px;
      border-radius: 4px;
      margin-right: 0;
      width: 100%;
      position: relative; }
    @media only screen and (min-width: 960px) {
        .search-input__field-wrapper {
          padding: 0; } }
    .search-input__field {
      width: 100%;
      height: 100%;
      padding-left: 12px;
      border: none;
      font-size: 1rem;
      background-color: transparent; }
    @media only screen and (min-width: 960px) {
        .search-input__field {
          display: flex;
          height: 50px;
          padding-left: 53px;
          padding-right: 0;
          border: 1px solid #f2f2f2;
          line-height: 1.25em;
          font-weight: 300;
          background: #f7f7f7;
          border-radius: 4px; } }
    .search-input__field::-webkit-input-placeholder {
        color: #a6a6a5;
        margin: 0;
        font-weight: 400;
        font-size: 1rem; }
    .search-input__field:-ms-input-placeholder {
        color: #a6a6a5;
        margin: 0;
        font-weight: 400;
        font-size: 1rem; }
    .search-input__field::-ms-input-placeholder {
        color: #a6a6a5;
        margin: 0;
        font-weight: 400;
        font-size: 1rem; }
    .search-input__field::placeholder {
        color: #a6a6a5;
        margin: 0;
        font-weight: 400;
        font-size: 1rem; }
    @media only screen and (min-width: 960px) {
          .search-input__field::-webkit-input-placeholder {
            font-weight: 300; }
          .search-input__field:-ms-input-placeholder {
            font-weight: 300; }
          .search-input__field::-ms-input-placeholder {
            font-weight: 300; }
          .search-input__field::placeholder {
            font-weight: 300; } }
    .search-input__field:focus::-webkit-input-placeholder {
        opacity: 0; }
    @media only screen and (min-width: 960px) {
      .search-input__erase-button {
        background: transparent;
        border: none;
        margin: 0;
        padding: 10px;
        position: absolute;
        right: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%); } }
  
  .restaurant-cart-footer__info > * {
    height: 32px;
    line-height: 32px;
    font-weight: 300; }
  
  .restaurant-cart-footer__info-description {
    color: #717171; }
  
  .restaurant-cart-footer__green-text {
    color: #50a773; }
  
  .restaurant-cart-footer__button-wrapper--hide {
    display: none; }
  
  .restaurant-cart-footer__delivery-fee-info {
    width: 20px;
    height: 20px;
    border-radius: 100%; }
  
  .restaurant-cart-footer__delivery-fee-info .btn__label {
      top: 2px; }
  
  .restaurant-cart-footer__delivery-fee-info::before {
      content: '';
      height: 17px;
      width: 17px;
      border-radius: 100%;
      display: block;
      background: transparent;
      position: absolute;
      border: 1px solid #a6a5a5; }
  
  .restaurant-cart-footer__total {
    font-weight: 500; }
  
  .restaurant-cart-footer__total .restaurant-cart-footer__info-description {
      color: #3f3e3e; }
  
  .restaurant-cart-footer__loading {
    text-align: center;
    margin: 20px 0; }
  
  .restaurant-cart-header {
    margin: 0 30px;
    padding: 20px 0; }
    .restaurant-cart-header__pretitle {
      color: #717171;
      font-weight: 300;
      font-size: 0.875rem; }
    .restaurant-cart-header__title {
      margin: 8px 0 0 0;
      font-size: 1.375rem;
      font-weight: 500; }
    .restaurant-cart-header__link {
      height: 25px;
      padding: 0;
      margin-top: 8px;
      font-size: 0.875rem; }
    .restaurant-cart-header__link .btn__label {
        text-align: left; }
  
  .promotional-tag {
    color: #2e6788;
    display: flex;
    font-size: 0.75rem;
    font-weight: normal;
    margin: 5px 0; }
    .promotional-tag .icon-marmita {
      margin-right: 3px;
      width: 12px; }
    .promotional-tag .icon-marmita svg {
        color: #2e6788;
        fill: #2e6788; }
  
  .address-invalid-dialog {
    padding: 20px;
    width: 400px; }
    .address-invalid-dialog__address, .address-invalid-dialog__text {
      font-size: 1.125rem;
      line-height: 1.375em; }
    .address-invalid-dialog__text {
      margin-top: 0;
      color: #a6a5a5;
      margin-left: 15px; }
    .address-invalid-dialog__title {
      font-size: 1.375rem;
      font-weight: 500;
      color: #595756; }
    .address-invalid-dialog__address {
      color: #595756;
      text-transform: capitalize; }
    @media only screen and (max-width: 767px) {
      .address-invalid-dialog {
        width: 100%; } }
    .address-invalid-wrapper {
    display: flex;
    align-items: flex-start; }
    .address-invalid-from__icon svg {
    color: #a6a5a5;
    fill: #a6a5a5; }
    .address-invalid-to__icon svg {
    color: #ffe115;
    fill: #ffe115; }
    .address-invalid-from__icon,
  .address-invalid-to__icon {
    background: #fff;
    padding: 2px;
    width: 28px;
    height: 28px; }
    .address-invalid-from svg,
  .address-invalid-to svg {
    width: 24px;
    height: 24px; }
    .address-invalid-from + .address-invalid-to .address-invalid-to__icon {
    position: relative;
    z-index: 0; }
    .address-invalid-from + .address-invalid-to .address-invalid-to__icon::before {
      content: '';
      display: block;
      position: absolute;
      z-index: -1;
      width: 3px;
      height: 35px;
      top: 0;
      left: 50%;
      -webkit-transform: translate(-50%, -100%);
              transform: translate(-50%, -100%);
      background: #f5e9da; }
  
  .dish-quick-add__button {
    display: inline-block; }
    .dish-quick-add__button--hidden {
      display: none; }
    .dish-quick-add__counter {
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    width: 0; }
    .dish-quick-add__counter--opened {
      width: 100px;
      visibility: visible;
      opacity: 1;
      transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
    .dish-quick-add__counter .marmita-counter {
      background: #fff;
      border: 0.5px solid #f2f2f2;
      bottom: 16px;
      width: 100px;
      justify-content: space-evenly;
      border-radius: 8px;
      box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.08); }
  
  .restaurant-cart-item {
    font-size: 1rem;
    font-size: 500; }
    .restaurant-cart-item__description {
      margin: 0.5em 0;
      line-height: 1.4; }
    .restaurant-cart-item__description :last-child {
        font-weight: 500; }
    .restaurant-cart-item__garnish, .restaurant-cart-item__obs {
      font-size: 0.875rem;
      font-weight: 300;
      color: #717171;
      margin: 0.5em 0;
      line-height: 1.3;
      word-wrap: break-word;
      overflow-wrap: break-word; }
    .restaurant-cart-item__garnish > span:not(:first-child) {
      margin-left: 5px; }
    .restaurant-cart-item__buttons-wrapper {
      display: flex;
      align-items: center; }
    .restaurant-cart-item__buttons-wrapper .dish-quick-add {
        margin-left: auto; }
    .restaurant-cart-item__button {
      height: 100%;
      font-size: 0.875rem;
      padding: 0;
      width: 70px;
      margin-right: 10px; }
    .restaurant-cart-item__button .btn__label {
        text-align: left; }
  
  .restaurant-cart-items-list {
    overflow-y: auto; }
  
  @-webkit-keyframes sticky-display-progress {
    0% {
      max-height: 0;
      padding-top: 0; }
    100% {
      max-height: 50px;
      padding-top: 10px; } }
  
  @keyframes sticky-display-progress {
    0% {
      max-height: 0;
      padding-top: 0; }
    100% {
      max-height: 50px;
      padding-top: 10px; } }
  
  @-webkit-keyframes sticky-display-completed {
    0%, 90% {
      max-height: 50px;
      padding-top: 10px; }
    100% {
      max-height: 0;
      padding-top: 0; } }
  
  @keyframes sticky-display-completed {
    0%, 90% {
      max-height: 50px;
      padding-top: 10px; }
    100% {
      max-height: 0;
      padding-top: 0; } }
  
  .delivery-discount-with-min-order {
    padding: 12px 0;
    font-weight: 300;
    font-size: 0.75rem;
    line-height: 1rem;
    position: relative; }
  
  @media only screen and (max-width: 959px) {
      .delivery-discount-with-min-order {
        margin-top: 10px; }
        .delivery-discount-with-min-order::before {
          content: '';
          width: calc(100% - 40px);
          height: 0;
          display: block;
          background: transparent;
          position: absolute;
          left: 20px;
          top: 0;
          border-top: 1px solid #f5f0eb; }
        .delivery-discount-with-min-order:before {
          width: 100%;
          left: 0; } }
  
  @media only screen and (min-width: 960px) {
      .delivery-discount-with-min-order {
        padding: 36px 32px 32px 32px;
        background-color: #f7f7f7;
        font-weight: 300;
        font-size: 1rem;
        line-height: 1.25rem; } }
  
  .delivery-discount-with-min-order .icon-marmita {
      display: none; }
  
  .delivery-discount-with-min-order strong {
      color: #2e6788; }
  
  .delivery-discount-with-min-order__progress {
      width: 100%;
      height: 3px;
      border-radius: 3px;
      background-color: #dcdcdc;
      position: relative; }
  
  @media only screen and (min-width: 960px) {
        .delivery-discount-with-min-order__progress {
          height: 5px;
          border-radius: 5px; } }
  
  .delivery-discount-with-min-order__progress-value {
      position: absolute;
      height: 3px;
      border-radius: 3px;
      background-color: #2e6788;
      transition: all 300ms ease;
      width: 0; }
  
  @media only screen and (min-width: 960px) {
        .delivery-discount-with-min-order__progress-value {
          height: 5px;
          border-radius: 5px; } }
  
  .delivery-discount-with-min-order__message {
      text-align: center;
      height: 1rem;
      margin-bottom: 8px;
      overflow: hidden;
      color: #717171; }
  
  @media only screen and (min-width: 960px) {
        .delivery-discount-with-min-order__message {
          text-align: left;
          height: 1.25rem;
          margin-bottom: 12px; } }
  
  .delivery-discount-with-min-order__message p {
        margin: 0;
        overflow: hidden;
        transition: all 300ms ease; }
  
  .delivery-discount-with-min-order__message > :first-child {
        max-height: 9000px;
        opacity: 1;
        visibility: visible; }
  
  .delivery-discount-with-min-order__message > :last-child {
        max-height: 0;
        opacity: 0;
        visibility: hidden; }
  
  .delivery-discount-with-min-order__message--completed > :first-child {
      max-height: 0;
      opacity: 0;
      visibility: hidden; }
  
  .delivery-discount-with-min-order__message--completed > :last-child {
      max-height: 9000px;
      opacity: 1;
      visibility: visible; }
  
  .delivery-discount-with-min-order--completed strong {
      color: #50a773; }
  
  .delivery-discount-with-min-order--completed .delivery-discount-with-min-order__progress-value {
      background-color: #50a773; }
  
  .delivery-discount-with-min-order--description-only {
      background-color: #f7f7f7;
      padding: 10px 14px;
      border-radius: 4px;
      margin: 0 0 10px 0; }
  
  .delivery-discount-with-min-order--description-only:before {
        display: none; }
  
  .delivery-discount-with-min-order--menu {
      background-color: #f7f7f7;
      padding: 10px 14px;
      border-radius: 4px;
      margin: 0 0 10px 0; }
  
  .delivery-discount-with-min-order--menu p {
        text-align: left; }
  
  .delivery-discount-with-min-order--menu .icon-marmita {
        display: inline-flex;
        height: 11.5px;
        width: 11.5px;
        -webkit-transform: translateY(2px);
                transform: translateY(2px);
        margin-right: 8px; }
  
  .delivery-discount-with-min-order--menu .icon-marmita svg {
          color: #2e6788;
          fill: #2e6788; }
  
  @media only screen and (min-width: 960px) {
        .delivery-discount-with-min-order--menu {
          width: -webkit-fit-content;
          width: -moz-fit-content;
          width: fit-content; } }
  
  .delivery-discount-with-min-order--menu:before {
        display: none; }
  
  .delivery-discount-with-min-order--sticky {
      display: none;
      overflow: hidden;
      margin: 0;
      max-height: 0;
      padding: 0; }
  
  .delivery-discount-with-min-order--sticky p {
        margin: 0 14px;
        text-align: center; }
  
  .delivery-discount-with-min-order--is-sticky {
      display: block;
      -webkit-animation: sticky-display-progress 200ms linear 250ms forwards;
              animation: sticky-display-progress 200ms linear 250ms forwards; }
  
  .delivery-discount-with-min-order--completed-sticky {
      display: block;
      max-height: 50px;
      padding-top: 10px;
      -webkit-animation: sticky-display-completed 2000ms linear 250ms forwards;
              animation: sticky-display-completed 2000ms linear 250ms forwards; }
  
  .delivery-discount-with-min-order__min-order-description {
      display: flex;
      flex-direction: row; }
  
  .delivery-discount-with-min-order__min-order-description p {
        margin: 0; }
  
  .delivery-discount-with-min-order__min-order-description strong {
        color: #2e6788; }
  
  .delivery-discount-with-min-order__min-order-description .icon-marmita {
        display: inline-flex;
        height: 11.5px;
        width: 11.5px;
        -webkit-transform: translateY(2px);
                transform: translateY(2px);
        margin-right: 8px; }
  
  .delivery-discount-with-min-order__min-order-description .icon-marmita svg {
          color: #2e6788;
          fill: #2e6788; }
  
  .experimental-feature::before {
    content: 'EF';
    width: 12px;
    font-size: 9px;
    color: #fff;
    background: #f90;
    position: absolute;
    padding: 5px 10px 3px;
    border-radius: 10px;
    text-transform: uppercase;
    transition: 0.4s;
    z-index: 99999999;
    white-space: nowrap; }
  
  .experimental-feature:hover::before {
    content: 'experimental feature';
    width: 114px; }
  
  .experimental-feature + * {
    border: 1px solid #f7990257;
    border-radius: 5px; }
  
  .voucher-animation > svg {
    width: 40px;
    height: 40px; }
  
  .checkout-voucher {
    display: grid;
    grid-template-columns: 10% 80% 10%;
    align-items: center;
    height: 80px;
    margin: 0 20px;
    line-height: 16px;
    border-top: 1px solid #dcdcdc;
    cursor: pointer; }
    @media only screen and (min-width: 960px) {
      .checkout-voucher {
        border-bottom: none;
        margin: 0 30px; } }
    .checkout-voucher__voucher-icon {
      width: 34px;
      height: 34px; }
    .checkout-voucher__description {
      display: flex;
      flex-direction: column;
      margin-left: 12px; }
    .checkout-voucher__title {
      font-size: 1rem;
      color: #3e3e3e;
      margin: 0 0 4px 0; }
    .checkout-voucher__subtitle {
      margin: 0;
      font-size: 0.875rem;
      font-weight: 100;
      line-height: 1.25rem;
      color: #717171; }
    .checkout-voucher__icon-wrapper {
      position: relative; }
    .checkout-voucher__icon-wrapper .icon-marmita svg {
        width: 40px;
        height: 40px; }
    .checkout-voucher__chevron-icon {
      display: flex;
      width: 100%;
      height: 100%;
      stroke: #ffe115;
      stroke-width: 2px;
      justify-content: flex-end;
      align-items: center; }
    .checkout-voucher__chevron-icon svg {
        -webkit-transform: rotate(90deg);
                transform: rotate(90deg);
        width: 12px; }
    .checkout-voucher__chevron-icon path {
        fill: #ffe115; }
    .checkout-voucher__animated-icon {
      position: absolute;
      opacity: 1;
      top: -22px; }
  
  .voucher-guide {
    background-color: #f7f7f7;
    border-radius: 0 0 4px 4px;
    padding: 12px;
    margin: 0 20px;
    display: grid;
    grid-template-areas: 'title action' 'progress action';
    grid-template-columns: 1fr -webkit-min-content;
    grid-template-columns: 1fr min-content;
    grid-gap: 5px 16px; }
    @media only screen and (min-width: 960px) {
      .voucher-guide {
        margin: 0 30px 18px; } }
    .voucher-guide__content-title {
      display: grid;
      align-items: center;
      grid-template: 1fr / 1fr 70px;
      grid-auto-columns: auto;
      grid-auto-flow: column dense;
      padding: 0 0 6px; }
    .voucher-guide__title {
      font-size: 0.75rem;
      line-height: 1rem;
      color: #717171;
      grid-area: title; }
    .voucher-guide__complete-order {
      font-size: 0.75rem;
      line-height: 1rem;
      color: #ffe115;
      text-decoration: none;
      text-align: right;
      grid-area: action;
      align-self: center; }
    .voucher-guide__progress {
      grid-area: progress;
      width: 100%; }
  
  @-webkit-keyframes z-1-movement {
    0% {
      -webkit-transform: translate(0, 0px);
              transform: translate(0, 0px); }
    50% {
      -webkit-transform: translate(5px, -5px);
              transform: translate(5px, -5px); }
    100% {
      -webkit-transform: translate(0, 0px);
              transform: translate(0, 0px); } }
  
  @keyframes z-1-movement {
    0% {
      -webkit-transform: translate(0, 0px);
              transform: translate(0, 0px); }
    50% {
      -webkit-transform: translate(5px, -5px);
              transform: translate(5px, -5px); }
    100% {
      -webkit-transform: translate(0, 0px);
              transform: translate(0, 0px); } }
  
  @-webkit-keyframes z-2-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(5px, 10px);
              transform: translate(5px, 10px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @keyframes z-2-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(5px, 10px);
              transform: translate(5px, 10px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @-webkit-keyframes z-3-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(-5px, 12px);
              transform: translate(-5px, 12px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @keyframes z-3-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(-5px, 12px);
              transform: translate(-5px, 12px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  .restaurant-cart {
    display: flex;
    flex-flow: nowrap column;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 430px;
    background-color: #fff;
    color: #3f3e3e; }
  
  @media only screen and (min-width: 1248px) {
      .restaurant-cart {
        width: 430px; } }
  
  .restaurant-cart__warning {
      background-color: #f7f7f7;
      color: #4d4d4d;
      padding: 30px;
      font-weight: 300;
      line-height: 1.4; }
  
  .restaurant-cart__line {
      border-top: #dcdcdc solid 1px;
      margin: 0 30px;
      padding: 12px 0 16px; }
  
  .restaurant-cart__justify {
      display: flex;
      flex-flow: row nowrap; }
  
  .restaurant-cart__justify > * {
        flex-grow: 1; }
  
  .restaurant-cart__justify > :last-child {
        min-width: 80px;
        text-align: right; }
  
  .restaurant-cart__loading, .restaurant-cart__empty {
      display: flex;
      flex-flow: column nowrap;
      justify-content: center;
      text-align: center;
      height: 100%; }
  
  .restaurant-cart__empty {
      color: #dcdcdc; }
  
  .restaurant-cart__empty .restaurant-card-empty-icon {
        height: 270px;
        width: auto;
        margin: 0 auto 32px auto; }
  
  .restaurant-cart__empty .restaurant-cart__empty--large {
        font-size: 1rem;
        color: #3e3e3e;
        font-weight: 500; }
  
  .restaurant-cart__empty .restaurant-cart__empty--small {
        font-size: 0.875rem;
        font-weight: 400;
        color: #717171;
        margin: 10px 0 0 0; }
  
  .restaurant-cart__empty .animated-svg .z-1 {
        -webkit-transform-origin: top center;
                transform-origin: top center;
        -webkit-animation: z-1-movement 4.5s infinite;
                animation: z-1-movement 4.5s infinite;
        -webkit-animation-timing-function: ease-in-out;
                animation-timing-function: ease-in-out; }
  
  .restaurant-cart__empty .animated-svg .z-2 {
        -webkit-transform-origin: bottom center;
                transform-origin: bottom center;
        -webkit-animation: z-2-movement 6s infinite;
                animation: z-2-movement 6s infinite;
        -webkit-animation-timing-function: ease-in-out;
                animation-timing-function: ease-in-out; }
  
  .restaurant-cart__empty .animated-svg .z-3 {
        -webkit-transform-origin: bottom center;
                transform-origin: bottom center;
        -webkit-animation: z-3-movement 5s infinite;
                animation: z-3-movement 5s infinite;
        -webkit-animation-timing-function: ease-in-out;
                animation-timing-function: ease-in-out; }
  
  .restaurant-cart .restaurant-cart-items-list {
      max-height: 60vh; }
  
  .placeholder-order-card {
    border-bottom: 2px solid #f6f5f5;
    padding: 20px 0;
    display: grid;
    align-items: flex-start;
    justify-content: center;
    grid-template: 1fr / 70px 1fr;
    margin: 0 0 20px; }
    .placeholder-order-card-wrapper {
      border: 1px solid #dcdcdc;
      border-radius: 4px;
      padding: 20px;
      margin: 0 0 20px; }
    @media only screen and (max-width: 959px) {
      .placeholder-order-card:first-child {
        padding: 0 0 20px; } }
    .placeholder-order-card__restaurant-name {
      height: 10px; }
    .placeholder-order-card__order-details {
      margin: 10px 0;
      height: 20px; }
    .placeholder-order-card__order-status {
      margin: 10px 0; }
    .placeholder-order-card__follow-order {
      height: 20px; }
    .placeholder-order-card__date {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
      width: 50px;
      height: 48px;
      padding: 5px;
      background-color: #f2f2f2;
      border-radius: 4px; }
  
  .goback {
    background-color: transparent;
    border: none;
    color: #a6a6a6;
    cursor: pointer;
    font-size: 1rem;
    padding: 0; }
    .goback__icon {
      width: 20px;
      fill: #a6a6a6;
      vertical-align: middle;
      margin-right: 4px; }
  
  .notification-overlay {
    background: rgba(0, 0, 0, 0.7);
    color: #fff; }
    .notification-overlay .marmita-modal__inner-content {
      display: none;
      max-width: 500px; }
    @media only screen and (min-width: 960px) {
        .notification-overlay .marmita-modal__inner-content {
          display: block; } }
    .notification-overlay__title {
      font-size: 1.875rem; }
    .notification-overlay__subtitle {
      font-size: 1.25rem;
      font-weight: 100; }
  
  .placeholder-order-details-wrapper {
    width: 100%;
    padding: 0 20px; }
    .placeholder-order-details-wrapper .goback {
      display: none; }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details-wrapper {
        margin: 20px auto;
        width: 470px;
        padding-top: 40px; }
        .placeholder-order-details-wrapper .goback {
          display: block; } }
    .placeholder-order-details__order-title {
    height: 16px;
    margin: 14px 0 8px 0;
    width: 60%; }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details__order-title {
        height: 40px;
        margin: 10px 0; } }
    .placeholder-order-details__see-menu {
    width: 25%;
    height: 16px;
    margin-bottom: 36px;
    display: none; }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details__see-menu {
        display: block; } }
    .placeholder-order-details__order-delivery {
    width: 85%;
    height: 16px;
    margin-bottom: 10px; }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details__order-delivery {
        width: 35%; } }
    .placeholder-order-details__order-delivery--date {
      width: 40%;
      display: none; }
    @media only screen and (min-width: 960px) {
        .placeholder-order-details__order-delivery--date {
          display: block; } }
    .placeholder-order-details__items-container {
    border-bottom: 1px solid rgba(196, 196, 196, 0.2);
    border-top: 1px solid rgba(196, 196, 196, 0.2);
    padding: 10px 0;
    display: flex;
    justify-content: space-between;
    flex-direction: row; }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details__items-container {
        padding: 25px 0;
        border-bottom: 1px solid #c4c4c4;
        border-top: 1px solid #c4c4c4; } }
    .placeholder-order-details__items-description {
    width: 60%;
    height: 16px; }
    .placeholder-order-details__items-value {
    width: 15%;
    height: 16px; }
    .placeholder-order-details__pricing-wrapper {
    padding: 10px 0;
    border-bottom: 0;
    margin-bottom: 25px; }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details__pricing-wrapper {
        padding: 15px 0;
        border-bottom: 1px solid rgba(196, 196, 196, 0.2); } }
    .placeholder-order-details__pricing-container {
    padding: 5px 0;
    display: flex;
    justify-content: space-between;
    flex-direction: row; }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details__pricing-container {
        padding: 10px 0; } }
    .placeholder-order-details__pricing-subtotal-title {
    width: 20%;
    height: 16px; }
    .placeholder-order-details__pricing-subtotal-value {
    width: 18%;
    height: 16px; }
    .placeholder-order-details__pricing-delivery-title {
    width: 25%;
    height: 16px; }
    .placeholder-order-details__pricing-delivery-value {
    width: 15%;
    height: 16px; }
    .placeholder-order-details__pricing-total-title {
    width: 12%;
    height: 16px; }
    .placeholder-order-details__pricing-total-value {
    width: 20%;
    height: 16px; }
    .placeholder-order-details__info-container {
    padding: 20px;
    border-top: 10px solid rgba(196, 196, 196, 0.2);
    width: 100vw;
    -webkit-transform: translateX(-20px);
            transform: translateX(-20px); }
    @media only screen and (min-width: 960px) {
      .placeholder-order-details__info-container {
        border: none;
        padding: 0;
        margin-bottom: 25px;
        width: 100%;
        -webkit-transform: translateX(0);
                transform: translateX(0); } }
    .placeholder-order-details__info-delivery-title {
    width: 25%;
    height: 16px;
    margin-bottom: 8px; }
    .placeholder-order-details__info-delivery-value {
    width: 70%;
    height: 16px; }
    .placeholder-order-details__info-order-title {
    width: 20%;
    height: 16px;
    margin-bottom: 8px; }
    .placeholder-order-details__info-order-value {
    width: 12%;
    height: 16px; }
    .placeholder-order-details__info-date-title {
    width: 25%;
    height: 16px;
    margin-bottom: 8px; }
    .placeholder-order-details__info-date-value {
    width: 35%;
    height: 16px; }
    .placeholder-order-details__info-payment-title {
    width: 30%;
    height: 16px;
    margin-bottom: 8px; }
    .placeholder-order-details__info-payment-value {
    width: 25%;
    height: 16px; }
    .placeholder-order-details__follow-container {
    padding: 20px 0;
    border-top: 1px solid rgba(196, 196, 196, 0.2);
    margin-top: 25px; }
    .placeholder-order-details__follow-button {
    height: 50px; }
  
  .notification-permission {
    display: grid;
    min-width: 320px;
    grid-template-columns: 42px 1fr;
    padding: 12px 0 11px 24px;
    position: relative;
    border: 1px solid #f7f7f7;
    overflow: hidden;
    height: 110px;
    opacity: 1;
    transition: all 300ms ease-out; }
    @media only screen and (min-width: 960px) {
      .notification-permission {
        max-width: 345px; } }
    .notification-permission--gray {
      background-color: #f7f7f7; }
    .notification-permission--hidden {
      height: 0;
      padding-top: 0;
      padding-bottom: 0;
      border: 0;
      opacity: 0.5; }
    .notification-permission__illustration {
      overflow: visible;
      align-self: center; }
    .notification-permission-center {
      display: grid;
      margin: 0 13px 0 15px; }
    .notification-permission-center__title {
        font-size: 0.875rem;
        margin-bottom: 10px;
        font-weight: 500;
        color: #3e3e3e; }
    .notification-permission-center__subtitle {
        font-size: 0.75rem;
        margin-bottom: 12px;
        color: #717171; }
    .notification-permission-center__button {
        font-size: 0.875rem;
        color: #ffe115; }
    .notification-permission-center__button.btn {
          width: 40px;
          height: 20px; }
    .notification-permission__close-button {
      display: block;
      width: 15px;
      height: 15px;
      padding: 0;
      top: 10px;
      right: 10px;
      position: absolute; }
    .notification-permission__close-button.btn.btn--iconize .icon-marmita.btn__icon {
        width: 15px;
        height: 15px; }
    .notification-permission__close-button.btn.btn--iconize .icon-marmita svg {
        fill: #a6a6a6;
        stroke: #a6a6a6;
        stroke-width: 2; }
    .notification-permission .phone-chat-ballon__ballon {
      -webkit-animation: phone-chat-ballon-animation 2s infinite linear alternate;
              animation: phone-chat-ballon-animation 2s infinite linear alternate;
      -webkit-transform-origin: center;
              transform-origin: center; }
    .notification-permission .phone-chat-ballon__ifood {
      -webkit-animation: phone-chat-ballon-ifood-animation 2s infinite linear alternate;
              animation: phone-chat-ballon-ifood-animation 2s infinite linear alternate;
      -webkit-transform-origin: center;
              transform-origin: center; }
    .notification-permission .phone-chat-ballon__alert {
      -webkit-animation: phone-chat-ballon-alert-animation 2s infinite linear alternate;
              animation: phone-chat-ballon-alert-animation 2s infinite linear alternate;
      -webkit-transform-origin: center;
              transform-origin: center; }
    @-webkit-keyframes phone-chat-ballon-ifood-animation {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    100% {
      -webkit-transform: translate(-2px, -1px);
              transform: translate(-2px, -1px); } }
    @keyframes phone-chat-ballon-ifood-animation {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    100% {
      -webkit-transform: translate(-2px, -1px);
              transform: translate(-2px, -1px); } }
    @-webkit-keyframes phone-chat-ballon-animation {
    0% {
      -webkit-transform: translate(0, 0) rotate(0);
              transform: translate(0, 0) rotate(0); }
    100% {
      -webkit-transform: translate(-1px, -1px) rotate(-3deg);
              transform: translate(-1px, -1px) rotate(-3deg); } }
    @keyframes phone-chat-ballon-animation {
    0% {
      -webkit-transform: translate(0, 0) rotate(0);
              transform: translate(0, 0) rotate(0); }
    100% {
      -webkit-transform: translate(-1px, -1px) rotate(-3deg);
              transform: translate(-1px, -1px) rotate(-3deg); } }
    @-webkit-keyframes phone-chat-ballon-alert-animation {
    0% {
      -webkit-transform: translate(0, 0) rotate(0);
              transform: translate(0, 0) rotate(0); }
    100% {
      -webkit-transform: translate(-2px, -2px) rotate(0);
              transform: translate(-2px, -2px) rotate(0); } }
    @keyframes phone-chat-ballon-alert-animation {
    0% {
      -webkit-transform: translate(0, 0) rotate(0);
              transform: translate(0, 0) rotate(0); }
    100% {
      -webkit-transform: translate(-2px, -2px) rotate(0);
              transform: translate(-2px, -2px) rotate(0); } }
  
  .search-placeholder__tab {
    height: 50px; }
  
  .search-placeholder__restaurants {
    display: block; }
  
  @media only screen and (min-width: 768px) {
      .search-placeholder__restaurants {
        display: grid;
        grid-template: 1fr / 1fr 1fr 1fr;
        grid-gap: 20px; } }
  
  .user-menu-items {
    min-width: 320px; }
    @media only screen and (min-width: 960px) {
      .user-menu-items {
        padding: 0 0 40px 0; } }
    .user-menu-items__name {
      font-weight: 500;
      font-size: 1.5625rem;
      line-height: 31px;
      letter-spacing: -1px;
      padding: 30px 40px 20px; }
    .user-menu-items__notification .notification-permission {
      margin: 0 auto; }
    @media only screen and (min-width: 375px) and (max-width: 960px) {
      .user-menu-items__notification {
        padding: 12px 20px; } }
  
  .placeholder-online-payment-list {
    display: grid;
    grid-row-gap: 16px;
    grid-auto-rows: -webkit-max-content;
    grid-auto-rows: max-content;
    margin-top: 60px; }
    .placeholder-online-payment-list__card {
      grid-template-columns: 24px 1fr 22px;
      padding: 14px 20px;
      display: grid;
      grid-gap: 34px;
      align-items: center; }
    .placeholder-online-payment-list__card .card-brand {
        height: 15px;
        padding: 0; }
    .placeholder-online-payment-list__card .info {
        display: grid;
        grid-template-rows: repeat(2, 18px);
        grid-gap: 5px; }
    .placeholder-online-payment-list .cta {
      display: none; }
    @media only screen and (min-width: 1248px) {
      .placeholder-online-payment-list {
        margin-top: 0; }
        .placeholder-online-payment-list__card {
          padding: 32px;
          grid-template-columns: 40px 1fr 82px; }
          .placeholder-online-payment-list__card .card-brand {
            height: 33px; }
          .placeholder-online-payment-list__card .info {
            grid-template-rows: repeat(2, 27.5px); }
        .placeholder-online-payment-list .cta {
          display: initial;
          height: 50px;
          width: 100%; } }
  
  .floating-box {
    position: relative; }
    .floating-box::after {
      content: '';
      width: 0;
      height: 0;
      position: absolute;
      border-left: 19px solid transparent;
      border-right: 19px solid transparent;
      border-bottom: 11px solid #fff;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
      border-radius: 4px;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
      display: none; }
    .floating-box__wrapper {
      visibility: hidden;
      min-width: 322px;
      background: #fff;
      border: 1px solid #f7f7f7;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
      border-radius: 4px;
      position: absolute;
      z-index: 0;
      opacity: 0;
      padding: 0;
      right: auto;
      pointer-events: none; }
    .floating-box__wrapper.floating-box__wrapper--left {
        left: 0;
        -webkit-transform: translateY(-5px);
                transform: translateY(-5px); }
    .floating-box__wrapper.floating-box__wrapper--right {
        right: 0; }
    .floating-box__wrapper.floating-box__wrapper--visible {
        transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
        visibility: visible;
        opacity: 1;
        -webkit-transform: translateY(10px);
                transform: translateY(10px);
        z-index: 9994;
        pointer-events: initial; }
    .floating-box__button {
      background: none;
      border: none;
      font-size: 1rem;
      color: #3e3e3e;
      font-weight: 300;
      display: flex;
      justify-content: space-around;
      padding: 0 10px;
      align-items: center;
      cursor: pointer;
      border-radius: 4px; }
    .floating-box__button--has-notifications {
        position: absolute;
        left: 12px;
        top: -5px; }
    .floating-box__button:hover {
        color: #ffe115; }
    .floating-box__button:hover .icon-marmita {
          margin: 0 5px 0 0; }
    .floating-box__button:hover .icon-marmita svg {
            color: #ffe115;
            fill: #ffe115; }
    .floating-box__button .icon-marmita {
        width: 20px;
        margin: 0 5px 0 0;
        height: 23px; }
    .floating-box__button .icon-marmita svg {
          color: #3e3e3e;
          fill: #3e3e3e; }
  
  .placeholder-offline-payment-list {
    display: grid;
    padding: 0 16px;
    margin-top: 66px;
    grid-auto-flow: row;
    grid-gap: 16px; }
    .placeholder-offline-payment-list__option {
      height: 54px;
      min-width: 100px;
      width: 100%; }
    @media only screen and (min-width: 960px) {
      .placeholder-offline-payment-list {
        grid-gap: 20px;
        grid-template-columns: 1fr 1fr;
        grid-auto-flow: initial;
        padding: 0;
        margin-top: 0; }
        .placeholder-offline-payment-list__option {
          height: 57.5px; } }
  
  .header-cart {
    display: flex;
    align-items: center;
    position: relative; }
    .header-cart__icon {
      margin: 0 5px 0 0; }
    .header-cart__ammount {
      position: absolute;
      left: 10px;
      top: 13px;
      border-radius: 100%;
      height: 17px;
      width: 19px;
      background: #ffe115;
      color: #fff;
      border: 2px solid #fff;
      font-size: 0.5rem;
      font-weight: 500;
      display: flex;
      align-items: center;
      justify-content: center; }
    .header-cart__label--wide {
      position: relative;
      top: 1px; }
    .header-cart--has-items {
      color: #ffe115; }
    .header-cart--has-items .header-cart__icon svg {
        fill: #ffe115; }
  
  .placeholder-online-payment {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: -webkit-min-content;
    grid-auto-rows: min-content;
    grid-row-gap: 33px;
    grid-column-gap: 10px;
    margin: 24px 20px 30px; }
    .placeholder-online-payment__input {
      display: grid;
      height: 48.19px; }
    .placeholder-online-payment__input--small {
        margin-bottom: 50px; }
    .placeholder-online-payment__input--full {
        grid-column-start: 1;
        grid-column-end: 3; }
    @media only screen and (min-width: 960px) {
      .placeholder-online-payment {
        grid-column-gap: 10px;
        grid-row-gap: 31.3px;
        margin: 9px 0 30.33px; }
        .placeholder-online-payment__input {
          height: 40px; }
          .placeholder-online-payment__input--small {
            margin-bottom: 0; } }
  
  .responsive-header {
    display: none;
    position: -webkit-sticky;
    position: sticky;
    flex-direction: column;
    width: 100vw;
    height: 80px;
    background-color: #fff;
    box-shadow: inset 0 -1px 0 #dcdcdc;
    top: 0;
    z-index: 9997;
    padding: 0; }
    .responsive-header--static {
      position: relative; }
    @media only screen and (min-width: 960px) {
      .responsive-header {
        display: flex; } }
    .responsive-header__container {
      display: flex;
      flex-grow: 1;
      justify-content: space-between;
      align-items: center;
      padding: 20px 0;
      width: 100%;
      max-width: 1366px !important;
      margin: auto;
      padding: 0 30px; }
    @media only screen and (min-width: 960px) {
        .responsive-header__container {
          padding: 0 20px 0 30px; } }
    .responsive-header__logo {
      display: flex;
      align-items: center;
      cursor: pointer; }
    .responsive-header__logo .btn-icon {
        border-radius: 0;
        width: 87px;
        height: 66px; }
    .responsive-header__logo .btn-icon .icon-marmita {
          width: 100%;
          height: 100%; }
    .responsive-header__logo .btn-icon .icon-marmita svg {
            color: #ffe115;
            fill: #ffe115; }
    .responsive-header .btn.btn--link svg {
      color: #3e3e3e;
      fill: #3e3e3e; }
    .responsive-header .btn.btn--link:hover [class*='__label'] {
      color: #ffe115; }
    .responsive-header .btn.btn--link:hover svg {
      color: #ffe115;
      fill: #ffe115; }
    .responsive-header .btn.btn--iconize .btn__icon {
      border-radius: 0;
      width: 23px;
      height: 23px; }
    .responsive-header__button {
      width: inherit;
      padding: 0;
      min-width: 50px;
      cursor: pointer;
      display: flex; }
    .responsive-header__button .icon-marmita {
        width: 25px;
        height: 25px;
        margin: 0 5px 0 0; }
    .responsive-header__button .btn__label {
        display: none;
        font-size: 1rem;
        margin-left: 3px;
        color: #3e3e3e;
        font-weight: 300; }
    @media only screen and (min-width: 1248px) {
          .responsive-header__button .btn__label {
            display: flex; } }
    .responsive-header__button .floating-box__label {
        display: none; }
    @media only screen and (min-width: 1248px) {
          .responsive-header__button .floating-box__label {
            display: block; } }
    .responsive-header .header-cart__label--wide {
      display: none; }
    @media only screen and (min-width: 1248px) {
        .responsive-header .header-cart__label--wide {
          display: flex; } }
    .responsive-header__bag ~ .floating-box__wrapper .restaurant-cart {
      max-height: 80vh; }
    .responsive-header__bag ~ .floating-box__wrapper .restaurant-cart__empty {
        padding: 40px 0; }
    .responsive-header__wrapper-links {
      display: flex;
      flex-direction: row;
      align-items: center; }
    @media only screen and (min-width: 1248px) {
        .responsive-header__wrapper-links > * {
          margin: 0 0 0 20px; } }
  
  .form-input {
    display: flex;
    flex-direction: column;
    border: none;
    padding: 4px 0;
    margin: 5px 0 5px;
    z-index: 0;
    min-height: 73px; }
    .form-input .form-input__label.form-input__label--has-value .label__name, .form-input .form-input__field:focus + .label__name {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px);
      font-size: 1rem; }
    @media only screen and (min-width: 960px) {
        .form-input .form-input__label.form-input__label--has-value .label__name, .form-input .form-input__field:focus + .label__name {
          font-size: 0.875rem;
          -webkit-transform: translateY(-23px);
                  transform: translateY(-23px);
          background: #fff;
          z-index: 1;
          padding: 5px; } }
    .form-input .form-input__label {
      background: transparent;
      padding: 15px 0 0 0;
      display: flex;
      flex-direction: column;
      color: #a6a6a6;
      position: relative; }
    @media only screen and (min-width: 960px) {
        .form-input .form-input__label {
          padding: 0; } }
    .form-input .form-input__label .label__name {
        position: absolute;
        top: 0;
        bottom: 0;
        height: 20px;
        margin: auto;
        display: flex;
        align-items: center;
        -webkit-transform: translateY(7px);
                transform: translateY(7px);
        transition: 200ms;
        font-size: 1.375rem; }
    @media only screen and (min-width: 960px) {
          .form-input .form-input__label .label__name {
            font-size: 1rem;
            -webkit-transform: translateY(0);
                    transform: translateY(0);
            left: 21px; } }
    .form-input .form-input__label .field__border {
        transition: all 400ms cubic-bezier(0.075, 0.82, 0.165, 1);
        height: 2px;
        width: 0;
        margin: auto;
        display: block;
        background: #dcdcdc;
        position: relative;
        top: -2px;
        z-index: 1; }
    @media only screen and (min-width: 960px) {
          .form-input .form-input__label .field__border {
            display: none; } }
    .form-input .form-input__field {
      border: none;
      color: #3e3e3e;
      background: transparent;
      height: 40px;
      font-weight: 500;
      outline: none;
      border-bottom: 1px solid #dcdcdc;
      position: relative;
      z-index: 1;
      width: 100%;
      font-size: 1.375rem; }
    @media only screen and (min-width: 960px) {
        .form-input .form-input__field {
          font-size: 1rem;
          border-radius: 4px;
          border: 1px solid #dcdcdc;
          padding: 13px 20px;
          height: auto;
          line-height: 20px; } }
    .form-input .form-input__field:focus + .label__name + .field__border {
        width: 100%; }
    .form-input .form-input__field:-webkit-autofill {
        box-shadow: 0 30px 0 0 transparent inset; }
    .form-input .form-input__field[disabled] {
      opacity: 0.4; }
    .form-input .form-input__error {
      font-size: 0.75rem;
      margin: 4px 0 0 0;
      color: #b42b2b; }
    .form-input.form-input--invalid .form-input__field {
      border-color: #b42b2b; }
    .form-input.form-input--invalid .field__border {
      background: #b42b2b; }
    .form-input.form-input--tertiary .form-input__field {
      border-color: #fed298;
      color: #fff; }
    .form-input.form-input--tertiary .field__border {
      background: #fed298; }
    .form-input.form-input--tertiary .form-input__label {
      color: #fed298; }
    .form-input.form-input--tertiary .form-input__error {
      color: #fff; }
    .form-input.form-input--tertiary.form-input--invalid .form-input__field {
      border-color: #fff; }
    .form-input.form-input--tertiary.form-input--invalid .field__border {
      background: #fff; }
    .form-input__help-text {
      color: #717171;
      font-size: 11px;
      margin-top: 5px; }
  
  .form-input-without-border {
    display: flex;
    flex-direction: column;
    border: none;
    padding: 4px 0 8px;
    z-index: 0;
    width: 80%;
    margin: 5px auto 16px; }
    .form-input-without-border .form-input-without-border__label.form-input-without-border__label--has-value .label__name, .form-input-without-border .form-input-without-border__field:focus + .label__name {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px);
      font-size: 1rem; }
    @media only screen and (min-width: 960px) {
        .form-input-without-border .form-input-without-border__label.form-input-without-border__label--has-value .label__name, .form-input-without-border .form-input-without-border__field:focus + .label__name {
          font-size: 0.875rem;
          -webkit-transform: translateY(-23px);
                  transform: translateY(-23px);
          background: #fff;
          z-index: 1;
          padding: 5px; } }
    @media only screen and (max-width: 767px) {
      .form-input-without-border {
        width: 100%; } }
    .form-input-without-border .form-input-without-border__label {
      background: transparent;
      padding: 15px 0 0 0;
      display: flex;
      flex-direction: column;
      color: #a6a6a6;
      position: relative; }
    @media only screen and (min-width: 960px) {
        .form-input-without-border .form-input-without-border__label {
          padding: 0; } }
    .form-input-without-border .form-input-without-border__label .label__name {
        display: none; }
    .form-input-without-border .form-input-without-border__label .field__border {
        transition: all 400ms cubic-bezier(0.075, 0.82, 0.165, 1);
        height: 2px;
        width: 0;
        margin: auto;
        display: block;
        background: #dcdcdc;
        position: relative;
        top: -2px;
        z-index: 1; }
    @media only screen and (min-width: 960px) {
          .form-input-without-border .form-input-without-border__label .field__border {
            display: none; } }
    .form-input-without-border__field {
      border: 0;
      letter-spacing: 20px;
      font-size: 40px;
      text-align: center;
      color: #3e3e3e;
      background: transparent;
      font-weight: 500;
      outline: none;
      position: relative;
      z-index: 1;
      width: 100%;
      padding: 5px 20px;
      line-height: 1;
      border-bottom: 1px solid #f5f0eb; }
    .form-input-without-border__field:focus + .label__name + .field__border {
        width: 100%; }
    @media only screen and (max-width: 767px) {
        .form-input-without-border__field {
          height: 70px;
          font-size: 32px; } }
    .form-input-without-border__field:focus + .form-input-without-border__erase-button {
        transition: visibility;
        transition-delay: 50ms;
        visibility: visible; }
    .form-input-without-border__field:-webkit-autofill {
        box-shadow: 0 30px 0 0 transparent inset; }
    .form-input-without-border .form-input-without-border__field[disabled] {
      opacity: 0.4; }
    .form-input-without-border .form-input-without-border__error {
      font-size: 0.75rem;
      margin: 4px 0 0 0;
      color: #b42b2b; }
    .form-input-without-border.form-input-without-border--invalid .form-input-without-border__field {
      border-color: #b42b2b; }
    .form-input-without-border.form-input-without-border--invalid .field__border {
      background: #b42b2b; }
    .form-input-without-border.form-input-without-border--tertiary .form-input-without-border__field {
      border-color: #fed298;
      color: #fff; }
    .form-input-without-border.form-input-without-border--tertiary .field__border {
      background: #fed298; }
    .form-input-without-border.form-input-without-border--tertiary .form-input-without-border__label {
      color: #fed298; }
    .form-input-without-border.form-input-without-border--tertiary .form-input-without-border__error {
      color: #fff; }
    .form-input-without-border.form-input-without-border--tertiary.form-input-without-border--invalid .form-input-without-border__field {
      border-color: #fff; }
    .form-input-without-border.form-input-without-border--tertiary.form-input-without-border--invalid .field__border {
      background: #fff; }
    .form-input-without-border__erase-button {
      position: absolute;
      right: -20px;
      margin-top: -5px;
      transition: visibility;
      transition-delay: 50ms;
      visibility: hidden; }
    @media only screen and (min-width: 960px) {
        .form-input-without-border__erase-button {
          right: 0;
          margin-top: 3px;
          cursor: pointer; } }
    .form-input-without-border__erase-button .icon-marmita {
        width: 25px; }
    .form-input-without-border__erase-button .icon-marmita svg {
          color: #fed298;
          fill: #fed298; }
  
  .native-select {
    display: flex;
    flex-direction: column;
    border: none;
    padding: 4px 0;
    margin: 5px 0 10px; }
    .native-select .native-select__label.native-select__label--has-value .label__name, .native-select .native-select__label .is-focused + .label__name {
      -webkit-transform: translateY(-25px);
              transform: translateY(-25px);
      font-size: 0.875rem; }
    @media only screen and (min-width: 960px) {
        .native-select .native-select__label.native-select__label--has-value .label__name, .native-select .native-select__label .is-focused + .label__name {
          -webkit-transform: translateY(-20px);
                  transform: translateY(-20px); } }
    .native-select .native-select__field {
      background-color: white;
      height: 40px;
      border: none;
      border-bottom: 1px solid lightgray;
      font-weight: 500;
      font-size: 1.375rem;
      color: #3e3e3e;
      width: 100%; }
    @media only screen and (min-width: 960px) {
        .native-select .native-select__field {
          font-size: 1rem;
          border-radius: 4px;
          border: 1px solid #dcdcdc;
          padding: 13px 20px;
          height: 48px; } }
    .native-select.native-select--invalid .native-select__field {
      border-bottom: 1px solid #b42b2b; }
    @media only screen and (min-width: 960px) {
        .native-select.native-select--invalid .native-select__field {
          border-color: #b42b2b; } }
    .native-select.native-select--invalid .label__name {
      color: #b42b2b; }
    .native-select.native-select--tertiary .native-select__label {
      color: #fed298; }
    .native-select.native-select--tertiary .Select-input {
      color: #fff; }
    .native-select .native-select__label {
      background: transparent;
      border-radius: 4px;
      display: flex;
      flex-direction: column;
      color: #a6a6a6;
      position: relative; }
    .native-select .native-select__label .label__name {
        position: absolute;
        top: 0;
        bottom: 0;
        height: 20px;
        font-size: 1.375rem;
        margin: auto;
        display: flex;
        align-items: center;
        -webkit-transform: translateY(0px);
                transform: translateY(0px);
        transition: 200ms; }
    @media only screen and (min-width: 960px) {
          .native-select .native-select__label .label__name {
            background: #fff;
            font-size: 1rem;
            left: 10px;
            padding: 0 13px; } }
    .native-select .native-select__error {
      font-size: 0.75rem;
      margin: 4px 0 0 0;
      color: #b42b2b; }
  
  .marmita-checkbox {
    transition: all 100ms;
    border-radius: 5px;
    color: inherit;
    cursor: pointer;
    margin: 0;
    display: inline-flex;
    padding: 0;
    outline: none;
    position: relative;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    align-items: center;
    vertical-align: middle;
    justify-content: center;
    text-decoration: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-tap-highlight-color: transparent;
    width: 24px;
    height: 24px;
    background-color: transparent;
    z-index: 0; }
    .marmita-checkbox:hover {
      background-color: transparent; }
    .marmita-checkbox::before, .marmita-checkbox::after {
      box-sizing: border-box;
      content: '';
      width: 100%;
      height: 100%;
      position: absolute;
      left: 50%;
      top: 50%;
      background: transparent;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      border-radius: 4px; }
    .marmita-checkbox::before {
      transition: border 100ms;
      z-index: -2;
      border-style: solid; }
    .marmita-checkbox::after {
      transition: all 100ms;
      z-index: -1;
      -webkit-transform: translate(-50%, -50%) scale(0);
              transform: translate(-50%, -50%) scale(0); }
    .marmita-checkbox__input {
      cursor: inherit;
      position: absolute;
      opacity: 0;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      margin: 0;
      padding: 0; }
    .marmita-checkbox__icon {
      transition: all 200ms;
      -webkit-transform: scale(0) translateY(3px);
              transform: scale(0) translateY(3px); }
    .marmita-checkbox__icon svg {
        width: 28px;
        height: 28px;
        display: inline-flex; }
    .marmita-checkbox--primary::before {
      transition-delay: 130ms;
      border: 2px solid #a6a5a5; }
    .marmita-checkbox--primary::after {
      background: #ffe115; }
    .marmita-checkbox--primary .marmita-checkbox__icon svg {
      color: #fff;
      fill: #fff; }
    .marmita-checkbox--tertiary::before {
      transition-delay: 130ms;
      border: 2px solid #fed298; }
    .marmita-checkbox--tertiary::after {
      background: #fed298; }
    .marmita-checkbox--tertiary .marmita-checkbox__icon svg {
      color: #ffe115;
      fill: #ffe115; }
    .marmita-checkbox--checked.marmita-checkbox--primary::before {
      transition-delay: 0;
      border-color: #a6a5a5; }
    .marmita-checkbox--checked.marmita-checkbox--primary::after {
      transition-delay: 200ms;
      -webkit-transform: translate(-50%, -50%) scale(1);
              transform: translate(-50%, -50%) scale(1); }
    .marmita-checkbox--checked.marmita-checkbox--tertiary {
      background: #fed298; }
    .marmita-checkbox--checked.marmita-checkbox--tertiary::before {
        transition-delay: 0;
        border-color: #fed298; }
    .marmita-checkbox--checked.marmita-checkbox--tertiary::after {
        transition-delay: 200ms;
        -webkit-transform: translate(-50%, -50%) scale(1);
                transform: translate(-50%, -50%) scale(1); }
    .marmita-checkbox--checked .marmita-checkbox__icon {
      transition-delay: 250ms;
      -webkit-transform: scale(1) translateY(3px);
              transform: scale(1) translateY(3px); }
    .marmita-checkbox--disabled {
      cursor: not-allowed;
      -webkit-filter: grayscale(1);
              filter: grayscale(1);
      opacity: 0.4; }
    .marmita-checkbox--small {
      width: 20px;
      height: 20px; }
    .marmita-checkbox--small.marmita-checkbox--checked.marmita-checkbox--primary::before {
        border-width: 10px; }
    .marmita-checkbox--normal {
      width: 24px;
      height: 24px; }
    .marmita-checkbox--normal.marmita-checkbox--checked.marmita-checkbox--primary::before {
        border-width: 12px; }
  
  .simple-checkbox {
    transition: all 100ms;
    border-radius: 5px;
    color: inherit;
    cursor: pointer;
    margin: 0;
    display: inline-flex;
    padding: 0;
    outline: none;
    position: relative;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    align-items: center;
    vertical-align: middle;
    justify-content: center;
    text-decoration: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-tap-highlight-color: transparent;
    width: 24px;
    height: 24px;
    background-color: transparent;
    z-index: 0; }
    .simple-checkbox:hover {
      background-color: transparent; }
    .simple-checkbox::before, .simple-checkbox::after {
      box-sizing: border-box;
      content: '';
      width: 100%;
      height: 100%;
      position: absolute;
      left: 50%;
      top: 50%;
      background: transparent;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      border-radius: 4px; }
    .simple-checkbox::before {
      transition: border 100ms;
      z-index: -2;
      border-style: solid; }
    .simple-checkbox::after {
      transition: all 100ms;
      z-index: -1;
      -webkit-transform: translate(-50%, -50%) scale(0);
              transform: translate(-50%, -50%) scale(0); }
    .simple-checkbox__input {
      cursor: inherit;
      position: absolute;
      opacity: 0;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      margin: 0;
      padding: 0; }
    .simple-checkbox__icon {
      transition: all 200ms;
      -webkit-transform: scale(0) translateY(3px);
              transform: scale(0) translateY(3px); }
    .simple-checkbox__icon svg {
        width: 28px;
        height: 28px;
        display: inline-flex; }
    .simple-checkbox--primary::before {
      transition-delay: 130ms;
      border: 2px solid #a6a5a5; }
    .simple-checkbox--primary::after {
      background: #ffe115; }
    .simple-checkbox--primary .simple-checkbox__icon svg {
      color: #fff;
      fill: #fff; }
    .simple-checkbox--tertiary::before {
      transition-delay: 130ms;
      border: 2px solid #fed298; }
    .simple-checkbox--tertiary::after {
      background: #fed298; }
    .simple-checkbox--tertiary .simple-checkbox__icon svg {
      color: #ffe115;
      fill: #ffe115; }
    .simple-checkbox--checked.simple-checkbox--primary::before {
      transition-delay: 0;
      border-color: #a6a5a5; }
    .simple-checkbox--checked.simple-checkbox--primary::after {
      transition-delay: 200ms;
      -webkit-transform: translate(-50%, -50%) scale(1);
              transform: translate(-50%, -50%) scale(1); }
    .simple-checkbox--checked.simple-checkbox--tertiary {
      background: #fed298; }
    .simple-checkbox--checked.simple-checkbox--tertiary::before {
        transition-delay: 0;
        border-color: #fed298; }
    .simple-checkbox--checked.simple-checkbox--tertiary::after {
        transition-delay: 200ms;
        -webkit-transform: translate(-50%, -50%) scale(1);
                transform: translate(-50%, -50%) scale(1); }
    .simple-checkbox--checked .simple-checkbox__icon {
      transition-delay: 250ms;
      -webkit-transform: scale(1) translateY(3px);
              transform: scale(1) translateY(3px); }
    .simple-checkbox--disabled {
      cursor: not-allowed;
      -webkit-filter: grayscale(1);
              filter: grayscale(1);
      opacity: 0.4; }
    .simple-checkbox--small {
      width: 20px;
      height: 20px; }
    .simple-checkbox--small.simple-checkbox--checked.simple-checkbox--primary::before {
        border-width: 10px; }
    .simple-checkbox--normal {
      width: 24px;
      height: 24px; }
    .simple-checkbox--normal.simple-checkbox--checked.simple-checkbox--primary::before {
        border-width: 12px; }
  
  .marmita-radio {
    transition: all 100ms;
    color: inherit;
    cursor: pointer;
    margin: 0;
    display: inline-flex;
    padding: 0;
    outline: none;
    position: relative;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    align-items: center;
    vertical-align: middle;
    justify-content: center;
    text-decoration: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-tap-highlight-color: transparent;
    width: 24px;
    height: 24px;
    background-color: transparent;
    z-index: 0; }
    .marmita-radio:hover {
      background-color: transparent; }
    .marmita-radio::before, .marmita-radio::after {
      box-sizing: border-box;
      content: '';
      width: 24px;
      height: 24px;
      position: absolute;
      left: 50%;
      top: 50%;
      background: transparent;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      border-radius: 50%; }
    .marmita-radio__input {
      cursor: inherit;
      position: absolute;
      opacity: 0;
      width: 24px;
      height: 24px;
      top: 0;
      left: 0;
      margin: 0;
      padding: 0;
      z-index: 2; }
    .marmita-radio::after {
      transition: 150ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      visibility: hidden; }
    .marmita-radio--primary::before {
      z-index: 0;
      background: #f5f0eb; }
    .marmita-radio--primary::after {
      border: 0 solid #ffe115;
      background: transparent;
      z-index: 1; }
    .marmita-radio--checked::after {
      border-width: 6px;
      visibility: visible; }
    .marmita-radio--disabled {
      cursor: not-allowed;
      -webkit-filter: grayscale(1);
              filter: grayscale(1);
      opacity: 0.4; }
    .marmita-radio--small {
      width: 20px;
      height: 20px; }
    .marmita-radio--normal {
      width: 24px;
      height: 24px; }
  
  .marmita-fullpage-select-list {
    min-width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column; }
    .marmita-fullpage-select-list__wrapper {
      height: 100%;
      overflow-y: scroll; }
    .marmita-fullpage-select-list__empty {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      word-break: break-all;
      padding: 0 20px 50px 20px;
      color: #fff;
      height: 100%; }
    .marmita-fullpage-select-list__empty__title {
        font-size: 0.9375rem;
        font-weight: 500;
        margin-bottom: 0; }
    .marmita-fullpage-select-list__empty__message {
        font-size: 0.75rem;
        margin-top: 0; }
    .marmita-fullpage-select-list__item {
      justify-content: flex-start;
      margin: 0; }
    .marmita-fullpage-select-list__item .btn__label {
        flex-grow: 0;
        color: #fed298;
        font-size: 1.25rem;
        font-weight: 500; }
    .marmita-fullpage-select-searcher {
    display: inline-flex;
    min-width: 100%;
    position: absolute;
    top: 0px;
    height: 50px;
    padding: 10px 20px 0;
    align-items: flex-end;
    background-color: #ffe115;
    z-index: 10010; }
    .marmita-fullpage-select-searcher__icon {
      margin-right: 10px;
      height: 24px;
      width: 34px; }
    .marmita-fullpage-select-searcher__icon svg {
        color: #fed298;
        fill: #fed298; }
    .marmita-fullpage-select-searcher__input {
      display: flex;
      border: none;
      color: #fff;
      background: transparent;
      height: 100%;
      outline: none;
      border-bottom: 2px solid #fed298;
      width: 90%; }
    @media only screen and (min-width: 375px) {
        .marmita-fullpage-select-searcher__input {
          font-size: 1.375rem; } }
    .marmita-fullpage-select-searcher__input:-webkit-autofill {
        box-shadow: 0 30px 0 0 transparent inset; }
    .marmita-fullpage-select-searcher__button {
      height: 30px;
      padding: 10px;
      margin-left: 10px; }
    .marmita-fullpage-select-searcher__button .btn__label {
        color: #fed298; }
  
  .marmita-fullpage-select-input {
    position: relative;
    background: transparent;
    border: none;
    width: 100%;
    padding: 0;
    overflow: hidden; }
    .marmita-fullpage-select-input :first-child {
      pointer-events: none; }
    .marmita-fullpage-select-input__icon {
      position: absolute;
      width: 16px;
      height: 16px;
      top: 35px;
      right: 0;
      -webkit-transform: rotate(-90deg);
              transform: rotate(-90deg); }
    .marmita-fullpage-select-input__icon svg {
        color: #dcdcdc;
        fill: #dcdcdc; }
    .marmita-fullpage-select-input__icon--light svg {
        color: #fed298;
        fill: #fed298; }
    @media only screen and (min-width: 375px) {
        .marmita-fullpage-select-input__icon {
          width: 20px;
          height: 20px; } }
    @media only screen and (min-width: 960px) {
        .marmita-fullpage-select-input__icon {
          top: 25px; } }
  
  .marmita-toggle {
    cursor: pointer;
    display: inline-block;
    height: 26px;
    position: relative;
    width: 44px; }
    .marmita-toggle__checkbox {
      height: 100%;
      left: 0;
      opacity: 0;
      position: absolute;
      top: 0;
      width: 100%;
      z-index: 1; }
    .marmita-toggle__checkbox:checked + .marmita-toggle__slider {
        background: #ffe115; }
    .marmita-toggle__checkbox:checked + .marmita-toggle__slider::before {
          background: #fff;
          -webkit-transform: translateX(85%);
                  transform: translateX(85%); }
    .marmita-toggle__slider {
      background: #d3d2d2;
      position: absolute;
      width: 100%;
      height: 100%;
      border-radius: 15px;
      transition: all 200ms linear; }
    .marmita-toggle__slider::before {
        background: #fff;
        border-radius: 100%;
        bottom: 2px;
        content: '';
        height: 22px;
        left: 2px;
        position: absolute;
        transition: all 200ms linear;
        width: 22px; }
    .marmita-toggle__slider--disabled {
        opacity: 0.4; }
  
  .simple-form-input {
    display: flex;
    flex-direction: column;
    border: none;
    padding: 4px 0;
    margin: 5px 0 5px;
    z-index: 0;
    min-height: 73px; }
    .simple-form-input .simple-form-input__label--has-value .label__name, .simple-form-input__label--has-value .simple-form-input .label__name, .simple-form-input .simple-form-input__field:focus + .label__name {
      -webkit-transform: translateY(-23px);
              transform: translateY(-23px);
      font-size: 0.875rem;
      background: #fff;
      z-index: 1;
      padding: 5px; }
    .simple-form-input__label {
      background: transparent;
      display: flex;
      flex-direction: column;
      color: #a6a6a6;
      position: relative;
      padding: 0; }
    .simple-form-input__label .label__name {
        position: absolute;
        top: 0;
        bottom: 0;
        height: 20px;
        margin: auto;
        display: flex;
        align-items: center;
        -webkit-transform: translateY(0);
                transform: translateY(0);
        transition: 200ms;
        font-size: 1rem;
        left: 14px; }
    .simple-form-input__field {
      color: #3e3e3e;
      background: transparent;
      font-weight: 500;
      outline: none;
      border-radius: 4px;
      border: 1px solid #dcdcdc;
      position: relative;
      padding: 13px 20px;
      height: auto;
      z-index: 1;
      width: 100%;
      font-size: 1rem;
      line-height: 20px; }
    .simple-form-input__field:focus + .label__name + .field__border {
        width: 100%; }
    .simple-form-input__field:-webkit-autofill {
        box-shadow: 0 30px 0 0 transparent inset; }
    .simple-form-input__field[disabled] {
      opacity: 0.4; }
    .simple-form-input__error {
      font-size: 0.75rem;
      margin: 4px 0 0 0;
      color: #ee4c58; }
    .simple-form-input--invalid .simple-form-input__field {
      border-color: #ee4c58; }
    .simple-form-input--invalid .label__name {
      color: #ee4c58; }
    .simple-form-input--invalid .field__border {
      background: #ee4c58; }
  
  .ifood-box-code {
    margin: 10px 0 24px; }
    @media only screen and (min-width: 960px) {
      .ifood-box-code {
        margin: 0; } }
    .ifood-box-code__title {
      display: block;
      text-align: center;
      margin: 0;
      font-size: 1.5rem;
      line-height: 1.875rem;
      color: #3e3e3e;
      font-weight: 500; }
  
  .pwa-banner-install {
    background: #f7f7f7;
    max-width: 960px;
    border-radius: 4px;
    display: grid;
    grid-template-columns: 50px 1fr;
    padding: 16px 10px;
    grid-column-gap: 16px;
    grid-template-areas: 'icon title' 'icon subtitle' 'icon buttons'; }
    @media only screen and (min-width: 960px) {
      .pwa-banner-install {
        display: none; } }
    .pwa-banner-install--white {
      background: #fff; }
    .pwa-banner-install__icon {
      grid-area: icon;
      display: flex;
      align-items: center;
      padding: 0 0 0 6px; }
    .pwa-banner-install__icon svg {
        width: 50px;
        height: 120px; }
    .pwa-banner-install__title {
      grid-area: title;
      display: flex;
      align-items: center;
      font-size: 1rem;
      color: #3e3e3e;
      font-weight: 500;
      line-height: 1.375rem; }
    .pwa-banner-install__subtitle {
      grid-area: subtitle;
      display: flex;
      align-items: center;
      color: #717171;
      font-size: 0.875rem;
      font-weight: 300; }
    .pwa-banner-install-buttons {
      grid-area: buttons;
      display: flex;
      align-items: center; }
    .pwa-banner-install-buttons__dismiss {
        color: #717171;
        padding: 5px 10px;
        position: relative;
        left: -10px;
        height: 30px; }
    .pwa-banner-install-buttons__dismiss .btn__label {
          font-size: 0.75rem;
          font-weight: normal; }
    @media only screen and (min-width: 375px) {
            .pwa-banner-install-buttons__dismiss .btn__label {
              font-size: 0.875rem; } }
    .pwa-banner-install-buttons__add {
        height: 36px; }
    .pwa-banner-install-buttons__add .btn__label {
          font-size: 0.875rem; }
    .pwa-banner-install .svg-flying-ballon__cartoon {
      -webkit-animation: ease-in-out banner-cartoon-flying 3s infinite alternate;
              animation: ease-in-out banner-cartoon-flying 3s infinite alternate; }
    .pwa-banner-install .svg-flying-ballon__shadow {
      -webkit-animation: ease-in-out banner-cartoon-shadow 3s infinite alternate;
              animation: ease-in-out banner-cartoon-shadow 3s infinite alternate; }
    .pwa-banner-install--large {
      grid-template-areas: 'icon' 'title ' 'subtitle' 'buttons';
      grid-template-columns: 1fr;
      padding: 20px 10px 15px;
      grid-column-gap: 16px; }
    .pwa-banner-install--large .pwa-banner-install__icon {
        justify-content: center;
        padding: 0; }
    .pwa-banner-install--large .pwa-banner-install__icon svg {
          height: 136px;
          width: 61px;
          padding: 0 0 0 5px; }
    .pwa-banner-install--large .pwa-banner-install__title {
        width: 170px;
        margin: 12px auto;
        text-align: center; }
    .pwa-banner-install--large .pwa-banner-install__subtitle {
        width: 252px;
        margin: 0 auto;
        text-align: center; }
    .pwa-banner-install--large .pwa-banner-install-buttons {
        margin: 6px 0 0 0;
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center; }
    .pwa-banner-install--large .pwa-banner-install-buttons__add {
          margin: 12px 0;
          width: 215px; }
    .pwa-banner-install--large .pwa-banner-install-buttons__dismiss {
          left: 0; }
    @-webkit-keyframes banner-cartoon-flying {
    0% {
      -webkit-transform: rotate(2deg) translateY(-9px);
              transform: rotate(2deg) translateY(-9px); }
    100% {
      -webkit-transform: rotate(-2deg) translateY(0);
              transform: rotate(-2deg) translateY(0); } }
    @keyframes banner-cartoon-flying {
    0% {
      -webkit-transform: rotate(2deg) translateY(-9px);
              transform: rotate(2deg) translateY(-9px); }
    100% {
      -webkit-transform: rotate(-2deg) translateY(0);
              transform: rotate(-2deg) translateY(0); } }
    @-webkit-keyframes banner-cartoon-shadow {
    0% {
      opacity: 0.4;
      -webkit-transform: translateX(-3px);
              transform: translateX(-3px); }
    100% {
      opacity: 1;
      -webkit-transform: translateX(3px);
              transform: translateX(3px); } }
    @keyframes banner-cartoon-shadow {
    0% {
      opacity: 0.4;
      -webkit-transform: translateX(-3px);
              transform: translateX(-3px); }
    100% {
      opacity: 1;
      -webkit-transform: translateX(3px);
              transform: translateX(3px); } }
  
  .payment-action {
    border-top: 1px solid #f5f0eb;
    padding: 20px;
    width: 100%;
    background: #fff;
    position: fixed;
    bottom: 0;
    z-index: 9990; }
    .payment-action .btn {
      width: 100%; }
  
  @media only screen and (max-width: 959px) {
    .payment-type-selection {
      padding-bottom: 10px; } }
  
  .payment-type-selection .selection-type {
    display: flex;
    align-items: center;
    height: 40px;
    overflow: hidden;
    padding: 0 20px 0 0;
    position: relative; }
  
  .payment-type-selection .selection-type canvas {
      color: #a6a5a5; }
  
  .payment-type-selection .selection-type__label {
      display: block;
      flex-grow: 2;
      font-size: 0.9375rem;
      color: #3f3e3e; }
  
  @media only screen and (min-width: 960px) {
    .payment-type-selection {
      display: flex;
      padding-top: 18px; }
      .payment-type-selection .selection-type {
        flex-direction: row-reverse;
        padding: 0 40px 0 0; }
        .payment-type-selection .selection-type .marmita-radio {
          margin-right: 10px; } }
  
  .payment-info {
    padding: 20px 0; }
    .payment-info__wrapper {
      text-align: left; }
    .payment-info__title {
      border-bottom: 1px solid #f5f0eb;
      color: #3f3e3e;
      font-size: 1.125rem;
      font-weight: 500;
      margin: 0;
      padding: 0 20px 20px; }
    .payment-info__button {
      display: flex;
      font-weight: normal;
      height: 60px;
      margin: 0;
      justify-content: space-between;
      padding: 0 20px;
      width: 100%; }
    .payment-info__button canvas {
        color: #a6a5a5; }
    @media only screen and (max-width: 767px) {
        .payment-info__button {
          font-size: 1rem; } }
    .payment-info .line-separator {
      width: 100%;
      display: block;
      border-bottom: 1px solid #f5f0eb; }
    @media only screen and (max-width: 767px) {
        .payment-info .line-separator:first-child {
          margin: 10px 0; }
        .payment-info .line-separator:last-child {
          border-bottom: 0;
          margin: 0 0 10px; } }
    .payment-info__item {
      text-align: left; }
    .payment-info__item-title {
      color: #3f3e3e;
      display: block;
      font-size: 1rem; }
    .payment-info__item-title:last-child {
        margin-bottom: 0; }
    .payment-info__item-required {
      display: inline-block; }
    .payment-info__item-detail, .payment-info__item-required {
      color: #a6a29f;
      font-size: 0.9375rem;
      text-align: left;
      margin-top: 8px;
      font-weight: 300; }
    .payment-info__item-detail {
      display: block;
      text-transform: capitalize;
      margin-right: 5px; }
    @media only screen and (max-width: 767px) {
        .payment-info__item-detail {
          margin-right: 0; } }
    .payment-info__item-detail-payment {
        display: inline-block; }
    .payment-info__action {
      color: #ffe115;
      font-size: 1rem;
      text-decoration: none;
      display: flex;
      align-items: center; }
    .payment-info__action .icon-marmita {
        margin-right: 10px; }
    .payment-info__action img {
        display: inline-block;
        margin-right: 15px;
        width: 24px;
        position: relative;
        top: -1px; }
    .payment-info__card-dots {
      font-size: 0.75rem; }
  
  .payment-dialog {
    padding: 20px 24px;
    max-width: 450px;
    margin: 0 auto;
    display: flex;
    flex-direction: column; }
    @media only screen and (min-width: 560px) {
      .payment-dialog {
        padding: 20px 50px; } }
    @media only screen and (max-width: 559px) {
      .payment-dialog {
        text-align: center; } }
    .payment-dialog__title {
      font-size: 1.125rem;
      line-height: 1.875rem;
      margin: 0 0 12px;
      font-weight: 500;
      color: #3e3e3e; }
    @media only screen and (min-width: 560px) {
        .payment-dialog__title {
          font-size: 1.5rem; } }
    .payment-dialog__subtitle {
      font-size: 1rem;
      line-height: 1.25rem;
      color: #717171;
      margin: 0 0 12px; }
    .payment-dialog__subtitle span {
        color: #3e3e3e; }
    .payment-dialog__button-wrapper {
      display: flex;
      flex-direction: column;
      margin-top: 30px; }
    .payment-dialog__confirm {
      margin: 0 0 10px; }
    @media only screen and (max-width: 559px) {
      .payment-dialog__modal .marmita-modal__actions {
        margin-right: 10px; } }
  
  .payment-card-actions {
    display: grid;
    grid-template-columns: repeat(2, 22px);
    grid-column-gap: 14px; }
    @media only screen and (max-width: 374px) {
      .payment-card-actions {
        grid-template-columns: repeat(2, 18px);
        grid-column-gap: 10px; } }
    @media only screen and (min-width: 768px) {
      .payment-card-actions {
        grid-template-columns: repeat(2, 24px);
        grid-column-gap: 34px; } }
  
  .payment-card {
    background: none;
    padding: 0;
    text-align: left;
    width: 100%;
    cursor: pointer;
    border: 1px solid #dcdcdc;
    align-items: center;
    border-radius: 8px;
    transition: all 200ms ease-in-out; }
    .payment-card:not(.payment-card--disabled):not(.payment-card--selected):hover {
      color: #3e3e3e;
      box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05), 0px 4px 16px rgba(0, 0, 0, 0.08);
      border-color: transparent; }
    .payment-card--selected {
      border-color: #ffe115; }
    .payment-card--disabled {
      cursor: default; }
    .payment-card--disabled:hover {
        border-color: #dcdcdc; }
    .payment-card--disabled .payment-card__alias,
      .payment-card--disabled .payment-card__number {
        color: #a6a6a6; }
    .payment-card--disabled .payment-card__brand::before {
        content: '';
        background: #fff;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        opacity: 0.8;
        bottom: 0; }
    .payment-card__brand {
      width: 24px;
      height: 15px;
      display: grid;
      align-items: center; }
    .payment-card .icon-marmita--more-dots path,
    .payment-card .icon-marmita--pen path,
    .payment-card .icon-marmita--trash path {
      fill: #ffe115;
      color: #ffe115; }
    .payment-card__more-options {
      width: 36px;
      height: 36px;
      transition: all 200ms ease-in-out;
      -webkit-transform-origin: left;
              transform-origin: left; }
    .payment-card__actions-container {
      transition: all 200ms ease-in-out;
      -webkit-transform: translateX(-50px);
              transform: translateX(-50px); }
    .payment-card__container {
      display: grid;
      grid-template-columns: 24px 1fr 58px;
      padding: 14px 20px;
      grid-gap: 14px;
      max-width: 830px;
      align-items: center; }
    .payment-card__container--has-kebab {
        grid-template-columns: 24px 1fr 22px; }
    .payment-card__container--open-actions {
        grid-template-columns: 58px 1fr 22px; }
    .payment-card__container--open-actions .payment-card__more-options {
          -webkit-transform-origin: left;
                  transform-origin: left;
          transition: all 200ms ease-in-out;
          -webkit-transform: rotate(-90deg) translate(-12px, 12px);
                  transform: rotate(-90deg) translate(-12px, 12px); }
    .payment-card__container--open-actions .payment-card__actions-container {
          -webkit-transform: translateX(0px);
                  transform: translateX(0px); }
    .payment-card__additional-text {
      color: #717171;
      background: #f2f2f2;
      font-size: 0.75rem;
      height: 30px;
      line-height: 30px;
      padding-left: 30px;
      font-weight: 300; }
    .payment-card__alias {
      margin: 0 0 5px;
      font-size: 0.875rem;
      color: #3e3e3e; }
    .payment-card__number {
      margin: 0;
      line-height: 20px;
      color: #717171;
      font-size: 0.875rem;
      font-weight: 100; }
    .payment-card .tooltip-ui-kit__container {
      display: none; }
    .payment-card button {
      cursor: pointer;
      align-self: start;
      width: 22px;
      height: auto;
      margin: 0;
      padding: 0;
      border: 0;
      background: transparent; }
    @media only screen and (max-width: 374px) {
      .payment-card button {
        width: 18px;
        height: 18px; }
      .payment-card__container {
        grid-gap: 10px;
        grid-template-columns: 24px 1fr 46px; }
        .payment-card__container--has-kebab {
          grid-template-columns: 24px 1fr 18px; }
        .payment-card__container--open-actions {
          grid-template-columns: 46px 1fr 18px; } }
    @media only screen and (min-width: 768px) {
      .payment-card button {
        width: 24px;
        height: 24px; }
      .payment-card .icon-marmita--pen:hover,
      .payment-card .icon-marmita--trash:hover {
        -webkit-transform: scale(1.05);
                transform: scale(1.05); }
        .payment-card .icon-marmita--pen:hover path,
        .payment-card .icon-marmita--trash:hover path {
          color: #c41835;
          fill: #c41835; }
      .payment-card .tooltip-ui-kit {
        cursor: pointer; }
        .payment-card .tooltip-ui-kit__container {
          display: initial;
          min-width: initial;
          padding: 5px 10px;
          max-width: initial;
          color: white;
          background-color: rgba(113, 113, 113, 0.8); }
        .payment-card .tooltip-ui-kit__content {
          padding: 0px; }
      .payment-card__container {
        padding: 32px;
        grid-gap: 34px;
        grid-template-columns: 40px 1fr 82px; }
        .payment-card__container--has-kebab {
          grid-template-columns: 40px 1fr 24px; }
        .payment-card__container--open-actions {
          grid-template-columns: 82px 1fr 24px; }
      .payment-card__brand {
        width: 40px;
        height: 33px; }
      .payment-card__additional-text {
        font-size: 0.875rem;
        line-height: 30px; }
      .payment-card__alias {
        margin: 0 0 5px;
        font-size: 1rem; }
      .payment-card__number {
        font-size: 1rem;
        line-height: 20px; } }
  
  .payment-states {
    height: calc(100vh - 180px);
    display: grid;
    grid-template-rows: auto -webkit-max-content;
    grid-template-rows: auto max-content;
    justify-items: center;
    align-content: center; }
    .payment-states__illustration {
      grid-row-start: 1;
      width: 240px;
      height: 250px; }
    @media (max-height: 500px) {
        .payment-states__illustration {
          width: 140px;
          height: 150px; } }
    .payment-states__illustration div {
        display: grid;
        align-items: center;
        height: 100%; }
    .payment-states__illustration div svg {
          height: 100%;
          width: 100%; }
    .payment-states .payment-states-texts {
      display: grid;
      justify-items: center;
      grid-row-gap: 8px; }
    .payment-states .payment-states-texts__title {
        margin: 50px 0 0 0;
        color: #3f3e3e;
        font-weight: 500;
        font-size: 1rem;
        line-height: 1.375em; }
    @media (max-height: 600px) {
          .payment-states .payment-states-texts__title {
            margin: 20px 0 0 0; } }
    .payment-states .payment-states-texts__description {
        margin: 0;
        color: #717171;
        font-weight: 300;
        font-size: 0.875rem;
        line-height: 1.25em;
        text-align: center;
        max-width: 312px; }
    .payment-states .payment-states-texts__cta {
        position: fixed;
        bottom: 0;
        left: 0;
        margin: 0 20px 52px 20px;
        width: calc(100% - 40px); }
    @media only screen and (min-width: 960px) {
      .payment-states {
        grid-template-columns: 370px 342px;
        grid-column-gap: 50px;
        height: auto;
        align-items: center; }
        .payment-states__illustration {
          grid-row-start: initial;
          width: 330px;
          height: 340px; }
        .payment-states .payment-states-texts {
          grid-row-gap: 16px;
          justify-items: initial; }
          .payment-states .payment-states-texts__title {
            font-weight: 500;
            font-size: 1.25rem;
            line-height: 1.625em; }
          .payment-states .payment-states-texts__description {
            font-weight: 300;
            font-size: 1rem;
            line-height: 1.25em;
            text-align: left; }
          .payment-states .payment-states-texts__cta {
            position: initial;
            margin: 64px 0 0 0;
            width: 300px; } }
  
  .online-payment-list {
    display: grid;
    grid-row-gap: 16px;
    grid-auto-rows: -webkit-max-content;
    grid-auto-rows: max-content; }
    @media only screen and (max-width: 959px) {
      .online-payment-list {
        padding: 60px 0 100px 0; } }
    .online-payment-list__card-wrapper {
      display: flex;
      justify-content: center;
      align-items: center;
      position: fixed;
      bottom: 0;
      height: 90px;
      width: 100%;
      left: 0;
      background: white;
      border-top: 2px solid #f5f0eb;
      z-index: 10000; }
    @media only screen and (min-width: 960px) {
        .online-payment-list__card-wrapper {
          display: block;
          position: static;
          border: none; } }
    .online-payment-list__btn-new-card {
      width: calc(100% - 40px);
      border: 1px solid #dcdcdc;
      transition: all 200ms ease-in-out;
      max-width: 600px; }
    @media only screen and (min-width: 960px) {
        .online-payment-list__btn-new-card {
          width: 100%;
          margin: 0 auto;
          max-width: 100%; } }
    .online-payment-list__btn-new-card:hover {
        border-color: #ffe115; }
  
  .card-brand {
    display: grid;
    grid-row-gap: 40px; }
    .card-brand__header {
      display: grid;
      padding: 0 16px;
      grid-template-columns: 30px 1fr 30px;
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 9997;
      background: white; }
    .card-brand__header h1 {
        font-weight: 500;
        font-size: 0.75rem;
        line-height: 1em;
        margin: 0;
        text-transform: uppercase;
        text-align: center;
        align-items: center;
        display: grid;
        color: #3e3e3e; }
    .card-brand__header .card-brand-header__icon {
        margin-left: 0;
        display: grid; }
    .card-brand__container {
      display: grid;
      grid-auto-rows: -webkit-min-content;
      grid-auto-rows: min-content;
      grid-row-gap: 16px;
      overflow-y: auto;
      padding-right: 11px;
      padding-left: 16px;
      margin-right: 5px; }
    .card-brand__container::-webkit-scrollbar-track {
        border-radius: 50px;
        background-color: transparent; }
    .card-brand__container::-webkit-scrollbar {
        width: 4px;
        background-color: transparent; }
    .card-brand__container::-webkit-scrollbar-thumb {
        border-radius: 50px;
        background-color: #dcdcdc; }
    .card-brand__container .option-button.card-brand__option-button {
        height: 60px;
        background: white;
        width: 100%; }
    .card-brand__container .option-button.card-brand__option-button .option-button__description-text {
          text-transform: none;
          font-weight: 400;
          color: #717171;
          margin-left: 14px; }
    .card-brand__container .option-button.card-brand__option-button .option-button__icon {
          margin: 0 10px; }
    .card-brand__container .option-button.card-brand__option-button:hover {
          background: #f7f7f7; }
    .card-brand__container .option-button.card-brand__option-button .icon-marmita {
          height: 40px;
          width: 40px;
          display: grid;
          align-items: center;
          justify-content: center; }
    .card-brand__container .option-button.card-brand__option-button .icon-marmita svg {
            width: 32px;
            height: 24px; }
    @media only screen and (min-width: 768px) {
      .card-brand {
        padding: 30px 0 30px 40px; }
        .card-brand__header {
          position: initial;
          padding-left: 0;
          padding-right: 40px;
          grid-template-columns: repeat(3, 1fr); }
          .card-brand__header h1 {
            text-transform: none;
            font-weight: 400;
            font-size: 1.125rem;
            line-height: 1.375em; }
        .card-brand__container {
          height: 390px;
          padding-right: 35px;
          padding-left: 0; }
          .card-brand__container .option-button.card-brand__option-button {
            height: 80px; }
            .card-brand__container .option-button.card-brand__option-button .btn__label {
              font-size: 1rem;
              line-height: 1.125em;
              margin-left: 20px; } }
  
  .card-type {
    display: grid;
    grid-row-gap: 40px;
    padding: 0; }
    .card-type h1 {
      height: 22px;
      font-weight: 500;
      align-items: center;
      display: grid;
      margin: 0;
      font-size: 1.125rem;
      line-height: 1.375em;
      text-align: center;
      color: #3e3e3e; }
    .card-type__container {
      display: grid;
      grid-auto-flow: row;
      grid-row-gap: 1px; }
    .card-type__container .card-type-container {
        height: 60px;
        background: white;
        margin: 0; }
    .card-type__container .btn__label {
        margin: 0;
        display: grid;
        font-weight: 400;
        align-items: center;
        color: #717171;
        font-size: 0.875rem;
        line-height: 1.125em;
        margin-left: 20px;
        text-align: start !important; }
    .card-type .btn.btn--iconize .btn__icon {
      height: 40px;
      width: 40px; }
    .card-type .icon-marmita {
      background: #f2f2f2;
      border-radius: 40px;
      display: grid;
      align-items: center;
      justify-content: center; }
    .card-type .icon-marmita--market svg path, .card-type .icon-marmita--payment-type-alt svg path {
        color: #3e3e3e;
        fill: #3e3e3e; }
    .card-type .icon-marmita svg {
        width: 20px;
        height: 20px;
        color: #3e3e3e; }
    .card-type .icon-marmita svg g {
          fill: #3e3e3e; }
    @media only screen and (min-width: 768px) {
      .card-type {
        grid-row-gap: 70px;
        padding: 30px 40px 0; }
        .card-type h1 {
          height: 46px;
          font-weight: 400; }
        .card-type__container {
          grid-row-gap: 16px; }
          .card-type__container .card-type-container {
            height: 80px;
            border: 1px solid #f2f2f2;
            border-radius: 8px; }
            .card-type__container .card-type-container:hover {
              background: #f7f7f7; }
          .card-type__container .btn__label {
            font-size: 1rem;
            line-height: 1.125em; } }
  
  .dynamic-card-container {
    -webkit-perspective: 335px;
            perspective: 335px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
  
  .dynamic-card {
    width: 335px;
    height: 208px;
    margin: 0 auto;
    position: relative;
    transition: all 350ms ease-in-out;
    transition-delay: 150ms;
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
    -webkit-transform-origin: left;
            transform-origin: left; }
  
  .dynamic-card--flipped {
      -webkit-transform-origin: left;
              transform-origin: left;
      -webkit-transform: translateX(100%) rotateY(180deg);
              transform: translateX(100%) rotateY(180deg); }
  
  .dynamic-card__front {
      width: 335px;
      height: 208px;
      left: -1px;
      position: absolute;
      margin: 0 auto;
      box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
      border-radius: 10px;
      padding: 8px 20px 20px;
      display: grid;
      background-color: white;
      grid-template-rows: repeat(3, 1fr);
      -webkit-backface-visibility: hidden;
              backface-visibility: hidden; }
  
  .dynamic-card__front .dynamic-card-front__header {
        display: grid;
        grid-template-columns: 40px -webkit-max-content -webkit-min-content auto;
        grid-template-columns: 40px max-content min-content auto;
        grid-column-gap: 12px;
        align-content: start;
        align-items: center; }
  
  .dynamic-card__front .dynamic-card-front__header .icon-marmita {
          justify-self: center;
          width: auto;
          height: 40px; }
  
  .dynamic-card__front .dynamic-card-front__header p {
          margin: 0;
          color: white;
          font-weight: 300;
          font-size: 0.75rem;
          line-height: initial; }
  
  .dynamic-card__front .dynamic-card-front__number {
        display: grid;
        align-content: center;
        margin: 0;
        font-weight: 300;
        font-size: 1.125rem;
        line-height: 1.375em;
        letter-spacing: 0.05em;
        color: white; }
  
  .dynamic-card__front .dynamic-card-front__footer {
        display: grid;
        grid-template-columns: auto auto;
        grid-column-gap: 10px;
        align-content: end;
        align-items: center; }
  
  .dynamic-card__front .dynamic-card-front__footer p {
          margin: 0;
          font-weight: 300;
          font-size: 0.875rem;
          line-height: 1.375em;
          color: white; }
  
  .dynamic-card__front .dynamic-card-front__footer .dynamic-card-front-name {
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis; }
  
  .dynamic-card__front .dynamic-card-front__footer .dynamic-card-front-expiration {
          display: grid;
          justify-content: end; }
  
  .dynamic-card__front--clipped {
        box-shadow: initial;
        -webkit-clip-path: ellipse(488px 427px at -147% -147%);
                clip-path: ellipse(488px 427px at -147% -147%); }
  
  .dynamic-card__front--default .dynamic-card-front__header .icon-marmita {
        width: 20px;
        height: 40px; }
  
  @media (max-height: 373px), (max-width: 375px) {
          .dynamic-card__front--default .dynamic-card-front__header .icon-marmita {
            transition: all 350ms ease-in-out;
            width: 15px;
            height: 15px; } }
  
  .dynamic-card__front--sodexo .dynamic-card-front__header p, .dynamic-card__front--alelo .dynamic-card-front__header p, .dynamic-card__front--baricompras .dynamic-card-front__header p, .dynamic-card__front--cooper .dynamic-card-front__header p, .dynamic-card__front--ticket .dynamic-card-front__header p, .dynamic-card__front--valecard .dynamic-card-front__header p, .dynamic-card__front--vr .dynamic-card-front__header p, .dynamic-card__front--va .dynamic-card-front__header p, .dynamic-card__front--default .dynamic-card-front__header p {
        color: #3e3e3e; }
  
  .dynamic-card__front--sodexo .dynamic-card-front__number, .dynamic-card__front--alelo .dynamic-card-front__number, .dynamic-card__front--baricompras .dynamic-card-front__number, .dynamic-card__front--cooper .dynamic-card-front__number, .dynamic-card__front--ticket .dynamic-card-front__number, .dynamic-card__front--valecard .dynamic-card-front__number, .dynamic-card__front--vr .dynamic-card-front__number, .dynamic-card__front--va .dynamic-card-front__number, .dynamic-card__front--default .dynamic-card-front__number {
        color: #3e3e3e; }
  
  .dynamic-card__front--sodexo .dynamic-card-front__footer p, .dynamic-card__front--alelo .dynamic-card-front__footer p, .dynamic-card__front--baricompras .dynamic-card-front__footer p, .dynamic-card__front--cooper .dynamic-card-front__footer p, .dynamic-card__front--ticket .dynamic-card-front__footer p, .dynamic-card__front--valecard .dynamic-card-front__footer p, .dynamic-card__front--vr .dynamic-card-front__footer p, .dynamic-card__front--va .dynamic-card-front__footer p, .dynamic-card__front--default .dynamic-card-front__footer p {
        color: #3e3e3e; }
  
  .dynamic-card__front--default {
        background-image: url("/static/images/cards/default.svg");
        background-size: cover; }
  
  .dynamic-card__front--ifood {
        background-image: url("/static/images/cards/ifood-card.svg");
        background-size: cover; }
  
  .dynamic-card__front--alelo {
        background: linear-gradient(237.89deg, #C6EC58 9.3%, #A3CB32 71.03%); }
  
  .dynamic-card__front--elo {
        background: linear-gradient(242.04deg, #333232 8.77%, #262626 92.86%); }
  
  .dynamic-card__front--greencard {
        background: linear-gradient(61.96deg, #558E65 23.72%, #76B187 87.25%); }
  
  .dynamic-card__front--visa {
        background: linear-gradient(242.32deg, #207FB6 9.41%, #075989 90.63%); }
  
  .dynamic-card__front--amex {
        background: linear-gradient(222.64deg, #51BAE8 8.91%, #007EC3 58.73%); }
  
  .dynamic-card__front--diners {
        background: linear-gradient(59.75deg, #1573B8 27.08%, #248AD5 93.66%); }
  
  .dynamic-card__front--goodcard {
        background: linear-gradient(61.27deg, #1B4A96 16.33%, #3A6EC4 93.71%); }
  
  .dynamic-card__front--hipercard {
        background: linear-gradient(55.95deg, #AD0F17 28.6%, #D01F34 87.35%); }
  
  .dynamic-card__front--mastercard {
        background: linear-gradient(242.04deg, #5A5A5A 8.77%, #343434 92.86%); }
  
  .dynamic-card__front--baricompras, .dynamic-card__front--ticket, .dynamic-card__front--valecard, .dynamic-card__front--cooper, .dynamic-card__front--vr, .dynamic-card__front--va, .dynamic-card__front--sodexo {
        background: linear-gradient(61.27deg, #E4E4E4 16.34%, #FFFFFF 64.52%); }
  
  .dynamic-card__front--verdecard {
        background: linear-gradient(229.29deg, #0DBC5E 9.09%, #009E49 48.31%); }
  
  .dynamic-card__front--branded {
        transition: all 750ms;
        box-shadow: initial;
        -webkit-clip-path: ellipse(488px 427px at 0% 0%);
                clip-path: ellipse(488px 427px at 0% 0%); }
  
  .dynamic-card__back {
      box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
      background-color: white;
      width: 335px;
      height: 208px;
      position: absolute;
      margin: 0 auto;
      border-radius: 10px;
      padding-top: 26px;
      -webkit-transform: rotateY(180deg);
              transform: rotateY(180deg);
      -webkit-backface-visibility: hidden;
              backface-visibility: hidden; }
  
  .dynamic-card__back .dynamic-card-back__magnetic-tape {
        width: calc(100% - 0.1px);
        height: 48px;
        background: rgba(0, 0, 0, 0.9); }
  
  .dynamic-card__back .dynamic-card-back__csc {
        background: white;
        text-align: right;
        border-radius: 6px;
        margin: 20px 53px 0 22px;
        line-height: 1.375em;
        padding: 5px 10px;
        font-weight: 300;
        font-size: 0.875rem;
        color: #3f3e3e;
        height: 30px; }
  
  .dynamic-card__back--default {
        background-image: url("/static/images/cards/default.svg");
        background-size: cover; }
  
  .dynamic-card__back--ifood {
        background-image: url("/static/images/cards/ifood-card.svg");
        background-size: cover; }
  
  .dynamic-card__back--alelo {
        background: linear-gradient(237.89deg, #C6EC58 9.3%, #A3CB32 71.03%); }
  
  .dynamic-card__back--elo {
        background: linear-gradient(242.04deg, #333232 8.77%, #262626 92.86%); }
  
  .dynamic-card__back--greencard {
        background: linear-gradient(61.96deg, #558E65 23.72%, #76B187 87.25%); }
  
  .dynamic-card__back--visa {
        background: linear-gradient(242.32deg, #207FB6 9.41%, #075989 90.63%); }
  
  .dynamic-card__back--amex {
        background: linear-gradient(222.64deg, #51BAE8 8.91%, #007EC3 58.73%); }
  
  .dynamic-card__back--diners {
        background: linear-gradient(59.75deg, #1573B8 27.08%, #248AD5 93.66%); }
  
  .dynamic-card__back--goodcard {
        background: linear-gradient(61.27deg, #1B4A96 16.33%, #3A6EC4 93.71%); }
  
  .dynamic-card__back--hipercard {
        background: linear-gradient(55.95deg, #AD0F17 28.6%, #D01F34 87.35%); }
  
  .dynamic-card__back--mastercard {
        background: linear-gradient(242.04deg, #5A5A5A 8.77%, #343434 92.86%); }
  
  .dynamic-card__back--baricompras, .dynamic-card__back--ticket, .dynamic-card__back--valecard, .dynamic-card__back--cooper, .dynamic-card__back--vr, .dynamic-card__back--va, .dynamic-card__back--sodexo {
        background: linear-gradient(61.27deg, #E4E4E4 16.34%, #FFFFFF 64.52%); }
  
  .dynamic-card__back--verdecard {
        background: linear-gradient(229.29deg, #0DBC5E 9.09%, #009E49 48.31%); }
  
  @media (max-height: 373px), (max-width: 375px) {
      .dynamic-card {
        transition: all 350ms ease-in-out;
        width: 230px;
        height: 126px; }
        .dynamic-card__front {
          padding: 12px;
          width: 230px;
          height: 126px; }
          .dynamic-card__front .dynamic-card-front__header {
            grid-template-columns: 15px -webkit-max-content -webkit-min-content auto;
            grid-template-columns: 15px max-content min-content auto;
            grid-column-gap: 12px; }
            .dynamic-card__front .dynamic-card-front__header .icon-marmita {
              width: auto;
              height: 15px; }
            .dynamic-card__front .dynamic-card-front__header p {
              font-size: 0.625rem; }
          .dynamic-card__front .dynamic-card-front__number {
            font-size: 0.875rem; }
          .dynamic-card__front .dynamic-card-front__footer p {
            font-size: 0.75rem; }
        .dynamic-card__back {
          width: 230px;
          height: 126px; }
          .dynamic-card__back .dynamic-card-back__magnetic-tape {
            height: 24px; }
          .dynamic-card__back .dynamic-card-back__csc {
            margin: 20px 16px;
            line-height: initial;
            font-size: 0.75rem;
            color: #3f3e3e;
            height: 20px; } }
  
  .payment-method-form__header {
    display: grid;
    margin: 14px 16px;
    grid-template-columns: 30px 1fr 30px; }
    .payment-method-form__header h1 {
      font-weight: 500;
      font-size: 0.75rem;
      line-height: 1em;
      margin: 0;
      text-transform: uppercase;
      text-align: center;
      align-items: center;
      display: grid;
      color: #3e3e3e; }
    .payment-method-form__container {
    display: grid;
    grid-template-rows: -webkit-min-content 80px 50px;
    grid-template-rows: min-content 80px 50px;
    grid-row-gap: 20px; }
    @media only screen and (max-width: 374px) {
      .payment-method-form__container {
        grid-row-gap: 12px; } }
    @media only screen and (max-width: 767px) {
      .payment-method-form__container .btn--default {
        margin: 0;
        border-radius: 0; }
        .payment-method-form__container .btn--default[disabled] {
          background: #f2f2f2;
          opacity: 1; }
          .payment-method-form__container .btn--default[disabled] .btn__label {
            color: #a6a6a6; } }
    .payment-method-form__container .payment-method-form-container-buttons .payment-method-form-container__continue {
      width: 100vw; }
    .payment-method-form__container .payment-method-form-container-buttons .payment-method-form-container__continue--done {
        display: none;
        visibility: hidden; }
    .payment-method-form__container .payment-method-form-container-buttons .payment-method-form-container__submit {
      display: none;
      visibility: hidden;
      width: 100vw; }
    .payment-method-form__container .payment-method-form-container-buttons .payment-method-form-container__submit--done {
        display: initial;
        visibility: initial; }
    .payment-method-form__form-container {
    display: grid;
    background: white;
    position: relative;
    width: 100vw; }
    .payment-method-form__form-container .smaller-fields, .payment-method-form__form-container .form-input {
      padding: 0;
      position: absolute;
      width: calc(100vw - 32px);
      margin: 0 auto;
      left: 0;
      max-width: 343px;
      right: 0; }
    .payment-method-form__form-container .form-input {
      display: none; }
    .payment-method-form__form-container .form-input--active-input {
        display: initial; }
    .payment-method-form__dynamic-cards {
    display: grid;
    grid-auto-columns: -webkit-max-content;
    grid-auto-columns: max-content;
    grid-auto-flow: column;
    grid-row-start: 1;
    align-content: center;
    z-index: -1;
    transition: all 350ms ease-in-out;
    align-items: center; }
    .payment-method-form__dynamic-cards--editing {
      -webkit-transform: translateX(-100vw);
              transform: translateX(-100vw); }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container {
      width: 100vw; }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper {
        display: grid;
        align-content: center;
        justify-content: center;
        width: 100vw;
        grid-column-start: 1;
        grid-row-gap: 10px; }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .disclaimer {
          width: 287px;
          font-weight: 300;
          font-size: 14px;
          line-height: 20px;
          text-align: center;
          color: #717171;
          margin: 0 auto;
          justify-self: center;
          grid-column-start: 1; }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .brands {
          display: grid;
          grid-auto-flow: column;
          grid-auto-columns: -webkit-min-content;
          grid-auto-columns: min-content;
          grid-column-gap: 8px;
          justify-content: center; }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .not-accepted-disclaimer {
          max-width: 343px;
          background: #f7f7f7;
          border: 1px solid #dcdcdc;
          box-sizing: border-box;
          border-radius: 8px;
          margin: 0 16px; }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .not-accepted-disclaimer p {
            margin: 0;
            padding: 16px;
            font-weight: 300;
            font-size: 0.875rem;
            line-height: 1.25em;
            text-align: center;
            color: #717171; }
    @media only screen and (max-width: 374px) {
            .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .not-accepted-disclaimer {
              margin: 0 8px; }
              .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .not-accepted-disclaimer p {
                padding: 8px; } }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__cards {
        display: grid;
        grid-template-columns: repeat(2, 100vw);
        transition: all 150ms ease-in-out;
        align-items: center; }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__cards--document {
          -webkit-transform: translateX(-100vw);
                  transform: translateX(-100vw); }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__separator {
        display: none; }
    @media only screen and (min-width: 768px) {
    .payment-method-form {
      padding: 30px 0 16px;
      height: initial; }
      .payment-method-form__header {
        padding: 0 40px;
        grid-template-columns: repeat(3, 1fr);
        margin-bottom: 0; }
        .payment-method-form__header h1 {
          text-transform: none;
          font-weight: 400;
          font-size: 1.125rem;
          line-height: 1.375em; }
      .payment-method-form__container {
        grid-row-gap: 10px;
        grid-template-columns: auto 400px;
        padding: 30px 10px 10px 0;
        height: initial;
        grid-template-rows: initial; }
        .payment-method-form__container .payment-method-form-container-buttons {
          display: initial;
          padding-left: 30px;
          position: initial; }
          .payment-method-form__container .payment-method-form-container-buttons .payment-method-form-container__continue {
            visibility: hidden;
            display: none; }
          .payment-method-form__container .payment-method-form-container-buttons .payment-method-form-container__submit {
            display: initial;
            visibility: initial;
            position: initial;
            padding-left: 30px;
            width: 320px; }
      .payment-method-form__form-container {
        grid-row-gap: 10px;
        width: 350px;
        padding: 0 10px 0 30px; }
        .payment-method-form__form-container .smaller-fields, .payment-method-form__form-container .form-input {
          width: initial;
          margin: 0;
          position: initial;
          display: initial; }
        .payment-method-form__form-container .form-input {
          min-height: 83px; }
        .payment-method-form__form-container .smaller-fields {
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          grid-column-gap: 20px; }
      .payment-method-form__dynamic-cards {
        grid-auto-columns: initial;
        grid-row-start: initial;
        grid-auto-flow: initial;
        grid-template-rows: 250px auto;
        grid-row-gap: 20px; }
        .payment-method-form__dynamic-cards--editing {
          -webkit-transform: initial;
                  transform: initial; }
        .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container {
          width: initial;
          display: grid;
          grid-template-columns: 28px 345px 28px;
          align-content: center; }
          .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper {
            width: auto;
            grid-column-start: initial; }
            .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .disclaimer {
              margin: 0 auto; }
            .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .brands {
              display: none; }
            .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__disclaimer-wrapper .not-accepted-disclaimer {
              margin: 0 50px; }
          .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__cards {
            grid-template-columns: repeat(2, 350px);
            grid-column-gap: 50px; }
            .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__cards--document {
              grid-column-gap: 32px;
              -webkit-transform: translateX(-382px);
                      transform: translateX(-382px); }
          .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__separator {
            display: initial;
            background: linear-gradient(89.06deg, #FFFFFF 29.65%, rgba(255, 255, 255, 0) 105.86%);
            z-index: 1;
            height: 250px; }
            .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__separator--right {
              -webkit-transform: rotate(180deg);
                      transform: rotate(180deg); } }
    @media only screen and (min-width: 960px) {
    .payment-method-form__container {
      grid-template-columns: auto 445px;
      padding: 30px 10px 10px 60px; }
      .payment-method-form__container .payment-method-form-container-buttons {
        padding-left: 0; }
    .payment-method-form__form-container {
      padding: 0; }
      .payment-method-form__form-container .form-input {
        min-height: 73px; }
    .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container {
      grid-template-columns: 50px 345px 50px; }
      .payment-method-form__dynamic-cards .payment-method-form-dynamic-cards-container__cards--document {
        -webkit-transform: translateX(-395px);
                transform: translateX(-395px); }
    .payment-method-form .payment-method-form-container__submit {
      padding-left: 0 !important;
      width: 350px !important; } }
    @media (max-height: 373px) {
    .payment-method-form__container {
      height: 100%;
      grid-template-rows: -webkit-min-content 55px 40px;
      grid-template-rows: min-content 55px 40px;
      grid-row-gap: 4px; }
    .payment-method-form .form-input .form-input__field:focus + .label__name, .payment-method-form .form-input .form-input__label.form-input__label--has-value .label__name {
      -webkit-transform: translateY(-14px);
              transform: translateY(-14px);
      font-size: 0.625rem; }
    .payment-method-form .form-input .form-input__label {
      height: 40px; }
      .payment-method-form .form-input .form-input__label .label__name {
        font-size: 0.75rem; }
    .payment-method-form .payment-method-form-container__continue {
      height: 40px; } }
    .payment-method-form .payment-method-form-brands__card-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 25px;
    width: 29px; }
    .payment-method-form .payment-method-form-brands__card-item img {
      max-width: 100%;
      max-height: 100%; }
  
  .payment-method-form-modal {
    height: 407px;
    width: 100vw;
    padding: 50px 0;
    transition: all 300ms !important; }
    .payment-method-form-modal--brand, .payment-method-form-modal--form {
      height: 100%;
      padding: 16px 0; }
    .payment-method-form-modal--form {
      padding: 0; }
    .payment-method-form-modal--form .steps-router {
        height: 100vh;
        overflow-y: scroll; }
    @media only screen and (min-width: 768px) {
          .payment-method-form-modal--form .steps-router {
            overflow-y: initial;
            height: 100%; } }
    .payment-method-form-modal--form .steps-router__step::-webkit-scrollbar {
          display: none; }
    @media only screen and (min-width: 768px) {
      .payment-method-form-modal {
        width: 593px;
        height: 615px;
        padding: 16px 0; }
        .payment-method-form-modal--form {
          width: 750px;
          height: 705px; } }
    @media only screen and (min-width: 960px) {
      .payment-method-form-modal--form {
        width: 855px;
        height: 650px; } }
    .payment-method-form-modal .marmita-modal__inner-content-scroll {
      width: 100%;
      height: 100%; }
    .payment-method-form-modal .steps-router__step {
      overflow-y: auto; }
    .payment-method-form-modal .steps-router__step::-webkit-scrollbar-track {
        border-radius: 50px;
        background-color: transparent; }
    .payment-method-form-modal .steps-router__step::-webkit-scrollbar {
        width: 4px;
        background-color: transparent; }
    .payment-method-form-modal .steps-router__step::-webkit-scrollbar-thumb {
        border-radius: 50px;
        background-color: #dcdcdc; }
  
  .payment-cash-modal {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 0 20px; }
    .payment-cash-modal__title {
      font-size: 1.125rem;
      font-weight: 500;
      text-align: center; }
    .payment-cash-modal__message {
      display: flex;
      flex-direction: column;
      font-size: 0.875rem;
      font-weight: lighter;
      line-height: 18px;
      padding: 20px 40px 0;
      text-align: center; }
    .payment-cash-modal__actions {
      display: flex;
      justify-content: space-between;
      margin-top: 30px; }
    .payment-cash-modal__button {
      display: flex;
      flex: 1; }
    .payment-cash-modal__button:first-of-type {
        margin-right: 10px; }
    .payment-cash-modal__button:last-of-type {
        margin-left: 10px; }
    .payment-cash-modal__input-container {
      font-size: 1.375rem;
      color: #a6a5a5;
      font-weight: bold;
      display: flex;
      align-items: baseline;
      justify-content: center; }
    .payment-cash-modal__input-container .form-input {
        width: 110px; }
    .payment-cash-modal__input-container .form-input .form-input__field {
          text-align: center; }
    .payment-cash-modal__currency {
      padding-right: 5px; }
  
  .offline-payment-list {
    padding: 0 16px;
    margin-bottom: 20px; }
    .offline-payment-list__options {
      grid-auto-rows: -webkit-min-content;
      grid-auto-rows: min-content;
      grid-row-gap: 16px;
      display: grid; }
    .offline-payment-list__category-title {
      margin-top: 16px;
      font-weight: 500;
      font-size: 0.875rem;
      line-height: 1.125em;
      color: #3e3e3e; }
    @media only screen and (min-width: 960px) {
      .offline-payment-list {
        padding: 0; }
        .offline-payment-list__options {
          grid-template-columns: 1fr 1fr;
          grid-gap: 20px; }
        .offline-payment-list__category-title {
          display: none; } }
  
  .cart-bar {
    height: 50px;
    width: 100%;
    font-weight: 500;
    text-align: center;
    color: #ffffff;
    overflow: hidden; }
    .cart-bar--with-home-button {
      height: 70px; }
    @media only screen and (min-width: 960px) {
      .cart-bar {
        display: none; } }
    .cart-bar__wrapper {
      -webkit-transform: translateY(-50px);
              transform: translateY(-50px);
      transition: -webkit-transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      transition: transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      transition: transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      transition-delay: 300ms; }
    .cart-bar__wrapper--new-item {
        transition: none;
        -webkit-transform: translateY(0);
                transform: translateY(0); }
    .cart-bar__container {
      display: flex;
      height: 50px;
      width: 100%;
      padding: 20px;
      position: relative;
      justify-content: space-between;
      align-items: center; }
    .cart-bar__container > span {
        display: table;
        vertical-align: baseline; }
    .cart-bar__bag {
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative; }
    .cart-bar__bag .icon-marmita {
        height: 21px;
        width: 21px; }
    .cart-bar__bag .icon-marmita svg {
          fill: #ffffff; }
    .cart-bar__amount {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 16px;
      min-width: 16px;
      font-size: 0.5rem;
      background-color: #fff;
      color: #ffe115;
      border: 2px solid #ffe115;
      border-radius: 100%;
      position: absolute;
      top: 0;
      right: -7px;
      padding: 2px 0 0 0; }
    .cart-bar__title {
      position: absolute;
      width: 100%;
      left: 0;
      font-size: 0.8125rem; }
    .cart-bar__cost {
      font-size: 0.875rem; }
  
  .delivery-info {
    display: grid;
    max-height: 100px;
    min-height: 60px; }
    .delivery-info__address {
      color: #fff;
      display: flex;
      padding: 2px 20px 20px; }
    .delivery-info__address .icon-marmita {
        position: absolute;
        left: 0;
        top: -2px;
        width: 25px; }
    .delivery-info__address .icon-marmita svg {
          color: #fed298;
          fill: #fed298; }
    .delivery-info__street-name {
      font-size: 1rem;
      font-weight: 500;
      margin: 0;
      padding-left: 35px;
      position: relative; }
    .delivery-info__complement {
      font-size: 0.9375rem;
      margin: 0 0 5px 0;
      padding-left: 35px; }
    .delivery-info__change-address-button {
      background: none;
      border: 0;
      color: #fed298;
      display: inline-block;
      margin-left: auto;
      text-decoration: none; }
    .delivery-info__description {
      display: grid;
      align-items: center; }
  
  .order-receipt__wrapper {
    align-items: center;
    justify-content: space-between;
    display: flex;
    position: relative; }
    .order-receipt__wrapper .form-input {
      flex-grow: 1;
      margin: 5px 0; }
    .order-receipt__wrapper .form-input__field[disabled] {
      opacity: 0.4; }
    .order-receipt__wrapper .marmita-toggle {
      margin-left: 10px;
      top: -8px; }
    @media only screen and (min-width: 1248px) {
        .order-receipt__wrapper .marmita-toggle {
          position: absolute;
          right: 20px;
          top: 20px; } }
    @media only screen and (min-width: 320px) {
        .order-receipt__wrapper .marmita-toggle__slider--checked::before {
          left: -1px; } }
    .order-receipt__dialog {
    margin: 0;
    font-size: 0.875rem;
    color: #ffe115;
    font-style: italic; }
    .order-receipt__submit-button {
    margin-top: 30px; }
  
  .order-receipt-modal {
    padding: 0 20px; }
  
  .cvv-disclaimer-dialog {
    padding: 20px; }
    .cvv-disclaimer-dialog__title {
      color: #3f3e3e;
      font-size: 1.375rem;
      font-weight: 500;
      margin: 0 0 10px 0;
      text-align: center; }
    .cvv-disclaimer-dialog__description {
      color: #a6a5a5;
      font-size: 1rem;
      line-height: 22px;
      margin: 0 0 10px 0;
      text-align: center; }
    .cvv-disclaimer-dialog__icon {
      display: block;
      margin: 0 auto 20px;
      max-width: 48px; }
  
  .checkout-card-form__flex {
    display: flex; }
    .checkout-card-form__flex .form-input {
      flex: 1; }
    .checkout-card-form__flex .form-input:first-child {
      margin-right: 10px; }
    @media only screen and (max-width: 767px) {
      .checkout-card-form__flex {
        height: 115px; } }
    .checkout-card-form__card-container {
    align-items: center;
    display: flex; }
    .checkout-card-form__card-container .form-input {
      flex: 1;
      margin-right: 10px; }
    .checkout-card-form__question-button {
    background: none;
    border-radius: 100%;
    border: 1px solid #a6a29f;
    color: #a6a29f;
    font-size: 0.6875rem;
    height: 18px;
    line-height: 7px;
    padding: 5px;
    text-align: center;
    width: 18px;
    align-self: center;
    bottom: 8px;
    margin-left: 10px;
    position: relative; }
    .checkout-card-form__brand-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 25px;
    width: 29px;
    -webkit-animation: fadeIn 300ms;
            animation: fadeIn 300ms; }
    .checkout-card-form__brand-icon img {
      max-width: 100%;
      max-height: 100%; }
    .checkout-card-form__input-icon {
    height: 20px;
    width: 15px; }
    @media only screen and (min-width: 960px) and (max-width: 1248px) {
    .checkout-card-form {
      max-width: 90%; } }
    @media only screen and (min-width: 960px) {
    .checkout-card-form .order-receipt__wrapper {
      position: relative; }
      .checkout-card-form .order-receipt__wrapper .marmita-toggle {
        position: absolute;
        right: 20px;
        top: 20px; } }
    @media only screen and (max-width: 959px) {
    .checkout-card-form .btn[type='submit'] {
      width: 100%; } }
  
  .debit-disclaimer-dialog {
    padding: 20px; }
    .debit-disclaimer-dialog__title {
      color: #3f3e3e;
      font-size: 1.375rem;
      font-weight: 500;
      margin: 0 0 10px 0;
      text-align: center; }
    .debit-disclaimer-dialog__description {
      color: #a6a5a5;
      font-size: 1rem;
      line-height: 22px;
      margin: 0 0 10px 0;
      text-align: center; }
    .debit-disclaimer-dialog__icon {
      display: block;
      margin: 0 auto 20px;
      max-width: 48px; }
  
  .online-payment__debit-disclaimer {
    color: #a6a29f;
    font-size: 0.9375rem;
    margin: 0 auto 20px;
    text-align: center;
    width: 200px; }
  
  .online-payment__cards-list {
    display: flex;
    justify-content: space-around;
    margin: 0 auto 20px;
    max-width: 180px; }
  
  .online-payment__card-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 25px;
    width: 29px; }
  
  .online-payment__card-item img {
      max-width: 100%;
      max-height: 100%; }
  
  .online-payment__question-button {
    background: none;
    border-radius: 100%;
    border: 1px solid #a6a29f;
    color: #a6a29f;
    font-size: 0.6875rem;
    height: 18px;
    line-height: 7px;
    padding: 5px;
    text-align: center;
    width: 18px;
    margin-left: 5px; }
  
  .address-icon {
    justify-content: center;
    width: 100%;
    display: none; }
    @media only screen and (max-width: 767px) {
      .address-icon--mobile {
        display: flex; } }
    @media only screen and (min-width: 768px) {
      .address-icon--desktop {
        display: flex; } }
    @-webkit-keyframes ballon-1-animation {
    0% {
      -webkit-transform: translate(0, 6px);
              transform: translate(0, 6px); }
    50% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    100% {
      -webkit-transform: translate(0, 6px);
              transform: translate(0, 6px); } }
    @keyframes ballon-1-animation {
    0% {
      -webkit-transform: translate(0, 6px);
              transform: translate(0, 6px); }
    50% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    100% {
      -webkit-transform: translate(0, 6px);
              transform: translate(0, 6px); } }
    @-webkit-keyframes ballon-2-animation {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(0, 5px);
              transform: translate(0, 5px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
    @keyframes ballon-2-animation {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(0, 5px);
              transform: translate(0, 5px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
    @-webkit-keyframes plant-animation {
    0% {
      -webkit-transform: rotateZ(0);
              transform: rotateZ(0); }
    50% {
      -webkit-transform: rotatez(5deg);
              transform: rotatez(5deg); }
    100% {
      -webkit-transform: rotateZ(0);
              transform: rotateZ(0); } }
    @keyframes plant-animation {
    0% {
      -webkit-transform: rotateZ(0);
              transform: rotateZ(0); }
    50% {
      -webkit-transform: rotatez(5deg);
              transform: rotatez(5deg); }
    100% {
      -webkit-transform: rotateZ(0);
              transform: rotateZ(0); } }
    .address-icon #ballon-1 {
      -webkit-transform-origin: center;
              transform-origin: center;
      -webkit-animation: ballon-1-animation 6s infinite;
              animation: ballon-1-animation 6s infinite;
      -webkit-animation-timing-function: ease-in-out;
              animation-timing-function: ease-in-out; }
    .address-icon #ballon-2 {
      -webkit-transform-origin: center;
              transform-origin: center;
      -webkit-animation: ballon-2-animation 6s infinite;
              animation: ballon-2-animation 6s infinite;
      -webkit-animation-timing-function: ease-in-out;
              animation-timing-function: ease-in-out; }
    .address-icon #plant-1 {
      -webkit-transform-origin: 150px 90px;
              transform-origin: 150px 90px;
      -webkit-animation: plant-animation 5s infinite;
              animation: plant-animation 5s infinite;
      -webkit-animation-timing-function: ease-in-out;
              animation-timing-function: ease-in-out; }
    .address-icon #plant-2 {
      -webkit-transform-origin: 76px 89px;
              transform-origin: 76px 89px;
      -webkit-animation: plant-animation 4s infinite;
              animation: plant-animation 4s infinite;
      -webkit-animation-timing-function: ease-in-out;
              animation-timing-function: ease-in-out; }
  
  .address-list {
    display: grid;
    grid-auto-rows: auto;
    gap: 10px; }
    @media only screen and (min-width: 768px) {
      .address-list {
        width: 100%; } }
    @media only screen and (min-width: 768px) {
      .address-list__search-button {
        display: none; } }
  
  .loop-schedule {
    padding: 26px 20px; }
    @media only screen and (min-width: 768px) {
      .loop-schedule {
        padding: 26px 0; } }
    .loop-schedule__title {
      color: #3e3e3e;
      font-size: 1.375rem;
      font-weight: 500;
      letter-spacing: -1px;
      margin: 0 0 10px; }
    @media only screen and (min-width: 768px) {
        .loop-schedule__title {
          font-size: 1.5rem; } }
    .loop-schedule__sub-title {
      display: block;
      font-size: 0.875rem;
      color: #717171;
      padding: 0 0 20px;
      font-weight: 400; }
    @media only screen and (min-width: 768px) {
        .loop-schedule__sub-title {
          font-size: 1rem; } }
    .loop-schedule__container {
      display: grid;
      grid-template-columns: repeat(2, minmax(90px, 110px));
      grid-gap: 16px;
      min-height: 52px; }
    .loop-schedule__btn-selected--checked {
      border: 1px solid #ffe115;
      color: #ffe115;
      transition: 0.4s ease-in-out; }
  
  .address-login {
    display: grid;
    grid-template-rows: 20px 20px 50px;
    grid-row-gap: 5px;
    text-align: center;
    align-self: end; }
    @media only screen and (max-width: 374px) {
      .address-login {
        grid-template-rows: 20px 40px 50px; } }
    .address-login__title {
      font-size: 1rem;
      line-height: 20px;
      font-weight: 400;
      color: #595756; }
    .address-login__description {
      color: #a6a5a5;
      font-size: 0.875rem;
      line-height: 17px;
      font-weight: 300; }
    .address-login .btn {
      margin: 0; }
  
  .loop-schedule-placeholder {
    padding: 26px 20px; }
    @media only screen and (min-width: 768px) {
      .loop-schedule-placeholder {
        padding: 26px 0; } }
    .loop-schedule-placeholder__title {
      background-color: #e6e6e6;
      width: 100%;
      margin: 0 0 10px;
      display: block;
      height: 30px; }
    @media only screen and (min-width: 768px) {
        .loop-schedule-placeholder__title {
          width: 300px; } }
    .loop-schedule-placeholder__sub-title {
      display: block;
      background-color: #e6e6e6;
      padding: 0 0 20px;
      width: 95%; }
    @media only screen and (min-width: 768px) {
        .loop-schedule-placeholder__sub-title {
          width: 290px; } }
    .loop-schedule-placeholder__container {
      display: grid;
      grid-template-columns: repeat(2, minmax(90px, 110px));
      grid-gap: 16px;
      min-height: 52px; }
    .loop-schedule-placeholder .btn-selected {
      display: block;
      width: 109px;
      height: 51px;
      margin: 16px 0;
      background-color: #e6e6e6; }
  
  .address-options__container {
    align-self: flex-start;
    background: #ffe115;
    display: flex;
    opacity: 0;
    padding-left: 20px;
    padding-right: 10px;
    padding-top: 10px;
    z-index: 2; }
    @media only screen and (min-width: 960px) {
      .address-options__container {
        align-self: center;
        background: transparent; }
        .address-options__container .btn-icon svg {
          color: #ffe115;
          fill: #ffe115; } }
    .address-options__container .btn-icon {
      -webkit-animation: fadeIn 0.3s ease 1 forwards;
              animation: fadeIn 0.3s ease 1 forwards;
      cursor: pointer;
      margin: 0 18px 0 0;
      width: 25px; }
    .address-options__container .btn-icon:last-child {
        margin-right: 0; }
  
  .loop-schedule-container {
    padding: 20px;
    text-align: center; }
    @media only screen and (min-width: 768px) {
      .loop-schedule-container {
        padding: 40px; } }
    .loop-schedule-container__title {
      font-size: 1.125rem;
      line-height: 1.375rem;
      color: #3e3e3e;
      font-weight: 500;
      margin: 0 0 10px; }
    @media only screen and (min-width: 768px) {
        .loop-schedule-container__title {
          font-size: 1.125rem;
          line-height: 1.625rem; } }
    .loop-schedule-container__description {
      color: #717171;
      font-size: 0.875rem;
      line-height: 1.25rem;
      font-weight: 300;
      margin: 0 auto 30px; }
    @media only screen and (min-width: 768px) {
        .loop-schedule-container__description {
          max-width: 500px; } }
    @media only screen and (min-width: 320px) {
        .loop-schedule-container__description {
          font-size: 1rem;
          line-height: 1.375rem;
          max-width: 90%; } }
    .loop-schedule-container__btn {
      color: #ffe115;
      background: none;
      padding: 0 0 0 4px;
      height: auto; }
    .loop-schedule-container__btn:hover:enabled {
        background: none;
        color: #c2121f;
        transition: 0.5s ease-in-out; }
  
  .address-delivery-bar {
    max-width: 100%;
    padding: 0 20px;
    text-align: left;
    height: 65px;
    display: flex;
    justify-content: center;
    flex-direction: column; }
    .address-delivery-bar__title {
      color: #fed298;
      font-size: 0.9375rem;
      margin: 0 0 1px 0; }
    .address-delivery-bar__address {
      color: #f6f5f5;
      font-size: 1.125rem;
      margin: 0; }
  
  .address-list-step {
    position: relative;
    display: grid;
    min-height: 100%;
    width: 100%;
    background-color: white;
    grid-row-gap: 20px;
    grid-auto-rows: -webkit-min-content auto;
    grid-auto-rows: min-content auto; }
    @media only screen and (max-width: 559px) {
      .address-list-step--with-return-button {
        grid-auto-rows: 40px -webkit-min-content auto;
        grid-auto-rows: 40px min-content auto; } }
    .address-list-step--centralize-content {
      grid-auto-rows: -webkit-min-content;
      grid-auto-rows: min-content; }
    .address-list-step__container {
      display: grid;
      grid-row-gap: 20px;
      grid-auto-rows: 40px 54px -webkit-min-content auto;
      grid-auto-rows: 40px 54px min-content auto;
      opacity: 0;
      height: 0;
      overflow: hidden; }
    .address-list-step__container--authenticated {
        grid-auto-rows: -webkit-min-content;
        grid-auto-rows: min-content; }
    .address-list-step__container--visible {
        height: auto;
        opacity: 1;
        overflow: visible; }
    .address-list-step__title {
      color: #3e3e3e;
      font-size: 1.125rem;
      line-height: 22px;
      text-align: center; }
    .address-list-step__back-btn {
      margin-top: 10px; }
    @media only screen and (min-width: 768px) {
        .address-list-step__back-btn {
          display: none; } }
  
  .voucher-rules-modal {
    width: 100%;
    height: 560px;
    display: flex;
    margin: 0 auto;
    align-items: center;
    color: #3e3e3e; }
    @media only screen and (min-width: 768px) {
      .voucher-rules-modal {
        width: 600px;
        height: 100%; } }
    .voucher-rules-modal .marmita-modal__inner-content {
      background: white;
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
      border-radius: 4px;
      position: relative;
      padding: 0; }
    @media only screen and (min-width: 768px) {
        .voucher-rules-modal .marmita-modal__inner-content {
          height: 612px; } }
    .voucher-rules-modal__overlay {
      background-color: rgba(113, 113, 113, 0.9);
      z-index: 10001; }
    .voucher-rules-modal .marmita-modal__actions {
      position: relative; }
    .voucher-rules-modal__container {
      height: 100%;
      position: relative;
      color: #3e3e3e;
      padding: 32px; }
    @media only screen and (min-width: 768px) {
        .voucher-rules-modal__container {
          padding: 10px 70px; } }
    .voucher-rules-modal__icon {
      width: 86px;
      height: 86px;
      margin: 0 auto 32px;
      display: block; }
    .voucher-rules-modal__icon .dash-icon-voucher {
        -webkit-animation: animation-voucher 5s ease-in-out infinite;
                animation: animation-voucher 5s ease-in-out infinite; }
    @media only screen and (min-width: 768px) {
        .voucher-rules-modal__icon {
          width: 94px;
          height: 94px; } }
    .voucher-rules-modal__title {
      font-size: 1.125rem;
      line-height: 1.375rem;
      font-weight: 500;
      text-align: center;
      margin: 0;
      padding: 0 0 8px;
      color: #3e3e3e; }
    @media only screen and (min-width: 768px) {
        .voucher-rules-modal__title {
          font-size: 1.5rem;
          line-height: 1.875rem; } }
    .voucher-rules-modal__short-description {
      padding: 0 0 24px;
      text-align: center;
      display: block;
      font-size: 0.875rem;
      line-height: 1.25rem;
      color: #3e3e3e; }
    @media only screen and (min-width: 768px) {
        .voucher-rules-modal__short-description {
          font-size: 1rem;
          line-height: 1.25rem; } }
    .voucher-rules-modal__btn-see-merchants {
      width: 100%;
      display: grid;
      font-size: 0.875rem;
      line-height: 1.125rem;
      text-align: center;
      font-weight: 500;
      margin: 0 0 24px;
      padding: 0;
      text-decoration: unset;
      border-radius: 4px;
      color: #ffffff; }
    @media only screen and (min-width: 768px) {
        .voucher-rules-modal__btn-see-merchants {
          padding: 16px 0;
          margin: 0 0 32px;
          font-size: 1rem;
          line-height: 1.25rem; } }
    .voucher-rules-modal__btn-see-merchants:hover:enabled {
        color: #ffffff;
        background: #c2121f; }
    .voucher-rules-modal__title-rules {
      font-size: 1rem;
      line-height: 1.375rem;
      font-weight: 500;
      padding: 0 0 8px;
      display: block; }
    .voucher-rules-modal__rules {
      list-style: disc;
      font-size: 0.875rem;
      line-height: 1.25rem;
      font-weight: 300;
      color: #717171; }
    @-webkit-keyframes animation-voucher {
    0% {
      -webkit-transform: skew(-1deg);
              transform: skew(-1deg); }
    50% {
      -webkit-transform: skew(2deg);
              transform: skew(2deg); }
    100% {
      -webkit-transform: skew(-1deg);
              transform: skew(-1deg); } }
    @keyframes animation-voucher {
    0% {
      -webkit-transform: skew(-1deg);
              transform: skew(-1deg); }
    50% {
      -webkit-transform: skew(2deg);
              transform: skew(2deg); }
    100% {
      -webkit-transform: skew(-1deg);
              transform: skew(-1deg); } }
  
  .voucher-container {
    width: 100%;
    max-width: 1366px !important;
    margin: auto;
    padding: 0 30px;
    display: grid;
    grid-template-columns: 1fr;
    justify-content: space-between;
    grid-gap: 30px;
    padding: 20px 40px; }
    @media only screen and (min-width: 960px) {
      .voucher-container {
        padding: 20px 30px 20px 50px;
        grid-template-columns: repeat(3, minmax(266px, 380px)); } }
    .voucher-card {
    background-color: white;
    width: 100%;
    padding: 0;
    border: 1px solid #f7f7f7;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 4px; }
    @media only screen and (min-width: 960px) {
      .voucher-card {
        display: inline-grid;
        grid-template: 'header' 'shortDescription' 'restaurantButton' 'infos' 'rules' 'footer';
        min-height: 190px;
        max-height: 384px; } }
    .voucher-card--disabled {
      color: #717171; }
    .voucher-card--disabled .voucher-card__title {
        color: #a6a6a6; }
    .voucher-card__header {
      position: relative;
      display: grid;
      grid-area: header;
      grid-template: 1fr / 32px 1fr 24px;
      grid-column-gap: 16px;
      padding: 20px; }
    @media only screen and (min-width: 1248px) {
        .voucher-card__header {
          grid-template-columns: 50px 1fr;
          grid-auto-flow: column dense;
          grid-column-gap: 28px;
          padding: 24px 40px; } }
    .voucher-card__icon {
      width: 32px;
      height: 32px; }
    @media only screen and (min-width: 1248px) {
        .voucher-card__icon {
          width: 50px;
          height: 50px; } }
    .voucher-card__title {
      font-size: 1rem;
      color: #3e3e3e;
      margin: 0;
      display: flex;
      align-items: center; }
    @media only screen and (min-width: 1248px) {
        .voucher-card__title {
          font-size: 1.125rem; } }
    .voucher-card__radio {
      display: flex;
      align-items: center; }
    .voucher-card__short-description {
      display: grid;
      grid-area: shortDescription;
      padding: 0 20px 20px;
      color: #717171;
      font-size: 0.875rem;
      font-weight: 300; }
    @media only screen and (min-width: 1248px) {
        .voucher-card__short-description {
          padding: 0 40px 24px; } }
    .voucher-card__infos {
      display: grid;
      grid-area: infos;
      grid-template: 1fr / 50% 50%;
      padding: 0 20px 12px; }
    @media only screen and (min-width: 1248px) {
        .voucher-card__infos {
          padding: 0 40px 12px; } }
    .voucher-card__terms {
      background-color: #ffffff;
      color: #ffe115;
      font-size: 0.875rem;
      font-weight: 500;
      border: 0;
      text-align: left;
      padding: 0;
      cursor: pointer; }
    .voucher-card__expiration-date {
      color: #a6a6a6;
      font-size: 0.875rem;
      display: flex;
      justify-content: flex-end;
      align-items: center; }
    .voucher-card__block {
      width: -webkit-max-content;
      width: -moz-max-content;
      width: max-content;
      display: grid;
      grid-area: footer;
      padding: 10px 20px;
      text-align: center;
      background-color: #f7f7f7;
      color: #717171;
      font-size: 0.75rem; }
    @media only screen and (min-width: 1248px) {
        .voucher-card__block {
          padding: 20px 40px; } }
    .voucher-card__cta-container {
      display: grid;
      grid-area: restaurantButton;
      min-height: 60px;
      padding: 0 20px 20px 20px; }
    .voucher-card__restaurants-link {
      border: 1px solid #ffe115;
      height: 40px;
      background: transparent;
      color: #ffe115;
      width: 100%; }
    .voucher-card__restaurants-link:hover {
        background: #ffe115;
        color: #fff; }
    .voucher-footer {
    display: grid;
    grid-area: footer;
    padding: 10px 20px;
    text-align: center;
    background-color: #f7f7f7;
    color: #717171;
    font-size: 0.875rem; }
    @media only screen and (min-width: 1248px) {
      .voucher-footer {
        min-height: 50px;
        padding: 20px 40px; } }
    .voucher-footer__block {
      display: grid;
      align-items: center;
      grid-area: footer;
      padding: 10px 20px;
      background-color: #f7f7f7;
      color: #717171;
      font-size: 0.875rem;
      grid-template: 1fr / 20px 1fr; }
    @media only screen and (min-width: 1248px) {
        .voucher-footer__block {
          padding: 20px 40px;
          min-height: 50px; } }
    @media only screen and (min-width: 768px) {
        .voucher-footer__block {
          padding: 10px 40px; } }
    .voucher-footer__available {
      display: flex;
      align-items: center;
      justify-content: center; }
    .voucher-footer__icon-block {
      width: 12px;
      display: inline-flex; }
    .voucher-footer__text-block {
      display: inline-flex;
      align-items: center;
      font-size: 0.75em; }
  
  .voucher-slim-card {
    display: flex;
    align-items: center;
    background-color: white;
    padding: 12px 16px;
    border: 1px solid #f7f7f7;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    height: 80px;
    width: 100%;
    cursor: default; }
    @media only screen and (min-width: 960px) {
      .voucher-slim-card {
        cursor: pointer; } }
    .voucher-slim-card__icon {
      width: 34px;
      height: 34px; }
    .voucher-slim-card__header {
      padding-left: 12px;
      display: flex;
      flex-direction: column; }
    .voucher-slim-card__cta {
      margin-left: auto; }
    .voucher-slim-card__cta > button {
        border: 0;
        padding: 0;
        margin-right: 0;
        -webkit-transform: rotate(90deg);
                transform: rotate(90deg); }
    .voucher-slim-card__cta > button > .icon-marmita {
          height: 15px;
          width: 15px; }
    .voucher-slim-card__cta > button > .icon-marmita path {
            fill: #ffe115; }
    .voucher-slim-card__title {
      font-size: 1rem;
      color: #3e3e3e;
      margin: 0;
      display: flex;
      align-items: center;
      padding-bottom: 5px; }
    .voucher-slim-card__short-description {
      color: #717171;
      font-size: 0.75rem; }
    @media only screen and (min-width: 375px) {
        .voucher-slim-card__short-description {
          font-size: 0.875rem; } }
    .voucher-slim-card__expiration-date {
      color: #a6a6a6;
      font-size: 0.875rem;
      text-align: right; }
  
  .loyalty-details-modal .marmita-modal__actions {
    position: relative; }
  
  .loyalty-details {
    height: 100%;
    position: relative;
    color: #3e3e3e;
    padding: 32px 20px; }
  
  @media only screen and (min-width: 768px) {
      .loyalty-details {
        padding: 10px 70px; } }
  
  .loyalty-details__steps-wrapper {
      margin: 0 0 24px;
      height: 60px;
      padding: 0 20px;
      border: 1px solid #f2f2f2;
      box-sizing: border-box;
      border-radius: 5px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column; }
  
  .loyalty-details__steps {
      display: flex;
      justify-content: space-between;
      width: 100%; }
  
  .loyalty-details__steps p {
        display: flex;
        flex-direction: column;
        align-self: flex-end;
        margin: 0 0 6px 0;
        font-size: 0.625rem;
        line-height: 0.875rem;
        color: #a6a6a6; }
  
  .loyalty-details__box-icon svg {
      width: 24px;
      height: 24px; }
  
  .loyalty-details__nav-header {
      padding: 20px;
      display: flex;
      align-items: center; }
  
  .loyalty-details-nav-header__button {
      margin: 0;
      width: 18px;
      height: 18px; }
  
  .loyalty-details-nav-header__title {
      font-size: 0.75rem;
      line-height: 1.25rem;
      color: #3e3e3e;
      text-align: center;
      text-transform: uppercase;
      font-weight: 500;
      width: 100%; }
  
  .loyalty-details-modal {
      width: 100%;
      height: 100vh;
      display: flex;
      margin: 0 auto;
      align-items: center;
      color: #3e3e3e; }
  
  @media only screen and (min-width: 768px) {
        .loyalty-details-modal {
          width: 650px; } }
  
  .loyalty-details-modal .marmita-modal__inner-content {
        background: white;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
        border-radius: 4px;
        position: relative;
        padding: 0; }
  
  @media only screen and (min-width: 768px) {
          .loyalty-details-modal .marmita-modal__inner-content {
            height: 612px; } }
  
  .loyalty-details-modal__overlay {
        background-color: rgba(113, 113, 113, 0.9);
        z-index: 10001; }
  
  .loyalty-details__logo {
      width: 100px;
      height: 100px;
      margin: 0 auto 24px;
      display: block;
      border-radius: 60px;
      border: 1px solid #dcdcdc; }
  
  @media only screen and (min-width: 768px) {
        .loyalty-details__logo {
          width: 74px;
          height: 74px; } }
  
  .loyalty-details__title {
      font-size: 1.25rem;
      line-height: 1.5625rem;
      font-weight: 500;
      text-align: center;
      margin: 0;
      padding: 0 0 10px;
      color: #3e3e3e; }
  
  @media only screen and (min-width: 768px) {
        .loyalty-details__title {
          font-size: 1.5rem;
          line-height: 1.875rem; } }
  
  .loyalty-details__description {
      font-size: 0.875rem;
      line-height: 1.25rem;
      text-align: center;
      margin: 0;
      padding: 0 0 24px;
      font-weight: 100;
      color: #3e3e3e; }
  
  @media only screen and (min-width: 768px) {
        .loyalty-details__description {
          font-weight: normal;
          font-size: 1rem; } }
  
  .loyalty-details__btn-see-menu {
      width: 100%;
      display: block;
      font-size: 1rem;
      line-height: 1.25rem;
      text-align: center;
      font-weight: 500;
      margin: 0 0 32px;
      padding: 20px;
      background-color: #ffe115;
      text-decoration: unset;
      border-radius: 4px;
      color: #ffffff; }
  
  .loyalty-details__btn-see-menu:hover:enabled {
        color: #ffffff;
        background: #c2121f; }
  
  .loyalty-details-rules {
      padding-left: 20px; }
  
  .loyalty-details-rules__title {
        font-size: 1rem;
        line-height: 1.375rem;
        font-weight: 500;
        margin: 0; }
  
  .loyalty-details-rules__item {
        list-style: disc;
        font-size: 0.875rem;
        line-height: 1.25rem;
        font-weight: 300;
        color: #717171; }
  
  .loyalty-details-rules > :nth-child(odd) {
        padding-top: 10px;
        padding-bottom: 10px; }
  
  .address-search-step {
    position: relative;
    display: grid;
    min-height: 100%;
    width: 100%;
    background-color: white;
    grid-row-gap: 20px;
    grid-auto-rows: -webkit-min-content;
    grid-auto-rows: min-content; }
    .address-search-step__title {
      color: #3e3e3e;
      font-size: 1.125rem;
      line-height: 22px;
      text-align: center;
      display: none; }
    @media only screen and (min-width: 768px) {
        .address-search-step__title {
          display: block; } }
    .address-search-step__results {
      padding-top: 5px; }
    .address-search-step .btn-address {
      border-bottom: 1px solid #f7f7f7; }
    .address-search-step .no-results {
      display: grid;
      margin-bottom: auto;
      grid-row-gap: 5px;
      text-align: center; }
    @media only screen and (min-width: 768px) {
        .address-search-step .no-results {
          padding-top: 40px;
          margin: auto;
          width: 40%; } }
    .address-search-step .no-results__description {
        color: #a6a5a5;
        font-size: 0.875rem;
        line-height: 20px;
        font-weight: 300; }
    .address-search-step .no-results .btn {
        margin: 0; }
    .address-search-step .marmita-error-message {
      justify-content: center; }
  
  .address-map-step__no-api {
    height: 100%;
    position: relative;
    display: grid;
    align-items: center;
    justify-content: center; }
  
  .address-map-step__powered-by {
    display: none; }
  
  .address-map-step__complete-form {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
    position: absolute;
    bottom: 0;
    width: 100%;
    display: flex;
    background: linear-gradient(0deg, white 94%, rgba(255, 255, 255, 0.2) 100%);
    justify-content: center;
    align-items: end;
    transition: opacity 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 1;
    padding-top: 40px;
    height: calc(100% - 90px); }
  
  .address-map-step__complete-form--active {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1; }
  
  .address-map-step__complete-form--active ~ .address-maps__map {
        height: 150px; }
  
  .address-map-step__complete-form--active ~ .address-maps__map .address-maps-header {
          background: transparent; }
  
  .address-map-step__complete-form--active .address-map-step__powered-by {
        display: block;
        position: absolute;
        top: -20px;
        right: 20px; }
  
  .address-map-step__complete-form--active .address-map-step__powered-by svg {
          height: 14px;
          width: 116px; }
  
  .address-modal {
    height: 100%;
    padding: 0; }
    @media only screen and (min-width: 768px) {
      .address-modal {
        height: calc(100vh - 100px);
        max-height: 584px;
        width: 694px; } }
    .address-modal .marmita-modal__inner-content {
      display: grid; }
    .address-modal .btn-address {
      margin: 0; }
    .address-modal-overlay > .ReactModal__Content--after-open {
    border-radius: 0; }
    @media only screen and (min-width: 768px) {
      .address-modal-overlay > .ReactModal__Content--after-open {
        top: 80px;
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
        border-radius: 4px; } }
  
  .btn-address {
    width: 100%;
    min-height: 40px;
    padding: 15px;
    border: 0;
    position: relative;
    color: #717171;
    background: transparent;
    overflow: hidden;
    text-decoration: none;
    transition: all 200ms ease-in-out;
    height: auto;
    opacity: 1;
    visibility: visible;
    cursor: pointer; }
    .btn-address button {
      border: 0;
      background: transparent; }
    @media only screen and (min-width: 768px) {
        .btn-address button {
          cursor: pointer; } }
    .btn-address--full-size {
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      position: absolute; }
    .btn-address--disabled {
      pointer-events: none;
      cursor: wait;
      opacity: 0.5; }
    @media only screen and (min-width: 768px) {
      .btn-address:hover, .btn-address:active {
        color: #3e3e3e; }
        .btn-address:hover .btn-address__icon--right, .btn-address:active .btn-address__icon--right {
          fill: #3e3e3e; }
        .btn-address:hover .icon-marmita--location path[stroke='#3e3e3e'], .btn-address:hover .icon-marmita--house path[stroke='#3e3e3e'], .btn-address:hover .icon-marmita--coffee-cup path[stroke='#3e3e3e'], .btn-address:hover .icon-marmita--synchronize-arrow path[stroke='#3e3e3e'], .btn-address:active .icon-marmita--location path[stroke='#3e3e3e'], .btn-address:active .icon-marmita--house path[stroke='#3e3e3e'], .btn-address:active .icon-marmita--coffee-cup path[stroke='#3e3e3e'], .btn-address:active .icon-marmita--synchronize-arrow path[stroke='#3e3e3e'] {
          stroke: #3e3e3e; }
        .btn-address:hover .icon-marmita--location path[fill='#3e3e3e'], .btn-address:hover .icon-marmita--house path[fill='#3e3e3e'], .btn-address:hover .icon-marmita--coffee-cup path[fill='#3e3e3e'], .btn-address:hover .icon-marmita--synchronize-arrow path[fill='#3e3e3e'], .btn-address:active .icon-marmita--location path[fill='#3e3e3e'], .btn-address:active .icon-marmita--house path[fill='#3e3e3e'], .btn-address:active .icon-marmita--coffee-cup path[fill='#3e3e3e'], .btn-address:active .icon-marmita--synchronize-arrow path[fill='#3e3e3e'] {
          fill: #3e3e3e; }
        .btn-address:hover .icon-marmita--location .shadow-bg, .btn-address:hover .icon-marmita--house .shadow-bg, .btn-address:hover .icon-marmita--coffee-cup .shadow-bg, .btn-address:hover .icon-marmita--synchronize-arrow .shadow-bg, .btn-address:active .icon-marmita--location .shadow-bg, .btn-address:active .icon-marmita--house .shadow-bg, .btn-address:active .icon-marmita--coffee-cup .shadow-bg, .btn-address:active .icon-marmita--synchronize-arrow .shadow-bg {
          opacity: 0.2; } }
    .btn-address .icon-marmita svg path,
    .btn-address .icon-marmita svg g {
      transition: all 200ms ease-in-out; }
    .btn-address--default {
      border-radius: 8px;
      border: 1px solid #f2f2f2; }
    @media only screen and (min-width: 768px) {
        .btn-address--default:hover, .btn-address--default:active {
          color: #3e3e3e;
          box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05), 0px 4px 16px rgba(0, 0, 0, 0.08);
          border-color: transparent; } }
    .btn-address--simple .icon-marmita path[stroke='#3e3e3e'] {
      stroke: #a6a6a6; }
    .btn-address--simple .icon-marmita path[fill='#3e3e3e'] {
      fill: #a6a6a6; }
    .btn-address--simple .btn-address__info--description {
      color: #a6a6a6; }
    .btn-address--is-active {
      border-color: #ffe115;
      color: #3e3e3e; }
    .btn-address--is-active .btn-address__icon--right {
        fill: #3e3e3e; }
    .btn-address--is-active .icon-marmita--location path[stroke='#3e3e3e'], .btn-address--is-active .icon-marmita--house path[stroke='#3e3e3e'], .btn-address--is-active .icon-marmita--coffee-cup path[stroke='#3e3e3e'], .btn-address--is-active .icon-marmita--synchronize-arrow path[stroke='#3e3e3e'] {
        stroke: #3e3e3e; }
    .btn-address--is-active .icon-marmita--location path[fill='#3e3e3e'], .btn-address--is-active .icon-marmita--house path[fill='#3e3e3e'], .btn-address--is-active .icon-marmita--coffee-cup path[fill='#3e3e3e'], .btn-address--is-active .icon-marmita--synchronize-arrow path[fill='#3e3e3e'] {
        fill: #3e3e3e; }
    .btn-address--is-active .icon-marmita--location .shadow-bg, .btn-address--is-active .icon-marmita--house .shadow-bg, .btn-address--is-active .icon-marmita--coffee-cup .shadow-bg, .btn-address--is-active .icon-marmita--synchronize-arrow .shadow-bg {
        opacity: 0.2; }
    .btn-address--is-open-actions .btn-address__icon--left {
      margin-right: 20px;
      width: 90px;
      min-width: 90px; }
    .btn-address--is-open-actions .icon-marmita--more-dots {
      fill: #ffe115; }
    .btn-address--is-open-actions .btn-address__icon-actions {
      -webkit-transform: translateX(0);
              transform: translateX(0); }
    .btn-address--is-open-actions .btn-address__icon-action path {
      color: #ffe115;
      fill: #ffe115; }
    .btn-address--is-open-actions .btn-address__icon-action:hover {
      -webkit-transform: scale(1.05);
              transform: scale(1.05); }
    .btn-address--is-open-actions .btn-address__icon-action:hover path {
        color: #c41835;
        fill: #c41835; }
    .btn-address__description {
      font-size: 0.88rem;
      line-height: 20px; }
    .btn-address__container {
      display: flex; }
    .btn-address__info {
      gap: 4px;
      display: grid;
      text-align: left;
      align-content: center;
      flex-grow: 1;
      transition: all 200ms ease-in-out;
      word-break: break-word; }
    .btn-address__info--description {
        line-height: 18px;
        font-size: 14px;
        font-weight: 100; }
    .btn-address__icon--left {
      display: grid;
      align-self: center;
      width: 50px;
      transition: all 200ms ease-in-out;
      min-width: 50px;
      max-height: 40px; }
    .btn-address__icon--left .icon-marmita {
        height: 25px;
        width: 25px; }
    .btn-address__icon--right {
      width: 35px;
      min-width: 35px;
      height: 35px;
      padding: 0 5px;
      display: flex;
      align-content: start;
      -webkit-transform: translate(10px);
              transform: translate(10px);
      fill: #a6a6a6; }
    .btn-address__icon--right button {
        height: 25px; }
    .btn-address__delete-confirmation {
      opacity: 0;
      visibility: hidden;
      background: transparent;
      border: 0;
      cursor: pointer;
      height: 0;
      transition: all 200ms ease; }
    .btn-address__delete-confirmation .icon-marmita {
        height: 30px;
        width: 30px;
        transition: -webkit-transform 200ms ease;
        transition: transform 200ms ease;
        transition: transform 200ms ease, -webkit-transform 200ms ease; }
    .btn-address__delete-confirmation .icon-marmita svg path,
        .btn-address__delete-confirmation .icon-marmita svg g {
          transition: none; }
    .btn-address__delete-confirmation .icon-marmita--error:hover {
          -webkit-transform: scale(1.1);
                  transform: scale(1.1); }
    .btn-address__delete-confirmation .icon-marmita--error:hover svg {
            color: #ffe115;
            fill: #ffe115; }
    .btn-address__delete-confirmation .icon-marmita--confirm:hover {
          -webkit-transform: scale(1.1);
                  transform: scale(1.1); }
    .btn-address__delete-confirmation .icon-marmita--confirm:hover svg {
            color: #50a773;
            fill: #50a773; }
    .btn-address__icon-actions {
      grid-gap: 0 10px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      -webkit-transform: translateX(-50px);
              transform: translateX(-50px);
      transition: all 200ms ease-in-out; }
    .btn-address__icon-actions--delete-confirming .btn-address__delete-confirmation {
        display: flex;
        visibility: visible;
        opacity: 1;
        height: 40px; }
    .btn-address__icon-actions--delete-confirming .btn-address--btn-actions {
        opacity: 0;
        height: 0; }
    .btn-address--btn-actions {
      background: transparent;
      border: 0;
      cursor: pointer;
      height: 40px;
      transition: all 200ms ease; }
    .btn-address--hidden {
      height: 0;
      min-height: 0;
      padding: 0 15px;
      opacity: 0; }
    .btn-address--display-none {
      display: none; }
  
  .address-step-shell {
    height: 100%;
    padding: 20px 0;
    overflow-y: scroll;
    scrollbar-color: #dcdcdc transparent;
    background-color: white; }
    .address-step-shell::-webkit-scrollbar-track {
      border-radius: 50px;
      background-color: transparent; }
    .address-step-shell::-webkit-scrollbar {
      width: 4px;
      background-color: transparent; }
    .address-step-shell::-webkit-scrollbar-thumb {
      border-radius: 50px;
      background-color: #dcdcdc; }
    @media only screen and (min-width: 1248px) {
      .address-step-shell {
        padding: 30px 0; } }
    .address-step-shell > div {
      padding: 0 20px; }
    @media only screen and (min-width: 1248px) {
        .address-step-shell > div {
          padding: 0 30px; } }
  
  .address-search-input {
    position: relative;
    width: 100%; }
    .address-search-input--sticky {
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 1; }
    .address-search-input--sticky::after {
        content: '';
        width: calc(100% + 40px);
        height: 100px;
        top: -22px;
        left: -40px;
        background-color: white;
        position: absolute;
        z-index: -1; }
    @media only screen and (min-width: 768px) {
          .address-search-input--sticky::after {
            left: -20px; } }
    .address-search-input--sticky::before {
        content: '';
        position: absolute;
        bottom: -22px;
        width: calc(100% + 40px);
        height: 22px;
        left: -40px;
        box-shadow: 0px 5px 7px 0px rgba(255, 255, 255, 0.9);
        z-index: -1; }
    @media only screen and (min-width: 768px) {
          .address-search-input--sticky::before {
            left: -20px; } }
    .address-search-input__icon {
      position: absolute;
      left: 13px;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      width: 26px;
      height: 26px;
      margin: 0; }
    .address-search-input__icon svg {
        color: #ffe115;
        fill: #ffe115; }
    @media only screen and (min-width: 768px) {
        .address-search-input__icon {
          left: 25px; } }
    .address-search-input__field {
      display: flex;
      height: 54px;
      width: 100%;
      padding: 5px 35px 5px 50px;
      border: 1px solid #f2f2f2;
      font-size: 1rem;
      line-height: 1.25em;
      font-weight: 300;
      background: #f7f7f7;
      border-radius: 4px; }
    .address-search-input__field::-webkit-input-placeholder {
        color: #a6a6a5;
        font-size: 1rem;
        font-weight: 300; }
    .address-search-input__field:-ms-input-placeholder {
        color: #a6a6a5;
        font-size: 1rem;
        font-weight: 300; }
    .address-search-input__field::-ms-input-placeholder {
        color: #a6a6a5;
        font-size: 1rem;
        font-weight: 300; }
    .address-search-input__field::placeholder {
        color: #a6a6a5;
        font-size: 1rem;
        font-weight: 300; }
    @media only screen and (min-width: 768px) {
        .address-search-input__field {
          padding: 5px 35px 5px 70px; } }
    .address-search-input__erase-button {
      background: transparent;
      border: none;
      margin: 0;
      position: absolute;
      right: 5px;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%); }
    .address-search-input__button {
      position: absolute;
      top: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      cursor: text; }
    .address-search-input__powered-by {
      position: absolute;
      bottom: -25px;
      right: 0; }
    .address-search-input__powered-by svg {
        height: 14px;
        width: 116px; }
  
  .restaurant-rating {
    color: #e7a74e;
    line-height: 0;
    font-size: 0.9375rem;
    flex-shrink: 0;
    height: auto;
    min-width: 40px; }
    .restaurant-rating .icon-marmita {
      width: 14px;
      height: 14px;
      margin: 0 5px 0 0;
      position: relative;
      top: -1px; }
    .restaurant-rating .icon-marmita svg {
        color: #e7a74e;
        fill: #e7a74e; }
    .restaurant-rating .icon-marmita svg {
        width: 100%;
        height: 100%; }
    .restaurant-rating--no-rating {
      color: #c4c4c4; }
    .restaurant-rating--no-rating .icon-marmita svg {
        color: #c4c4c4;
        fill: #c4c4c4; }
    .restaurant-rating__button {
      padding-left: 0;
      padding-right: 0;
      margin: 0; }
    .restaurant-rating__rating-wrapper {
      position: absolute;
      right: 0;
      top: 0; }
    @media only screen and (min-width: 960px) {
        .restaurant-rating__rating-wrapper {
          position: initial;
          right: inherit;
          top: inherit; } }
    .restaurant-rating__rating-count {
      margin: 0 0 0 10px;
      color: #a6a6a6;
      font-weight: 300;
      font-size: 1rem;
      display: none; }
    @media only screen and (min-width: 768px) {
        .restaurant-rating__rating-count {
          display: inline-block; } }
  
  .voucher-badge {
    padding: 8px;
    color: #2e6788;
    background-color: #eef3f5;
    border-radius: 0 0 4px 4px;
    font-size: 0.75rem;
    line-height: 0.9375rem;
    display: inline-flex;
    align-items: center;
    width: 100%; }
    .voucher-badge .icon-marmita {
      margin-right: 6px;
      height: 12px;
      width: 12px; }
    .voucher-badge .icon-marmita svg {
        color: #2e6788;
        fill: #2e6788; }
    .voucher-badge__description {
      height: 12px; }
    @media only screen and (min-width: 960px) {
      .voucher-badge .icon-marmita {
        margin-right: 6px;
        height: 14px;
        width: 14px; } }
  
  .address-maps-message {
    opacity: 0;
    visibility: 0;
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 172px;
    height: 60px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, calc(-50% - 80px)) scale(0.7);
            transform: translate(-50%, calc(-50% - 80px)) scale(0.7);
    background-color: white;
    border-radius: 4px;
    padding: 12px 16px;
    text-align: center;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
    transition: all ease-in 50ms;
    pointer-events: none; }
    .address-maps-message:after {
      content: "";
      width: 0;
      height: 0;
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-top: 10px solid white;
      left: 50%;
      -webkit-transform: translate(-50%, 0);
              transform: translate(-50%, 0);
      bottom: -9px;
      position: absolute; }
    .address-maps-message--active {
      opacity: 1;
      visibility: 1;
      -webkit-transform: translate(-50%, calc(-50% - 80px)) scale(1);
              transform: translate(-50%, calc(-50% - 80px)) scale(1); }
    .address-maps-message__title {
      color: #272727;
      font-size: 0.875rem;
      line-height: 1.125rem; }
    .address-maps-message__subtitle {
      color: #717171;
      font-size: 0.75rem;
      line-height: 1rem;
      font-weight: lighter; }
  
  .restaurant-card {
    display: grid;
    height: 90px;
    padding: 12px;
    border-radius: 4px;
    width: 100%;
    grid-template-columns: 60px 1px 1fr;
    grid-template-rows: 1fr 20px;
    grid-template-areas: 'figure divider title' 'figure divider content';
    grid-column-gap: 12px; }
    .restaurant-card--with-voucher {
      border-radius: 4px 4px 0 0; }
    .restaurant-card__wrapper {
      border: 1px solid #f2f2f2;
      transition: 200ms;
      height: -webkit-min-content;
      height: -moz-min-content;
      height: min-content;
      border-radius: 4px;
      text-decoration: none; }
    .restaurant-card__wrapper:hover {
        border: 1px solid #dbdad9; }
    @media only screen and (min-width: 960px) {
      .restaurant-card {
        height: 130px;
        grid-template-columns: 85px 1px 1fr;
        grid-column-gap: 20px;
        padding: 20px;
        cursor: pointer; } }
    .restaurant-card:before {
      grid-area: divider;
      content: '';
      width: 1px;
      background-color: #f2f2f2; }
    .restaurant-card h3 {
      grid-area: title;
      margin: 0;
      padding: 0; }
    .restaurant-card .restaurant-card__info, .restaurant-card .restaurant-card__footer {
      font-weight: 300;
      color: #717171;
      font-size: 0.875rem;
      line-height: 0.9375rem; }
    @media only screen and (min-width: 960px) {
        .restaurant-card .restaurant-card__info, .restaurant-card .restaurant-card__footer {
          font-size: 0.875rem;
          line-height: 1.0625rem; } }
    @media only screen and (max-width: 374px) {
        .restaurant-card .restaurant-card__info, .restaurant-card .restaurant-card__footer {
          font-size: 0.6875rem; } }
    .restaurant-card__status {
      position: absolute;
      margin: 0;
      background: rgba(0, 0, 0, 0.4);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.75rem;
      line-height: 1.25rem;
      color: #fff;
      border-radius: 4px;
      width: 54px;
      height: 54px; }
    @media only screen and (min-width: 960px) {
        .restaurant-card__status {
          font-size: 1rem;
          width: 85px;
          height: 85px; } }
    .restaurant-card__figure {
      grid-area: figure;
      background: #fff;
      overflow: hidden;
      position: relative;
      height: 100%;
      border-radius: 4px 0 0 4px;
      display: flex;
      align-items: center;
      justify-content: center; }
    .restaurant-card__figure .restaurant-card__img-logo {
        width: 54px;
        height: 54px;
        border-radius: 4px;
        transition: 200ms;
        -o-object-fit: contain;
           object-fit: contain; }
    @media only screen and (min-width: 960px) {
          .restaurant-card__figure .restaurant-card__img-logo {
            width: 85px;
            height: 85px; } }
    .restaurant-card__figure .restaurant-card__img-cover {
        height: 100%;
        width: 100%; }
    .restaurant-card__header {
      width: 100%;
      display: grid;
      grid-template-columns: 1fr auto;
      position: relative;
      padding: 0 0 2px; }
    @media only screen and (min-width: 960px) {
        .restaurant-card__header {
          padding: 0 0 10px; } }
    .restaurant-card__header .restaurant-name {
        color: #3e3e3e;
        font-size: 0.875rem;
        line-height: 0.875rem;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
        height: 18px; }
    @media only screen and (min-width: 960px) {
          .restaurant-card__header .restaurant-name {
            font-size: 1rem;
            line-height: 1rem; } }
    .restaurant-card__info {
      width: 100%;
      display: flex; }
    .restaurant-card__info .restaurant-rating {
        font-size: 0.75rem;
        font-weight: bold;
        display: flex;
        align-items: center;
        line-height: 9px; }
    .restaurant-card__info .restaurant-rating svg {
          color: #e7a74e;
          fill: #e7a74e; }
    @media only screen and (min-width: 960px) {
          .restaurant-card__info .restaurant-rating {
            font-size: 0.875rem; } }
    .restaurant-card__info .restaurant-rating .icon-marmita {
          height: 10px;
          width: 10px;
          position: relative;
          margin: 0 5px 0 0;
          top: -1px; }
    @media only screen and (min-width: 960px) {
            .restaurant-card__info .restaurant-rating .icon-marmita {
              height: 12px;
              width: 12px;
              margin: 0 5px 0 0; } }
    .restaurant-card__info .restaurant-rating svg {
          height: 13px; }
    .restaurant-card__footer {
      align-items: center;
      margin: 0;
      width: 100%;
      display: flex; }
    .restaurant-card__super {
      height: 18px; }
    .restaurant-card__super .icon-marmita {
        position: relative;
        top: -3px;
        padding: 0; }
    .restaurant-card__super .icon-marmita svg {
          color: #e0040b;
          fill: #e0040b; }
    .restaurant-card .restaurant-card__mini-tag {
      margin: 0 0 0 5px;
      display: flex;
      align-items: center;
      justify-content: center; }
    .restaurant-card .restaurant-card__mini-tag-icon {
        margin: 0 5px 0 2px;
        display: flex;
        max-width: 12px; }
    @media (min-width: 768px) {
          .restaurant-card .restaurant-card__mini-tag-icon svg {
            width: 14px; } }
    .restaurant-card .restaurant-card__mini-tag.green {
        color: #50a773; }
    .restaurant-card .restaurant-card__mini-tag.focused {
        background-color: #f6f5f5;
        padding: 2px 3px;
        border-radius: 4px;
        margin: 0; }
  
  .address-maps-toast {
    opacity: 0;
    position: absolute;
    display: grid;
    grid-template-columns: 10px 1fr;
    gap: 16px;
    align-items: center;
    width: calc(100% - 40px);
    max-width: 480px;
    height: auto;
    top: 30px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    background-color: #EF5753;
    border-radius: 4px;
    padding: 12px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
    color: white;
    font-size: 0.875rem;
    line-height: 1.125rem;
    transition: all ease-in 150ms; }
    .address-maps-toast .icon-marmita {
      height: 14px;
      width: 14px;
      background-color: white;
      border-radius: 100%; }
    .address-maps-toast .icon-marmita svg {
        color: #ff7383;
        fill: #ff7383; }
    .address-maps-toast .icon-marmita svg {
        height: 18px;
        width: 18px;
        -webkit-transform: translate(-2px, -2px);
                transform: translate(-2px, -2px); }
    .address-maps-toast--active {
      opacity: 1; }
  
  .restaurant-menu-search {
    position: relative;
    width: 100%; }
    .restaurant-menu-search input::-webkit-input-placeholder {
      text-align: left;
      color: #717171;
      opacity: 0.7;
      font-size: 1rem; }
    .restaurant-menu-search input:-ms-input-placeholder {
      text-align: left;
      color: #717171;
      opacity: 0.7;
      font-size: 1rem; }
    .restaurant-menu-search input::-ms-input-placeholder {
      text-align: left;
      color: #717171;
      opacity: 0.7;
      font-size: 1rem; }
    .restaurant-menu-search input::placeholder {
      text-align: left;
      color: #717171;
      opacity: 0.7;
      font-size: 1rem; }
    .restaurant-menu-search .icon-marmita {
      position: absolute;
      left: 20px;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      width: 26px;
      height: 26px;
      pointer-events: none; }
    .restaurant-menu-search .icon-marmita svg {
        color: #B1B1B1;
        fill: #B1B1B1; }
    .restaurant-menu-search__field {
      display: flex;
      height: 40px;
      width: 99%;
      padding-left: 55px;
      border: none;
      border-radius: 4px;
      font-size: 1rem; }
    .restaurant-menu-search .btn-icon {
      position: absolute;
      top: 0;
      right: 20px; }
    .restaurant-menu-search .btn-icon > canvas {
        color: #3e3e3e; }
    .restaurant-menu-search .btn-icon .icon-marmita--close {
        left: 0;
        height: 30px;
        width: 30px; }
  
  .category-tag__label {
    color: #3f3e3e;
    border: 1px solid #f5f0eb;
    padding: 7px 10px;
    border-radius: 20px;
    transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: default; }
    @media only screen and (min-width: 960px) {
      .category-tag__label {
        cursor: pointer; } }
    .category-tag__label:hover {
      background: #f7f7f7; }
    .category-tag__input {
    display: none; }
    .category-tag__input:checked + label {
      padding: 7px 10px;
      color: #ffe115;
      background-color: #fcebea;
      border: 1px solid #fcebea;
      transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
      border-radius: 20px; }
    .category-tag__input:checked + label:hover {
        background: #f6c1bd; }
  
  .address-maps-header {
    position: absolute;
    width: 100%;
    display: grid;
    top: 0;
    left: 0;
    grid-template-columns: 50px 1fr 50px;
    padding: 27px 20px;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.8) 25%, white 100%); }
    @media only screen and (min-width: 768px) {
      .address-maps-header {
        padding: 30px; } }
    .address-maps-header__description {
      display: flex;
      flex-direction: column;
      width: 100%;
      justify-content: center;
      align-items: center;
      text-align: center; }
    .address-maps-header__title {
      font-size: 0.8125rem;
      color: #595756; }
    @media only screen and (min-width: 768px) {
        .address-maps-header__title {
          font-size: 1rem; } }
    .address-maps-header__title--placeholder {
        width: 160px;
        height: 16px;
        margin-bottom: 5px; }
    .address-maps-header__subtitle {
      font-size: 0.6875rem;
      color: #A6A6A6; }
    @media only screen and (min-width: 768px) {
        .address-maps-header__subtitle {
          font-size: 0.875rem; } }
    .address-maps-header__subtitle--placeholder {
        width: 250px;
        height: 14px; }
    .address-maps-header__back-btn {
      margin-left: 11px; }
  
  .categories-list__form {
    display: flex;
    flex-direction: column;
    height: calc(100% - 57px); }
    .categories-list__form > .categories-list__content {
      overflow-y: auto;
      width: calc(100% - 8px);
      scrollbar-color: #dcdcdc transparent;
      margin: 10px 0 0;
      padding: 20px 30px; }
    .categories-list__form > .categories-list__content::-webkit-scrollbar-track {
        border-radius: 50px;
        background-color: transparent; }
    .categories-list__form > .categories-list__content::-webkit-scrollbar {
        width: 4px;
        background-color: transparent; }
    .categories-list__form > .categories-list__content::-webkit-scrollbar-thumb {
        border-radius: 50px;
        background-color: #dcdcdc; }
    .categories-list__form > .categories-list__content .category-filter__name {
        display: inline-flex;
        position: relative;
        margin: 0 5px 10px 0px; }
    @media only screen and (min-width: 960px) {
          .categories-list__form > .categories-list__content .category-filter__name {
            cursor: pointer; } }
    .categories-list__form > .categories-list__content .marmita-collapse__content {
        display: none; }
    .categories-list__form > .categories-list__content .marmita-collapse__title {
        padding: 10px 0;
        color: #ffe115;
        font-weight: normal;
        font-size: 1rem; }
    .categories-list__form > .categories-list__content .marmita-collapse--open .marmita-collapse__content {
        padding: 0;
        display: block; }
    .categories-list__form > .categories-list__content .marmita-collapse--open .marmita-collapse__title {
        padding: 0;
        display: none; }
    .categories-list__form > .categories-list__content .marmita-collapse--open .marmita-collapse__button {
        display: none; }
    .categories-list__form .restaurant-menu-search {
      border-bottom: 1px solid #f1f1f1; }
    .categories-list__form .restaurant-menu-search > .icon-marmita {
        left: 28px; }
    .categories-list__form .restaurant-menu-search > .restaurant-menu-search__field {
        height: 50px;
        padding-left: 65px; }
  
  .address-maps__container {
    height: 100%;
    position: relative;
    transition: height 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  
  .address-maps__map {
    height: 100%;
    position: relative;
    transition: height 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  
  .address-maps__pin {
    position: absolute;
    width: 36px;
    height: 44px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, calc(-50% - 15px));
            transform: translate(-50%, calc(-50% - 15px)); }
  
  .address-maps__pin svg {
      color: #ffe115;
      fill: #ffe115; }
  
  .address-maps__pin svg {
      -webkit-transform: translateX(-0.3px);
              transform: translateX(-0.3px);
      transition: -webkit-transform ease-in 150ms;
      transition: transform ease-in 150ms;
      transition: transform ease-in 150ms, -webkit-transform ease-in 150ms; }
  
  .address-maps__pin:after {
      content: '';
      display: block;
      position: absolute;
      width: 11px;
      height: 5px;
      border-radius: 100%;
      bottom: 0;
      left: 50%;
      z-index: -1;
      -webkit-transform: translate(-50%, -3px);
              transform: translate(-50%, -3px);
      background-color: #3E3E3E;
      opacity: 0.3; }
  
  .address-maps__pin--active svg {
      color: #3E3E3E;
      fill: #3E3E3E; }
  
  .address-maps__pin--active svg {
      -webkit-transform: translate(-0.5px, -5px);
              transform: translate(-0.5px, -5px); }
  
  .address-maps__geo:after {
    content: '';
    display: block;
    position: absolute;
    width: 13px;
    height: 13px;
    background-color: #557AFF;
    border: 3px solid #FFFFFF;
    border-radius: 100%;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.16);
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }
  
  .address-maps__geo:before {
    content: '';
    display: block;
    position: absolute;
    border-radius: 100%;
    z-index: -1;
    width: 43px;
    height: 43px;
    background-color: rgba(85, 122, 255, 0.1);
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }
  
  .address-maps__focus-button {
    position: absolute;
    right: 25px;
    bottom: 130px;
    width: 52px;
    height: 52px;
    margin: 0;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
    transition: all ease-in 150ms;
    cursor: pointer; }
  
  .address-maps__focus-button .icon-marmita {
      width: 24px;
      height: 24px; }
  
  .address-maps__focus-button .icon-marmita svg {
        color: #3f3e3e;
        fill: #3f3e3e; }
  
  .address-maps__focus-button:hover {
      background: #FFFFFF;
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2); }
  
  .address-maps__focus-button:hover .icon-marmita svg {
        color: #3e3e3e;
        fill: #3e3e3e; }
  
  .address-maps__submit {
    position: absolute;
    bottom: 50px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    width: calc(100% - 40px);
    max-width: 375px;
    transition: all ease-in 150ms;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); }
  
  .address-maps__submit[disabled] {
      background: #F2F2F2;
      color: #A6A6A6;
      opacity: 1; }
  
  .slider__title {
    font-size: 1.125rem;
    color: #3f3e3e; }
  
  .slider__label {
    font-size: 0.875rem;
    color: #a6a5a5; }
  
  .slider__value {
    color: #3e3e3e;
    font-size: 0.875rem;
    line-height: 1.25rem; }
  
  .slider .slider-input {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    height: 2px;
    width: 100%;
    background: #f1f1f1;
    outline: none; }
  
  .slider .slider-input__fill {
      height: 2px;
      background-color: #ffe115;
      position: relative;
      -webkit-transform: translateY(-7px);
              transform: translateY(-7px);
      pointer-events: none; }
  
  .slider .slider-input::-webkit-slider-thumb {
    -webkit-appearance: none;
            appearance: none;
    width: 20px;
    height: 20px;
    background: #ffe115;
    border-radius: 100%;
    border: none;
    cursor: -webkit-grab;
    cursor: grab;
    transition: 200ms cubic-bezier(0.075, 0.82, 0.165, 1); }
  
  .slider .slider-input::-webkit-slider-thumb:hover {
      -webkit-transform: scale(1.2);
              transform: scale(1.2); }
  
  .slider .slider-input::-webkit-slider-thumb:active {
      cursor: -webkit-grabbing;
      cursor: grabbing;
      -webkit-transform: scale(1.2);
              transform: scale(1.2); }
  
  .slider .slider-input::-webkit-slider-thumb:focus {
      border-color: 0;
      box-shadow: none; }
  
  .slider .slider-input::-moz-range-thumb {
    width: 20px;
    height: 20px;
    background: #ffe115;
    border: none;
    cursor: grab;
    transition: 200ms cubic-bezier(0.075, 0.82, 0.165, 1); }
  
  .slider .slider-input::-moz-range-thumb:hover {
      transform: scale(1.2); }
  
  .slider .slider-input::-moz-range-thumb:active {
      cursor: grabbing;
      transform: scale(1.2); }
  
  .slider .slider-input::-moz-range-thumb:focus {
      border-color: 0;
      box-shadow: none; }
  
  .complete-address {
    margin: 0 auto;
    color: #3f3e3e;
    padding: 20px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 560px));
    grid-template-rows: -webkit-max-content;
    grid-template-rows: max-content;
    justify-content: center;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    scrollbar-color: #dcdcdc transparent; }
    .complete-address::-webkit-scrollbar-track {
      border-radius: 50px;
      background-color: transparent; }
    .complete-address::-webkit-scrollbar {
      width: 4px;
      background-color: transparent; }
    .complete-address::-webkit-scrollbar-thumb {
      border-radius: 50px;
      background-color: #dcdcdc; }
    @media only screen and (min-width: 768px) {
      .complete-address {
        padding: 20px 20px 60px 20px; } }
    .complete-address__address-info {
      margin-bottom: 20px; }
    @media only screen and (min-width: 768px) {
        .complete-address__address-info {
          display: flex;
          align-items: baseline; } }
    .complete-address__street-label {
      margin: 0 0 5px;
      color: #3f3e3e;
      font-size: 0.83562rem; }
    @media only screen and (min-width: 768px) {
        .complete-address__street-label {
          font-size: 1rem;
          margin: 0 10px 0 0; } }
    .complete-address__state-label {
      margin: 0;
      font-size: 0.83562rem;
      color: #a6a5a5; }
    @media only screen and (min-width: 768px) {
        .complete-address__state-label {
          font-size: 0.875rem; } }
    .complete-address__form .label__name {
      font-size: 0.75rem !important; }
    .complete-address__form .form-input__field {
      font-size: 0.9375rem; }
    .complete-address__form .native-select__field {
      font-size: 0.9375rem; }
    .complete-address--city-state {
      display: grid;
      grid-template-columns: 30% 1fr;
      grid-gap: 14px; }
    .complete-address--district-street {
      display: grid;
      grid-template-columns: 1fr; }
    @media only screen and (min-width: 768px) {
        .complete-address--district-street {
          grid-template-columns: 30% 1fr;
          grid-gap: 14px; } }
    .complete-address--number-complement {
      display: grid;
      grid-template-columns: 125px 1fr;
      grid-gap: 14px; }
    @media only screen and (min-width: 768px) {
        .complete-address--number-complement {
          margin-bottom: 15px; } }
    @media only screen and (min-width: 768px) {
      .complete-address--reference-point {
        margin-bottom: 20px; } }
    .complete-address--favorites {
      margin-bottom: 15px; }
    @media only screen and (min-width: 768px) {
        .complete-address--favorites {
          margin-bottom: 40px;
          max-width: 350px; } }
    .complete-address--favorites p {
        color: #3f3e3e;
        margin: 0 0 16px;
        font-size: 0.875rem; }
    .complete-address--favorites .btn {
        background: #f2f2f2;
        border-radius: 4px;
        font-size: 0.875rem;
        height: 40px;
        border: 0;
        font-weight: 400; }
    .complete-address--favorites .btn .icon-marmita {
          width: 20px;
          height: 20px;
          margin-right: 10px; }
    .complete-address--favorites path[fill='#3e3e3e'] {
        fill: #717171; }
    .complete-address--favorites path[stroke='#3e3e3e'] {
        stroke: #717171; }
    .complete-address--favorites-btn {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 20px; }
    .complete-address--favorites-btn .btn__label {
        flex-grow: initial; }
    .complete-address__favorite.btn {
      position: relative; }
    .complete-address__favorite.btn::before, .complete-address__favorite.btn::after {
        pointer-events: none;
        width: 100%;
        height: 100%;
        z-index: 1;
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        box-sizing: border-box;
        -webkit-transform: scale(0);
                transform: scale(0);
        border-radius: 0;
        transition: border-radius 100ms ease 100ms, -webkit-transform 200ms ease;
        transition: transform 200ms ease, border-radius 100ms ease 100ms;
        transition: transform 200ms ease, border-radius 100ms ease 100ms, -webkit-transform 200ms ease; }
    .complete-address__favorite.btn::before {
        border-bottom: 1px solid #ffe115;
        border-left: 1px solid #ffe115;
        -webkit-transform-origin: 0 100%;
                transform-origin: 0 100%; }
    .complete-address__favorite.btn::after {
        border-top: 1px solid #ffe115;
        border-right: 1px solid #ffe115;
        -webkit-transform-origin: 100% 0%;
                transform-origin: 100% 0%; }
    .complete-address__favorite--active.btn {
      color: #ffe115; }
    .complete-address__favorite--active.btn::after, .complete-address__favorite--active.btn::before {
        -webkit-transform: scale(1);
                transform: scale(1);
        border-radius: 4px; }
    .complete-address__favorite--active,
    .complete-address__favorite--active path {
      transition: all 300ms ease-in-out; }
    .complete-address__favorite--active path[fill='#3e3e3e'] {
      fill: #ffe115; }
    .complete-address__favorite--active path[stroke='#3e3e3e'] {
      stroke: #ffe115; }
    .complete-address--save-btn {
      margin-bottom: 30px; }
  
  .delivery-filter {
    position: relative;
    padding: 0 30px; }
    .delivery-filter__label {
      align-items: center;
      border-bottom: 1px solid #f1f1f1;
      display: flex;
      height: 50px;
      justify-content: space-between;
      padding: 15px 0;
      width: 100%; }
    @media only screen and (min-width: 960px) {
        .delivery-filter__label {
          cursor: pointer; } }
    .delivery-filter__label-text {
      color: #717171;
      font-size: 1em; }
    .delivery-filter .slider {
      padding: 10px 0; }
  
  .address-number__form {
    display: grid;
    grid-row-gap: 20px;
    grid-template-rows: 22px 74px 20px 50px;
    width: 100%;
    margin: auto; }
    @media only screen and (min-width: 1248px) {
      .address-number__form {
        grid-row-gap: 40px;
        grid-template-rows: 22px 65px 20px 50px; } }
    .address-number__form button {
      margin: 0; }
    .address-number__form .form-input {
      padding: 0;
      margin: 0;
      min-height: 0; }
    .address-number__address-info {
    display: grid;
    grid-row-gap: 2px; }
    .address-number__address-info p {
      margin: auto; }
    .address-number__address-info .street-name {
      color: #717171;
      font-size: 1rem;
      line-height: 22px; }
    .address-number__address-info .district {
      color: #a6a6a6;
      font-size: 0.875rem;
      line-height: 20px; }
    .address-number__input {
    width: 110px;
    margin: auto; }
    .address-number__empty-number {
    color: #A6A6A5;
    font-size: 0.75rem;
    line-height: 16px;
    margin: auto; }
    .address-number__checkbox-label {
    display: grid;
    grid-template-columns: 140px 20px;
    grid-column-gap: 15px;
    margin: auto; }
  
  @media only screen and (min-width: 768px) {
    .highlights-carousel {
      padding: 0 20px; } }
  
  @media only screen and (min-width: 960px) {
    .highlights-carousel {
      width: 100%;
      max-width: 1366px !important;
      margin: auto;
      padding: 0 30px; } }
  
  .highlights-carousel__container {
    display: flex;
    flex-direction: column; }
  
  .highlights-carousel a {
    text-decoration: none; }
  
  .highlights-carousel__figure {
    height: 140px;
    margin: 0;
    overflow: hidden;
    position: relative;
    border-radius: 4px; }
  
  @media only screen and (min-width: 768px) {
      .highlights-carousel__figure {
        height: 200px; } }
  
  .highlights-carousel__figure img {
      left: 0;
      top: 0;
      display: block;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      -webkit-transform: none;
              transform: none; }
  
  @media only screen and (min-width: 960px) {
        .highlights-carousel__figure img {
          left: 0;
          top: 0;
          display: block;
          width: 100%;
          height: 100%;
          -o-object-fit: cover;
             object-fit: cover;
          -webkit-transform: none;
                  transform: none; } }
  
  .highlights-carousel__wrapper {
    width: 100%;
    padding: 0;
    margin-bottom: 20px; }
  
  @media only screen and (min-width: 960px) {
      .highlights-carousel__wrapper {
        margin-bottom: 64px; } }
  
  .highlights-carousel .carousel__controller--left {
    -webkit-transform: translateY(-32px) rotateZ(90deg);
            transform: translateY(-32px) rotateZ(90deg); }
  
  @media only screen and (min-width: 768px) {
      .highlights-carousel .carousel__controller--left {
        -webkit-transform: translateY(-18px) rotateZ(90deg);
                transform: translateY(-18px) rotateZ(90deg); } }
  
  @media only screen and (min-width: 960px) {
      .highlights-carousel .carousel__controller--left {
        left: -25px; } }
  
  .highlights-carousel .carousel__controller--right {
    -webkit-transform: translateY(-32px) rotateZ(-90deg);
            transform: translateY(-32px) rotateZ(-90deg); }
  
  @media only screen and (min-width: 768px) {
      .highlights-carousel .carousel__controller--right {
        -webkit-transform: translateY(-18px) rotateZ(-90deg);
                transform: translateY(-18px) rotateZ(-90deg); } }
  
  @media only screen and (min-width: 960px) {
      .highlights-carousel .carousel__controller--right {
        right: -25px; } }
  
  .address-number {
    z-index: 2;
    position: absolute;
    opacity: 0;
    top: 100%;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-rows: -webkit-min-content;
    grid-template-rows: min-content;
    grid-row-gap: 5px;
    background-color: white;
    transition: top 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
    @media only screen and (min-width: 768px) {
      .address-number {
        grid-row-gap: 0; } }
    .address-number--visible {
      top: 0;
      opacity: 1; }
    .address-number__back-btn {
      width: 26px;
      height: 26px;
      margin: 0;
      margin-top: 24px; }
    .address-number__form-wrapper {
      display: grid;
      grid-template-rows: 22px;
      grid-row-gap: 20px;
      text-align: center;
      margin-bottom: auto; }
    @media only screen and (min-width: 768px) {
        .address-number__form-wrapper {
          grid-template-rows: 44px;
          width: 330px;
          margin: auto; } }
    .address-number__title {
      color: #3e3e3e;
      font-size: 1rem;
      line-height: 22px;
      margin: auto; }
  
  .address-search-list {
    display: grid;
    grid-auto-rows: auto;
    gap: 10px; }
    .address-search-list .ph-address-btn {
      border: none;
      border-bottom: 1px solid #f7f7f7; }
    .address-search-list__not-found .btn-address__info--label {
      color: #ffe115; }
    .address-search-list .btn-address--simple {
      border-color: transparent; }
    .address-search-list .btn-address--simple::before, .address-search-list .btn-address--simple::after {
        pointer-events: none;
        width: 100%;
        height: 100%;
        z-index: 1;
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        box-sizing: border-box;
        -webkit-transform: scale(0);
                transform: scale(0);
        border-radius: 0;
        transition: border-radius 100ms ease 900ms, -webkit-transform 1000ms ease;
        transition: transform 1000ms ease, border-radius 100ms ease 900ms;
        transition: transform 1000ms ease, border-radius 100ms ease 900ms, -webkit-transform 1000ms ease; }
    .address-search-list .btn-address--simple::before {
        border-bottom: 1px solid #ffe115;
        border-left: 1px solid #ffe115;
        -webkit-transform-origin: 0 100%;
                transform-origin: 0 100%; }
    .address-search-list .btn-address--simple::after {
        border-top: 1px solid #ffe115;
        border-right: 1px solid #ffe115;
        -webkit-transform-origin: 100% 0%;
                transform-origin: 100% 0%; }
    .address-search-list .btn-address--is-active::after, .address-search-list .btn-address--is-active::before {
      -webkit-transform: scale(1);
              transform: scale(1);
      border-radius: 4px; }
  
  .address-set-confirmation {
    display: none;
    opacity: 0;
    height: 0;
    grid-template-columns: minmax(auto, 350px);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    transition: opacity 300ms ease;
    overflow: hidden; }
    .address-set-confirmation--visible {
      opacity: 1;
      display: grid;
      height: auto; }
    .address-set-confirmation__title {
      display: flex;
      flex-direction: column;
      font-size: 1rem;
      line-height: 1.375rem;
      margin-bottom: 20px;
      font-weight: 300; }
    @media only screen and (min-width: 768px) {
        .address-set-confirmation__title {
          font-size: 1.125rem;
          margin-bottom: 56px; } }
    @media only screen and (min-width: 768px) {
        .address-set-confirmation__title--name {
          font-weight: 500; } }
    .address-set-confirmation__subtitle {
      font-size: 0.875rem;
      line-height: 1.25rem;
      font-weight: lighter;
      margin-bottom: 40px; }
    @media only screen and (min-width: 768px) {
        .address-set-confirmation__subtitle {
          margin-bottom: 46px; } }
    .address-set-confirmation__accept-btn {
      margin-bottom: 20px; }
  
  .filter-dropdown {
    position: relative; }
    .filter-dropdown__floating-box {
      background: #fff;
      border-radius: 4px;
      border: 1px solid #dcdcdc;
      box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.05);
      display: flex;
      flex-direction: column;
      height: 420px;
      left: 0;
      opacity: 0;
      overflow: hidden;
      position: absolute;
      top: 0px;
      -webkit-transform: translateY(40px);
              transform: translateY(40px);
      visibility: hidden;
      width: 400px;
      z-index: 0; }
    .filter-dropdown__floating-box--visible {
        opacity: 1;
        -webkit-transform: translateY(66px);
                transform: translateY(66px);
        transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
        visibility: visible;
        z-index: 9994; }
    .filter-dropdown__footer {
      height: 50px;
      display: flex;
      justify-content: space-between;
      margin-top: auto;
      padding: 0 10px; }
    .filter-dropdown__footer .btn {
        margin: 0; }
    .filter-dropdown__btn {
      height: 40px;
      margin-bottom: 0;
      margin-top: 0; }
    .filter-dropdown__btn--visible {
        z-index: 9994;
        box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.05); }
    .filter-dropdown__clear-button {
      color: #3e3e3e; }
    .filter-dropdown .btn--transparent {
      transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
    .filter-dropdown .marmita-checkbox {
      background: #f2f2f2; }
    .filter-dropdown .marmita-checkbox::before {
        content: none; }
    .filter-dropdown .btn .btn__label {
      font-size: 1rem;
      line-height: normal;
      font-weight: normal; }
  
  .channel-floating {
    position: fixed;
    visibility: hidden;
    background: #fff;
    border: 1px solid #f7f7f7;
    box-sizing: border-box;
    box-shadow: 2px 2px 25px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    opacity: 0;
    padding: 0;
    pointer-events: none;
    height: 536px;
    width: 375px;
    top: auto;
    left: auto;
    right: calc(410px + 20px + 20px);
    bottom: calc(20px - 10px);
    overflow: hidden; }
    .channel-floating--visible {
      visibility: visible;
      opacity: 1;
      -webkit-transform: translate3D(0, -10px, 0);
              transform: translate3D(0, -10px, 0);
      pointer-events: initial;
      z-index: 9996;
      transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  
  .payment-options {
    position: relative; }
    .payment-options__label {
      align-items: center;
      border-bottom: 1px solid #f1f1f1;
      display: flex;
      height: 50px;
      justify-content: space-between;
      padding: 15px 0;
      width: 100%; }
    @media only screen and (min-width: 960px) {
        .payment-options__label {
          cursor: pointer; } }
    .payment-options__main-list {
      max-height: 360px;
      opacity: 0;
      overflow-y: auto;
      padding: 0 30px;
      position: absolute;
      top: 0;
      -webkit-transform: translateX(-400px);
              transform: translateX(-400px);
      transition: 200ms cubic-bezier(0.075, 0.82, 0.165, 1);
      width: 100%; }
    .payment-options__main-list--visible {
        opacity: 1;
        -webkit-transform: translateX(0);
                transform: translateX(0); }
    .payment-options__text {
      color: #717171;
      font-size: 1em; }
    .payment-options__button {
      align-items: center;
      background: none;
      border-bottom: 1px solid #f1f1f1;
      border-left: 0;
      border-right: 0;
      border-top: 0;
      color: #717171;
      cursor: pointer;
      display: flex;
      height: 50px;
      justify-content: space-between;
      padding: 15px 0;
      width: 100%; }
    .payment-options__button .icon-marmita {
        width: 14px; }
    .payment-options__sub-options {
      opacity: 0;
      -webkit-transform: translateX(400px);
              transform: translateX(400px);
      transition: 200ms cubic-bezier(0.075, 0.82, 0.165, 1);
      position: absolute;
      width: 100%; }
    .payment-options__sub-options--visible {
        opacity: 1;
        -webkit-transform: translateX(0);
                transform: translateX(0); }
    .payment-options__sub-options__list {
      max-height: 300px;
      overflow-y: auto;
      scrollbar-color: #dcdcdc transparent;
      padding: 0 20px 0 30px;
      margin: 8px 8px 0 0; }
    .payment-options__sub-options__list::-webkit-scrollbar-track {
        border-radius: 50px;
        background-color: transparent; }
    .payment-options__sub-options__list::-webkit-scrollbar {
        width: 4px;
        background-color: transparent; }
    .payment-options__sub-options__list::-webkit-scrollbar-thumb {
        border-radius: 50px;
        background-color: #dcdcdc; }
    .payment-options__sub-options-header {
      align-items: center;
      border-bottom: 1px solid #f1f1f1;
      display: flex;
      height: 50px; }
    .payment-options__sub-options-back {
      background: none;
      border: 0;
      cursor: pointer;
      position: relative;
      top: 3px;
      z-index: 1; }
    .payment-options__sub-options-back .icon-marmita {
        pointer-events: none;
        width: 32px; }
    .payment-options__sub-options-back .icon-marmita svg {
          color: #3e3e3e;
          fill: #3e3e3e; }
    .payment-options__sub-options-title {
      color: #3e3e3e;
      font-size: 1em;
      position: absolute;
      text-align: center;
      width: 100%; }
  
  .channel-modal {
    z-index: 9998;
    pointer-events: initial;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    min-height: 100%; }
  
  .filter-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 22px;
    min-width: 22px;
    top: 2px;
    padding: 2px 4px 0 4px;
    border-radius: 19px;
    border: none;
    background: #fff;
    color: #ffe115;
    font-size: 0.6875rem;
    line-height: 0.6875rem;
    font-weight: 400; }
  
  .back-button {
    margin: 0;
    border-radius: 0;
    height: 2.8125rem;
    width: 3.125rem;
    left: -18px;
    display: block; }
    @media (min-width: 768px) {
      .back-button {
        display: none; } }
  
  .quick-filter__wrapper {
    display: inline-flex;
    align-items: center;
    flex-flow: row nowrap;
    background: #f2f2f2;
    color: #717171;
    border-radius: 20px;
    white-space: nowrap;
    font-size: 0.875rem;
    line-height: 1.125rem;
    height: 40px; }
    .quick-filter__wrapper--active {
      background-color: #fcebea;
      color: #ffe115; }
    .quick-filter__wrapper--active:hover:enabled {
        background-color: #f6c1bd; }
    @media only screen and (min-width: 768px) {
      .quick-filter__wrapper {
        background: white;
        font-size: 1em;
        border-radius: 20px;
        border: 1px solid #dcdcdc;
        padding: 10px 20px; }
        .quick-filter__wrapper:hover {
          background-color: #f7f7f7;
          transition: 0.6s; }
        .quick-filter__wrapper--active {
          background-color: #fcebea;
          color: #ffe115;
          border: 1px solid #fcebea; }
          .quick-filter__wrapper--active:hover {
            background-color: #f6c1bd; } }
    .quick-filter__main-button, .quick-filter__clear-button {
    background: none;
    border: none;
    color: inherit;
    height: 100%; }
    .quick-filter__main-button {
    padding: 0 8px;
    cursor: pointer; }
    .quick-filter__main-button--clear-spacing {
      padding: 0 4px 0 12px; }
    .quick-filter__clear-button {
    display: inline-flex;
    align-items: center;
    flex-flow: row nowrap;
    padding: 0 8px 0 4px; }
    .quick-filter__clear-icon {
    width: 1em;
    height: 1em; }
  
  .close-button {
    display: none;
    cursor: pointer;
    font-size: 0.75rem;
    color: #ffe115;
    height: 100%;
    padding: 8px;
    background: transparent;
    border: none; }
    @media (min-width: 768px) {
      .close-button {
        display: block; } }
  
  .filter-screen-button__wrapper {
    display: flex;
    align-items: center; }
  
  .filter-screen-button__icon {
    width: 1em;
    height: 1em; }
  
  .filter-screen-button__label {
    display: inline-block;
    margin: 0 4px; }
  
  @-webkit-keyframes pink-pan-lip-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(6deg) translate(3px, 8px);
              transform: rotateZ(6deg) translate(3px, 8px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @keyframes pink-pan-lip-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(6deg) translate(3px, 8px);
              transform: rotateZ(6deg) translate(3px, 8px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @-webkit-keyframes pink-pan-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(1deg) translate(-1px, 0);
              transform: rotateZ(1deg) translate(-1px, 0); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @keyframes pink-pan-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(1deg) translate(-1px, 0);
              transform: rotateZ(1deg) translate(-1px, 0); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @-webkit-keyframes purple-pan-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(1deg) translate(-1px, 0);
              transform: rotateZ(1deg) translate(-1px, 0); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @keyframes purple-pan-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(1deg) translate(-1px, 0);
              transform: rotateZ(1deg) translate(-1px, 0); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @-webkit-keyframes white-pan-movement {
    0% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1); }
    50% {
      -webkit-transform: scaleY(1.07);
              transform: scaleY(1.07); }
    100% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1); } }
  
  @keyframes white-pan-movement {
    0% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1); }
    50% {
      -webkit-transform: scaleY(1.07);
              transform: scaleY(1.07); }
    100% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1); } }
  
  @-webkit-keyframes pink-purple-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(0, -14px);
              transform: translate(0, -14px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @keyframes pink-purple-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(0, -14px);
              transform: translate(0, -14px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @-webkit-keyframes z-1-movement {
    0% {
      -webkit-transform: translate(0, 20px);
              transform: translate(0, 20px); }
    50% {
      -webkit-transform: translate(-2px, 32px);
              transform: translate(-2px, 32px); }
    100% {
      -webkit-transform: translate(0, 20px);
              transform: translate(0, 20px); } }
  
  @keyframes z-1-movement {
    0% {
      -webkit-transform: translate(0, 20px);
              transform: translate(0, 20px); }
    50% {
      -webkit-transform: translate(-2px, 32px);
              transform: translate(-2px, 32px); }
    100% {
      -webkit-transform: translate(0, 20px);
              transform: translate(0, 20px); } }
  
  @-webkit-keyframes z-2-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(4px, 12px);
              transform: translate(4px, 12px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @keyframes z-2-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(4px, 12px);
              transform: translate(4px, 12px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @-webkit-keyframes z-3-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(4px, 10px);
              transform: translate(4px, 10px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  @keyframes z-3-movement {
    0% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); }
    50% {
      -webkit-transform: translate(4px, 10px);
              transform: translate(4px, 10px); }
    100% {
      -webkit-transform: translate(0, 0);
              transform: translate(0, 0); } }
  
  .animated-pans svg {
    width: 255px; }
  
  @media only screen and (min-width: 960px) {
      .animated-pans svg {
        width: 300px; } }
  
  .animated-pans .pink-pan-lip {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-animation: pink-pan-lip-movement 5s infinite;
            animation: pink-pan-lip-movement 5s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .animated-pans .pink-pan {
    -webkit-transform-origin: bottom left;
            transform-origin: bottom left;
    -webkit-animation: pink-pan-movement 5s infinite;
            animation: pink-pan-movement 5s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .animated-pans .purple-pan,
  .animated-pans .purple-inside {
    -webkit-transform-origin: bottom left;
            transform-origin: bottom left;
    -webkit-animation: purple-pan-movement 4.7s infinite;
            animation: purple-pan-movement 4.7s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .animated-pans .white-pan,
  .animated-pans .white-inside {
    -webkit-transform-origin: bottom center;
            transform-origin: bottom center;
    -webkit-animation: white-pan-movement 5s infinite;
            animation: white-pan-movement 5s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .animated-pans .pink-purple {
    -webkit-transform-origin: bottom center;
            transform-origin: bottom center;
    -webkit-animation: pink-purple-movement 5s infinite;
            animation: pink-purple-movement 5s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .animated-pans .z-1 {
    -webkit-transform-origin: bottom center;
            transform-origin: bottom center;
    -webkit-animation: z-1-movement 5s infinite;
            animation: z-1-movement 5s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .animated-pans .z-2 {
    -webkit-transform-origin: bottom center;
            transform-origin: bottom center;
    -webkit-animation: z-2-movement 4.7s infinite;
            animation: z-2-movement 4.7s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .animated-pans .z-3 {
    -webkit-transform-origin: bottom center;
            transform-origin: bottom center;
    -webkit-animation: z-3-movement 4.4s infinite;
            animation: z-3-movement 4.4s infinite;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out; }
  
  .recipient-img {
    flex: 0;
    min-height: 2.5rem;
    min-width: 2.5rem;
    max-height: 2.5rem;
    max-width: 2.5rem;
    border-radius: 50%;
    margin-right: 1rem;
    background-color: #dcdcdc;
    overflow: hidden; }
  
  .slider-distance {
    max-height: 270px;
    padding: 0 20px; }
    .slider-distance .slider {
      padding: 0 0 50px;
      min-height: 40px; }
    .slider-distance__title {
      font-size: 1.125rem;
      line-height: 1.375rem;
      color: #3e3e3e;
      text-align: center;
      font-weight: 500;
      margin: 0;
      padding-bottom: 8px; }
    .slider-distance__description {
      font-size: 0.875rem;
      line-height: 1.25rem;
      color: #717171;
      text-align: center;
      font-weight: 300;
      display: block;
      padding-bottom: 24px; }
    .slider-distance__range {
      color: #3e3e3e;
      font-size: 0.875rem;
      line-height: 1.25rem;
      text-align: right;
      display: grid;
      grid-template-columns: 1fr 1fr; }
    .slider-distance__range-min {
        justify-content: flex-start;
        display: flex; }
    .slider-distance__range-max {
        color: #a6a6a6;
        display: flex;
        justify-content: flex-end; }
  
  .cuisines-list {
    padding: 20px 0 0; }
    @media only screen and (min-width: 768px) {
      .cuisines-list {
        width: 100%;
        max-width: 1366px !important;
        margin: auto;
        padding: 0 30px;
        margin-bottom: 64px;
        margin-top: 20px; } }
    .cuisines-list__header {
      display: grid;
      grid-template: 1fr / 1fr 60px;
      align-items: center;
      width: 100%;
      justify-content: center;
      padding: 20px 20px 10px;
      padding: 0 20px 26px; }
    @media only screen and (min-width: 768px) {
        .cuisines-list__header {
          padding: 20px 0 0 0; } }
    .cuisines-list__title {
      color: #3f3e3e;
      font-size: 1rem;
      font-weight: 500;
      line-height: 1.25rem;
      width: calc(100% - 60px);
      margin: 0; }
    @media only screen and (min-width: 768px) {
        .cuisines-list__title {
          padding: 0 0 16px;
          font-size: 1.25rem;
          line-height: 1.5625rem; } }
    .cuisines-list__big-title {
      display: none;
      color: #595756;
      font-size: 2rem;
      font-weight: 500;
      margin: 0; }
    @media only screen and (min-width: 768px) {
        .cuisines-list__big-title {
          display: block; } }
    .cuisines-list__container {
      min-height: 140px; }
    .cuisines-list__container .restaurant-simple-item {
        width: 120px; }
    @media only screen and (min-width: 768px) {
        .cuisines-list__container {
          padding: 0 30px; } }
    .cuisines-list__button {
      justify-content: flex-end;
      padding-right: 0; }
    .cuisines-list .cuisine-item {
      display: inline-block;
      text-align: center;
      transition: color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1); }
    .cuisines-list .cuisine-item a {
        text-decoration: none;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center; }
    .cuisines-list .cuisine-item a:hover .cuisine-item__title {
          color: #3e3e3e; }
    .cuisines-list .cuisine-item__figure {
        margin: 0;
        border-radius: 10%;
        width: 80px;
        height: 80px;
        overflow: hidden;
        position: relative;
        z-index: 1; }
    @media only screen and (min-width: 960px) {
          .cuisines-list .cuisine-item__figure {
            width: 110px;
            height: 110px; } }
    .cuisines-list .cuisine-item__figure img {
          position: absolute;
          -webkit-transform: translate(-50%, -50%);
                  transform: translate(-50%, -50%);
          top: 50%;
          left: 50%;
          z-index: 0;
          height: 100%;
          -o-object-fit: cover;
             object-fit: cover; }
    @media only screen and (min-width: 960px) {
          .cuisines-list .cuisine-item__figure {
            margin: 0 auto; } }
    .cuisines-list .cuisine-item__title {
        text-align: center;
        margin-top: 20px;
        display: block;
        font-size: 1rem;
        font-weight: 300;
        line-height: 1.125rem;
        color: #717171; }
    .cuisines-list .carousel__slide {
      display: grid;
      justify-content: center; }
    .cuisines-list .carousel__controller--left {
      -webkit-transform: translateY(-40px) rotateZ(90deg);
              transform: translateY(-40px) rotateZ(90deg); }
    @media only screen and (min-width: 960px) {
        .cuisines-list .carousel__controller--left {
          left: -25px; } }
    .cuisines-list .carousel__controller--right {
      -webkit-transform: translateY(-40px) rotateZ(-90deg);
              transform: translateY(-40px) rotateZ(-90deg); }
    @media only screen and (min-width: 960px) {
        .cuisines-list .carousel__controller--right {
          right: -25px; } }
  
  .channel-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    height: 66px;
    width: 100%;
    background: #fff;
    padding: 10px 20px;
    z-index: 1; }
    .channel-header__title {
      font-weight: 500;
      left: 0;
      margin: 0;
      position: absolute;
      text-align: center;
      width: 100%;
      z-index: 0;
      color: #3f3e3e;
      display: flex;
      align-items: center;
      padding: 0px 16px 0px 56px;
      font-size: 0.75rem; }
    @media (min-width: 768px) {
        .channel-header__title {
          font-size: 1.125rem;
          padding: 16px 50px 16px 24px; } }
    .channel-header__recipient {
      display: flex;
      flex-direction: column; }
    .channel-header__recipient h1,
      .channel-header__recipient p {
        text-align: left; }
    .channel-header__recipient h1 {
        font-size: 0.875rem;
        line-height: 1.0625rem;
        margin-top: 0;
        margin-bottom: 0.125rem;
        color: #3f3e3e; }
    .channel-header__recipient p {
        margin: 0;
        font-size: 0.6875rem;
        line-height: 0.875rem;
        color: #a6a5a5; }
    .channel-header__left-slot, .channel-header__right-slot {
      z-index: 1; }
  
  .sort-buttons__wrapper {
    padding: 0 20px; }
  
  .sort-buttons__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px; }
  
  .sort-buttons__title {
    font-size: 1.125rem;
    line-height: 1.375rem;
    color: #3e3e3e;
    text-align: center;
    font-weight: 500;
    margin: 0;
    padding-bottom: 8px; }
  
  .sort-buttons__item {
    background: none;
    border: none; }
  
  .sort-button__wrapper {
    font-size: 0.75rem;
    color: #717171;
    display: flex;
    flex-flow: nowrap column;
    justify-content: center;
    align-items: center; }
  
  .sort-button__wrapper--active {
      color: #ffe115; }
  
  .sort-button__wrapper--active .sort-button__img-container {
        background-color: #fcebea;
        border-color: transparent; }
  
  .sort-button__img-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 62px;
    height: 62px;
    border: #f2f2f2 solid 1px;
    border-radius: 50%;
    margin-bottom: 12px;
    cursor: pointer; }
  
  .admin-message {
    position: relative;
    color: #717171;
    font-size: 0.875rem;
    line-height: 1.25rem;
    max-width: 17.5rem;
    margin: 1rem auto;
    padding: 0.5rem 1rem;
    text-align: center;
    background: rgba(234, 29, 44, 0.1);
    border-radius: 1.5rem; }
    .admin-message__title {
      font-weight: bold;
      font-style: italic;
      margin-bottom: 0.125rem; }
    .admin-message__message {
      font-size: 0.75rem;
      line-height: 1rem; }
  
  .quick-sort-label__wrapper {
    display: flex;
    align-items: center; }
  
  .quick-sort-label__label {
    margin: 0 4px; }
  
  .message-status {
    display: block;
    position: absolute;
    fill: #a6a5a5;
    bottom: 0.625rem;
    right: 0.625rem;
    height: 0.5rem;
    width: 0.5rem; }
  
  .merchant-type-select__title {
    font-size: 1.125rem;
    line-height: 1.375rem;
    color: #3e3e3e;
    text-align: center;
    font-weight: 500;
    margin: 0;
    padding-bottom: 8px; }
  
  .merchant-type-select__select {
    display: flex;
    flex-flow: nowrap row;
    justify-content: space-between;
    padding: 12px 20px;
    position: relative; }
  
  .merchant-type-select__label {
    font-size: 0.875rem;
    line-height: 1.125rem;
    color: #717171;
    font-weight: 300; }
  
  .merchant-type-select__button {
    margin: 12px 20px 0;
    width: calc(100% - 40px); }
  
  .user-message {
    overflow: hidden;
    margin: 1rem 0 1rem auto;
    background: #fff;
    border: 1px solid #E0E0E0;
    border-radius: 1.5625rem 1.5625rem 0.125rem 1.5625rem;
    position: relative;
    color: #717171;
    padding: 1rem 1rem 1.625rem 1rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    min-width: 4rem;
    max-width: 15.625rem;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content; }
    .user-message__sent-at {
      color: #a6a5a5;
      font-size: 0.625rem;
      line-height: 0.75rem;
      position: absolute;
      bottom: 0.5rem;
      right: 1.5rem; }
    .user-message--received {
      margin: 1rem auto 1rem 0;
      background: #f2f2f2;
      border: none;
      border-radius: 1.5625rem 1.5625rem 1.5625rem 0.125rem; }
  
  .quick-filter-list__wrapper {
    display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    height: 2.5rem;
    margin-top: 12px;
    margin-bottom: 16px;
    padding: 0 0 0 20px; }
    @media only screen and (min-width: 768px) {
      .quick-filter-list__wrapper {
        overflow-x: unset;
        margin: 0;
        padding: 0; } }
    .quick-filter-list__wrapper::after {
      content: '';
      display: block;
      min-width: 20px; }
    .quick-filter-list__wrapper .marmita-scrollbox__container > * {
      margin: 0 10px; }
    .quick-filter-list__wrapper .marmita-scrollbox__container > *:first-child {
        margin-left: 0; }
    .quick-filter-list__wrapper .marmita-scrollbox__container > *:last-child {
        margin-right: 0; }
    @media only screen and (min-width: 768px) {
    .quick-filter-list__modal {
      width: 600px;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      padding: 40px; } }
  
  @-webkit-keyframes shimmer {
    0% {
      background: #f2f2f2; }
    100% {
      background: #dcdcdc; } }
  
  @keyframes shimmer {
    0% {
      background: #f2f2f2; }
    100% {
      background: #dcdcdc; } }
  
  .file-message {
    padding: 0;
    width: 11.25rem;
    max-height: 11.25rem; }
  
  .file-message .user-message__sent-at {
      color: #fff; }
  
  .file-message .message-status {
      fill: #fff; }
  
  .file-message--failed .user-message__sent-at {
      color: #a6a5a5; }
  
  .file-message--failed .message-status {
      fill: #a6a5a5; }
  
  .file-message__content {
      background: #f2f2f2;
      display: block;
      min-height: 5rem; }
  
  .file-message__content--pending {
        height: 11.25rem;
        -webkit-animation: shimmer 1000ms ease alternate infinite;
                animation: shimmer 1000ms ease alternate infinite; }
  
  .file-message__content--failed {
        height: 11.25rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center; }
  
  .file-message__img {
      display: block;
      height: auto;
      width: 100%; }
  
  .desktop-filters {
    padding: 0 20px;
    display: grid;
    justify-content: space-between;
    margin-bottom: 26px; }
    @media only screen and (min-width: 960px) {
      .desktop-filters {
        width: 100%;
        max-width: 1366px !important;
        margin: auto;
        padding: 0 30px;
        margin-bottom: 32px; } }
    .desktop-filters__clear-btn {
      background: none;
      border: 0;
      cursor: pointer;
      font-size: 1em;
      color: #ffe115;
      height: 50px;
      padding: 0 20px;
      justify-self: end; }
    .desktop-filters__clear-btn:hover {
        text-decoration: none; }
    .desktop-filters__content {
      display: flex;
      align-items: center; }
    .desktop-filters__content > * {
        margin-right: 20px; }
    .desktop-filters__content > *:last-child {
          margin-right: 0; }
  
  .messages {
    padding: 1.375rem;
    padding-top: 66px;
    padding-bottom: 56px;
    overflow-y: auto;
    min-height: calc(100% - 56px); }
    @media (min-width: 768px) {
      .messages {
        padding-top: calc(66px + 0.5rem);
        padding-bottom: 0.5rem;
        height: calc(100% - 56px); } }
    .messages__date {
      text-align: center;
      font-size: 0.75rem;
      line-height: 1rem;
      color: #a6a29f; }
    .messages__closed-warning {
      color: #a6a29f;
      font-size: 0.875rem;
      font-weight: 500;
      line-height: 1.25rem;
      text-align: center; }
  
  .mobile-sorter-item {
    position: relative; }
    .mobile-sorter-item .btn--default {
      background-color: transparent;
      color: #a6a5a5;
      height: 50px;
      margin: 0;
      justify-content: flex-start;
      font-size: 0.9375em;
      font-weight: 400; }
    .mobile-sorter-item .btn--default .btn__icon {
        margin-right: 10px;
        width: 24px;
        height: 24px; }
    .mobile-sorter-item .btn--default svg {
        color: #a6a5a5;
        fill: #a6a5a5; }
    .mobile-sorter-item--selected .btn--default {
      color: #595756; }
    .mobile-sorter-item:first-child::before {
      content: '';
      width: calc(100% - 40px);
      height: 0;
      display: block;
      background: transparent;
      position: absolute;
      left: 20px;
      top: 0;
      border-top: 1px solid #f5f0eb; }
    .mobile-sorter-item::after {
      content: '';
      width: calc(100% - 40px);
      height: 0;
      display: block;
      background: transparent;
      position: absolute;
      left: 20px;
      bottom: 0;
      border-top: 1px solid #f5f0eb; }
    .mobile-sorter-item__radio {
      position: absolute;
      right: 20px;
      height: 24px;
      width: 24px;
      border-radius: 100%;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      background-color: #f5f0eb;
      border: 0 solid #ffe115;
      transition: 0ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
    .mobile-sorter-item__radio--selected {
        background-color: #f5f0eb;
        border-width: 6px;
        transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  
  .media-upload {
    position: absolute;
    display: flex;
    align-items: center;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0 1.125rem;
    border-radius: 0;
    height: 56px;
    width: 56px; }
    .media-upload__input {
      display: none; }
    @media (min-width: 768px) {
      .media-upload {
        cursor: pointer; } }
    .media-upload__icon svg {
      width: 1.25rem; }
  
  .mobile-sorter {
    display: flex;
    flex-direction: column; }
  
  .user-input {
    position: -webkit-sticky;
    position: sticky;
    padding: 1.125rem 3.5rem 1.125rem 3.5rem;
    border-top: 1px solid #f5f0eb;
    height: 56px;
    width: 100%;
    background: #fff;
    bottom: 50px; }
    .user-input--hidden-media {
      padding-left: 1.125rem; }
    @media (min-width: 768px) {
      .user-input {
        bottom: 0; } }
    .user-input__text-field {
      padding: 0;
      border: none;
      color: #717171;
      width: 100%; }
    .user-input__text-field::-webkit-input-placeholder {
        color: #a6a5a5; }
    .user-input__text-field:-ms-input-placeholder {
        color: #a6a5a5; }
    .user-input__text-field::-ms-input-placeholder {
        color: #a6a5a5; }
    .user-input__text-field::placeholder {
        color: #a6a5a5; }
    .user-input__send {
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 0;
      margin: 0;
      padding: 0 1.125rem;
      border-radius: 0;
      height: 56px;
      width: 56px; }
    .user-input__send svg {
        width: 1.25rem; }
  
  .error-state {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 64px 20px; }
    .error-state__title {
      font-size: 1rem;
      line-height: 1.375rem;
      font-weight: 400;
      margin: 0; }
    @media only screen and (min-width: 1248px) {
        .error-state__title {
          font-size: 1.125rem;
          line-height: 1.5rem; } }
    .error-state__description {
      font-size: 0.875rem;
      line-height: 1.25rem;
      font-weight: 300;
      color: #717171;
      margin: 8px auto 32px auto;
      max-width: 340px; }
    @media only screen and (min-width: 1248px) {
        .error-state__description {
          font-size: 1rem;
          line-height: 1.375rem; } }
    .error-state__illustration {
      margin-bottom: 36px; }
  
  .mobile-filters {
    padding: 0; }
    .mobile-filters .quick-filter-list__wrapper {
      margin-top: 0;
      margin-bottom: 20px; }
    @media only screen and (min-width: 768px) {
      .mobile-filters {
        padding: 20px; } }
    .mobile-filters .marmita-modal__content {
      min-height: 100vh; }
    .mobile-filters__group-wrapper {
      position: relative; }
    .mobile-filters__group .delivery-filter {
      padding: 0 20px; }
    .mobile-filters__group .restaurant-menu-search > .icon-marmita {
      left: 20px; }
    .mobile-filters__group .restaurant-menu-search > .restaurant-menu-search__field {
      padding-right: 20px; }
    .mobile-filters__group .payment-options__main-list {
      padding: 0 20px;
      position: absolute;
      max-height: none; }
    .mobile-filters__group .payment-options__main-list--visible {
      display: block;
      position: relative; }
    .mobile-filters__group .payment-options__sub-options--visible {
      position: relative; }
    .mobile-filters__group .payment-options__sub-options__list {
      max-height: none; }
    .mobile-filters__group .categories-list__content {
      padding: 10px 20px; }
    .mobile-filters__group-title {
      color: #3f3e3e;
      font-weight: 500;
      font-size: 1.125em;
      line-height: 1.375em;
      padding: 30px 20px 12px 20px; }
    .mobile-filters__action {
      display: flex;
      padding: 20px;
      position: -webkit-sticky;
      position: sticky;
      bottom: 0;
      background-color: white;
      border-top: 1px solid #f1f1f1; }
    .mobile-filters__action button:not(:last-child) {
        margin-bottom: 10px; }
    .mobile-filters__action--clear {
        padding-right: 5px;
        width: 0;
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
    .mobile-filters__action--clear-visible {
        width: 100%;
        opacity: 1;
        visibility: visible; }
    .mobile-filters__action--submit {
        width: 100%; }
    .mobile-filters__action--submit-padded {
        padding-left: 5px; }
  
  .empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: auto;
    height: 100%; }
    .empty-state__image {
      display: block;
      width: 11.8125rem;
      height: auto; }
    .empty-state__title, .empty-state__text {
      padding: 0 20px;
      text-align: center; }
    .empty-state__title {
      font-size: 1.25rem;
      margin-top: 2.625rem;
      margin-bottom: 0;
      color: #3f3e3e; }
    .empty-state__text {
      margin-top: 1rem;
      color: #a6a5a5;
      line-height: 1.375rem; }
  
  @-webkit-keyframes cow-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(0.5deg) translate(2px, 3px);
              transform: rotateZ(0.5deg) translate(2px, 3px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @keyframes cow-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(0.5deg) translate(2px, 3px);
              transform: rotateZ(0.5deg) translate(2px, 3px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @-webkit-keyframes restaurant-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(1deg) translate(-1px, 2px);
              transform: rotateZ(1deg) translate(-1px, 2px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @keyframes restaurant-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(1deg) translate(-1px, 2px);
              transform: rotateZ(1deg) translate(-1px, 2px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @-webkit-keyframes ship-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(3deg) translate(1px, -1px);
              transform: rotateZ(3deg) translate(1px, -1px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  @keyframes ship-movement {
    0% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); }
    50% {
      -webkit-transform: rotateZ(3deg) translate(1px, -1px);
              transform: rotateZ(3deg) translate(1px, -1px); }
    100% {
      -webkit-transform: rotateZ(0) translate(0, 0);
              transform: rotateZ(0) translate(0, 0); } }
  
  .restaurant-empty-list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 50px; }
  
  .restaurant-empty-list__title {
      font-size: 16px;
      line-height: 18px;
      margin-top: 30px; }
  
  .restaurant-empty-list__description {
      font-size: 14px;
      line-height: 20px;
      font-weight: lighter;
      color: #717171;
      text-align: center; }
  
  .restaurant-empty-list .animated-svg svg {
      width: 180px; }
  
  @media only screen and (min-width: 960px) {
        .restaurant-empty-list .animated-svg svg {
          width: 240px; } }
  
  .order-channels-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 1.25rem 0;
    width: 100%;
    border-bottom: 1px solid #f2f2f2; }
    .order-channels-header__details {
      flex: 1;
      overflow: hidden; }
    .order-channels-header__details h3, .order-channels-header__details p {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis; }
    .order-channels-header__details h3 {
        margin: 0;
        font-weight: 500;
        font-size: 1rem;
        line-height: 1.375rem;
        color: #3f3e3e; }
    .order-channels-header__details p {
        margin: 0;
        font-weight: 300;
        font-size: 0.875rem;
        line-height: 1.25rem;
        color: #a6a5a5; }
  
  .restaurants-list__header, .restaurants-list__empty, .restaurants-list__error {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px 12px; }
  
  .restaurants-list__empty {
    justify-content: center; }
  
  @media only screen and (min-width: 768px) {
    .restaurants-list__error-wrapper {
      width: 100%;
      max-width: 1366px !important;
      margin: auto;
      padding: 0 30px; } }
  
  .restaurants-list__header {
    padding: 0 20px; }
  
  @media only screen and (min-width: 960px) {
      .restaurants-list__header {
        width: 100%;
        max-width: 1366px !important;
        margin: auto;
        padding: 0 30px;
        padding-top: 20px; } }
  
  .restaurants-list__header .title {
      padding: 20px 0 0;
      font-size: 1.125rem;
      color: #414143;
      line-height: 1;
      font-weight: 400;
      margin: 0; }
  
  @media only screen and (min-width: 768px) {
        .restaurants-list__header .title {
          font-size: 1.25rem;
          font-weight: 500;
          letter-spacing: -1px; } }
  
  @media only screen and (min-width: 960px) {
        .restaurants-list__header .title {
          padding: 0 0 32px; } }
  
  .restaurants-list__header-space {
      padding-top: 0; }
  
  .restaurants-list__header-space .title {
        padding: 20px 0; }
  
  @media only screen and (min-width: 960px) {
          .restaurants-list__header-space .title {
            padding: 0 0 32px; } }
  
  .restaurants-list__error {
    padding: 5px 20px;
    color: #a6a5a5; }
  
  @media only screen and (min-width: 768px) {
      .restaurants-list__error {
        padding: 5px 0; } }
  
  .restaurants-list__error-header {
    padding: 5px 20px; }
  
  @media only screen and (min-width: 768px) {
      .restaurants-list__error-header {
        padding: 5px 0; } }
  
  .restaurants-list__container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px; }
  
  @media only screen and (min-width: 560px) {
      .restaurants-list__container {
        grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); } }
  
  @media only screen and (min-width: 960px) {
      .restaurants-list__container {
        gap: 32px; } }
  
  .restaurants-list .marmita-spinner {
    margin: 20px 0; }
  
  .dish-card__tag {
    display: inline;
    font-size: 0.75rem;
    color: #2E6788;
    font-weight: lighter;
    line-height: 1rem; }
    .dish-card__tag .icon-marmita {
      margin-right: 5px;
      width: 10px;
      height: 10px;
      -webkit-transform: translateY(1px);
              transform: translateY(1px); }
    .dish-card__tag svg {
      fill: #2E6788; }
    .dish-card--vertical .dish-card__tag {
    display: none; }
    @media only screen and (min-width: 560px) {
      .dish-card--vertical .dish-card__tag {
        display: inline; } }
    .dish-card--vertical .dish-card__tag--mini {
      display: block;
      position: absolute;
      right: 12px;
      bottom: 6px; }
    @media only screen and (min-width: 560px) {
        .dish-card--vertical .dish-card__tag--mini {
          display: none; } }
    .dish-card--vertical .dish-card__tag--mini .dish-card__tag-description {
        display: none; }
    .dish-card--vertical .dish-card__tag--mini .icon-marmita {
        margin-right: 0; }
  
  .dish-card__price {
    font-size: 1rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: #3e3e3e; }
    .dish-card__price--original {
      position: relative;
      font-size: 0.75rem;
      line-height: 1.25rem;
      color: #717171;
      text-decoration: line-through;
      margin-left: 5px; }
    @media only screen and (min-width: 1248px) {
        .dish-card__price--original {
          font-size: 0.875rem; } }
    .dish-card__price--discount {
      color: #50a773; }
    .dish-card--vertical .dish-card__price {
    padding: 10px 20px; }
    @media only screen and (max-width: 767px) {
      .dish-card--vertical .dish-card__price {
        font-size: 0.875rem;
        line-height: 1.125rem;
        padding: 6px 12px; } }
  
  .dish-card__delivery {
    display: none;
    font-size: 0.875rem;
    line-height: 1.125rem;
    font-weight: lighter;
    padding-top: 12px;
    color: #717171;
    border-top: 1px dashed rgba(166, 166, 166, 0.2); }
  
  .dish-card--vertical .dish-card__delivery {
    display: inline;
    padding: 10px 20px; }
  
  @media only screen and (max-width: 767px) {
      .dish-card--vertical .dish-card__delivery {
        padding: 7px 12px;
        font-size: 0.75rem;
        line-height: 1.125rem; } }
  
  @media only screen and (max-width: 767px) {
    .dish-card--vertical .dish-card__delivery-time {
      display: none; } }
  
  .dish-card--vertical .dish-card__delivery-fee--free {
    color: #50a773; }
  
  .dish-card__image {
    width: 100px;
    height: 75px;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 4px;
    pointer-events: none;
    align-self: flex-start; }
    @media only screen and (min-width: 375px) {
      .dish-card__image {
        width: 120px;
        height: 90px; } }
    @media only screen and (min-width: 768px) {
      .dish-card__image {
        width: 146px;
        height: 146px; } }
    .dish-card__image--red {
      background-color: #f8ddca; }
    .dish-card__image--green {
      background-color: #daeebf; }
    .dish-card__image--blue {
      background-color: #d2e8f5; }
    .dish-card__image-placeholder {
    background-image: url("https://static-images.ifood.com.br/image/upload/webapp/dishes/dish-image-placeholder.png?v=8.47.1");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; }
    .dish-card--vertical .dish-card__image {
    grid-area: image;
    width: 100%;
    height: 100%;
    border-radius: 4px 4px 0 0; }
    @media only screen and (min-width: 768px) {
      .dish-card--vertical .dish-card__image {
        height: 157px; } }
  
  .dish-card-wrapper {
    position: relative; }
    .dish-card-wrapper .dish-quick-add {
      position: absolute;
      bottom: 16px;
      right: 16px;
      display: flex; }
    .dish-card {
    position: relative;
    display: grid;
    min-height: 147px;
    width: 100%;
    background: #ffffff;
    padding: 20px;
    text-decoration: none;
    transition: 200ms;
    overflow: hidden; }
    @media only screen and (max-width: 742px) {
      .dish-card {
        position: relative; }
        .dish-card::after {
          content: '';
          width: calc(100% - 40px);
          height: 0;
          display: block;
          background: transparent;
          position: absolute;
          left: 20px;
          bottom: 0;
          border-top: 1px solid #f5f0eb; } }
    @media only screen and (min-width: 743px) {
      .dish-card {
        padding: 15px;
        height: 178px;
        min-width: 320px;
        border: 1px solid #f2f2f2;
        box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
        border-radius: 4px; }
        .dish-card:hover {
          border: 1px solid #dbdad9; } }
    .dish-card--has-image {
      grid-template-columns: 1fr 100px;
      grid-gap: 15px; }
    @media only screen and (min-width: 375px) {
        .dish-card--has-image {
          grid-template-columns: 1fr 120px; } }
    @media only screen and (min-width: 768px) {
        .dish-card--has-image {
          grid-template-columns: 1fr 146px;
          grid-gap: 15px; } }
    .dish-card .dish-card__container-image {
      position: relative; }
    .dish-card--sold-out .dish-card__sold-out {
      color: #fff;
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.39);
      display: flex;
      align-items: center;
      justify-content: center; }
    .dish-card__info {
      display: grid;
      grid-template-rows: 1fr 20px;
      margin: 0; }
    .dish-card__info--top {
        margin-bottom: 23px; }
    @media only screen and (min-width: 768px) {
          .dish-card__info--top {
            margin-bottom: 0; } }
    .dish-card__description {
      display: grid;
      color: #3e3e3e;
      font-weight: 400;
      font-size: 1rem;
      line-height: 1.25rem;
      margin-top: 0; }
    @media only screen and (min-width: 768px) {
        .dish-card__description {
          font-size: 1.125rem;
          line-height: 1.5rem; } }
    .dish-card__details {
      font-size: 0.75rem;
      line-height: 1rem;
      font-weight: lighter;
      color: #717171;
      word-break: break-word; }
    @media only screen and (min-width: 560px) {
        .dish-card__details {
          font-size: 0.875rem;
          line-height: 1.25rem; } }
    .dish-card__tags {
      flex-shrink: 0;
      margin: 6px 0; }
    .dish-card__tags .marmita-minitag {
        white-space: nowrap;
        background-color: transparent;
        font-size: 0.625rem; }
    @media only screen and (min-width: 768px) {
          .dish-card__tags .marmita-minitag {
            font-size: 0.75rem; } }
    .dish-card__closed-overlay {
      position: absolute;
      width: 100%;
      height: 104px;
      background-color: rgba(0, 0, 0, 0.4);
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 1rem;
      color: #ffffff; }
    @media only screen and (min-width: 560px) {
        .dish-card__closed-overlay {
          height: 157px; } }
    .dish-card__restaurant-logo {
      position: absolute;
      width: 32px;
      height: 32px;
      background-color: #ffffff;
      border-radius: 100%;
      left: 6px;
      top: 6px; }
    @media only screen and (min-width: 560px) {
        .dish-card__restaurant-logo {
          width: 50px;
          height: 50px;
          left: 10px;
          top: 10px; } }
    .dish-card--vertical {
      min-width: 160px;
      height: 264px;
      grid-template: 'image' 104px 'info' 1fr;
      grid-gap: 11px;
      border: 1px solid #f2f2f2;
      box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
      border-radius: 4px;
      padding: 0; }
    @media only screen and (min-width: 560px) {
        .dish-card--vertical {
          min-width: 222px;
          height: 380px;
          grid-template: 'image' 157px 'info' 1fr;
          grid-gap: 28px; } }
    .dish-card--vertical::after {
        display: none; }
    .dish-card--vertical .dish-card__info {
        display: grid;
        grid-area: info;
        padding: 0;
        grid-auto-rows: 30px;
        grid-template-rows: 1fr; }
    @media only screen and (min-width: 768px) {
          .dish-card--vertical .dish-card__info {
            grid-auto-rows: 36px; } }
    .dish-card--vertical .dish-card__info--top {
          margin-bottom: 5px;
          height: 80px;
          padding: 0 12px; }
    @media only screen and (min-width: 768px) {
            .dish-card--vertical .dish-card__info--top {
              margin-bottom: 23px;
              padding: 0 20px; } }
    .dish-card--vertical .dish-card__description {
        font-size: 0.875rem;
        line-height: 1.25rem;
        margin-bottom: 9px; }
    @media only screen and (min-width: 768px) {
          .dish-card--vertical .dish-card__description {
            font-size: 1.125rem;
            line-height: 1.5rem;
            margin-bottom: 9px; } }
    .dish-card--vertical .dish-card__details {
        display: grid;
        font-size: 0.75rem;
        line-height: 1rem; }
    @media only screen and (min-width: 560px) {
          .dish-card--vertical .dish-card__details {
            font-size: 0.875rem;
            line-height: 1.25rem; } }
  
  .dish-card-placeholder {
    position: relative;
    display: grid;
    min-height: 147px;
    width: 100%;
    background: #ffffff;
    padding: 20px;
    grid-template-columns: 1fr 100px;
    grid-gap: 15px; }
    @media only screen and (max-width: 767px) {
      .dish-card-placeholder {
        position: relative; }
        .dish-card-placeholder::after {
          content: '';
          width: calc(100% - 40px);
          height: 0;
          display: block;
          background: transparent;
          position: absolute;
          left: 20px;
          bottom: 0;
          border-top: 1px solid #f5f0eb; } }
    @media only screen and (min-width: 375px) {
      .dish-card-placeholder {
        grid-template-columns: 1fr 120px; } }
    @media only screen and (min-width: 768px) {
      .dish-card-placeholder {
        padding: 15px;
        height: 178px;
        min-width: 320px;
        border: 1px solid #f2f2f2;
        box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
        border-radius: 4px;
        grid-template-columns: 1fr 146px;
        grid-gap: 15px; } }
    .dish-card-placeholder__info {
      display: grid;
      grid-template-rows: 1fr 20px;
      margin: 0; }
    .dish-card-placeholder__info--top {
        margin-bottom: 23px; }
    .dish-card-placeholder__description {
      display: grid;
      margin-bottom: 9px;
      height: 20px;
      width: 80%; }
    @media only screen and (min-width: 768px) {
        .dish-card-placeholder__description {
          height: 24px; } }
    .dish-card-placeholder__details {
      display: grid;
      height: 16px;
      width: 95%;
      margin-bottom: 5px; }
    .dish-card-placeholder__details:last-child {
        width: 75%; }
    @media only screen and (min-width: 560px) {
        .dish-card-placeholder__details {
          height: 18px; } }
    .dish-card-placeholder__image {
      width: 100px;
      height: 75px;
      -o-object-fit: cover;
         object-fit: cover;
      border-radius: 4px;
      pointer-events: none;
      align-self: flex-start; }
    @media only screen and (min-width: 375px) {
        .dish-card-placeholder__image {
          width: 120px;
          height: 90px; } }
    @media only screen and (min-width: 768px) {
        .dish-card-placeholder__image {
          width: 146px;
          height: 146px; } }
    .dish-card-placeholder__price {
      height: 18px;
      width: 30%; }
    .dish-card-placeholder__delivery {
      display: none;
      padding-top: 12px;
      border-top: 1px dashed rgba(166, 166, 166, 0.2); }
    .dish-card-placeholder__delivery--content {
        display: block;
        height: 14px;
        width: 55%; }
    .dish-card-placeholder--vertical {
      min-width: 160px;
      height: 264px;
      grid-template: 'image' 104px 'info' 1fr;
      grid-gap: 11px;
      border: 1px solid #f2f2f2;
      box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);
      border-radius: 4px;
      padding: 0; }
    @media only screen and (min-width: 560px) {
        .dish-card-placeholder--vertical {
          min-width: 222px;
          height: 380px;
          grid-template: 'image' 157px 'info' 1fr;
          grid-gap: 20px; } }
    .dish-card-placeholder--vertical::after {
        display: none; }
    .dish-card-placeholder--vertical .dish-card-placeholder__info {
        display: grid;
        grid-area: info;
        padding: 0;
        grid-auto-rows: 30px;
        grid-template-rows: 1fr; }
    @media only screen and (min-width: 768px) {
          .dish-card-placeholder--vertical .dish-card-placeholder__info {
            grid-auto-rows: 36px; } }
    .dish-card-placeholder--vertical .dish-card-placeholder__info--top {
          margin-bottom: 5px;
          height: 80px;
          padding: 0 12px; }
    @media only screen and (min-width: 768px) {
            .dish-card-placeholder--vertical .dish-card-placeholder__info--top {
              margin-bottom: 23px;
              padding: 0 20px; } }
    .dish-card-placeholder--vertical .dish-card-placeholder__description {
        margin-bottom: 9px; }
    @media only screen and (min-width: 768px) {
          .dish-card-placeholder--vertical .dish-card-placeholder__description {
            margin-bottom: 9px; } }
    .dish-card-placeholder--vertical .dish-card-placeholder__image {
        grid-area: image;
        width: 100%;
        height: 100%;
        border-radius: 4px 4px 0 0; }
    @media only screen and (min-width: 768px) {
          .dish-card-placeholder--vertical .dish-card-placeholder__image {
            height: 157px; } }
    .dish-card-placeholder--vertical .dish-card-placeholder__price {
        margin: 10px 20px; }
    @media only screen and (max-width: 767px) {
          .dish-card-placeholder--vertical .dish-card-placeholder__price {
            height: 16px;
            margin: 6px 12px; } }
    .dish-card-placeholder--vertical .dish-card-placeholder__delivery {
        display: inline;
        padding: 10px 20px; }
    @media only screen and (max-width: 767px) {
          .dish-card-placeholder--vertical .dish-card-placeholder__delivery {
            padding: 7px 12px; } }
  
  .see-more__button {
    padding: 0;
    margin: 0; }
  
  .channel-item {
    cursor: pointer;
    padding: 1rem 0;
    border-bottom: 1px solid #f2f2f2; }
    .channel-item__infos, .channel-item__description {
      position: relative;
      font-size: 0.875rem;
      line-height: 1.125rem;
      color: #a6a5a5; }
    .channel-item__chat-type, .channel-item__message {
      margin-right: 2.5rem; }
    .channel-item__sent-at, .channel-item__unread {
      position: absolute;
      top: auto;
      left: auto;
      right: 0;
      bottom: 0; }
    .channel-item__chat-type {
      margin-bottom: 0.5rem;
      color: #3f3e3e; }
    .channel-item__message {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
    .channel-item__unread {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.6875rem;
      font-weight: 500;
      border-radius: 50%;
      min-height: 1.125rem;
      min-width: 1.125rem;
      background: #ffe115;
      color: white; }
  
  .order-channels {
    margin-bottom: 1.5rem; }
  
  .dish-tooltip__container {
    display: inline-block;
    width: calc(100% - 40px);
    position: absolute;
    z-index: 100;
    background: #3e3e3e;
    box-shadow: 0 3px 16px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 20px;
    bottom: 100%; }
    @media only screen and (min-width: 960px) {
      .dish-tooltip__container {
        max-width: 360px; } }
    .dish-tooltip__container:before {
      content: '';
      display: block;
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg);
      width: 25px;
      height: 25px;
      position: absolute;
      bottom: -5px;
      left: 20px;
      border-radius: 5px;
      background: #3e3e3e; }
    .dish-tooltip__content {
    font-size: 0.875rem;
    color: #fff; }
  
  .channel-list {
    padding: 1rem;
    overflow-y: auto;
    height: 100%; }
  
  .dish-action .dish-tooltip {
    align-items: center;
    background: #fff;
    border-top: 2px solid #f5f0eb;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    padding: 20px 20px;
    height: 100px;
    width: 100%;
    z-index: 30;
    position: absolute; }
  
  .dish-action__add-button {
    align-items: center;
    display: flex;
    justify-content: space-between;
    width: 100%;
    font-size: 0.875rem; }
  
  @media only screen and (min-width: 560px) {
      .dish-action__add-button {
        flex-direction: row; } }
  
  .dish-action__remove-text {
    width: 100%;
    text-align: center; }
  
  .dish-action__update-wrapper, .dish-action__add-wrapper {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    width: 100%; }
  
  @media only screen and (min-width: 960px) {
      .dish-action__update-wrapper, .dish-action__add-wrapper {
        justify-content: flex-end; } }
  
  .dish-action__update-wrapper .btn.btn--full-width,
    .dish-action__update-wrapper .btn--default, .dish-action__add-wrapper .btn.btn--full-width,
    .dish-action__add-wrapper .btn--default {
      width: 100%;
      margin: 0;
      text-align: center; }
  
  @media only screen and (min-width: 960px) {
        .dish-action__update-wrapper .btn.btn--full-width,
        .dish-action__update-wrapper .btn--default, .dish-action__add-wrapper .btn.btn--full-width,
        .dish-action__add-wrapper .btn--default {
          width: 240px;
          max-width: 240px; } }
  
  .dish-action__toastr-cta {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    border: none;
    background: transparent; }
  
  .dish-action__remove-button {
    border: 1px solid #f5f0eb; }
  
  .dish-action__counter {
    display: inline-flex;
    border: 1px solid #dcdcdc;
    border-radius: 4px;
    margin-right: 10px; }
  
  @media only screen and (min-width: 960px) {
      .dish-action__counter {
        margin-right: 15px; } }
  
  .tab-navigation {
    padding-top: 60px;
    padding-bottom: 50px; }
    @media (min-width: 768px) {
      .tab-navigation {
        padding-bottom: 0;
        height: 100%; } }
    .tab-navigation .marmita-tab__tablist-container {
      position: fixed;
      padding: 0;
      background: #fff;
      z-index: 1; }
    .tab-navigation .marmita-tab__tablist {
      height: 46px;
      width: 100%;
      display: flex;
      flex-direction: row;
      align-items: center; }
    .tab-navigation .marmita-tab__tablist button {
        flex: 1; }
    .tab-navigation .marmita-tab__label--active {
      color: #ffe115;
      border-bottom-color: #ffe115; }
    .tab-navigation .marmita-tab__panel-container {
      padding-top: 46px; }
    @media (min-width: 768px) {
        .tab-navigation .marmita-tab__panel-container {
          height: inherit; } }
    .tab-navigation .marmita-tab__panel {
      height: 100%; }
    .tab-navigation__item {
      padding: 0.875rem; }
    .tab-navigation__item--container {
        font-size: 0.75rem;
        line-height: 1rem;
        text-transform: uppercase;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        margin: auto;
        display: flex; }
    .tab-navigation__badge {
      height: 0.375rem;
      width: 0.375rem;
      border-radius: 50%;
      background: #ffe115;
      margin-top: 0;
      margin-left: 0.125rem;
      margin-bottom: auto; }
  
  .dish-restaurant {
    border: 1px solid rgba(63, 62, 62, 0.1);
    margin: 0;
    padding: 10px;
    width: 100%;
    overflow: visible;
    background: transparent;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 4px;
    text-decoration: none; }
    @media only screen and (min-width: 960px) {
      .dish-restaurant {
        padding: 11px 20px; } }
    .dish-restaurant__delivery-time, .dish-restaurant__name {
      font-size: 0.75rem;
      font-weight: 400;
      text-decoration: none;
      line-height: 1; }
    .dish-restaurant__name {
      color: #ffe115;
      display: flex;
      align-items: center; }
    .dish-restaurant__delivery-time {
      color: #717171; }
    .dish-restaurant .icon-marmita {
      -webkit-transform: translateY(-1px);
              transform: translateY(-1px);
      min-width: 16px;
      height: 16px;
      width: 16px;
      margin: 0 4px 0 0; }
    .dish-restaurant .icon-marmita svg {
        color: #ffe115;
        fill: #ffe115; }
  
  .inbox-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    overflow: hidden;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    min-height: 60px;
    z-index: 9997;
    background: #fff;
    padding: 10px 20px; }
    .inbox-header__title {
      font-weight: 500;
      left: 0;
      margin: 0;
      padding: 2px 50px 0 50px;
      position: absolute;
      text-align: center;
      width: 100%;
      z-index: 0;
      color: #3f3e3e;
      text-transform: uppercase;
      font-size: 0.75rem; }
    @media (min-width: 768px) {
        .inbox-header__title {
          font-size: 1.125rem;
          text-transform: initial; } }
    .inbox-header__left-slot, .inbox-header__right-slot {
      z-index: 1; }
  
  .cart-shuffle-alert {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 20px; }
    @media only screen and (min-width: 960px) {
      .cart-shuffle-alert {
        padding: 20px 50px;
        max-width: 480px; } }
    .cart-shuffle-alert__title {
      font-size: 1.5rem;
      line-height: 1.875rem;
      font-weight: 500;
      color: #3e3e3e;
      margin-bottom: 14px; }
    .cart-shuffle-alert__subtitle {
      font-size: 1rem;
      line-height: 1.25rem;
      font-weight: 400;
      color: #3e3e3e;
      margin-bottom: 50px; }
  
  .store-closed-alert {
    display: flex;
    flex-direction: column;
    background: white;
    max-width: 450px;
    border-radius: 4px;
    padding: 0 50px;
    margin: 0 auto; }
    .store-closed-alert__title {
      font-size: 1.5rem;
      color: #3e3e3e;
      font-weight: 500; }
    .store-closed-alert__description {
      font-size: 1rem;
      color: #717171; }
    .store-closed-alert__button {
      margin-top: 40px;
      margin-bottom: 18px; }
  
  .payment-methods-modal .online-payment,
  .payment-methods-modal .payment-methods-modal__online-button {
    padding: 0 20px; }
  
  .checkout-payment-tabs {
    display: grid;
    grid-template-rows: 50px auto;
    grid-row-gap: 24px; }
    .checkout-payment-tabs__buttons {
      display: grid;
      grid-template-columns: repeat(2, 1fr); }
    .checkout-payment-tabs__buttons--three-tabs {
        grid-template-columns: 1fr 1fr 60px; }
    .checkout-payment-tabs__tab {
      text-transform: uppercase;
      padding-left: 0;
      padding-right: 0;
      margin-left: 0; }
    .checkout-payment-tabs__tab .btn__label {
        font-weight: 400;
        font-size: 0.875rem;
        line-height: 1.25em;
        color: #a6a6a6; }
    .checkout-payment-tabs__tab--active {
        border-color: currentColor !important; }
    .checkout-payment-tabs__tab--active .btn__label {
          color: #ffe115; }
    .checkout-payment-tabs__offline-title {
      width: 287px;
      margin: auto;
      margin-bottom: 32px;
      font-weight: 300;
      font-size: 0.875rem;
      line-height: 1.25em;
      text-align: center;
      color: #a6a6a6; }
    .checkout-payment-tabs__panel {
      width: 100%;
      max-width: 500px;
      margin: auto; }
    .checkout-payment-tabs__pci-panel {
      position: relative;
      max-width: 500px; }
    .checkout-payment-tabs__pci-panel .payment-method-list {
        padding: 0 16px; }
    .checkout-payment-tabs__pci-panel .payment-method-list:last-child {
          margin-bottom: 50px; }
    .checkout-payment-tabs__pci-panel .payment-method-list::-webkit-scrollbar {
          display: none; }
    .checkout-payment-tabs .payment-states {
      height: calc(100vh - 136px);
      grid-template-rows: repeat(2, 1fr);
      grid-row-gap: 32px; }
    .checkout-payment-tabs .payment-states__illustration {
        align-self: end; }
    .checkout-payment-tabs .payment-states .payment-states-texts {
        grid-template-rows: repeat(2, -webkit-min-content) 1fr;
        grid-template-rows: repeat(2, min-content) 1fr; }
    .checkout-payment-tabs .payment-states .payment-states-texts p {
          padding: 0 10px; }
    .checkout-payment-tabs .payment-states .payment-states-texts__cta {
          align-self: end;
          margin-bottom: 50px; }
    @media only screen and (min-width: 960px) {
      .checkout-payment-tabs {
        max-width: 560px; }
        .checkout-payment-tabs__offline-title {
          display: none; }
        .checkout-payment-tabs__panel {
          max-width: initial;
          margin: 0; }
        .checkout-payment-tabs__tab {
          text-transform: initial; }
          .checkout-payment-tabs__tab .btn__label {
            font-size: 1.125rem; }
        .checkout-payment-tabs__buttons {
          grid-gap: 24px;
          grid-template-columns: 140px 150px; }
          .checkout-payment-tabs__buttons--three-tabs {
            grid-template-columns: 140px 150px 60px; }
        .checkout-payment-tabs .payment-method-list {
          overflow-y: auto;
          height: 300px; }
          .checkout-payment-tabs .payment-method-list__btn-new-card {
            margin-bottom: 10px; }
        .checkout-payment-tabs__pci-panel .payment-method-list {
          padding: 0; }
        .checkout-payment-tabs__pci-panel:after {
          position: absolute;
          content: '';
          bottom: 0px;
          max-width: 500px;
          width: 100%;
          height: 10px;
          background: linear-gradient(0deg, white -50%, rgba(255, 255, 255, 0.2) 100%); }
        .checkout-payment-tabs .payment-states {
          grid-template-columns: 250px 223px;
          grid-column-gap: 20px;
          height: 300px;
          grid-template-rows: initial; }
          .checkout-payment-tabs .payment-states .payment-states-texts {
            grid-row-gap: 8px; }
            .checkout-payment-tabs .payment-states .payment-states-texts p {
              padding: 0; }
            .checkout-payment-tabs .payment-states .payment-states-texts__title {
              font-size: 1.125rem;
              line-height: 1.375em; }
            .checkout-payment-tabs .payment-states .payment-states-texts__description {
              font-size: 0.875rem;
              line-height: 1.25em; }
            .checkout-payment-tabs .payment-states .payment-states-texts__cta {
              align-self: initial;
              margin-bottom: initial;
              margin-top: 18px;
              width: 250px; }
          .checkout-payment-tabs .payment-states__illustration {
            width: 223px;
            height: 210px; } }
  
  .delivery-method-tooltip {
    width: 100%;
    height: 300px;
    box-shadow: 0px -2px 16px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-family: "SulSans", Helvetica, sans-serif; }
    @media (min-width: 768px) {
      .delivery-method-tooltip {
        width: 475px;
        height: auto; } }
    .delivery-method-tooltip__top-border {
      width: 40px;
      height: 4px;
      background: #dcdcdc;
      border-radius: 2.5px; }
    .delivery-method-tooltip__image-container {
      margin: 20px 0 10px 0;
      height: 90px;
      display: flex;
      align-items: center;
      justify-content: center; }
    .delivery-method-tooltip__image {
      height: 100%;
      width: auto; }
    .delivery-method-tooltip__text-container {
      width: 90%;
      text-align: center; }
    @media (min-width: 768px) {
        .delivery-method-tooltip__text-container {
          width: 68%; } }
    .delivery-method-tooltip__title {
      font-weight: 500;
      font-size: 1.125rem;
      line-height: 22px;
      margin: 0 0 8px 0;
      color: #3e3e3e; }
    @media (min-width: 768px) {
        .delivery-method-tooltip__title {
          font-size: 1rem; } }
    .delivery-method-tooltip__description {
      font-weight: 300;
      text-align: center;
      font-size: 0.875rem;
      line-height: 20px;
      color: #717171;
      margin: 0; }
    .delivery-method-tooltip__button {
      font-weight: 500;
      font-size: 0.875rem;
      line-height: 18px;
      color: #ffe115;
      background: none;
      border: none;
      margin: 35px 0;
      font-family: "SulSans", Helvetica, sans-serif;
      cursor: pointer; }
    .delivery-method-tooltip__button:focus {
        outline: none; }
  
  .delivery-method-button {
    width: 100%;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "SulSans", Helvetica, sans-serif;
    cursor: pointer;
    border-radius: 4px;
    position: relative; }
    @media (min-width: 768px) {
      .delivery-method-button {
        height: 78px;
        border: solid 1px #dcdcdc; }
        .delivery-method-button--selected {
          border-color: #ffe115; } }
    .delivery-method-button__container {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%; }
    @media (min-width: 768px) {
        .delivery-method-button__container {
          width: 92%; } }
    .delivery-method-button__area {
      display: flex;
      width: 50%;
      height: 100%; }
    .delivery-method-button__area--column-alignment {
        flex-direction: column;
        justify-content: space-around;
        align-items: flex-start;
        height: 65%; }
    @media (min-width: 768px) {
          .delivery-method-button__area--column-alignment {
            height: 70%; } }
    .delivery-method-button__area--row-alignment {
        align-items: center;
        flex-direction: row;
        justify-content: flex-end; }
    .delivery-method-button__title-container {
      align-items: center;
      display: flex; }
    .delivery-method-button__title {
      font-size: 0.875rem;
      line-height: 20px;
      margin: 0;
      color: #3e3e3e; }
    .delivery-method-button__title--disabled {
        color: #a6a6a6; }
    @media (min-width: 768px) {
        .delivery-method-button__title {
          font-size: 1rem; } }
    .delivery-method-button__help-icon {
      color: #a6a6a6;
      border: solid 1.2px #a6a6a6;
      border-radius: 100%;
      width: 13px;
      height: 12px;
      font-size: 0.5rem;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      padding-top: 3px;
      margin: 0 0 4px 12px; }
    @media (min-width: 768px) {
        .delivery-method-button__help-icon {
          height: 13px; } }
    .delivery-method-button__time {
      padding-top: 4px;
      font-weight: 1;
      font-size: 0.75rem;
      line-height: 16px;
      margin: 0;
      color: #3e3e3e; }
    .delivery-method-button__time--disabled {
        color: #a6a6a6; }
    @media (min-width: 768px) {
        .delivery-method-button__time {
          font-size: 0.875rem;
          line-height: 18px; } }
    .delivery-method-button__price {
      margin: 0 16px 0 0;
      font-weight: 500;
      font-size: 0.875rem;
      line-height: 18px;
      color: #3e3e3e; }
    .delivery-method-button__price--free {
        color: #50a773; }
    .delivery-method-button__price--disabled {
        color: #a6a6a6; }
    @media (min-width: 768px) {
        .delivery-method-button__price {
          font-size: 1rem;
          line-height: 22px; } }
    @media (min-width: 768px) {
        .delivery-method-button__price {
          margin: 0; } }
    .delivery-method-button__radio {
      -webkit-appearance: none;
      margin: 0;
      width: 24px;
      height: 24px;
      border-radius: 100%;
      background: #f2f2f2;
      border-color: #f2f2f2;
      cursor: pointer; }
    .delivery-method-button__radio:focus {
        outline: none; }
    .delivery-method-button__radio--selected {
        border: solid 6px #ffe115;
        background-color: #ffffff; }
    @media (min-width: 768px) {
        .delivery-method-button__radio {
          display: none; } }
  
  .days-carousel {
    display: block; }
    .days-carousel .day-button {
      font-family: "SulSans", Helvetica, sans-serif;
      align-items: center;
      background: #fff;
      border-radius: 4px;
      border: 1px solid #f2f2f2;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.05);
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      height: 69px;
      justify-content: center;
      padding: 12px;
      text-align: center;
      width: 69px;
      position: relative; }
    @media only screen and (min-width: 960px) {
        .days-carousel .day-button {
          cursor: pointer; } }
    .days-carousel .day-button:focus {
        outline: 0; }
    .days-carousel .day-button:focus__title {
          color: #ffe115; }
    .days-carousel .day-button--unavailable .day-button__title,
      .days-carousel .day-button--unavailable .day-button__number {
        color: #dcdcdc; }
    .days-carousel .day-button--selected {
        border: 1px solid #ffe115; }
    .days-carousel .day-button--selected .day-button__title {
          color: #ffe115; }
    .days-carousel .day-button__title {
        color: #a6a6a6;
        font-size: 0.875rem;
        line-height: 26px;
        width: 100%; }
    .days-carousel .day-button__number {
        color: #3e3e3e;
        font-size: 1.25rem;
        font-weight: 500;
        width: 100%; }
  
  .scheduling-modal {
    font-family: "SulSans", Helvetica, sans-serif;
    box-sizing: border-box;
    padding: 0 16px; }
    @media (min-width: 768px) {
      .scheduling-modal {
        padding: 13px 33px;
        max-height: 80vh;
        min-width: 550px; } }
    .scheduling-modal__header {
      box-sizing: border-box;
      height: 45px;
      margin-bottom: 24px;
      padding: 10px 0;
      position: relative; }
    .scheduling-modal__header .toast {
        position: absolute;
        top: 5px;
        max-width: 100%;
        width: 95%; }
    @media (min-width: 768px) {
        .scheduling-modal__header {
          height: auto;
          margin-bottom: 29px;
          padding: 0; }
          .scheduling-modal__header .toast {
            top: -10px; } }
    .scheduling-modal__back-btn {
      position: absolute;
      left: 0;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: end; }
    .scheduling-modal__title {
      font-weight: 500;
      font-size: 0.75rem;
      text-transform: uppercase;
      text-align: center;
      margin: 0;
      line-height: 27px;
      color: #3e3e3e; }
    @media (min-width: 768px) {
        .scheduling-modal__title {
          font-size: 1.125rem;
          line-height: 22px;
          text-transform: initial;
          font-weight: normal; } }
    .scheduling-modal__days {
      margin-bottom: 52px; }
    @media (min-width: 768px) {
        .scheduling-modal__days {
          border-bottom: 1px solid #f2f2f2;
          padding-bottom: 32px;
          margin-bottom: 27px; } }
    .scheduling-modal__section {
      margin-bottom: 28px; }
    .scheduling-modal__section:last-child {
        margin-bottom: 95px; }
    @media (min-width: 768px) {
          .scheduling-modal__section:last-child {
            margin-bottom: 0; } }
    .scheduling-modal__section .delivery-method-button {
        margin-bottom: 0; }
    @media (min-width: 768px) {
          .scheduling-modal__section .delivery-method-button {
            margin-bottom: 13px; } }
    .scheduling-modal__section .delivery-method-button:last-child {
          margin-bottom: 0; }
    .scheduling-modal__section-title {
      color: #3e3e3e;
      font-size: 1.125rem;
      font-weight: 500;
      line-height: 22px;
      margin: 0 0 12px 0; }
    @media (min-width: 768px) {
        .scheduling-modal__section-title {
          margin-bottom: 25px; } }
    .scheduling-modal__actions {
      position: fixed;
      bottom: 0;
      width: 100%;
      max-width: 100%;
      left: 0;
      box-shadow: inset 0px 1px 0px #f2f2f2;
      padding: 20px;
      background: #fff;
      box-sizing: border-box; }
    @media (min-width: 768px) {
        .scheduling-modal__actions {
          position: relative;
          padding: 20px 0; } }
    .scheduling-modal__submit-btn {
      width: 100%;
      font-size: 0.875rem; }
  
  .garnish-choices__header {
    padding: 12px 20px 10px;
    display: block;
    background: #f2f2f2;
    z-index: 20;
    position: -webkit-sticky;
    position: sticky;
    top: 0; }
    @media only screen and (min-width: 960px) {
      .garnish-choices__header {
        padding: 12px 40px 10px; } }
    .garnish-choices__header::after {
      content: ' ';
      position: relative;
      display: block;
      width: 100%;
      left: 0;
      top: 9px;
      height: 1px;
      background-color: #f5f0eb; }
    .garnish-choices__label {
    position: relative;
    width: 100%;
    display: block; }
    .garnish-choices__label::after {
      content: ' ';
      position: relative;
      display: block;
      width: calc(100% - 40px);
      left: 20px;
      height: 1px;
      background-color: #f7f7f7; }
    .garnish-choices__label:last-child::after {
      display: none; }
    @media only screen and (min-width: 960px) {
        .garnish-choices__label:last-child::after {
          display: block; } }
    .garnish-choices__choice--is-fulfilled {
    width: 16px;
    height: 11px;
    margin-right: 6px; }
    .garnish-choices__choice--is-fulfilled svg {
      color: #50a773;
      fill: #50a773; }
    .garnish-choices__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px; }
    @media only screen and (min-width: 960px) {
      .garnish-choices__content {
        padding: 16px 40px; } }
    .garnish-choices__content .marmita-radio {
      margin-right: 2px; }
    .garnish-choices__header-content {
    display: flex;
    align-items: center;
    justify-content: space-between; }
    .garnish-choices__option-desc {
    margin: 0;
    font-size: 1rem;
    line-height: 1.27;
    color: #3f3e3e;
    width: 77%;
    font-weight: 100; }
    .garnish-choices__option-details {
    margin: 4px 0 0;
    font-size: 0.9375rem;
    line-height: 1.2;
    font-weight: 300;
    color: #717171;
    display: block;
    padding: 0 20px 0 0;
    overflow-wrap: break-word; }
    .garnish-choices__option-price {
    margin: 0.625rem 0 0 0;
    display: block;
    color: #ffe115;
    font-size: 0.875rem;
    font-weight: 500; }
    .garnish-choices__title {
    margin: 0;
    font-size: 1rem;
    line-height: 1.25em;
    font-weight: 500;
    color: #3f3e3e; }
    .garnish-choices__title-desc {
      font-weight: 100;
      font-size: 0.875rem;
      line-height: 17px;
      display: block;
      color: #717171; }
    .garnish-choices__tags {
    display: inline-block;
    margin-left: 5px; }
  
  .inbox-floating {
    position: fixed;
    visibility: hidden;
    background: #fff;
    border: 1px solid #f7f7f7;
    box-sizing: border-box;
    box-shadow: 2px 2px 25px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    opacity: 0;
    padding: 0;
    pointer-events: none;
    height: 615px;
    width: 410px;
    top: auto;
    left: auto;
    right: 20px;
    bottom: calc(20px - 10px);
    overflow: hidden; }
    .inbox-floating--visible {
      visibility: visible;
      opacity: 1;
      -webkit-transform: translate3D(0, -10px, 0);
              transform: translate3D(0, -10px, 0);
      pointer-events: initial;
      z-index: 9996;
      transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  
  .dish-garnishes {
    padding: 0;
    width: 100%; }
  
  .inbox-modal {
    z-index: 9998;
    pointer-events: initial;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    min-height: 100%; }
    .inbox-modal .marmita-modal__inner-content-scroll {
      height: calc(100% - 50px); }
  
  .dish-observation-form {
    display: block;
    margin-bottom: 15px;
    padding: 0 20px; }
    @media only screen and (min-width: 960px) {
      .dish-observation-form {
        padding: 0 40px; } }
    .dish-observation-form__header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      margin: 20px 0 10px; }
    .dish-observation-form__label {
      margin: 0;
      font-weight: 500;
      font-size: 1rem;
      color: #717171; }
    .dish-observation-form__counter {
      color: #a6a6a6;
      font-weight: 100;
      font-size: 0.875rem; }
    .dish-observation-form__textarea {
      border-radius: 4px;
      border: 1px solid #dcdcdc;
      background-color: #fff;
      margin-bottom: 10px;
      font-size: 1rem;
      width: 100%;
      min-width: 100%;
      max-width: 100%;
      color: #717171;
      font-weight: 400;
      resize: none;
      height: calc(3.2em + 20px);
      min-height: calc(3.2em + 20px);
      padding: 10px; }
    @media only screen and (min-width: 960px) {
        .dish-observation-form__textarea {
          height: calc(4em + 40px);
          min-height: calc(4em + 40px);
          padding: 20px; } }
    .dish-observation-form__textarea::-webkit-input-placeholder {
        color: #a6a6a6;
        opacity: 1;
        font-weight: 100; }
    .dish-observation-form__textarea:-ms-input-placeholder {
        color: #a6a6a6;
        opacity: 1;
        font-weight: 100; }
    .dish-observation-form__textarea::-ms-input-placeholder {
        color: #a6a6a6;
        opacity: 1;
        font-weight: 100; }
    .dish-observation-form__textarea::placeholder {
        color: #a6a6a6;
        opacity: 1;
        font-weight: 100; }
  
  .chat-fab {
    cursor: pointer;
    position: -webkit-sticky;
    position: sticky;
    float: right;
    bottom: calc(16px + 50px);
    right: 16px;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    background: #ffe115;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08), 0px 0px 8px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9995; }
    .chat-fab--cart-bar {
      bottom: calc(16px + 50px + 3.125rem); }
    @media only screen and (min-width: 960px) {
        .chat-fab--cart-bar {
          bottom: 34px; } }
    @media (min-width: 768px) {
      .chat-fab {
        bottom: 34px;
        right: 34px; } }
    .chat-fab__icon {
      height: 1.375rem;
      width: 1.25rem; }
    .chat-fab__icon svg {
        color: #fff;
        fill: #fff; }
    .chat-fab__count {
      position: absolute;
      height: 1rem;
      width: 1rem;
      top: 0;
      right: 0;
      color: #ffe115;
      background: #fff;
      border-radius: 50%;
      font-size: 0.75rem;
      font-weight: bold;
      line-height: 0.9375rem;
      display: flex;
      align-items: center;
      justify-content: center; }
  
  .dish-content {
    height: calc(100% - 100px);
    padding-bottom: 100px; }
    .dish-content__wrapper-container {
      display: flex;
      flex-direction: column;
      padding: 0 0 16px;
      margin: 0 0 16px 0; }
    .dish-content__container {
      padding: 0 20px; }
    @media only screen and (min-width: 960px) {
        .dish-content__container {
          padding: 0 40px; } }
    @media only screen and (max-width: 959px) {
      .dish-content__title-wrapper > div > div:first-child {
        padding-bottom: 0 !important; } }
    .dish-content__title {
      font-size: 1.125rem;
      font-weight: 500;
      color: #3e3e3e;
      background: #fff;
      z-index: 30;
      width: 100%;
      padding: 2px 40px;
      left: 0 !important; }
    .dish-content__title--sticky {
        border-bottom: 1px solid #f2f2f2;
        padding-bottom: 25px; }
    @media only screen and (max-width: 959px) {
        .dish-content__title {
          border-bottom: none;
          position: relative !important;
          top: initial !important;
          left: initial !important;
          width: auto !important;
          padding: 2px 20px;
          margin: 20px 0 0; } }
    .dish-content__img-container {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-self: center;
      max-width: 100%;
      max-height: 150px;
      overflow: hidden;
      border-radius: 4px;
      margin: 16px 0 18px; }
    .dish-content__img-container .marmita-image-expandable__button {
        overflow: hidden;
        border-radius: 4px; }
    @media only screen and (min-width: 960px) {
        .dish-content__img-container {
          margin-top: 0; } }
    .dish-content__img {
      max-width: 100%; }
    .dish-content__details {
      font-size: 0.875rem;
      margin: 10px 0 0;
      font-weight: 300;
      line-height: 1.22;
      color: #717171; }
    .dish-content__container-price {
      margin-top: 12px;
      font-size: 0.875rem;
      color: #3e3e3e; }
    .dish-content__price, .dish-content__price-min {
      margin-bottom: 10px;
      color: #3e3e3e;
      font-size: 1rem; }
    .dish-content__discount-price {
      color: #50a773;
      margin-bottom: 10px; }
    .dish-content__original-price {
      position: relative;
      font-size: 0.75rem;
      color: #dbdad9;
      text-decoration: line-through;
      margin-left: 6px; }
    @media only screen and (min-width: 960px) {
      .dish-content .dish-restaurant {
        margin-top: 15px; } }
    @media only screen and (min-width: 960px) {
      .dish-content__restaurant {
        order: 1; } }
    .dish-warnings {
    color: #a6a6a6;
    font-size: 0.9375rem;
    margin-top: 15px; }
    .dish-warnings__title {
      margin-bottom: 10px;
      font-weight: 500; }
    .dish-warnings__item {
      display: inline-block;
      font-weight: 300; }
  
  /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
  /* Document
     ========================================================================== */
  /**
   * 1. Correct the line height in all browsers.
   * 2. Prevent adjustments of font size after orientation changes in iOS.
   */
  html {
    line-height: 1.15;
    /* 1 */
    -webkit-text-size-adjust: 100%;
    /* 2 */ }
  /* Sections
     ========================================================================== */
  /**
   * Remove the margin in all browsers.
   */
  body {
    margin: 0; }
  /**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */
  h1 {
    font-size: 2em;
    margin: 0.67em 0; }
  /* Grouping content
     ========================================================================== */
  /**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */
  hr {
    box-sizing: content-box;
    /* 1 */
    height: 0;
    /* 1 */
    overflow: visible;
    /* 2 */ }
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  pre {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */ }
  /* Text-level semantics
     ========================================================================== */
  /**
   * Remove the gray background on active links in IE 10.
   */
  a {
    background-color: transparent; }
  /**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */
  abbr[title] {
    border-bottom: none;
    /* 1 */
    text-decoration: underline;
    /* 2 */
    -webkit-text-decoration: underline dotted;
            text-decoration: underline dotted;
    /* 2 */ }
  /**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */
  b,
  strong {
    font-weight: bolder; }
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  code,
  kbd,
  samp {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */ }
  /**
   * Add the correct font size in all browsers.
   */
  small {
    font-size: 80%; }
  /**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline; }
  sub {
    bottom: -0.25em; }
  sup {
    top: -0.5em; }
  /* Embedded content
     ========================================================================== */
  /**
   * Remove the border on images inside links in IE 10.
   */
  img {
    border-style: none; }
  /* Forms
     ========================================================================== */
  /**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit;
    /* 1 */
    font-size: 100%;
    /* 1 */
    line-height: 1.15;
    /* 1 */
    margin: 0;
    /* 2 */ }
  /**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */
  button,
  input {
    /* 1 */
    overflow: visible; }
  /**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */
  button,
  select {
    /* 1 */
    text-transform: none; }
  /**
   * Correct the inability to style clickable types in iOS and Safari.
   */
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button; }
  /**
   * Remove the inner border and padding in Firefox.
   */
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0; }
  /**
   * Restore the focus styles unset by the previous rule.
   */
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText; }
  /**
   * Correct the padding in Firefox.
   */
  fieldset {
    padding: 0.35em 0.75em 0.625em; }
  /**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */
  legend {
    box-sizing: border-box;
    /* 1 */
    color: inherit;
    /* 2 */
    display: table;
    /* 1 */
    max-width: 100%;
    /* 1 */
    padding: 0;
    /* 3 */
    white-space: normal;
    /* 1 */ }
  /**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */
  progress {
    vertical-align: baseline; }
  /**
   * Remove the default vertical scrollbar in IE 10+.
   */
  textarea {
    overflow: auto; }
  /**
   * 1. Add the correct box sizing in IE 10.
   * 2. Remove the padding in IE 10.
   */
  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */ }
  /**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto; }
  /**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */
  [type="search"] {
    -webkit-appearance: textfield;
    /* 1 */
    outline-offset: -2px;
    /* 2 */ }
  /**
   * Remove the inner padding in Chrome and Safari on macOS.
   */
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none; }
  /**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
  ::-webkit-file-upload-button {
    -webkit-appearance: button;
    /* 1 */
    font: inherit;
    /* 2 */ }
  /* Interactive
     ========================================================================== */
  /*
   * Add the correct display in Edge, IE 10+, and Firefox.
   */
  details {
    display: block; }
  /*
   * Add the correct display in all browsers.
   */
  summary {
    display: list-item; }
  /* Misc
     ========================================================================== */
  /**
   * Add the correct display in IE 10+.
   */
  template {
    display: none; }
  /**
   * Add the correct display in IE 10.
   */
  [hidden] {
    display: none; }
  
  .order-violation-modal {
    background-color: white;
    text-align: center;
    padding: 20px;
    border-radius: 4px; }
    .order-violation-modal__title {
      font-size: 1.25rem;
      font-weight: 500; }
    .order-violation-modal__message {
      font-size: 1.125rem;
      font-weight: 300;
      line-height: 22px; }
    .order-violation-modal__button {
      width: 100%; }
    @media only screen and (min-width: 560px) {
        .order-violation-modal__button {
          width: auto; } }
  
  .dish {
    overflow-y: auto;
    height: calc(100% - 100px);
    position: relative;
    z-index: 0;
    width: 100%; }
    @media only screen and (min-width: 768px) {
      .dish {
        position: absolute; } }
    @media only screen and (min-width: 960px) {
      .dish {
        height: calc(100% - 138px); } }
    .dish__container {
      height: calc(100% - 70px); }
    @media only screen and (min-width: 960px) {
        .dish__container {
          height: 100%; } }
    .dish__heading-wrapper {
      overflow-y: auto;
      height: calc(100% - 100px);
      position: relative; }
    .dish__loop-text {
      height: 64px;
      border-radius: 4px;
      color: #3e3e3e;
      bottom: 100px;
      right: 0;
      display: flex;
      font-size: 0.875rem;
      padding: 23px 14px;
      margin: 0 20px 15px;
      align-items: center;
      justify-content: center;
      background: #f7f7f7;
      box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.12); }
    @media only screen and (min-width: 768px) {
        .dish__loop-text {
          position: absolute; } }
    @media only screen and (min-width: 960px) {
        .dish__loop-text {
          width: 370px;
          margin: auto 20px 12px auto; } }
  
  @font-face {
    font-family: 'SulSans';
    src: url("/static/fonts/SulSans-Light.woff2") format("woff2"), url("/static/fonts/SulSans-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap; }
  @font-face {
    font-family: 'SulSans';
    src: url("/static/fonts/SulSans-Medium.woff2") format("woff2"), url("/static/fonts/SulSans-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap; }
  @font-face {
    font-family: 'SulSans';
    src: url("/static/fonts/SulSans-Regular.woff2") format("woff2"), url("/static/fonts/SulSans-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap; }
  @font-face {
    font-family: 'SulSans';
    src: url("/static/fonts/SulSans-Bold.woff2") format("woff2"), url("/static/fonts/SulSans-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap; }
  @font-face {
    font-family: 'SulSans';
    src: url("/static/fonts/SulSans-BoldItalic.woff2") format("woff2"), url("/static/fonts/SulSans-BoldItalic.woff") format("woff");
    font-weight: 700;
    font-style: italic;
    font-display: swap; }
  html {
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    height: 100%; }
  .scroll-smooth {
    scroll-behavior: smooth; }
  ::-moz-selection {
    /* Code for Firefox */
    color: #fff;
    background: #ffe115; }
  ::selection {
    color: #fff;
    background: #ffe115; }
  body {
    font-family: "SulSans", Helvetica, sans-serif;
    overflow-x: hidden;
    font-size: 16px;
    height: 100%;
    scroll-behavior: auto; }
  * {
    box-sizing: border-box; }
  .headers--desktop {
    display: none; }
  @media only screen and (min-width: 960px) {
      .headers--desktop {
        display: block; } }
  .headers--mobile {
    display: block;
    min-height: 60px; }
  @media only screen and (min-width: 960px) {
      .headers--mobile {
        display: none; } }
  :focus {
    outline: 0; }
  a {
    cursor: default; }
  @media only screen and (min-width: 960px) {
      a {
        cursor: pointer; } }
  ul {
    margin: 0;
    padding: 0; }
  ul > li {
      list-style: none; }
  .main-layout {
    transition: 500ms;
    background: #fff;
    overflow: hidden;
    padding: 0 0 50px; }
  .main-layout.main-layout--full-primary {
      min-height: 100vh;
      background: #ffe115; }
  @media only screen and (min-width: 960px) {
      .main-layout {
        padding: 0; } }
  .main-layout--with-home-button {
      padding: 0 0 70px; }
  .with-padding {
    padding: 0 20px; }
  .page-wrapper .nav-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0; }
  .page-wrapper .nav-header ~ * {
      margin-top: 70px; }
  b,
  strong {
    font-weight: bold; }
  .accessibility-hide {
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
    display: block;
    text-indent: -999999px; }
  .ph-loading {
    -webkit-animation-duration: 2s !important;
            animation-duration: 2s !important;
    -webkit-animation-fill-mode: forwards !important;
            animation-fill-mode: forwards !important;
    -webkit-animation-iteration-count: infinite !important;
            animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: linear !important;
            animation-timing-function: linear !important;
    -webkit-animation-name: placeholderAnimate !important;
            animation-name: placeholderAnimate !important;
    background: #3e3e3e;
    background: linear-gradient(to right, #f3f3f3 2%, #e9e8e8 18%, #f3f3f3 33%) !important;
    background-size: 1300px !important;
    border-radius: 2px;
    min-height: 10px; }
  .ph-loading--lighten {
      opacity: 0.6; }
  .display-none {
    display: none; }
  @media only screen and (min-width: 960px) {
    .desktop-container {
      width: 100%;
      max-width: 1366px !important;
      margin: auto;
      padding: 0 30px; } }
  .app-container {
    padding: 20px; }
  @media only screen and (min-width: 960px) {
      .app-container {
        padding: 0; } }
  
  @media only screen and (min-width: 960px) {
    .dish-modal {
      width: 580px;
      height: 80vh;
      border-radius: 4px; }
      .dish-modal__overlay {
        background-color: rgba(113, 113, 113, 0.9);
        z-index: 10001; }
      .dish-modal.ReactModal__Content .dish-modal.ReactModal__Content__overlay {
        -webkit-transform: none;
                transform: none;
        background-color: rgba(113, 113, 113, 0); }
      .dish-modal.ReactModal__Content--after-open .dish-modal.ReactModal__Content--after-open__overlay {
        background-color: rgba(113, 113, 113, 0); }
      .dish-modal--loop {
        height: 496px; } }
  
  .dish-modal__spinner {
    display: flex;
    flex-grow: 1;
    justify-content: center;
    align-items: center;
    height: calc(100% - 38px); }
  
  .dish-modal__header .nav-header {
    margin: 0 0 20px; }
  
  .dish-modal__header .nav-header__right-button {
      display: none; }
  
  @media only screen and (min-width: 960px) {
      .dish-modal__header .nav-header {
        justify-content: flex-end;
        padding: 6px 6px 0;
        min-height: auto;
        height: auto; }
        .dish-modal__header .nav-header__right-button {
          display: block;
          width: 32px;
          height: 32px;
          cursor: pointer;
          padding: 0; }
          .dish-modal__header .nav-header__right-button:hover .icon-marmita svg {
            color: #3e3e3e;
            fill: #3e3e3e; }
          .dish-modal__header .nav-header__right-button .icon-marmita {
            width: 32px;
            height: 32px;
            -webkit-transform: scale(1);
                    transform: scale(1); }
            .dish-modal__header .nav-header__right-button .icon-marmita svg {
              color: #717171;
              fill: #717171; }
            .dish-modal__header .nav-header__right-button .icon-marmita svg {
              transition: fill 0.3s cubic-bezier(0.075, 0.82, 0.165, 1); }
        .dish-modal__header .nav-header__left-button, .dish-modal__header .nav-header__title {
          display: none; } }
  
  .dish-modal--loading .marmita-modal__inner-content-scroll {
    height: 100%; }
  
  @media only screen and (min-width: 768px) {
    .dish-modal--loop .marmita-modal__inner-content > div {
      height: 100%; } }
  
  .dish-modal--loop .marmita-modal__inner-content {
    padding-bottom: 150px; }
  
  .footer {
    background-color: #fff;
    padding: 0 20px;
    margin-top: 30px; }
    @media only screen and (min-width: 960px) {
      .footer {
        width: 100%;
        max-width: 1366px !important;
        margin: auto;
        padding: 0 30px;
        margin-top: 50px; } }
    .footer__links-list {
      display: grid;
      grid-auto-columns: 1fr;
      grid-template-rows: repeat(16, -webkit-min-content);
      grid-template-rows: repeat(16, min-content);
      grid-auto-flow: column;
      gap: 24px;
      margin-bottom: 24px; }
    @media only screen and (min-width: 560px) {
        .footer__links-list {
          grid-template-rows: repeat(8, -webkit-min-content);
          grid-template-rows: repeat(8, min-content);
          grid-auto-flow: column; } }
    @media only screen and (min-width: 960px) {
        .footer__links-list {
          grid-template-rows: repeat(6, -webkit-min-content);
          grid-template-rows: repeat(6, min-content);
          gap: 30px;
          margin-bottom: 30px; } }
    @media only screen and (min-width: 1248px) {
        .footer__links-list {
          grid-template-rows: repeat(4, -webkit-min-content);
          grid-template-rows: repeat(4, min-content); } }
    .footer__section {
      border-top: 1px solid #dcdcdc;
      padding: 40px 0 10px; }
    .footer__title {
      letter-spacing: -1px;
      font-size: 1.25rem;
      color: #3e3e3e;
      margin-bottom: 24px;
      font-weight: 500;
      margin-top: 0; }
    @media only screen and (min-width: 960px) {
        .footer__title {
          margin-bottom: 30px; } }
    .footer__subtitle {
      font-weight: 500;
      font-size: 1rem;
      line-height: 1.22;
      margin-top: 0;
      margin-bottom: 30px;
      color: #3e3e3e; }
    .footer__row {
      display: flex;
      flex-flow: row wrap; }
    .footer__column {
      flex-basis: 100%;
      margin-bottom: 30px; }
    @media only screen and (min-width: 560px) {
        .footer__column {
          flex-basis: 50%; } }
    @media only screen and (min-width: 768px) {
        .footer__column {
          flex-basis: 25%; } }
    .footer__text-link,
    .footer a.footer__text-link {
      font-weight: 400;
      font-size: 1rem;
      line-height: 1.22;
      color: #717171;
      transition: color 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      text-decoration: none; }
    @media only screen and (min-width: 960px) {
        .footer__text-link,
        .footer a.footer__text-link {
          cursor: pointer; } }
    .footer__text-link:hover,
      .footer a.footer__text-link:hover {
        color: #3e3e3e; }
    .footer__social {
      display: inline-flex;
      margin-left: -12px;
      margin-top: -5px; }
    .footer__social-icon {
      width: 30px;
      transition: fill 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      cursor: pointer;
      margin-right: 20px;
      border-radius: 0; }
    .footer__social-icon .icon-marmita {
        width: 26px;
        height: auto; }
    .footer__social-icon.btn-icon.btn-icon--transparent svg {
        color: #717171;
        fill: #717171; }
    .footer__social-icon.btn-icon.btn-icon--transparent svg,
      .footer__social-icon.btn-icon.btn-icon--transparent path {
        transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
    .footer__social-icon:hover.footer__social-icon:hover.btn-icon.btn-icon--transparent svg {
        color: #3e3e3e;
        fill: #3e3e3e; }
    .footer__copyright-text {
      display: grid;
      align-items: center;
      grid-gap: 0 20px;
      grid-template-columns: 50px 1fr;
      grid-template-areas: 'logo-link company-copy' 'logo-link company-info'; }
    .footer__copyright-text a {
        flex-basis: 64px;
        margin-right: 20px;
        min-width: 50px;
        grid-area: logo-link; }
    .footer__copyright-text p {
        width: 100%;
        font-size: 0.6875rem;
        line-height: 1.35;
        font-weight: 300;
        color: #717171;
        margin: 0; }
    @media only screen and (min-width: 960px) {
          .footer__copyright-text p {
            font-size: 0.8125rem; } }
    .footer__copyright-text svg {
        color: #ffe115;
        fill: #ffe115; }
    .footer__company-informations {
      margin: 10px 0 0 0;
      font-size: 0.625rem;
      grid-area: company-info; }
    .footer__company-copyright {
      grid-area: company-copy; }
    .footer__section--about {
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      gap: 0 24px; }
    .footer__section--about .footer__column {
        margin-bottom: 20px; }
    @media only screen and (min-width: 560px) {
        .footer__section--about {
          grid-template-columns: repeat(2, 1fr); } }
    @media only screen and (min-width: 960px) {
        .footer__section--about {
          grid-template-columns: repeat(3, 1fr);
          gap: 30px;
          margin-bottom: 0; }
          .footer__section--about .footer__column {
            margin-bottom: 0; } }
    @media only screen and (min-width: 1248px) {
        .footer__section--about {
          grid-template-columns: repeat(4, 1fr); } }
    .footer__section--about .footer__links-list {
        grid-template-rows: auto;
        grid-auto-flow: row;
        grid-template-columns: 1fr;
        padding-bottom: 0; }
    .footer__section--copyright {
      display: grid;
      grid-template-columns: auto;
      gap: 20px;
      padding: 40px 0; }
    @media only screen and (min-width: 768px) {
        .footer__section--copyright {
          gap: 30px; } }
    @media only screen and (min-width: 960px) {
        .footer__section--copyright {
          grid-auto-columns: -webkit-min-content;
          grid-auto-columns: min-content;
          grid-template-columns: repeat(auto-fit, minmax(10px, auto));
          gap: 16px; } }
    .footer__section--copyright .footer__row {
        align-items: center; }
    @media only screen and (min-width: 960px) {
          .footer__section--copyright .footer__row {
            flex-wrap: nowrap;
            justify-content: space-between; } }
    .footer__section--copyright .footer__text-link {
        display: inline-block;
        width: 100%;
        margin: 10px 0; }
    .footer__section--cities {
      display: grid;
      grid-template-areas: 'title see-more' 'list list'; }
    .footer__section--cities a.footer__text-link.footer__see-more {
        color: #ffe115;
        justify-self: end;
        margin-top: 0.2rem;
        font-weight: normal; }
    .footer__section--cities .footer__links-list {
        grid-area: list;
        grid-template-rows: repeat(19, -webkit-min-content);
        grid-template-rows: repeat(19, min-content);
        grid-auto-columns: 1fr; }
    @media only screen and (min-width: 560px) {
          .footer__section--cities .footer__links-list {
            grid-template-rows: repeat(10, -webkit-min-content);
            grid-template-rows: repeat(10, min-content); } }
    @media only screen and (min-width: 960px) {
          .footer__section--cities .footer__links-list {
            grid-template-rows: repeat(7, -webkit-min-content);
            grid-template-rows: repeat(7, min-content); } }
    @media only screen and (min-width: 1248px) {
          .footer__section--cities .footer__links-list {
            grid-template-rows: repeat(5, -webkit-min-content);
            grid-template-rows: repeat(5, min-content); } }
  
  .jobs-header {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    background-color: #ffffff;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 105; }
    .jobs-header--transparent {
      position: absolute;
      background-color: rgba(0, 0, 0, 0); }
    .jobs-header--white {
      background-color: #ffffff;
      box-shadow: inset 0 -1px 0 #dcdcdc; }
    .jobs-header-background {
    height: 100vh;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    display: none; }
    .jobs-header-background--block {
      display: block; }
    @media only screen and (min-width: 960px) {
    .jobs-header-container {
      width: 100%;
      max-width: 1366px !important;
      margin: auto;
      padding: 0 30px; } }
    .jobs-header-nav {
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 110;
    cursor: pointer;
    padding: 16px 20px; }
    @media only screen and (min-width: 960px) {
      .jobs-header-nav {
        padding: 16px 0;
        background-color: inherit; } }
    .jobs-header-nav .icon-brand {
      width: 100px;
      height: 50px;
      margin: auto;
      transition: 200ms; }
    .jobs-header-nav__menu {
      max-width: 24px;
      display: grid;
      cursor: pointer; }
    @media only screen and (min-width: 960px) {
        .jobs-header-nav__menu {
          display: none; } }
    .jobs-header-items {
    display: none;
    width: 70%; }
    @media only screen and (min-width: 960px) {
      .jobs-header-items {
        display: flex; } }
    @media only screen and (min-width: 1248px) {
      .jobs-header-items {
        width: 60%; } }
    .jobs-header-items__item {
      display: block;
      font-weight: 500;
      font-size: 1rem;
      line-height: 1.25rem;
      text-decoration: none;
      padding: 22px 0;
      color: #3f3e3e; }
    @media only screen and (min-width: 960px) {
        .jobs-header-items__item {
          display: flex;
          justify-content: center;
          flex-direction: column;
          text-align: right;
          flex: 1;
          padding: 15px 0; } }
    @media only screen and (min-width: 960px) {
        .jobs-header-items__item--transparent {
          color: #ffffff; } }
    @media only screen and (min-width: 960px) {
        .jobs-header-items__item--white {
          color: #3f3e3e; } }
    .jobs-header-items__item--active {
        color: #ffe115; }
    .jobs-header-items-box {
    z-index: 110;
    background-color: #ffffff;
    position: absolute;
    width: 100%;
    padding: 15px;
    display: none; }
    .jobs-header-items-box--block {
      display: block; }
  
  body.test-user .checkout-payment__submit,
  body.test-user .payment-action .btn,
  body.test-user .restaurant-cart-footer__button {
    background-color: #50a773 !important; }
  
  body.test-user .desktop-checkout__header {
    background-color: #50a773 !important; }
  
  body.test-user .desktop-checkout__header .btn-icon:hover {
      background-color: #50a773 !important; }
  
  body.test-user .desktop-checkout__header .icon-marmita svg {
      color: #fff;
      fill: #fff; }
  
  body.test-user .desktop-checkout__header .icon-marmita svg > path {
      fill: white !important; }
  
  .page-not-found {
    padding: 20px;
    padding-bottom: 0;
    height: calc(100vh - 50px);
    display: grid;
    grid-template-rows: auto -webkit-min-content;
    grid-template-rows: auto min-content; }
    @media only screen and (min-width: 1248px) {
      .page-not-found {
        height: 100vh;
        max-width: 1366px !important;
        padding: 0;
        padding-left: 70px;
        margin: auto;
        grid-template-columns: 450px auto; } }
    .page-not-found__actions {
      display: grid;
      width: 210px;
      grid-template-rows: repeat(4, minmax(-webkit-min-content, -webkit-max-content));
      grid-template-rows: repeat(4, minmax(min-content, max-content));
      grid-row-gap: 10px;
      letter-spacing: -1px;
      z-index: 1; }
    .page-not-found__actions svg {
        width: 87px;
        height: 46px;
        margin-bottom: 20px; }
    @media only screen and (min-width: 768px) {
        .page-not-found__actions {
          grid-row-gap: 25px;
          width: 450px; }
          .page-not-found__actions svg {
            margin-top: 50px; } }
    .page-not-found__title {
      font-weight: 500;
      font-size: 2.5rem;
      line-height: 40px;
      color: #3e3e3e; }
    @media only screen and (min-width: 768px) {
        .page-not-found__title {
          font-size: 4.375rem;
          line-height: 70px; } }
    .page-not-found__subtitle {
      font-size: 1.125rem;
      line-height: 22px;
      font-weight: 300;
      color: #3e3e3e; }
    @media only screen and (min-width: 768px) {
        .page-not-found__subtitle {
          font-size: 1.625rem;
          line-height: 35px; } }
    .page-not-found__button {
      margin: 0;
      width: 180px;
      height: 50px; }
    .page-not-found__button .btn__label {
        letter-spacing: -1px;
        font-weight: 500; }
    @media only screen and (min-width: 768px) {
        .page-not-found__button {
          width: 224px;
          height: 60px; }
          .page-not-found__button .btn__label {
            font-size: 1.25rem;
            line-height: 1.0625em; } }
    .page-not-found__illustration-wrapper {
      justify-self: end; }
    .page-not-found__illustration {
      position: absolute;
      top: 212px;
      width: auto;
      max-width: 100vw;
      height: calc(100vh - 212px);
      right: -50px; }
    @media only screen and (min-width: 768px) {
        .page-not-found__illustration {
          top: 326px;
          height: calc(100vh - 326px); } }
    @media only screen and (min-width: 1248px) {
        .page-not-found__illustration {
          right: initial;
          max-height: 925px;
          position: relative;
          top: -10vh;
          height: 120vh; } }
  
  .static-wrapper {
    width: 100%;
    padding: 20px;
    margin: auto; }
    @media only screen and (min-width: 960px) {
      .static-wrapper {
        width: 100%;
        margin: auto;
        padding: 0 30px;
        max-width: 900px; } }
    .static-wrapper a {
      text-decoration: none;
      color: #ffe115; }
    .static-wrapper a:hover {
        cursor: pointer; }
    @media only screen and (min-width: 960px) {
      .static-wrapper .nav-header {
        display: none; } }
    .static-content {
    color: #717171; }
    .static-content__title {
      font-size: 1.625rem;
      color: #ffe115;
      margin: 20px 0;
      text-align: center;
      font-weight: 500; }
    .static-content__subtitle {
      font-size: 1.125rem;
      text-align: center;
      font-weight: 500; }
    .static-content__section-title {
      font-size: 1.125rem;
      color: #ffe115;
      font-weight: 700;
      line-height: 27px;
      margin: 25px 0 0 0; }
    .static-content__section-subtitle {
      font-size: 1rem;
      color: #ffe115;
      font-weight: 500;
      margin: 25px 0 0 0; }
    .static-content__text {
      font-weight: 300;
      margin-bottom: 15px;
      line-height: 29px;
      display: block;
      text-align: justify; }
    .static-content__text--bold {
        font-weight: bold; }
    .static-content__subsection {
      font-size: 1rem;
      color: #ee4c58; }
    .static-content__important {
      color: #ffe115; }
    .static-content__list {
      padding-left: 20px;
      margin-bottom: 20px; }
    .static-content__list li {
        font-weight: 300;
        line-height: 29px;
        text-align: justify;
        list-style: initial;
        display: list-item; }
    .static-content__subsection-number {
      margin-right: 10px;
      font-weight: 300;
      font-style: italic; }
    .static-content__nav-policy {
      margin: 20px 0; }
    .static-content__nav-policy li {
        margin: 0 0 15px; }
    .static-content__nav-link {
      color: #ffe115; }
    .static-content__table-policy {
      font-size: 0.9375rem;
      border: 1px solid #f5f0eb; }
    .static-content__table-policy td,
      .static-content__table-policy th {
        border: 1px solid #f5f0eb; }
    .static-content img {
      width: 100%;
      max-width: 90%;
      margin: 20px auto;
      display: block; }
    .static-content__image-header {
      width: 200px;
      margin: 60px auto 0; }