@font-face {
    font-family: 'open'; src: url('/static/fonts/OpenSans-Regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal;
}
@font-face {
    font-family: 'open_conbo'; src: url('/static/fonts/OpenSans-CondBold-webfont.woff') format('woff'); font-weight: normal; font-style: normal;
}
@font-face {
    font-family: 'open_italic'; src: url('/static/fonts/OpenSans-Light-webfont.woff') format('woff'); font-weight: normal; font-style: normal;
}
@font-face {
    font-family: 'open_bold'; src: url('/static/fonts/OpenSans-Bold-webfont.woff') format('woff'); font-weight: bold; font-style: normal;
}


* { position: relative; }
html { color: #404040; font-size: 1em; line-height: 1.4; }
::-moz-selection { background: #b3d4fc; text-shadow: none; }
::selection { background: #b3d4fc; text-shadow: none; }
audio, canvas, iframe, img, svg, video { vertical-align: bottom; }
fieldset { border: 0; margin: 0; padding: 0; }

div[style="z-index: 1000;text-align:right;font-size:10px;color:grey;display:block !important;"] { font-size: 0; line-height: 0; width: 0; height: 0; overflow: hidden; }

body { font: 1em/1.4 open; background: #fff; }
strong { font-family: open_bold; }
a { color: #E27A00; text-decoration: none; }
img { max-width: 100%; height: auto; }
img.rounded { border-radius: 50%; }

.wrapper { width: 90%; margin: auto; }
.midwrapper { text-align: center; }
.editMode { margin: 1em 0; color: red; }

.header-container { border-top: 12px solid #BFE383; }
header { margin-top: 50px; padding-bottom: 2em; margin-bottom: 2em; }

header nav ul { margin: 0; padding: 0; list-style-type: none; font-family: open_conbo; font-size: 1.25em; }
header nav ul li { margin: 0; display: inline-block; }
header nav ul li a { color: #414141; }
header nav ul li a:hover { color: #E27A00; }
header nav ul li a.here { color: #ABCB76; }
header nav ul li a:before { content: "| "; }
nav#main li {  margin-right: 60px; }
nav#action li {  margin-left: 60px; }
nav#main {  float: left; }
nav#action { float: right; }
 
.boxed { text-align: center; }
.boxed > div { max-width: 960px; text-align: left; margin: auto; }
.boxed .contentrow > div { width: 50%; }
.boxed .contentrow > div.center { text-align: center; }
.boxed .slogan { font-size: 1.9em; font-family: open_conbo; color: #637447; }
a.button, button { display: inline-block; background: #E27A00; color: #fff; font-size: 1.9em; font-family: open_conbo; padding: 0.25em 1em; border-radius: 3em; margin-top: 1em; border: none; }
 
.countbox { height: 590px; background: url("/static/images/baum-bg.png") center center no-repeat #BFE383; text-align: center!important; font-size: 2.25em; color: #637447; box-sizing: border-box; padding-top: 200px; }
.countbox .counterfield { display: inline-block; width: 400px; padding: 0.3em 0; background: #D7FF96; font-size: 1.28em; font-family: open_bold; border-radius: 30px; }
 
article h1 { text-align: center; font-weight: normal; margin-top: 0; font-size: 3.5em; color: #637447; font-family: open_conbo; }
article h2 { text-align: center; font-weight: normal; font-size: 1.9em; color: #637447; font-family: open_conbo; }
.header { text-align: center; }
.textbox { font-size: 1.125em; max-width: 960px; margin: 0 auto; }
.textbox p { margin: 1.4em 0; }
.textbox h2:first-child, .textbox p:first-child  { margin-top: 0; }
article section > h2 { text-align: left!important; }

section { margin: 3em 0 7em 0; }
section .wrapper { max-width: 1200px; }
#startnav { text-align: center; }
#outer { margin: auto; width: 352px; height: 352px; border: 3px solid #ffed89; border-radius: 50%; }
#inner { position: absolute; top: calc(50% - 45px); left: calc(50% - 45px); width: 90px; height: 90px; background: #ffed89; border-radius: 50%; z-index: 2; }

.gray { background: #edebeb; padding: 4em 0; }
.biggal { width: 90%; margin: auto; }
.galrow { display: flex; justify-content: space-between; flex-wrap : wrap; margin-bottom: -2%; }
.galrow div { margin-bottom: 2%; text-align: center; }
.row3 div { width: 32%; }
.row4 div { width: 24%; }
.row5 div { width: 19%; }
.row6 div { width: 16%; }
.galrow img { max-width: 100%; height: auto; }
.full img { background: #ddd; width: 100%; height: auto; }

.contentrow { display: flex; justify-content: space-between; }
.contentrow .textbox { width: 48%; }
.contentrow .picbox { width: 48%; text-align: right; }
.withair .picbox { width: 46%; }
.contentrow h2 { text-align: left; }
.contentrow .picbox div { margin-top: 4em; }
.contentrow .picbox div:first-child { margin-top: 0; }
.cols3 img { width: 269px; height: auto; }
.cols4 img { width: 372px; height: auto; }
.cols5 img { width: 475px; height: auto; }
.cols6 img { width: 578px; height: auto; max-width: 100%; }
.galrow + .annotation { margin-top: 2em; padding: 0; }

.annotation { text-align: left!important; font-size: 0.8em; padding: 0 8px; box-sizing: border-box; }
.annotation p { margin: 6px 0; }
.picbox .annotation, .full .annotation { position: absolute; bottom: 54px; background: #edebeb; display: none; }

.initiator { align-items: flex-start; }
.initiator .picbox { width: 33%; text-align: right; }
.initiator .picbox > div { width: 223px; border: 3px dashed #BFE383; text-align: center!important; padding: 24px 0; display: inline-block; }
.initiator .picbox img { max-height: 175px; width: auto; }
.initiator .textbox { box-sizing: border-box; width: 60%; padding-right: 15%; }


.footer-container { margin-top: 5em; background: #BFE383; padding-top: 12px; }
.footer-container:before { content: " "; display: block; height: 12px; background: #637447; margin-bottom: 24px; }
footer { min-height: 60px; color: #637447; text-align: center; }
footer .slogan { text-transform: uppercase; }
.footer-row { font-size: 0.75em; display: flex; flex-wrap: nowrap; text-align: left; margin-top: 2em; }
.footer-row > div { width: 33.3%; }
.footer-container a { color: #637447; }
.footer-container a:hover { color: #E27A00; }
.footer-container nav { padding: 20px 0; text-align: center; background: #637447; margin-top: 48px; }
.footer-container nav ul { list-style: none; padding: 0; margin: 0; }
.footer-container nav li { display: inline-block; margin: 0 40px; }
.footer-container nav a { text-decoration: none; color: #fff; text-transform: uppercase; }

a.galThumbLink:hover { background: none; opacity: 0.7; filter:alpha(opacity=70); }
.elastic-video { position: relative; padding-bottom: 55%; padding-top: 15px; height: 0; overflow: hidden; margin-bottom: 1.5em; }
.elastic-video video { position: absolute; top: 0; left: 0; width: 100%!important; height: 100%!important; }

#nlForm { text-align: center; }
#nlInlay { display: inline-block; padding: 1em 3em; background: #daf0f3; border-radius: 20px; }
#nlForm .label { display: inline-block; }
#nlInlay input[type='submit'] { background: #E27A00; border: none; color: #fff; border-radius: 100px; padding: 0.2em 1em; box-sizing: border-box; }

.form { background: #daf0f3; padding: 20px; }
.form form { margin: 0; }
.form fieldset { border: none; margin-bottom: 1em; padding: 0; }
.form legend { font-weight: bold; margin: 2em 0; text-transform: uppercase; }
.form label.base { float: left; width: 30%; padding: 0.4em 0; }
.form .label { float: left; padding: 0.4em 0; min-width: 30%; }
.form .bol { margin-left: 30%; }
.form input, .form textarea { border: none; background: #fff; font-family: "Open Sans"; }
.form input.base { display: block; margin-bottom: 2em; font-size: 0.9em; padding: 0.4em;
box-sizing: border-box; /* css3 rec */
-moz-box-sizing: border-box; /* ff2 */
-ms-box-sizing: border-box; /* ie8 */
-webkit-box-sizing: border-box; width: 69%; }
.form input.half { width: 35%; }
.form input.halfleft { width: 35%; float: left; margin-right: 20px; }
.form textarea.base { display: block; margin-bottom: 2em; font-size: 0.9em; padding: 0.6em;
box-sizing: border-box; /* css3 rec */
-moz-box-sizing: border-box; /* ff2 */
-ms-box-sizing: border-box; /* ie8 */
-webkit-box-sizing: border-box; width: 69%; height: 10em; }
.inputgroup { margin-left: 30%; margin-bottom: 2em; }
.inputgroup input.base, .inputgroup textarea.base { width: 100%; }
.inputgroup input.half, .inputgroup input.halfleft { width: 50%; }
.basebase { font-size: 0.9em; padding: 0.4em; }
.radiopair { display: block; margin-bottom: 0.5em; padding-top: 0.4em; }
.radiopair label { display: inline-block; padding-left: 10px; }
.form button { float: right; cursor: pointer; }
.form .defaultContent { color: #a6a6a6; }
.form h2 { margin: 0; color: #808080; }
.small { font-size: 0.8em; }

.smart input[type='checkbox'] { display: none; }
.smart input[type='radio'] { display: none; }
.smart input[type='checkbox']:checked + label::before,
.smart input[type='checkbox']:not(:checked) + label::before,
.smart input[type='radio']:checked + label::before,
.smart input[type='radio']:not(:checked) + label::before {
    content:' ';
    display:inline-block;
    width: 20px;
    height:20px;
    position: relative;
    top: 4px;
    border: none;
    background: white;
    margin-right: 10px;
}

.smart input[type=radio]:checked + label::before,
.smart input[type=radio]:not(:checked) + label::before {
  border-radius: 30px;
}

.smart input[type='checkbox']:hover  + label::before,
.smart input[type='radio']:hover  + label::before {
  background:#ddd;
  box-shadow: inset 0 0 0 5px white;
}

.smart input[type='checkbox']:checked  + label::before,
.smart input[type='radio']:checked  + label::before {
  background:black;
  box-shadow: inset 0 0 0 5px white;	
  border: none;
}

#imageUpload { margin-bottom: 2em; }
#imageUpload label { display: none; }
#imageUpload input[type='checkbox'] { display: none; }

.card__wall { display: flex; gap: 2em; flex-wrap: wrap; }
.card__img, .card__text { width: calc(50% - 1em); }
.card__img img { max-width: 100%; height: auto; }
.card__author { text-align: right; font-style: italic; margin-top: 0.5em; }


/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 1279px) {
	
}

@media only screen and (max-width: 1023px) {
body {font-size: 0.9125em }

}

@media only screen and (max-width: 960px) {
	.boxed .contentrow { flex-wrap: wrap; }
	.boxed .contentrow > div { width: 90%; margin: 0 5%; text-align: center; }
	.boxed .center { margin-bottom: 2em!important; }
	.boxed .center img { max-width: 80%; height: auto; }
	.initiator .textbox { width: 75%; padding-right: 0%; margin-left: 5%; }
}

@media only screen and (max-width: 767px) {


	#outer { margin: auto; width: 220px; height: 220px; border: 3px solid #ffed89; border-radius: 50%; }
	#inner { position: absolute; top: calc(50% - 30px); left: calc(50% - 30px); width: 60px; height: 60px; background: #ffed89; border-radius: 50%; z-index: 2; }
	#startnav .findus { position: absolute; top: -18px; left: calc(50% - 66px); width: 132px; }
	#startnav .genuss { position: absolute; top: 26%; left: calc(100% - 90px); width: 188px; }
	#startnav .zeitlos { position: absolute; top: 72%; left: -40px; width: 126px; }
	#startnav .klenkenhof { position: absolute; top: 26%; left: -80px; width: 134px; }
	#startnav .heart { position: absolute; top: 72%; left: calc(100% - 70px); width: 80px; }
	

	header { margin-top: 2em; margin-bottom: 0; padding-bottom: 1em; }
	#sub { font-size: 21px; line-height: 15px; }
	#xa { width: 92px; height: auto;  }
	#title { max-width: calc(100% - 120px); }
	#title img { max-width: 100%; height: auto; }
	

	.footer-row { flex-wrap: wrap; text-align: left; }
	.footer-row > div { width: 100%; margin-bottom: 2em; }

	.initiator { align-items: flex-start; flex-wrap: wrap; }
	.initiator .picbox { width: auto; text-align: center; margin-bottom: 2em;}
	.initiator .textbox { box-sizing: border-box; width: auto; padding-right: 0; margin-left: 0; }
	

	nav#main li {  margin: 10px 10px; }
	nav#action li {  margin: 10px 10px; }
	nav#main {  float: none; text-align: center; }
	nav#action { float: none; text-align: center; }
 
	.countbox { height: 390px; font-size: 1.8em; padding-top: 100px; }
	.countbox .counterfield { width: auto; padding: 0.3em 1em; font-size: 1.1em; }
	.form .formtextarea { width: 100%; }
	#imageUpload { width: 80%; overflow: hidden; }
	#imageUpload table { width: 100%; }
}

@media only screen and (max-width: 540px) {
	img { max-width: 100%; height: auto; }
	.contentrow { flex-wrap: wrap; }
	.contentrow .textbox, .contentrow .picbox { width: 100% }
	.picbox + .picbox { margin-top: 2em; }
	.galrow div { width: 100%; }
	.textbox h2:first-child, .textbox p:first-child  { margin-top: 1.4em; }
	
	a.galThumbLink { pointer-events: none; }
	a.galThumbLink:hover { opacity: 1; filter:alpha(opacity=100); }
	
	
	.form label.base { float: none; width: auto; }
	.form .label { float: none;; min-width: auto; }
	.form .bol { margin-left: 0; }
	.form input.base { width: 100%; }
	.inputgroup { margin-left: 0; }.form textarea.base { width: 100%; }
	.form button { float: none; }
	

	#nlInlay input[type='submit'] { display: block; margin-top: 1em; width: 100%; font-size: 1.4em; }

	.card__img, .card__text { width: 100%; }
	.card__text { margin-bottom: 3em; }
}

@media only screen and (max-width: 450px) {
	#outer { margin: auto; width: 80vw;  height: 80vw; border: 3px solid #ffed89; border-radius: 50%; }
	#inner { display: none; }
	#startnav .findus { position: absolute; top: -18px; left: calc(50% - 66px); width: 132px; }
	#startnav .genuss { position: absolute; top: 15%; left: calc(50% - 94px); width: 188px; }
	#startnav .klenkenhof { position: absolute; top: 36%; left: calc(50% - 68px); width: 134px; }
	#startnav .zeitlos { position: absolute; top: 72%; left: calc(50% - 63px); width: 126px; }
	#startnav .heart { position: absolute; top: 90%; left: calc(50% - 40px); width: 80px; }
	
	#krossa { font-size: 32px; line-height: 28px; }
	#sub { font-size: 13px; line-height: 10px; }
	#xa { width: 62px; height: auto; }
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        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;
    }
}