/* RESET - http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}

/* WEBSITE-STYLE */
header .topper,
header nav,
header .titelarea,
div.container {  
	max-width: 1280px;
	margin: 0 auto;
	height: 100%;
    }

/* GRUNDEINSTELLUNGEN */
html, body {scroll-behavior: smooth;}
.bodywrapper {position: relative;}
a:active, a:focus {outline: none;}
summary {cursor:pointer; color: #FABB00;}
summary:focus {outline: none;}
.versteckt, .smallshow {display: none;}
.hiddenddiv {visibility:hidden;}
.imgcenter {display: block; margin-left: auto; margin-right: auto;}
.centerdivwide {padding-left: 175px; padding-right: 175px;}

/* SECTIONS */
section {padding-top: 65px; padding-bottom: 65px;}
section.nospacetop {padding-top: 0px; padding-bottom: 65px;}
section.nospacebottom {padding-top: 65px; padding-bottom: 0px;}
section.padmedtop {padding-top: 45px; padding-bottom: 65px;}
section.padmed {padding-top: 45px; padding-bottom: 45px;}
section.padmednospacetop {padding-top: 0px; padding-bottom: 45px;}
section.padmednospacebottom {padding-top: 45px; padding-bottom: 0px;}
section.secnospace {padding-top: 0px; padding-bottom: 0px;}
section.nospacetopsmall {padding-top: 0px; padding-bottom: 25px;}
section.schraege {padding-top: 75px; padding-bottom: 75px;}
section#kundenstimmen {padding-top: 25px; padding-bottom: 25px;}

/* HEADER */
header {position: relative; background: rgb(39,123,169); background: linear-gradient(145deg, rgba(39,123,169,1) 0%, rgba(0,76,108,1) 63%);}
section.schraege {position: relative;}
header .extradiv01, section.schraege .extradiv01 {position: absolute; bottom: -4px; width:100%;}
section.schraege .extradiv01top {position: absolute; top: -1px; width:100%;}

.topper {padding-top: 25px; padding-bottom: 0px;}
.titelarea {padding-top: 0px;}
.titelarea .titelareatext {padding-top: 55px;}
.landingpages .titelarea .titelareatext {padding-top: 25px;}

/* FOOTER */
footer {margin-top: 5px; padding-top: 5px; padding-bottom: 15px; border-top: 3px solid #d6d6d4;}
section.nospacebottomfooter {padding-top: 65px; padding-bottom: 0px; margin-bottom: 5px;}

/* SCROLL-TOP */
.scroll-top {
    position: fixed;
    bottom: 25px;
    right: 25px;
    border: 0px;
    background-color: #cfd1d2;
    opacity: 0.8;
    z-index:99;
    text-align: center;
}
.scroll-top:hover {background-color: #005E86;}

/* HINTERGRÜNDE */
.bgwhite {background-color: #ffffff;} 
.bgblue, div .bgblue, section .bgblue {background-color: #005e86;}  
.bglightbrown, div .bglightbrown, section .bglightbrown {background-color: #f7f2ea;}
.bglightbrown1, div .bglightbrown1, section .bglightbrown1 {background-color: #F8F5F1;}
.bglight2brown, div .bglight2brown, section .bglight2brown {background-color: #E9D9C4;}
.bgmediumbrown, div .bgmediumbrown, section .bgmediumbrown {background-color: #C5AA91;}

.bglightbrownverlauf {background: rgb(255,255,255); background: linear-gradient(180deg, rgba(255,255,255,1) 50%, rgba(244,236,226,1) 100%);}

.whitebanner {background-color: #ffffff; padding-left: 7px; padding-right: 7px; padding-top: 7px; padding-bottom: 5px; border-radius: 3px; display:table; margin-bottom: 15px}
.bluebanner {background-color: #005e86; padding-left: 7px; padding-right: 7px; padding-top: 7px; padding-bottom: 5px; border-radius: 3px; display:table; margin-bottom: 15px}
.brownbanner {background-color: #C5AA91; padding-left: 7px; padding-right: 7px; padding-top: 7px; padding-bottom: 5px; border-radius: 3px; display:table; margin-bottom: 15px}

.border1 {border: solid 1px #c4aa91; border-radius: 5px;}
.border2 {border: solid 2px #c4aa91; border-radius: 5px;}

.borderbox {border:solid 1px #BCBCBD; padding: 25px 25px 25px 25px;}
.borderbox.bblue {border:solid 1px #005e86; border-top: solid 9px #005e86;}
.borderbox.borange {border:solid 1px #ffcc00; border-top: solid 9px #ffcc00;}
.borderbox.bpetrol {border:solid 1px #0D5E6B; border-top: solid 9px #0D5E6B;}
.borderbox.bbeere {border:solid 1px #941981; border-top: solid 9px #941981;}
.borderbox.bcyan {border:solid 1px #20A1B7; border-top: solid 9px #20A1B7;}
.borderbox.blight2brown {border:solid 1px #E9D9C4; border-top: solid 9px #E9D9C4;}

.whitespacetop20 {background: url(../images/whitespace20.jpg) top left repeat-x;}
.whitespacetop25 {background: url(../images/whitespace25.jpg) top left repeat-x;}
.whitespacetop50 {background: url(../images/whitespace50.jpg) top left repeat-x;}


/* ABSTÄNDE */
.abstandvor5 {margin-top: 5px;}
.abstandvor7 {margin-top: 7px;}
.abstandvor10 {margin-top: 10px;}
.abstandvor15 {margin-top: 15px;}
.abstandvor20 {margin-top: 20px;}
.abstandvor25 {margin-top: 25px;}
.abstandvor30 {margin-top: 30px;}
.abstandvor35 {margin-top: 35px;}
.abstandvor40 {margin-top: 40px;}
.abstandvor45 {margin-top: 45px;}
.abstandvor50 {margin-top: 50px;}
.abstandvor55 {margin-top: 55px;}
.abstandvor60 {margin-top: 60px;}
.abstandvor70 {margin-top: 70px;}
.abstandvor80 {margin-top: 80px;}
.abstandvor90 {margin-top: 90px;}
.abstandvor100 {margin-top: 100px;}

.abstand0 {margin-bottom: 0px;}
.abstand3 {margin-bottom: 3px;}
.abstand5 {margin-bottom: 5px;}
.abstand7 {margin-bottom: 7px;}
.abstand10 {margin-bottom: 10px;}
.abstand15 {margin-bottom: 15px;}
.abstand20 {margin-bottom: 20px;}
.abstand25 {margin-bottom: 25px;}
.abstand30 {margin-bottom: 30px;}
.abstand35 {margin-bottom: 35px;}
.abstand40 {margin-bottom: 40px;}
.abstand35 {margin-bottom: 35px;}
.abstand40 {margin-bottom: 40px;}
.abstand45 {margin-bottom: 45px;}
.abstand50 {margin-bottom: 50px;}
.abstand55 {margin-bottom: 55px;}
.abstand60 {margin-bottom: 60px;}
.abstand70 {margin-bottom: 70px;}
.abstand80 {margin-bottom: 80px;}
.abstand90 {margin-bottom: 90px;}
.abstand100 {margin-bottom: 100px;}

.abstandvorneg5 {margin-top: -5px;}
.abstandvorneg10 {margin-top: -10px;}
.abstandvorneg20 {margin-top: -20px;}
.abstandvorneg25 {margin-top: -25px;}
.abstandvorneg30 {margin-top: -30px;}
.abstandvorneg35 {margin-top: -35px;}
.abstandvorneg40 {margin-top: -40px;}
.abstandvorneg45 {margin-top: -45px;}
.abstandvorneg50 {margin-top: -50px;}
.abstandvorneg55 {margin-top: -55px;}
.abstandvorneg60 {margin-top: -60px;}
.abstandvorneg65 {margin-top: -65px;}
.abstandvorneg70 {margin-top: -70px;}
.abstandvorneg75 {margin-top: -75px;}

.abstandnachneg10 {margin-bottom: -10px;}
.abstandnachneg20 {margin-bottom: -20px;}

.paddingt5 {padding-top: 5px;}
.paddingt10 {padding-top: 10px;}
.paddingt20 {padding-top: 20px;}

.paddingb25 {padding-bottom: 25px;}
.paddingb35 {padding-bottom: 35px;}

.paddingall20 {padding: 20px;}
.paddingall25 {padding: 25px;}
.padleftright25 {padding-left: 25px; padding-right: 25px;}

.paddingtb7 {padding-top: 7px; padding-bottom: 7px;}
.paddingtb10 {padding-top: 10px; padding-bottom: 10px;}
.paddingtb15 {padding-top: 10px; padding-bottom: 15px;}
.paddingtb20 {padding-top: 20px; padding-bottom: 20px;}
.paddingtb25 {padding-top: 25px; padding-bottom: 25px;}

.negmargintop25 {margin-top: -25px;}
.negmargintop65 {margin-top: -65px;}
.negmargintop85 {margin-top: -85px;}
.negmargintop95 {margin-top: -95px;}
.negmarginbottom25 {margin-bottom: -25px;}
.negmarginbottom40 {margin-bottom: -40px;}

/* BILDANPASSUNGEN */
img.imglogo355 {max-width:355px; width: 100%; height: auto;}

img.testimonimg {display: block; margin-left: auto; margin-right: auto; margin-bottom: 20px;}
img.imgicon55h {height: 100%; max-height:40px; width: auto;}
img.socmediaicon {max-width:15px; width: 100%; height: auto; }

img.imgpodcast {width: 100%; max-width:235px; height: auto;}

img.img45 {width: 100%; max-width:45px; height: auto;}
img.img125 {width: 100%; max-width:125px; height: auto;}
img.img175 {width: 100%; max-width:175px; height: auto;}
img.img200 {width: 100%; max-width:200px; height: auto;}
img.img215 {width: 100%; max-width:215px; height: auto;}
img.img250 {width: 100%; max-width:250px; height: auto;}
img.img255 {width: 100%; max-width:255px; height: auto;}
img.img275 {width: 100%; max-width:275px; height: auto;}
img.img280 {width: 100%; max-width:280px; height: auto;}
img.img320 {width: 100%; max-width:320px; height: auto;}
img.img325 {width: 100%; max-width:325px; height: auto;}
img.img350 {width: 100%; max-width:350px; height: auto;}
img.img355 {width: 100%; max-width:355px; height: auto;}
img.img375 {width: 100%; max-width:375px; height: auto;}
img.img397 {width: 100%; max-width:397px; height: auto;}
img.img400 {width: 100%; max-width:400px; height: auto;}
img.img420 {width: 100%; max-width:420px; height: auto;}
img.img450 {width: 100%; max-width:450px; height: auto;}
img.img500 {width: 100%; max-width:500px; height: auto;}
img.img550 {width: 100%; max-width:550px; height: auto;}
img.img600 {width: 100%; max-width:600px; height: auto;}
img.img640 {width: 100%; max-width:640px; height: auto;}
img.img745 {width: 100%; max-width:745px; height: auto;}
img.img750 {width: 100%; max-width:750px; height: auto;}
img.img765 {width: 100%; max-width:765px; height: auto;}
img.img775 {width: 100%; max-width:490px; height: auto;}
img.img950 {width: 100%; max-width:950px; height: auto;}
img.img980 {width: 100%; max-width:980px; height: auto;}
img.img1024 {width: 100%; max-width:1024px; height: auto;}
img.img1280 {width: 100%; max-width:1280px; height: auto; display: block; margin-left: auto; margin-right: auto;}
img.img128080p {width: 80%; max-width:1280px; height: auto; display: block; margin-left: auto; margin-right: auto;}
img.width80pcenter {width:80%; display: block; margin-left: auto; margin-right: auto;}
img.imgfullwidth {width:100%; height: auto;}

img.iconabout {height: 35px; width: auto;}

/* FLEXBOX 1 */
.flexwrapper {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
}
.flexelement {max-width: 270px; height: auto; margin-left: 20px; margin-right: 20px; margin-bottom: 25px;}

/* FLEXBOX 2 */
.reihenboxen {
    display: flex;
    justify-content: space-between;
    flex-direction: row; 
    flex-wrap: wrap;
    justify-content: center;
}

.reihenboxenleft {
    display: flex;
    justify-content: space-between;
    flex-direction: row; 
    flex-wrap: wrap;
    justify-content: left;
}

.reihenbox {
    width: 19%;
    min-width: 200px;
    padding: 25px;
    margin-left: 8px;    
    margin-right: 8px;
    margin-bottom: 15px;
    background-color: #ffffff;
}

.reihenbox.bgblue {
    width: 19%;
    min-width: 200px;
    padding: 25px;
    margin-right: 15px;
    margin-bottom: 15px;
    background-color: #005E86;
}

.module .reihenbox {width: 28%; padding: 15px; border: 5px solid #fdedcd;}

.reihenboxabout {
    width: 27%;
    max-width: 400px;
    padding: 25px;
    margin-left: 8px;    
    margin-right: 8px;
    margin-bottom: 15px;
    background-color: #ffffff;
}

/* MAILFORMULAR */	
form {margin-top: 0px; width: 90%;}
input, textarea, .entry__field {color: #3b3b3a; font-size: 0.8em;font-family:osr,verdana, sans-serif; border-color: #3b3b3a;}
input[type=text], input[type=email] {margin-bottom: 20px; margin-top: 5px;width:90%;padding: 10px;border-radius:0px;border:1px solid #3b3b3a; background-color: #ffffff;}
textarea{width:90%; padding: 10px; margin-top: 5px; border:1px solid #3b3b3a; border-radius:0px; margin-bottom: 20px; resize:none;background-color: #ffffff;}
input[type=text]:focus,textarea:focus, input[type=email]:focus {border-color: #3b3b3a;}
input[type=submit] {background-color: #50ae30; padding-top: 10px; padding-bottom: 10px; padding-left: 25px; padding-right: 20px; border:0px; cursor:pointer; color:#ffffff; text-decoration: none; text-transform: uppercase;border:1px solid #50ae30;}
input[type=submit]:hover {background-color: #1b5a0e; border:1px solid #1b5a0e;}

/* BREVO-FORMULAR */
#error-message {border: 1px solid red; padding:10px; margin:0px; margin-top: 25px; text-align:left; color: red;}

.sib-form .entry__error {color: red;}

/* FAQ-ACCORDION */
main {
  margin: 0 auto;
}

details.faq {margin-bottom: 25px; border: 1px solid #c4aa91;}

summary {
  background-color: #fff;
  padding: 10px;
  outline: none;
  border-radius: 0.25rem;
  text-align: left;
  cursor: pointer;
  position: relative;
}
details[open] summary ~ * {
  animation: sweep .5s ease-in-out; padding-bottom: 10px; padding-left: 15px; padding-right: 15px;
}
@keyframes sweep {
  0%    {opacity: 0; margin-top: -10px}
  100%  {opacity: 1; margin-top: 0px}
}
details > summary::after {
  position: absolute;
  content: "+";
  right: 20px;
}
details[open] > summary::after {
  position: absolute;
  content: "-";
  right: 20px;
}
details > summary::-webkit-details-marker {
  display: none;
}

/* TYPOLOAD */
@font-face {
font-family: 'MontserratLight'; font-display: swap;
src: url('../typo/Montserrat-Light.ttf');}

@font-face {
font-family: 'MontserratRegular'; font-display: swap;
src: url('../typo/Montserrat-Regular.ttf');}

@font-face {
font-family: 'MontserratRegularItalic'; font-display: swap;
src: url('../typo/Montserrat-Italic.ttf');}

@font-face {
font-family: 'MontserratMedium'; font-display: swap;
src: url('../typo/Montserrat-Medium.ttf');}

@font-face {
font-family: 'MontserratSemiBold'; font-display: swap;
src: url('../typo/Montserrat-SemiBold.ttf');}

@font-face {
font-family: 'MontserratSemiBoldItalic'; font-display: swap;
src: url('../typo/Montserrat-SemiBoldItalic.ttf');}

@font-face {
font-family: 'MontserratBold'; font-display: swap;
src: url('../typo/Montserrat-Bold.ttf');}

@font-face {
font-family: 'MontserratExtraBold'; font-display: swap;
src: url('../typo/Montserrat-ExtraBold.ttf');}

@font-face {
font-family: 'MontserratBlack'; font-display: swap;
src: url('../typo/Montserrat-Black.ttf');}

/* TOP-NAV */
.divlogo {margin-top: 0px; padding-right: 0px;}     
   

/* Typo-Formatierungen */

p, li, label, summary, span.ptext, #error-message, label.entry__label {
    line-height: 145%;
	font-size: 0.95rem; 
	font-family:MontserratRegular,verdana,sans-serif;
	color: #3b3b3a;
    text-align: left;
}

p.headbig {
    line-height: 110%;
	font-size: 2.85rem; 
	font-family:MontserratSemiBold,verdana,sans-serif;
	color: #005e86;
    text-align: left;
}

p.headbigkl {
    line-height: 110%;
	font-size: 2.25rem; 
	font-family:MontserratSemiBold,verdana,sans-serif;
	color: #005e86;
    text-align: left;
}

p.headbig.typolightbrown {
	color: #c4aa91;
}

p.hauptkleiner {font-size: 2.65rem; font-family:MontserratSemiBold,verdana,sans-serif;}
p.klein {font-size: 1.75rem; font-family:MontserratLight,verdana,sans-serif;}
p.kleiner {font-size: 1.15rem; font-family:MontserratLight,verdana,sans-serif;}

b, strong {font-family:MontserratSemiBold,verdana,sans-serif;}
.durchstrich {text-decoration: line-through;}
u, .unterstrichen {text-decoration: underline;}
i {font-family:MontserratRegularItalic,verdana,sans-serif;}
.typouppercase {text-transform:uppercase;}
.typolight {font-family:MontserratLight,verdana,sans-serif;}
.typoregular {font-family:MontserratReguar,verdana,sans-serif;}
.typomedium {font-family:MontserratMedium,verdana,sans-serif;}
.typosemibold {font-family:MontserratSemiBold,verdana,sans-serif;}
.typosemibolditalic {font-family:MontserratSemiBoldItalic,verdana,sans-serif;}
.typobold {font-family:MontserratBold,verdana,sans-serif;}
.typoextrabold {font-family:MontserratExtraBold,verdana,sans-serif;}

.typo07, p.typo07, a.typo07, li.typo07 {line-height: 125%; font-size: 0.7rem;}
.typo08, p.typo08, a.typo08, li.typo08 {line-height: 125%; font-size: 0.8rem;}
.typo085, p.typo085, a.typo085, li.typo085 {line-height: 125%; font-size: 0.85rem;}
/* Standard: line-height: 145%; font-size: 0.95rem; */
.typo105, p.typo105, li.typo105 {line-height: 125%; font-size: 1.05rem;}
.typo115, p.typo115, li.typo115 {line-height: 125%; font-size: 1.15rem;}
.typo125, p.typo125, li.typo125 {line-height: 125%; font-size: 1.25rem;}
.typo14, p.typo14, li.typo14 {line-height: 125%; font-size: 1.40rem;}
.typo165, p.typo165, li.typo165 {line-height: 125%; font-size: 1.65rem;}
.typo175, p.typo175, li.typo175 {line-height: 125%; font-size: 1.75rem;}
.typo185, p.typo185, li.typo185 {line-height: 125%; font-size: 1.85rem;}
.typo215, p.typo215, li.typo215 {line-height: 125%; font-size: 2.15rem;}
.typo25, p.typo25, li.typo25 {line-height: 125%; font-size: 2.5rem;}
.typo305, p.typo305, li.typo305 {line-height: 125%; font-size: 3.05rem;}
.typo325, p.typo325, li.typo325 {line-height: 125%; font-size: 3.25rem;}
.typo45, p.typo45, li.typo45 {line-height: 125%; font-size: 4.5rem;}

h2 {
    line-height: 120%;
	font-size: 1.55rem; 
	font-family:MontserratBold,verdana,sans-serif;
	color: #3b3b3a;
    text-align: left;
    margin-bottom: 30px;
}
h2.plus {font-size: 2.0rem;}
h2 span.h2klein {font-size: 1.05rem; font-family:MontserratRegular,verdana,sans-serif;}
h2.detaillist {color: #c4aa91;}
h2.linie {padding-bottom: 15px; background: url(../images/icon_linieblue150_2.gif) no-repeat bottom left;}

.landingpages h2 {margin-bottom: 0px;}

h3 {
    line-height: 125%;
	font-size: 1.25rem; 
	font-family:MontserratSemiBold,verdana,sans-serif;
	color: #3b3b3a;  
    text-align: left;
    margin-bottom: 15px;
}

h3.h3plus {font-size: 1.5rem;}

h4 {
    line-height: 110%;
	font-size: 1.1rem; 
	font-family:MontserratSemiBold,verdana,sans-serif;
	color: #3b3b3a;
    text-align: left;
    margin-bottom: 5px;
}

h5 {
    line-height: 110%;
	font-size: 0.9rem; 
	font-family:MontserratSemiBold,verdana,sans-serif;
	color: #3b3b3a;
    text-align: left;
    margin-bottom: 5px;
}

a:link,
a:visited,
a:active {color: #005E86; text-decoration: underline;}
a:hover {color: #734C36; text-decoration: underline;}

a.nolinkline:link,
a.nolinkline:visited,
a.nolinkline:active,
a.nolinkline:hover {text-decoration: none;}

a.linkline:link,
a.linkline:visited,
a.linkline:active {text-decoration: none;}
a.linkline:hover {text-decoration: underline;}

/* Titelarea */
.titelarea h1 {font-family:MontserratMedium,verdana,sans-serif; font-size: 1.1rem; line-height: 110%; color: #ffffff; margin-bottom: 10px; padding-bottom: 0px;}
.titelarea .whitebanner h1 {color: #005e86; margin-bottom: 0px;}
.titelarea h2 {font-family:MontserratLight,verdana,sans-serif; font-size: 2.95rem; line-height: 105%; color: #ffffff; margin-bottom: 15px; padding-bottom: 0px;}
.landingpages .titelarea h2 {font-size: 2.85rem; line-height: 115%;}

.titelarea p {line-height: 145%; font-size: 1.15rem;}

/* Aufzählungen */
ul.textlist {
    list-style-type: square;
    list-style-position: outside;
    margin-left: 15px;
    margin-bottom: 0px;
}

ul.textlist ul.textlistsub {
    list-style-type: disc;
    list-style-position: outside;
    margin-left: 30px;
    margin-bottom: 0px;
}

ul.check01 {list-style-type:none; margin-left: 15px;}
ul.check01 li:before { content: "\2714" " "; color:#008638; margin-left: -15px;}
ul.check01 li.nix:before { content: "\2718" " "; color:#b70a06; margin-left: -15px;}

ul.check02 {list-style-type:none; margin-left: 15px;}
ul.check02 li:before { content: "\2718" " "; color:#b70a06; margin-left: -15px;}

ul.check03 {list-style-type:none; margin-left: 25px;}
ul.check03 li:before { content: "👉" " "; color:#b70a06; margin-left: -25px;}

/* Ausrichtungen */
.centertext, .centertext p, .centertext h1, .centertext h2, .centertext h3, .centertext h4, .centertext h5, #produktseite p.headbig.centertext {text-align: center;}
.lefttext, .lefttext p, .lefttext h1, .lefttext h2, .lefttext h3, .lefttext h4, .lefttext h5 {text-align: left;}
.righttext, .righttext p, .righttext h1, .righttext h2, .righttext h3, .righttext h4, .righttext h5 {text-align: right;}

/* Schriftfarben */
.typowhite, a.typowhite {color: #ffffff;}
.typoblack, a.typoblack {color: #000000;}
.typoblue, a.typoblue {color: #005e86;}
.typolightgrey, a.typolightgrey {color: #a6a6a6;}
.typogrey, a.typogrey {color: #7b7b7a;}
.typodarkgrey, a.typodarkgrey {color: #3b3b3a;}
.typolightlightbrown, a.typolightlightbrown {color: #e9d9c4;}
.typolightbrownmed, a.typolightbrownmed {color: #dec2a8;}
.typolightbrown, a.typolightbrown {color: #c4aa91;}
.typomediumbrown, a.typomediumbrown {color: #A48770;}
.typobrown, a.typobrown {color: #734C36;}
.typogreen, a.typogreen {color: #007c33;}
.typored, a.typored {color: #b90c0c;}
.typoorange, a.typoorange {color: #ffcc00;}
.typopetrol, a.typopetrol {color: #0D5E6B;}
.typobeere, a.typobeere {color: #941981;}
.typoturkis, a.typoturkis {color: #20A1B7;}
.typoapple, a.typoapple {color: #BCCF00;}


.bgblue p, .bgblue h1, .bgblue h2, .bgblue h3, .bgblue h4, .bgblue h5 {color: #ffffff;}
.whitebanner p {color: #005e86; margin-bottom: 0px;}

/* Buttons */
.morebutton,
input[type=submit],
button[type=submit] {
    margin-top: 15px;
    margin-bottom: 0px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    display: inline-block;
    text-align: center;
    border-radius: 8px;
    border: 0px;
    cursor: pointer;
    font-family:MontserratSemiBold,verdana,sans-serif; 
    font-size: 0.95rem;
    color: #ffffff;
    text-decoration: none;    
}

.morebutton.whitebtn {color: #005E86; background-color: #ffffff; transition: 1.25s;}
.morebutton.whitebtn:hover {background-color: #005E86; color: #ffffff;}

.morebutton.bigbtn {
    line-height: 110%;
	font-size: 1.15rem; 
	font-family:MontserratSemibold,verdana,sans-serif;
	color: #ffffff; text-decoration: none;
}

.borderwhite {border: 2px solid #ffffff;}
.borderblue1 {border: 1px solid #005E86;}
.borderblue2 {border: 2px solid #005E86;}
.bordershadow1 {padding: 25px; border-radius: 10px; box-shadow: 0 0 15px -5px rgba(0,0,0,0.3);}


.morebutton.btnyellow,
input[type=submit].btnyellow {background-color: #FBC200; transition: 0.5s;}
.morebutton.btnyellow:hover,
input[type=submit].btnyellow:hover {background-color: #F6A600;}

.morebutton.btnbrown,
input[type=submit].btnbrown {background-color: #c4aa91; transition: 0.5s;}
.morebutton.btnbrown:hover,
input[type=submit].btnbrown:hover {background-color: #734C36;}

.morebutton.btnblue,
input[type=submit].btnblue {background-color: #005E86; transition: 0.5s;}
.morebutton.btnblue:hover,
input[type=submit].btnblue:hover {background-color: #004c6c;}

.morebutton.btngreen,
input[type=submit].btngreen,
button[type=submit] {background-color: #329311; transition: 0.5s;}
.morebutton.btngreen:hover,
input[type=submit].btngreen:hover,
button[type=submit]:hover {background-color: #2f7717;}

.morebutton.btnnobg,
input[type=submit].btnnobg {background-color: none; transition: 0.5s;}
.morebutton.btnnobg:hover,
input[type=submit].btnnobg:hover {background-color: #c4aa91; transition: 0.5s;}

img.iconbtn {float: left; margin-right: 10px;}

/* MEDIA-QUERIES */
@media only screen and (max-width: 520px) {
    .titelarea h1 {font-family:MontserratMedium,verdana,sans-serif; font-size: 1.0rem; line-height: 110%; color: #ffffff; margin-bottom: 10px; padding-bottom: 0px;}
    .titelarea .whitebanner h1 {color: #005e86; margin-bottom: 0px;}
    .titelarea h2 {font-family:MontserratLight,verdana,sans-serif; font-size: 2.5rem; line-height: 110%; color: #ffffff; margin-bottom: 15px; padding-bottom: 0px;}
    .titelarea p {font-size: 1.1rem; line-height: 135%; }
    .titelarea p.typo08 {line-height: 125%; font-size: 0.8rem;}
    
    .whitebanner {display: block; margin-left: auto; margin-right: auto; text-align:center;}
    
    .morebutton.bigbtn {line-height: 110%; font-size: 1.0rem;}    

    p.klein {font-size: 1.25rem; font-family:MontserratLight,verdana,sans-serif;}
    
    .typo305, p.typo305, li.typo305 {line-height: 115%; font-size: 2.5rem;}
    .typo215, p.typo215, li.typo215 {line-height: 125%; font-size: 1.55rem;}
    .typo25, p.typo25, li.typo25 {line-height: 105%; font-size: 1.75rem;}
    p.headbig  {font-size: 1.75rem;}

    .reihenbox {width: 80%; min-width: 200px;}
    
    #contacttop {padding-top: 10px;}
    #contacttop li {display: block; width: 100%; margin-bottom: 10px; text-align: center; padding-bottom: 0px;}  

   .titelarea p.hauptkleiner, p.hauptkleiner,
   #produktseite .titelarea p.hauptkleiner, #produktseite p.hauptkleiner {font-size: 2.25rem;}
   #produktseite .titelarea p.klein, #produktseite p.klein, .titelarea p.klein, p.klein {font-size: 1.45rem;}
   #produktseite .titelarea p.kleiner, #produktseite p.kleiner, .titelarea p.kleiner, p.kleiner {font-size: 1.15rem;}    
}

@media only screen and (max-width: 1024px) {
 /* Navigation schmal */   
.iconlinka {margin-right: 25px;}     
     
nav a:link,
nav a:active,
nav a:visited {
	line-height: 100%;
	font-size: 0.85rem; 
	font-family:MontserratMedium,verdana,sans-serif;
	color: #3b3b3a;
    text-decoration: none;
    -webkit-transition: color 1s;
        transition: color 1s; 
}
nav a:hover {color: #005e86; text-decoration: none;}     
     
nav a:link span,
nav a:active span,
nav a:visited span {font-family:MontserratSemiBold,verdana,sans-serif;}
    
.nav_icon_div {float: left; margin-bottom: 25px;} 
.nav_icon {margin-right: 10px; margin-bottom:-10px;}      
     
.divlogo {width:100%; text-align: center;}
     
nav ul li {float:none;
      list-style:none;
      position:relative;
      display:block; margin-right:0px;
      padding-left: 15px;}          
     
nav li, nav li a {text-align: left; padding-bottom: 7px;}
     
ul.main-nav-sub {padding-top: 7px;}
     
nav ul li ul {display: block; position: relative; left:0; background: none; padding-bottom: 0px; margin-bottom: 0px;}     

     nav ul li ul li, nav ul li ul a {padding-bottom: 0px;}     
     
.ic {
  position: fixed; 
  cursor: pointer;
  display: inline-block;
  right: 25px;
  width: 32px;
  height: 24px;
  text-align: center;
  top:0px;
  outline: none; color: #000000;
}

.ic.close { 
  opacity: 0; 
  font-size: 0px; 
  font-weight: 300; 
  color: #000000;
  top:8px;
  height:40px;
  display: block;
  outline: none;
} 
    
.ic.menu { top:25px; z-index : 20;}

.ic.menu .line { 
  height: 4px; 
  width: 100%; 
  display: block; 
  margin-bottom: 6px; 
}
.ic.menu .line-last-child { margin-bottom: 0px;  }    

.ic.menu { display: block; }    

.ic.menu .line {
    -webkit-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
  }
    
  .ic.menu .line { background-color: #c4aa91 !important; }    
  .ic.menu:focus .line { background-color: #000000 !important; }
  
  .ic.menu:focus .line:nth-child(1) { 
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); 
  }
  
  .ic.menu:focus .line:nth-child(2){ 
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg); 
    margin-top: -10px;
  }
  
  .ic.menu:focus .line:nth-child(3){
    transform: translateY(15px);
    opacity: 0;
  }
  header.light .ic.menu .line { background-color: #000; }
  .ic.menu:focus{ outline: none; }
  .ic.menu:focus ~ .ic.close { opacity: 1; z-index : 21;  outline: none;  }
  
  /*
  
  .ic.menu:focus ~ .ic.close { opacity: 1.0; z-index : 21;  }
  .ic.close:focus { opacity: 0; }
  */
  .ic.menu:hover, 
  .ic.menu:focus{ opacity: 1; }    

.navlogo img.imglogo355 {max-width:355px; width: 90%; height: auto;}    
    
ul.main-nav {
    z-index:2; 
    padding: 50px 0;
    position: fixed;
    right: 0px;
    top: 0px;
    width: 0px;
    background-color:rgba(255,255,255,.95);
    height: 100%;
    overflow: auto;
    /*CSS animation applied : Slide from Right*/
   -webkit-transition-property: background, width;
    -moz-transition-property: background, width;
    -o-transition-property: background, width;
    transition-property: background, width;
   	-webkit-transition-duration: 0.6s;
	  -moz-transition-duration: 0.6s;
	  -o-transition-duration: 0.6s;
    transition-duration: 0.6s;
  }
  
  .ic.menu:focus ~ .main-nav { width: 100%; background-color:rgba(255,255,255,.95); }
  
  ul.main-nav > * { 
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity;
   	-webkit-transition-duration: 0.4s;
	  -moz-transition-duration: 0.4s;
	  -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    opacity: 0;
  }
  .ic.menu:focus ~ .main-nav > * {opacity: 1;}   
    
/* DIVERSES */
      
    .whitebanner {text-align: center; display: block; margin-left: auto; margin-right: auto;}
    
    .colasymtitel .zweispaltiger_inhalt1,
    .colasymtitel .zweispaltiger_inhalt2 {display: block; width: 100%; margin-bottom: 45px;}
    
    .titelarea h1, .titelarea h2, .titelarea p {text-align: center;}    

    .morebutton {display: block; margin-left: auto; margin-right: auto; text-decoration: none;}
     
    a.btnlink, a.btnlink:link, a.btnlink:visited {text-decoration: none;}       
    
    .clicksapart {display:none;}     
    .smallhide {display: none;}
    .smallshow {display: block;}
    
    .padleft0, padleft10, .padleft20, .padleft30, padleft40, .padleft70 {padding-left: 0px;}
    
    .padleft50 {padding-left: 20px;}
    
    div.titelarea div.innercontainer {z-index:25; background:none; background-color: #005e86; width: 100%; margin-top: 15px;}
   
    .zweispaltiger_inhalt1,
    .zweispaltiger_inhalt2 {display: block; width: 100%; margin-bottom: 45px;}
    
    .titelarea .zweispaltiger_inhalt2 { margin-bottom: 0px;}    
    
    .colasym .zweispaltiger_inhalt1,
    .colasym .zweispaltiger_inhalt2 {display: block; width: 100%; margin-bottom: 45px;}

    .colasym2 .zweispaltiger_inhalt1,
    .colasym2 .zweispaltiger_inhalt2 {display: block; width: 100%; margin-bottom: 45px;} 
    
    .colasym3 .zweispaltiger_inhalt1,
    .colasym3 .zweispaltiger_inhalt2 {display: block; width: 100%; margin-bottom: 45px;}
    
    .colasym4 .zweispaltiger_inhalt1,
    .colasym4 .zweispaltiger_inhalt2 {display: block; width: 100%; margin-bottom: 45px;}
    
    .dreispaltiger_inhalt1,
    .dreispaltiger_inhalt2,
    .dreispaltiger_inhalt3 {display: block; margin-bottom: 45px;}    
    
    .dreispaltiger_inhalt1 .nomarg, .dreispaltiger_inhalt .nomarg2, .dreispaltiger_inhalt3 .nomarg,
    .zweispaltiger_inhalt1 .nomarg, .zweispaltiger_inhalt2 .nomarg,
    .colasym .zweispaltiger_inhalt1 .nomarg, .colasym .zweispaltiger_inhalt2 .nomarg,
    .colasym2 .zweispaltiger_inhalt1 .nomarg, .colasym2 .zweispaltiger_inhalt2 .nomarg,
    .colasym3 .zweispaltiger_inhalt1 .nomarg, .colasym3 .zweispaltiger_inhalt2 .nomarg,
    .colasym4 .zweispaltiger_inhalt1 .nomarg, .colasym4 .zweispaltiger_inhalt2 .nomarg {margin-bottom: 0px;}
    
    .centerdivwide {padding-left:0px; padding-right:0px;}
        
   .imgfloatleft {float:none; padding-right: 0px; margin-bottom: 0px; display: block; margin-left: auto; margin-right: auto; }
   .imgfloatright {float:none; padding-left: 0px; margin-bottom: 0px; display: block; margin-left: auto; margin-right: auto;}

   .text80p, .text70p, .text60p {width: 100%;}     
   .table-row, .table-cell {display: block;}
    
   .negmargintop65, .negmargintop85, .negmargintop95 {margin-top: 0px;}
   .negmarginbottom40 {margin-bottom: 0px;}    
}


 @media only screen and (min-width: 1024px) {
/* Navigation breit */
#shownav {display: none;}
        
.iconlinka {margin-right: 10px;}
     
.divlogo {position: relative; float:left;}
.contacttop {position: relative; float: right; padding-top: 15px;}
.topper:after {
  content: "";
  display: table;
  clear: both;
}     
     
nav {position: relative; z-index:99;}

nav a:link,
nav a:active,
nav a:visited {
	line-height: 100%;
	font-size: 0.85rem; 
	font-family:MontserratRegular,verdana,sans-serif;
	color: #ffffff;
    text-decoration: none;
    -webkit-transition: color 1s;
        transition: color 1s; 
}
nav a:hover {color: #ffffff; text-decoration: none;}        

nav a:link span,
nav a:active span,
nav a:visited span {font-family:MontserratSemiBold,verdana,sans-serif;}
    
.nav_icon_div {float: left; margin-bottom: 25px;} 
.nav_icon {margin-right: 10px; margin-bottom:-10px;}
     
nav ul {float:right;
    margin-right: 0px;    
    position:relative;}     
     
nav ul li {float:left;
      list-style:none;
      position:relative;
      display:inline-block; margin-right:20px;}
     
nav ul li:last-child {margin-right:0px;} 

nav ul li ul li a:hover {color: #C5AA91;}     
      
nav ul li a::after {
    padding-bottom: 0px;
    border-bottom: 1px solid #ffffff; 
    left: 50%;
    transition: width 0.3s ease 0s, left 0.3s ease 0s; 
    width: 0%;  
    content: '';
    display: block;
    position: relative;
    }
nav ul li a:hover::after {width: 100%; left: 0;} 
     
     
nav ul li ul a::after {border-bottom: 0px;}
    
nav ul li ul {display: none; position: absolute; left:0; background-color: #277ba9;}
   
nav ul li ul li {clear: both; width:100%; display: block; min-width:250px; padding-top: 0px; padding-bottom: 10px; padding-left: 15px; padding-right:50px;}
     nav ul li ul li:first-of-type {padding-top:10px;}    
     
     
nav ul li:hover > ul,
nav ul li:focus-within > ul,
nav ul li ul:hover,
nav ul li ul:focus {display: block; }     
     
nav:after {
  content: "";
  display: table;
  clear: both;}

/* DIVERSES */
    .text80p {width: 80%;}
    .text70p {width: 70%;}
    .text60p {width: 60%;}
    
    .zweispaltiger_inhalt,
    .zweispaltiger_inhalt1,
    .zweispaltiger_inhalt2
     { 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
    .zweispaltiger_inhalt {
	width: 100%; 
	}
    .zweispaltiger_inhalt1,
    .zweispaltiger_inhalt2 {
	display: inline-block;
	vertical-align: top;
	width: 100%;
	text-align: left;
	}	
    .zweispaltiger_inhalt1 {width: 48%; margin-right:3%;}
    .zweispaltiger_inhalt2 {width: 48%;}

    .colasymtitel .zweispaltiger_inhalt1 {width: 55%; margin-right:0%;}
    .colasymtitel .zweispaltiger_inhalt2 {width: 44%;}

    .colasym .zweispaltiger_inhalt1 {width: 58%; margin-right:3%;}
    .colasym .zweispaltiger_inhalt2 {width: 38%;}

    .colasym2 .zweispaltiger_inhalt1 {width: 38%; margin-right:3%;}
    .colasym2 .zweispaltiger_inhalt2 {width: 58%;}

    .colasym3 .zweispaltiger_inhalt1 {width: 28%; margin-right:3%;}
    .colasym3 .zweispaltiger_inhalt2 {width: 68%;}

    .colasym4 .zweispaltiger_inhalt1 {width: 68%; margin-right:3%;}
    .colasym4 .zweispaltiger_inhalt2 {width: 28%;}

    .dreispaltiger_inhalt,
    .dreispaltiger_inhalt1,
    .dreispaltiger_inhalt2,
    .dreispaltiger_inhalt3
     { 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
    .dreispaltiger_inhalt {
	width: 100%; 
	}
    .dreispaltiger_inhalt1,
    .dreispaltiger_inhalt2,
    .dreispaltiger_inhalt3 {
	display: inline-block;
	vertical-align: top;
	width: 100%;
	text-align: left;
	}	
    .dreispaltiger_inhalt1 {width: 30%; margin-right:4%;}
    .dreispaltiger_inhalt2 {width: 30%; margin-right:4%;}
    .dreispaltiger_inhalt3 {width: 30%;}     
}

 @media only screen and (max-width: 1305px) {
     header .topper, header nav, header .titelarea, div.container {padding-left: 25px; padding-right: 25px;}
}