/* WebFonts
font-family:'Gill Sans W01 Book';
font-family:'GillSansW01-DisplayBold 709825';
font-family:'Gill Sans W01 Light';
*/

/* general */
body {
    height:100%;
    width:100%;
    overflow:hidden;
}
.box {
    padding:10px;
    background:rgb(255, 255, 255);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border:1px solid #fff;
    overflow:auto;
    -moz-box-shadow: 0 0 15px #333;
    -webkit-box-shadow: 0 0 15px #333;
    box-shadow: 0 0 15px #333;
}
h1 {
    font: 16px/24px 'GillSansW01-DisplayBold 709825',Arial,sans-serif;
    margin-bottom:10px;
    text-transform:uppercase;
}
h2 {
    font: 16px/24px 'GillSansW01-DisplayBold 709825',Arial,sans-serif;
    margin-bottom:10px;
}
p {
    font: 14px/20px 'Gill Sans W01 Book',Arial,sans-serif;
    margin-bottom:10px;
}
#infos {
    font: 14px/18px 'Gill Sans W01 Book',Arial,sans-serif;
    display:none;
}


/* header */
#header {
    background-color: rgba(0, 0, 0, 0.7);
    height:90px;
    overflow:hidden;
    position:relative;
    top:-100px;
    -moz-box-shadow: 0 0 10px 5px #000;
    -webkit-box-shadow: 0 0 10px 5px #000;
    box-shadow: 0 0 10px 5px #000;
}
.lt-ie9 #header {
    background-color:#000;
}
#logo {
    position:absolute;
    top:20px;
    left:20px;
    display:block;
    background: url("../img/sprites.png") no-repeat 0 0;
    width:294px;
    height:50px;
    text-indent:-5000px;
}
#mainnav {
    position: absolute;
    bottom:0;
    left:330px;
}
#mainnav ul {
    list-style:none;
}
#mainnav ul li {
    display:inline;
}
#mainnav ul li a,
#mainnav ul li a:visited,
#mainnav ul li a:active {
    display: block;
    float: left;
    font: 16px/20px 'Gill Sans W01 Book',Arial,sans-serif;
    height: 50px;
    padding: 40px 16px 0;
    text-transform: uppercase;
    width: auto;
    color:#fff;
    text-decoration:none;
}
.lt-ie9 #sitefooter {
    font: 16px/20px Arial,sans-serif;
}
#mainnav ul li a.active,
#mainnav ul li a:hover {
    background-color: rgba(255, 255, 255, 0.2);
    border-bottom: 10px solid #FFFFFF;
    height: 40px;
}
.lt-ie9 #mainnav ul li a.active,
.lt-ie9 #mainnav ul li a:hover {
    background-color:#888;
}
#supersized {
    cursor:pointer;
    margin:0;
    padding:0;
}


/* pager */
#slideControls {
    display:none;
    position: absolute;
    right: 10px;
    top: 10px;
    width:105px;
    height:71px;
/*    background:#0f1f31;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;*/
}
#slideControls a,
a#close {
    text-indent:-2000px;
    position: absolute;
    width:39px;
    height:39px;
    cursor:pointer;
    display:block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;
}
#slideControls a#prevslide {
    bottom:5px;
    left:5px;
    background:rgba(0, 0, 0, 0.4) url("../img/sprites.png") no-repeat 5px -166px;
}
#slideControls a#nextslide {
    bottom:5px;
    right:5px;
    background:rgba(0, 0, 0, 0.4) url("../img/sprites.png") no-repeat -48px -166px;
}
a#close {
    position:absolute;
    top: 32px;
    left: 20px;
    background:rgba(0, 0, 0, 0.4) url("../img/sprites.png") no-repeat -102px -166px;
}


/* home */
#infos.home {
    position:absolute;
    top:180px;
    left:0;
    width:100%;
    text-align: center;
}
#infos.home h1 {
    color: #FFFFFF;
    font-size: 66px;
    line-height: 55px;
    width: 100%;
    -moz-text-shadow: 0 0 20px #000;
    -webkit-text-shadow: 0 0 20px #000;
    text-shadow: 0 0 20px #000;
}
#infos.home h1 span {
    font-size: 46px;
}
#infos.home .box {
    margin:0 auto;
    width:70%;
}

/* hotel */
#infos.hotel {
    position:absolute;
    top:110px;
    left:20px;
    width:94%;
}
#infos.hotel #content {
    width:60%;
}
#infos.hotel #service {
    position:absolute;
    top:0;
    right:0;
    width:30%;
}
#infos.hotel #service ul {
    margin:0;
    padding:0;
    list-style:none;
}
#infos.hotel #service ul li {
    padding-left:35px;
    line-height:28px;
    margin-bottom:5px;
}
#infos.hotel #service ul li.wlan {
    background:transparent url("../img/icons.png") no-repeat 0 -557px;
}
#infos.hotel #service ul li.park {
    background:transparent url("../img/icons.png") no-repeat 0 -261px;
}
#infos.hotel #service ul li.garage {
    background:transparent url("../img/icons.png") no-repeat 0 -590px;
}
#infos.hotel #service ul li.hund {
    background:transparent url("../img/icons.png") no-repeat 0 -1047px;
}
#infos.hotel #service ul li.essen {
    background:transparent url("../img/icons.png") no-repeat 0 -753px;
}
#infos.hotel #service ul li.paper {
    background:transparent url("../img/icons.png") no-repeat 0 -819px;
}
#infos.hotel #service ul li.waesche {
    background:transparent url("../img/icons.png") no-repeat 0 -982px;
}


/* zimmer */
#infos.zimmer {
    position:absolute;
    top:110px;
    left:20px;
    width:94%;
}
#infos.zimmer #content {
    width:50%;
}
#infos.zimmer ul {
    margin:0;
    padding:0;
    list-style:none;
}
#infos.zimmer ul li {
    padding-left:35px;
    line-height:28px;
    margin-bottom:5px;
    width:200px;
    float:left;
}
#infos.zimmer ul li.wlan {
    background:transparent url("../img/icons.png") no-repeat 0 -557px;
}
#infos.zimmer ul li.tv {
    background:transparent url("../img/icons.png") no-repeat 0 -164px;
}
#infos.zimmer ul li.clock {
    background:transparent url("../img/icons.png") no-repeat 0 -622px;
}
#infos.zimmer ul li.phone {
    background:transparent url("../img/icons.png") no-repeat 0 -949px;
}
#infos.zimmer ul li.drobe {
    background:transparent url("../img/icons.png") no-repeat 0 -787px;
}
#infos.zimmer ul li.foehn {
    background:transparent url("../img/icons.png") no-repeat 0 -294px;
}
#infos.zimmer ul li.shower {
    background:transparent url("../img/icons.png") no-repeat 0 -720px;
}
#infos.zimmer #service {
    position:absolute;
    top:0;
    right:0;
    width:40%;
}
#infos.zimmer #service dl {
    margin:0;
    padding:0;
    list-style:none;
}
#infos.zimmer #service dt {
    float:left;
    width:50%;
    height:30px;
}
#infos.zimmer #service dl span {
    font:normal 12px/16px 'Gill Sans W01 Light', Arial, sans-serif;
    color:#888;
}
#infos.zimmer #service dd span {
    position:relative;
    top:-5px;
}
#infos.zimmer #service dd {
    font: 20px/24px 'GillSansW01-DisplayBold 709825',Arial,sans-serif;
    margin:0;
    float:right;
    width:50%;
    text-align:right;
    height:30px;
}


/* reservierung */
#infos.reservierung {
    position:absolute;
    top:110px;
    left:20px;
    width:94%;
    height:70%;
}
#infos.reservierung #content {
    width:98%;
    height:auto;
    overflow:auto;
    background-color: #E5E5E5;
}

#mailer fieldset {
    border:0px;
    width:49%;
}
#mailer fieldset.left {
    float:left;
}
#mailer fieldset.right {
    float:right;
}
#mailer dd {
    margin-left:0;
    clear:both;
    min-height:34px;
    position:relative;
}
#mailer dd label {
    display: block;
    height:20px;
    width:120px;
    float: left;
}
#mailer dd label.calc {
    background:transparent url("calc.gif") no-repeat 74px 3px;
}
#mailer dd input,
#mailer dd textarea {
    display: block;
    width:260px;
    height:20px;
    float: left;
    font: 14px/16px 'Gill Sans W01 Book',Arial,sans-serif;
}
#mailer dd textarea {
    width:264px;
    height:80px;
}
#mailer dd select {
    height: 26px;
    padding: 4px 0;
    margin-right:10px;
}
#mailer label.error {
    position: absolute;
    top: -4px;
    display:block;
    left: 390px;
    height: 32px;
    width: 32px;
    text-indent:-3000px;
    cursor:help;
    background:transparent url("warning.png") no-repeat 0 0;
}
#mailer input.error {
    background-color: #ffd27f;
}
#formerror.error {
  color: #bb0000;
}
#mailer #country {
    width:260px;
    margin-right:0;
}
#mailer #abreise,
#mailer #anreise {
    width:160px !important;
    margin-right:10px;
}
#mailer img.ui-datepicker-trigger {
    margin-right:20px;
}
#mailer #captchaform {
    float:left;
    position:relative;
    width:260px;
}
#mailer #captchaform label.error {
    left: 270px;
    top: -8px;
}
#mailer #captcha {
    position:absolute;
    top:0;
    right:0;
    font-size:18px;
    text-transform:uppercase;
    width:80px !important;
}
#mailer #agree {
    height: 16px;
    width: 20px;
    margin-right:10px;
}
#mailer #submitBTN {
    font: 16px/24px 'GillSansW01-DisplayBold 709825',Arial,sans-serif;
    text-transform:uppercase;
    background-color:#35589C;
    color:#FFFFFF;
    height:40px;
    margin-top:20px;
}

/* danke */
#infos.danke {
    position:absolute;
    top:110px;
    left:20px;
    width:94%;
    height:70%;
}


/* agb */
#infos.agb {
    position:absolute;
    top:110px;
    left:20px;
    width:94%;
}
#infos.agb h2 {
    margin-bottom:2px;
}
#infos.agb p.small {
    font-size:10px;
    line-height:14px;
}


/* google maps */
#map_canvas {
    height: 100%;
    width: 100%;
}
#map_canvas #mapLayer {
    font-size: 0.8em;
    line-height: 1.2;
}


/* 404 */
#infos.notfound {
    position:absolute;
    top:110px;
    left:20px;
    width:30%;
}
#infos.notfound h1 {
    color:#fff;
    font-size:20px;
}
#infos.notfound p {
    color:#fff;
    font-size:16px;
}


/* links */
a,
a:visited {
    color:#35589C;
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
}


/* footer */
#sitefooter {
    -moz-box-shadow: inset 0px 35px 10px -30px #000;
    -webkit-box-shadow: inset 0px 35px 10px -30px #000;
    box-shadow: inset 0px 35px 10px -30px #000;
    position:absolute;
    bottom:-50px;
    left:0;
    color:#aaa;
    height:50px;
    width:100%;
    background-color: rgba(40, 40, 40, 1);
    font:normal 12px/16px 'Gill Sans W01 Light', Arial, sans-serif;
}
.lt-ie9 #sitefooter {
    font: 12px/16px Arial,sans-serif;
    background-color:#000;
}
#sitefooter ul {
    margin:0;
    padding:10px 20px 20px 20px;
    list-style:none;
}
#sitefooter ul li {
    white-space:nowrap;
    display:inline;
    margin-right:10px;
    padding-right:16px;
    background:url("../img/sprites.png") no-repeat right -70px;
}
#sitefooter ul li:last-child {
    margin-right:0;
    padding-right:0;
    background-image:none;
}
#sitefooter ul li a,
#sitefooter ul li a:visited,
#sitefooter ul li a:active {
    color:#fff;
    text-decoration:none;
}
#sitefooter ul li a:hover {
    text-decoration:underline;
}
/* language switch */
a#lang {
    padding-left:24px;
}
a#lang.en {
    background: url("../img/flag_en.png") no-repeat 0 0;
}
a#lang.en:hover {
    background: url("../img/flag_en.png") no-repeat 0 -20px;
}
a#lang.de {
    background: url("../img/flag_de.png") no-repeat 0 0;
}
a#lang.de:hover {
    background: url("../img/flag_de.png") no-repeat 0 -20px;
}



/* ---------------- XL ---------------- */
@media only screen and (min-width:1300px){

h1 {
    font-size:24px;
    line-height:26px
}
p {
    font-size:18px;
    line-height:26px
}
#infos.reservierung {
    height: 60%;
    text-align:center;
}
#infos.reservierung #content {
    text-align:left;
    margin:0 auto;
    width: 1150px;
}
#infos.zimmer {
    height:auto;
}
#mailer dd {
    min-height: 40px;
}
#mailer dd input,
#mailer dd textarea {
    font-size: 16px;
    height: 25px;
    width: 300px;
}
#mailer dd textarea {
    width:304px;
    height:80px;
}
#mailer label.error {
    left: 430px;
}
#mailer #captchaform label.error {
    left: 308px;
}

} /* end of mq */



/* ---------------- M ---------------- */
@media only screen and (max-width:900px){

body {
    overflow: auto;
}
#header {
    top:0;
    height: 120px;
}
#logo {
    left: 10px;
    top: 10px;
    width: 294px;
}
#mainnav ul li a, #mainnav ul li a:visited, #mainnav ul li a:active {
    font-size: 12px;
    height: 35px;
    line-height: 14px;
    padding: 15px 24px 0;
}
#mainnav ul li a.active,
#mainnav ul li a:hover {
    height: 25px;
}
#mainnav {
    left: 0;
}
#infos {
    display:block !important;
}
#infos.reservierung {
    height: auto;
    position:static;
    margin: 20px 20px 0;
    width: 90%;
}
#infos.home {
    top:180px;
}
#infos.agb,
#infos.hotel,
#infos.zimmer {
    top:140px;
}
#infos.zimmer #service {
    top:0;
}
#mailer fieldset {
    width: 100%;
    margin-bottom:20px;
}
#sitefooter {
    bottom:0;
    height: auto;
}

} /* end of mq */





/* ---------------- S ---------------- */
@media only screen and (max-width:470px){

body {
    background-color: #35589C;
    background-image:none;
}
.box {
    -webkit-border-radius:0 !important;
    -moz-border-radius:0 !important;
    border-radius:0 !important;
    border:0 !important;
    overflow:auto !important;
    -moz-box-shadow:none !important;
    -webkit-box-shadow:none !important;
    box-shadow:none !important;
    padding:0 0 20px 0 !important;
}
h1,h2,p {
    margin:10px 0 0 10px;
}
#mainnav ul li a, #mainnav ul li a:visited, #mainnav ul li a:active {
    padding: 15px 8px 0;
}
#slideControls {
    display:none !important;
}
#infos {
    margin:0 !important;
    width:100% !important;
}
#infos.notfound,
#infos.home {
    margin: 40px 0 !important;
    position: static;
}
#infos.home h1 {
    margin:0;
    font-size: 46px;
    line-height: 46px;
    width: 100%;
}
#infos.home h1 span {
    font-size: 24px;
}
#infos.home .box {
    padding:5px;
    width: 90%;
}
#infos.notfound,
#infos.agb,
#infos.hotel,
#infos.hotel #service,
#infos.zimmer,
#infos.zimmer #service {
    width:100%;
    height:auto;
    position:static;
}
#infos.zimmer #service dl {
    padding:10px;
}
#infos.zimmer ul {
    padding:10px;
}
#infos.hotel #service ul {
    padding:10px;
}
#content {
    width: 100% !important;
}
#mailer fieldset {
    float:none !important;
    margin-left: 10px;
    width: auto;
}
#mailer label.error {
    display:none !important;
}
#sitefooter {
    position:static;
}
#sitefooter ul {
    padding:10px 20px 20px 10px;
}
#sitefooter ul li {
    line-height:20px;
    background-image: none;
    display: block;
    margin-right: 10px;
    padding-right: 0;
    white-space: nowrap;
    width: auto;
}
#supersized {
    visibility:hidden;
}


} /* end of mq */





/* debug */
pre {
    position:absolute;
    bottom:0;
    right:0;
    background-color:#fff;
    z-index:10000;
    font-size:10px;
}

/* fonts.com */
#mti_wfs_colophon {
    display:none !important;
}

/* NO JS */
.no-js #header {top:0;}
.no-js #infos {display:block;}
.no-js #sitefooter {bottom:0;}
