@import 'fonts.css';
:root {
	--blue:#1e90ff;
	--white:rgba(255,255,255,1);
	--white80:rgba(255,255,255,0.8);
	--white65:rgba(255,255,255,0.65);
	--black:rgba(0,0,0,0.7);
	--edencolor:#04B0E0;
	--edenbgcolor:#04B0E0;
	--bgbody:rgba(0,0,0,0.0);
	--hcolor:rgba(0,0,0,0.6);
}

* {border-radius: 0;}
html{font-size:100%;-webkit-text-size-adjust:100%;font-variant-ligatures:none;-webkit-font-variant-ligatures:none;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased;-webkit-font-smoothing:antialiased;text-shadow:rgba(0,0,0,0.01)0 0 1px;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;}
body{
width:100%;
margin:0 auto 0 auto;
background:var(--bgbody);
font-family:'Raleway',sans-serif;
font-size:1rem;
line-height:1.8rem;
font-weight:100;
overflow-x:hidden;
-webkit-font-smoothing: antialiased !important;
-moz-osx-font-smoothing: grayscale;
/*-moz-hyphens: auto;
-o-hyphens: auto;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;*/
}


p,li,li a,label { -webkit-font-smoothing: antialiased !important;-moz-osx-font-smoothing: grayscale;font-size:1rem;line-height:1.5rem;font-weight:200;color:var(--black);}
h1,h2,h3,h4,h5,h6 {color:var(--hcolor);font-weight:100} 
h1{ font-size:2rem;line-height:2.1rem;margin:0;padding:15px 0 10px 0}
h2{ font-size:1.6rem;line-height:1.7rem;margin:0;padding:15px 0 10px 0}
h3 { font-size:1.25rem;}
h4 { font-size:1rem;}
.upper {text-transform:uppercase;}


a,a:focus,a:hover,a:active{outline: 0 !important;}
a:focus {text-decoration: none;}
a:hover {text-decoration: none;}
.clearfix{clear:both}
.fs-6 { font-size:0.688rem; line-height:0.813rem}
.fs-7 { font-size:0.75rem; line-height:0.875rem}
.fs-8 { font-size:0.813rem; line-height:0.938rem}
.fs-9 { font-size:0.938rem; line-height:1.125rem}
.fs-10 { font-size:1rem; line-height:1.5rem}
.fs-12 { font-size:1.125rem;}
.fs-13 { font-size:1.375rem;}
.fs-15 { font-size:1.5rem;}
.fs-20 { font-size:2rem;}
.fs-26 { font-size:2.625rem;}
.fs-30 { font-size:3rem;}

.lh-8{ line-height:0.8rem;}
.lh-10{ line-height:1rem;}
.lh-12{ line-height:1.2rem;}
.lh-14{ line-height:1.4rem;}
.lh-16{ line-height:1.6rem;}
.lh-18{ line-height:1.8rem;}
.lh-20{ line-height:2.0rem;}





.ls-1{letter-spacing:1px}
.ls-11{letter-spacing:1.1px}
.ls-12{letter-spacing:1.2px}
.ls-13{letter-spacing:1.3px}
.ls-14{letter-spacing:1.4px}
.ls-15{letter-spacing:1.5px}
.ls-2{letter-spacing:2px}
.ls-3{letter-spacing:3px}
.ls-4{letter-spacing:4px}
.ls-5{letter-spacing:5px}

.fw-100{font-weight:100;}
.fw-200{font-weight:200;}
.fw-300{font-weight:300;}
.fw-400{font-weight:400;}
.fw-500{font-weight:500;}
.fw-600{font-weight:600;}
.fw-700{font-weight:700;}

.pd-4 {padding:4px;}
.pd-5 {padding:5px;}
.pd-6 {padding:6px;}
.pd-7 {padding:7px;}
.pd-8 {padding:8px;}
.pd-9 {padding:9px;}
.pd-10 {padding:10px;}
.pd-15 {padding:15px;}
.pd-20 {padding:20px;}
.pd-25 {padding:25px;}
.pd-30 {padding:30px;}


.mb-10 {margin-bottom:10px;}
.mb-20 {margin-bottom:20px;}
.mb-30 {margin-bottom:30px;}
.mb-40 {margin-bottom:40px;}
.mb-50 {margin-bottom:50px;}
.mb-60 {margin-bottom:60px;}
.mb-70 {margin-bottom:70px;}
.mb-80 {margin-bottom:80px;}
.mb-90 {margin-bottom:90px;}
.mb-100 {margin-bottom:100px;}
.mt-10 {margin-top:10px;}
.mt-20 {margin-top:20px;}
.mt-30 {margin-top:30px;}
.mt-40 {margin-top:40px;}
.mt-50 {margin-top:50px;}
.mt-60 {margin-top:60px;}
.mt-70 {margin-top:70px;}
.mt-80 {margin-top:80px;}
.mt-90 {margin-top:90px;}
.mt-100 {margin-top:100px;}
hr {border-top: 1px solid rgba(0,0,0,0.1) !important;margin-bottom:20px !important;margin-top:20px !important;width:50%;}

.back-to-top {position:fixed;bottom:0;right:0;z-index: 100;width:40px;height:80px;background:#000;-moz-border-radius: 8px 0 0 0;-webkit-border-radius: 8px 0 0 0;border-radius: 8px 0 0 0;}
.back-to-top:before {var(--white); font-family:FontAwesome;content:"\f102";font-weight:400;display: inline-block;font-size:48px;line-height:80px;width:40px; text-align:center}


.modal-content p {padding:10px;}
.modal-p { margin:10px;padding:0;}
.flipInX {-webkit-backface-visibility: visible !important;backface-visibility: visible !important;-webkit-animation-name: flipInX;animation-name: flipInX;-webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
@-webkit-keyframes flipInX {
0% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);transform: perspective(400px) rotate3d(1, 0, 0, 90deg);-webkit-transition-timing-function: ease-in;transition-timing-function: ease-in;opacity: 0;}
40% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);transform: perspective(400px) rotate3d(1, 0, 0, -20deg);-webkit-transition-timing-function: ease-in;transition-timing-function: ease-in;}
60% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);transform: perspective(400px) rotate3d(1, 0, 0, 10deg);opacity: 1;}
80% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);transform: perspective(400px) rotate3d(1, 0, 0, -5deg);}
100% {-webkit-transform: perspective(400px);transform: perspective(400px);}
}
@keyframes flipInX {
0% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);transform: perspective(400px) rotate3d(1, 0, 0, 90deg);-webkit-transition-timing-function: ease-in;transition-timing-function: ease-in;opacity: 0;}
40% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);transform: perspective(400px) rotate3d(1, 0, 0, -20deg);-webkit-transition-timing-function: ease-in;transition-timing-function: ease-in;}
60% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);transform: perspective(400px) rotate3d(1, 0, 0, 10deg);opacity: 1;}
80% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);transform: perspective(400px) rotate3d(1, 0, 0, -5deg);}
100% {-webkit-transform: perspective(400px);transform: perspective(400px);}
} 
.flipOutX {-webkit-animation-name: flipOutX;animation-name: flipOutX;-webkit-animation-duration: 2.75s;animation-duration: 2.75s;-webkit-backface-visibility: visible !important;backface-visibility: visible !important;-webkit-animation-duration: 3s;animation-duration: 3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
@-webkit-keyframes flipOutX {
0% {-webkit-transform: perspective(400px);transform: perspective(400px);}
30% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);transform: perspective(400px) rotate3d(1, 0, 0, -20deg);opacity: 1;}
100% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);transform: perspective(400px) rotate3d(1, 0, 0, 90deg);opacity: 0;}
}
@keyframes flipOutX {
0% {-webkit-transform: perspective(400px);transform: perspective(400px);}
30% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);transform: perspective(400px) rotate3d(1, 0, 0, -20deg);opacity: 1;}
100% {-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);transform: perspective(400px) rotate3d(1, 0, 0, 90deg);opacity: 0;}
}

#FooterBg{ display:inline;}	
#footer { width:100vw;background:rgba(0,0,0,0.2);min-height:380px;padding-bottom:20px;padding-top:20px}
#footer a { color:var(--black);}
#footer h2{ font-size:1.3rem;line-height:1.7rem;padding:1rem 0 0.5rem 0;margin:1rem auto 0 auto;letter-spacing:4px;text-align:center;color:var(--black)}
#footer p{ font-size:0.8rem;line-height:1.2rem;padding:0 0 0 40px;text-align:left;color:var(--black)}
#footer .box {background:var(--white80);margin-top:40px;min-height:200px}
#footer ul{  list-style-type: none;}
#footer li:before{  content:'\00BB';margin-right:10px;}

.color-chor-gruen {color:var(--edencolor);}
.bg-chor-gruen {background-color:var(--edenbgcolor);}

#logo { position:absolute;position:fixed;top:10px;left:20px;background:#fff;z-index:9999}
#logo img { max-width:180px;}
#termine { display:none}


@media (min-width: 576px) {
.scale-on-hover:hover{transform: scale(1.0001);box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.8) !important;}
}

@media only screen and ( max-width: 651px ) { 
	#logo { position:absolute;top:0;left:10px;padding:0;background:transparent;z-index:9999}
	#logo img { max-width:70px;}
	.back-to-top{display:none !important;}
	#termine { display:inline}
	#footer { width:100vw;background:rgba(255,255,255,1);min-height:100px;padding-bottom:20px;padding-top:20px}
	#footer h2 { padding:1rem 0 0.5rem 0;text-align:left;padding-left:40px;}
#footer .box {background:var(--white80);margin-top:4px;min-height:100px}
#FooterBg{ display:none;}	
#footer p{ padding-left:40px;}
	
}
@media all and (min-width: 40em) {
	.teaser {width: 50%;}
}
@media all and (min-width: 60em) {
	.teaser {width: 33.33%;}
}

