a {
color: #2aa6a6;
text-decoration: underline;
}

/* Styles außerhalb der Breakpoints */
@media (max-width: 910px) {
#mainnavi ul {
margin-right:10px;
}
}

@media (max-width: 920px) {
#mainnavi {
margin-left:0px;
margin-right:10px;
}
#content {
width:100%;
}
.tablet-center {
display:block;
margin: 0 auto;
}
#subnavi {
display:none;
margin-right: 10px;
}
#subnavi ul li {
margin-top:5px;
}
#sub {
background-position: left 10px top 2em;
}
h1 {
font-size: 2.5em;
}
.logo {
width: inherit;
max-width: initial;
margin: 0 auto;
text-align: center;
display: table;
}
.logo img {
display:inline;
float:none;
margin: 0.25em;
border: 0px;
height: 10.9em;
}
#suche {
margin: 2em 0 0 0;
float:right;
width:inherit;
}
#subnavi {
float: right;
width:100%;
}
#sub {
padding: 0 1em;
height: inherit;
}
}

/* Burgermenu Styles */

#burgermenu-toggle {
display: block;
position: relative;
overflow: hidden;
margin: 0;
padding: 0;
width: 34px;
height: 24px;
font-size: 0;
text-indent: -9999px;
appearance: none;
box-shadow: none;
border-radius: none;
border: none;
cursor: pointer;
transition: background 0.3s;
float:left;
margin: 8px;
box-sizing: content-box;
}
#burgermenu-toggle:focus {
outline: none;
}
#burgermenu-toggle span {
display: block;
position: absolute;
top: 9px;
left: 0px;
right: 0px;
height: 6px;
background: #585858;
}
#burgermenu-toggle span::before, #burgermenu-toggle span::after {
position: absolute;
display: block;
left: 0;
width: 100%;
height: 6px;
background-color: #585858;
content: "";
}
#burgermenu-toggle span::before {
top: -9px;
}
#burgermenu-toggle span::after {
bottom: -9px;
}
#burgermenu-toggle span {
transition: transform 0.3s;
}
#burgermenu-toggle span::before {
transform-origin: top right;
transition: transform 0.3s, width 0.3s, top 0.3s;
}
#burgermenu-toggle span::after {
transform-origin: bottom right;
transition: transform 0.3s, width 0.3s, bottom 0.3s;
}
.mobileBox {
width:100%;
padding: 22px 12px;
font-size:30px;
font-family: 'Overpass-Reg';
background-color: #585858;
color:white;
margin: 3px 0px 0px;
line-height:30px;
box-sizing: border-box;
}
#adressInfo {
width:100%;
padding: 22px 12px;
font-family: 'Overpass-Reg';
background-color: #585858;
color:#ffffff;
margin: 3px 0px 0px;
box-sizing: border-box;
display:none;
}
#adressInfo a {
color:#ffffff;
}
.mobileBoxIcon {
height:30px;
width:30px;
float:left;
background-size: 30px 30px;
margin-right:12px;
}
.mobileBoxIcon--right {
float:right;
margin-right:12px;
}
#CallIcon {
background-image: url('../upload/mobile/phone.png');
}
#AdressIcon {
background-image: url('../upload/mobile/place.png');
}
.arrow-down {
background-image: url('../upload/mobile/arrow_down.png');
}
.arrow-up {
background-image: url('../upload/mobile/arrow_up.png');
}
.arrow-right {
background-image: url('../upload/mobile/arrow_right.png');
}
.hellblau { background-color: #2aa6a6;}
.dunkelblau { background-color: #265887;}
.orange { background-color: #ef5805;}

@media(max-width:66em) {
#blue {
padding: 10px;
}
#blue h1 {
font-size: 1.6em;
line-height: 1.65em;
display: inline-block;
margin:1em 0px;
}
.richtlinien-list li {
margin: 0px;
}
#content {
padding: 0 10px;
box-sizing: border-box;
}
}

/* Standart Bootstrap Breakpoints */
@media(max-width:767px) {
body {
margin:0px;
padding:0px;
}
#logo {
float: right;
background-image: url('../upload/img/logo-mokoflex.svg');
max-width: 210px;
height: 40px;
background-size: 210px 40px;
}
#mainnavi, #slider-titel, #slider-weiss, .boxen, #bewerber-titel {
display:none;
}
#mainnavi {
position: absolute;
top: 80px;
margin-left: -20px;
z-index: 2000;
background-color: white;
margin-right: 0px;
}
#col-le {
margin-top:1em;
}
.bluebox img {
float:none;
width:100%;
height:auto;
}	
h2, h3 {
margin: 1em 0 1em 0;
line-height:1.4em;
}
h2, .leistungen h2 {
font-size:1.6em;
}
#slider-back {
width: 100%;
height:0px;
padding-bottom:35%;
overflow: hidden;
border:none;
}
#slider {
width:100%;
overflow:hidden;
background-position:left top;
background-repeat: no-repeat;
background-size: 100%;
}
.tablet-center {
width:100% !important;
margin:1em 0px;
}
#header {
padding: 20px;
height: initial;
width: 100%;
box-sizing: border-box;
}
#social {
display:none;
}
.showMobile {
display:inline-block;
}
#content {
margin: 0 auto;
}
#page {
margin: 0 1em;
}
#mainnavi {
height: inherit;
border-bottom: 5px solid white;
}
#mainnavi ul {
margin-right: 0px;
}
#mainnavi ul li {
width: 100%;
box-sizing: border-box;
}
#mainnavi > ul > li::before {
margin: 0;
content: '';
}
#mainnavi ul li {
border-bottom: 2px solid white;
display: block;
text-transform: uppercase;
font-family: 'Overpass-Reg';
background-color: #585858;
padding: 15px 25px 15px 10px;
}
#mainnavi ul li a, #mainnavi > ul > li > a:link, #mainnavi > ul > li > a:visited {
float:left;
color:white;
font-size: 1.1em;
line-height: 1.5em;
}
#mainnavi ul .has-children:after, #mainnavi ul .has-children:after {
background-image: url('../upload/mobile/arrow_down.png');
background-size: 30px 30px;
content:'';
width:30px;
height:30px;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
right: 18px;
position: absolute;
}
#mainnavi ul .dropdown.clicked .dropdown-event {
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);
}
#subnavi {
display:none;
}
.dropdown-event {
background-image: url('../upload/mobile/arrow_down.png');
background-size: 30px 30px;
content:'';
width:30px;
height:30px;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
right: 18px;
position: absolute;
z-index:2000;
}
#mainnavi ul li ul {
padding: 0.5em 0.5em 0.5em 0.5em;
z-index: 0;
border-bottom: none;
display:none;
opacity:1;
color:white;
position: relative;
width: 100%;
box-shadow: none;
background-color: transparent;
}
#mainnavi ul li ul li {
border-bottom: none;
padding: 15px 25px 0px 10px;
background-color: transparent;
}
#mainnavi ul li ul li a::before {
content: '';
}
#mainnavi ul li:hover ul {
opacity: 1;
}
.opace_content {
opacity:0.3;
transition-duration:0.4s;
transition-timing-function:ease-in-out;
transition-property:opacity;
}
#content {
padding:0;
box-sizing: border-box;
}
.bild-links, .bild-rechts {
display:none;
}	
}

@media(max-width:934px) {	
#col-ri {
display: none;
}	
#content {
margin: 20px 10px 14px 10px !important;
max-width: 100%;
width: initial;
}
#content.mobile-buttons {
margin: 0!important;
}
#col-le, .jobticker {
width:100%;
padding-left: 1em;
padding-right: 1em;
box-sizing: border-box;
}	
.boxen {
margin: 20px auto 0px;
}
#philo, #state {
padding: 2em 1em 2em 1em;
box-sizing: content-box;
}
.box-geber a, .box-nehmer a {
width:100%;
height:initial;
box-sizing: border-box;
padding:1em;
}
.boxen h4 {
margin-bottom:0;
padding:0em;}
}


@media(min-width:768px) {
.showMobile, #burgermenu, #burgermenu-toggle {
display:none;
}
.dropdown-event {
width: 0px;
height: 0px;
display: none;
}
.theme-contenido .nivoSlider {
min-width:910px;
}
}

@media(max-width:600px) {
#sub {
background-image:none;
}
.logo img {
width: 8em;
height: 5.5em;
}
#subnavi ul li {
margin-top: 15px;
}
#blue h1 {
font-size: 1.1em;
line-height: 1.45em;
}
#blue h2 {
font-size: 1em;
line-height: 1.5em;
}
.richtlinien--list {
-webkit-padding-start: 20px;
text-indent: 3px;
}
.guides h3, .guides h4 {
font-size: 1em;
}
#page {
margin: 0 10px;
}
}

@media(max-width:340px) {
#subnavi {
margin-right:0px;
}
#subnavi ul li {
width:100%;
text-align: center;
margin: 8px 0px;
font-size:1em;
padding: 0px;
}
#subnavi ul li::before {
display:none;
}
#subnavi ul {
width:100%;
}
#suche, #suche input {
width:100%;
margin-bottom:8px;
box-sizing: border-box;
}
#suche input:focus, #sub input:active {
width:100%;
}
#footer {
display: inline-block;
height: initial;
}
}


/* Leistungen Start ----------------- */

@media(max-width:767px) {
.leistungen p img {
width:100%!important;
height:auto;
}
}

/* Leistungen Ende ----------------- */


/* Kontakt-Untermenü nicht über die Maximalbreite Start */
@media(max-width:1080px) {
#kontakt-responsive {
right:0px;
}
}
/* Kontakt-Untermenü Ende */

/* Referenzen Start ----------------- */
@media(max-width:767px) {
.logo {
width:100%;
margin:0;
padding:0;
overflow:hidden;
}
.logo img {
width:49%;
height:auto;
margin:0.4em 0 0 0;
background-color:#8ab0bf;
padding:0;
border:0;
}
.logo img:nth-child(even)::after {
clear:left;
}
}

@media(max-width:340px) {
.logo {
width:100%;
margin:0;
padding:0;
overflow:hidden;
}
.logo img {
clear:left;
width:100%;
margin:0.4em 0 0 0;
background-color:#8ab0bf;
padding:0;
}
}
/* Referenzen Ende ------------------- */


/* Kontakt Start ----------------- */
@media(max-width:767px) {
#karte {
display:none;
}
.kontakt h2 {
font-size:1.2em;
/*padding:0 1em 0 1em;*/
}
#adressen h3 {
padding:0 1em 0 1em;
}
#adressen small {
display:none;
}
#adressen-back {
margin:0 auto;
width:100%;
background-color:#8ab0bf;
padding:0.4em 0 0.4em 0;
}
#adressen {
display:block;
max-width:65em;
margin:0 auto 0 auto;
}
#adressen p {
padding:0 0 0 1em;
}
#adressen table {
margin:0 0 1em 0;
width:100%;
border:0;
color:#ffffff;
line-height:1.4em;
border-collapse: collapse;
}
#adressen table p {
padding:0;
}
#adressen table td {
padding:2em 0 1em 1em;
}
#adressen table td::first-line {
color:#0087c1;
font-size:1.1em;
text-transform:uppercase;
font-family:'Overpass-Reg';
}
#adressen table td a {
color:#ffffff;
text-decoration:none;
}
#adressen table td .info a:link, #adressen table td .info a:visited {
color:#ffffff;
text-decoration:none;
}
#adressen table td .info a:hover, #adressen table td .info a:focus, #adressen table td .info a:active {
color:#009ee0;
text-decoration:none;
}
#adressen table td .anfahrt a {
display:block;
color:#5a5a5a;
text-transform:uppercase;
text-decoration:none;
font-family:'Overpass-Reg';
margin:0.6em 0 0 0;
}
#adressen table td .anfahrt a:link, #adressen table td .anfahrt a:visited {
color:#5a5a5a;
}
#adressen table td .anfahrt a:hover, #adressen table td .anfahrt a:active, #adressen table td .anfahrt a:focus {
color:#009ee0;
}
#adressen table td .anfahrt a::after {
content: "\00BB";
padding:0 0 0 0.5em;
vertical-align:middle;
}
#adressen table tr {
float: left;
width: 100%;
}
#adressen table tr td {
float: left;
width: 100%;
border-bottom: solid 2px #ffffff;
}
#adressen table tr:last-of-type td:last-of-type {
border:none;
}
#adressen table:nth-of-type(2) tr {
float: left;
width: 100%;
}
#adressen table:nth-of-type(2) tr td {
float: left;
width: 100%;
border:0;
padding:1em 0 0.2em 1em;
}
#adressen table:nth-of-type(2) tr [colspan] {
border-bottom:2px solid #ffffff;
}	
#adressen table:nth-of-type(2) td h4 {
border-bottom:0;
padding:0.5em 0 0 0;		
}
}
/* Kontakt Ende ----------------- */

/* Gruppe Start ----------------- */
@media(max-width:767px) {
.organi {
display:none;
}
.gruppe table {
width:100%;
border:0;
border-collapse:collapse;
margin:0 0 1em 0;
}
.gurppe table tr {
float:left;
width:100%;
}
.gruppe table tr td {
vertical-align:top;
float:left;
width:100%;
}
.gruppe table h4 {
display:block;
color:#ffffff;
height:2em;
text-align:center;
font-family:'Overpass-Reg';
font-weight:normal;
font-size:0.9em;
width:100%;
padding:1.2em 0 0 0;
margin:0 0 2em 0;
}
.gruppe table tr td:nth-of-type(1), .gruppe table tr td:nth-of-type(2) {
border-right:1em solid #ffffff;
}
.gruppe table tr td:nth-of-type(1) h4 {
background-color:#2aa6a6;
}
.gruppe table tr td:nth-of-type(2) h4 {
background-color:#265887;
}
.gruppe table tr td:nth-of-type(3) h4 {
background-color:#ef5805;
}
.gruppe table p {
padding:0 0.5em 0 0.5em;
}
.gruppe table tr td a {
display:block;
position:relative;
background-color:#ffffff;
height:2em;
width:95%;
padding:0.6em 0 0 0.5em;
margin:1em 0 2em 0;
text-decoration:none;
}
.gruppe table tr td a:link, .gruppe table tr td a:visited, .gruppe table tr td a:focus {
color:#009fe3;
}
.gruppe table tr td a::after {
content: '\00BB';
padding:0 0 0 0.5em;
vertical-align:middle;
}
.gruppe table ul {
margin:0 0 1em 0;
padding:0 0.5em 0 0.5em;
list-style-type:none;
}
.gruppe table ul li {
margin:0 0 0.2em 0;
}
.gruppe table ul li::before {
content: '\00BB';
padding:0 0.5em 0 0;
vertical-align:middle;
}
}
/* Gruppe Ende ----------------- */

/* Philosophie Start ----------------- */
@media(max-width:767px) {
#module-back {
display:none;
}
#module {
display:none;
}
#philo {
background-color:#e8eff2;
width:100%;
padding:1em 0 1em 0;
}
#philotext {
font-family:'Overpass-Lig';
font-size:1em;
line-height:1.4em;
width:100%;
height:auto;
box-sizing: border-box;
padding:0 1em 0 1em;
}
#philotext h3 {
font-size:1.2em;
line-height:1.4em;
color:#1ca2d9;
margin:1.6em 0 0.5em 0;
}
#philotext h4 {
font-size:1em;
line-height:1.4em;
color:#585858;
margin:0 0 0.2em 0;
}
#philotext p {
color:#585858;
}
#philotext img {
display:none;
}
#philotext .txt-qualitat, #philotext .txt-mitarbeiter, #philotext .txt-kunden, #philotext .txt-umwelt, #philotext .txt-zertifikate {
display:block;
}
#state-back {
margin:0.5em 0 0.5em 0;
background-color: #8ab0be;
width:100%;
}
#state {
width:100%;
margin:0;
font-family:'Overpass-Lig';
font-size:1em;
line-height:1.4em;
color:#585858;
padding:1em 1em 1em 1em;
box-sizing: border-box;
}
#state h3 {
line-height:2em;
font-size:1.8em;
color:#ffffff;
margin:0.5em 0 0.5em 0;
font-weight:normal;
text-transform:uppercase;
letter-spacing: 0.05em;
}
#state h3 {
font-family:'Overpass-Lig';
line-height:2em;
font-size:1.8em;
color:#ffffff;
margin:0.5em 0 0.5em 0;
letter-spacing: 0.05em;
}
#state h4 {
font-family:'Overpass-Lig';
line-height:1.2em;
font-size:1em;
color:#ffffff;
margin:0.5em 0 0.5em 0;
letter-spacing: 0.05em;
}
}
/* Philosophie Ende ----------------- */

/* Gruppe Start ----------------- */
@media(max-width:767px) {
.organi {
display:none;
}
.gruppe table {
width:100%;
border:0;
border-collapse:collapse;
margin:0 0 1em 0;
}
.gurppe table tr {
float:left;
width:100%;
}
.gruppe table tr td {
vertical-align:top;
float:left;
width:100%;
}
.gruppe table h4 {
display:block;
color:#ffffff;
height:2em;
text-align:center;
font-family:'Overpass-Reg';
font-weight:normal;
font-size:0.9em;
width:100%;
padding:1.2em 0 0 0;
margin:0 0 2em 0;
}
.gruppe table tr td:nth-of-type(1), .gruppe table tr td:nth-of-type(2) {
border-right:1em solid #ffffff;
}
.gruppe table tr td:nth-of-type(1) h4 {
background-color:#2aa6a6;
}
.gruppe table tr td:nth-of-type(2) h4 {
background-color:#265887;
}
.gruppe table tr td:nth-of-type(3) h4 {
background-color:#ef5805;
}
.gruppe table p {
padding:0 0.5em 0 0.5em;
}
.gruppe table tr td a {
display:block;
position:relative;
background-color:#ffffff;
height:2em;
width:95%;
padding:0.6em 0 0 0.5em;
margin:1em 0 2em 0;
text-decoration:none;
}
.gruppe table tr td a:link, .gruppe table tr td a:visited, .gruppe table tr td a:focus {
color:#009fe3;
}
.gruppe table tr td a::after {
content: '\00BB';
padding:0 0 0 0.5em;
vertical-align:middle;
}
.gruppe table ul {
margin:0 0 1em 0;
padding:0 0.5em 0 0.5em;
list-style-type:none;
}
.gruppe table ul li {
margin:0 0 0.2em 0;
}
.gruppe table ul li::before {
content: '\00BB';
padding:0 0.5em 0 0;
vertical-align:middle;
}
}
/* Gruppe Ende ----------------- */

/* Impressum im Hauptmenu Einblenden Anfang ---------------------- */

@media(max-width:767px) {
ul#nav li:last-of-type {
display:block;
}
ul#nav > li:nth-last-of-type(2) {
display:block;
}
ul#nav > li:nth-last-of-type(3) {
display:block;
}
}

/* Impressum im Hauptmenu Einblenden  Ende ---------------------- */