/* cmsms stylesheet: Annemaries-Haus-Custom-Styles modified: Montag, 14. Juli 2025 21:12:05 */
/* Annemaries-Haus-Custom-Styles */


/* General */
html, body { line-height: 1.7; }
body { font-family: 'Arial', sans-serif }
p, label, input { font-size: 1em }
a:focus { outline: none }
.logo img { display: block; margin: 0 auto }
button, .button { background: #005F00; color: #fff; border: 1px solid #ccc; padding: 8px 12px; text-decoration: none; transition: all .2s ease; }
button:hover, .button:hover { color: #ccc; text-decoration: none; transition: all .2s ease; }
img { max-width: 100%; height: auto; }
@media only screen and (min-width:1140px) {
    #main { margin-top: 45px }
}

/* Colors */
a, a:link, a:visited, a:hover, a:active { color: #005F00; }
body {color:rgb(75, 75, 75);}
p, li, dl, dt, span {color:inherit;}
p {overflow:auto;} /* clearfloat for images */
#boxed #wrapper { border-top: none; box-shadow: none }
h2 { font-size: 1.25em; color: #005F00; }
h3 { font-size: 1.125em; color: #1b2024; font-weight: 700; }
h4 { font-size: 1em; color: #1b2024; font-weight: 700; }
h1 {line-height:1.1;}
h2, h3 { line-height: 1.2 }
.h2 {margin:1em 0;}
h3 {margin-top:3em;margin-bottom:.625em}
p{margin-top:.3125em}
/* Helpers */
.small {font-size:85%}
.btn {
    background: rgb(233, 233, 233);
    color: #080;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    text-decoration: none;
}
.btn:hover {text-decoration:none;background: rgb(231, 244, 252);}
.middle {
    font-size: 100%;
    margin-right: 2px;
    bottom: 0.5em;
}
/* Effects */
.shadow {
    box-shadow: 0 2px 4px 0 rgba(33,33,33,0.14),0 3px 5px 0 rgba(33,33,33,0.06),0 1px 20px 0 rgba(33,33,33,0.1);
    border: 10px solid #fff;
}
.content-inner {  
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}
  
/* Navi */
#main-menu { background: #005F00; }
#main-menu > li > a, #main-menu > li.sectionheader > span, #footer-menu > li > a, #footer-menu > li.sectionheader > span { font-family: 'Arial Narrow Bold', sans-serif; text-transform: none; color: #fff; text-decoration: none; }
.content-wrapper { background: #fff; background: rgba(255, 255, 255, .75) }
.footer { background: #005F00; background: rgba(0, 136, 0, 0.75) }
.dev_link a, .dev_link a:link, .dev_link a:visited, .dev_link a:active { color: #fff; text-decoration: none }
#footer-menu a { text-align: right; font-weight: 400 }
.current a, .current a:hover, .current a:visited, .current a:active, #main-menu > li.current > a, #main-menu > li.current.sectionheader > span, #main-menu > li:hover > a, #main-menu > li.sectionheader:hover > span { text-decoration: none !important; }
#main-menu > li:hover > a { color: #ccc !important; text-decoration: underline !important; }
.current a span { color: #fff }
#main-menu > li > a > span { text-shadow: none }
#main-menu > li > a { color: #ccc }

/* Bilder */
figure {background:rgba(143,168,219,0.3);margin-bottom:1.2em;border-radius:20px;}
figcaption {padding: 2em;font-weight:500}
@media only screen and (min-width:768px) {
.img-right {float:right;margin:0 0 1.25em 1.25em;}
.img-left {float:left;margin:0 1.25em 1.25em 0;}
}

/* Seitenanpassungen */
.page-home .aside {margin-top:60px}
.page-home .aside ul  {padding-left:4px}
.page-home .aside li  {list-style: none;}
.page-home .aside li:before {content:' ';width:20px;height:20px;background:#005F00;display: inline-block;height: 10px;margin-right: 8px;}

.overview .twelve-col { padding: 25px; background: #fff; box-sizing: border-box; margin-bottom: 40px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.25) }
table { width: 100%; background: #fff; }
.table > thead > tr > th { vertical-align: bottom; border-bottom: 2px solid #ddd; background: #005F00; color: #fff; }
.table > thead > tr > th { vertical-align: bottom; border-bottom: 2px solid #ddd; }
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { padding: 8px; line-height: 1.7; vertical-align: top; border-top: 1px solid #ddd; }
.table > tbody > tr > td { text-align: center }
table td {padding: 0 20px}

/* Panels */
.collapse { display: none }
.collapse.in { display: block; }
.panel-group .panel + .panel { margin-top: 5px; }
.panel, .panel-heading, .panel-group .panel { border-radius: 0; }
.panel-group .panel { margin-bottom: 20px; }
.panel-default { border-color: #ccc; }
.panel { margin-bottom: 20px; background: #e9e7e8; border: 1px solid transparent; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2); box-shadow: 0 1px 1px rgba(0, 0, 0, .2); }
h2.panel-title { font-size: 22px }
.panel-heading a { display: block; padding: 5px 15px; text-decoration: none; outline: none; }
.panel-heading a span { font-size: 13px; float: right; text-align: right; }
.panel-body { padding: 5px 15px; background: #e9e7e8; }
.panel-body .row { border-top: 1px solid #d4d2d3 }
.panel-body address { font-weight: 700; font-style: normal; margin-top: 10px }
.panel-body address a { text-decoration: none; font-weight: 400; }
.panel-body address a:hover { text-decoration: underline; }

/* Wohnung */
.page-wohnung .three-col td:nth-child(odd) { background: #efefef; }
.page-wohnung table.table { border: 5px solid #fff; box-shadow: 0 20px 20px -18px rgba(0, 0, 0, 0.09); }

/* Umgebung */
.page-umgebung { padding-bottom: 5px }

/* seitliche Leiste soll immer erscheinen */
.page-umgebung #accordion-1 .panel-body { background: #fcfcfc; padding-top: 30px; padding-bottom: 30px }
.page-umgebung #accordion-1 .panel-body .row { border: none }
.page-umgebung #accordion-1 img { border: 5px solid #fff; box-shadow: 0 20px 20px -18px rgba(0, 0, 0, 0.09); }

/* Preise */
.preishinweis { text-align: center; padding: 20px; background: #005F00; border: 4px solid #fff; color: #fff;margin-top:20px; }
.table.preise th {color:#000;background:#bcb1af30}
.table.preise tr,.table.preise td {text-align: right;}
.table.preise small {
 color: #005F00;
 display:block;
 line-height:1.1;
 font-family:verdana;
 font-size:13px;
 font-weight:100;
}
.table.preise td {padding:20px;}
.table.preise th {width: 20%}
/* Kalender */
.jsavailability .previous-button, .jsavailability .next-button { top: 50% !important; margin-top: -16px }
.clndr, .item-properties { background: #fff }
.item-properties { padding: 20px }
.calendar-month .row::before { content: none; }
.clndr .controls .month { background: #005F00; color: #fff }
.clndr .day.event-start, .clndr .day.event-start.event-end, .clndr .day.event-end {text-indent: 0 !important; color: #ccc !important }
body .clndr .day.event, .clndr .day.event-start.event-end { color: #000!important }
.day.event.event-start.event-end { background: #f26a6d !important; }
.jsavailability .row::before, .jsavailability .row::after { content: inherit; }
table.clndr { text-align: left; }
table.clndr td.day, table.clndr td.event-start, table.clndr td.event-end { width: 53px; height: 37px; background-size: 53px 37px }
table tr { border: 1px solid #ccc; margin: 10px; }
table.clndr span { padding: 8px }
table.clndr { width: 80%; margin: 60px auto; table-layout: fixed; }
table.clndr img { padding: 8px 10px }
.clndr .day {color:#121E00 !important;}
.belegt:after,
.frei:after,
.belegtab:after,
.belegtbis:after {
  content: " ";
  height: 0;
  width: 0;
  display: block;
  position: relative;
}
.belegt:after {border:20px solid #f26a6d}
.frei:after {border:20px solid#a0e67d;}

.belegtab::after {
  border-top: 20px solid #a0e67d;
  border-right: 20px solid #f26a6d;
  border-bottom: 20px solid #f26a6d;
  border-left: 20px solid #a0e67d;
}
.belegtbis:after {
    border-top: 20px solid #f26a6d;
    border-right: 20px solid #89e15d;
    border-bottom: 20px solid #89e15d;
    border-left: 20px solid #f26a6d;
}

/* Sprache der Tagesangabe in Deutsch anpassen */
.headers .day-header:nth-child(2), .headers .day-header:nth-child(3), .headers .day-header:nth-child(4) { color: transparent; font-size: 0 }
.headers .day-header:nth-child(2)::after, .headers .day-header:nth-child(4)::after { content: 'D'; color: #005F00; font-size: 16px }
.headers .day-header:nth-child(3)::after { content: 'M'; color: #005F00; font-size: 16px }

/* Kontakt / Anfahrt */
#message {margin-bottom: 2.5em;min-height:200px}
input, select, textarea {padding:12px}
.dsb {margin-top: 20px}
fieldset.dsb {margin-bottom: 1.5em}
/* Responsive Anpassung Kalender */
@media only screen and (max-width:767px) {
    .calendar-month { width: 90% !important; margin-bottom: 60px !important; margin-left: 5% !important; }
    .clndr img { max-width: 30px; }
    table.clndr { width: 100%; }
    table.clndr tr td { width: auto !important; }
}

/* Anfrage */
form div { margin-bottom: 8px }
legend { font-weight: 700; font-size: 1.25em }
#fbrp__37 { background: #efefef; }
#fbrp__37, #fbrp__59 { padding: 35px; margin-bottom: 30px; }
#fbrp__61 { border-top: 1px solid #efefef; padding: 35px }
.cms_submit {background: #016d01;color: #fff;}
.cms_submit:hover {background: #008800;}

/* DatenschutzCheckbox */
.dsb {padding:0.5em;}
.dsb .cms_checkbox + label { width: calc(100% - 35px); display: inline-block; }
.dsb .dsb {font-size:85%; padding: 1em 2em;border:1px solid #ccc}
.dsb {background:#ddd}
.dsb .dsb label { display: inline-block!important;width: calc(100% - 40px); margin-top: 4px} 
.dsb .cms_checkbox {display: inline-block;width: 20px;height: 20px;vertical-align: top;}
/* Buchungsformular */
.buchungsformular {
    background: #ebe7e7;
    padding: 2em;
}

/* Unterkunft */
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
.block {background: #ebe7e7;padding:.875em 2em;border:1px solid #ccc;margin-bottom: 2em}

/* OWL Carousel Wohnungsslider Custom */
.owl-carousel { position: relative; }
.owl-prev, .owl-next { position: absolute; top: 0%; z-index: 10; background: transparent; border: none; font-size: 50px; display: block; height: 100%; background: #fff; background: rgba(255, 255, 255, .65); color: #005F00; box-shadow: 0 0 5px rgba(0, 0, 0, .1); }
.owl-prev { left: 0; }
.owl-next { right: 0; }
.owl-theme .owl-dots .owl-dot span { background: #fff !important }
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #005F00 !important; }
.owl-item img { box-shadow: 0 20px 25px -12px rgba(0, 0, 0, 0.09);/*! border:5px solid #fff; *//*! border-width:5px 0; */ }
.owl-dots { margin-top: 25px; }
.owl-carousel figure { position: relative; width: 100% }
.owl-carousel figcaption { position: absolute; left: 0; bottom: 0; padding: 20px; background: #fff; background: rgba(255, 255, 255, .9); opacity: 0; transition: all .25s ease; width: 100%; max-width: 100%; box-sizing: border-box; }
.owl-carousel figure:hover figcaption { opacity: 1; transition: all .25s ease; }

/* Mobile First */

/*  < 480px  */
@media only screen and (max-width:479px) {
    body#boxed { background: #005F00 }
    .logo img { width: 270px }
    form { padding-left: 0; padding-right: 0; }
    fieldset { padding-left: 12px !important; padding-right: 12px !important; }
    .container { padding: 0 }
    #footer-menu a { padding-top: 5px; padding-bottom: 5px }
}

/*  < 768x */
@media only screen and (min-width:480px) and (max-width:767px) {
    .logo img { width: 350px }
    .owl-carousel figure figcaption { opacity: 1; transition: all .25s ease; }
}

/* > 767px  */
@media only screen and (min-width:768px) {
    #main-menu > li.current > a, #main-menu > li.current.sectionheader > span, #main-menu > li:hover > a, #main-menu > li.sectionheader:hover > span { color: #203652 }
    #main-menu > li { border: none }
    .page-wohnung .nine-col { padding-right: 140px; box-sizing: border-box }
    .jsavailability { padding: 0 30px }
}
@media only screen and (min-width:768px) and (max-width:996px) {
    #main-menu > li > a > span {
        padding-left: 0.625em;
        padding-right: 0.625em;
    }
}

/* > 767px  */
@media only screen and (max-width:767px) {
    body {font-size:14px}
    .logo a,.logo img  {display: inline-block;}
    .logo img { margin: 0 auto }
    .responsive-table {overflow-x: auto}
    .owl-carousel figcaption { position: static; opacity: 1; }
    body.page-kontakt .dsb label { display: inline-block; width: calc(100% - 40px); margin-top: 4px }
    body.page-kontakt .dsb input[type="checkbox"] { float: left; width: auto; margin-right: 8px; display: inline; height: 20px; width: 20px; }
    .page-home .eight-col, .page-home .four-col {width:100%;}
    .page-anreise .aside {padding:2em;}
    .owl-carousel + .button, .owl-carousel + .button + .button , .owl-dots, .owl-next, .owl-prev {display: none}
}
@media only screen and (max-width:991px) {
h1 {font-size:1.725em}
.page-unterkunft .row .four-col, .page-unterkunft .row .eight-col {width: 100%;margin-left:0}
.page-unterkunft .inner-block table tr {
    display: block;
    width: 100%!important;
    max-width: 100%;
    border: none;
    background: #f2f2f2;
    margin: 0;
  height:100%
}

.page-unterkunft .inner-block table td {
    display: block;
    width: 100%!important;
    padding: 8px;
    max-width: 100%;
    border: none;
    border-bottom: 1px solid #ddd;
    height: 40px;
  box-sizing: border-box;
}
}


@media only screen and (min-width:1050px) {
    figure {display: flex;}
}
/* < 1480 px  */
@media only screen and (max-width:1480px) {
    .clndr .day.event-end { background: url("https://annemaries-haus.de/uploads/Annemaries-Haus/images/fewo-quad-end.jpg") repeat-y 0 0 !important; background-size: cover !important; }
    .clndr .day.event-start { background: url("https://annemaries-haus.de/uploads/Annemaries-Haus/images/fewo-quad-start.jpg") repeat-y 0 0 !important; background-size: cover !important; }
}
/* Zusatz Barrierefreiheit */
/* 1) Skip-Links standardmäßig off-screen parken */
.skip-links {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* 2) Sobald der Link per Tab-Fokus erreicht wird, sichtbar machen */
.skip-links:focus {
  position: static;      /* an den normalen Flow zurück */
  width: auto;
  height: auto;
  background: #005ea0;    /* gute Kontrastfarbe */
  color: white;
  padding: 0.5em 1em;
  z-index: 1000;          /* über allen anderen Inhalten */
  text-decoration: none;  /* optional entfernen */
}

/* Optional: etwas rundere Ecken etc. */
.skip-links:focus {
  border-radius: 4px;
  box-shadow: 0 0 4px rgba(0,0,0,0.5);
}
/* sr-only: nur für Screenreader sichtbar, visuell komplett ausblenden */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}