/* RESET CSS */
#html-body * {
  box-sizing: border-box;
}

html { 
  scroll-behavior: smooth; 
}

html .page-wrapper *::before,
html .page-wrapper *::after {
  content: none;
  display: none;
}

#html-body {
  .page-wrapper {
    background-color: var(--sand-light);
    position: relative;
  }

  .navigation,
  .breadcrumbs,
  .page-header .header.panel,
  .page-wrapper > .widget,
  .page-wrapper > .page-bottom,
  .page-bottom-outer,
  .block.category.event,
  .top-container,
  .page-main,
  .recipe_detail_page,
  .normal_produt_page,
  .footer-layout,
  .footer-bottom-banner-layout,
  .products-grid {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
  }

  &.catalog-category-view .page-main,
  &.page-layout-product-full-width .page-main,
  &.page-layout-category-full-width .page-main,
  &.page-layout-cms-full-width .page-main {
    max-width: unset;
  }

  html, body, applet, object, iframe,
  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  a, abbr, acronym, address, big, cite, code,
  del, dfn, em, img, ins, kbd, q, s, samp,
  small, strike, strong, sub, sup, tt, var,
  b, u, i, center,
  dl, dt, dd, ol, ul, li,
  fieldset, form, label, legend,
  table, caption, tbody, tfoot, thead, tr, th, td,
  article, aside, canvas, details, embed,
  figure, figcaption, footer, header, hgroup,
  main, menu, nav, output, ruby, section, summary,
  time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    color: var(--earth-dark);
    font: inherit;
  }

  /* HTML5 display roles */
  article, aside, details, figcaption,
  footer, header, hgroup, main, menu, nav, section {
    display: block;
  }

  body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: var(--Georgia);
  }

  ol, ul {
    list-style: none;
  }

  blockquote, q {
    quotes: none;
  }

  em {
    font-style: italic;
  }

  blockquote::before, blockquote::after,
  q::before, q::after {
    content: '';
    content: none;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
  }

  img, video {
    max-width: 100%;
    height: auto;
    display: block;
  }

  button, input, select, textarea {
    font: inherit;
    margin: 0;
  }

  legend,
  legend span {
    text-transform: unset;
  }

  a {
    text-decoration: none;
    color: inherit;
  }

  a:hover,
  a:visited,
  a:focus {
    color: inherit;
  }

  /* DEVELOPER TOOLS */
  .boxer > * {
    border: 1px dotted red;
    background: rgba(255, 0, 0, 0.1);
    padding: 4px;
  }

  .boxer > * > * {
    border: 1px dotted red;
    background: rgba(255, 0, 0, 0.1);
    padding: 4px;
  }

  .boxer > * > * > * {
    border: 1px dotted red;
    background: rgba(255, 0, 0, 0.1);
    padding: 4px;
  }

  .boxer > * > * > * > * {
    border: 1px dotted red;
    background: rgba(255, 0, 0, 0.1);
    padding: 4px;
  }
}