html, body {
	background: #f9f9f9;
	height: 100%;
}

h1, h2, h3, h4, h5, h6 {
	margin-top: 25px;
	margin-bottom: 25px;
	margin-left: 1%;	
}

p {
	margin-left: 1%;	
	margin-right: 1%;		
}

pre {
	margin-left: 1%;
	margin-top: 1%;		
}

.content-text ul li {
	margin-left: 50px;
	list-style-type: square;
	line-height: 1.5em;
	color: #745A5C;
}

/***** LINKS *****/

a {
	color: #745A5D;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}


/***** IDīS *****/

#page {
	background-image: url("../images/wohlfuehl-bg.jpg");	
	background-size: cover;
	background-attachment: fixed;
}

header {
	margin: 25px 0px;
	margin-top: 0px;
	padding-top: 25px;
	width: 100%;
}

#page {
	/*
	height: auto !important; This line and the next line are not necessary unless you need IE6 support 
	min-height: 100%;
	height: 100%;
	margin: 0 auto -25px; *//* the bottom margin is the negative value of the footer's height */
}

#logo {
	text-align: center;
	padding: 0px 25px;
}

#logo img {
	max-width: 362px;
}

#nav_container {
	padding-top: 25px;
	height: 40px;
	margin-bottom: 95px;
}

nav#navigation {
/*
	margin: 0 auto;
	height: 40px;
	padding-top: 10px;
*/
}

a#pull {
	display: none;
}

section#teaser {
	padding-top: 50px;
	background: #eee;
	background-size: cover;
	height: 388px; /*398px - 50px*/
	overflow: hidden;
	color: #fff;
	margin-top: -65px; /* Ausgleich margin-bottom nach der Navigation */
	text-shadow: 0 0 10px rgba(0, 0, 0, 1.0), 0 0 20px rgba(0, 0, 0, 1.0), 0 0 30px rgba(0, 0, 0, 0.4), 0 0 40px rgba(0, 0, 0, 0.1);
}

.startpage section#teaser {
	height: 428px;
	background-image: url("../images/panorama-startpage2.jpg");		
}

.aboutpage section#teaser {
	background-image: url("../images/panorama-about.jpg");		
}

.teampage section#teaser {
	background-image: url("../images/panorama-team.jpg");		
}

.treatmentsspage section#teaser {
	background-image: url("../images/panorama-treatments.jpg");
}

.productspage section#teaser {
	background-image: url("../images/panorama-products.jpg");		
}

.pricespage section#teaser {
	background-image: url("../images/panorama-prices.jpg");		
}

.contactpage section#teaser {
	background-image: url("../images/panorama-contact.jpg");		
}

#teaser div {
	margin-top: 2%;
}

.subnavpage #subnav {
	width: 25%;
}

.subnavpage .mod_article {
	width: 75%;
	float: right;
	padding-left: 40px;
}

#content {
	margin-top: 10px;
	margin-bottom: 0px;
	padding-bottom: 50px;
	position: relative;
	overflow: hidden;
	padding-left: 1%;
	padding-right: 1%;
}

#brands {
	text-align: center;
	margin: auto;
}

#brands img {
	margin: 0px 10px 10px 10px;
}

footer {
	color: #fff;
	width: 100%;
	padding: 10px 0px;
	background: #745A5C;
	/*position: relative;
	bottom: 0;*/
	float: left;

}

/***** Classes *****/

.centered {
	max-width: 1200px;
	margin: auto;
}

.fleft, .float_left {
	float:left;
}

.fright, .float_right {
	float:right;
}

.fclear {
	clear:both;
}

.push {
	/*height: 25px;*/
}

.row {
	max-width: 100%;
}

.box {
	margin-left: 1%;
	margin-right: 1%;
	width: 31.333%;
	float: left;
	padding: 0 0px 25px;
    opacity: 1;
    overflow: hidden;
    position: relative;
    transition: all 0.5s ease-out 0s;	
}

.box.extra {
	width: 64.666%;
}

.box.infobox .caption-overlay {
	top: 5%;
    text-transform: none; 	
}

.box.coupon .caption-overlay {
	top: 0%;
    text-transform: none; 	
    text-align: left;

}

.resp-img, .box img, .ce_masonry_gallery img {
    height: auto;
    vertical-align: bottom;
    width: 100%;    
    font-weight: normal;
}

.teaser-grid {
    box-sizing: content-box !important;
    display: block;
    margin-bottom: 0.625rem;
    overflow: hidden;
    position: relative;
}

.box .caption-overlay {
    padding: 5px 10px 10px;
    /*background-color: rgba(0, 0, 0, 0.5);*/
    bottom: 0;
    color: #fff;
    left: 0;
    top: 0%;
    position: absolute;
    right: 0;
    text-align: center;
    text-transform: none; 
    margin: auto;
    width: 80%;
}

.extra .caption-overlay {
	top: 15%;
}

.box .caption-overlay h3 {
	margin-bottom: 10px;
    text-transform: uppercase; 	
}

.ce_masonry_gallery {
	margin-bottom: -25px;
}
.ce_masonry_gallery div div {
	float: left;
	margin-left: 1%;
	margin-right: 1%;	
	padding: 0 0 25px;
	width: 31.333%;
}

.ce_accordion {
	margin-left: 1%;
}

.ce_accordion .ui-accordion-header {
	text-decoration: underline;
}

/***** Navigation *****/
ul#header_menu {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	background: transparent;
	text-align: center;
}

ul#header_menu li {
	display: inline;
	padding-top: 10px;
	padding-bottom: 15px;
}

ul#header_menu li a {	
	line-height: 40px;
	color: #000;
	text-decoration: none;
	margin: 0;
	padding: 0 30px;
}

ul#header_menu li a.active {
	color: #745A5C;
	text-decoration: underline;
}

ul#header_menu li.trail a.trail {
	color: #745a5c;
	text-decoration: underline;  
}
	
ul#header_menu .current a, ul#header_menu li:hover > a  {
	color: #745a5c;
		
}

ul#header_menu  ul {
	display: none;
}

ul#header_menu  ul li {
	/*padding-top: 10px;
	padding-bottom: 10px;*/
}

ul#header_menu li:hover > ul {
	display: block;
	z-index: 1;
}

ul#header_menu li.trail ul, ul#header_menu li.active ul {
	display: block;
}

ul#header_menu li > ul {
	position: absolute;
	text-align: center;
	margin: 0px 0 0 0;
	margin: 0 auto;
	width: 100%;
	height: 50px;
	/*background: #97C7DB;  */
	background: #745A5C;
}

ul#header_menu li > ul li a { 
	line-height: 50px;
	color: #fff !important;
	text-decoration: none;
	margin: 0;
	padding: 0 30px 0 0;
	background: transparent;
	transition: all 0.19s ease 0s;
}

ul#header_menu li:hover > ul li a:hover {
	text-decoration: underline;	
}

ul#header_menu li > ul li.active a {
	text-decoration: underline;	
}

.subnavpage #subnav ul#header_menu {
	text-align: left;
	margin-top: 25px;
}

.subnavpage #subnav ul#header_menu li {
	display: block;
	padding: 0px;
}

.level_2 {
	transition: opacity 0.3s ease 0s, visibility 0s ease 0.3s !important;
	box-shadow: 0 1000px 0 1000px rgba(0, 0, 0, 0.20);
	box-shadow: none;
}

.trail .level_2, .active .level_2 {
	box-shadow: 0 1000px 0 1000px rgba(0, 0, 0, 0.0);	
}

ul .level_3 {
	display: none !important;
}

#content .content-text .image_container {
	padding-left: 10px;	
}

footer a {
	margin-left: 20px;
}

/***** Preislisten *****/

.pricelist ul li {
	margin-bottom: 15px;
}

.pricelist ul li li {
	list-style-type: none;
}

/***** Teamseite *****/

.teamsite div.block {
	clear: both;
	margin-bottom: 15px;
}

.teamsite h1, .teamsite h2 {
	margin-bottom: 10px;
}

.teamsite figure.image_container {
	float: left;
	padding-right: 20px;
	padding-bottom: 20px;	
}

.teamsite p {

}

/***** Table *****/

#content table {
	margin-left: 1%;
}

#content table thead tr {
	text-align: left;
	height: 30px;
}

#content table tbody {}

#content table tbody tr {
	height: 30px;	
}

#content table tbody tr td {
	width: 25%;
}

#content table tbody tr td.col_0 {
	width: 15%;
}

#content .price-table table thead tr th.head_1, #content .price-table table thead tr th.head_2, #content .price-table table tbody tr td.col_1, #content .price-table table tbody tr td.col_2 {
	text-align: center;
}

/***** Links *****/

nav#navigation a {
	color: #000;	
	text-decoration: none;
	transition: all 0.19s ease 0s;
}

nav#navigation a:hover {
	color: #97C7DB;
	text-decoration: underline;
}

nav#navigation ul.sub-menu a {
	color: #fff;
	text-decoration: none;
}

nav#navigation ul.sub-menu a:hover {
	color: #fff;
	text-decoration: underline;
}

footer a {
	color: #fff;
	text-decoration: none;
}

footer a:hover {
	color: #fff;
	text-decoration: underline;
}

/* Media Queries */

/* 4 Laptops */
@media only screen and (max-width: 90.063em) {
	
	#teaser div {
		padding-left: 1%;
		padding-right: 1%;
	}
	
	.centered {
		max-width: 1000px;
	}
	
	.box {
	    padding: 0 0 20px;
    }	
	
	.box.infobox .caption-overlay {
		top: 0%;	
		padding-top: 0px;
	}
	
	
}

/* 4 Smartphones */ 
/*@media only screen and (max-width: 40.063em) {*/
@media only screen and (max-width: 41.688em) {
	
	#content {
		padding-left: 20px;
		padding-right: 20px;
	}
	
	#header_menu {
		display: none;
	}
	
	#nav_container {
		height: 100%;
		margin: 0px;
		padding: 0px;
	}
	
	ul#header_menu li { 
		line-height: 3.5em;
	}
	
	ul#header_menu li { 
		padding-top: 0px;
		padding-bottom: 0px;
	}
	
	ul#header_menu li > ul {
		height: 100%;	
		position: relative;
	}
	
	#nav_container #navigation ul li {
		width: 100% !important;
		display: block;
		/*background: #9b8586;*/
		background: #494B4C;
		border-top: 1px solid #fff;
		border-bottom: 0px solid #fff; 
	}
	
	#nav_container #navigation ul li.last {
		border-bottom: 1px solid #fff; 	
	}
	
	#nav_container #navigation ul li:hover, #nav_container #navigation ul li:hover li {
		background: #414242;
	}

	ul#header_menu li a {
		display: block;
		line-height: 4em;
	}
	
	ul#header_menu li.trail a, ul#header_menu .current a, ul#header_menu li:hover > a  {
		color: #fff;
	}
		
	#nav_container #navigation ul li:hover, #nav_container #navigation ul li li:hover {
		background: #757575;
	}	

	#nav_container #navigation ul li.trail {
		/*background: #745A5C;*/
		background: #414242;
	}	

	ul#header_menu li a, ul#header_menu li a:hover, ul#header_menu li a.active, ul#header_menu li.trail a {
		color: #fff;	
	}

	#nav_container #navigation ul li ul {
		display: none;
	}
	
	ul#header_menu li:hover > ul {
		display: block !important;
	}

	ul#header_menu li {
		/*padding: 5px 0px;*/
	}
	
	ul#header_menu li > ul {
		position: relative;	
		background: transparent;
		margin: 0px;
	}

	ul#header_menu li > ul li a { 
		background: transparent;
		margin: 0px;
		padding: 0px;
	}
	
	ul#header_menu > li > .submenu { 
		background-image: url("../images/downArrow.png");
		background-repeat: no-repeat;
		background-position: 70% 50%;
	}	
	
	ul#header_menu li.trail a.trail {
		color: #fff;
	}	

	.level_2 {
		box-shadow: none;
	}
	
	#nav_container #navigation ul.level_3 li {
		background: #5b5d5e !important;
	}
	
	a#pull {
		content:"";
		height: 40px;
		width: 100%;
		display: block;
		position: relative;
		background: #745A5C;
		color: #fff;
		margin: 0 auto;
		margin-top: 20px;
		margin-bottom: 0px;
		text-align: center;
		padding-top: 12px;
		text-decoration: none;
		background-image: url("../images/downArrow.png");
		background-repeat: no-repeat;
		background-position: 70% 50%;

	}	
	
	section#teaser {
		padding-left: 25px;
		padding-right: 25px;
		height: 100%;
	}
	
	section#teaser h1, section#teaser p {	
		width: 100%;
		margin-right: 1%;
	}
	
	.box, .box.extra, .ce_masonry_gallery div div {
		width: 98%;
		/*padding-left: 20px;
		padding-right: 20px;*/
	}
	
	#content .content-text .image_container {
		/*width: 100%;*/
		text-align: center;
		padding-left: 0px;
	}
	
	#content .content-text pre {
		display: inline-block;
		padding-top: 20px;
	}
	
	#content .header_gallery div div:first-child, #content .header_gallery div div:last-child {
		display: none;
	}
	
	.subnavpage #subnav {
		display: none;
	}
	
	.subnavpage .mod_article {
		width: 100%;
		padding-left: 0px;
	}	
	
	footer {
		height: 25px;
		padding: 0px;
		background: none;
	}
	
	footer .footerinfo {
		bottom: -30px;
		left: 0px;
		position: relative;
		background: #745A5C;
		display: block;
		width: 100%;
		line-height: 2em;
		text-align: center;
		border: 1px solid #fff;
		display:none;
	}
	
	footer .footerlinks {
		float: left;
		width: 100%;
		position: relative;
		bottom: 0px;
	}
	
	footer a {
		margin: 0;
		display: block;
		width: 50%;
		background: #745A5C;
		float: left;
		text-align: center;
		line-height: 2.5em;
		border: 1px solid #fff;
	}	
	
	
}