body.menu-open {
  overflow: hidden;
  width: 100%;
}

a,
a:link,
a:hover,
a:focus {
  color: #EB2437 !important;
}

a.btn-primary {
  color: #fff !important;
  transition: all ease-in-out 0.3s !important;
  background-color: #062841;
}
a.btn-primary:hover {
  background: rgba(6, 40, 65, 0.8) !important;
}

a.btn-secondary {
  color: #fff !important;
  transition: all ease-in-out 0.3s !important;
  background-color: #EB2437;
}
a.btn-secondary:hover {
  background: rgba(235, 36, 55, 0.8) !important;
}

.text-primary {
  color: #062841 !important;
}

.text-secondary {
  color: #EB2437 !important;
}

.bg-primary {
  background-color: #062841 !important;
}

.bg-secondary {
  background-color: #EB2437 !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: bold;
  color: #062841 !important;
}

p {
  color: #062841 !important;
}

@media (min-width: 1400px) {
  #mainNav .container,
  footer .container {
    max-width: 1600px;
  }
}
#mainNav .container {
  margin: 0;
  width: 100vw;
}
@media (min-width: 572px) {
  #mainNav .container {
    margin-right: auto;
    margin-left: auto;
  }
}
.navbar-toggler {
  position: relative;
  top: 0;
  right: 0;
  transition: all 0.3s ease-in-out;
  z-index: 100001;
  background: transparent;
  border: none;
}
.navbar-toggler:focus {
  box-shadow: initial;
}
.navbar-toggler.shrink {
  padding: 5px 0;
  top: 27px;
}
.navbar-toggler .navTrigger {
  cursor: pointer;
  left: 0;
  position: relative;
  right: 0;
  transition: all 0.3s ease-in-out;
  width: 30px;
  z-index: 999999;
}
.navbar-toggler .navTrigger:focus {
  outline: none !important;
}
.navbar-toggler .navTrigger i {
  background-color: #fff;
  border-radius: 2px;
  content: "";
  display: block;
  height: 4px;
  transition: background-color 0.3s ease-in-out;
  width: 100%;
}
.navbar-toggler .navTrigger i:first-child {
  animation: outT 0.8s backwards;
  animation-direction: reverse;
}
.navbar-toggler .navTrigger i:nth-child(2) {
  animation: outM 0.8s backwards;
  animation-direction: reverse;
  margin: 5px 0;
}
.navbar-toggler .navTrigger i:nth-child(3) {
  animation: outBtm 0.8s backwards;
  animation-direction: reverse;
}
.navbar-toggler.active .navTrigger i {
  background-color: #fff;
}
.navbar-toggler.active .navTrigger i:first-child {
  animation: inT 0.8s forwards;
}
.navbar-toggler.active .navTrigger i:nth-child(2) {
  animation: inM 0.8s forwards;
}
.navbar-toggler.active .navTrigger i:nth-child(3) {
  animation: inBtm 0.8s forwards;
}

@keyframes inM {
  50% {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(45deg);
  }
}
@keyframes outM {
  50% {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(45deg);
  }
}
@keyframes inT {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(9px) rotate(0deg);
  }
  to {
    transform: translateY(9px) rotate(135deg);
  }
}
@keyframes outT {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(9px) rotate(0deg);
  }
  to {
    transform: translateY(9px) rotate(135deg);
  }
}
@keyframes inBtm {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-9px) rotate(0deg);
  }
  to {
    transform: translateY(-9px) rotate(135deg);
  }
}
@keyframes outBtm {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-9px) rotate(0deg);
  }
  to {
    transform: translateY(-9px) rotate(135deg);
  }
}
#logo-mobile {
  display: block;
  position: relative;
  z-index: 1031;
  width: 150px;
}
#logo-mobile a {
  display: block;
}

#mainNav.navbar {
  padding-top: 1rem;
  padding-bottom: 1rem;
  background-color: rgba(11, 39, 56, 0.7254901961) !important;
  transition: all ease-in-out 0.3s !important;
}
#mainNav.navbar.active {
  background: #0b2738 !important;
}
#mainNav.navbar .navbar-toggler {
  margin-left: auto;
}
#mainNav.navbar #logo {
  display: none;
}
#mainNav.navbar a:hover {
  color: #EB2437 !important;
}
#mainNav.navbar ul.navbar-nav {
  padding-top: 2rem;
}
@media (min-width: 992px) {
  #mainNav.navbar ul.navbar-nav {
    padding-top: initial;
  }
  #mainNav.navbar #logo-mobile {
    display: none;
  }
  #mainNav.navbar #logo {
    display: flex;
    height: 4rem;
    position: relative;
    transition: all ease-in-out 0.3s !important;
  }
  #mainNav.navbar #logo a {
    overflow: hidden;
    width: 150px;
    display: inline-block;
  }
  #mainNav.navbar #logo a svg {
    width: 288px;
  }
  #mainNav.navbar #logo a svg g#bds path {
    fill: #fff;
    transition: all ease-in-out 0.3s !important;
  }
  #mainNav.navbar #logo a svg g#subtitle {
    fill: #fff;
    transition: all ease-in-out 0.3s !important;
    opacity: 1;
    display: none;
  }
  #mainNav.navbar.navbar-shrink {
    background: #fff !important;
  }
  #mainNav.navbar.navbar-shrink #logo {
    height: 2rem;
  }
  #mainNav.navbar.navbar-shrink #logo g#bds path {
    fill: #062841;
  }
  #mainNav.navbar.navbar-shrink #logo g#subtitle {
    opacity: 0;
  }
  #mainNav.navbar.navbar-shrink .nav-item a {
    color: #062841 !important;
    transition: all ease-in-out 0.3s !important;
  }
  #mainNav.navbar.navbar-shrink .nav-item a:hover {
    color: #EB2437 !important;
  }
}
@media (min-width: 1400px) {
  #mainNav.navbar #logo a {
    width: 100%;
  }
  #mainNav.navbar #logo a svg {
    width: initial;
  }
  #mainNav.navbar #logo a svg g#bds path {
    fill: #fff;
    transition: all ease-in-out 0.3s !important;
  }
  #mainNav.navbar #logo a svg g#subtitle {
    fill: #fff;
    transition: all ease-in-out 0.3s !important;
    opacity: 1;
    display: block;
  }
}

.nav-item a {
  font-size: 1.2rem !important;
  color: #fff !important;
  font-weight: normal !important;
}
.nav-item a svg {
  width: 2rem;
  height: 2rem;
}

section.bg-primary h1,
section.bg-primary h2,
section.bg-primary h3,
section.bg-primary h4,
section.bg-primary h5,
section.bg-primary h6,
section.bg-primary p,
section.bg-primary li, section.bg-secondary h1,
section.bg-secondary h2,
section.bg-secondary h3,
section.bg-secondary h4,
section.bg-secondary h5,
section.bg-secondary h6,
section.bg-secondary p,
section.bg-secondary li {
  color: #fff !important;
}
section.bg-primary ul, section.bg-secondary ul {
  padding: 0;
}
section.bg-primary ul li, section.bg-secondary ul li {
  list-style-type: none;
  margin-bottom: 1rem;
  margin-left: 2.5rem;
  text-indent: -2.5rem;
}
section.bg-primary ul li:before, section.bg-secondary ul li:before {
  content: "\f14a";
  font-family: "Font Awesome 6 Free";
  font-weight: bold;
  margin-right: 1rem;
  font-size: 1.75rem;
  top: 0.25rem;
  position: relative;
}
section.bg-primary.bg-primary hr, section.bg-secondary.bg-primary hr {
  border-color: #EB2437 !important;
}
section.bg-primary.bg-primary li:before, section.bg-secondary.bg-primary li:before {
  color: #EB2437;
}
section.bg-primary.bg-secondary hr, section.bg-secondary.bg-secondary hr {
  border-color: #062841 !important;
}
section.bg-primary.bg-secondary li:before, section.bg-secondary.bg-secondary li:before {
  color: #fff;
}

@media (min-width: 992px) {
  header.masthead {
    height: 80vh;
  }
}
.navbar .nav-item a:last-child {
  padding-right: 0 !important;
}

header {
  position: relative;
  overflow: hidden;
}
header .wrapper {
  width: 100%;
  margin-top: auto;
  background: rgba(11, 39, 56, 0.3);
  padding-top: 4rem;
  padding-bottom: 4rem;
  position: relative;
  z-index: 1;
}
header .wrapper h1,
header .wrapper p.subtitle {
  color: #fff !important;
}
header .wrapper h1 {
  font-weight: 900;
  text-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.7);
  text-transform: uppercase;
}
header .wrapper h1 span {
  color: #FF5263;
}
header .wrapper h1 + p.subtitle {
  font-size: 1.5rem;
  text-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.7);
}
header:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: url("../../assets/img/overlay-blue.png");
  background-size: cover;
  width: 100%;
  height: 100%;
  opacity: 0.2;
  z-index: 0;
}

section#ueber-uns p {
  font-size: 1.4rem;
}
section#events ul {
  margin: 0 auto;
  width: fit-content;
  display: flex;
  flex-direction: column;
}
section#events ul li {
  font-size: 1.3rem;
}
section#vorteile svg {
  color: #EB2437 !important;
  width: 5rem;
  height: 5rem;
}
section#kontakt svg {
  color: #EB2437 !important;
  width: 3rem;
  height: 3rem;
}
section#kontakt a {
  color: #062841 !important;
  text-decoration: none;
}
section#kontakt a:hover {
  color: #EB2437 !important;
}

footer .container {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
footer hr {
  max-width: 100%;
  border-color: rgba(0, 0, 0, 0.1);
}
footer .logo-footer {
  width: 240px;
}
footer .nav {
  display: flex;
  justify-content: right;
}
footer .nav .nav-item a {
  color: #062841 !important;
  font-family: sans-serif;
  transition: all ease-in-out 0.3s !important;
}
footer .nav .nav-item a:hover {
  color: #EB2437 !important;
}

main {
  padding-top: 10rem;
  padding-bottom: 5rem;
}

.backdrop-mobile-menu {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(3px);
  z-index: 998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  cursor: pointer;
}
.backdrop-mobile-menu.active {
  opacity: 1;
  visibility: visible;
}

.impressum main,
.datenschutz main {
  margin: 0 auto;
  width: 100%;
  max-width: 800px;
}