@charset "utf-8";
/* CSS Document */

/* aleo-regular - latin */
@font-face {
  font-family: 'Aleo';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/aleo-v11-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/aleo-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/aleo-v11-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/aleo-v11-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/aleo-v11-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/aleo-v11-latin-regular.svg#Aleo') format('svg'); /* Legacy iOS */
}

/* walter-turncoat-regular - latin */
@font-face {
  font-family: 'Walter Turncoat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/walter-turncoat-v19-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/walter-turncoat-v19-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/walter-turncoat-v19-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/walter-turncoat-v19-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/walter-turncoat-v19-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/walter-turncoat-v19-latin-regular.svg#WalterTurncoat') format('svg'); /* Legacy iOS */
}

body, p, input, select, textarea {
	font-family: 'Aleo';
	font-style: normal;
	font-weight: 400;
	line-height: 1.4;
	color: #888888;
}

html {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	scroll-behavior: smooth;
}

form {
	margin: 0;
	padding: 0;
}

/* ---------- my-Accordion ---------- */
summary {
font-size: 18px;
font-weight: bold;
color: #888888;
cursor: pointer;
}

details {
margin-top: 20px;
margin-bottom: 20px;
padding: 10px 20px 10px 10px;
font-size: 18px;
background-color: rgba(235,200,91,0.2);
}

details[open] {
margin: 20px 0 20px 0;
padding-left: 20px;
font-size: 18px;
/* border-left: 1px solid #888888; */
}

details[open] summary {
margin-bottom: 10px;
color: #d9b955;
}
/* ---------- /my-Accordion ---------- */

.hinweis {
	margin: 0 0 20px 0;
	padding: 15px 15px 10px 15px;
	color: #d9b955;
	border-top: 1px solid #d9b955;
	border-left: 1px solid #d9b955;
}

blockquote {
	display: block;
	position: relative;
	font-family: 'Walter Turncoat';
	color: #807961;
}

blockquote::before {
	position: absolute;
	font-family: 'Walter Turncoat';
	content: '\275D';
	color: rgba(235,200,91,0.3);
}

.quotebox {
	background-color: #ffffff; /* f3e7e0 */
	
}

.quotequelle {
	padding: 5px 0 0 0;
	font-family: 'Aleo';
	font-size: 80%;
}

input, select, textarea {
	background-color: #ffffff;
	border: 1px solid #cccccc;
}

textarea {
	width: 95%;
	min-height: 200px;
	padding: 10px;
}

h1, h2, h3 {
	font-family: 'Aleo';
	font-weight: 400;
	line-height: 1.1;
	color: #d9b955;
}

ul li {
	list-style: square;
	list-style-position: outside;
	text-align: left;
}

li.seminarvorteile {
	width: 100%;
	margin: 0 0 8px 0;
	padding: 12px 5px 10px 20px;
	list-style: none;
	line-height: 1.2;
	background-image: linear-gradient(to right, #f6e4b4, #ffffff);
	border-top-left-radius: 20px 100px;
	border-left: 5px solid #888888;
	position: relative;
	animation-name: vorteildelay;
	animation-timing-function: ease-in;
	animation-duration: 0.5s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	overflow: hidden;
}

@keyframes vorteildelay {
  0%   {left: 3px; top: 0px; opacity: 0.8;}
  25% {left: 0px; top: 0px; opacity: 1;}
}

ol.uhrzeit {
	margin: 5px 0 30px 0;
	padding: 20px 20px 10px 20px;
	list-style-type: none;
	background-color: #fef9f0;
	font-size: 80%;
	line-height: 1.2;
	border: 1px solid #888888;
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
}

ol.uhrzeit li {
	padding: 0 0 10px 0;
}

a {
	text-decoration: none;
	color: #d9b955;
}

a.neutral {
	color: #888888;
}

a:hover {
	color: #d9b955;
}

.farbe {
	color: #d9b955;
}

.button {
	margin: 30px 0 30px 0;
	background-color: #d9b955;
	color: #ffffff;
	cursor: pointer;
}

a.button {
	color: #ffffff;
}

.fussbutton {
	margin: 0;
	padding: 0;
	color: #ffffff;
	border: 0;
	background: none;
	cursor: pointer;
}

.fussbutton:hover {
	color: #e9c95c;
}

.titel {
	color: #e9c95c;
}

strong {
	font-weight: 700;
}

.layout_top {
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}

.layout_bottom {
	height: 75px;
	margin: 0;
	padding: 0;
	vertical-align: top;
}

.layout {
	clear: both;
	margin: 0;
	padding: 0;
	text-align: left;
	background-color: #ffffff;
	overflow: hidden;
}

img.logo_resilienz {
  -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,.5));
  filter: drop-shadow(0 0 5px rgba(0,0,0,.5));
}

.claim, .claim2, .seitentitel {
	position: relative;
	color: #ffffff;
	text-align: left;
	font-weight: 300;
	line-height: 1.1;
	text-shadow: 2px 3px 5px #000000; 
}

.maincontent,
.rightcontent {
	float: left;
	text-align: left;
	background-color: #ffffff;
	/* border: 1px solid #ff0000; */
}

.parallax1 {
	clear: both;
	transition-duration: 0.5s;
	background-size: cover;
	background-repeat: no-repeat;
    top: 0; bottom: 0; left: 0; right: 0;
    position: fixed;
    z-index: -1;
}

.blur1 {
	-webkit-filter: blur(2px) grayscale(100%);
	-moz-filter: blur(2px) grayscale(100%);
	-ms-filter: blur(2px) grayscale(100%);
	-o-filter: blur(2px) grayscale(100%);
	filter: blur(2px) grayscale(100%);
	transition-duration: 1s;
}

.blur2 {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	transition-duration: 1s;
}

.footerbereich {
	clear: both;
	margin: 5vh auto 5vh auto;
}

.bild_inhalt {
	width: 100%;
}

.seminarbutton {
	margin: -46px 0 0 10px;
	padding: 0;
}

.seminarboxtitel {
	float: left;
	background-color: #fcf6e2;
	padding: 10px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

.seminarbox {
	clear: both;
	background-color: #f3e7e0;
	padding: 20px;
	border-top-right-radius: 10px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	overflow: hidden;
}

.seminarwahl {
	background-color: #fef9f0;
	border: 1px solid #888888;
	-moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.box_farbe {
	margin: 20px 0 20px 0;
	padding: 0 20px 10px 20px;
	background-color: rgba(235,200,91,0.2);
	overflow: hidden;
}

.box_grau {
	margin: 20px 0 20px 0;
	padding: 0 20px 10px 20px;
	background-color: rgba(0,0,0,0.03);
	overflow: hidden;
}

.formularBG {
	margin-top: 30px;
	padding: 0 20px 0 25px;
	background-color: rgba(235,200,91,0.2);
}

select,
input {
	padding: 10px;
}

.inputfeld {
	width: 95%;
	margin: 3px 0 3px 0;
}

.inputfeld_readonly {
	width: 95%;
	background-color: #eeeeee;
}

.anredefeld {
	width: 30%;
}

.teilnehmerfeld {
	width: 20%;
}

select.teilnehmerfeld {
	padding-right: 10px;
	text-align-last: right;
	direction: rtl;
}

.preisbox {
	float: right;
	margin-top: -26px;
	padding: 10px 20px 8px 20px;
	background-color: #888888; /* e9c95c */
	border-top-left-radius: 30px 100px;
	border-bottom-right-radius: 30px 100px;
	border-bottom-left-radius: 10px;
	transform: rotate(-3deg);
}

.preis {
	color: #ffffff;
}

.buchung {
	clear: both;
}

.tbl {
	width: 100%;
}

.stbl1 {
	width: 70%;
	margin: 1px;
	padding: 5px 10px 5px 10px;
	font-size: 80%;
	line-height: 1.2;
	vertical-align: middle;
	background-color: #fef9f0;
}

.stbl2 {
	width: 30%;
	margin: 1px;
	padding: 3px 10px 3px 10px;
	font-size: 80%;
	line-height: 1.2;
	vertical-align: middle;
	background-color: #fcf6e2;
}

.referenzlogos {
	float: left;
	max-width: 100%;
	margin: 20px 30px 20px 0;
}

.anfrage_content {
	width: 100%;
	padding: 30px 0 30px 0;
	text-align: center;
}

.logo {
	margin-bottom: 10px;
}

@media screen and (max-width: 960px) {
	.foto {width: 90%; margin: 20px 0 20px 10px;}
	html {margin-top: 95vh;}
	.layout_top {height: 5vw;}
	.layout {padding: 0 0 20px 0;}
	.logo_bereich, .layout_top, .layout_bottom, .layout {width: 100%;}
	.logo {width: 45vw;}
	body, p, input, select, textarea {font-size: 18px;}
	p {margin: 0; padding: 0 0 20px 0;}
	.kleingedrucktes {font-size: 11px;}
	blockquote {font-size: 18px;}
	blockquote::before {top: -60px; left: -55px; font-size: 125px;}
	.quotebox {margin: 10px 0 30px 0;}
	h1 {margin: 0; padding: 20px 0 10px 0; font-size: 26px;}
	h2 {margin: 0; padding: 20px 0 10px 0; font-size: 21px;}
	h3 {margin: 0; padding: 10px 0 5px 0; font-size: 21px;}
	ul {margin: 0 0 0 20px; padding: 0;}
	li {padding: 0 0 5px 0;}
	.logo_bereich {padding: 75px 0 50px 0; text-align: center; width: 100%;}
	/* .logo_resilienz {margin-left: -5vw; width: 65vw;} */
	.logo_resilienz {margin-left: -8vw; width: 65vw;}
	.claim {top: 71vh; left: 1vw; width: 75vw; font-size: 5vw;}
	.seitentitel {top: 190px; left: 80px; width: 50vw; font-size: 260%;}
	.titel {padding-top: 7px; font-size: 20px; font-weight: 400;}
	.maincontent {clear: both; padding: 30px 10vw;}
	.seminarboxtitel {width: 90%;}
	.seminarwahl {width: 100%;}
	.rightcontent {clear: both; padding: 30px 10vw;}
	.bild_leftcontent {max-width: 80%;}
	.bild_inhalt {max-width: 100%;}
	.bildvorschau_seminar {margin: 0; padding: 0; width: 320px;}
	.parallax1 {height: 100vh; background-image: url("../images/parallax_motiv01_klein.jpg"); background-position: center;}
	.button {padding: 10px 20px;}
	.seminarbild {width: 100%;}
	.preis {font-size: 125%;}
	.seminarvorteile_bereich {margin: 30px 0 -60px 10px; width: 80%;}
	.checkvorteile_bereich {margin: 20px 0 -50px 10px; width: 80%;}
}

@media screen and (min-width: 650px) and (max-width: 960px) {
	.logo {width: 300px;}
}

@media screen and (min-width: 960px) and (max-width: 1600px) {
	.foto {width: 75%; margin: 0 auto 20px auto;}
	html {margin-top: 86vh;}
	.layout_top {height: 57px;}
	.layout {padding: 0 0 0 0;}
	.logo_bereich, .layout_top, .layout_bottom, .layout {width: 960px;}
	.logo {width: 90%;}
	body, p, input, select, textarea {font-size: 18px;}
	p {margin: 0; padding: 0 0 20px 0;}
	.kleingedrucktes {font-size: 12px;}
	blockquote {font-size: 18px;}
	blockquote::before {top: -75px; left: -55px; font-size: 150px;}
	.quotebox {margin: 20px 0 35px 0;}
	h1 {margin: 0; padding: 30px 0 20px 0; font-size: 28px;}
	h2 {margin: 0; padding: 30px 0 20px 0; font-size: 24px;}
	h3 {margin: 0; padding: 20px 0 10px 0; font-size: 20px;}
	ul {margin: 0 0 0 1vw; padding: 0;}
	li {padding: 0 0 5px 0;}
	.logo_bereich {float: left; width: 230px; padding: 15px 10px 0 20px;}
	.logo_resilienz {margin-left: -2.5vw; width: 26vw;}
	/* .logo_resilienz {margin-left: -1vw; width: 26vw;} */
	.claim {position: fixed; top: 55vh; left: 10vw; width: 35vw; font-size: 2.5vw;}
	.seitentitel {top: 19vw; left: 28vw; width: 30vw; font-size: 260%;}
	.titel {padding-top: 0.4vw; font-size: 2.3vw; font-weight: 400;}
	.maincontent {width: 460px; padding: 30px 30px 20px 20px;}
	.bild_inhalt {max-width: 460px;}
	.bildvorschau_seminar {margin: 0; padding: 0; width: 170px;}
	.rightcontent {width: 170px;}
	.bild_leftcontent {max-width: 100%;}
	.parallax1 {height: 100vh; background-image: url("../images/parallax_motiv01_gross.jpg"); background-position: center 15%;}
	.button {padding: 0.5vw 1.2vw;}
	/* .seminarbild {float: left; padding-right: 15px; width: 200px;} */
	.seminarbild {width: 100%;}
	.preis {font-size: 125%;}
	.seminarvorteile_bereich {margin: 102px 0 0 -5px; width: 100%;}
	.checkvorteile_bereich {margin: 30px 0 0 -5px; width: 100%;}
}

@media screen and (min-width: 1600px) {
	.foto {float: right; max-width: 260px; margin: 0 0 10px 20px;}
	html {margin-top: 90vh;}
	.layout_top {height: 75px;}
	.layout {padding: 0 0 0 0;}
	.logo_bereich, .layout_top, .layout_bottom, .layout {width: 1280px;}
	.logo {width: 200px;}
	body, p, input, select, textarea {font-size: 19px;}
	p {margin: 0; padding: 0 0 20px 0;}
	.kleingedrucktes {font-size: 12px;}
	blockquote {font-size: 19px;}
	blockquote::before {top: -75px; left: -55px; font-size: 150px;}
	.quotebox {margin: 20px 0 35px 0;}
	h1 {margin: 0; padding: 30px 0 20px 0; font-size: 35px;}
	h2 {margin: 0; padding: 30px 0 20px 0; font-size: 24px;}
	h3 {margin: 0; padding: 20px 0 10px 0; font-size: 24px;}
	ul {margin: 0 0 0 20px; padding: 0;}
	li {padding: 0 0 5px 0;}
	.logo_bereich {float: left; width: 230px; padding: 15px 0 0 30px;}
	/* .logo_resilienz {margin-left: -1vw; width: 26vw;} */
	.logo_resilienz {margin-left: -2.8vw; width: 26vw;}
	.claim {float: left; top: 53vh; padding-left: 10vw; width: 30vw; font-size: 2.3vw;}
	.seitentitel {top: 21vw; left: 21vw; width: 30vw; font-size: 260%;}
	.titel {padding-top: 0.4vw; font-size: 1.7vw; font-weight: 400;}
	.maincontent {width: 630px; padding: 30px 50px 30px 30px;}
	.rightcontent {width: 230px;}
	.bild_leftcontent {max-width: 100%;}
	.bild_inhalt {max-width: 550px;}
	.bildvorschau_seminar {margin: 0; padding: 0; width: 280px;}
	.parallax1 {height: 100vh; background-image: url("../images/parallax_motiv01_gross.jpg"); background-position: center 10%;}
	.button {padding: 0.5vw 1.2vw;}
	/* .seminarbild {float: left; padding-right: 20px; width: 260px;} */
	.seminarbild {width: 100%;}
	.preis {font-size: 125%;}
	.seminarvorteile_bereich {margin: 120px 0 0 -20px; width: 100%;}
	.checkvorteile_bereich {margin: 40px 0 0 -20px; width: 100%;}
}

.error {
	background-color: #fdece5 !important;
	border: 1px dotted #ff0000 !important;
}

.error-nachricht {
	margin-bottom: 20px;
    padding: 15px 20px 12px 20px;
    background-color: #ff0000;
	color: #ffffff;
}

.box_Returnhtml {
	margin-bottom: 30px;
	padding: 20px;
	color: #ffffff;
	background-color: #d9b955;
	border-top-left-radius: 300px 10px;
	border-bottom-right-radius: 300px 10px;
}

.alertcolor {
	color: #ff0000;
}
