/* normalize */
html { font-family: sans-serif; line-height: 1.15; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
audio:not([controls]) { display: none; height: 0; }
[hidden], template { display: none; }
a { background-color: transparent; }
a:active, a:hover { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
dfn { font-style: italic; }
mark { background: #F7DD45; color: #000; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
img { border-style: none; }
svg:not(:root) { overflow: hidden; }
hr { box-sizing: content-box; height: 0; overflow: visible; }
pre { overflow: auto; font-family: monospace, monospace; font-size: 1em; }
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button, input { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; border-radius: 0;}
select { border-radius: 0;}
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; border-radius: 0; -webkit-appearance: none !important; cursor:pointer;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
input[type="submit"]{-webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
legend { border: 0;  padding: 0; }
textarea { overflow: auto; }
optgroup { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0;}
td, th { padding: 0; }
::-moz-selection {background: #b7e6f8; text-shadow: none; }
audio, canvas, iframe, svg, video { vertical-align: middle; }
img { vertical-align: top; }
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }
.hidden, .invisible { display: none !important; }
.clearfix:before, .clearfix:after { content: " ";  display: table; }
.clearfix:after, .clear { clear: both; }
/* nur safari */
* {-webkit-tap-highlight-color: rgba(0,0,0,0);}
svg:not(:root) { overflow: hidden; }

/* allgemein */
* { margin:0; padding:0; border:0; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html,body { height:100%; width:100%; }
html { font-size:100%;  }
a {text-decoration:none; -webkit-transition:all 0.3s ease-out; transition:all 0.3s ease-out; display:inline-block; color:#03637a;}
a:hover {color:#74c3cf;}
*:focus  { outline: 0; }
ul, ol { margin: 0; padding: 0 ; }
.ce_text ul li {margin:5px 0 5px 22px;}
nav ul { list-style: none; list-style-image: none; }
.transit, input.submit, a img, a h2 {-webkit-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}

/* fonts */
@font-face { font-display: swap; font-family: 'robotolight'; font-style: normal; font-weight: 300; src: url('../../files/system/css/fonts/roboto-v32-latin-300.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'robotoregular'; font-style: normal; font-weight: 400; src: url('../../files/system/css/fonts/roboto-v32-latin-regular.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'robotobold'; font-style: normal; font-weight: 700; src: url('../../files/system/css/fonts/roboto-v32-latin-700.woff2') format('woff2'); }
/* pt-serif-regular - latin */
@font-face { font-display: swap; font-family: 'PT Serif'; font-style: normal; font-weight: 400; src: url('../../files/system/css/fonts/pt-serif-v18-latin-regular.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'PT Serif'; font-style: normal; font-weight: 700; src: url('../../files/system/css/fonts/pt-serif-v18-latin-700.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'PT Serif'; font-style: italic; font-weight: 400; src: url('../../files/system/css/fonts/pt-serif-v18-latin-italic.woff2') format('woff2'); }
@font-face {-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; }

:root {	
	--padding144:144px 0;
	--padding100:100px 0;
	--padding80:80px 0;
	--padding40:0 40px;
   	--dark_blue:#03637a;
	--light_blue:#74c3cf;
}

body {color:#023f4e; background:#fff; font-family: 'robotolight', Helvetica, sans-serif;  -webkit-font-smoothing: antialiased;	-moz-osx-font-smoothing: grayscale;	font-smoothing: antialiased; font-size:1.25rem; line-height:1.5;}
.wrap { min-height:100%;}
.fade_in { opacity: 0; transition:all .5s ease-out;}
.fade_in_slow { opacity: 0; transition:all .5s ease-out .75s;}
.fade_out { opacity: 1; transition:all .5s ease-out;}
.fade_left { transition:all .5s ease-out; transform: translateX(-10px); opacity: 0; }
.fade_right { transition:all .5s ease-out; transform: translateX(10px); opacity: 0; }
.fade_up { transition:all .5s ease-out; transform: translateY(10px); opacity: 0; }
.show.fade_in, .show.fade_in_slow, .show.fade_left, .show.fade_right, .show.fade_up { transform: translate(0px,0px) scale(1.0) rotate(0deg)!important; opacity: 1!important; }
.show.fade_out { opacity: 0!important; }

b, strong, .bold { font-family: "robotobold"; }
.center {max-width:1360px; margin:0 auto; position:relative; padding:0 80px;}
.wide {max-width:1480px; margin:0 auto; position:relative; padding:0 80px;}
.hidden { display: none; }

/* header */
header {position:fixed;z-index:100; top:0; width:100%; height:150px; background:#fff; -webkit-transition:all 0.3s ease-out;  transition:all 0.3s ease-out;}
.down header { margin-top:-100px; height:100px; }
.up header {margin-top:0px; height:100px; box-shadow: 0px 0px 8px 2px rgba(0,0,0,.1);}
.nav_active header, .up.nav_active header, .down.nav_active header { margin-top:0px; }
.logo {position:relative; float:left; margin-top:35px;}
.logo:hover {opacity:.6;}

/* navigation */
.navigation {float:left; margin-top:60px;}
.down header .navigation, .up header .navigation {margin-top:40px;}
.down header .logo, .up header .logo {margin-top:13px;}
.menu { font-family: 'robotoregular'; font-size:1.125rem; line-height:30px; text-transform:uppercase;}
.menu li { display:inline; position:relative; margin-left:50px; } 
.menu .level_2 {position:absolute; top:30px; left:-10px; width:230px; background:#fff; padding:5px 10px 10px; -webkit-transition:all 0.3s ease-out;  transition:all 0.3s ease-out; opacity:0; }
.down header .menu .level_2 {display:none;}
.menu .level_1 li:hover .level_2 {opacity:1; }
.menu .level_2 li { display:block; margin-left:0; } 
.menu a {position:relative; color:var(--dark_blue); }
.no-touchevents .menu a:hover, .menu li.active .active {color:var(--light_blue); }
.menu a:after { content: ""; z-index:-1; position: absolute; width:0%; height:1px; bottom: 0px; left: 0; background: #74c3cf; visibility: hidden; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.25s ease-in-out 0s; }
.menu a:hover:after { visibility: visible; width: 100%; }
.menu .level_2 a:hover:after { visibility: hidden; width: 0; }
.menu li.active {position:relative;}
.menu li.active:after { content: ""; z-index:-1; position: absolute; width:100%; height:1px; bottom: 0px; left: 0; background: #74c3cf; }
.menu .level_2 li.active:after { width:0;  }
.header_kontakt {float:right; text-align:right; position:relative; color:#03637a; font-family: 'robotobold'; font-size:.85rem; margin-top:44px;}
.down header .header_kontakt, .up header .header_kontakt {margin-top:22px;}
.header_kontakt .telefon:before {content:url('../../files/system/images/tel3.png'); position:relative; margin-right:5px; top:1px; }
.header_kontakt .email_link:before {content:url('../../files/system/images/mail3.png'); position:relative; margin-right:5px; top:2px;}
nav li.active strong { font-family: "robotoregular"; font-weight:400; }

/* hamburger mobile */
.hamburger { position:absolute;  z-index:100; right:40px; top:35px; width: 30px; height: 18px; display:none; cursor: pointer; background:transparent; }
.hamburger .line { display: block; background: #03637a; width: 30px; height: 3px; position: absolute; left: 0; border-radius: 0px; transition: all 0.4s;
  -webkit-transition: all 0.4s;  -moz-transition: all 0.4s;}
.hamburger .line.line-1 { top: 0;}
.hamburger .line.line-2 {top: 50%;  width: 25px;}
.hamburger .line.line-3 {top: 100%;}
.hamburger:hover .line-1, .hamburger:focus .line-1 {  }
.hamburger:hover .line-3, .hamburger:focus .line-3 { }
.hamburger.active .line-1 { transform: translateY(9px) translateX(0) rotate(45deg); -webkit-transform: translateY(9px) translateX(0) rotate(45deg); -moz-transform: translateY(9px) translateX(0) rotate(45deg); background: #fff;}
.no-touchevents .hamburger:hover .line-2 {width: 30px;}
.hamburger.active .line-2 { opacity: 0;}
.hamburger.active .line-3 { transform: translateY(-9px) translateX(0) rotate(-45deg);  -webkit-transform: translateY(-9px) translateX(0) rotate(-45deg);  -moz-transform: translateY(-9px) translateX(0) rotate(-45deg); background: #fff;}

/* main */
h1, h2, h3, h4, h5, h6 { font-family: 'PT Serif'; font-style: normal; font-weight:400; line-height:1.4;}
h1 {font-size:2.5rem; text-align:center; margin-bottom:50px;}
h2 {font-size:2.5rem; margin-bottom:20px;}
h3 {font-size:2.25rem; margin-bottom:20px; }

h4.caption {font-size:1.5rem; }
main {position:relative; z-index:2; padding-top:150px; }
.up main, .down main {padding-top:100px;}
img {max-width:100%; height:auto;}
section {position:relative; }
.ce_text ul li, .content-text ul li {position:relative; margin:0 0 5px 20px;}

.button {position:relative; background:#48bcc0; color:#fff; font-family: 'robotoregular'; font-size:1.25rem; padding:10px 60px 10px 20px; text-decoration:none !important;}
.button:hover {background:#03637a; color:#fff;}
.button:after {content:url("../../files/system/images/pfeil.png"); position:absolute; right:20px; top:12px;}

.padding100 {padding:var(--padding100);}
.padding144 {padding:var(--padding144);}
.padding80 {padding:var(--padding80);}
.padding40 {padding:var(--padding40);}

.center_text {text-align:center;}
.center_text .nutzen {text-align:left;}

/* footer */
footer {position:relative; padding:60px 0; width:100%; background:#03637a; color:#fff; font-family: 'robotoregular'; font-size:1.125rem; }
footer .wide{ display:grid; grid-template-columns: repeat(2, 1fr); gap:24px;}
footer a {color:#fff;}
footer a:hover {color:#2edee4;}
.footer_menu li {display:inline; margin-right:30px;}
.footer_menu a { color:#2edee4;}
.adressen{ display:grid; grid-template-columns: repeat(2, 1fr); gap:24px;}
.logos {margin-top:50px;}
.logos img {margin:20px 20px 0 0; height:100px; width:auto;}
.legal_nav1 {display:block;}
.legal_nav2 {display:none;}
.footer_kontakt .telefon:before {content:url('../../files/system/images/tel-white.png'); position:relative; margin-right:5px; top:1px; }
.footer_kontakt .email:before {content:url('../../files/system/images/mail-white.png'); position:relative; margin-right:8px; top:2px;}

/* allg */
.media--left picture img {float:left; margin:0 48px 24px 0;}
.media--right picture img {float:right; margin:0 0 24px 24px;}

/* home */
.intro_image {position:relative; width:100%; aspect-ratio: 2/1; overflow:hidden; }
.intro_image picture {position:absolute; width:100%; height:100%; overflow:hidden;}
.intro_image picture img { position:absolute; width:100%; height:100%; object-fit: cover;  }
.fullimage .intro_image {position:relative; width:100%; aspect-ratio:auto; overflow:hidden; }
.fullimage .intro_image picture {position:relative; width:100%; height:auto; }
.fullimage .intro_image picture img { position:relative; width:100%; height:auto;   }
.slogan {position:absolute; bottom:40%; width:960px; left:50%; margin-left:-480px; text-align:center; color:#fff; }
.slogan h3 {color:#fff; font-size:2.5rem; font-weight:700; line-height:1.3; text-shadow: 0 0 10px #333;}
p.author {font-family: 'PT Serif'; font-style: italic; font-size:1.5rem; }
h1 span.author {font-family: 'PT Serif'; font-style: italic; font-size:1.5rem; }
.welcome h1 { padding:0 50px; margin-bottom:50px;}
.intro {display:grid; grid-template-columns: 400px auto; gap:48px;}
.intro.media--left picture img {margin:0 48px 24px 0;}

.fragen {background:#e5f1f0 url("../../files/system/images/acc_back.png") no-repeat left top;  padding:150px 0;}
.fragen .wide{ display:grid; grid-template-columns: repeat(2, 1fr); }
.prozess {background:var(--dark_blue); text-align:center; color:#fff; font-family: 'PT Serif'; font-size:1.75rem;}
.workshops {position:relative; text-align:center; }
.workshops .background {position:absolute; width:100%; height:100%; top:0; left:0; z-index:-1; }
.workshops .background img {object-fit: cover; width:100%; height:100%; }
.workshops .background .trans { position:absolute; width:100%; height:100%; top:0; left:0; background:rgba(255,255,255,.85);}
.intuition, .zitat-dunkel {background:var(--dark_blue) url("../../files/system/images/klecks-rechts.png") no-repeat right top;  text-align:center; color:#fff; }
.boxen { background:#e5f1f0;}
.angebote { background:#e5f1f0 url("../../files/system/images/angebote_back_rechts.png") no-repeat right top;}
.boxen .wide { display:grid; grid-template-columns: repeat(4, 1fr); gap:24px; }
.box {position:relative;}
.box picture {position:relative; width:100%; aspect-ratio: 4 / 3; overflow:hidden;}
.box picture img {width:100%; height:auto; object-fit: cover;}
.box a {text-transform:uppercase; position:relative; width:100%; }
.zitat {text-align:center; background:#e5f1f0 url("../../files/system/images/klecks-links.png") no-repeat left top; }
.zitat h3 {padding:0 48px;}

/* accordion */
.ce_accordion { margin-bottom:30px; background:#fff; padding:20px;}
.ce_accordion .toggler { position:relative; font-family: 'PT Serif'; font-size:2.25rem; cursor:pointer; display:block; padding-right:50px;}
.ce_accordion .toggler:after {position:absolute; right:0; top:0; width:50px; height:50px; border-radius:50%; background:var(--dark_blue); color:#fff; line-height:48px; text-align:center; content: "+"; font-family: 'robotoregular'; font-size:40px; }
.ce_accordion .toggler:hover {}
.ce_accordion .toggler.on:after {content: "–";}
.ce_accordion .accordion { padding:40px 0 20px;}
.ce_accordion .accordion a, .ce_text a {text-decoration:underline;}
.index .ce_accordion {background:none; padding:0 0 30px; border-bottom:1px solid var(--dark_blue);}

/* sonst */
.float_right {float:right; }
.float_right img { margin:0 0 20px 20px; }
.float_left {float:left; }
.float_left img { margin:0 20px 20px 0; }
.text_center {text-align:center;}
.angebote h2 {margin-bottom:30px;}
.nutzen {border:10px solid #e5f1f0; display:inline-block; padding:20px;}
.inspirationen .content-text {background:#fff; padding:20px; margin-bottom:24px;}
.zentrieren {text-align:center;}
.content-text a {text-decoration:underline;}

/* kontakt */
input, textarea {border:1px solid #74c3cf; width:100%; height:40px; padding-left:5px; margin-bottom:10px;}
textarea {height:150px;}
.widget-checkbox legend {display:none;}
.widget-checkbox input {width:30px; height:30px; float:left; margin-right:10px;}
label {display:block;}
form {max-width:600px;}
button.submit {background:#74c3cf; color:#fff; font-family: 'robotoregular'; margin-top:20px; padding:10px 20px;}
button.submit:hover {background:#03637a; color:#fff;}



/* responsive */
@media (max-width: 1300px) {
	.main_menu li { margin-left:30px; } 
	.boxen .wide { display:grid; grid-template-columns: repeat(2, 1fr); gap:48px; }
}
/* nav break */
@media (max-width: 1250px) {
	header {height:100px;}
	main {padding-top:100px; }
	header .logo, .down header .logo, .up header .logo {margin-top:20px;}
	.header_kontakt {float:left; text-align:left; margin-left:50px; margin-top:28px;}
	.hamburger {display:block;}
	.navigation {position:fixed; float:none; z-index:90; top:0; margin-top:0; left:100%; width:50%; height:100vh; background:#03637a; text-align:center; -webkit-transition:all 0.5s ease-out; -moz-transition:all 0.5s ease-out; -o-transition:all 0.5s ease-out; transition:all 0.5s ease-out; }
	.down header .navigation, .up header .navigation {margin-top:0;}
	.navigation.active { left:50%;}
	.menu { float: none; font-size:1.25rem; margin: 100px 40px 50px 0;}
	.menu li { display:block; margin-left:0; margin:10px 0;}
	.menu .level_2 {position:relative; background:transparent; padding:0 0 10px; left:auto; width:auto; top:0; text-transform:none; opacity:1;}
	.menu li a {color:#fff;}
	.menu a:after { content: ""; position: absolute; width:0; height:0; bottom: 0px; left: 0; background:transparent; }
	.menu a:hover:after { visibility: hidden; width: 0; }
	.menu li.active:after { content: ""; z-index:-1; position: absolute; width:0; height:0; bottom: 0px; left: 0; background:transparent; }
	.overflowbox {position: absolute; height:100vh; width:100%; text-align:right; overflow:auto;}
}
@media (max-width: 1024px) { 
	.center, .wide { padding:0 60px;}
	.slogan {position:absolute; bottom:0; width:100%; left:0; margin-left:0; text-align:center; padding:0 40px 80px;}
}
@media (max-width: 960px) {
	.welcome h1 { padding:0;}
	.intro {display:block; }
	.intro figure {position:relative; float:left; width:30%; margin:0 36px 0px 0;}
	.intro figure img {position:relative; width:100%; height:auto;}
	.fragen .wide { display:block;  }
	.fragen .accordeons {margin-top:50px;}
	.ce_accordion .toggler {font-size:1.75rem;}
	.boxen .wide { gap:24px; }
	footer .wide { display:grid; grid-template-columns: repeat(1, 1fr); gap:48px; }
	.adressen{ display:grid; grid-template-columns: repeat(1, 1fr); gap:24px;}
	.logos img {height:90px; margin:10px 10px 0 0;}
	.legal_nav1 {display:none;}
	.legal_nav2 {display:block;}
	.zitat h3 {padding:0 24px;}
}
@media (max-width: 800px) {
	.center, .wide { padding:0 40px;}
	.slogan h3 {font-size:2rem; top:20px;}
	.intro_image {aspect-ratio: 4/3;  }
}
.intro.media--left picture img {margin:0 48px 24px 0;}
@media (max-width: 750px) {
	.intro.media--left picture img { float:none; margin:0 0 24px 0;}
	.header_kontakt {display:none;}
}
@media (max-width: 600px) { 
	:root {	
		--padding144:80px 0;
		--padding100:80px 0;
		--padding80:60px 0;
	}
	header {height:80px; }
	.down header { margin-top:-80px; height:80px; }
	.up header { height:80px; }
	main {padding-top:80px;}
	.main_menu { margin: 100px 30px 50px 0;}
	.center, .wide { padding:0 30px;}
	.hamburger, .hamburger.is-active {right:30px; top:28px;}
	.navigation {width:100%;}
	.navigation.active { left:0;}
	.logo img {width:150px; height:auto;}
	header .logo, .down header .logo, .up header .logo {margin-top:15px;}
	.intro figure {position:relative; float:none; width:100%; margin:0 0 36px 0;}
	h1 {font-size:2rem;}
	h2, h3, .ce_accordion .toggler {font-size:1.75rem;}
	.slogan h3 {font-size:1.25rem; margin-bottom:5px;}
	.slogan p.author {font-size:1.125rem; }
	.boxen .wide { display:grid; grid-template-columns: repeat(1, 1fr); gap:30px; }
	.ce_accordion .toggler:after {position:absolute; right:0; top:5px; width:30px; height:30px; border-radius:50%; background:var(--dark_blue); color:#fff; line-height:28px; text-align:center; content: "+"; font-family: 'robotoregular'; font-size:20px; }	
	.accordion .float_right, .accordion .float_left {float:none; }
	.accordion .float_right img, .accordion .float_left img { margin:0 0 20px 0; }	
	.zitat h3 {padding:0;}
	.logos img {height:80px; margin:10px 10px 0 0;}
}
@media (max-width: 500px) {

}
@media (max-width: 400px) { 
	h2, h3, .ce_accordion .toggler {font-size:1.5rem;}
}
/* print */
@media print {
	body {font-size:0.9em;}
	header, footer {display:none;}
	.print_button {display:none !important;}
	.print {visibility:visible;}
    *, *:before, *:after, *:first-letter, *:first-line { background: transparent !important;color: #000 !important; box-shadow: none !important; text-shadow: none !important; }
    a,a:visited { text-decoration: underline;}
    a[href]:after {content: " (" attr(href) ")"; }
    abbr[title]:after {content: " (" attr(title) ")";}
	a[href^="#"]:after, a[href^="javascript:"]:after {  content: ""; }
    pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
    thead { display: table-header-group;}
    tr,img {page-break-inside: avoid;}
    img {max-width: 100% !important; }
    p,h2,h3 {orphans: 3;widows: 3;}
    h2, h3 {page-break-after: avoid;}
}