:root {
  --groen: #282;
  --groen-hover: rgb(6, 65, 6);
  --groen-active: rgb(59, 168, 59); 
  --zwart: #383838;
  --groen-rgb: rgb(11, 82, 4);
  --groen-bg: rgba(53, 184, 2, 0.2);
  --zwart-rgb: rgb(56, 56, 56);
  --zwart-bg: rgba(56, 56, 56, 0.2);
  --bs-success-rgb: rgb(13, 46, 0);
  --bs-btn-bg: var(--groen);
  --bs-btn-color: #fff;
  --bs-btn-border-color: var(--groen-bg);
  --bs-btn-hover-bg: var(--groen-hover);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-border-color: var(--groen-bg);
  --bs-btn-active-bg: var(--groen-active);
  --bs-btn-active-color: #fff;
  --bs-btn-active-border-color: var(--groen-active);
  --bs-btn-focus-shadow-rgb: var(--groen-rgb);
  --bs-btn-focus-shadow: 0 0 0 0.2rem rgba(var(--groen-rgb), 0.5);
  --bs-primary: var(--groen);
  --bs-primary-rgb: var(--groen-rgb);
  --bs-link-color: var(--groen);
  --bs-link-hover-color: var(--groen-hover);
  --bs-nav-pills-link-active-bg: var(--groen-active);
  --bs-link-color-rgb: var(--groen-rgb);
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e")
}

a {
  color: var(--groen);
}

a:hover {
  color: var(--groen-hover);
}

@font-face {
  font-family: droidSans;
  src: url("../font/DroidSans.ttf") format("truetype");
}

@font-face {
  font-family: droidSansBold;
  src: url("../font/DroidSans-Bold.ttf") format("truetype");
}

body {
  font-family: 'droidSans', sans-serif;
  font-size: 13px;
  line-height: 22px;
  font-weight: 400;
  margin-right: 0px;
}

.backgroundLogin {
  background-color: #fff;
  background-image: url('../images/background.jpg');
  background-position: center 86px;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 585px;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  background-color: var(--groen);
}
.btn-primary {
  background-color: var(--groen);
  border-color: var(--groen);
}
.btn-primary:hover {
  background-color: var(--zwart);
  border-color: var(--groen);
}

.form-switch {
  display: flex !important;
}

.form-check-input:checked {
  background-color: var(--groen) !important;
  border-color: var(--zwart) !important;
}

.tab-content {
  border-left: 1px solid var(--bs-border-color);
  border-right: 1px solid var(--bs-border-color);
  border-bottom: 1px solid var(--bs-border-color);
  padding: 10px;
}

.nav-tabs {
  margin-bottom: 0;
}