/* caveat-regular - latin */
@font-face {
  font-display: swap; 
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/caveat-v18-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/caveat-v18-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* caveat-brush-regular - latin */
@font-face {
  font-display: swap; 
  font-family: 'Caveat Brush';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/caveat-brush-v11-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/caveat-brush-v11-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* manrope-regular - latin */
@font-face {
  font-display: swap; 
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/manrope-v15-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/manrope-v15-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* manrope-700 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/manrope-v15-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/manrope-v15-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/*#############################*/
/*#############################*/
* {  
	-webkit-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}
html{	
	overflow-y: scroll;
	height: 100%;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	font-size:18px;
}
*, *:before, *:after, div {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html.nooverflow{
	overflow-y:hidden;
}
body{
	margin: 0;
	padding: 0;
	color: rgb(34,24,24);
	height: 100%;
	font: normal 1rem/1.375em 'Manrope', sans-serif;
	background-color: rgb(255,255,255);
	position: relative;
}

table, td {	border: 0px; 	margin: 0px;	padding: 0px;	vertical-align: top;	border-collapse: collapse;	border-spacing: 0px;}
iframe { 	border: 0px;	margin: 0px;	padding: 0px;}
img {
	display: inline-block;
	border: 0;
	margin: 0;
	padding: 0em;
	vertical-align: middle;
	height:auto}
a {	color: inherit;	outline: none;}
a:hover {
	color: rgb(110,80,40);
}
a:hover div { transform:rotate(2deg);}
a:not([href*='pauschalen.php']):hover img { transform:scale(0.99); filter: contrast(120%);}

strong { font-weight:700;}
.clear { 	clear: both;	line-height: 0px;	height: 0px;}
.clear:after {     content:"";    display:block;    clear:both;}
/**/
main { overflow-x:hidden;}
/**/
#container {
	width: 100%;
	position: relative;
	overflow:hidden;
	min-height: 100%;
	height: auto !important;
	height: 100%;
}
#header-container{
	background-color:#fff;
}
#header{
	position: relative;
	height: 90px;
	-webkit-transition: height 0.3s ease-in-out;
	transition: height 0.3s ease-in-out;
	background-color: #fff;
}
.sticky #header{
	position: fixed;
	width: 100%;
	height: 60px;
	top: 0px;
	left: 0px;
	z-index: 3;
	-webkit-box-shadow: 0px 0px 50px #000;
	-moz-box-shadow: 0px 0px 50px #000;
	box-shadow: 0px 0px 100px #000;
	background-color: rgba(255,255,255,1);
}
.sticky #header:after { content:''; height:calc(10px + 3vw); position:absolute; bottom: 2px; transform: translateY(100%); left:0; right:0;
	background-image:url(../images/welle-top-weiss.png); background-position:bottom center; background-size:100% 100%;}

#logo{
	position: absolute;
	left: calc(50% + 30px);
	top: 0.5rem;
	transform: translateX(-50%);
}
#logo img{	
	width: 160px; height:auto;
	-webkit-transition: height 0.3s ease-in-out;
	transition: height 0.3s ease-in-out;
}
.sticky #logo img { width:120px; }
#nav{
	position:absolute;
	width:45px;
	height:100%;
	left:0;
	top:0;
	padding-left: 3%;
	padding-right: 3%;
	z-index:3;
}
#nav.active{
	position:fixed;
	width:100%;
	background-color:#fff;
	left:0;
	overflow-y: auto;
	-webkit-overflow-scrolling:touch;
	background-image: url(../images/bg-navi.jpg);
    background-position: bottom center;
	background-size:cover;
}
#nav-sandwich{
	position:fixed;
	left:calc(1rem + 5vw);
	top:1rem;
	width:52px;
	height:35px;
	z-index:1;
	cursor:pointer;
	color:rgb(22,88,33);
}
.sticky #nav-sandwich{
	top:20px;
	text-indent:-9999px;
}
#nav-sandwich span:before{
	content:"";
	display:block;
	width:100%;
	height:5px;
	margin-bottom:6px;
	background-image:url(../images/sandwich.png); background-repeat:no-repeat; background-size:cover; background-position: bottom;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#nav.active #nav-sandwich{
	text-indent: -9999px;
}
#nav.active #nav-sandwich span:nth-child(1n):before{
	transform:rotate(45deg) translate(0px,8px);
}
#nav.active #nav-sandwich span:nth-child(2n):before{
	display:none;
}
#nav.active #nav-sandwich span:nth-child(3n):before{
	transform:rotate(-45deg) translate(0px,-8px);
}
#nav ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
.nav{
	display:none;
	justify-content:flex-start;
	font-size:1rem;
	line-height:1.5em;
}
#nav.active .nav{
	display:flex;
	flex-wrap:wrap;
	background-image:url(../images/urlaub-auf-dem-simonshof.png);
	background-repeat:no-repeat;
	padding-top:60px;
	padding-bottom:320px;
	background-position:bottom 100px center;

	
}
.nav > ul {
	padding-left:5% !important;
	padding-right:5% !important;
}
.nav > ul > li {
	margin-top:1rem;
}
.nav ul ul { transform: translateX(1rem);}
.nav a {
	text-decoration: none;
	font-family: 'Manrope';
	font-weight:700;
	line-height:2em;
    display: inline-block;
	border-radius:1em;
	padding:0 1rem; 
	margin:2px -1rem 2px 0;
}
.nav > ul > li > a {
	font-family: 'Caveat Brush', cursive;
	color: rgb(22,88,33);
	font-size: 1.75em;
	font-weight:normal;
}
.nav a:hover, .nav a.active{
	background-color: rgb(22,88,33);
	color: #fff !important;
	text-decoratio-color: #fff !important;
}

/**/
.sonne{
	position: absolute;
	right: 0px;
	top: 100%;
	transform: translateY(-33%);
	z-index: 2;
}
.sticky .sonne { transform: translateY(-20%) scale(0.75); transform-origin: top left;}
/**/
.backstretch{
	min-height: 100%;
	max-height: 100%;
}
#header-image * {  
	-webkit-transition: none;
	transition: none;
}
#header-image{
	display: block;
	height: 56vw;
	min-height: 200px;
	position: relative;
	z-index: 1;
}
#header-image img{
	width:100%;
	height:auto;
}
#header-image-prev,#header-image-next{
	position:absolute;
	top:50%;
	transform:translate(0,-50%);
	cursor:pointer;
}
#header-image-prev{
	left:3%;
}
#header-image-next{
	right:3%;
}
#header-image-pager {
	position: absolute;
	z-index: 999;
	width: 100%;
	bottom: 15px;
	left: 15px;
	text-align: left;
	opacity: 0;
}
#header-image-pager a {
	background: #fff;
	border:2px solid #fff;
	text-indent: -9999px;
	width: 20px;
	height: 20px;
	margin: 0 3px;
	outline: 0;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	display: inline-block;
	-webkit-box-shadow: 1px 1px 5px 0px #333;
	-moz-box-shadow: 1px 1px 5px 0px #333;
	box-shadow: 1px 1px 5px 0px #333;
}

#header-image-pager a:hover,
#header-image-pager a.active {
	background: rgb(22,88,33);
}
#content{
	display: block;
	margin: 0 auto;
}
.content{
	position:relative;
	padding:calc(1rem + 4vw);
}
.preise > div {	
	border-radius: 1rem;
	padding: 1rem !important;
    border: 0.5vw solid #fff;
}
.preise .mitbg {
	background-color: rgba(225,150,15,0.1);
}

.breadcrumbs{
	position: relative;
	font-size: 0.83em;
	color: #888;
	text-align: center;
}
.breadcrumbs a{
	color:#666;
}
/**/

/**/
#footer-image{
	display: block;
	position: relative;
	width: 100%;
	padding: 0;
	margin: 0;
}
#footer-image img{
	width:100%;
	height:auto;
}
footer{
	position: relative;
	color: #264014;
	background-color: rgb(205,225,85);
	padding: 5vw;
}
footer .flex-container  {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;}
footer .flex-container div {	flex-basis: 25%; padding:0 5vw 5vw 0; }
footer a {
	color: inherit;
	text-decoration: underline  dotted rgba(0,0,0,0.25)  2px;
}
footer li a { text-decoration:none;}
footer a:hover{
	text-decoration: underline solid rgba(110,80,40,0.5) 2px;
	color: rgb(110,80,40);
}
footer ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;}
footer  ul:first-child > li {
}

footer  ul:first-child > li > a, footer h2 {
	font-family: 'Caveat Brush', cursive;
	font-size: 1.5rem;
	display: block;
	font-weight: normal;
	margin:0.75em 0;
}
footer ul li li { padding-left:1rem;}
footer ul li li:before { content:'•'; margin-left:-1rem; }
footer ul li.noli:before { content:'';}
#footer-impressum{
	font-size: 14px;
	padding: 2rem 0;
	text-align: center;
	white-space: nowrap;
}
footer .active { font-weight:700; color:rgb(110,80,40); text-decoration: underline solid rgba(110,80,40,1) 2px; }
/*----------------------------------------------------*/
.galerie{
	background-color: rgb(110,55,0);
	padding: 7vw 0;
	position: relative;
	width: 100%;
}
.galerie ul {
	list-style:none; padding:0; margin:0;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
}
.galerie ul li {	
	list-style:none; padding:0; margin:0;
	flex: 0 0 50%;
	padding:calc(0.5rem + 0.5vw);}
.galerie ul li img{
	width:100%;
	height: auto !important;
	border: 0.5vw solid #fff;
	border-radius: 1vw;
	box-shadow: 2px 2px 1vw rgba(0,0,0,0.5)
}
/**/
details {  width:100%; max-width:980px; margin:auto;}
details[open] {padding-bottom: 3vw;}
summary, summary:after {
	cursor: pointer;
	color: inherit;
	font-family: 'Caveat Brush', sans-serif;
	font-size: 1.5rem;
	padding: 1rem;
	text-align: center;
	width:100%; 
	max-width:980px;   
  }
summary::marker {
  font-size: 1.5em;
  text-align:right;
  cursor: pointer; 
  content: "+ ";
}
[open] summary::marker {
  content: "x ";
}
[open] summary { transform-origin: center; transform: rotateY(360deg); }
summary:hover { color:rgb(225,150,15);}
details table:not(.pager-table) { width:0; transition: all 0.5s ease-in-out;}
details[open] table:not(.pager-table) { width:100%;}
/*------------------------------------------------------*/
.cloud1, .cloud2, .cloud3, .cloud4, .cloud5, .cloud6 { 	position: relative;}
.cloud1:after, .cloud2:after, .cloud3:after, .cloud4:after, .cloud5:after, .cloud6:after  {
	content: '';
	position: absolute;
	left: -1rem;
	top: -1rem;
	right: -1rem;
	bottom: -1rem;
	z-index: -2;}
.cloud1:after {
	border-radius: 32% 68% 67% 33% / 29% 53% 47% 71%;
	background-color: rgb(220,235,250);
}
.cloud2:after {
	border-radius: 54% 46% 78% 22% / 30% 78% 22% 70% ;
	background-color: rgb(250,235,220);
}
.cloud3:after {
	border-radius: 30% 78% 22% 70% / 54% 46% 78% 22% ;
	background-color: rgb(235,250,220);
}
.cloud4:after {
	border-radius: 30% 78% 22% 70% / 54% 46% 78% 22% ;
	background-color: rgb(255,220,215);
}
.cloud5:after {
	border-radius: 30% 70% 65% 35% / 30% 37% 63% 70%;
	background-color: rgb(220,250,235);
}
.cloud6:after {
	border-radius: 40% 30% 70% 60% / 30% 70% 65% 35% ;
	background-color: rgb(255,250,195);
}
.cloud1.circle:before, .cloud2.circle:before, .cloud3.circle:before , .cloud4.circle:before, .cloud5.circle:before, .cloud6.circle:before  {
	content: '';
	position: absolute;
	left: -1rem;
	top: -1rem;
	right: -1rem;
	bottom: -1rem;
	z-index: -1;
	border: 1px solid rgba(0,0,0,0.5);
}
.cloud1.circle:before {	border-radius: 54% 46% 78% 22% / 30% 88% 12% 70% ;}
.cloud2.circle:before {	border-radius: 30% 88% 12% 70% / 54% 46% 78% 22% ;}
.cloud3.circle:before {	border-radius: 32% 68% 67% 33% / 29% 53% 47% 71%;}
.cloud4.circle:before {	border-radius: 65% 35% 75% 25% / 30% 37% 63% 70% ;}
.cloud5.circle:before {	border-radius: 32% 68% 67% 33% / 29% 53% 47% 71%;}
.cloud6.circle:before {	border-radius: 54% 46% 78% 22% / 30% 88% 12% 70% ;}
/*																				   Grid
======================================================================================= */
.embed-container{position:relative;padding-bottom:56.25%;overflow:hidden;width:100%;}
.embed-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;}

.clear {
	clear: both;
	line-height: 0px;
	height: 0px;
	overflow: hidden;
}
.flex-container{
	display: flex;
	flex-flow: row wrap;
}
.flex-center-x{ 	justify-content: center;}
.flex-center-y{ 	align-items: center;}
.flex-container > div {
	padding:calc(1rem + 2vw);
	max-width: 100%;
}
.image {
	padding: calc(1rem + 2vw) !important;
}
.image img {
	max-width: 100%;
	height: auto;
	width: 100%;
}
/*																				 Absatz
======================================================================================= */
h1, h2, h3, h4, p {
	margin: 0 0 1em 0;
	font-weight: normal;
	line-height: 1.25em;
}
h1{
	color: rgb(22,88,33);
	font-size: 2rem;
	font-size: calc(1.5rem + 1.5vw);
	font-family: 'Caveat Brush', sans-serif;
}
h2{
	font-family: 'Caveat Brush', sans-serif;
	font-size: 1.5rem;
	font-size: calc(1.25rem + 0.75vw);
}
h3{
	font-size: 1.25rem;
	font-weight: 700;
}
h4{	font-size:1em;}

.caveat  {
	font-family: 'Caveat', serif;
	font-size: 1.625em;
}
.caveat_brush  {
	font-family: 'Caveat Brush', serif;
	font-size: 1.5em;
}
ul,ol{
	padding-left: 2rem;
	margin: 0px;
}
ul.list{
	position:relative;
    display: inline-block;
	list-style-type:none;
	padding-left:16px;
}
ul.list li{
	position:relative;
}
ul.list li:before{
	position:absolute;
	content:"•";
	left:-16px;
	font-size:1.1em;
}

a.link:before {
    content: "\f0da";
    font-family: 'FontAwesome';
    text-decoration: none;
    display: inline-block;
    margin-right: 3px;
}
a:not(.button)[href*=".pdf"]:before { 
    content:"\f1c1\00a0\00a0";
	font-family:'FontAwesome';
	color:#c42030;
	display:inline-block;
	text-align:center;
}
.blocksatz { 
	text-align: justify;
	-ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}
.hyphenate{
	-ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}
.right{
	float:right;
	margin-left:1em;
	margin-bottom:0.5em;
}
.text-left{
	text-align:left;
}
.text-center{
	text-align:center;
}
.text-right{
	text-align:right;
}
.text-nowrap{
	white-space:nowrap;
}
.align-center{
	display:flex;
	justify-content: center;
    flex-direction: column;
	height:100%;
}
.weiss{	color:#fff;}
.schwarz{	color: rgb(30,40,30);
	mix-blend-mode: multiply;}
.gruen{	color: rgb(22,88,33);}
.hellgruen{	color: rgb(205,225,85);}
.blau { color:rgb(55,115,195);}
.graublau { color: rgb(145,175,205);}
.orange { color: rgb(225,150,15);}
.braun {color:rgb(110,80,40);}

.error{
	font-size:0.8em;
	color: #890f01;
	line-height:normal;
}

.bg-gruen{
	background-color: #CDE155;
}
/*----------------------------------------------------*/
.mask-01, .mask-02, .mask-03, .mask-04, .mask-05, .mask-06, .mask-07 { position:relative; z-index:1;}
.mask-01:before, .mask-02:before, .mask-03:before, .mask-04:before, .mask-05:before, .mask-06:before, .mask-07:before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 2;
	background-image: url(../images/mask-01.png);
	background-size: 100% 100%;
	background-position:center;
	pointer-events:none;
}
.mask-02:before {
	background-image: url(../images/mask-02.png);}
.mask-03:before {
	background-image: url(../images/mask-03.png);}
.mask-04:before {
	background-image: url(../images/mask-04.png);}
.mask-05:before {
	background-image: url(../images/mask-05.png);}
.mask-06:before {
	background-image: url(../images/mask-01.png);}
.mask-07:before {
	background-image: url(../images/mask-02.png);}
/*																				   Form
======================================================================================= */
form {
	margin: auto;
    max-width: 80%;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #ccc}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #ccc;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #ccc;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #ccc;
}
input[type='checkbox'], input[type='radio'] {
   width:20px;
   height:20px;
   min-width:auto;
}
input, textarea, select{
	border: 1px solid #CCC;
	font-family: 'Manrope', sans-serif;
	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	padding-left: 5px;
	padding-right: 5px;
	color: #2f2f2f;
	width:100%;
}
input, select {
    line-height: 37px;
    height: 37px;
}
#anfrage input, #anfrage select, #anfrage textarea{
	font-size: 1.2em;
}
#anfrage h3{
	margin-bottom:5px;
}
textarea{
	height: 160px;
}
input.submit{
	cursor: pointer;
	padding: 0px;
	color: #2F2F2F;
	padding-left: 1em;
	padding-right: 1em;
}
input.submit:hover{
	border: 1px solid #2F2F2F;
}
label{
	display: inline-block;
    vertical-align: top;
}
.button_plusminus{
	cursor: pointer;
	background-color: #999999;
	color: #FFFFFF;
	text-decoration: none;
	display: inline-block;
	font-size: 1.5em;
	border: none;
	outline: none;
	line-height: 20px;
	width: 40px;
	height: 40px;
	text-align: center;
	z-index: 1;
	margin: 0px;
	padding: 0px;
}
.button_plusminus:hover{background-color:#666666;}
.button_minus{position:absolute;top:0px;left:0px;-webkit-border-radius:5px 0px 0px 5px;-moz-border-radius:5px 0px 0px 5px;border-radius:5px 0px 0px 5px;}
.button_plus{position:absolute;top:0px;right:0px;-webkit-border-radius:0px 5px 5px 0px;-moz-border-radius:0px 5px 5px 0px;border-radius:0px 5px 5px 0px;}
.plusminus{
	position: relative;
    display: inline-block;
	width:118px;
	height:40px;
}
.plusminus input{
	min-width: inherit;
	font-size: 1.2em;
	position: absolute;
	top: 0px;
	left: 39px;
	height: 40px;
	-webkit-border-radius: 0px 0px 0px 0px;
	-moz-border-radius: 0px 0px 0px 0px;
	border-radius: 0px 0px 0px 0px;
	margin: 0px;
	padding: 0px;
	text-align: center;
}
.button_klein{
	line-height: 20px;
	width: 30px;
	height: 37px;
}
.plusminus_klein{
	width:98px;
	height:30px;
}
.plusminus_klein input{
	left: 29px;
	height:37px;
	line-height:37px;
}
.tt{
	font-family: 'courier new',courier,monospace;
	font-size: 1.4em;
	color: #A72E29;
	font-weight: normal;
	line-height: 0.5em;
}
img.ui-datepicker-trigger {
	position: absolute;
	margin-top: 11px;
	margin-left: -25px;
	cursor: pointer;
	display:inline;
}
.ui-datepicker select{
	height:auto;
	line-height:normal;
}
.date-highlight a{
	background: #FF8080 !important;
}
/*																		       Diverses
======================================================================================= */
a.toTop {
    position: fixed;
    right: 10px;
    bottom: 10px;
    padding: 17px !important;
    z-index: 2;
    visibility: hidden;
    opacity: 0;
    background-color: rgb(22,88,33) !important;
    border: 1px solid #fff !important;
	border-radius:50% 50% 50% 50% / 80% 80% 20% 20%  ;
}
a.toTop:after{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	margin-left: -8px;
    margin-top: -6px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 8px 10px 8px;
	border-color: transparent transparent #fff transparent;
}
a.toTop.show {
    visibility:visible;
    cursor:pointer;
	opacity: 1.0;
}
/*																				   Grid
======================================================================================= */
.left10{padding-left:10px;}
.left20{padding-left:20px;}
.left40{padding-left:40px;}
.top0{padding-top:0px !important;}
.top5{padding-top:5px;}
.top10{padding-top:10px;}
.top20{padding-top:20px;}
.top30{padding-top:30px;}
.top40{padding-top:40px;}
.top60{padding-top:60px;}
.top80{padding-top:80px;}
.right10{padding-right:10px;}
.right20{padding-right:20px;}
.right40{padding-right:40px;}
.bottom0{padding-bottom:0px !important;}
.bottom5{padding-bottom:5px;}
.bottom10{padding-bottom:10px;}
.bottom20{padding-bottom:20px;}
.bottom30{padding-bottom:30px;}
.bottom40{padding-bottom:40px;}
.bottom60{padding-bottom:60px;}
.bottom80{padding-bottom:80px;}

.embed-container{position:relative;padding-bottom:56.25%;overflow:hidden;width:100%;}
.embed-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;}

.row {
	margin-right: -15px;
	margin-left: -15px;
}
.row:after, .row:before {
    display: table;
    content: " ";
}
.row:after {
    clear: both;
}
.row img, img.resp{
	max-width:100%;
	height:auto !important;
}
.grid {
    padding-right: 15px;
    padding-left: 15px;
    float: left;
    position: relative;
}
.grid-1{
	width: 8.3333%;
}
.grid-2{
	width: 16.6666%;
}
.grid-3{
	width: 25%;
}
.grid-4{
	width: 33.3333%;
}
.grid-5{
	width: 41.6666%;
}
.grid-6{
	width: 50%;
}
.grid-7{
	width: 58.3333%;
}
.grid-8{
	width: 66.6666%;
}
.grid-9{
	width: 75%;
	max-width: 680px;
}
.grid-10{
	width: 83.333%;
}
.grid-12{
	width: 100%;
}
/*--------------------------------------------------*/

.table-resp tr:nth-child(even) {
	background-color: rgba(255,255,255,0.8); 
}
.table-resp tr:nth-child(odd) {
	background-color: rgba(225,150,15,0.2);
}
.table-resp tr td:first-child { text-align:left;}
.table-resp tr td {
	padding:calc(0.5rem + 0.5vw);
	text-align:center;
	vertical-align:middle;
	border:1px dotted rgba(225,150,15,0.4); 
	border-collapse:collapse;
}
/*-------------------------------------------------------------*/
.button{
	font-family: 'Caveat Brush', sans-serif;
	cursor: pointer;
	font-weight: normal;
	line-height: normal;
	text-decoration: none;
	display: inline-block;
	padding: 8px 24px;
	border-radius: 24px;
	-webkit-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	font-size: 1.5rem;
	position: relative;
}.button:hover{
	background-color: rgb(22,88,33);
	color: #fff;
	box-shadow:2px 2px 2px rgb(205,225,85);
}
.button.gruen-dunkel {background-color:rgb(22,88,33); color:#fff;}
.button.gruen-dunkel:hover {background-color:rgb(255,255,255); color:rgb(22,88,33); box-shadow:2px 2px 2px rgba(22,88,33,0.5);}
.button.gruen-hell {background-color:rgb(205,225,85); color:rgb(22,88,33);}
.button.gruen-hell:hover {color:rgb(205,225,85); background-color:rgb(22,88,33); box-shadow:2px 2px 2px rgba(0,0,0,0.5);}
.button.orange {background-color:rgb(225,150,15); color:#fff;}
.button.orange:hover {color:rgb(225,150,15); background-color:#fff; box-shadow:2px 2px 5px rgb(225,150,15);}
/*-----------------------------------------------------------------------------*/
a.button_pager{
	cursor: pointer;
	color: #fff;
	text-decoration: none;
	display: inline-block;
	padding: 3px 6px;
	margin-top: 5px;
	background-color: rgb(22,88,33);
}
a.button_pager:hover,a.pager:hover{
	color: #fff;
	background-color: #63A631;
}
.pager{
	color: #ccc;
	text-decoration: none;
	padding: 3px 6px;
	display: inline-block;
	margin-top: 5px;
	background-color: #ECEDEE;
}
.pager_active{
	color: #fff;
	text-decoration: none;
	padding: 3px 6px;
	display: inline-block;
	margin-top: 5px;
	background-color: rgb(22,88,33);
}
.pager_inactive{
	background-color: #ECEDEE;
	color: #ccc;
}
.trennlinie,hr {
	height: 0px;
	line-height: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
	margin-bottom: 25px;
	border-top-style: none;
	border-right-style: none;
	border-left-style: none;
	margin-top: 25px;
}
/*-----------------------------------------------------------------------------------*/
.logos img{
	margin:5%;
}

.wohnung.flex{
	display:flex;
	flex-flow:row wrap;
	align-items:center;
	padding:2vw;
}
.wohnung h2 {
	font-size: 2rem;
	color: rgb(110,70,30);
}
.wohnung .button {
	background-color: rgb(225,150,15);
	color: #FFFFFF;
}
.wohnung .button:hover {
	color: rgb(110,70,30);
	background-color: rgba(225,150,15,0.15);
	box-shadow:2px 2px 2px rgb(225,150,15);
}
.wohnung-bild{
	flex-basis: 40%;
	order: 1;
	max-width: 600px;
	text-align: center;
}
.wohnung-bild img{
	max-width:100%;
	height:auto !important;
}
.wohnung-beschreibung {
	flex-basis: 50%; 
	padding:3%;
	order:2;
}
.wohnung-space { flex-basis: 10%;	order:3;}
ul.ausstattung{
	list-style-type: none;
    padding: 0;
}
ul.ausstattung li {
	display: inline-block;
	padding: 3px 8px;
	margin-right: 2px;
	margin-bottom: 8px;
	border-radius: 3px;
}
ul.ausstattung li {background-color: rgba(205,225,85,0.25); }
.mitbg ul.ausstattung li, .cloud2 ul.ausstattung li {	background-color: rgba(225,150,15,0.15);}
	
.rahmen { position:relative;}
.rahmen:before { content:''; position:absolute; top:-1vw; right:-1vw; bottom:-1vw; left:0vw; border-radius: 18% 22% 23% 10% / 10% 10% 20% 20% ; border:2px solid rgba(0,0,0,0.5); transform:rotate(1deg);}
.rahmen:after { content:''; position:absolute; top:0vw; right:-1vw; bottom:-2vw; left:-1vw; border-radius: 13% 22% 14% 37% / 17% 20% 17% 19% ; border:2px solid rgba(0,0,0,0.4); transform:rotate(-1.5deg);}
/*-----------------------------------------------------------------------*/
.monsi {
	min-width: 120px; /*160px*/
	max-width: 300px; /*360px*/
	width: 80%;
	height: auto;
	margin: auto;
	}
.monsi-text-home {
	/* [disabled]min-width: 280px; */
	/* [disabled]max-width: 606px; */
	width: 100%;
	height: auto;
	transform: translateX(-50px);
}
/*------------------------- FAQ -------------------------------------*/
button.accordion{position:relative;background-color:#1D77C222;cursor:pointer;padding:18px;width:100%;text-align:left;border:none;outline:none;transition:.4s;font-size:1.2em;line-height:inherit;margin-bottom:0.5em;padding-right:2.5em;}
button.accordion.active,button.accordion:hover{background-color:#1D77C222;}
button.accordion:after{position:absolute;top:50%;right:0.7em;transform:translate(0,-50%) rotate(90deg);content:'➤';font-weight:bold;color:rgb(55,115,195);font-size:1.2em;}
button.accordion.active:after{transform:translate(0,-50%);content:'➤';font-weight:bold;color:rgb(55,115,195);font-size:1.2em;}
div.panel{padding:0 1em;max-height:0;overflow:hidden;transition:.6s ease-in-out;opacity:0;}
div.panel.show{padding-top:10px;padding-bottom:20px;opacity:1;max-height:5000px;}
/*======================================================================================= */
/*						          	 MEDIAQUERY                                           */
/*======================================================================================= */

@media (max-width:480px) {
	.sonne img { width:71px; height:auto;}
	.sonne#urlaub { display:none;}
	.wohnung-bild { flex-basis: 100% !important;}
	.wohnung-beschreibung { flex-basis: 100% !important;}
}

@media (max-width:768px) {	
	.table-resp { width:100%;	}
	.table-resp td {
		text-align:left;
	}
	.haupt.table-resp {width:100%;}
	.haupt.table-resp tr:first-child { display:none}
	.haupt.table-resp td { text-align: center;
		width:100%;
		display: block;}
	.haupt.table-resp tr td:nth-child(2), .haupt.table-resp tr td:nth-child(3), .haupt.table-resp tr td:nth-child(4) { display:inline-block; width:33.3%;}
	.haupt.table-resp tr td:first-child::after { content:'\A HS | ZS | NS'; font-weight:700;         white-space: pre;   }
	
	.weitere.table-resp { width:auto;}
	.weitere.table-resp td { width:auto; display: table-cell;}
	.weitere.table-resp td:first-child {}
	
	.flex-container > div { flex: 1 1 100%;}
	footer .flex-container div {	flex-basis: 50%; }
	.wohnung-bild { flex-basis: 38%;}
	.wohnung-beschreibung { flex-basis: 62%;}
	.wohnung-space { display: none;}
	.preise > div { width:100%; }
	.galerie ul li {	flex: 0 0 50%;}
	.flex-62.galerie ul li { flex: 1 1 50%;}
	.flex-container div { order:1 !important;}
	
	.grid-2,.grid-3,.grid-4,.grid-5,.grid-6,.grid-7,.grid-8,.grid-9,.grid-10{width:100%;}
}
@media (min-width:769px) {
	.cloud1, .cloud2, .cloud3, .cloud4, .cloud5, .cloud6 {
	max-width: 640px !important;
}

	.monsi-text-home {
	transform: translate(-20%, -5%);
}
	
	#nav{left:5vw;} 
	#nav.active {padding-left:5vw;}
	#nav.active .nav { background-color:rgba(0,0,0,0);
	justify-content: center;
	padding-bottom: 380px;}
	
	.sonne { right:5vw;}
	#header { height:100px;}
	
	#logo img{ 	width: 200px; }
	.sticky #logo img { width:160px; }
	.sticky #header { height:80px;}
	
	.wohnung:nth-child(odd) .wohnung-bild{	order:3;}
	.wohnung:nth-child(odd) .wohnung-beschreibung{	order:2;}
	.wohnung:nth-child(odd) .wohnung-space{	order:1;}

	.galerie ul li {	flex: 0 0 25%;}
	.flex-62.galerie ul li { flex: 1 1 50%;}

	.flex-100{ 	flex:1 1 100%;}
	.flex-80{ 	flex:1 1 80%;}
	.flex-70{ 	flex:1 1 70%;}
	.flex-62{ 	flex:1 1 62%;}
	.flex-60{ 	flex:1 1 60%;}
	.flex-50{ 	flex:1 1 50%;}
	.flex-40{ 	flex:1 1 40%;}
	.flex-38{ 	flex:1 1 38%;}
	.flex-30{ 	flex: 1 1 30%;	min-width: 280px;}
	.flex-25{ 	flex:1 1 25%;}
	.flex-20{ 	flex:1 1 20%;}
	.flex-10{	flex:1 1 10%;}
}

@media (min-width:1200px){
	#header { height:120px;}
	#logo img{		width: 240px; }
	.sticky #logo img { width:180px; }
}


/* { border:1px solid red;}