/* CSS Document */

@font-face {
    font-family: 'swiss721_light';
    src: url('../gfx/swiss721_light.eot');
    src: url('../gfx/swiss721_light.eot?#iefix') format('embedded-opentype'),
         url('../gfx/swiss721_light.woff') format('woff'),
         url('../gfx/swiss721_light.ttf') format('truetype'),
         url('../gfx/swiss721_light.svg#swiss721_light') format('svg');
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family: 'swiss721_light';
    src: url('../gfx/swiss721_light_italic.eot');
    src: url('../gfx/swiss721_light_italic.eot?#iefix') format('embedded-opentype'),
         url('../gfx/swiss721_light_italic.woff') format('woff'),
         url('../gfx/swiss721_light_italic.ttf') format('truetype'),
         url('../gfx/swiss721_light_italic.svg#swiss721_light') format('svg');
    font-weight:normal;
    font-style:italic;
}

@font-face {
    font-family: 'swiss721_light';
    src: url('../gfx/swiss721_medium.eot');
    src: url('../gfx/swiss721_medium.eot?#iefix') format('embedded-opentype'),
         url('../gfx/swiss721_medium.woff') format('woff'),
         url('../gfx/swiss721_medium.ttf') format('truetype'),
         url('../gfx/swiss721_medium.svg#swiss721_light') format('svg');
    font-weight:bold;
}

* {
	margin:0;
	outline:none;
	padding:0;
}

html {
	height:100%;
}

body {
	background:#000;
	color:#FFF;
	font-family:'swiss721_light',Arial, Helvetica, sans-serif;
	font-size:12px;
	height:100%;
	overflow:hidden;
}

.desktop {
	display:inherit;
	visibility:visible;
}

h1 {
	font-size:16px;
	font-weight:bold;
	margin:0px 0px 16px 0px;
	text-transform:uppercase;
}

h2 {
	font-size:14px;
	font-weight:bold;
	margin:0px 0px 16px 0px;
}

p {
	font-size:13px;
	line-height:150%;
	margin:0px 0px 10px 0px;
}

a {
	color:#FFF;
	text-decoration:none;
}

a:hover {
	color:#A7211C;
}

a img {
	border:none;
}

a#logo {
	background:url(../gfx/logo_baselerhof.svg) no-repeat center center;
	background-size:contain;
	display:block;
	height:80px;
	margin:15px 0px 0px 20px;
	max-width:300px;
}

#logo img {
	width:80%;
	max-width:300px;

}

div#header-bar {
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjgiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.9)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#00000000',GradientType=0 ); /* IE6-8 */
	height:180px;
	padding:10px 0px 0px 0px;
	position:fixed;
	  top:0px;
	  left:0px;
	  right:0px;
	width:100%;
	z-index:0;
}

div#content_area {
	margin:0px auto 0px auto;
	overflow-x:hidden;
	overflow-y:auto;
	position:absolute;
	  top:180px;
	  bottom:30px;
	  left:0px;
	  right:0px;
	max-width:500px;
	vertical-align:bottom;
	z-index:1;
}

.content_visible { display:block; visibility:visible; }

.content_invisible { display:none; visibility:hidden; }

#content { }

div.content_out {
	background:rgba(0,0,0,0.6);
	margin:0px auto 0px auto;
	width:100%;
	-webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari and Chrome */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}​

/* Opera */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}​



div.content_hide { display:none; visibility:hidden; }

.showhide {
	height:20px;
	width:20px;
	background:rgba(0,0,0,0.5) url(../gfx/icon_close.png) no-repeat center;
	background-size:80%;
	position:absolute;
	right:0;
	top:0px;
	z-index:999;
}

.restore_visible {
	background:rgba(0,0,0,0.5) url(../gfx/icon_restore.png) no-repeat right center;
	background-size:auto 80%;
	display:block;
	height:20px;
	margin:0px 0px 0px -250px;
	position:absolute;
	  bottom:30px;
	  left:50%;
	width:500px;
	z-index:99;
}

.restore_invisible { display:none; visibility:hidden; }

div#content_in { padding:30px 30px 30px 30px; }

#content_in a {
	color:#FAA;
	font-weight:bold;
	text-shadow:1px 1px 0px rgba(0,0,0,1);
}

#content_in a:hover {
	color:#F66;
}

#content_in iframe {
	height:100%;
}

#content ul {
	font-size:13px;
	line-height:150%;
}



/* CONTENT 2 */

.content_visible2 { display:block; visibility:visible; }

.content_invisible2 { display:none; visibility:hidden; }

#content2 a { color:#FFF; }

div.content_out2 {
	background:rgba(92,118,71,1.0);
	border:1px dashed #fff;
	border-bottom-right-radius:16px;
	box-shadow:rgba(0,0,0,0.75) 0px 3px 5px;
	position:absolute;
	  left:35px;
	  top:180px;
	width:248px;
	transform:rotate(-3deg);
	z-index:999;
}

div.content_hide2 { display:none; visibility:hidden; }

.showhide2 {
	height:20px;
	width:20px;
	background:rgba(0,0,0,0.5) url(../gfx/icon_close.png) no-repeat center;
	background-size:80%;
	position:absolute;
	right:0;
	top:0px;
	z-index:999;
}

.restore_visible2 {
	background:rgba(0,0,0,0.5) url(../gfx/icon_restore.png) no-repeat right center;
	background-size:auto 80%;
	display:block;
	height:20px;
	margin:0px 0px 0px -250px;
	position:absolute;
	  bottom:30px;
	  left:50%;
	width:500px;
	z-index:99;
}

.restore_invisible2 { display:none; visibility:hidden; }

div#content_in2 { font-weight:bold; padding:20px 16px 2px 16px; }






/* END */

.hidden {
	display:none;
	visibility:hidden;
}

div#social {
	overflow:visible;
	position:fixed;
	  right:0px;
	  bottom:12%;
	width:30px;
}

#social a {
	background-repeat:no-repeat;
	background-size:contain;
	display:block;
	margin:0px 0px 5px 0px;
	position:relative;
	  right:-6px;
	transition:all ease-out 0.2s;
	width:30px;
}

#social a:hover {
	right:0px;
	transition:all ease-out 0.2s;
}

#s_facebook {
	background-image:url(../gfx/s_facebook.png);
	height:30px;
}
#s_flag_ger {
	background-image:url(../gfx/ger-flag.png);
	height:40px;
}

#s_flag_eng {
	background-image:url(../gfx/eng-flag.png);
	height:40px;
}

#s_yelp {
	background-image:url(../gfx/s_yelp.png);
	height:30px;
}

#s_tripadvisor {
	background-image:url(../gfx/s_tripadvisor_ta.png);
	height:30px;
}

#s_feedback {
	background-image:url(../gfx/s_feedback_ta.png);
	height:90px;
}

table tr td {
	padding:0px 8px 0px 0px;
}

.trigger {
	background:rgba(0,0,0,0.5);
	font-size:14px;
	font-weight:bold;
	margin:0px 0px 5px 0px;
	padding:12px 8px 12px 8px;
	text-transform:uppercase;
}

.toggle_container {
	padding:0px 0px 0px 8px;
}

.toggle_container ul {
	margin:10px 0px 10px 20px;
}

.toggle_container td {
	padding:0px 0px 8px 0px;
	vertical-align:top;
}

div#footer-bar {
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjYiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjgiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.8) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(50%,rgba(0,0,0,0.6)), color-stop(100%,rgba(0,0,0,0.8)));
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.8) 100%);
background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.8) 100%);
background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.8) 100%);
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.8) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 );
	display:block;
	height:30px;
	position:fixed;
	  left:0px;
	  bottom:0px;
	width:100%;
	z-index:2;
}

div#footer {
	border-top:1px solid rgba(255,255,255,0.3);
	font-size:11px;
	margin:0px auto 0px auto;
	max-width:900px;
	padding:10px 0px 0px 0px;
	position:relative;
	width:auto;
}

#link_impressum {
	float:right;
	display:inline-block;
	vertical-align:baseline;
}



#gastronomien {
	display:inline-block;
	font-family:Georgia, "Times New Roman", Times, serif;
	margin:0px 0px 0px 60px;
	overflow:visible;
	vertical-align:baseline;
}

#kleinhuis-tag {
	height:28px;
	margin-left:-28px;
	position:absolute;
	  bottom:3px;
}

#gastronomien ul {
	list-style:none;
	margin-left:-30px;
	opacity:0;
	position:absolute;
	  bottom:40px;
	  -webkit-transition:all 0.5s;
	transition:all 0.5s;
	  -webkit-transition-delay: 1s;
	transition-delay:1s;
}

#gastronomien ul li {
	background:rgba(255,255,255,0.75);
	color:#000;
	display:block;
	font-size:12px;
	height:0px;
	margin:0px 0px 0px 0px;
	overflow:hidden;
	padding:0px 10px 0px 10px;
	text-transform:uppercase;
	  -webkittransition:all 0.5s;
	transition:all 0.5s;
	   -webkit-transition-delay: 1s;
	transition-delay:1s;
}

#gastronomien:hover ul {
	height:auto;
	opacity:1;
	  -webkit-transition:all 0.5s;
	transition:all 0.5s;
}

#gastronomien:hover ul li {
	height:17px;
	margin:0px 0px 4px 0px;
	padding:4px 10px 3px 10px;
	  -webkit-transition:all 0.5s;
	transition:all 0.5s;
}

#gastronomien:hover ul li:hover {
	background:rgba(255,255,255,1.0);
	  -webkit-transition-delay:0s;
	transition-delay:0s;
}



#baseler-hof {
	display:inline-block;
	float:right;
	font-family:Georgia, "Times New Roman", Times, serif;
	overflow:visible;
	vertical-align:baseline;
}

#baseler-hof ul {
	list-style:none;
	opacity:0;
	position:absolute;
	  bottom:40px;
	  right:0px;
	  -webkit-transition:all 0.5s;
	transition:all 0.5s;
	  -webkit-transition-delay: 0.5s;
	transition-delay:1s;
}

#baseler-hof ul li {
	background:rgba(255,255,255,0.75);
	color:#000;
	display:block;
	font-size:12px;
	height:0px;
	margin:0px 0px 0px 0px;
	overflow:hidden;
	padding:0px 10px 0px 10px;
	text-transform:uppercase;
	  -webkittransition:all 0.5s;
	transition:all 0.5s;
	   -webkit-transition-delay: 1s;
	transition-delay:1s;
	white-space:nowrap;
}

#baseler-hof:hover ul {
	height:auto;
	opacity:1;
	  -webkit-transition:all 0.5s;
	transition:all 0.5s;
}

#baseler-hof:hover ul li {
	height:17px;
	margin:0px 0px 4px 0px;
	padding:4px 10px 3px 10px;
	  -webkit-transition:all 0.5s;
	transition:all 0.5s;
}

#baseler-hof:hover ul li:hover {
	background:rgba(255,255,255,1.0);
	  -webkit-transition-delay:0s;
	transition-delay:0s;
}


#mobile_menu {
	display:none;
	visibility:hidden;
}

div#team {
	text-align:center;
}

#team a {
	background:rgba(0,0,0,0.3);
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	display:inline-block;
	height:110px;
	margin:3px 3px 3px 3px;
	opacity:0.8;
	transition:opacity 0.5s;
	vertical-align:top;
	width:110px;
}

#team a:hover {
	opacity:1;
}

div#bewegt {
	text-align:center;
}

#fancybox-content > div {
	background-color:rgba(255,255,255,1);
	color:#222;
}

#fancybox-content > div a {
	color:#E00;
	font-weight:bold;
}

#fancybox-content > div > div > img {
	float:right;
}

#bewegt a {
	background:#FFF;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:80%;
	display:inline-block;
	height:110px;
	margin:3px 3px 3px 3px;
	opacity:0.8;
	transition:opacity 0.5s;
	vertical-align:top;
	width:110px;
}

#bewegt a:hover {
	opacity:1;
}


.scroll-pane {
	overflow-x:hidden;
	overflow-y:auto;
	position:absolute;
	  top:270px;
	  bottom:60px;
	width:180px;
}

.neu {
	height:20px;
	margin-top:-8px;
	position:absolute;
}

/*  CSSMENU  */

#cssmenu {
  display:block;
  position:absolute;
    right:0px;
    top:76px;
  z-index:1200;
}
#cssmenu ul {
  list-style: none;
  padding: 0;
  margin: 0;
  line-height: 1;
}
#cssmenu > ul {
  position: relative;
  display: block;
  height: 32px;
  white-space:nowrap;
  z-index:8;
}
#cssmenu > ul > li {
	clear:none;
	display: block;
	position: relative;
	float: left;
	margin: 0px 0px 0px 8px;
	padding: 0;
}
#cssmenu > ul > #menu-button {
  display: none;
}
#cssmenu ul li a {
  display:block;
  text-decoration: none;
  z-index:99;
}
#cssmenu > ul > li > a {
  font-size: 13px;
  font-weight: bold;
  padding: 15px 10px 20px 10px;;
  color: #FFF;
  text-shadow:1px 1px rgba(0,0,0,1);
  text-transform: uppercase;
  -webkit-transition: color 0.25s ease-out;
  -moz-transition: color 0.25s ease-out;
  -ms-transition: color 0.25s ease-out;
  -o-transition: color 0.25s ease-out;
  transition: color 0.25s ease-out;
}

#cssmenu > ul > li.has-sub > a {
  padding-right: 14px;
}

#cssmenu > ul > li > a:focus, #cssmenu > ul > li > a:active {
  background:rgba(255,255,255,0.3);
}

#cssmenu > ul > li:hover > a {
  color: #FFF;
}
/*
#cssmenu li.has-sub::after {
  display: block;
  content: '';
  position: absolute;
  width: 0;
  height: 0;
}
#cssmenu > ul > li.has-sub::after {
  right: 10px;
  top: 20px;
  border: 5px solid transparent;
  border-top-color: #7a8189;
}
#cssmenu > ul > li:hover::after {
  border-top-color: #ffffff;
}
*/
#indicatorContainer {
	display:none;
	position: absolute;
	height: 12px;
	width: 100%;
	bottom: 0px;
	overflow: hidden;
	z-index: -1;
}
#pIndicator {
  position: absolute;
  height: 0;
  width: 100%;
  border: 12px solid transparent;
  border-top-color: #2b2f3a;
  z-index: -2;
  -webkit-transition: left .25s ease;
  -moz-transition: left .25s ease;
  -ms-transition: left .25s ease;
  -o-transition: left .25s ease;
  transition: left .25s ease;
}
#cIndicator {
  position: absolute;
  height: 0;
  width: 100%;
  border: 12px solid transparent;
  border-top-color: #2b2f3a;
  top: -12px;
  right: 100%;
  z-index: -2;
}
#cssmenu ul ul {
  position: absolute;
  left: -9999px;
  top: 70px;
  opacity: 0;
  -webkit-transition: opacity .3s ease, top .25s ease;
  -moz-transition: opacity .3s ease, top .25s ease;
  -ms-transition: opacity .3s ease, top .25s ease;
  -o-transition: opacity .3s ease, top .25s ease;
  transition: opacity .3s ease, top .25s ease;
  z-index:9;
}
#cssmenu ul ul ul {
  top: 37px;
  padding-left: 5px;
}
#cssmenu ul ul li {
  position: relative;
}
#cssmenu > ul > li:hover > ul {
  left: auto;
  top: 44px;
  opacity: 1;
}
#cssmenu ul ul li:hover > ul {
  left: 170px;
  top: 0;
  opacity: 1;
}
#cssmenu ul ul li a {
  width: auto;
  border-bottom: 1px solid rgba(60,74,117,0.55);
  padding: 8px 32px 8px 10px;
  font-size: 13px;
  color: #FFF;
  background:rgba(60,74,117,0.80);
  -webkit-transition: all .35s ease;
  -moz-transition: all .35s ease;
  -ms-transition: all .35s ease;
  -o-transition: all .35s ease;
  transition: all .35s ease;
  white-space:nowrap;
}
#cssmenu ul ul li:hover > a {
  background: #f6f6f6;
  color: #8c9195;
}
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul li.last > a {
  border-bottom: 0;
}
.submenuArrow {
  border: 6px solid transparent;
  width: 0;
  height: 0;
  border-bottom-color:rgba(60,74,117,0.80);
  position: absolute;
    top: -12px;
}
#cssmenu ul ul li.has-sub::after {
  border: 4px solid transparent;
  border-left-color: #9ea2a5;
  right: 10px;
  top: 12px;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
  -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease;
}
#cssmenu ul ul li.has-sub:hover::after {
  border-left-color: #fff;
  right: -5px;
  -webkit-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.menu_current {
	background-color:rgba(92,118,71,0.3);
}

.title {
	font-weight:bold;
	font-size:12px;
	padding:10px 0px 0px 0px;
}

.price {
	font-weight:bold;
	padding:0px 0px 0px 0px;
	text-align:left;
	white-space:nowrap;
}

#zimmerpreise {
	line-height:150%;
}

#zimmerpreise th {
	font-size:13px;
	font-weight:bold;
	padding:0px 0px 8px 0px;
	text-align:left;
}

#zimmerpreise td {
	vertical-align:top;
}

#zimmerpreise td:nth-child(1) {
	vertical-align:top;
	white-space:nowrap;
}

#zimmerpreise td:nth-child(2) {
	padding:0px 0px 8px 0px;
	vertical-align:top;
}

#zimmerpreise td:nth-child(3n) {
	text-align:right;
}

#zimmerpreise a {
	background:rgba(0,0,0,0.3);
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	display:inline-block;
	height:110px;
	margin:3px 3px 3px 3px;
	opacity:0.8;
	transition:opacity 0.5s;
	vertical-align:top;
	width:110px;
}



/*  SUPERSIZED  */

#controls-wrapper { margin:0 auto; height:42px; width:100%; bottom:0px; left:0; z-index:4; background:url(../img/nav-bg.png) repeat-x; position:fixed; }
#controls { overflow:hidden; height:100%; position:relative; text-align:left; z-index:5; }
#slidecounter { float:left; color:#999; font:14px "Helvetica Neue", Helvetica, Arial, sans-serif; text-shadow:#000 0 -1px 0; margin:0px 10px 0 15px; line-height:42px; }
#slidecaption { overflow:hidden; float:left; color:#FFF; font:400 14px "Helvetica Neue", Helvetica, Arial, sans-serif; text-shadow:#000 1px 1px 2px; margin:0 20px 0 0; line-height:42px; }
#navigation { float:right; margin:0px 20px 0 0; }
#play-button{ float:left; margin-top:1px;border-right:1px solid #333; background:url('../img/bg-hover.png') repeat-x 0 44px; }
#play-button:hover{ background-position:0 1px; cursor:pointer; }
#prevslide, #nextslide{
					background:transparent;
					background-position:center center;
					background-repeat:no-repeat;
					background-size:15px auto;
					color:rgba(0,0,0,1);
					font-weight:bold;
					height:16px;
					margin-top:-8px;
					padding:9px;
					text-align:center;
					width:16px;
					opacity:0.5;
					z-index:99;
					}

#prevslide{ background-image:url('../gfx/slide_prev.png'); position:fixed; top:50%; left:0px; }
#nextslide{ background-image:url('../gfx/slide_next.png'); position:fixed; top:50%; right:0px; }

#prevslide:active, #nextslide:active { }
#prevslide:hover, #nextslide:hover{ cursor:pointer; }
img { border:none; }
#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../img/progress.gif) no-repeat center center;}
#supersized {  display:block; position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
#supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/
#supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111; }
#supersized a { width:100%; height:100%; display:block; }
#supersized li.prevslide { z-index:-20; }
#supersized li.activeslide { z-index:-10; }
#supersized li.image-loading { background:#111 url(../img/progress.gif) no-repeat center center; width:100%; height:100%; }
#supersized li.image-loading img{ visibility:hidden; }
#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }

ul#slide-list {
	padding:15px 0; float:left;
	position:absolute;
	 right:6px;
	 top:0px;
}

ul#slide-list li {
	display:inline-block;
	list-style:none;
	width:24px;
	height:24px;
	float:left;
	margin:0 10px 0 0;
}

ul#slide-list li a {
	background:rgba(0,0,0,0.5);
	display:block;
	width:24px;
	height:24px;
}

ul#slide-list li.current-slide a {
	background:rgba(255,255,255,0.5);
}

ul#slide-list li.current-slide a:hover {
	background:rgba(0,0,0,1);
}

ul#slide-list li a:hover {
	background:rgba(0,0,0,1);
}

#tray-button{ float:right; margin-top:1px; border-left:1px solid #333; background:url('../img/bg-hover.png') repeat-x 0 44px; }
#tray-button:hover{ background-position:0 1px; cursor:pointer; }


#progress-back{ z-index:5; position:fixed; bottom:0px; left:0; height:8px; width:100%; background:rgba(0,0,0,0.3); }

#progress-bar{ position:relative; height:8px; width:100%; background:rgba(255,255,255,0.3); }


	/* Thumbnail Navigation
	----------------------------*/
	#nextthumb,#prevthumb { z-index:2; display:none; position:fixed; bottom:61px; height:75px; width:100px; overflow:hidden; background:#ddd; border:1px solid #fff; -webkit-box-shadow:0 0 5px #000; }
		#nextthumb { right:12px; }
		#prevthumb { left:12px; }
			#nextthumb img, #prevthumb img { width:150px; height:auto;  }
			#nextthumb:active, #prevthumb:active { bottom:59px; }
			#nextthumb:hover, #prevthumb:hover { cursor:pointer; }


	/* Thumbnail Tray
	----------------------------*/
	#thumb-tray{ position:fixed; z-index:3; bottom:0; left:0; background:url(../img/bg-black.png); height:150px; width:100%; overflow:hidden; text-align:center; -moz-box-shadow: 0px 0px 4px #000; -webkit-box-shadow: 0px 0px 4px #000; box-shadow: 0px 0px 4px #000; }

		#thumb-back, #thumb-forward{ position:absolute; z-index:5; bottom:42px; height:108px; width:40px; }
			#thumb-back{ left:0; background: url('../img/thumb-back.png') no-repeat center center;}
			#thumb-forward{ right:0; background:url('../img/thumb-forward.png') no-repeat center center;}
				#thumb-back:hover, #thumb-forward:hover{ cursor:pointer; background-color:rgba(256,256,256, 0.1); }
					#thumb-back:hover{ border-right:1px solid rgba(256,256,256, 0.2); }
					#thumb-forward:hover{ border-left:1px solid rgba(256,256,256, 0.2); }


		ul#thumb-list{ display:inline-block; list-style:none; position:relative; left:0px; padding:0 0px; }
			ul#thumb-list li{ background:#111; list-style:none; display:inline; width:150px; height:108px; overflow:hidden; float:left; margin:0; }
				ul#thumb-list li img { width:200px; height:auto; opacity:0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter:alpha(opacity=60); -webkit-transition: all 100ms ease-in-out; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -ms-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; }
				ul#thumb-list li.current-thumb img, ul#thumb-list li:hover img{ opacity:1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); }
				ul#thumb-list li:hover{ cursor:pointer; }


/*
 * jScrollPane
 */

.jspContainer
{
	overflow: hidden;
	position: relative;
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	  top:0;
	  right:0;
	width: 16px;
	height:100%;					/* does this do anything? */
	margin:0px 10px 0px 0px;
	background:transparent;
}

.jspHorizontalBar
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 16px;
	background: red;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap {
	background:none;
}

.jspCapTop {
	height:12px;
}

.jspCapBottom {
	height:20px;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background:transparent;
	border:2px solid #D7D7D7;
	border-radius:8px;
	padding:2px 2px 2px 2px;
	position: relative;
}

.jspDrag
{
	background: #D7D7D7;
	border-radius:6px;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/*  BUCHEN  */

div#sidebar_2 {
	margin:0px 0px 0px 0px;
	position:absolute;
	  top:180px;
	white-space:nowrap;
	z-index:5;
}
div#sidebar_2.tab_open {
    right:0;
    transition: 0.5s;
}
div#sidebar_2.tab_close {
    right:-296px;
    transition: 0.5s;
}

div#sidebar_2 table {
    background-color: rgba(0,0,0,0.6);
    padding: 30px;
}

div#buchen_2 {
	clear:none;
	font-size:14px;
	font-weight:bold;
	overflow:hidden;
	padding:0;
	white-space:nowrap;
}


div#buchen-tab {
	background-color:rgba(167,33,28,0.9);
	background-position:center center;
	background-repeat:no-repeat;
	background-size:60% auto;
	clear:none;
    position: absolute;
    left:-30px;
	display:inline-block;
	height:100%;
	vertical-align:top;
	width:30px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.tab_open div#buchen-tab img.tab-icon_open {
    height: 10px;
    margin-left: 13px;
    margin-top: 15px;

}
.tab_close div#buchen-tab img.tab-icon_open {

    display: none;
}

.tab_close div#buchen-tab img.tab-icon_close  {
    height: 10px;
    margin-left: 13px;
    margin-top: 15px;

}
.tab_open div#buchen-tab img.tab-icon_close {

    display: none;
}
div#buchen-tab {
    cursor: pointer;
}

div#buchen-tab a {
	display:block;
}

#buchen_2 input {
	border:none;
	border-radius:2px;
	margin:0px 0px 6px 0px;
	padding:3px 3px 3px 3px;
}

.datepicker {
	background-image:url(../gfx/calendar.svg);
	background-position:right 4px center;
	background-repeat:no-repeat;
	background-size:auto 75%;
	font-weight:bold;
	width:98px;
}

img.ui-datepicker-trigger {
	display:none;
	visibility:hidden;
}

div#ui-datepicker-div {
	background:rgba(255,255,255,1);
	border:1px solid #000;
	border-collapse:separate;
	border-radius:2px;
	color:#888;
	font-size:14px;
	margin:0px 0px 0px -1px;
}

.ui-datepicker-header {
	border-bottom:1px solid #888;
	color:#000;
	font-weight:bold;
	margin:0px 0px 5px 0px;
	padding:3px 0px 3px 0px;
	text-align:center;
}

.ui-datepicker-header a {
	background-color:#888;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:30%;
	border-radius:9px;
	color:rgba(255,255,255,0);
	height:16px;
	overflow:hidden;
	position:absolute;
	width:16px;
}

.ui-datepicker-prev {
	background-image:url(../gfx/cal-arrow-l.svg);
	  top:6px;
	  left:6px;
}

.ui-datepicker-next {
	background-image:url(../gfx/cal-arrow-r.svg);
	  top:6px;
	  right:6px;
}

.ui-datepicker-calendar td {
	border:2px solid rgba(255,255,255,0);
	padding:1px 3px 1px 3px;
	text-align:right;
}

.ui-datepicker-calendar td:nth-child(7) a {
	color:#C33;
	font-weight:bold !important;
}

td.ui-datepicker-week-end a {
	color:#AC6F7E;
}

.ui-datepicker-calendar td:hover {
	background:#CCC;
}

.ui-datepicker-calendar a {
	color:#000;
}

.ui-datepicker-calendar tr {
	border-top:1px solid #888;
}

.ui-state-default {
}

td.ui-datepicker-unselectable {
	color:#CCC;
}

td.ui-datepicker-unselectable:hover {
	background:none;
}

td.ui-datepicker-today {
	border:2px solid #f00;
}

.numericOnly {
	font-weight:bold;
	margin-top:2px;
	text-align:center;
}

div.plusminus {
	background:rgba(255,255,255,0.4);
	border-radius:8px;
	overflow:hidden;
	padding:0px;
}

.ccounter {
	display:inline-block;
	font-weight:bold;
	height:16px;
	text-align:center;
	width:16px;
}

.ccounter:hover {
	background:rgba(255,255,255,0.3);
}

#buchen .minus {
	padding:2px 2px 2px 5px;
}

#buchen .plus {
	padding:2px 5px 2px 2px;
}

.submit {
	background:rgba(255,255,255,0.4);
	color:#FFF;
	font-weight:bold;
	text-transform:uppercase;
	width:100%;
}

.submit:hover {
	background:rgba(255,255,255,0.6);
}

/*  RESPONSIVE  */

@media all and (max-width: 1050px) {

	div#cssmenu {
		top:100px;
	}

  #cssmenu > ul > li {
	margin: 0px 0px 0px 0px;
  }
  div#footer {
	  padding:10px 10px 0px 10px;
  }

  div.content_out2 {
	  top:auto;
	  bottom:30px;
  }
}


@media all and (max-width: 770px) {
	
	.desktop {
		display:none;
		visibility:hidden;
	}
	
	#cssmenu {
		display:none;
		visibility:hidden;
		z-index:9;
	}

	a#logo {
		margin:10px auto 0px auto;
	}

	#mobile_menu {
		background:rgba(0,0,0,0.5);
		display:block;
		position:fixed;
		  bottom:0px;
		  left:0px;
		text-align:center;
		white-space:nowrap;
		visibility:visible;
		width:100%;
	}
	#mobile_menu ul {
		margin:8px auto 8px auto;
	}
	#mobile_menu ul li {
		background-color:rgba(0,0,0,0.3);
		background-position:center center;
		background-repeat:no-repeat;
		background-size:75%;
		border:1px solid rgba(255,255,255,1);
		border-radius:5px;
		clear:none;
		display:inline-block;
		height:65px;
		margin:0px 8px 0px 8px;
		overflow:hidden;
		text-align:center;
		white-space:nowrap;
		width:65px;
	}
	#mobile_menu ul li a {
		display:block;
		height:100%;
		width:100%;
	}
	#micon_food {
		background-image:url(../gfx/micon_food.png);
	}
	#micon_wine {
		background-image:url(../gfx/micon_wine.png);
	}
	#micon_location {
		background-image:url(../gfx/micon_location.png);
	}
	#micon_time {
		background-image:url(../gfx/micon_time.png);
	}
	#micon_mail {
		background-image:url(../gfx/micon_mail.png);
	}
	#micon_hotel {
		background-image:url(../gfx/micon_hotel.png);
	}
	#micon_rooms {
		background-image:url(../gfx/micon_rooms.png);
	}
	#micon_booking {
		background-image:url(../gfx/micon_booking.png);
	}
	#micon_phone {
		background-image:url(../gfx/micon_phone.png);
	}
	#prevslide, #nextslide {
		display:none;
		visibility:hidden;
	}
	div#content_area {
	  margin:0px auto 0px auto;
	  top:130px;
	  bottom:87px;
	  left:0px;
	  right:0px;
	}
	div#content_out {
		left:0px;
		padding:0;
		width:100%;
	}
	div#content_in {
		padding:30px 20px 30px 20px;
	}
	.showhide {
	}
	.restore_visible {
		bottom:100px;
	}
	div#social {
		height:30px;
		top:0px;
		z-index:12;
	}
	#social ul {
		display:inline-block;
	}
	#social ul li {
		clear:none;
		display:inline-block;
	}
	#s_feedback {
	  display:none;
	  visibility:hidden;
}
	div#footer-bar {
		display:none;
		visibility:hidden;
	}

	div.content_out2 {
	  top:auto;
	  bottom:90px;
  }
}

@media all and (max-width: 480px) {

	a#logo {
		margin:0px auto 0px auto;
		position:absolute;
		  top:20px;
		  left:10px;
		  right:10px;
	}


  div#content_area {
	top:120px;
	bottom:62px;
	left:0px;
	right:0px;
  }

  #mobile_menu ul li {
	  height:40px;
	  margin:0px 0px 0px 5px;
	  width:40px;
  }

  a#s_facebook {
	  height:32px;
	  position:fixed;
	    left:-6px;
		top:0px;
	  width:32px;
  }

  div.content_out2 {
	top:auto;
	bottom:60px;
  }

  div#sidebar {
	  display:none;
	  visibility:hidden;
  }

  .restore_visible {
		bottom:70px;
		left:10px;
		right:10px;
	  margin:0px 0px 0px 0px;
	  width:inherit;
  }

}


/* buchungsmenue ch */
.ccounter {
	cursor:pointer;
}
