/* COLOR */
:root {
  --blue-zentrum: #243E8C;
  --pink-zentrum: #BA1F31;
  --blue3-zentrum: #ADD6FF;
  --white: #FFFFFF;
  --black: #000000;
}

@font-face {
  font-family: "MozillaText";
  font-weight: 700;
  src: url("/assets/fonts/MozillaText-Bold.ttf");
  font-display: swap;
}

@font-face {
  font-family: "MozillaText";
  font-weight: 600;
  src: url("/assets/fonts/MozillaText-SemiBold.ttf");
  font-display: swap;
}

@font-face {
  font-family: "MozillaText";
  font-weight: 400;
  src: url("/assets/fonts/MozillaText-Regular.ttf");
  font-display: swap;
}

body {
  font-family: "MozillaText";
  font-weight: 400;
  font-size: calc(16 / 16 * 1rem);
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
.zentrum-button {
  font-family: "MozillaText";
  font-weight: 700;
}

h1,
.h1 {
  font-size: calc(80 / 16 * 1rem);
}

h2,
.h2 {
  font-size: calc(44 / 16 * 1rem);
}

h3,
.h3 {
  font-size: calc(26 / 16 * 1rem);
}

h4,
.h4 {
  font-size: calc(24 / 16 * 1rem);
}

h5,
.h5 {
  font-size: calc(20 / 16 * 1rem);
}

.zentrum-button,
.zentrum-footer,
.zentrum-header {
  font-size: calc(16 / 16 * 1rem);
  color: var(--white);
}

/* Navbar */
.zentrum-nav {
  background-color: var(--blue-zentrum);
  height: calc(104 / 16 * 1rem);
}

.navbar-brand {
  margin: 0rem;
}

.zentrum-logo {
  height: calc(20 / 16 * 1rem);
  width: auto;
}

.header-logo-wrapper, .language-picker-wrapper {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.header-logo-wrapper {
  gap: 1rem;
}

.logo-split {
  height: calc(56 / 16 * 1rem);
  width: 0rem;

  border: 1px solid var(--white);
}

.zentrum-header .nav-link {
  color: var(--white) !important;
}