html, body {
  width: 100%;
  padding: 0;
  margin: 0;
}
html, body, input, p, a {
  font-family: arial, verdana, tahoma, sans-serif;
  font-size: 12px;
  line-height: 16px;
  color: #054055;
  -webkit-text-size-adjust: none;
}
hr {
  float: left;
  clear: both;
  display: block;
  width: 100%;
  height: 1px;
  color: #ccc; /* IE */
  background-color: #ccc; /* Mozilla, Opera */
  outline: 0;
  padding: 0;
  margin: 5px 0;
}
a img {
  border: 0;
}
a, input {
  outline: 0;
}
p {
  padding: 0;
  margin: 10px 0;
}
/********************* Listen ***********************************************/
ul {
  padding: 0 0 0 5px;
  margin: 2px 0 15px 15px;
}
li {
  padding: 0;
  margin: 0;
  margin-bottom: 8px;
}
li.off {
  list-style-type: none;
  list-style-image: none;
}
/************************************************ Links und Überschriften *****/
a {
  font-size: 12px;
  font-weight: normal;
  color: #3f82ca;
  cursor: pointer;
}
a:hover {
  text-decoration: underline;
}
h1 {
  display: block;
  clear: left;
  font-size: 18px;
  font-weight: bold;
  color: #0679a1;
  padding: 0;
  margin: 0 0 5px 0;
}
h1.orange {
  display: block;
  clear: left;
  font-size: 17px;
  font-weight: bold;
  color: #c8753e;
  padding: 0;
  margin: 10px 0 5px 0;
}
h2, p.willkommen {
  clear: left;
  font-size: 16px;
  font-weight: bold;
  color: #0679a1;
  padding: 0;
  margin: 0 0 5px 0;
}
p.willkommen {
  text-align: center;
  text-shadow: 2px 1px 5px #A8A8A8;
  font-weight: normal;
  font-size: 18px;
}
h2.top {
  margin: 15px 0 0 0;
}
h3 {
  clear: left;
  font-size: 14px;
  font-weight: bold;
  color: #617080;
  padding: 0;
  margin: 10px 0 0;
}
#aktuelles { /* h1 */
  color: #c8753e;
}
h1 small, h2 small {
  font-size: 12px;
}
h2.gastgeber {
  margin: 20px 0 5px 0
}
h3.gastgeber {
  margin: 15px 0 5px 0
}
/************************************************ strukturgebende divs ********/
#index {
  position: relative;
  width: 984px;
  padding: 0;
  margin: 30px auto 0;
}
#head {
  width: 100%;
  height: 165px;
  background: #F6F7FB url(../bilder/layout/kopf-hg.jpg) 0 18px repeat-x;
  margin-top: 40px;
}
#home {
  float: left;
  width: 984px;
  margin: 5px 0 0 0;
}
#left {
  position: relative;
  float: left;
  width: 215px;
  margin: 3px 0 0 2px;
  z-index: 2;
}
#navi {
  position: relative;
  float: left;
  width: 215px;
  background: transparent url(../bilder/layout/navi-content-sprite.png) 0 0 repeat-y;
  z-index: 2;
}
#content {
  float: left;
  width: 584px;
  /*background:url(../bilder/layout/navi-content-sprite.png) -799px 0 repeat-y;*/
  padding: 0;
  /*padding:20px 15px 0;*/
  margin: 0 10px;
}
#right {
  position: relative;
  float: right;
  width: 162px;
  margin: 3px 0 0;
  z-index: 2;
}
/************************************************ Layer Inhalte ***************/
/* INDEX */
#hg {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 754px;
  height: 1109px;
  background: transparent url(../bilder/layout/hg-wappen.png) 0 0 no-repeat;
  opacity: 0.5;
  z-index: 1;
}
/* HEAD */
#head .center {
  position: relative;
  width: 984px;
  margin: 0 auto;
}
#head img {
  float: left;
}
#wetter {
  float: left;
  width: 162px;
  height: 110px;
  color: #bfdfff;
  font-size: 10px;
  padding: 35px 0 0 8px;
  margin: 20px 0 0;
}
.share {
  float: left;
  width: 556px;
  margin: 10px 0;
  padding: 10px 0 10px 10px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.share > div {
  float: left;
  margin-left: 12px;
}
.share span {
  margin-left: 5px;
}
.share span.right {
  float: right;
}
/**************** Top Leiste ( facebook, G+, eng, deu ) ********************/
#top {
  background-color: #444444;
  position: absolute;
  height: 40px;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 900;
}
#top-index {
  margin: 0 auto;
  position: relative;
  width: 980px;
}
#top-links {
  color: #000000;
  height: 20px;
  left: 0;
  padding: 4px 0;
  position: absolute;
  top: 0;
  white-space: nowrap;
  width: 130px;
  z-index: 1000;
}
#top-rechts {
  height: 20px;
  padding: 4px 0;
  position: absolute;
  right: 0;
  top: 0;
  white-space: nowrap;
  z-index: 1000;
  width: 580px;
  text-align: right;
}
#top-links .button {
  float: left;
  margin-right: 10px;
}
#top-rechts a {
  color: #FFFFFF;
  padding: 0 0 0 10px;
  text-decoration: none;
}
/* NAVI */
#navi_oben {
  width: 215px;
  background: url(../bilder/layout/navi-oben.jpg) 0 0 no-repeat;
}
#navi_mitte {
  padding: 30px 10px 0 35px;
}
#navi_unten {
  float: left;
  width: 215px;
  height: 10px;
  background: #fafbfd url(../bilder/layout/navi-unten.jpg) 0 0 no-repeat;
  margin: 30px 0 -10px -35px;
}
#navi_i-marke {
  position: relative;
  float: left;
  width: 215px;
  height: 44px;
  background: url(../bilder/layout/i-marke-navi.png) 0 0 no-repeat;
  margin-top: 40px;
  z-index: 2;
}
#navi a {
  text-decoration: none;
  display: block;
  color: #0b3682;
  font-size: 14px;
  font-weight: bold;
  margin: 5px 0;
}
#navi a:hover {
  color: #438b20;
}
#sublinks {
  margin: 0 0 15px 0;
}
#navi a.aktiv {
  color: #438b20;
  text-decoration: underline;
}
#navi a.sup {
  background: url(../bilder/layout/navi-sprite.png) 0 -32px no-repeat;
  margin-left: -13px;
  padding-left: 13px;
}
#navi a.sup:hover {
  background-position: 0 4px;
  color: #438b20;
}
#navi a.sup_aktiv, #navi a.sup_aktiv:hover {
  background-position: 0 -14px;
  color: #438b20;
}
#sublinks a {
  color: #0b3682;
  font-size: 12px;
  font-weight: normal;
  margin: 0 0 0 10px;
}
/* CONTENT */
#content_oben {
  width: 584px;
  height: 2px;
  background: url(../bilder/layout/navi-content-sprite.png) -215px 0 repeat-y;
  margin: -20px 0 10px -15px;
}
#content_oben + img {
  margin-bottom: 7px;
}
.content {
  position: relative;
  float: left;
  width: 569px;
  background: transparent url(../bilder/layout/content-div-mitte.png) repeat-y;
  padding: 5px 10px;
  margin: 8px 0;
  z-index: 2;
}
.content div.oben, .content div.unten {
  position: absolute;
  left: 0;
  width: 584px;
  height: 5px;
  z-index: 2;
}
.content div.oben {
  top: -5px;
  background: transparent url(../bilder/layout/content-div-oben.png) no-repeat;
}
.content div.unten {
  bottom: -5px;
  background: transparent url(../bilder/layout/content-div-unten.png) no-repeat;
}
.img {
  position: relative;
  width: 164px;
  background-color: #fff;
  margin: 0 0 6px;
}
.img.rechts {
  float: right;
  clear: right;
  margin-left: 15px;
}
.img.gastgeber {
  float: right;
  margin-left: 6px;
}
.img img {
  padding: 6px 7px 7px 6px;
}
#content .img span {
  position: absolute;
  padding: 0;
  margin: 0;
}
#content span._o {
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: url(../bilder/layout/rahmen-sprite02.png) 0 -4px repeat-x;
  z-index: 3;
}
#content span._u {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  background: url(../bilder/layout/rahmen-sprite02.png) 0 0 repeat-x;
  z-index: 4;
}
#content span._l {
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background: url(../bilder/layout/rahmen-sprite01.png) 0 0 repeat-y;
  z-index: 5;
}
#content span._r {
  top: 0;
  right: 0;
  width: 5px;
  height: 100%;
  background: url(../bilder/layout/rahmen-sprite01.png) -3px 0 repeat-y;
  z-index: 6;
}
#content span._ol {
  top: 0;
  left: 0;
  width: 5px;
  height: 5px;
  background: url(../bilder/layout/rahmen-sprite01.png) -8px 0 no-repeat;
  z-index: 7;
}
#content span._ul {
  bottom: 0;
  left: 1px;
  width: 6px;
  height: 6px;
  background: url(../bilder/layout/rahmen-sprite01.png) -20px 0 no-repeat;
  z-index: 8;
}
#content span._or {
  top: 0;
  right: 1px;
  width: 6px;
  height: 6px;
  background: url(../bilder/layout/rahmen-sprite01.png) -12px 0 no-repeat;
  z-index: 9;
}
#content span._ur {
  bottom: 0;
  right: 1px;
  width: 6px;
  height: 6px;
  background: url(../bilder/layout/rahmen-sprite01.png) -24px 0 no-repeat;
  z-index: 10;
}
.drei_bilder {
  position: relative;
  display: block;
  height: 150px;
  margin: 10px 0;
}
.drei_bilder > div {
  position: absolute;
  background: transparent url(../bilder/layout/rahmen.png) 0 0 no-repeat;
}
.drei_bilder .img img {
  padding-left: 5px;
}
.drei_bilder ._1 {
  top: 30px;
  left: 55px;
  z-index: 1;
}
.drei_bilder ._1 img {
  z-index: 2;
}
.drei_bilder ._2 {
  top: 0;
  left: 200px;
  z-index: 3;
}
.drei_bilder ._2 img {
  z-index: 4;
}
.drei_bilder ._3 {
  top: 30px;
  right: 55px;
  z-index: 5;
}
.drei_bilder ._3 img {
  z-index: 6;
}
.content div.ganz_unten {
  position: relative;
  float: left;
  width: 582px;
  height: 0;
  font-size: 11px;
  text-align: center;
  background: transparent url(../bilder/layout/content-div-ganz-unten.png) 0 0 no-repeat;
  padding: 77px 0 0 0;
  margin: 20px 0 -5px -9px;
  z-index: 2;
}
/* RIGHT Unterkunft Buchen und Banner*/
.kinder_show {
  display: inline;
}
.kinder_hide {
  display: none;
}
.reise {
  height: 22px;
  margin: 4px 0 0 15px;
}
#kindalter {
  margin: 4px 0 0 15px;
  float: left;
  height: auto;
}
#kindalter select {
  margin: 4px 0 0 90px;
  float: left;
}
.reise input, select {
  border: 1px solid #9CB3C3;
}
.reise select {
  min-width: 45px;
}
.reise label {
  margin: 2px 14px 0 0;
  width: 75px;
  float: left
}
#online_buchung_maske {
  float: left;
  height: auto;
  width: 164px;
}
#online_buchung_maske_oben {
  background: url("../bilder/layout/box-online-buchen_kopf.jpg") no-repeat scroll 0 0 transparent;
  float: left;
  width: 164px;
  height: 34px;
}
#online_buchung_maske_content {
  background: url("../bilder/layout/box-online-buchen_mitte.png") repeat-y scroll 0 0 transparent;
  float: left;
  width: 164px;
  height: auto;
}
#online_buchung_maske_unten {
  background: url("../bilder/layout/box-online-buchen_unten.png") no-repeat scroll 0 0 transparent;
  float: left;
  width: 164px;
  height: 3px;
}
#online_buchung_maske_content .submit {
  margin: 7px 0 3px 40px;
  width: 80px;
  float: left;
}
a.direkt_buchen_tuk {
  display: inline-block;
  background: url("../bilder/layout/button-buchen-tuk.png") no-repeat scroll 0 0 transparent;
  height: 110px;
  width: 115px;
}
a.direkt_buchen_tuk:hover {
  background-position: -115px 0;
}
a.direkt_suchen_buchen {
  float: right;
  background: url("../bilder/layout/button-suchen-buchen.png") no-repeat scroll 0 0 transparent;
  height: 50px;
  width: 108px;
  margin-top: 10px;
}
a.direkt_suchen_buchen:hover {
  background-position: -109px 0;
}
a.direkt_buchen {
  float: right;
  background: url("../bilder/layout/button-angebot-direkt.png") no-repeat scroll 0 0 transparent;
  height: 50px;
  width: 108px;
  margin-top: 10px;
}
a.direkt_buchen:hover {
  background-position: -109px 0;
}
.buchungFeld {
  float: left;
  margin-right: 20px;
}
.buchungKalender {
  float: left;
}
/* HTML5-Banner */
#bframe.wrapper {
  position: relative;
  float: left;
  margin-top: 5px;
  border: 1px solid #ccc;
}
#bframe iframe, #bframe a {
  width: 160px;
  height: 600px;
}
#bframe iframe {
  border: 0;
  background: url(/banner/laden.gif) center center no-repeat;
}
#bframe a {
  position: absolute;
  top: 0;
  left: 0;
}
.oeffnungszeiten {
  width: 100%;
  text-align: center;
}
.oeffnungszeiten tr td:first-child {
  text-align: left;
}
/* WETTER_API */
/* allgemein */
#wetter_api {
  float: left;
  width: 98%;
  margin: 0 1%;
}
#wetter_api div {
  float: left;
}
#wetter_api .zustand {
  width: 40px;
  height: 40px;
  background: url(/bilder/layout/wetter-icons-sprite.png) #ccc 0 0 no-repeat;
  border: 1px solid #ddd;
  margin: 3px 5px 0 0;
}
#vorhersagen .zustand {
  width: 17px;
  height: 17px;
  margin: 3px 3px 3px 0;
}
#beobachtung, #vorhersagen {
  width: 100%;
}
#wetter_api span {
  display: block;
}
#vorhersagen div {
  width: 53px;
}
#wetter_api .klein {
  background-position-y: -40px;
}
#wetter_api .gross {
  background-position-y: 0;
}
#wetter_api .klein.wolkenlos {
  background-position-x: 0;
}
#wetter_api .klein.heiter {
  background-position-x: -17px;
}
#wetter_api .klein.bewoelkt {
  background-position-x: -34px;
}
#wetter_api .klein.bedeckt {
  background-position-x: -51px;
}
#wetter_api .klein.nebel {
  background-position-x: -68px;
}
#wetter_api .klein.gefrierender_nebel {
  background-position-x: -85px;
}
#wetter_api .klein.leichter_regen, #wetter_api .klein.regenschauer {
  background-position-x: -102px;
}
#wetter_api .klein.regen, #wetter_api .klein.kraeftiger_regenschauer {
  background-position-x: -119px;
}
#wetter_api .klein.kraeftiger_regen {
  background-position-x: -136px;
}
#wetter_api .klein.gefrierender_regen {
  background-position-x: -153px;
}
#wetter_api .klein.kraeftiger_gefrierender_regen {
  background-position-x: -170px;
}
#wetter_api .klein.schneeregen, #wetter_api .klein.kraeftiger_schneeregenschauer {
  background-position-x: -187px;
}
#wetter_api .klein.kraeftiger_schneeregen {
  background-position-x: -204px;
}
#wetter_api .klein.leichter_schneefall, #wetter_api .klein.schneeschauer {
  background-position-x: -221px;
}
#wetter_api .klein.schneefall, #wetter_api .klein.kraeftiger_schneeschauer {
  background-position-x: -238px;
}
#wetter_api .klein.kraeftiger_schneefall {
  background-position-x: -255px;
}
#wetter_api .klein.eiskoerner, #wetter_api .klein.kraeftiger_graupelschauer {
  background-position-x: -272px;
}
#wetter_api .klein.schneeregenschauer {
  background-position-x: -289px;
}
#wetter_api .klein.graupelschauer {
  background-position-x: -306px;
}
#wetter_api .klein.gewitter_ohne_niederschlag {
  background-position-x: -323px;
}
#wetter_api .klein.gewitter {
  background-position-x: -340px;
}
#wetter_api .klein.kraeftiges_gewitter {
  background-position-x: -357px;
}
#wetter_api .klein.gewitter_mit_hagel {
  background-position-x: -374px;
}
#wetter_api .klein.kraeftiges_gewitter_mit_hagel {
  background-position-x: -391px;
}
#wetter_api .klein.boen {
  background-position-x: -408px;
}
#wetter_api .klein.sandsturm {
  background-position-x: -425px;
}
#wetter_api .klein.kein_wetter {
  background-position-x: -442px;
}
#wetter_api .gross.wolkenlos {
  background-position-x: 0;
}
#wetter_api .gross.heiter {
  background-position-x: -40px;
}
#wetter_api .gross.bewoelkt {
  background-position-x: -80px;
}
#wetter_api .gross.bedeckt {
  background-position-x: -120px;
}
#wetter_api .gross.nebel {
  background-position-x: -160px;
}
#wetter_api .gross.gefrierender_nebel {
  background-position-x: -200px;
}
#wetter_api .gross.leichter_regen, #wetter_api .gross.regenschauer {
  background-position-x: -240px;
}
#wetter_api .gross.regen, #wetter_api .gross.kraeftiger_regenschauer {
  background-position-x: -280px;
}
#wetter_api .gross.kraeftiger_regen {
  background-position-x: -320px;
}
#wetter_api .gross.gefrierender_regen {
  background-position-x: -340px;
}
#wetter_api .gross.kraeftiger_gefrierender_regen {
  background-position-x: -400px;
}
#wetter_api .gross.schneeregen, #wetter_api .gross.kraeftiger_schneeregenschauer {
  background-position-x: -440px;
}
#wetter_api .gross.kraeftiger_schneeregen {
  background-position-x: -480px;
}
#wetter_api .gross.leichter_schneefall, #wetter_api .gross.schneeschauer {
  background-position-x: -520px;
}
#wetter_api .gross.schneefall, #wetter_api .gross.kraeftiger_schneeschauer {
  background-position-x: -560px;
}
#wetter_api .gross.kraeftiger_schneefall {
  background-position-x: -600px;
}
#wetter_api .gross.eiskoerner, #wetter_api .gross.kraeftiger_graupelschauer {
  background-position-x: -640px;
}
#wetter_api .gross.schneeregenschauer {
  background-position-x: -680px;
}
#wetter_api .gross.graupelschauer {
  background-position-x: -720px;
}
#wetter_api .gross.gewitter_ohne_niederschlag {
  background-position-x: -760px;
}
#wetter_api .gross.gewitter {
  background-position-x: -800px;
}
#wetter_api .gross.kraeftiges_gewitter {
  background-position-x: -840px;
}
#wetter_api .gross.gewitter_mit_hagel {
  background-position-x: -880px;
}
#wetter_api .gross.kraeftiges_gewitter_mit_hagel {
  background-position-x: -920px;
}
#wetter_api .gross.boen {
  background-position-x: -960px;
}
#wetter_api .gross.sandsturm {
  background-position-x: -1000px;
}
#wetter_api .gross.kein_wetter {
  background-position-x: -1040px;
}
/* speziell */
#wetter_api {
  width: 160px;
}
#vorhersagen {
  margin-top: 10px;
}
#vorhersagen .wochentag {
  margin: 6px 0 0;
}
/**/
.kalender {
  position: absolute;
  width: 185px;
  height: auto;
  visibility: hidden;
  padding: 5px;
  background-color: transparent;
  text-align: center;
  z-index: 10;
}
.kalender table tr td {
  background-color: #00448b;
  text-align: center;
  padding: 0;
  line-height: 12px;
}
.kalender #monthTd, .kalender #monthTd0, .kalender #monthTd1, .kalender #monthTd2, .kalender #yearTd, .kalender #yearTd0, .kalender #yearTd1, .kalender #yearTd2 {
  font-weight: bold;
  color: #ffffff;
}
.kalender .monthTd, .kalender .yearTd {
  height: 20px;
  background-color: #7090ab;
  vertical-align: middle;
  text-align: center;
}
.kalender #splitTd {
  line-height: 2px;
  height: 2px;
}
.kalender .dayName {
  height: 20px;
  vertical-align: middle;
  text-align: center;
  color: #ffffff;
}
.kalender #closeCal {
  vertical-align: middle;
}
.kalender #leftTop {
  width: 25px;
  height: 15px;
  background-image: url(/bilder/layout/kalender-li-oben.png);
  background-position: left;
  background-repeat: no-repeat;
  background-color: transparent;
}
.kalender #rightTop {
  width: 25px;
  height: 15px;
  background-image: url(/bilder/layout/kalender-re-oben.png);
  background-position: right;
  background-repeat: no-repeat;
  background-color: transparent;
}
.kalender #leftBottom {
  width: 25px;
  height: 15px;
  background-image: url(/bilder/layout/kalender-li-unten.png);
  background-position: left;
  background-repeat: no-repeat;
  background-color: transparent;
}
.kalender #rightBottom {
  width: 25px;
  height: 15px;
  background-image: url(/bilder/layout/kalender-re-unten.png);
  background-position: right;
  background-repeat: no-repeat;
  background-color: transparent;
}
.kalender a:link, .kalender a:visited, .kalender a:hover, .kalender a:active {
  font-family: Arial, Verdana, Helvetica, sans-serif;
  color: #ffffff;
  font-size: 12px;
  text-decoration: underline;
  outline: none;
}
.youtube {
  position: relative;
  width: 560px;
  height: 315px;
  padding-top: 0;
  overflow: hidden;
  border-radius: 2px;
  border: 1px solid #dddddd;
  margin: 10px 0 10px 0;
  max-width: 100%;
  cursor: pointer;
  text-align: center;
  background-position: center center;
}
.youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
/********** Datenschutz Cookie ***********************************************/
#cookie {
  position: fixed;
  top: 200px;
  color: #fff;
  font-size: 20px;
  line-height: 25px;
  opacity: 0.8;
  background-color: #333;
  padding: 30px 30px 45px;
  margin: 0;
  width: 900px;
  z-index: 2000;
}
#cookie a {
  color: #fff;
  font-size: inherit;
}
#cookie .ok {
  position: absolute;
  right: 10px;
  bottom: 10px;
  cursor: pointer;
  padding: 2px;
  border: #fff 1px solid;
  margin-left: 20px;
}
.cookie_gesetzt {
  display: none;
}
.alert {
  padding: 20px;
  background-color: #f44336; /* Red */
  color: white;
  margin-bottom: 15px;
}