@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/public/static/fonts/poppins-v22-latin_latin-ext-regular.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/public/static/fonts/poppins-v22-latin_latin-ext-700.woff2") format("woff2");
}

:root {
  --bb-blau: #1b55b4;
  --bb-gruen: #89a628;
  --bb-orange: #ef7d0b;
  --bb-text: #333333;
  --bb-bg-alt: #f5f5f5;
}

body {
  font-family: "Poppins", "Helvetica Neue", sans-serif;
  color: var(--bb-text);
  background: var(--bb-bg-alt);
}

a {
  color: var(--bb-blau);
  text-decoration-color: var(--bb-blau);
}
a:hover {
  color: var(--bb-orange);
}

h1, h2, h3, h4 {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  color: var(--bb-text);
}

.wrap {
  border-radius: 0.375rem;
  padding: 2rem;
}

.header {
  border-bottom-color: var(--bb-bg-alt);
  margin-bottom: 2rem;
}
.header .logo img {
  max-width: 200px;
}

input[type="text"], input[type="email"], input[type="password"], select {
  border-radius: 0.375rem;
  font-family: "Poppins", sans-serif;
}
input:focus {
  border-color: var(--bb-blau);
}

.button {
  background: var(--bb-orange);
  border-radius: 0.375rem;
  font-weight: 700;
}
.button:hover {
  background: var(--bb-blau);
}
.button.button-outline {
  border-color: var(--bb-blau);
  color: var(--bb-blau);
}
.button.button-outline:hover {
  background-color: var(--bb-blau);
}

footer.container a:hover {
  color: var(--bb-orange);
}