@font-face {font-family: 'Amaranth';font-style: normal;font-weight: 400;src: local('Amaranth Regular'), local('Amaranth-Regular'),url('fonts/amaranth-v8-latin-regular.woff2') format('woff2'),url('fonts/amaranth-v8-latin-regular.woff') format('woff');}
@font-face {font-family: 'Amaranth';font-style: italic;font-weight: 400;src: local('Amaranth Italic'), local('Amaranth-Italic'),url('fonts/amaranth-v8-latin-italic.woff2') format('woff2'),url('fonts/amaranth-v8-latin-italic.woff') format('woff');}
@font-face {font-family: 'Amaranth';font-style: normal;font-weight: 700;src: local('Amaranth Bold'), local('Amaranth-Bold'),url('fonts/amaranth-v8-latin-700.woff2') format('woff2'),url('fonts/amaranth-v8-latin-700.woff') format('woff');}
@font-face {font-family: 'Amaranth';font-style: italic;font-weight: 700;src: local('Amaranth Bold Italic'), local('Amaranth-BoldItalic'),url('fonts/amaranth-v8-latin-700italic.woff2') format('woff2'),url('fonts/amaranth-v8-latin-700italic.woff') format('woff');}
:link { text-decoration:none; }
h1,h2,body,html,p { margin:0; padding:0 }
ul,ol,li { margin:0; padding:0 }
img, a img,:link img { border:none }
img { margin:0; padding:0; }
table {	border:0; padding:0px; margin-bottom:15px; border-spacing:0px; }
tr { border:none; padding:0px; margin:0px; }
td { border:none; padding:0px; margin:0px; vertical-align:top; border-spacing:0px; }
a:hover { text-decoration:none; }
html {
overflow-y: scroll;
}
.clear2 {
clear:both;
}
.clear3 {
clear:both;
}
.clear {
display:none;
}
body {
margin:0 0 0 0;
height:100%;
background-color: #dfdf7b;
font-size:1.2em;
font-family: 'Amaranth', Tahoma, Geneva, sans-serif;
color: #000;
}
.mobile-bg {
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
width: auto;
height: 100vh;
z-index: -100;
margin: 0;
background: url(../media/hintergrund.jpg) center no-repeat;
background-size: cover;
background-position:bottom;
}
#kopf {
position: relative;
width: 100%;
line-height:0;
}
#kopf img{
width: 100%;
}

#seitenbreite {
position: relative;
margin:10px auto 0 auto;
padding:0 10px 0 10px;
min-width: 950px;
max-width: 1600px;
}
#navi-mobil a#navbutton{display:none;}
#navi-mobil a#navbutton,#navi-mobil-buchung a#navbutton{
position:absolute;
top:-50px;
width:90px;
padding: 5px;
text-align:center;
font-size:1.2em;
font-weight:bold;
line-height: 24px;
color: #fff;
text-shadow:#000 2px 2px 1px;
background-image: linear-gradient(#42a62a 0%, #00661d 100%);
border-radius: 10px;
}
#navi-mobil-buchung a#navbutton:hover {
background-color:#dfdf7b;
background-image: linear-gradient(#dfdf7b 0%, #afaf47 100%);
}
#content {
display: grid;
grid-template-columns: 290px auto 290px;
width:auto;
padding:0px;
display: -ms-grid;
-ms-grid-columns: 290px 1fr 290px;
}
#navi, #navi-buchung {
z-index:1000;
width:280px;
position:relative;
text-align:center;
-ms-grid-row: 1;
-ms-grid-column: 1
}
#navi ul, #navi-buchung ul {
margin:0;
padding:0;
}
#navi ul li, #navi-buchung ul li {
font-weight:bold;
text-align:center;
text-decoration:none;
list-style:none;
}
#navi ul li a,#navi-buchung ul li a,
#navi ul li a:link {
display: block;
width:100%;
font-size: 1.2em;
line-height: 1.5em;
padding: 0;
margin: 0 0 8px 0;
color: #fff;
text-shadow:#000 1px 1px 2px;
border-radius: 10px;
background: #42a62a;
background-image: linear-gradient(#42a62a 0%, #00661d 100%);
}
#navi ul li a:hover, #navi-buchung ul li a:hover,
#navi ul li.active a, #navi-buchung ul li.active a {
color: #FF9;
}
#navi ul li ul,#navi-buchung ul li ul{
border-radius: 10px;
padding: 5px 5px 1px 5px;
margin-bottom:10px;
background-color:#FFF;
background: rgba(255,255,255,0.7);
}
#navi ul li ul li a, #navi-buchung ul li ul li a,
#navi ul li  ul li a:link {
display: block;
width:100%;
font-size: 1em;
line-height: 1.2em;
padding: 0;
margin: 0 0 8px 0;
color: #00661d!important;
text-shadow:none;
box-shadow:none;
background:none;
border-radius: none;
}
#navi ul li ul li a:hover, #navi-buchung ul li ul li a:hover,
#navi ul li ul li.active a, #navi-buchung ul li ul li.active a  {
color: #41a62a!important;
}
#sprache img{
width: 40px;
margin: 10px 10px 0 0;
box-shadow:#000 1px 1px 4px;
border-radius: 2px;
}
#sprache img:hover {
box-shadow:#00661d 1px 1px 4px;
}
/*buchung*/
#seitenbreite-buchung {
position: relative;
margin:10px auto 0 auto;
padding:0 10px 0 10px;
}
#content-buchung {
display: grid;
grid-template-columns: auto;
width:auto;
padding:0px;
display: -ms-grid;
-ms-grid-columns: 1fr;
}
#navi-buchung {
z-index:1000;
width:280px;
position:relative;
text-align:center;
-ms-grid-row: 1;
-ms-grid-column: 1
}
#navi-buchung {
display:none;
background:none;
float:left;
bottom: auto;
top: auto;
position:absolute;
line-height: 1.1em;
padding: 10px;
background-color:#FFF;
background: rgba(255,255,255,0.9);
border-radius: 10px;
}
#navi-buchung ul li ul {
background:none;
margin:0;
padding:0;
}
#navi-buchung ul li ul li a, 
#navi-buchung ul li ul li a:link {
background-image: none;
}

#navi-buchung ul li ul {
background:none;
margin:0;
padding:0;
}





#main {
padding:0 0 10px 0;
line-height: 1.3em;
background-color:#FFF;
background: rgba(255,255,255,0.7);
border-radius: 10px;
margin-bottom: 10px;
-ms-grid-row: 1;
-ms-grid-column: 2
}
#spalte_rechts {
margin-left: 10px;
-ms-grid-row: 1;
-ms-grid-column: 3
}
.box {
padding: 0 0 5px 0;
margin-bottom: 10px;
background-color:#FFF;
background: rgba(255,255,255,0.7);
border-radius: 10px;
}
.box p {
margin: 7px 10px 7px 10px;
text-align:center;
line-height: 1.2em;
}
.fab {
margin: 5px;
}
#main h1, .box h2, #main .lama h2 {
color:#fff;
background:#00661d;
background-image: linear-gradient(#42a62a 0%, #00661d 100%);
text-align:center;
padding: 5px 0 5px 0;
border-radius: 10px 10px 0 0;
font-weight:bold;
font-size:1.4em;
line-height:1.1em;
text-shadow:#000 1px 1px 1px;
}
#main h1 {
margin-bottom: 10px;
}
.box h2, #main .lama h2 {
margin: 0;
}
#fusszeile {
text-align:center;
margin-bottom:10px;
}
#fusszeile img {
margin: 5px 10px;
vertical-align: middle;
box-shadow:#000 1px 1px 3px;
}
/* allgemein */
a {
color: #00661d;
font-weight:bold;
}
a:hover,
a.aktiv,
a.aktiv:link {
color: #41a62a;
}
#main h2 {
color: #00661d;
font-weight:bold;
font-size:1.3em;
text-align:center;
margin: 15px 15px 10px 15px;
}
#main h3 {
color: #00661d;
font-weight:bold;
font-size:1.1em;
padding: 5px 0 0 0;
margin: 5px 15px 5px 15px;
}
#main ul {
line-height:1.4em;
margin:10px 10px 10px 40px;
padding:0px;
list-style-type: disc;	
}
#main li {
margin-bottom:3px;
}
p {
margin: 15px;
}
p.text-center {
text-align:center;
}
p.text-right {
text-align:right;
}
hr {
border: none;
border-top: 3px solid #00661d;
margin: 15px;
clear:both;
}
figure {margin:0}
img {
max-width: 100%;
height: auto;
border:none;
}
#main a img {
border-radius: 5px;
box-shadow:#000 1px 1px 4px;
}
#main a img:hover {
box-shadow:#00661d 1px 1px 4px;
}
.galerie {
text-align:center;
}
.galerie img {
margin: 5px;
}
.page {
width: 100%;
padding: 5px 0 5px 0;
}
.prev {
float:left;
padding-right: 10px;
margin: 10px 0 10px 20px;
}
.next {
float:right;
text-align:right;
padding-left: 10px;
margin: 10px 20px 10px 0;
}
.pleft {
float: left;
margin: 5px 15px 8px 15px;
}
.pright {
float: right;
margin: 5px 15px 8px 15px;
}
.block {
clear: both;
border: none;
text-align:center;
margin-bottom: 8px;
}
/* Lamas */
.lamapage {
padding:10px;
display: flex;
flex-wrap: wrap;
}
.lama-wrap {
width:50%;
float:left;
margin:10px 0 10px 0;
}
.lama {
height: 100%;
border-radius: 10px;
background: rgba(255,237,0,0.2);
margin:0 10px 0 10px;
border-bottom: 3px #00661d solid;
}
.lama img{
width: 100%;
}
.lama p {
margin:5px 10px 5px 10px;
}
.lamapics {
width:100%;
display: flex;
}
.lamapic {
width:50%;
}
#main .lama a img {
border-radius: 0;
box-shadow: none;
}
#main .lama a img:hover {
box-shadow: none;
}
/* formular */
.clear-form{
	clear:both;
}
.gsformular,.rex-yform {
width: 620px;
margin: 15px auto 20px auto;
}
.form-group {
width: 100%;
margin: 10px 0 15px 0;
}
.gsformular label {
text-align:right;
margin-right:20px;
float:left;
width: 280px;
font-weight:bold;
}
.text,input.form-control {
width:300px;
height: 25px;
padding: 0 5px 0 5px;
border:#00661d 1px solid;
border-radius: 5px;
box-shadow:#000 1px 1px 3px;
}
.gsformular .rb {
width: 300px;
float: left;
}
.gsformular .rbgroup {
width: 320px;
float:right;
}
.rex-yform .radio {
width: auto;
margin-left: 300px;
}
.rex-yform .checkbox {
margin-left: 180px;
}
.form-helper {
	margin-right: 5px;	
}
.rex-yform label.control-label {
text-align:right;
margin-right:20px;
float:left;
width: 280px;
font-weight:bold;
}
.rex-yform select.form-control {
width:120px;
height: 25px;
border:#00661d 1px solid;
border-radius: 5px;
box-shadow:#000 1px 1px 3px;
}
textarea.form-control {
width: 300px;
border:#00661d 1px solid;
border-radius: 5px;
padding: 5px;
text-shadow:#000 1px 1px 1px;
box-shadow:#000 1px 1px 3px;
}
.btn { 
margin-left:300px;
width: 310px;
font-size:1.1em;
font-family: 'Amaranth', Tahoma, Geneva, sans-serif;
font-weight:bold;
background-color:#00661d;
padding: 5px;
border: 0;
color: #FFF;
background: #42a62a;
background-image: linear-gradient(#42a62a 0%, #00661d 100%);
border-radius: 5px;
text-shadow:#000 1px 1px 1px;
box-shadow:#000 1px 1px 3px;
}
.btn:hover {
background-color:#dfdf7b;
background-image: linear-gradient(#dfdf7b 0%, #afaf47 100%);
}
.alert {
margin: 10px 15px 10px 15px;
}
.alert-danger {color: #C30;}

/* Video */
.video {
text-align:center;
margin:15px;
}
#matomo-opt-out {
background:#fff;
padding: 15px;
}
.sleeperoo_calendar_api {
float:right;
max-width: 40%;
margin: 10px;
}
@media only screen and (min-width:176px) and (max-width:1300px) {
#navi-mobil a#navbutton{
display:block;
}
#navi {
display:none;
background:none;
float:left;
bottom: auto;
top: auto;
position:absolute;
line-height: 1.1em;
padding: 10px;
background-color:#FFF;
background: rgba(255,255,255,0.9);
border-radius: 10px;
}
#navi ul li ul {
background:none;
margin:0;
padding:0;
}
#navi ul li ul li a, 
#navi ul li ul li a:link {
background: none;
}
#content {
width: auto;
margin:0;
grid-template-columns: 0 auto 290px;
-ms-grid-columns: 0 1fr 290px;
}
}
@media only screen and (min-width:176px) and (max-width:1000px) {
html {
background: no-repeat center bottom fixed;
background-size: cover;
height: 115%;
overflow: scroll;
background-attachment:scroll;
}
body {
font-size: 18px;
}
.clear2 {
display:none;
}
.clear {
display:inherit;
clear:both;
}
img {
max-width: 100%;
height: auto;
}
#seitenbreite,#seitenbreite-buchung{
min-width: 250px;
width:100%;
padding:0;
}
#content,#content-buchung {
display:block;
grid-template-columns: auto;
}
#navi,#navi-mobil,#navi-buchung,#navi-mobil-buchung {
margin-left:10px;
}
#main {
float:none;
width: auto;
margin:0 10px 0 10px;
}
#spalte_rechts {
width: auto;
position:relative;
float:none;
text-align:center;
padding: 10px 10px 5px 10px;
margin:0;
}
#fusszeile p{
margin:0;
}
}
@media only screen and (min-width:176px) and (max-width:650px) {
.clear, .clear3 {
display:none;
}
.lama-wrap {
width:100%;
float:none;
}
.lama {
height:auto;
}
.einzelbild {
text-align:center;
}
.pleft, .pright, .block {
float: none;
margin: 8px 0 8px 0;
}
.gsformular, .rex-yform {width: auto; margin: 0 15px 10px 15px;}
.gsformular label, .rex-yform label.control-label {float:none; width: 100%;}
.text, input.form-control,  textarea.form-control { width:100%; padding:0;}
.gsformular .rbgroup {width: 100%; float:right;
}
.btn { margin:0; width: 100%;}
.rex-yform .radio {width:100%; float: none; margin:0}
.rex-yform select.form-control {
width:100%;
}

}
@media only screen and (min-width:176px) and (max-width:450px) {
.einzelbild img, .galerie img {
max-width: 90%;
}
}
@media only screen and (min-width:176px) and (max-width:300px) {
.galerie img {
margin: 10px 0 10px 0;
}
}