/* // Basislayout /////////////////////////////////////////////////////////// */
html {font-family:'Roboto',sans-serif;font-size:16px;line-height:1.4;margin:0;border:0;padding:0;min-height:100.1%;scroll-behavior:smooth;}
body {font-size:100%;margin:0;border:0;padding:0;}

/* // Tags // */
h1 {font-family:'Roboto Condensed',sans-serif;font-weight:700;font-size:25px;color:#008ed2;margin:0 0 1em 0;}
h2 {font-family:'Roboto Condensed',sans-serif;font-weight:300;font-size:20px;color:#fff;display:block;margin:0.5em 0 2em 0;padding:0;color:#000;}
h3 {font-family:'Roboto Condensed',sans-serif;font-weight:300;font-size:20px;color:#fff;display:inline-block;margin:0.5em 0 0 0;padding:0.25em 1em;background-color:#008ed2;}
a {text-decoration:none;color:inherit;transition:all 0.25s ease;}
a:hover {}
strong {font-weight:600;}
h2 strong {font-weight:700;}
figcaption {margin-top:1em;}
figure {display:block;margin:0;padding:0;}
img {display:block;width:auto;max-width:100%;height:auto;}
sup {font-size:0.5em;line-height:0.5;margin:-1px 0 0 1px;}
sub {font-size:0.5em;line-height:0.5;margin:0 0 1px 1px;}

/* // Klassen // */
.invisible {display:block;position:absolute;top:-3000px;left:-3000px;width:1px;height:1px;text-indent:20px;overflow:hidden;}

/* // Header //////////////////////////////////////////////////////////////// */
#header {display:block;position:relative;}
.logo {display:block;position:absolute;z-index:100;top:3em;left:0;width:100%;transition:all 0.25s ease;}
.logo figure {margin:0 auto 0 0;padding:0 0 0 4%;width:128px;height:auto;transition:all 0.25s ease;}
.titelbild {display:block;position:relative;z-index:1;}
.seitentitel {position:relative;margin-top:3em;width:100%;transition:all 0.25s ease;}
.seitentitel h1 {font-size:25px;line-height:1;color:#fff;display:block;margin:0;transition:all 0.25s ease;}
.seitentitel h1 span {display:inline-block;padding:0.3em 0.5em 0.1em 4%;background-color:#008ed2;}
.seitentitel h1 span.second {padding-top:0;padding-bottom:0.2em;}

@media screen and (min-width:520px) {
	.logo figure {font-size:30px;width:192px;}
	.seitentitel h1 {font-size:30px;}
}

@media screen and (min-width:800px) {
	.logo figure {font-size:45px;width:256px;}
	.seitentitel h1 {font-size:45px;}
}

@media screen and (min-width:1080px) {
	.logo {top:5em;}
	.seitentitel {margin-top:5em;}
	.logo figure,
	.seitentitel h1 {font-size:60px;}
}

@media screen and (min-width:1300px) {
	.logo figure,
	.seitentitel h1 {font-size:75px;}
}

/* // Main ////////////////////////////////////////////////////////////////// */
section {position:relative;}
section.odd {background-color:#e5edf5;}
section .inside {margin:3em auto;width:90%;max-width:1048px;}
section.haus-arbeit .inside,
section.infos .inside {margin:0 auto;width:90%;max-width:1048px;}
section.odd .inside {padding:3em 0;}
section .spalte.rechts {margin-top:2em;}
section.kontakt > .inside > h1 {font-size:25px;line-height:1.2;}

@media screen and (max-width:520px) {
	.infos h1 {font-size:15px;}

}


/* // Kontaktbutton // */
.kontaktbutton {position:fixed;bottom:0;right:0;z-index:10000000;width:256px;height:auto;}

@media screen and (max-width:720px) {
	.infos figure {display:block;width:100%;overflow:hidden;}
	.infos img {width:150%;max-width:none;margin:0 -25%;}

}

@media screen and (min-width:720px) {
	section.kontakt > .inside > h1 {font-size:38px;}

}

@media screen and (min-width:960px) {
  section .inside {margin:6em auto;}
  section.haus-arbeit .inside,
  section.infos .inside {margin:0 auto;}
  section.odd .inside {padding:6em 0;}
  section > .inside > .spalte {display:inline-block;vertical-align:top;margin:0;width:calc(50% - 4px - 12px);}
  section > .inside > .spalte.links {margin-right:12px;}
  section > .inside > .spalte.rechts {margin-left:12px;}
  section.technik .spalte.rechts {margin-top:0;}
  section.kontakt > .inside > h1 {font-size:50px;}
  .kontaktbutton {width:384px;bottom:0;}
}

@media screen and (min-width:1200px) {
  .kontaktbutton {width:512px;bottom:0;}
}

section .box {display:inline-block;vertical-align:top;margin-left:24px;width:calc(50% - 4px - 12px);}
section .spalte > .box:first-child {margin-left:0;}
section .box figure .icon {float:left;margin-top:0.5em;margin-right:24px;width:38px;height:38px;}
section .box p span {font-family:'Roboto Condensed',sans-serif;font-weight:300;color:#008ed2;}

section hr {border:0;border-top:1px solid #008ed2;padding:1em 0;}

section.design p {text-align:center;margin-left:-3em;}

section.vorteile .inside {margin-bottom:0;}

.section.bilder {display:flex;margin:0;padding:0;width:100%;list-style:none;}
.section.bilder figure {display:block;width:50%;}
.section.bilder img {width:auto;max-width:100%;height:auto;}

#firstsection .inside {margin-top:0;}

.loesungen h1 {font-size:18px;line-height:1.1;margin-bottom:0;}
.loesungen h2 {font-size:25px;line-height:1.1;color:#008ed2;}

.vollbild .loesungen h1 {position:absolute;z-index:10000;top:1em;left:0;width:100%;text-align:center;color:#fff;}
.vollbild .loesungen h1 span {display:inline-block;padding:0.3em 0.5em 0.1em 0.5em;background-color:#008ed2;}

.spalte.links h1,
.spalte.rechts h1 {font-size:18px;margin-bottom:0.5em;}

@media screen and (min-width:520px) {
	.loesungen h1 {font-size:25px;line-height:1.1;margin-bottom:0;}
	.vollbild .loesungen h1 {top:1em;left:0;width:100%;text-align:center;color:#fff;}
	.vollbild .loesungen h1 span {display:inline-block;padding:0.3em 0.5em 0.1em 0.5em;background-color:#008ed2;}
	.spalte.links h1,
	.spalte.rechts h1 {font-size:25px;}
}

@media screen and (min-width:800px) {
	.loesungen h1 {font-size:30px;line-height:1.1;margin-bottom:0;}
	.vollbild .loesungen h1 {position:absolute;z-index:10000;top:2em;left:0;width:100%;text-align:center;color:#fff;}
	.vollbild .loesungen h1 span {display:inline-block;padding:0.3em 0.5em 0.1em 0.5em;background-color:#008ed2;}
	.spalte.links h1,
	.spalte.rechts h1 {font-size:30px;margin-bottom:1em;}
}

@media screen and (min-width:1080px) {
	.loesungen h1 {font-size:35px;line-height:1.1;margin-bottom:0;}
	.vollbild .loesungen h1 {position:absolute;z-index:10000;top:3em;left:0;width:100%;text-align:center;color:#fff;}
	.vollbild .loesungen h1 span {display:inline-block;padding:0.3em 0.5em 0.1em 0.5em;background-color:#008ed2;}
	.spalte.links h1,
	.spalte.rechts h1 {font-size:35px;}
}

@media screen and (min-width:1300px) {
	.loesungen h1 {font-size:40px;line-height:1.1;margin-bottom:0;}
	.vollbild .loesungen h1 {position:absolute;z-index:10000;top:3em;left:0;width:100%;text-align:center;color:#fff;}
	.vollbild .loesungen h1 span {display:inline-block;padding:0.3em 0.5em 0.1em 0.5em;background-color:#008ed2;}
	.spalte.links h1,
	.spalte.rechts h1 {font-size:40px;}
}




.infos {background-image:url('../img/hg-verlauf.png');background-repeat:repeat-y;}
.infos figure {padding:6em 0;}
.infos a:hover {cursor:pointer;}

.bannerlinkscategory figure {position:relative;}
.bannerlinkscategory .linktext {position:absolute;z-index:10000;top:0;left:0;width:100%;height:100%;transition:top 0.4s ease;}
.bannerlinkscategory a:hover .linktext {top:10px;}



/* Flexslider */
.flexslider {margin:0;width:100%;background:none;border:0;border-radius:0;box-shadow:0;}
.flexslider .flex-direction-nav a:before {content:url('../img/pfeil-prev.svg');display:block;width:15px;margin:0 0 0 auto;height:auto;}
.flexslider .flex-direction-nav a.flex-next:before {content:url('../img/pfeil-next.svg');margin:0 auto 0 0;}

@media screen and (max-width:720px) {
  .flexslider .flex-direction-nav {display:none;}
}

/* // Footer //////////////////////////////////////////////////////////////// */
.fusszeile {margin:3em auto;width:90%;max-width:1048px;}
.fusszeile p {font-family:'Roboto Condensed',sans-serif;font-weight:300;font-size:14px;margin:0;color:#008ed2;text-align:center;}