@charset "UTF-8";
/* GLOBAL STYLES*/
body {font-family: europa, sans-serif; font-style: normal; font-weight: 300; color: #666}
a {text-decoration: none !important;color: #666;} 
a:hover, a:active {color: #E9500E !important;} 
a.active {color: #E9500E !important;}
/* STICKY NAVIGATION*/
.navbar.affix-top, .navbar.affix-bottom {position: absolute}
.navbar.affix {position: fixed;width: 100%;top: 0px;left: 0px;z-index: 1;background-color: rgba(255,255,255,1.00);
transition: all .35s ease;
padding-left: 24px;
padding-right: 24px;
-webkit-box-shadow: 9px 2px 20px #E5E5E5;
box-shadow: 0px 2px 20px #E5E5E5;
}
.navbar a.logo-sticky {display:none}
.navbar.affix a.logo-sticky {display: inline-block;vertical-align: top;color: #000;text-decoration-line: none;position: relative;top: -7.0px;}
/* DESKTOP NAVIGATION*/
.navbar-collapse {flex-basis: auto}
/* NAVIGATION*/
/* Animierter Hamburger */
.hamburger:focus {outline: none}
.hamburger {padding: 0px 0px 10px 5px;}
/* Slideout Panel Menue*/
#jPanelMenu-menu {background: #fff; padding: 55px 0px 24px 24px; width: 100%; overflow-x: visible !important; overflow-y: visible !important}
#jPanelMenu-menu a.nav-link:hover, #jPanelMenu-menu a.dropdown-item:hover {color:#000; background-color:transparent}
#jPanelMenu-menu a.nav-link {color:#999; text-transform: uppercase; padding: .6rem 0rem;}
#jPanelMenu-menu a.dropdown-item {color:#999; padding: .5rem .5rem}
#jPanelMenu-menu a.dropdown-item:first-child {color:#999; padding: 0rem .5rem .5rem .5rem}
#jPanelMenu-menu li.nav-item {border-bottom: 1px solid #C6C2C2;}
#jPanelMenu-menu li.header {display: table; width: 100%; text-align: center;}
#jPanelMenu-menu li.header span {display: table-cell;  vertical-align: middle;}
#jPanelMenu-menu a i {float: right}
.navbar-light, .navbar-toggler {color: #000 !important}
.dropdown-toggle::after {display: none !important; content: "" !important;}
.navbar-nav .dropdown-menu {float: auto;}
.dropdown-menu {position: relative !important; transform: translate3d(0px, 0px, 0px) !important; top: 0px; left: 0px; border: none; will-change: none;
border-radius: 0px;}
/*SEITENSTRUKTUR*/
body {max-width: 100%; margin: 0 auto; background-color: white; overflow-x: hidden; } 
.hero {padding: 64px 24px 0px 24px; width: 100%; height: 240px; overflow: hidden }
.hero-home {padding: 64px 24px 0px 24px; width: 100%; overflow: hidden }
/*min-height: 100%; height: 100%; position:relative;*/

.home-slider {padding: 0px 24px 0px 24px}
.jumbotron {padding: 24px; margin-bottom: 0px;background-color: #fff;}
.jumbotron .wrap {background: #666 url( ../img/home_2.jpg) 50% 40%; height: 350px}

header .navbar {position: absolute; z-index: 5; padding: 24px 24px 0px 24px; width: 100%; background: #fff}
header {background: #fff}

header .navbar-brand {
    background-color: #fff;
    width: 100px;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    overflow: visible;
    padding: 27px 5px 10px 10px;
    position: absolute;
    right: 15%;
    top: 0;
    z-index: 10;
    transition: all 0.3s ease;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    transition-delay: 0s;
}
header .navbar-brand img {width: 100%; height: auto;}
header .hero-home .tobottom {text-align: center;position: relative; bottom: 0px;background-color: transparent;}
.arrow {cursor: pointer;display: block; margin: 0 auto; width: 100px; background-color: #fff;}
header .home-Slider .tobottom div.text {font-size: 1.3rem; line-height: 1.3rem}
/* MAIN */
main h1 {padding-bottom: 20px; padding-top: 10px}
main {padding: 24px; position:relative;}
/* Homepage + Folgeseite */
body.homepage main section {margin-top: 50px;}
body.homepage main section.first {padding: 0px 10px 50px 10px; margin-top: 0px}
body.homepage main section.last {padding: 50px 10px 50px 10px; margin-top: 0px}
body.folgeseite main section {margin-top: 50px; background-color: #fff}
body.folgeseite main section.first {padding: 0px 10px 50px 10px; margin-top: 0px; background-color: #fff}
body.folgeseite main section.last {padding: 50px 0px 50px 0px; margin-top: 0px; background-color: transparent !important}
.intro-mittig h1, .intro-mittig h2 {color: #E9500E !important;}
.intro-mittig h1.display-4 {font-size: 2.9rem; line-height: 1.2;} 
.intro-mittig p {color:rgba(0,0,0,0.50); font-size: 1.5rem}
.unterpunkt h3 {color: #CE470D !important; font-size: 1.3rem}
.unterpunkt h2 {color: #CE470D !important; font-size: 1.3rem}
.unterpunkt p {color:rgba(0,0,0,0.60); font-size: 1.2rem;}
.unterpunkt ul {color:rgba(0,0,0,0.60); font-size: 1.2rem;}
.intro-folge h1, .intro-folge h2, .intro-folge h3.headline-3 {color: #E9500E !important;}
.intro-folge h1.display-4, .intro-folge h2.display-4 {font-size: 2.4rem; line-height: 1.1; margin-top: 5px; margin-bottom: 20px; }
.intro-folge h2.display-5 {font-size: 2.0rem; line-height: 1.1; margin-top: 20px; margin-bottom: 10px}
.intro-folge h3.headline-3 {font-size: 1.7rem; line-height: 1.1; margin-top: 20px; margin-bottom: 10px}
.intro-folge p, .intro-folge li {color:rgba(0,0,0,0.60); font-size: 1.3rem}
.intro-folge p.subline {font-size: 1.1rem; margin-bottom: 0px; font-weight: 100}
.intro-folge hr.subline {width: 100px; margin: 0px; border-top: 8px solid #E9500E;}
.intro-folge ul {list-style: decimal;}
.intro-folge {padding-left: 0px; padding-right: 0px; margin-left: 0px; margin-right: 0px}
p.news-intro {font-size: 1.1rem;}
p.txt-sektion {color:rgba(0,0,0,0.60); font-size: 1.2rem} 
.brand-wrapper {margin-top: 4.5rem; margin-bottom: 4.5rem}
.brand-liste div {display: inline-block; vertical-align: middle} 
.brand-liste div img {width: 100%; height: auto}
/* ICONS */
 div.icon {display:table-cell; border: 1px solid #E9500E; border-radius: 100%; height: 140px; width: 140px;}
.icon-liste i {color: #E9500E}
.icon-liste i.fa-3x {font-size: 2.7rem}
.icon-liste p {font-size: 1.2rem}
.abbinder {position: relative; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: transparent !important;}
.parallax-window {min-height: 350px;background: transparent;transition: all .35s ease;}
/* Sidebar Navigation */
.button {display: table;}
.button .row {display: table-row;}
.button i {display: table-cell; margin-right: 20px; vertical-align: middle; text-align: center; width: 55px; height: 55px;
 background-color: #E9500E; color: #fff; border-radius: 50% !important;}
.button span {display: table-cell;  vertical-align: middle; text-align: center;}
.button span p { font-size: 1.4rem; padding-left: 10px; margin: auto}
.button a {display: block; margin-bottom: 10px;}
.button a:hover, .button span p:hover {color: #E9500E;}
/* Button mit Pfeil */
.btn-pfeil-box {border: 1px solid #E9500E; border-radius: 0rem; margin-top: 30px;padding-left: 40px; padding-right: 40px; }
.btn-pfeil-box i {padding-right: 5px}
/* Bild/ Icon Navigation */
.bild-nav a {border: solid 1px #E9500E; background-color: #fff; display:block; font-size: 1.2rem} 
.bild-nav a:hover {color: #E9500E !important;}
.bild-nav h2 {font-size: 1.4rem; font-weight: 200}
.trenner hr {border-top: 2px solid #E9500E}
.trenner i {color: #E9500E}
/* Homepage Headline im Hero */
@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;
}
/* Job 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.0rem; border-radius: .80rem}
.rs-job-box a, .rs-job-box a:hover {color: #fff !important;}
.rs-job-box .stoerer h4 {font-size: 1.4rem;}

/* 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)}
/**********************/
/* News Box Accordion */
/**********************/
.accordion_news .panel.produkt {box-shadow: none; border-bottom: 1px solid #E9500E; border-radius: 0px}
.accordion_news .panel-heading {padding: 10px 0px 10px 0px}
.accordion_news .panel-heading i {float: right; color: #E9500E}
.accordion_news .panel-heading h5 {color: #E9500E; font-size: 1.1rem;}
.accordion_news .panel-heading .image-panel {padding-top: 15px}
.accordion_news .title {color: #E9500E; font-size: 1.5rem; padding-top: 15px} 
.accordion_news .panel-body.produkt {border: none; padding: 0px 0px 0px 0px}
.accordion_news .bggruen {background-color: #e2f4de !important; border-top: none !important; margin-bottom: 1px}
.accordion_news .test a {color: #E9500E; line-height: 1.5rem; font-weight: 700; padding-bottom: 10px}
.accordion_news .panel-body.news {border-top: none; padding: 0px; margin-bottom: 20px}
.accordion_news .panel-title .fa, .accordion_news .panel-title ul .fa {
position: absolute;
right: 30px;
padding: 0px;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
height: auto;
text-align: center;
font-style: normal;
}
.sign {padding: 0px !important}
.accordion_news .panel.produkt p {font-size: 1.2rem;}
.accordion_news a {color: #666}

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

/* Folgeseiten */
body.regular .main section {margin-top: 0px}
body.regular .main h1 {padding-top: 0px} 

/* 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) {
.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) {
.hero {height: 300px;}
.kontakt-box {padding-left: 20px; padding-top: 1rem}
header .navbar-brand {width: 110px; padding: 24px 5px 10px 10px;}
.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) {
.hero {height: 380px;}
.rs-job-box .stoerer p, .rs-job-box .stoerer a {font-size: 1.0rem;}
.rs-job-box .stoerer h4 {font-size: 1.4rem;}
.dropdown {height: 50px;}
.navbar-expand-md .navbar-collapse {max-height: 40px;}
.navbar-collapse {align-items: baseline;}
.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) {
header .navbar-brand {padding: 17px 5px 10px 10px; width: 125px;}
.rs-text-block {top: 200px;}
.rs-job-box .stoerer p, .rs-job-box .stoerer a {font-size: 1.3rem;}
.rs-job-box .stoerer h4 {font-size: 1.9rem;}
}
