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

:root {
  --font-base: 'Roboto Slab', serif;
  --font-heading: 'Roboto Slab', serif;  /* heading same as base */
  --font-base-weight: 400;
  --font-heading-weight: 700;
}

body {
  font-family: var(--font-base);
  font-weight: var(--font-base-weight);
}

h1,
.h1fontstyle {
  font-family: var(--font-heading);
  font-weight: var(--font-heading-weight);
}

h2,
.h2fontstyle {
  font-family: var(--font-base);
  font-weight: 500;
}

#mainNav .navbar-brand {
  font-family: var(--font-heading);
}