@charset "UTF-8";
/* GLOBAL STYLES*/
body {font-family: din-2014, sans-serif; font-style: normal; font-weight: 300; color: #666}
a {text-decoration: none !important;color: #666;} 
a:hover, a:active, a.active {color: #005191 !important;} 
.sprungstelle, .sprungstelle:hover {color: #fff !important;}


/* DESKTOP NAVIGATION*/
.navbar-collapse {flex-basis: auto}


/* Animierter Hamburger */
.navbar-toggler:focus, .navbar-toggler:hover {border: none !important; outline: none !important; box-shadow: none var(--bs-navbar-toggler-focus-width);}
 button:focus {outline: 0;}
.hamburger {border: none !important; outline: none !important; padding: 0px}
.hamburger-box {height: 18px;}
.hamburger-inner, .hamburger-inner::after, .hamburger-inner::before {width: 35px; height: 1px}
.nav-underline {--bs-nav-underline-border-width: 0rem;}


/*SEITENSTRUKTUR*/
body {position:relative; max-width: 100%; margin: 0 auto; background-color: white; overflow-x: hidden; min-height: 100%;}
.hero {padding: 64px 24px 0px 24px; width: 100%; height: 240px; overflow: hidden }
.hero-home {padding: 0px 0px 0px 0px; width: 100%; height: 100%; overflow: hidden }
.home-slider {padding: 0px 0px 0px 0px}

.background {position: fixed;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
  z-index: -1;
}
.bg-window {}/* height: 100vh; */
header {background: #fff}

/* NAVIGATION */ 
header .navbar {z-index: 1000; padding: 20px 0px 20px 0px; width: 100%; background: #fff;} 
header .navbar-brand {font-size: 1rem; font-weight: 100}
header .dropdown-toggle::after {display: none !important; content: "" !important;}
header .navbar-nav .dropdown-menu { --bs-dropdown-spacer: 0rem; --bs-dropdown-padding-x: 0rem; }
header .navbar-nav .dropdown-menu .dropdown-item { font-size: 0.8rem; --bs-dropdown-padding-x: 10rem; }
header .dropdown-menu {transform: translate3d(0px, 0px, 0px) !important; top: 0px; left: 0px; border: none; will-change: none; border-radius: 0px;}

/* Slider */
.hero-home .tobottom {text-align: center;position: relative; bottom: 0px;background-color: transparent;}
.arrow {cursor: pointer; display: block; margin: 0 auto; width: 100px; color: #fff;}
.home-Slider .tobottom div.text {font-size: 1.3rem; line-height: 1.3rem}
.owl-carousl {width: 100vw;}

/* Bild Navigation Homepage */ 
#bild-nav {outline: none}
#bild-nav a { height: auto; font-size: 1.2rem; overflow: hidden; position: relative; display: inline-block;} 
#bild-nav a:hover .wrap {background-color: rgba(0,0,0,0.2)}
.wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%;  opacity: 1;
  transition: .5s ease; background-color: rgba(0,0,0,0.0); z-index: 1;}
.bild-overlay {position: absolute;
  top: 50%;
  left: 50%;
  opacity: 1;
  transition: .5s ease;
  font-size: 1.5rem;	
  color: #fff;
  transform: translate(-50%, -50%);	
  z-index: 2;		
}
/* Bild Gallery */
.lg-backdrop {background-color: rgba(0,0,0,0.7) !important;}
.lg-prev, .lg-next, .lg-prev:hover, .lg-next:hover {background-color: transparent !important; color: #fff !important}
.lg-close, .lg-zoom-in, .lg-close:hover, .lg-zoom-in:hover  {background-color: transparent !important; color: #fff !important}
.lg-content {bottom: 47px !important;}
/* Thumb Gallery */
.img-container {padding-bottom: 0.35rem}
.lg-item {position: relative; display: inline-block; overflow: hidden; cursor: zoom-in;}
.lg-item:hover .lg-overlay, .lg-item:hover .overlay-wrap {opacity: 1;}
.overlay-wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%;  opacity: 0;
  transition: .5s ease; background-color: rgba(0,0,0,0.2);}

.lg-overlay {position: absolute;
  top: 80%;
  left: 50%;
  opacity: 0;
  transition: .5s ease;
  font-size: 1.0rem;	
  color: #fff;
  transform: translate(-50%, -20%);	
}



/* MAIN */
section#datenschutz h2, section#datenschutz h3, section#datenschutz h4  {margin-top: 1.5rem}
main h1 {padding-bottom: 20px; padding-top: 10px}
main {position:relative;}


@keyframes text-block {from {left: -500px;} to {left: 0px;}}

.rs-text-block {position: relative; top: 150px; left: -500px; color: #fff; float: left; width: 100%;overflow: inherit;z-index: 10000;
animation-name: text-block;
animation-duration: 2s;
animation-fill-mode: forwards;
transition: all 0.3s ease;
transition-property: all;
transition-duration: 0.3s;
transition-timing-function: ease;
transition-delay: 2s;
}
.rs-text-block div.sublines {font-size: 1.6rem; padding: 15px 50px 0px 20px; color: #fff}
.rs-text-block div.sublines a {display: block; color: #fff; width: max-content}
.rs-text-block div.sublines a:hover {color: #fff}
.rs-text-block .headline {display: block; font-size: 2.7rem; line-height: 1.0em; color: #fff; padding: 0px 0px 0px 20px;
transition-property: all;
transition-duration: 0.3s;
transition-timing-function: ease;
transition-delay: 0s;
}
/* Störer */
.rs-job-box {position: absolute; bottom: 100px; right: 100px; color: #fff; overflow: inherit; z-index: 10000;}
.rs-job-box .stoerer {background-color: #CA4004; font-size: 1.3rem; border-radius: .80rem}
.rs-job-box a, .rs-job-box a:hover {color: #fff !important;}

/* Formular */
.formular h2 {color: #E9500E !important; padding-bottom: 50px; font-size: 2.4rem }
.form-control {border: 1px solid #E9500E; border-radius: 0rem;} 
.kontakt-box {padding-top: 3rem}
.kontakt-box h4, .kontakt-box h3 {color: #E9500E; font-weight: 700}
.kontakt-box h3 {font-size: 1.5rem}
.kontakt-box p.lead {font-weight: 700; font-size: 1.5rem; color: rgba(0,0,0,0.80)}
.kontakt-box p.normal {font-size: 1.3rem ;color: rgba(0,0,0,0.80)}

a.pm_link {color: #666}
a.pm_link:before {font: normal normal normal 0.875rem FontAwesome; content:"\f0a9"; padding-right: 5px}


/* Login */
#login {padding-top: 40px}
/* FOOTER */
footer {padding: 24px; background: #fff}
.social-media {background-color: rgba(0,0,0,0.10) }
footer h3 {font-size: 1.25rem; font-weight: 200}

@media (min-width: 576px) {
.lg-overlay {font-size: 1.0rem;}
.bild-overlay {font-size: 1.3rem;}
header .navbar-brand {font-size: 1.2rem;}
.intro-folge h1.display-4 {font-size: 3.5rem}
.intro-folge h2.display-4, .formular h2 {font-size: 3.0rem}
.intro-folge {padding-left: 15px; padding-right: 15px; margin-left: auto; margin-right: auto}
}
@media (min-width: 768px) {
.lg-overlay {font-size: 1.0rem;}	
.bild-overlay {font-size: 1.4rem;}
.hero {height: 300px;}
.kontakt-box {padding-left: 20px; padding-top: 1rem}
.intro-mittig h1.display-4 {font-size: 3.5rem;}
.intro-folge h2.display-4 {font-size: 3.5rem}
.rs-text-block {top: 200px;}
.rs-text-block .headline {font-size: 3.0rem; line-height: 1.1em; padding: 0px 24px 0px 24px;}
.rs-text-block div.sublines {font-size: 2.0rem; padding: 0px 24px 0px 24px}
}
@media (min-width: 992px) {
.lg-overlay {font-size: 1.0rem;}
.bild-overlay {font-size: 1.8rem;}
header .dropdown:hover > .dropdown-menu {display: block; position: absolute; top: auto;}	
.nav-underline {--bs-nav-underline-border-width: 0.125rem !important;}	
.dropdown-menu {background-color: #ebeff2 !important;}	
.dropdown-item:hover {color: #005191 !important; --bs-dropdown-link-hover-bg: transparent;}			 		
.hero {height: 380px;}
.rs-text-block {top: 280px;}
.rs-text-block .headline {font-size: 4.0rem; line-height: 1.3em; padding: 0px 0px 0px 50px;}
.rs-text-block div.sublines {font-size: 2.0rem; padding: 0px 50px 0px 50px}
}

@media (min-width: 1200px) {
.rs-text-block {top: 200px;}
}

@media (min-width: 1400px) {
.container {max-width: 1200px;}
}
