@charset "utf-8";

/* Import Webfonts */
@import url('/fonts/Muli/stylesheet.css');

/*
    Standard CSS Datei von:
    Casa Antiqua
    copyright 2009 DDD Werbepraxis GmbH
    Stand: 04.11.09
*/
body { margin: 0; padding: 0; background-color: #f5f5f5; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 14px; color: #424d53; }
img { border: none; }
/* h1 { margin: 0; padding: 0; font-weight: normal; font-variant: small-caps; margin-bottom: 10px; color: #748490; width: 740px; } */
h1 { color: #9d9fa0; margin: 0 0 23px 0; padding: 0; font-family: 'Muli', sans-serif; font-variant: normal; letter-spacing: 1px; /* font-weight: 400; */ font-size: 43px; text-shadow: 1px 1px #767777; display: inline-block; min-width: 100%; } 
h4 { position: relative; z-index: 1; margin-top: -20px; font-size: 25px; font-style: oblique; font-weight: normal; color: #9d9fa0; }
h5 { font-size: 16px; font-variant: small-caps; }
a { color: #cc3300; text-decoration: underline; }
input { border: 1px solid #ffffff; background: #ffffff; color: #424d53; }
textarea { border: 1px solid #ffffff; background: #ffffff; color: #424d53; }
.buttons { border: 1px solid #f5f5f5; background-color: #f5f5f5; color: #424d53; }
.buttons:hover { border: 1px solid #707173; background-color: #707173; color: #f5f5f5; }
#mietbedingungen { float:left; }
#buchenbox { float: left; width: 960px; }
#footer a { color: #faf0c3; }
#header { width: 100%; height: 220px; text-align: center; background-image: url('../img/header_bg.gif'); background-size: 220px 100%; position: fixed; top: 0; z-index: 50; }
#content_surr { width: 100%; /* background-color: #f5f5f5; background-image: url('../img/ornament_bg.jpg'); background-repeat: no-repeat; background-position: 70% 100%; */ }
#content { width: 960px; background-repeat: no-repeat; padding:2px 30px 90px; margin: 0 auto; min-height: 500px; }
#maincontent { width: 660px; float: left; margin-right: 20px; line-height: 1.5em; }
#maincontent_anfahrt { width: 250px; float: left; margin-right: 20px; }
#maincontent_sehenswertes { width: 284px; float: left; line-height: 1.45em; }
#contentpic { float: right; }
#map_bamberg { float:left; margin-right: 10px; }
#footer { width: 960px; text-align: right; font-size: 12px; color: #FFF; padding-top: 10px; /* background-image: url('../img/footer_bg_box.png'); background-repeat: repeat-x; */ height: 29px; /* background-color: #f5f5f5; */ padding-top: 20px; margin: 0 auto; }
#footer_surr { width: 100%; background-image: url('../img/footer_bg.png'); background-repeat: repeat-x; /* background-color: #f5f5f5; */ position:fixed; bottom:0; }
#navigation_surr { width: 100%; background-image: url('../img/navi_bg.gif'); height: 40px; z-index: 40; position: fixed; top: 220px; box-shadow: 0px 0px 20px #888; }
#navigation { width: 960px; text-align: center; margin: 0px auto; height: 40px; }
#subnavigation_surr { width: 100%; /* background-image: url('../img/content_bg.gif'); background-repeat: repeat-x; */ height: 55px; margin-top: 258px; }
#subnavigation { width: 960px; text-align: left; padding-left:10px; margin: 0px auto; height: 40px; }
#imp_left { float: left; width: 450px; }
ul#agbs { list-style: none; margin: 0; padding: 0; }
ul#agbs li { padding: 5px 0px; }
ul#agbs .agbs_label{ float:left; text-align: left; width: 140px; font-weight: bold; }
ul#agbs .agbs_content{ width: 750px; text-align: left; display: inline-block; }
ul#mietbed .mietbed_left{ float:left; text-align: left; width: 140px; }
ul#mietbed { list-style: none; margin: 0; padding: 0; }
ul#mietbed li { background-color: #b4b6b6; padding: 5px; text-align:right; }
ul#mietbed li.second { background-color: #f5f5f5; padding: 5px; text-align:right; }
ul#sehenswertes{ margin: 0; padding-left: 15px; }
ul#navi { margin: 0; padding: 0; list-style: none; display: inline; margin-top: 6px; display: inline-block; font-family: 'Muli', sans-serif; }
@-moz-document url-prefix() {
    ul#navi {
        margin-top:4px !important;
    }
}
ul#navi li { display: inline-block; }
ul#navi li a { display: inline-block; font-weight: bold; text-decoration: none; font-size: 20px; padding-top: 6px; padding-bottom: 7px; margin-top: -4px; border-left: 1px solid #b4b5b6; border-right: 1px solid #b4b5b6; padding-left: 30px; padding-right: 30px; color: #666; letter-spacing: 0.02em; }
ul#navi li a { border-left: 1px solid rgba(180, 182, 182, 0); border-right: 1px solid rgba(180, 182, 182, 0); }
ul#navi li a:hover { border-left: 1px ridge #727273; border-right: 1px ridge #727273; background-image: -webkit-linear-gradient(top left, #b4b5b6 0%, #727273 100%); background-image: -moz-linear-gradient(right bottom, #b4b5b6 0%, #727273 100%);  background-image: -o-linear-gradient(#b4b5b6 0%, #727273 100%);  background-image: linear-gradient(#b4b5b6 0%, #727273 100%); color:#d4d5d6; text-shadow: 1px 1px #333;}ul#subnavi { margin: 0; padding: 15px 0; list-style: none; font-size: 16px; color: #707173; }
ul#navi li a.active { background:url('../img/active.png') no-repeat bottom center; height: 25px; }
ul#navi li a.active:hover { border-left: 1px ridge #727273; border-right: 1px ridge #727273; background-image: -webkit-linear-gradient(top left, #b4b5b6 0%, #727273 100%); background-image: -moz-linear-gradient(right bottom, #b4b5b6 0%, #727273 100%);  background-image: -o-linear-gradient(#b4b5b6 0%, #727273 100%);  background-image: linear-gradient(#b4b5b6 0%, #727273 100%); color:#d4d5d6; text-shadow: 1px 1px #333;}ul#subnavi { margin: 0; padding: 15px 0; list-style: none; font-size: 16px; color: #707173; }
ul#subnavi li { display: inline; }
ul#subnavi li a { font-variant: small-caps; letter-spacing: 3px; color: #707173; text-decoration: none; }
ul#subnavi li a:hover { color: #cc3300; text-decoration: underline; }
ul#subnavi li a.selected  { color: #cc3300; text-decoration: underline; }
ul.errors { list-style: none; margin-left: 50px; margin-bottom: 5px; }
.bfe_line { margin-bottom: 6px; }
.bfe_label { float: left; display:inline-block; width: 128px; vertical-align: bottom; font-size: 14px; margin: 0; padding: 0; }
.bfe_line img { vertical-align: middle; }
.errors { color: red; }
.infobox { display: inline-block; width: 920px; }
#bauplan_surr { width: 740px; margin: 0 auto; position: relative; }
#bauplanzimmer { background-image: url('../img/bauplan.png'); width:740px; height: 1350px; text-align: center; }
ul#zimmer_o { list-style: none; }
#schlafzimmer a { width: 305px; height: 373px; position: absolute; top: 160px; left: 155px; z-index: 3; }
#diele a { width: 237px; height: 260px; position: absolute; top: 248px; left: 413px;  z-index: 4; }
#bad a { width: 268px; height: 207px; position: absolute; top: 483px; left: 133px; z-index: 5; }
#flur a { width: 173px; height: 264px; position: absolute; top: 460px; left: 367px;  z-index: 6; }
#kueche a { width: 177px; height: 290px; position: absolute; top: 590px; left: 80px;  z-index: 7; }
#wohnzimmer a { width: 365px; height: 255px; position: absolute; top: 673px; left: 215px; z-index: 8; }
#innenhof a { width: 519px; height: 470px; position: absolute; top: 860px; left: 32px;  z-index: 9; }
#schlafzimmer a:hover { background-image: url('../img/bauplan_zimmer_hover.png'); }
#diele a:hover { background-image: url('../img/bauplan_diele_hover.png'); }
#bad a:hover { background-image: url('../img/bauplan_bad_hover.png'); }
#flur a:hover { background-image: url('../img/bauplan_flur_hover.png'); }
#kueche a:hover { background-image: url('../img/bauplan_kueche_hover.png'); }
#wohnzimmer a:hover { background-image: url('../img/bauplan_wohnzimmer_hover.png'); }
#innenhof a:hover { background-image: url('../img/bauplan_innenhof_hover.png'); }
.totop { display: block; position: fixed; right: 14px; z-index: 5; bottom: 12px; }
#footer > div.one { display: inline-block; float: left; margin-top: 3px; }
#footer > div.two { display: inline-block; float: right; margin-top: 3px; }
.grid { width:960px; margin: 0 auto; }
#header > div > a > img { float:left; }
#header > div > img { float:right; margin-top: 19px; }
body > div.backgroundimage { display: inline-block; position: fixed; right: 0; bottom: 0; z-index: -1; }
#map { display:inline-block; }
#map b { float:left; }
#maincontent > div > form > div > img { position:absolute; }
#maincontent > div > form > div > span > span, #maincontent > div > div > span > span { color:#cc3300; }

/* Datepicker Style */
.Unavailable { opacity:0.8 !important; }
.Unavailable span { background-color: #ebb3ae !important; background-image :none !important; color: #fff !important; }
.ui-datepicker-unselectable.ui-state-disabled.undefined { opacity:1 !important; }
.ui-datepicker-unselectable.ui-state-disabled.undefined span { background: #e8b4ab !important; color: white !important; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #707173 !important; background: #fff !important; color: #000 !important; }
.ui-widget-header { border: 1px solid #707173 !important; background: #b4b6b6 !important; color: #707173 !important; font-weight: bold !important; }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #ccc; color: inherit; }
#ui-datepicker-div > div.ui-datepicker-group.ui-datepicker-group-last > div > a:hover { cursor:pointer; }
#ui-datepicker-div > div.ui-datepicker-group.ui-datepicker-group-first > div > a  { cursor:pointer; }
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #fff !important; background: #707173 !important; color: #fff !important; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #fff !important; }
#txtStartDate, #firestartdate > img, #txtEndDate, #fireenddate > img { cursor:pointer; }
.Unavailable { opacity:0.8 !important; }
.Unavailable span { background-color: #ebb3ae !important; background-image :none !important; color: #fff !important; }
.Morningblocked a, .Morningblocked a:hover { background: linear-gradient( -36deg, #ebb3ae, #ebb3ae, #ebb3ae 50%, #f6f6f6 50%) !important }
.Eveningblocked a, .Eveningblocked a:hover { background: linear-gradient( -36deg, #f6f6f6, #f6f6f6, #f6f6f6 50%, #ebb3ae 50%) !important }
.Morningblocked span, .Morningblocked span:hover { background: linear-gradient( -36deg, #ebb3ae, #ebb3ae, #ebb3ae 50%, #f6f6f6 50%) !important }
.Eveningblocked span, .Eveningblocked span:hover { background: linear-gradient( -36deg, #f6f6f6, #f6f6f6, #f6f6f6 50%, #ebb3ae 50%) !important }
#datepicker > div > div:nth-child(1) > div > a { display:none !important; }
#datepicker > div > div:nth-child(3) > div > a { display:none !important; }
#datepicker > div { width:60em !important; }

/* Kontaktform */
#tx_bt_simplecontact .tx_bt_simplecontact_red { color: red; }
#tx_bt_simplecontact .tx_bt_simplecontact_reihe { margin-bottom: 5px; }
#tx_bt_simplecontact .tx_bt_simplecontact_label { float: left; display: inline-block; width: 120px; vertical-align: top; font-size: 14px; margin: 0; padding: 0; }
#tx_bt_simplecontact input.tx_bt_simplecontact_feld { border: 1px solid #ffffff; background-color: #ffffff; color: #424d53; width: 310px; vertical-align: top; font-size: 14px; margin: 0; padding: 0; }
#tx_bt_simplecontact textarea.tx_bt_simplecontact_feld { border: 1px solid #ffffff; background-color: #ffffff; color: #424d53; width: 310px; vertical-align: top; font-size: 14px; margin: 0; padding: 0; }
#tx_bt_simplecontact input.tx_bt_simplecontact_button { border: 1px solid #f5f5f5; background-color: #f5f5f5; color: #424d53; }
#tx_bt_simplecontact input.tx_bt_simplecontact_button:hover { border: 1px solid #707173; background-color: #707173; color: #f5f5f5; }
#tx_bt_simplecontact .tx_bt_simplecontact_hinweis { display: inline-block; font-size: 12px; width: 310px; }
#tx_bt_simplecontact .tx_bt_simplecontact_b { font-weight: bold; }
#tx_bt_simplecontact select.tx_bt_simplecontact_selectorbox { border: 1px solid #ffffff; background-color: #ffffff; }
ul.tx_bt_simplecontacterrorliste { background: none; color: #424d53; display: inline-block; margin-left: 80px; color: red; list-style-type: none; }

/* Login, etc. */
#UserLoginForm fieldset { border: none; text-align: center; line-height: 2em; }
#UserLoginForm fieldset div label { margin-right:10px; }
#UserLoginForm fieldset div input { background:#ddd; border:2px solid #FFF; }
#UserLoginForm > div.submit { position: absolute; left: 50%; margin-left: 10px; }
#UserPassword { margin-left: 40px; }
#UserLoginForm > div.submit > input[type="submit"] { margin-top: 0; width: 80px; height: 34px; text-transform: uppercase; background-color: #555; color: white; }
#flashMessage { width:100%; background:#555; color:#FFF; text-align:center; line-height:30px; padding:36px 0px; top:-110px; font-size:20px; position:fixed; z-index:99999; animation: slideup 5s; -moz-animation: slideup 5s; -webkit-animation: slideup 5s; -o-animation: slideup 5s;}
.flashMessage2 { width:100%; background:red !important; color:#FFF; text-align:center; line-height:30px; padding:36px 0px; top:-110px; font-size:20px; position:fixed; z-index:99999; animation: slideup 5s; -moz-animation: slideup 5s; -webkit-animation: slideup 5s; -o-animation: slideup 5s; }
@keyframes slideup { 0% {top:0px;} 75% {top:0;} 100% {top:-110px;}}
@-moz-keyframes slideup { 0% {top:0px;} 75% {top:0;} 100% {top:-110px;} }
@-webkit-keyframes slideup{ 0% {top:0px;} 75% {top:0;} 100% {top:-110px;}}
@-o-keyframes slideup { 0% {top:0px;} 75% {top:0;} 100% {top:-110px;}}
.error-message { font-size:11px; color:#FF0000; margin-top:10px; margin-left:130px;}
#maincontent > div > form > div:nth-child(7) > span.error-message, #maincontent > div > form > div:nth-child(6) > span.error-message { margin-left:0 !important; }

@media only screen and (max-width: 1050px) {
    #navigation { width:inherit; }
    ul#navi li a { padding-left:10px; padding-right:10px; }
}