/* This CSS resource incorporates links to font software which is the valuable copyrighted property of Monotype and/or its suppliers. You may not attempt to copy, install, redistribute, convert, modify or reverse engineer this font software. Please contact Monotype with any questions regarding Web Fonts: http://www.fontshop.com */
html {
	font-size: 62.5%;
	-webkit-text-size-adjust: 100%;
}

body {
	background: #ebebeb;
	font-family: 'StoneSansITCW01-Medium';
	text-align: left;
	font-size: 25px; 
	font-size: 2.5rem;
	color: #555555;
	line-height: 1.25;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* font styles */
h1 {

}

h2 {
	font-size: 40px; 
	font-size: 4.0rem;
	color: #572558;
	letter-spacing: 0.05em;
}

h3 {
	margin-bottom: 1%;
}
h3.space {
	margin-top: 6%;
	margin-bottom: 4%;
}
body.page-datenschutz h3 {
	border-bottom: 1px solid #555555;
}

body.page-datenschutz h4 {
	margin: 4% 0 4% 0;
	font-size: 30px; 
	font-size: 3.0rem;
}

p {
	margin-bottom: 4%;
}

a {
	color: #572558;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a.tel {
	cursor: default;
}
a.tel:hover {
	text-decoration: none;
}

ul {
	margin-bottom: 4%;
}

#content li {
	position: relative;
	padding-left: 25px;
	margin-bottom: 1%;
}
#content li:before {
	position: absolute;
	left: 0;
	content: '–';
}

/* grid styles */
#site-wrapper {
	max-width: 1117px;
	width: 90%;
	padding: 0% 5%;
	margin: auto;
	background: #ffffff;
}

	#header {
		padding-top: 60px;
	}
		#header #menu-button {
			display: none;
		}
		#header ul {
			margin-bottom: 5px;
		}
		#header ul:after {
			content: '';
			display: block;
			clear: both;
		}
			#header a {
				display: block;
				float: left;
				text-transform: uppercase;
				color: #555555;
				letter-spacing: 0.05em;
				margin-right: 7%;
			}
			#header a.last {
				float: right;
				margin-right: 0;
			}
			#header a:hover,
			#header li.current a {
				color: #572558;
				text-decoration: none;
			}
			#header img {
				display: block;
				width: 100%;
				height: auto;
			}
			#header #image-container {
				position: relative;
			}
			#header #image-container h1 {
				position: absolute;
				left: 5%;
				top: 11%;
				right: 4%;
				max-width: 640px;
				font-size: 45px;
				font-size: 4.5rem;
				line-height: 1.1;
				color: #4a4a4a;
			}
			body.page-tanja-schmoll #header #image-container h1 {
				position: absolute;
				top: auto;
				bottom: 25%;
				max-width: 380px;
				color: #ffffff;
			}
				body.page-tanja-schmoll #header #image-container h1 span {
					display: block;
					font-size: 22px;
					font-size: 2.2rem;
					margin-top: 3%;
				}
			body.page-impressum #header #image-container h1 {
				position: absolute;
				left: 35%;
				max-width: 630px;
			}
				body.page-impressum #header #image-container h1 span {
					display: inline-block;
					font-size: 22px;
					font-size: 2.2rem;
				}
	#content {
		margin-top: 4%;
	}
	#content:after {
		content: '';
		display: block;
		clear: both;
	}
		#content .left {
			float: left;
			width: 27%;
		}
			#content .left img {
				width: 100%;
				height: auto;
				display: block;
			}
			body.page-tanja-schmoll #content .left {
				height: 434px;
				position: relative;
			}
				body.page-tanja-schmoll #content .left img#ddqt {
					position: absolute;
					bottom: 0;
					left: 0;
					width: 180px;
					height: auto;
				}
		#content .right {
			float: right;
			width: 69%;
			padding-top: 15px;
		}
		body.page-home #content .right {
			padding-top: 0;
		}

	.accordion-list {
		position: relative;
		background: #eeeeee;
		padding: 4% 3%;
	}
		.accordion-list ul {
			border-top: 1px solid #555555;
			position: relative;
			margin: 0;
		}
			.accordion-list ul li {
				border-bottom: 1px solid #555555;
				padding: 1.2% 0% 1.3% 0%;
				cursor: pointer;
			}
			.accordion-list ul li::before {
				background-image: url(../img/plus-icon.svg);
				background-repeat: no-repeat;
				background-position: right top;
				background-size: contain;
				position: absolute;
				right: 0;
				width: 29px;
				height: 29px;
				content: '';
			}
			/*.accordion-list ul li:hover {
				color: #572558;
				border-bottom: 1px solid #006682;
			}
			.accordion-list ul li:hover::before {
				
			}*/
			.accordion-list ul li.active {
				color: #555555;
				border-bottom: 1px solid #555555;
			}
			.accordion-list ul li.active::before {
				background-image: url(../img/minus-icon.svg);
			}
				.accordion-list ul li ul {
					display: none;
					margin: 0;
					border: none;
				}
					.accordion-list ul li ul li {
						border: none !important;
						padding: 0;
						padding-top: 1%;
						cursor: default;
					}
					.accordion-list ul li ul li::before {
						background-image: none !important;
					}
						.accordion-list ul.list-in-accordion li {
							display: list-item;
							position: relative;
							padding-left: 25px;
						}
						.accordion-list ul.list-in-accordion li:before {
							content: '–';
							position: absolute;
							left: 0;
						}
	#footer {
		background: #572558;
		color: #ffffff;
		letter-spacing: 0.05em;
		padding: 5.5% 5% 2% 5%;
		margin-top: 0.5%;
	}
	body.page-qigong #footer {
		margin-top: 0;
	}
	#footer:after {
		content: '';
		display: block;
		clear: both;
	}
		#footer a {
			color: #ffffff;
		}
		#footer .left {
			float: left;
			width: 27%;
		}
		#footer .right {
			float: right;
			width: 100%;
		}
			#footer .right .left {
				width: 35%;
			}
			#footer .right .right {
				width: 65%;
				text-align: right;
				text-transform: uppercase;
			}
				#footer .right .right a {
					display: inline-block;
					margin-left: 20px;
				}
	#mail {
		text-align: right;
		letter-spacing: 0.05em;
		padding: 0.5% 0 4% 0;
	}
		#mail a {
			color: #555555;
		}
		#mail a:hover {
			color: #572558;
			text-decoration: none;
		}

@media screen and (max-width: 1240px) {
	body.page-tanja-schmoll #content .left {
		height: auto;
		position: relative;
	}
		body.page-tanja-schmoll #content .left img#ddqt {
			position: relative;
			bottom: auto;
			left: auto;
			width: 150px;
			height: auto;
			margin-top: 30px;
		}
}

@media screen and (max-width: 1023px) {
	body {
		font-size: 22px; 
		font-size: 2.2rem;
	}
		#header #image-container h1,
		body.page-tanja-schmoll #header #image-container h1,
		body.page-impressum #header #image-container h1 {
			font-size: inherit;
			position: relative;
			left: 0;
			top: 0;
			right: 0;
			width: 100%;
			box-sizing: border-box;
			padding: 5%;
			text-align: center;
			max-width: 100%;
			background: #572558;
			color: #ffffff;
		}
		body.page-impressum #header #image-container h1 {
			padding-top: 0;
		}
		#header #image-container h1 span {
			font-size: 16px !important;
			font-size: 1.6rem !important;
			margin-top: 2% !important;
			display: block !important;
		}
		h2 {
			font-size: 30px; 
			font-size: 3.0rem;
		}
		#content .right {
			padding-top: 9px;
		}
		.accordion-list {
			padding: 4% 5%;
		}
		#footer {
			padding: 2.2% 5% 2% 5%;
		}
			#footer .left {
				width: 100%;
			}
			#footer .right {
				width: 100%;
			}
				#footer .right .right {
					padding-right: 0;
				}
}

@media screen and (max-width: 860px) {
	#footer {
		padding: 4% 5% 2% 5%;
	}
		#footer .right .left {
			width: 100%;
			text-align: center;
			margin-bottom: 2%;
		}
		#footer .right .right {
			width: 100%;
			text-align: center;
		}
			#footer .right .right a {
				display: block;
				margin-left: 0;
				margin-bottom: 2%;
			}
	#mail {
		text-align: center;
		padding: 4% 0% 4% 0%;
	}
}

@media screen and (max-width: 667px) {
	body {
		font-size: 20px; 
		font-size: 2.0rem;
	}
	body.page-datenschutz h4 {
		font-size: 26px; 
		font-size: 2.6rem;
	}
	#header {
		padding-top: 5%;
	}
	#content .left {
		width: 100%;
		margin-bottom: 4%;
	}
		body.page-tanja-schmoll #content .left img#ddqt {
			width: 180px;
			height: auto;
			margin-top: 20px;
			margin-bottom: 10px;
		}
	#content .right {
		padding-top: 0;
		width: 100%;
	}
	.accordion-list ul li {
		padding: 2.2% 0% 2.5% 0%;
	}
}

@media screen and (max-width: 560px) {
	#header a {
		font-size: 17px;
		font-size: 1.7rem;
	}
}

@media screen and (max-width: 470px) {
	body {
		font-size: 17px; 
		font-size: 1.7rem;
	}
		h2 {
			font-size: 24px; 
			font-size: 2.4rem;
		}
	#header ul {
		display: none;
	}
	#header a {
		display: block;
		float: none;
		margin-right: 0;
		text-align: center;
		border-bottom: 1px solid #555555;
		padding: 5px 0;
	}
	#header a.last {
		display: block;
		float: none;
		margin-right: 0;
		text-align: center;
		border-bottom: 0;
		padding: 5px 0;
	}
	#header #menu-button {
		display: block;
		cursor: pointer;
		float: none;
		text-align: center;
		margin: 0;
		padding: 0 0 10px 0;
		border: 0;
	}
	#content li {
		padding-left: 18px;
	}
	.accordion-list ul li {
		padding: 2.2% 30px 2.5% 0%;
	}
	.accordion-list ul li::before {
		width: 22px;
		height: 22px;
	}
	.accordion-list ul.list-in-accordion li {
		padding-left: 18px;
	}
}

@media screen and (max-width: 345px) {
	#header a {
		font-size: 16px; 
		font-size: 1.6rem;
	}
}