@charset "utf-8";

@import url('core.css');
/***********************************************/
/* screen.css	                                */
/***********************************************/

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 

html {font-size:100.1%;height:100%}
body {margin:0;padding:0;height:100%;background:#FAEFD9 url('../images/background.png') center top repeat-x; font-size:78%;text-align:center} /*reset to a base font-size of 12px. 62.5 would be 10px*/

.clearall {display:block;height:1px;line-height:1px;font-size:1px;overflow:hidden;clear:both;margin:0px !important}
.hidden { position:absolute;left:-1000px; top:-1000px; width:0; height:0; overflow:hidden; display:inline }

a.link-more, a.link-back {padding:3px 5px 2px 5px;line-height:30px;height:21px;color:#fff;background:/*#9aad32*/transparent url('../images/icon-more-back.png') right top no-repeat;font-weight:bold;text-decoration:none;/*display:-moz-inline-box;display:inline-block*/}
a.link-more {padding-right:18px;border-left:1px #9aaa33 solid}
a.link-back {padding-left:18px;background-position:left bottom;border-right:1px #9aaa33 solid}
a.link-more:hover, a.link-back:hover {color:#4c4532}

small {line-height:130%}

/*****************************************
* Layoutvariablen
******************************************/
#pageMargins {/*background:transparent url('../images/bg-body.jpg') 50% 136px no-repeat;*/padding:0;min-height:100%}
#page, #logo {margin:0 auto;padding:0;text-align:left;width:904px}

/********* Header ************/
#header {background:#fff url('../images/bg-header.png') center top no-repeat;/*border-bottom:14px solid #b29f74;height:365px;*/height:392px;padding:0 22px;position:relative}
#cornerTeaser {position:absolute;right:25px;top:10px}
#logo {position:absolute;top:19px;margin-left:30px;width:auto}
#logo a {text-decoration:none !important}
#teaser {text-align:right;padding-top:24px}
/********* Content-Positioning ************/
#page {}

#content {clear:both;position:relative;background:#fff url('../images/bg-content.png') center top repeat-y;padding:0 52px 0 52px}
#content p {line-height:150%}

#sideColumn1, #sideColumn2 {float:left;width:193px}
#sideColumn2 {float:right}
#sideColumn1 p, #sideColumn2 p {line-height:130%}

#sideColumn1 .box {margin-top:2em}
#sideColumn1 .box p {line-height:1.3em !important;font-size:0.9em;margin:0}
#sideColumn1 .box h3 {font-size:1.2em}

#footer {clear:both; display:block; padding:35px 52px 2em 52px; color:#999;background:transparent url('../images/bg-footer.png') center top no-repeat}
#footer a{ color: #999;}

/********* Menü ************/
#navi {list-style-type:none;list-style-image:none;margin:0;padding:0;position:absolute;top:148px;width:231px;z-index:99;overflow:visible}
#navi li {display:inline;margin:0;padding:0}
#navi li a, #navi li strong {text-decoration: none; font-size:large; line-height:36px; padding-left:35px; display:block;height:36px;overflow:hidden;color:#fff;background:transparent url('../images/sprites.png') left top no-repeat}
/*#navi li a:hover, #navi li a.active, #navi li strong {background-color:#b29f74}*/


#navi li.item1 a {background-position:0 0}
#navi li.item2 a {background-position:0 -36px}
#navi li.item3 a {background-position:0 -72px}
#navi li.item4 a {background-position:0 -108px}
#navi li.item5 a {background-position:0 -144px}
#navi li.item6 a {background-position:0 -180px}
#navi li.item7 a {background-position:0 -218px}

#navi li.item1 a:hover, #navi li.item1 strong, #navi li.item1 a.active {background-position:-232px 0px}
#navi li.item2 a:hover, #navi li.item2 strong, #navi li.item2 a.active {background-position:-232px -36px}
#navi li.item3 a:hover, #navi li.item3 strong, #navi li.item3 a.active {background-position:-232px -72px}
#navi li.item4 a:hover, #navi li.item4 strong, #navi li.item4 a.active {background-position:-232px -108px}
#navi li.item5 a:hover, #navi li.item5 strong, #navi li.item5 a.active {background-position:-232px -144px}
#navi li.item6 a:hover, #navi li.item6 strong, #navi li.item6 a.active {background-position:-232px -180px}
#navi li.item7 a:hover, #navi li.item7 strong, #navi li.item7 a.active {background-position:-232px -218px}

#subNavi {position:absolute;left:208px;top:37px;margin:0;padding:0;list-style-type:none;width:178px;height:181px;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";opacity:0.90;background:transparent url('../images/sprites.png') 0 -218px no-repeat}
#subNavi a span, #subNavi strong span {height:auto;line-height:36px}
#subNavi li a, #subNavi li strong {font-size:small; background-image:none;background-color:transparent;color:#fff;font-weight:bold;text-decoration:none;padding:0 1.2em 0 2em}
#subNavi li a:hover, #subNavi li strong, #subNavi li a.active {background-image:url('../images/sprites.png');color:#4c4532}
#subNavi li.item1 a:hover, #subNavi li.item1 strong, #subNavi li.item1 a.active {background-position:-232px -218px}
#subNavi li.item2 a:hover, #subNavi li.item2 strong, #subNavi li.item2 a.active {background-position:-232px -254px}
#subNavi li.item3 a:hover, #subNavi li.item3 strong, #subNavi li.item3 a.active {background-position:-232px -290px}
#subNavi li.item4 a:hover, #subNavi li.item4 strong, #subNavi li.item4 a.active {background-position:-232px -326px}
#subNavi li.item5 a:hover, #subNavi li.item5 strong, #subNavi li.item5 a.active {background-position:-232px -362px}
#subNavi li.item6 a:hover, #subNavi li.item6 strong, #subNavi li.item6 a.active {background-position:-232px -398px}
#subNavi li.item7 a:hover, #subNavi li.item7 strong, #subNavi li.item7 a.active {background-position:-232px -434px}

#footerNavi {list-style-type:none;list-style-image:none;margin:0;padding:0;float:right}
#footerNavi  li {margin:0 0 0 1em;padding:0;display:inline}

/***********************************************/
/* Content styles                              */
/***********************************************/
/* CSS gimmics for good browsers - so not IE */
.box, .offer, #lightbox-container-image-box, #lightbox-container-image-data-box {-moz-border-radius:0.5em;-webkit-border-radius:0.5em;border-radius:0.5em}
.button, button, h2, h3, fieldset, input.textField, textarea, select {-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}
legend {-moz-border-radius-topright:4px;-webkit-border-top-right-radius:4px;border-top-right-radius:4px}

#requestBox {position:absolute;top:-60px;height:111px;width:250px;background:transparent url('../images/sprites.png') 0 -404px no-repeat}
#requestBox h3 {height:1px;overflow:hidden;margin:0;padding:0;background:none}
#requestBox ul {list-style-type:none;margin:40px 0 0 60px}
#requestBox strong, #requestBox a {color:#fff}
#requestBox strong {font-size:2em}
#requestBox a.email {font-size:1.5em}
#requestBox a.tel {text-decoration: none;}
.headerAfterRequestBox {margin-top:50px}


.serviceIcons img {width:35px;height:45px;border:0;vertical-align:middle;background:transparent url('../images/sprites.png') 0 -517px no-repeat}
.serviceIcons .radioTv img {background-position:-37px -517px}
.serviceIcons .bathroom img {background-position:-73px -517px}
.serviceIcons .breakfast img {background-position:-109px -517px}
.serviceIcons .sunlounger img {background-position:-146px -517px}
.serviceIcons .bikeLot img {background-position:-183px -517px}
.serviceIcons .carLot img {background-position:-220px -517px}
.serviceIcons .wifi img {background-position:-257px -517px}
ul.serviceIcons {margin:0;padding:0;list-style-type:none}
ul.serviceIcons li {display:inline;margin:0 -0.4em 0 0;padding:0 !important}


#content .imageFrame img {padding:2px;background-color:#fff;border:1px solid #4c4532}
#content .imageFrame {margin-bottom:0.5em;/*display:block*/}


.teaser .link-more {margin-top:0.8em}
.teaser a img {display:block;text-align:center;margin:0 auto;max-width:100%;}

.note {
    font-size: smaller;
    background: #F3EEE8;
    color: #999;
    padding: 0.8em;
    display: block;
    line-height: 110%;
}
/*
.price {float:right;width:133px;height:64px;padding-top:25px;font-size:2.5em;letter-spacing:-1px;text-align:center;color:#fff;background:#c88043 url('../images/price.jpg') left top no-repeat}
 */
.price {font-size:3em;letter-spacing:-1px;text-align:center;color:#fff;text-align:center;}
.price em {font-size:0.25em;margin-right:-0.7em;font-style:normal;letter-spacing:normal}
.price small {font-size:0.25em;display:block;margin-top:-0.2em;line-height:1em;letter-spacing:normal}
.price span {letter-spacing:-3px}
.price .digits {display:inline-block; top:-0.20em; margin-left:-0.15em; position:relative;}
.price .currency {font-size: small; margin-left:-0.5em;}

.offer {float:left;width:100%;position:relative;margin:1em 0;padding-bottom:40px;clear:both;background:transparent url('../images/bg-offer.png') right bottom no-repeat;/*border:1px solid #4c4532;*/}
.offer .price {background:none; width:133px;position:absolute;right:5px;bottom:15px;padding:0;height:50px;transform:rotate(-4deg);}
.offer .link-more {margin-left:1em;clear:both;}
.offer p {margin:1em;clear:both;}
.offer h2 {margin-top:0}

.rooms .teaser {position:relative;}
.rooms .price {position:absolute;right:25px;  font-size:2.6em;}
.rooms .price small {margin-top:-0.4em;}
.rooms .col1 .price {transform:rotate(8deg); right:30px; top:138px}
.rooms .col2 .price {transform:rotate(-20deg); top:128px;}
.rooms .col3 .price {transform:rotate(-5deg);top:135px;}




/* MULTICOLUMN */
.multicolumn {clear:both; float:left; width:100%; margin:1em 0 0}
.multicolumn .background {float:left; width:100%}
.multicolumn .col1, .multicolumn .col2, .multicolumn .col3, .multicolumn .col4 {float:left; width:23%; overflow:visible}
.multicolumn .col3, .multicolumn .col4, .rightCol {float:right}
.multicolumn .col1, .multicolumn .r25_25_25_25 .col3, .leftCol {float:left}
.r50_50 .col2, .r25_75 .col2, .r75_25 .col2, .r33_66 .col2, .r66_33 .col2 {float:right}
.r33_33_33 .col1, .r33_33_33 .col3 {min-width:11em}
.r33_33_33 .col2 {margin-right:-33%}

.r33_33_33 .col2, .r50_25_25 .col2, .r25_50_25 .col2, .r25_25_50 .col2 {margin-left: 3.5%}
.r33_66 .col1, .r66_33 .col2, .r33_33_33 .col1, .r33_33_33 .col2, .r33_33_33 .col3 {width:31%}

.r75_25 .col1, .r25_75 .col2 { width:73% }
.r66_33 .col1, .r33_66 .col2 { width:65.5%}
.r50_50 .col1, .r50_50 .col2, .leftCol, .rightCol { width:48%}
.r50_25_25 .col1, .r25_50_25 .col2, .r25_25_50 .col3 { width:47%}

form .multicolumn {margin:0}

/* Listen und Definitionslisten */
dl dt { margin-top: 1em }

ul.linkList {list-style:none;margin-left:0;padding-left:0}
ul.linkList li {margin-left:0;padding-left:30px;background:transparent url('../images/icon-arrow.gif') left top no-repeat}
ul.linkList a {color:#666;text-decoration:none;font-weight:bold}
ul.linkList a:hover {text-decoration:underline}

ul.imageList, ul.imageList li {list-style:none;margin:0;padding:0;}
ul.imageList li {display:inline;margin:2px;}


/* pagebrowser */
/* --------------------- Pagebrowser -------------------- */
.pagebrowser {margin:2em 0;font-size:12px}
.pagebrowser ul, .pagebrowser li{list-style-type:none;list-style-image:none;margin:0 !important;padding:0 !important}
.pagebrowser a,.pagebrowser strong {color:white !important;float:left;padding:4px;background-color:#EB6B16;margin-right:2px;border:1px solid white;text-decoration:none !important;line-height:1em !important}
.pagebrowser strong {background-color:white;border-color:#EB6B16;color:#EB6B16 !important}


/* Hervorhebungsboxen */
div.box { background-color:#ccc; padding:10px; margin:0 0 1em 0; color:#333;border:1px #aaa solid;border-left-color:#ddd;border-top-color:#ddd}
div.box p, div.box ul { line-height: 1em }

/* BUTTONS */
a.button, input.button, button, a:visited.button, #lightbox-bottomNav a.navButton {/*line-height:1em;*/padding:2px 8px;color:#fff;background:#9aad32 url('../images/bg-button.png') left top repeat-x;font-weight:bold;border:2px solid #9aad32;/*display:inline-block;*/ text-decoration:none}
.button:hover, .button.hover, #lightbox-bottomNav a.navButton:hover {background-position:left bottom !important}
.buttonSmall {padding:0 8px !important;height:1.75em}


/* FORMULARE */
form { margin: 0px }
fieldset, fieldset.multicolumn { padding: 2% 2% 30px 2%; border:0px #b29f74 solid; border-top-width:2px; margin-bottom:1em;background:#fff url('../images/bg-offer.png') left bottom no-repeat;float:left;width:96%}
fieldset fieldset {background:none;border-width:2px;padding:2%}
legend { font-weight: bold; color: #b29f74;margin:0;padding: 6px 0.8em 0.5em;font-size:1.2em;}
label, .comboLabel, .label { margin: 2px 2px 2px 0px; clear: both}

input.textField, textarea, select {padding:2px 4px;line-height:1.4em}
select {height:1.7em}
input {vertical-align:middle}

input.checkbox { margin-bottom: 2px}
input.checkbox, select, input.textField, textarea { border:1px #b29f74 solid}

input, textarea, select, option, button { font-size: 1em }
input.textField:hover, textarea:hover, select:hover {border-width:2px; padding:1px 3px;border-color:#9aad32}

input:active, textarea:active, select:active, option:active, input:focus, textarea:focus, select:focus, option:focus { background-color: #fff; border-color: #9aad32; color: #000000 }
input.required, textarea.required { border-color:#CC0000}

ol.form {list-style-type:none;margin:0 !important;padding:0 !important}
ol.form li {margin:0 0 0.8em 0;padding:0;/*clear:both;*/white-space:nowrap}
ol.form label, ol.form .comboLabel, ol.form .label {display:block;line-height:1.2em;font-weight:bold;color:#4c4532;margin-bottom:2px}
ol.form .comboLabel label, ol.form li.checkbox label {display:inline;margin:0 2px 0 0}
ol.form li.submit {text-align:right}
ol.form input.textField, ol.form textarea {width:97%}

input.zip { width: 20%; margin-right:4%}
input.city { width: 68%}

.multicolumn ol.form select {width:98%}
.r50_50 .multicolumn .textField {width:92%}
.r50_50 .multicolumn input.city {width:55%}
.r50_50 .multicolumn input.zip {width:25%}

.f-validationError, .missing input, .missing select {border-color:#ee0000 !important}
.validationMessage {clear:both;display:block;padding:0.3em 0 0.8em 0;font-size:0.9em;color:#ee0000;font-weight:bold}
.missing {color:#cc0000}

#errorMessage {width:30%;background-color:#fff;padding:1em;text-align:left;margin:1em auto;color:#333}
#errorMessage ul {margin-top:2em}
#errorMessage .close {text-align:right;margin-top:1em}
.layout-error h3, .layout-warning h3 {color:#cc0000;background:none}
.layout-error h2, .layout-warning h2 {background:#cc0000;color:#fff;margin-top:0}


#reservation #message {height:9em;}


/* OVERLAY ERRORS */
#siteOverlay, #overlayBackground {position:fixed;text-align:center;display:block;width:100%;height:100%;left:0;top:0;bottom:0;right:0;z-index:9999}
#overlayBackground {position:absolute;z-index:-1;background-color:#333}
#siteOverlay #errorMessage {margin:15% auto 0;width:400px}

/* lightbox
*************************/
#jquery-overlay {position:fixed;top:0;left:0;z-index:999;width: 100%;height:500px;}
#jquery-lightbox {position:fixed;top:0;left:0;width:100%;z-index:1000;text-align:center;line-height:0}
#lightbox-container-image-box {position:relative;width:250px;height:250px;margin:0 auto;background:white url('../images/spacer.gif') no-repeat center center}
#lightbox-container-image-box.loading {}
#lightbox-container-image {padding:10px 0}
#lightbox-nav {position:absolute;top:10px;left: 0;width: 100%;z-index:1001}
#lightbox-topNav {position:absolute;top:0;right:0;z-index:9999;text-align:right;padding:0}
#lightbox-container-image-box > #lightbox-nav { left:0 }
#jquery-lightbox a {outline:none;border-width:0px;cursor:pointer;text-decoration:none}
#lightbox-btnPrev, #lightbox-btnNext {width:49%;height:100%;display:block;float:left;text-align:left;background:transparent url('../images/spacer.gif') no-repeat}
#lightbox-btnNext {float:right;text-align:right}
#lightbox-nav a span {position:relative;top:40%;font-size:2.5em;font-weight:bold;display:block;width:1em;height:1em;line-height:1em;text-align:center;color:#fff;background-color:#4c4532}
#lightbox-nav a:hover span {background-color:#9aad32}
#lightbox-topNav a span {float:right;display:block;line-height:1em;padding:0.1em 10px;background-color:white;font-size:2.5em;font-weight:bold;color:#000}
#lightbox-topNav a:hover span {color:#C00}
#lightbox-btnNext span {float:right}
#lightbox-bottomNav {float:right;height:30px;line-height:30px;}

#lightbox-container-image-data-box {margin:0 auto;padding:5px 10px 0 10px;background-color:white;line-height:1.2em}
#lightbox-container-image-data {/*padding:0;float:left;width:100%*/text-align:left;}
#lightbox-image-details {/*float:left;margin-right:20%*/}	
#lightbox-image-details-caption { font-weight: bold }
#lightbox-image-details-currentNumber {display:block;clear:left;text-align:left;}
#lightbox-diashow {display:block;border:1px #999 solid;padding:1px;z-index:1015;position:relative;text-align:left;margin-bottom:6px;}
#lightbox-diashow-timer {display:block;height:3px;background-color:#9aad32;width:100%;}
.lightbox-clear {clear:both;display:block;width:100%;height:1px;font-size:1px;line-height:1px;overflow:hidden;}
.lightbox-clear {clear:both;display:block;width:100%;height:1px;font-size:1px;line-height:1px;overflow:hidden}