@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@400;700&display=swap');

:root {
  --site-background-color: #cecdd6;
  --page-background-color: #fff;
  --header-background-color: #fff;
  --sidebar-width: 300px;
  --navigation-background-color: #553b63;
  --navigation-text-color: #fff;
  --footer-background-color: #2c232d;
  --footer-title-color: #fff;
  --footer-text-color: #fff;
  --copyright-background-color: #1e171f;
  --copyright-text-color: #666;
  --default-background-color: #d1cbd2;
  --default-background-color-hover: #e4e4e4;
  --default-background-color-active: #ccc;
  --default-border-color: #666;
  --default-line-height: 150%;
  --default-text-font: "Fira Sans", Arial, "Helvetica Neue", Helvetica, sans-serif;
  --default-text-color: #000;
  --default-text-size: 15px;
  --default-title-color: #333;
  --default-title-border-color: #f0f0f0;
  --default-notice-background-color: #f0f0f0;
  --default-notice-text-color: #333;
  --primary-background-color: #3ba5c6;
  --primary-background-color-hover: #4aaac7;
  --primary-background-color-active: #3596b3;
  --primary-text-color: #fff;
  --primary-notice-background-color: #5bc0de;
  --primary-notice-text-color: #000;
  --success-background-color: #91C231;
  --success-background-color-hover: calc(var(--success-background-color) * 1.1);
  --success-background-color-active: calc(var(--success-background-color) * 0.9);
  --success-border-color: #91C231;
  --success-text-color: #fff;
  --success-notice-background-color: #d6eca6;
  --success-notice-text-color: #567d00;
  --warning-border-color: #aa0000;
  --warning-notice-background-color: #ffcc66;
  --warning-notice-text-color: #aa0000;
  --danger-border-color: #c44;
  --danger-notice-background-color: #fcc;
  --danger-notice-text-color: #c44;
  --breadcrumbs-background-color: #dbd5dc;
  --breadcrumbs-text-color: #000;
  --breadcrumbs-border-color: transparent;
  --table-striped-row-background-odd: #f9f9f9;
  --table-striped-row-background-even: #fff;
  --table-row-hover-background: #ececec;
  --border-radius: 4px;
  --input-background-color: #f4f3f5;
  --input-text-color: #000;
  --link-text-color: #d61212;
  --shadow-color: rgba(0, 0, 0, 0.5);
  --whitespace-color: #fff;
  --gutter-size: 1rem;
}
@media (max-width: 768px) {
  :root {
    --default-text-size: calc(var(--default-text-size) - 2px);
  }
}
@media (max-width: 992px) {
  :root {
    --default-text-size: calc(var(--default-text-size) - 1px);
  }
}