@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap);
:root {
  /* Design system colors */
  --tone-200: rgba(5, 5, 5, 0.06);
  --tone-300: rgba(0, 0, 0, 0.11);
  --tone-400: rgba(0, 0, 0, 0.28);
  --tone-500: rgba(0, 0, 0, 0.51);
  --tone-600: rgba(0, 0, 0, 0.65);
  --tone-700: rgba(0, 0, 0, 0.76);
  --tone-800: rgba(0, 0, 0, 0.86);
  --tone-900: rgba(0, 0, 0, 0.98);

  --absolute-100: #ffffff;
  --absolute-200: #f0f0f0;
  --absolute-300: #e3e3e3;
  --absolute-700: #3d3d3d;
  --absolute-800: #1f1f1f;
  --absolute-900: #050505;

  --aquamarine-500: rgba(1, 135, 144, 1);

  --red-100: rgba(228, 70, 86, 0.1);
  --red-500: rgba(211, 53, 69, 1);

  --blue-100: rgba(0, 122, 255, 0.1);
  --blue-400: rgba(0, 122, 255, 1);

  --text-secondary: rgba(0, 0, 0, 0.54);
  --text-disabled: rgba(0, 0, 0, 0.38);

  --white: white;
  --red: #ff3b2f;
  --light-red: #e44656;
  --transparent-red: rgba(228, 70, 86, 0.1);
  --light-footer-gray: #f1f1f1;
  --light-footer-bg-gray: #f8f8f8;
  --light-text-gray: rgba(0, 0, 0, 0.51);
  --text-black: rgba(0, 0, 0, 0.98);
  --text-black-title-popup: rgba(46, 46, 45, 1);
  --background-light-secondary: #f2f2f7;
  --popup-background: rgba(0, 0, 0, 0.28);
  --gray-border: rgba(0, 0, 0, 0.11);
  --gray-border-light: rgba(194, 194, 194, 0.5);
  --dark-gray: #333333;
  --light-gray: #d9d9d9;
  --medium-gray: #979797;
  --medium-dark-gray: #646464;
  --disabled-gray: #ebebeb;
  --disabled-dark-gray: #c2c2c2;
  --placeholder-gray: #f1f1f1;
  --white: white;
  --black: black;
  --light-black: rgba(61, 61, 61, 1);
  --main: #5648f8;
  --blue: rgba(0, 122, 255, 1);
  --link-blue: rgba(0, 106, 219, 1);
  --medium-main: #c1bbff;
  --light-main: #e7eafb;
  --accent: #22ccd8;
  --light-cookie-accent: rgba(233, 250, 251, 1);
  --light-accent: rgba(34, 204, 216, 0.2);
  --light-background-accent: rgba(144, 247, 254, 0.08);
  --lightest-accent: #b3eef2;
  --mts-red: #e30611;
  --yelow: #ff9f0a;
  --aquamarine: rgba(34, 204, 216, 0.1);

  /* New colors */
  --black-bg: var(--absolute-700);
  --black-hover: var(--absolute-800);

  /* Border-radius variants */
  --radius-sx: 4px;
  --radius-s: 8px;
  --radius-m: 16px;
  --radius-l: 24px;
  --radius-xl: 32px;

  /* Box-shadows */
  --shadow-xl: 0px 25px 59px rgba(0, 0, 0, 0.2);
  --shadow-m: 0px 16px 24px 0px rgba(0, 0, 0, 0.15);

  /**
   * Fonts using while preloading Lato
   * Or if preloading failed
   */
  --fonts: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
    "Open Sans", "Helvetica Neue", sans-serif;

  --font-family-main: Roboto;

  --font-size-heading-first: 30px;
  --font-size-heading-second: 22px;
  --font-size-heading-third: 18px;

  /**
   * Margin for the product card
   * Is using in the product grids and sliders
   */
  --product-margin: 8px;

  /**
   * Height of the `Header` component
   */
  --header-height: 84px;

  /**
   * Margins between content and page body
   * On desktop does not make sense because numeric value is unknown
   * 0 here on desktop to not to violate calculations
   */
  --wrapper-margin: 0;
  --wrapper-padding: 120px;

  /**
   * Cards spacings and width
   */

  --card-spacing: 16px;

  --card-width: 282px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
:root {
    --product-margin: 7.5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --product-margin: 5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --header-height: 54px
}
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
:root {
    --wrapper-margin: 15px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-spacing: 24px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-width: calc((100% - (var(--card-spacing) * 2)) / 3)
}
  }
/* TODO: complete */
/* 1600 */
/* 1300 */
/* 992 */
/* 992 */
/* 768 */
/* 320 */
.Favorites--empty  .Favorites__text {
    width: 100%;
    text-align: center;
  }
.Favorites--empty  .Favorites__text::before {
      content: "";
      display: block;
      height: 200px;
      background: url(/static/media/banner.ce469457.svg) no-repeat;
      background-size: contain;
      background-position: center;
    }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.Favorites--empty  .Favorites__text::before {
        height: 90px;
        margin-bottom: 16px
    }
      }
.Favorites__head {
    margin: 28px 0 -10px 0;
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.Favorites__head {
      margin-top: 9px
  }
    }
.Favorites__title {
    margin: 6px 0 16px 0;
    color: #333333;
    color: var(--dark-gray);
    font-weight: bold;
    font-size: 48px;
    line-height: 96px;
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.Favorites__title {
      margin: 18px 0 25px 0;
      font-size: 30px;
      line-height: 36px
  }
    }
.Favorites__text {
    width: 738px;
    font-size: 24px;
    line-height: 29px;
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.Favorites__text {
      font-size: 17px;
      line-height: 20px
  }
    }
.Favorites__content {
    margin-bottom: 70px;
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.Favorites__content {
      margin-bottom: 48px
  }
    }
.Favorites__content .ProductsGrid {
      margin-top: 24px;
      grid-gap: calc(2 * 8px);
      grid-gap: calc(2 * var(--product-margin));
    }
.Favorites__more {
    margin-top: 18px;
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.Favorites__more {
      margin-top: 9px;
      font-size: 20px;
      line-height: 24px
  }
    }
@media only screen and (max-width: 767px) {
.Favorites__more {
      width: 100%
  }
    }
@media only screen and (max-width: 767px) {
.Favorites__more .Link__arrow {
        -webkit-transform: translateX(7px) scale(0.8);
                transform: translateX(7px) scale(0.8)
    }
      }
.Breadcrumbs {
  font-size: 15px;
  line-height: 22px;
}
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.Breadcrumbs {
    font-size: 13px;
    line-height: 22px
}
  }

:root {
  /* Design system colors */
  --tone-200: rgba(5, 5, 5, 0.06);
  --tone-300: rgba(0, 0, 0, 0.11);
  --tone-400: rgba(0, 0, 0, 0.28);
  --tone-500: rgba(0, 0, 0, 0.51);
  --tone-600: rgba(0, 0, 0, 0.65);
  --tone-700: rgba(0, 0, 0, 0.76);
  --tone-800: rgba(0, 0, 0, 0.86);
  --tone-900: rgba(0, 0, 0, 0.98);

  --absolute-100: #ffffff;
  --absolute-200: #f0f0f0;
  --absolute-300: #e3e3e3;
  --absolute-700: #3d3d3d;
  --absolute-800: #1f1f1f;
  --absolute-900: #050505;

  --aquamarine-500: rgba(1, 135, 144, 1);

  --red-100: rgba(228, 70, 86, 0.1);
  --red-500: rgba(211, 53, 69, 1);

  --blue-100: rgba(0, 122, 255, 0.1);
  --blue-400: rgba(0, 122, 255, 1);

  --text-secondary: rgba(0, 0, 0, 0.54);
  --text-disabled: rgba(0, 0, 0, 0.38);

  --white: white;
  --red: #ff3b2f;
  --light-red: #e44656;
  --transparent-red: rgba(228, 70, 86, 0.1);
  --light-footer-gray: #f1f1f1;
  --light-footer-bg-gray: #f8f8f8;
  --light-text-gray: rgba(0, 0, 0, 0.51);
  --text-black: rgba(0, 0, 0, 0.98);
  --text-black-title-popup: rgba(46, 46, 45, 1);
  --background-light-secondary: #f2f2f7;
  --popup-background: rgba(0, 0, 0, 0.28);
  --gray-border: rgba(0, 0, 0, 0.11);
  --gray-border-light: rgba(194, 194, 194, 0.5);
  --dark-gray: #333333;
  --light-gray: #d9d9d9;
  --medium-gray: #979797;
  --medium-dark-gray: #646464;
  --disabled-gray: #ebebeb;
  --disabled-dark-gray: #c2c2c2;
  --placeholder-gray: #f1f1f1;
  --white: white;
  --black: black;
  --light-black: rgba(61, 61, 61, 1);
  --main: #5648f8;
  --blue: rgba(0, 122, 255, 1);
  --link-blue: rgba(0, 106, 219, 1);
  --medium-main: #c1bbff;
  --light-main: #e7eafb;
  --accent: #22ccd8;
  --light-cookie-accent: rgba(233, 250, 251, 1);
  --light-accent: rgba(34, 204, 216, 0.2);
  --light-background-accent: rgba(144, 247, 254, 0.08);
  --lightest-accent: #b3eef2;
  --mts-red: #e30611;
  --yelow: #ff9f0a;
  --aquamarine: rgba(34, 204, 216, 0.1);

  /* New colors */
  --black-bg: var(--absolute-700);
  --black-hover: var(--absolute-800);

  /* Border-radius variants */
  --radius-sx: 4px;
  --radius-s: 8px;
  --radius-m: 16px;
  --radius-l: 24px;
  --radius-xl: 32px;

  /* Box-shadows */
  --shadow-xl: 0px 25px 59px rgba(0, 0, 0, 0.2);
  --shadow-m: 0px 16px 24px 0px rgba(0, 0, 0, 0.15);

  /**
   * Fonts using while preloading Lato
   * Or if preloading failed
   */
  --fonts: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
    "Open Sans", "Helvetica Neue", sans-serif;

  --font-family-main: Roboto;

  --font-size-heading-first: 30px;
  --font-size-heading-second: 22px;
  --font-size-heading-third: 18px;

  /**
   * Margin for the product card
   * Is using in the product grids and sliders
   */
  --product-margin: 8px;

  /**
   * Height of the `Header` component
   */
  --header-height: 84px;

  /**
   * Margins between content and page body
   * On desktop does not make sense because numeric value is unknown
   * 0 here on desktop to not to violate calculations
   */
  --wrapper-margin: 0;
  --wrapper-padding: 120px;

  /**
   * Cards spacings and width
   */

  --card-spacing: 16px;

  --card-width: 282px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
:root {
    --product-margin: 7.5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --product-margin: 5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --header-height: 54px
}
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
:root {
    --wrapper-margin: 15px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-spacing: 24px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-width: calc((100% - (var(--card-spacing) * 2)) / 3)
}
  }
/* TODO: complete */
/* 1600 */
/* 1300 */
/* 992 */
/* 992 */
/* 768 */
/* 320 */
.Booking {
    width: 588px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    font-family: Roboto;
    font-family: var(--font-family-main);
    margin: 20px auto 108px;
 }
@media only screen and (max-width: 767px) {
.Booking {
        padding: 16px;
        width: auto;
        margin: 20px auto
 }
      }
.Booking__header_title {
            padding-top: 4px;
            font-size: 22px;
            font-weight: 600;
            line-height: 26px;
        }
@media only screen and (max-width: 767px) {
.Booking__header_title {
                font-size: 18px;
                line-height: 21px
        }
              }
.Booking__block {
        grid-gap: 10px;
        gap: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
          
          
    }
.Booking__block_title {
            font-size: 18px;
            font-weight: 700;
        }
.Booking__block_subtitle {
            font-size: 16px;
            font-weight: 400;
            list-style-type: none;
            line-height: 22.4px;
        }
@media only screen and (max-width: 767px) {
.Booking__block_liste {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex
        }
              }
.Booking__block_subtitle-dot {
            padding: 0 9px;
        }
.Booking__block_subtitle-icon {
            margin-right: 8px;
        }
.Booking__block_share-link {
            font-size: 16px;
            font-weight: 400;
            line-height: 22px;
            color: rgba(0, 106, 219, 1);
            color: var(--link-blue);
            grid-gap: 4px;
            gap: 4px;
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            cursor: pointer;
        }
.Booking__block_share-link svg path {
                fill: rgba(0, 106, 219, 1);
                fill: var(--link-blue);
                fill-opacity: 1;
            }
.Booking__block_links{
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }
.Booking__block_link {
            font-size: 16px;
            font-weight: 400;
            line-height: 21px;
            color: rgba(0, 106, 219, 1);
            color: var(--link-blue);
          }
@media only screen and (max-width: 767px) {
.Booking__block_link {
                font-size: 14px
          }
              }
.Booking__block_link:not(:last-child) {
            margin-right: 4px;
          }
.Booking__block_link:not(:last-child):after {
              content: '\00b7';
              margin-left: 4px;
              font-size: 24px;
              color: black;
              vertical-align: middle;
            }
.Booking__image {
        height: 234px;
        border-radius: 16px;
        margin-bottom: 16px;
        -o-object-fit: cover;
           object-fit: cover;
    }
@media only screen and (max-width: 767px) {
.Booking__image {
            height: 180px
    }
          }
.Booking__content {
        display: grid;
        grid-gap: 24px;
        gap: 24px;
    }
.Booking__orderInfo {
        display: grid;
        grid-template-columns: auto auto;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
@media only screen and (max-width: 767px) {
.Booking__orderInfo {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
            grid-gap: 24px;
            gap: 24px
    }
          }
.Booking__orderInfo_table {
            display: grid;
            grid-gap: 8px;
            gap: 8px;
        }
.Booking__orderInfo_item {
            font-size: 16px;
            font-weight: 500;
            line-height: 22px;
            color: rgba(61, 61, 61, 1);
            color: var(--light-black);
        }
@media only screen and (max-width: 767px) {
.Booking__orderInfo_item {
                font-size: 16px;
                font-weight: 400;
                line-height: 22px
        }
              }
.Booking__orderInfo_QR {
            border-left: 1px solid rgba(0, 0, 0, 0.11);
            border-left: 1px solid var(--gray-border);
        }
@media only screen and (max-width: 767px) {
.Booking__orderInfo_QR {
                display: grid;
                font-size: 18px;
                font-weight: 600;
                line-height: 21px;
                grid-gap: 8px;
                gap: 8px;
                width: 100%;
                border-left: none
        }
              }
.Booking__orderInfo_shareLinkBlock {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            grid-gap: 20px;
            gap: 20px;
        }
.Booking__orderInfo_shareLinkBlock .Booking__orderInfo_table {
                margin-right: auto;
            }
.Booking__orderInfo_shareLinkBlock .Booking__orderInfo_QR {
                border-left: none;
            }
.Booking__orderInfo_shareLinkBlock .Booking__orderInfo_QR .QrCodeAccessInfo__title {
                    max-width: 285px;
                }
.Booking .QrCodeAccessInfo__title {
        max-width: 210px;
    }
:root {
  /* Design system colors */
  --tone-200: rgba(5, 5, 5, 0.06);
  --tone-300: rgba(0, 0, 0, 0.11);
  --tone-400: rgba(0, 0, 0, 0.28);
  --tone-500: rgba(0, 0, 0, 0.51);
  --tone-600: rgba(0, 0, 0, 0.65);
  --tone-700: rgba(0, 0, 0, 0.76);
  --tone-800: rgba(0, 0, 0, 0.86);
  --tone-900: rgba(0, 0, 0, 0.98);

  --absolute-100: #ffffff;
  --absolute-200: #f0f0f0;
  --absolute-300: #e3e3e3;
  --absolute-700: #3d3d3d;
  --absolute-800: #1f1f1f;
  --absolute-900: #050505;

  --aquamarine-500: rgba(1, 135, 144, 1);

  --red-100: rgba(228, 70, 86, 0.1);
  --red-500: rgba(211, 53, 69, 1);

  --blue-100: rgba(0, 122, 255, 0.1);
  --blue-400: rgba(0, 122, 255, 1);

  --text-secondary: rgba(0, 0, 0, 0.54);
  --text-disabled: rgba(0, 0, 0, 0.38);

  --white: white;
  --red: #ff3b2f;
  --light-red: #e44656;
  --transparent-red: rgba(228, 70, 86, 0.1);
  --light-footer-gray: #f1f1f1;
  --light-footer-bg-gray: #f8f8f8;
  --light-text-gray: rgba(0, 0, 0, 0.51);
  --text-black: rgba(0, 0, 0, 0.98);
  --text-black-title-popup: rgba(46, 46, 45, 1);
  --background-light-secondary: #f2f2f7;
  --popup-background: rgba(0, 0, 0, 0.28);
  --gray-border: rgba(0, 0, 0, 0.11);
  --gray-border-light: rgba(194, 194, 194, 0.5);
  --dark-gray: #333333;
  --light-gray: #d9d9d9;
  --medium-gray: #979797;
  --medium-dark-gray: #646464;
  --disabled-gray: #ebebeb;
  --disabled-dark-gray: #c2c2c2;
  --placeholder-gray: #f1f1f1;
  --white: white;
  --black: black;
  --light-black: rgba(61, 61, 61, 1);
  --main: #5648f8;
  --blue: rgba(0, 122, 255, 1);
  --link-blue: rgba(0, 106, 219, 1);
  --medium-main: #c1bbff;
  --light-main: #e7eafb;
  --accent: #22ccd8;
  --light-cookie-accent: rgba(233, 250, 251, 1);
  --light-accent: rgba(34, 204, 216, 0.2);
  --light-background-accent: rgba(144, 247, 254, 0.08);
  --lightest-accent: #b3eef2;
  --mts-red: #e30611;
  --yelow: #ff9f0a;
  --aquamarine: rgba(34, 204, 216, 0.1);

  /* New colors */
  --black-bg: var(--absolute-700);
  --black-hover: var(--absolute-800);

  /* Border-radius variants */
  --radius-sx: 4px;
  --radius-s: 8px;
  --radius-m: 16px;
  --radius-l: 24px;
  --radius-xl: 32px;

  /* Box-shadows */
  --shadow-xl: 0px 25px 59px rgba(0, 0, 0, 0.2);
  --shadow-m: 0px 16px 24px 0px rgba(0, 0, 0, 0.15);

  /**
   * Fonts using while preloading Lato
   * Or if preloading failed
   */
  --fonts: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
    "Open Sans", "Helvetica Neue", sans-serif;

  --font-family-main: Roboto;

  --font-size-heading-first: 30px;
  --font-size-heading-second: 22px;
  --font-size-heading-third: 18px;

  /**
   * Margin for the product card
   * Is using in the product grids and sliders
   */
  --product-margin: 8px;

  /**
   * Height of the `Header` component
   */
  --header-height: 84px;

  /**
   * Margins between content and page body
   * On desktop does not make sense because numeric value is unknown
   * 0 here on desktop to not to violate calculations
   */
  --wrapper-margin: 0;
  --wrapper-padding: 120px;

  /**
   * Cards spacings and width
   */

  --card-spacing: 16px;

  --card-width: 282px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
:root {
    --product-margin: 7.5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --product-margin: 5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --header-height: 54px
}
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
:root {
    --wrapper-margin: 15px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-spacing: 24px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-width: calc((100% - (var(--card-spacing) * 2)) / 3)
}
  }
/* TODO: complete */
/* 1600 */
/* 1300 */
/* 992 */
/* 992 */
/* 768 */
/* 320 */
.QrCodeAccess {
  letter-spacing: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.QrCodeAccess--qr {
    padding: 8px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    grid-gap: 50px;
    gap: 50px;
    margin-top: 30px;
  }
.QrCodeAccess--qr .QrCodeAccessInfo__title {
      line-height: 1.4;
      font-size: 22px;
      font-weight: 500;
    }
.QrCodeAccess--landingQR {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    grid-gap: 10px;
    gap: 10px;
  }
.QrCodeAccess--landingQR .QrCodeAccessInfo {
      -webkit-box-ordinal-group: 2;
          -ms-flex-order: 1;
              order: 1;
    }
.QrCodeAccess--landingQR .QrCodeAccessInfo__title {
        line-height: 15.23px;
        font-size: 13px;
        font-weight: 500;
        text-align: center;
      }
.QrCodeAccess--landingQR .QRcode {
      -webkit-box-ordinal-group: 3;
          -ms-flex-order: 2;
              order: 2;
    }
.QrCodeAccess--landingQR .QrCodeAccess__download-info {
      -webkit-box-ordinal-group: 4;
          -ms-flex-order: 3;
              order: 3;
      font-size: 12px;
      font-weight: 600;
      color: rgba(61, 61, 61, 1);
      color: var(--light-black);
    }
.QrCodeAccess--crossSale {
    margin-top: 30px;
    margin-bottom: 15px;
    grid-gap: 25px;
    gap: 25px;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: end;
    padding: 0;
    -webkit-box-orient: inherit;
    -webkit-box-direction: inherit;
        -ms-flex-direction: inherit;
            flex-direction: inherit;
  }
@media only screen and (min-width: 768px) and (max-width: 991px) {
.QrCodeAccess--crossSale {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      margin-top: 0
  }
    }
.QrCodeAccess--crossSale .QrCodeAccessInfo {
        width: 65%;
      }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
.QrCodeAccess--crossSale .QrCodeAccessInfo {
          width: -webkit-fit-content;
          width: -moz-fit-content;
          width: fit-content
      }
        }
.QrCodeAccess--crossSale .QrCodeAccessInfo__title {
          line-height: 1.4;
          font-size: 22px;
          font-weight: 500;
        }
.QrCodeAccess__spinner {
    top: 150px;
    left: 50%;
    font-size: 25px;
  }
.QrCodeAccess--popup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    grid-gap: 50px;
    gap: 50px;
    padding-top: 35px;
  }
.QrCodeAccess--popup .QrCodeAccessInfo {
      text-align: center;
    }
.QrCodeAccess--popup .QrCodeAccessInfo__text {
        margin: 0;
      }
.QrCodeAccess--popup .QrCodeAccessInfo__title {
        font-size: 18px;
        font-weight: 600;
      }
.QrCodeAccess--popup .QrCodeAccessInfo span {
      display: none;
    }
.QrCodeAccess--fullPage {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 32px 35px 32px 66px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border: 1px solid rgba(0, 0, 0, 0.11);
    border: 1px solid var(--gray-border);
    border-radius: 24px;
    grid-gap: 20px;
    gap: 20px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
.QrCodeAccess--fullPage .QrCodeAccessInfo__title {
      font-size: 30px;
      font-weight: 600;
      line-height: 120%;
    }
[dir="ltr"] .QrCodeAccessInfo{
  text-align: left;
}
[dir="rtl"] .QrCodeAccessInfo{
  text-align: right;
}
.QrCodeAccessInfo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.QrCodeAccessInfo__text {
      margin-top: -2px;
      margin-left: 23px;
    }
[dir="ltr"] .QrCodeAccessInfo__title{
      text-align: left;
}
[dir="rtl"] .QrCodeAccessInfo__title{
      text-align: right;
}
.QrCodeAccessInfo__title {
      color: #22ccd8;
      color: var(--accent);
      margin-bottom: 8px;
    }
[dir="ltr"] .QrCodeAccessInfo__subtitle{
      text-align: left;
}
[dir="rtl"] .QrCodeAccessInfo__subtitle{
      text-align: right;
}
.QrCodeAccessInfo__subtitle {
      color: #333333;
      color: var(--dark-gray);
      font-size: 16px;
      line-height: 1.4;
    }
.BookingAccessTip {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #d9d9d9;
  border: 1px solid var(--light-gray);
  border-radius: 10px;
  padding: 11px 20px;
  color: #979797;
  color: var(--medium-gray);
  font-weight: 500;
  letter-spacing: 0;
}
.BookingAccessTip__text {
    margin-top: -2px;
    margin-left: 23px;
  }

:root {
  /* Design system colors */
  --tone-200: rgba(5, 5, 5, 0.06);
  --tone-300: rgba(0, 0, 0, 0.11);
  --tone-400: rgba(0, 0, 0, 0.28);
  --tone-500: rgba(0, 0, 0, 0.51);
  --tone-600: rgba(0, 0, 0, 0.65);
  --tone-700: rgba(0, 0, 0, 0.76);
  --tone-800: rgba(0, 0, 0, 0.86);
  --tone-900: rgba(0, 0, 0, 0.98);

  --absolute-100: #ffffff;
  --absolute-200: #f0f0f0;
  --absolute-300: #e3e3e3;
  --absolute-700: #3d3d3d;
  --absolute-800: #1f1f1f;
  --absolute-900: #050505;

  --aquamarine-500: rgba(1, 135, 144, 1);

  --red-100: rgba(228, 70, 86, 0.1);
  --red-500: rgba(211, 53, 69, 1);

  --blue-100: rgba(0, 122, 255, 0.1);
  --blue-400: rgba(0, 122, 255, 1);

  --text-secondary: rgba(0, 0, 0, 0.54);
  --text-disabled: rgba(0, 0, 0, 0.38);

  --white: white;
  --red: #ff3b2f;
  --light-red: #e44656;
  --transparent-red: rgba(228, 70, 86, 0.1);
  --light-footer-gray: #f1f1f1;
  --light-footer-bg-gray: #f8f8f8;
  --light-text-gray: rgba(0, 0, 0, 0.51);
  --text-black: rgba(0, 0, 0, 0.98);
  --text-black-title-popup: rgba(46, 46, 45, 1);
  --background-light-secondary: #f2f2f7;
  --popup-background: rgba(0, 0, 0, 0.28);
  --gray-border: rgba(0, 0, 0, 0.11);
  --gray-border-light: rgba(194, 194, 194, 0.5);
  --dark-gray: #333333;
  --light-gray: #d9d9d9;
  --medium-gray: #979797;
  --medium-dark-gray: #646464;
  --disabled-gray: #ebebeb;
  --disabled-dark-gray: #c2c2c2;
  --placeholder-gray: #f1f1f1;
  --white: white;
  --black: black;
  --light-black: rgba(61, 61, 61, 1);
  --main: #5648f8;
  --blue: rgba(0, 122, 255, 1);
  --link-blue: rgba(0, 106, 219, 1);
  --medium-main: #c1bbff;
  --light-main: #e7eafb;
  --accent: #22ccd8;
  --light-cookie-accent: rgba(233, 250, 251, 1);
  --light-accent: rgba(34, 204, 216, 0.2);
  --light-background-accent: rgba(144, 247, 254, 0.08);
  --lightest-accent: #b3eef2;
  --mts-red: #e30611;
  --yelow: #ff9f0a;
  --aquamarine: rgba(34, 204, 216, 0.1);

  /* New colors */
  --black-bg: var(--absolute-700);
  --black-hover: var(--absolute-800);

  /* Border-radius variants */
  --radius-sx: 4px;
  --radius-s: 8px;
  --radius-m: 16px;
  --radius-l: 24px;
  --radius-xl: 32px;

  /* Box-shadows */
  --shadow-xl: 0px 25px 59px rgba(0, 0, 0, 0.2);
  --shadow-m: 0px 16px 24px 0px rgba(0, 0, 0, 0.15);

  /**
   * Fonts using while preloading Lato
   * Or if preloading failed
   */
  --fonts: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
    "Open Sans", "Helvetica Neue", sans-serif;

  --font-family-main: Roboto;

  --font-size-heading-first: 30px;
  --font-size-heading-second: 22px;
  --font-size-heading-third: 18px;

  /**
   * Margin for the product card
   * Is using in the product grids and sliders
   */
  --product-margin: 8px;

  /**
   * Height of the `Header` component
   */
  --header-height: 84px;

  /**
   * Margins between content and page body
   * On desktop does not make sense because numeric value is unknown
   * 0 here on desktop to not to violate calculations
   */
  --wrapper-margin: 0;
  --wrapper-padding: 120px;

  /**
   * Cards spacings and width
   */

  --card-spacing: 16px;

  --card-width: 282px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
:root {
    --product-margin: 7.5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --product-margin: 5px
}
  }
@media only screen and (max-width: 767px) {
:root {
    --header-height: 54px
}
  }
@media only screen and (min-width: 768px) and (max-width: 991px),only screen and (max-width: 767px) {
:root {
    --wrapper-margin: 15px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-spacing: 24px
}
  }
@media only screen and (min-width: 992px) {
:root {
    --card-width: calc((100% - (var(--card-spacing) * 2)) / 3)
}
  }
/* TODO: complete */
/* 1600 */
/* 1300 */
/* 992 */
/* 992 */
/* 768 */
/* 320 */
.ProductCardLabel {
  font-size: 13px;
  font-weight: 500;
  line-height: 15px;
  border-radius: 3px;
  padding: 3px 5px;
  background: white;
  background: var(--white);
  color: black;
  color: var(--black);
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.ProductCardLabel--accent {
  background: #22ccd8;
  background: var(--accent);
  color: white;
  color: var(--white);
}
.ProductCardLabel--noBackground {
  background: none;
  font-size: 13px;
  font-weight: 500;
  line-height: 15px;
  color: #22ccd8;
  color: var(--accent);
  padding: 0;
}
@media only screen and (max-width: 767px) {
.ProductCardLabel--noBackground {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px
}
  }
.ProductCardLabel--gray {
  background: #646464;
  background: var(--medium-dark-gray);
  color: white;
  color: var(--white);
}
.ProductCardLabel--mts {
  background: #e30611;
  background: var(--mts-red);
  color: white;
  color: var(--white);
}
.ProductCardLabel--popular {
  background: #ff9f0a;
  background: var(--yelow);
  color: white;
  color: var(--white);
}


/*# sourceMappingURL=pages-Booking.c1ecd566.chunk.css.map*/