:root {
  /* cores padrão */
  /* --color-01: #964b00; */
  --color-02: #b51734;
  --color-03: #fff;
  --color-04: #262859;
  --color-05: #c1282f;
  --color-06: #f5ea2f;
  --color-07: #fee9d6;
  --color-08: #fff2eb;
  --color-09: #f1f175;
  --color-10: #0ec50e;

  --color-text-footer: #00000099;
  --color-text-navbar: #00000099;

  /* Altura menu */
  --navbar-size: 6rem;
  --navbar-logo-size: 6rem;

  /* font-family padrão */

  --font-size-body: 10px;
  --font-family: "Cinzel", sans-serif;
  --font-weight: 400;
  --font-size-titulo: 2.2rem;
  --font-size-texto-blog: 1.6rem;
  --min-width-body: 360px;
  --size-width-search: 95%;

  --width-xl: 1140px;
  --width-lg: 940px;
  --width-md: 720px;
  --width-sm: 540px;
  --width-xs: 340px;

  --width-size: var(--width-xl);
}

@media (min-width: 1400px) {
  :root {
    --width-size: var(--width-xxl) !important;
  }
}

@media (min-width: 1200px) {
  :root {
    --width-size: var(--width-xl) !important;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  :root {
    --width-size: var(--width-xl) !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  :root {
    --width-size: var(--width-lg) !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  :root {
    --width-size: var(--width-md) !important;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  :root {
    --width-size: var(--width-sm) !important;
  }
}

@media (max-width: 575px) {
  :root {
    --width-size: var(--width-xs) !important;
  }
}