/* 	HG Naturklinik Michelrieth 
	www.naturklinik.com | 17052010
	by meow-project.com */


@import url(/css/reset.css);
@import url(/css/colors.css);
@import url(/css/typography.css);


body {margin:15px 0 0; font:80%/1.5em Helvetica Neue, Helvetica, Arial, sans-serif;}

#container {position:relative; z-index:10; width:956px; margin:auto; background:url(/img/website/content-bg.png) top right repeat-y; overflow:hidden;}
#inner {width:950px; margin:auto; background:#fff; overflow:auto; min-height:750px;}

#topbar {width:958px; margin:0 auto; overflow:auto;}
.tabs {float:right; overflow:auto; margin:0 4px 0;}
.tabs li {float:left; display:inline; background:#895482; margin-left:1px;}
.tabs li:hover {background:#653d60;}
.tabs li a {display:block; padding:2px 6px; font-size:11px; color:#fff; text-decoration:none;}


/*	Header	*/

#header {position:relative; width:890px; padding:22px 30px 25px; overflow:auto;}

#header .lang-select {position:absolute; bottom:0px; right:0; margin:0; clear:both; border:0;}
#header .lang-select li {float:left; display:inline; padding:7px 3px;}
#header .lang-select li.last {padding-right:10px;}

.lang-select li a {display:block; float:left; width:16px; height:11px; text-indent:-9999em; opacity:.8; filter: alpha(opacity=80); overflow:hidden;}
.lang-select li a:hover {opacity:1; filter: alpha(opacity=100);}
.lang-select li.de a {background:url(/img/website/de.png) no-repeat;}
.lang-select li.en a {background:url(/img/website/us.png) no-repeat;}
.lang-select li.it a {background:url(/img/website/it.png) no-repeat;}
.lang-select li.fr a {background:url(/img/website/fr.png) no-repeat;}
.lang-select li.es a {background:url(/img/website/es.png) no-repeat;}
.lang-select li.bg a {background:url(/img/website/bg.png) no-repeat;}
.lang-select li.ru a {background:url(/img/website/ru.png) no-repeat;}
.lang-select li.sa a {background:url(/img/website/sa.png) no-repeat;}

#logo {clear:both; display:block; width:600px; height:68px; margin:5px 0; text-indent:-9999em; background:url(/img/website/logo.gif) no-repeat;}
#logo.it {background-image:url(/img/website/logo-it.gif);}
#logo.en {background-image:url(/img/website/logo-en.gif);}
#logo a {display:block; width:600px; height:68px;}

.addthis_toolbox {position:absolute; top:10px; right:7px;}
.share {float:left; margin-right:5px; font-size:.85em; line-height:16px; color:#888;}


/*	Navigation	*/

#menu {position:relative; clear:right; width:950px; height:45px; overflow:auto; background:url(/img/website/menu-sprite.png) 0 -10px repeat-x; z-index:1000;}
#menu ul {margin:0; padding:0;}
#menu li {float:left; display:inline;}
#menu li.first a {border-left:0;}
#menu li.last a {border-right:0;}
#menu li a {padding:0 13px; display:block; border-left:1px solid #cfb8cc; border-right:1px solid #a78ba2; color:#fff; font-size:14px; line-height:40px; text-shadow:1px 1px 1px #777;}
#menu li a:hover, li#uberlink2 a {text-decoration:none; background:url(/img/website/menu-sprite.png) 0 -88px repeat-x;}


#suche {float:right; background:url(/img/website/menu-sprite.png) 0 -88px repeat-x; position:relative; width:240px; height:45px;}
input.suchfeld {float:left; margin:9px 0 0 9px; padding:3px; width:150px; height:16px; border:none; font:13px/1em Helvetica Neue, Helvetica, Arial, sans-serif; background:#f5f4fc; color:#464646; -webkit-box-shadow:inset 0 0 1px #666;}
input.suchfeld:focus {background:#fff;}
input.suche-button {float:left; background:none; margin-top:10px; border:0; cursor:pointer; color:#fff; font:14px/1em Helvetica Neue, Helvetica, Arial, sans-serif; text-shadow:1px 1px 1px #777;}


/*	Submenu	*/

#submenu {clear:left; float:left; width:165px; margin-top:-5px; padding:20px 20px 0 20px;}
#submenu p {font-size:0.95em; line-height:1.5em;}
#submenu p img {margin:0.5em 0 0 0;}
#submenu h1 {margin-bottom:5px; font-size:1.1em;}
#submenu ul {margin:0 0 35px 0; padding:0; list-style:none; font:1em/1.4em Helvetica, Arial, sans-serif; border-width:1px 0 0 0; border-style:solid;}
#submenu li {display:inline;}
#submenu li a {display:block; padding:6px 5px 6px 10px; text-decoration:none; border-width:0 0 1px 0; border-style:solid;}
#submenu h2 {margin:0; font:normal 1em/1.4em Arial, Helvetica, sans-serif;}

#print {margin:70px 0 50px; font-size:.85em; color:#333; text-align:right;}
#print ul {margin:0;}
#print p {padding-right:5px; border-width:0 0 1px 0; border-style:solid;}
a.small {font-size:.9em;}
a.medium {font-size:1.05em;}
a.big {font-size:1.25em;}



/*  Slider  */
#feature {
    overflow:hidden;
    width:950px; height:300px;
    position:relative; z-index:0;
    clear:both;
	top:-5px;
}

.orbit-caption h2 {font:2.2em/1em Georgia, "Times New Roman", Times, serif; margin-bottom:0.3em;}
#banner {position:relative; top:-5px;}
#slider {position:relative; z-index:0; top:-5px;}
#text {padding:20px 30px 2em 20px;}


.orbit-caption {display:none;}

.orbit-wrapper .orbit-caption {position:absolute; left:0; bottom:40px; z-index:1000;}

.orbit-caption .highlight {padding:6px 30px; font-size:12px; line-height:26px; color:#fff; background:#d31987; text-transform:uppercase; letter-spacing:1px;}

.orbit-caption .content {padding:30px 50px 30px 30px; background:#fff; opacity:.9; color:#636363;}
.orbit-caption .content.feature {padding:20px 25px 20px 30px; width:340px;}

.orbit-caption p {margin:0; font-size:1.1em; line-height:1.4em;}
.orbit-caption p.link {text-align:right;}
.orbit-caption a {text-decoration:none; color:#d31987;}

.orbit-caption .feature p {font-size:1em;}


/*	Main	*/

#main {float:left; width:745px;}
.home #main {width:920px; padding:0 0 0 30px;}
.home #main .content {float:left; width:640px; margin-top:20px;}

h1 {font:1.6em/1.4em Georgia, "Times New Roman", Times, serif;}
h1 small {display:block; margin-top:-3px; font-size:0.8em;}
h2 {font-size:1.2em; line-height:1.5em; margin-bottom:.5em;}
h2 small {display:block; font-size:0.85em;}
h2 em {display:block; margin-top:-3px; font-size:0.8em;}
h3 {font-size:1em; line-height:1.5em; font-weight:bold;}
.home .offers h2 {margin-bottom:.25em;}
#sidebar h3 {font-weight:normal;}

#main table.preise td {padding:4px 0;}

.offers .equalize {width:640px; overflow:auto; margin-bottom:1.5em;}
.offers .entry {float:left; width:300px; margin-right:40px;}
.offers .entry.last {margin-right:0;}
.offers .entry img {margin:3px 0 20px 20px;}
.offers .entry a {display:block; margin-top:5px;}

ul.margin li {padding:2px 0;}



/*	Sidebar	*/

.home #sidebar {margin:0;}
.home #sidebar .entry {padding:20px; background:url(/img/website/hr.png) bottom left repeat-x;}
.home #sidebar .entry.last {background:none;}
.home #sidebar img.floatright {margin:0 0 10px 10px;}
.home #sidebar p, .home #sidebar ul {margin-bottom:.5em;}

#sidebar {float:right; width:245px; margin:-20px -30px 25px 45px; font-size:12px; overflow:auto;}
#sidebar .content {padding:25px 20px 20px;}
#main #sidebar h1 {margin-bottom:0.75em; font-size:1.4em; border:0;}
#sidebar p img {margin:.5em 0 0 0;}

#sidebar img.floatright {margin:0 0 15px 15px;}

.home #sidebar h3 {margin-bottom:.75em; font-size:1em;}
#sidebar h3 small {display:block; font-size:.85em; line-height:1.4em; color:#666;}


/*	Footer	*/

#bottom {height:3px; width:956px; background:url(/img/website/content-bottom.png);}
#footer {position:relative; z-index:0; clear:both; width:100%; margin-top:-50px; overflow:auto;}
#footer .content {width:920px; margin:85px auto 45px; font-size:.85em; line-height:1.1em; overflow:auto;}
#footer .menu {float:left; width:125px; margin:0; padding-left:10px;}
#footer .menu li {list-style:none; padding:3px 0;}
#footer .menu.copyright {width:240px; padding:0; border:0;}
#footer a {text-decoration:none;}
#footer a:hover {text-decoration:underline;}
#footer .first {margin-bottom:.25em; font-weight:bold; font-size:1em; text-transform:uppercase}
#footer .add-links {clear:both; margin: 0; padding-top: 1.25em;}
#footer .fb {clear:both; display:block; width:185px; padding:1.25em 0 0 25px; border-top:1px solid #9b7996; line-height:14px; background:url(/img/website/fb.gif) no-repeat bottom left;}


/*	Forms	*/

form#newsletter input {float:left; width:130px; border:0; margin:0 5px 1em 0; padding:5px; height:15px; font:1em Arial, Helvetica, sans-serif;}
form#newsletter input.submit-button {float:left; margin:0; padding:0; border:0; height:25px; width:30px; cursor:pointer; background:#DAD6DF; font-weight:bold;}
form#newsletter input.submit-button:hover {background:#895482; color:#fff;}
form#newsletter label.error {display:block; margin-bottom:1em; color:#C00;}
.home label.error {clear:both;}



/*	Styling	*/

#index div.hr {height:4px; margin:2em 0; background:url(/img/website/hr.gif) repeat-x;}
#index div.hr hr {display: none;}

.kosten {margin-bottom:1.5em; width:500px;}
.kosten table:last-child {margin:0;}
.kosten th h3 {border-bottom:1px solid #b5c8e6;}
#flashContent {display:none;}

.pics img {float:left; margin:0 8px 8px 0; padding:4px; border:1px solid #eee;}
.pics img.last {margin-right:0;}
.pics img:hover {border-color:#c8c9dd;}
.pics h2 {clear:both;}

.list img {float:left; margin-right:20px;}
.list {height:100px; padding:15px 0;}
.list.last {border-bottom:none;}

#angebote .list img {float:right; margin:5px 0 10px 20px;}
#angebote .list {height:auto; padding:0; float:left; margin-right:50px; width:320px; border:0;}
#angebote .list:hover {background:none;}
#angebote .list.last {margin:0;}
#angebote .list h2 {line-height:1.4em; color:#1D4692 !important;}
#angebote .list h2 small {padding-top:3px; font-size:.75em; line-height:1.5em;}


.preise {margin-bottom:1em;}
.preise tr:last-child td {border:0;}

.wohnen .wohnpreise {background:#e9e8f2; margin-bottom:.75em;}
.wohnen .wohnpreise tr.even td {background:#F5F4FC;}
.wohnen .wohnpreise td {padding:4px 0;}
.wohnen .wohnpreise td.kategorie {padding-left:10px;}
.wohnen .wohnpreise td.preis {padding-right:10px;}
.wohnen .wohnpreise	 tr {border-bottom:1px solid #fff;}
.wohnen .small {margin-bottom:2em;}

.wohnen .button {font-weight:bold; background:#39abe1; color:#fff; padding:7px 12px; -webkit-border-radius:3px; -webkit-box-shadow:1px 1px 2px #bbb;}
.wohnen .button:hover {background:#d7eef9; color:#39abe1; text-decoration:none;}

.prospekte-bestellen td {padding:0 0 8px 15px;}
.prospekte-bestellen {margin-top:15px;}

.preisliste {background:#e9e8f2; margin-bottom:2.5em;}
.preisliste td {padding:7px 5px;}

.preisliste table {margin-bottom:0;}
.preisliste table td {padding:0; border:0;}

.dates {float:right; width:140px; margin:0 0 20px 20px; padding:15px; background:#EFF5F7;}
#main .dates h2 {font-weight:bold;}

.nlnav, .tabnav {list-style:none; margin:0; padding:0;}
.nlnav li {float:left; line-height:1em;}
.tabnav li {float:left; padding:0 10px; border-right:1px solid #888; line-height:1em;}
.tabnav li.first, .tabnav li.last {border:0;}
.tabnav li.first {padding:0;}
.tabcontent {clear:both; padding-top:1.5em;}

ul.nl {list-style:none; margin:0 0 2.5em; padding:0; line-height:1.4em; overflow:auto;}
ul.nl li {padding:3px 10px; border-bottom:1px dashed #ccc;}
ul.nl .date {font-size:.9em;}


.kalender {background:#F5F4FC;}
.kalender tr.even td {background:#f0eff9;}
.kalender td {padding:10px 5px; border-bottom:1px solid #fff;}
.kalender p {margin-bottom:.7em;}
.kalender h4 {font-size:1.1em; line-height:1.4em; margin-bottom:.1em;}

.fancy {font-style:italic; color:#937b30;}

.veranstaltungen td {margin-bottom:5px; border-bottom:10px solid #fff; background:}
.veranstaltungen td {padding:4px 0;}
.veranstaltungen .date {padding:7px; background:#eae6f0; border-right:10px solid #fff;}
.veranstaltungen h3 {margin-bottom:0; font-size:1.1em;}
.veranstaltungen h4 {font-weight:normal; font-style:italic; font-size:1em; margin-bottom:.15em;}
.veranstaltungen h3 {color:#832375;}
.veranstaltungen a:link {text-decoration:underline; color:#832375;}

/* Forms new */
.form {width:500px;}

.form fieldset.personal-data {width:500px;}
.form fieldset.personal-data label {float:left; clear:left; width:80px; height:25px; margin:0 10px 8px 0; line-height:25px; font-weight:bold; font-size:.95em; color:#555;}
.form fieldset.personal-data input, .form fieldset.personal-data select {float:left; width:196px; height:17px; border:1px solid #eee; border-top:1px solid #ccc;  padding:3px; margin-bottom:7px; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:12px;}
.form fieldset.personal-data select {width:205px; padding:0; height:23px;}
.form fieldset.personal-data .radio {height:auto; width:auto; float:none;}
.form fieldset.personal-data label.error {position:absolute; left:300px; margin-left:10px; text-align:left; color:#C03; width:400px; float:none; height:auto; line-height:auto;}
.form fieldset.personal-data p {position:relative; margin-bottom:0px; clear:left;}
.form textarea {width:450px; height:100px; border:1px solid #ccc; padding:3px; margin-bottom:7px; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:12px;}

.buchungsformular {font-size:12px; width:695px;}
.form-row {clear:both; margin-bottom:10px; padding:7px 10px; overflow:auto; width:675px;}
.form-col {width:320px; padding-bottom:10px;}
.form-col-100 {width:645px; padding-bottom:10px;}
.buchungsformular .form-col-100 input {width:545px;}
.form-row .last {padding-bottom:0;}
.buchungsformular label {float:left; width:90px; color:#444; font-weight:bold; line-height:23px;}
.buchungsformular .comments label {width:300px;}
.buchungsformular .comments textarea {width:640px;}
.buchungsformular label.error {display:none !important;}
.buchungsformular input {width:190px; height:17px; border:1px solid #eee; border-top:1px solid #ccc; padding:3px; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
.buchungsformular input.error {background:#f7e7e7; border:1px solid #e36060;}
.buchungsformular select {width:196px;}
.referrer label {width:300px; font-weight:normal;}
textarea.anmerkung {width:550px; height:100px; margin-bottom:10px; border:1px solid #eee; border-top:1px solid #ccc; padding:3px; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:1.5em;}
.buchungsformular input.newsletter {float:left; width:auto; height:auto; margin-right:20px; border:none; border-top:0;}

.buchungsformular .submit {padding:5px 10px; width:auto; height:auto; color:#fff; background:#653d60; font-weight:bold; border:1px solid #eee; overflow:auto; margin-bottom:2em; cursor:pointer}
.buchungsformular .submit:hover {background:#832375;}







/* Date Picker */

a.dp-choose-date {
	float: left;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 5px 3px 0;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(/img/website/calendar.png) no-repeat; 
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
	width: 170px;
	float: left;
}

table.jCalendar {
	border: 1px solid #158DB6;
	background: #b8bebd;
    border-collapse: separate;
    border-spacing: 1px;
}
table.jCalendar th {
	background: #158DB6;
	color: #fff;
	font-weight: bold;
	padding: 3px 5px;
}

table.jCalendar td {
	background:#DDF1EF;
	color: #000;
	padding: 3px 5px;
	text-align: center;
}
table.jCalendar td.other-month {
	background: #b0d0db;
	color: #fff;
}
table.jCalendar td.today {
	background: #666;
	color: #fff;
}
table.jCalendar td.selected {
	background: #f66;
	color: #fff;
}
table.jCalendar td.selected.dp-hover {
	background: #f33;
	color: #fff;
}
table.jCalendar td.dp-hover,
table.jCalendar tr.activeWeekHover td {
	background: #fff;
	color: #000;
}
table.jCalendar tr.selectedWeek td {
	background: #f66;
	color: #fff;
}
table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
	background: #9abdc9;
	color: #fff;
}
table.jCalendar td.unselectable,
table.jCalendar td.unselectable:hover,
table.jCalendar td.unselectable.dp-hover {
	background: #bbb;
	color: #888;
}

/* For the popup */

/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */

div.dp-popup {
	position: relative;
	background: #DDF1EF;
	font-size: 10px;
	font-family: arial, sans-serif;
	padding: 2px;
	width: 171px;
	line-height: 1.2em;
}
div#dp-popup {
	position: absolute;
	z-index: 199;
}
div.dp-popup h2 {
	font-size: 12px;
	text-align: center;
	margin: 2px 0;
	padding: 0;
}
a#dp-close {
	font-size: 11px;
	padding: 4px 0;
	text-align: center;
	display: block;
}
a#dp-close:hover {
	text-decoration: underline;
}
div.dp-popup a {
	color: #000;
	text-decoration: none;
	padding: 3px 2px 0;
}
div.dp-popup div.dp-nav-prev {
	position: absolute;
	top: 2px;
	left: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-prev a {
	float: left;
}
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
	cursor: pointer;
}
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
	cursor: default;
}
div.dp-popup div.dp-nav-next {
	position: absolute;
	top: 2px;
	right: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-next a {
	float: right;
}
div.dp-popup a.disabled {
	cursor: default;
	color: #aaa;
}
div.dp-popup td {
	cursor: pointer;
}
div.dp-popup td.disabled {
	cursor: default;
}






/* CSS for jQuery Orbit Plugin 1.2.3
 * www.ZURB.com/playground
 * Copyright 2010, ZURB
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 
 
 
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
   ================================================== */
#slider { 
	width: 950px;
	height: 340px;
	background: #fff url('/img/orbit/loading.gif') no-repeat center center;
	overflow: hidden;}
#slider>img,  
#slider>div,
#slider>a { display: none; }




/* CONTAINER
   ================================================== */

div.orbit-wrapper {
    width: 1px;
    height: 1px;
    position: relative;}

div.orbit {
    width: 1px;
    height: 1px;
    position: relative;
    overflow: hidden }

div.orbit>img {
    position: absolute;
    top: 0;
    left: 0;
    display: none; }

div.orbit>a {
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 0; 
    display: none; }

.orbit>div {
    position: absolute;
    top: 0;
    left: 0;
    width: 950px;
    height: 350px; }

/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */


/* TIMER
   ================================================== */

div.timer {
	display:none;
    width: 40px;
    height: 40px;
    overflow: hidden;
    position: absolute;
    top: 10px;
    right: 10px;
    opacity: .6;
    cursor: pointer;
    z-index: 1001; }

span.rotator {
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    left: -20px;
    background: url(/img/orbit/rotator-black.png) no-repeat;
    z-index: 3; }

span.mask {
    display: block;
    width: 20px;
    height: 40px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    overflow: hidden; }

span.rotator.move {
    left: 0 }

span.mask.move {
    width: 40px;
    left: 0;
    background: url(/img/orbit/timer-black.png) repeat 0 0; }

span.pause {
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    left: 0;
    background: url(/img/orbit/pause-black.png) no-repeat;
    z-index: 4;
    opacity: 0; }

span.pause.active {
    background: url(/img/orbit/pause-black.png) no-repeat 0 -40px }

div.timer:hover span.pause,
span.pause.active {
    opacity: 1 }


/* CAPTIONS
   ================================================== */




/* DIRECTIONAL NAV
   ================================================== */

div.slider-nav {
    display: block }

div.slider-nav span {
    width: 78px;
    height: 100px;
    text-indent: -9999px;
    position: absolute;
    z-index: 1000;
    top: 50%;
    margin-top: -50px;
    cursor: pointer; }

div.slider-nav span.right {
    background: url(/img/orbit/right-arrow.png);
    right: 0; }

div.slider-nav span.left {
    background: url(/img/orbit/left-arrow.png);
    left: 0; }

/* BULLET NAV
   ================================================== */

.orbit-bullets {
    position: absolute;
    z-index: 1000;
    list-style: none;
    bottom: -40px;
    left: 50%;
	margin-left: -50px;
    padding: 0; }

.orbit-bullets li {
    float: left;
    margin-left: 5px;
    cursor: pointer;
    color: #999;
    text-indent: -9999px;
    background: url(/img/orbit/bullets.jpg) no-repeat 4px 0;
    width: 13px;
    height: 12px;
    overflow: hidden; }

.orbit-bullets li.active {
    color: #222;
    background-position: -8px 0; }
    
.orbit-bullets li.has-thumb {
    background: none;
    width: 100px;
    height: 75px; }

.orbit-bullets li.active.has-thumb {
    background-position: 0 0;
    border-top: 2px solid #000; }
