@import url('bebas-neue.css');
@import url('supreme.css');
@import 'components/card.css';
@import 'components/button.css';
@import 'components/input.css';
@import 'components/barbell.css';
@import 'components/table.css';
@import 'components/chart.css';

body {
  background-color: #eef0f2;
  margin: 0;
  font-family: 'Supreme-Regular', sans-serif !important;
}

/* 
 * Type Scale with Base: 16px, Ratio: 1.25
 * Generated with TypeScale Generator
 */
:root {
  --base-font-size: 16px;
  --scale-ratio: 1.25;
  --font-family: Supreme-Regular;
  --h1-size: 49px;
  --h1-line-height: 110%;
  --h1-letter-spacing: -2%;
  --h2-size: 39px;
  --h2-line-height: 110%;
  --h2-letter-spacing: -2%;
  --h3-size: 31px;
  --h3-line-height: 130%;
  --h3-letter-spacing: -1.5%;
  --h4-size: 25px;
  --h4-line-height: 130%;
  --h4-letter-spacing: -1.5%;
  --h5-size: 20px;
  --h5-line-height: 150%;
  --h5-letter-spacing: -0.5%;
  --h6-size: 18px;
  --h6-line-height: 150%;
  --h6-letter-spacing: 0%;
  --body-lg-size: 17px;
  --body-lg-line-height: 150%;
  --body-lg-letter-spacing: 0.5%;
  --body-size: 16px;
  --body-line-height: 150%;
  --body-letter-spacing: 0.5%;
  --link-size: 15px;
  --link-line-height: 150%;
  --link-letter-spacing: 0.5%;
  --caption-size: 14px;
  --caption-line-height: 160%;
  --caption-letter-spacing: 0.5%;
}

h1 {
  font-size: var(--h1-size);
  line-height: var(--h1-line-height);
  letter-spacing: var(--h1-letter-spacing);
  font-family: 'BebasNeue-Regular', sans-serif !important;
}

h2 {
  font-size: var(--h2-size);
  line-height: var(--h2-line-height);
  letter-spacing: var(--h2-letter-spacing);
  font-family: 'BebasNeue-Regular', sans-serif !important;
}

h3 {
  font-size: var(--h3-size);
  line-height: var(--h3-line-height);
  letter-spacing: var(--h3-letter-spacing);
  font-family: 'BebasNeue-Regular', sans-serif !important;
}

h4 {
  font-size: var(--h4-size);
  line-height: var(--h4-line-height);
  letter-spacing: var(--h4-letter-spacing);
  font-family: 'BebasNeue-Regular', sans-serif !important;
}

h5 {
  font-size: var(--h5-size);
  line-height: var(--h5-line-height);
  letter-spacing: var(--h5-letter-spacing);
  font-family: 'BebasNeue-Regular', sans-serif !important;
}

h6 {
  font-size: var(--h6-size);
  line-height: var(--h6-line-height);
  letter-spacing: var(--h6-letter-spacing);
  font-family: 'BebasNeue-Regular', sans-serif !important;
}

.body-lg {
  font-size: var(--body-lg-size);
  line-height: var(--body-lg-line-height);
  letter-spacing: var(--body-lg-letter-spacing);
}

body {
  font-size: var(--body-size);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
}

link {
  font-size: var(--link-size);
  line-height: var(--link-line-height);
  letter-spacing: var(--link-letter-spacing);
}

caption {
  font-size: var(--caption-size);
  line-height: var(--caption-line-height);
  letter-spacing: var(--caption-letter-spacing);
}
