body {
	text-align: center;
	font-family: Arial, sans-serif;
	color: #000;
	margin: 0em;
	padding: 0em;
	font-size: 17px;
}

h1 {
	font-size: 1.5em;
	line-height: 1.2em;
	font-weight: bold;
	color: rgb(11, 109, 188);
	margin: 0em;
	margin-bottom: 1.25em;
}

h2, h5 {
	font-size: 1.3em;
	line-height: 1.3em;
	font-weight: normal;
	color: #E75908;
	margin: 0em;
	padding: 1.25em;
	text-align: left;
}

h2 {
	color: rgb(11, 109, 188);
}

h5 {
	font-size: 1.2em;
	line-height: 1.2em;
	color: #E75908;
	padding: 1.2em 0 0.8em 0;
}

cite {
	background: rgb(255, 228, 204);
	padding: 0.6em 0.8em;
	margin: 0.5em 0;
	border-radius: 0.5em;
	line-height: 1.6em;
	display: block;
}

h2 a {
	text-decoration: none !important;
	cursor: default;
	font-weight: normal;
}

h3 {
	color: rgb(11, 109, 188);
	font-weight: bold;
}

h4 {
	color: #333;
	margin-bottom: 0;
	margin-top: 0;
}

.no-top-padding {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

p {
	line-height: 1.35em;
	font-weight: normal;
	color: #2F2C2C;
	margin: 0em;
	padding: 1.25em;
	text-align: left;
}

a {
	color: rgb(11, 109, 188);
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
	cursor: pointer;
}

span.closed, span.opened {
	background: rgb(11, 109, 188);
	color: white;
	padding: 0px 5px;
	text-decoration: none;
	cursor: pointer;
}

span.opened {
	background: #888;
}

ul {
	margin: 0px;
	padding: 0px;
}

li {
	list-style: square;
	font-family: Arial;
	font-weight: normal;
	color: #2F2C2C;
	line-height: 1.25em;
	margin: 0.313em 0em 0.313em 0em;
	padding: 0em;
	margin: 0.313em 0em 0.353em 1em;
}

img {
	border: none;
}

article img {
	/*width: 90%; Breite des Elternelements*/
	height: auto;
	max-width: 100%; /* niemals verpixelt */
	float: left;
}

article ul {
	margin-bottom: 2.8em;
}

article ul ul {
	margin-bottom: 1.8em;
}

article div.no-intend {
	margin-left: 0;
}

article.large-image>* {
	margin-left: 322px;
}

#main article.large-image img {
	max-width: 300px;
}

article.small-image>* {
	margin-left: 280px;
}

article.small-image ul,  article.small-image h3 {
	margin-left: 308px;
}

article.small-image ul ul {
	margin-left: 0;
}

article.small-image h1, article.large-image h1 {
	margin-left: 0;
}
/* on top bar */
img#slogan {
	margin-top: 2em;
}

img#menu {
	display: none;
}

nav.nav {
	clear: both;
    display: none;
}

nav.nav.visible {
    display: block;
}

nav a {
	text-decoration: none;
}

#menubar {
	text-align: right;
	max-width: 1089px;
	margin: 1em auto;
	min-height: 83px;
}

#menubar a {
	float: left;
}

/* header */
header {
	display: block;
	background: #2F2C2C;
	text-align: center;
}
/* nav */
nav {
	display: block;
	height: 2.5em;
	background: #EAF3FB;
	text-align: left;
	margin-bottom: 3em;
	margin-top: 0.6em;
}

nav ul {
	display: block;
	margin-top: 1.2em;
	width: 96%;
	max-width: 1089px;
	margin-left: 27.4em;
	margin: 0 auto;
	padding: 0em;
}

nav ul li {
	display: inline;
	margin: -0.1em;
}

nav ul li a {
	color: #454040;
	font-size: 1.125em;
	line-height: 2.5em;
	padding: 0.563em 0.8em 0.563em 0.8em;
}

ul li a.active {
	background: rgb(29, 99, 170);
	color: white !important;
	text-decoration: none;
}

nav ul li a:hover {
	background: rgb(29, 99, 170);
	color: white !important;
}

/* content */
.mainarea {
	background: #FFF;
}

#main {
	display: block;
	width: 96%;
	max-width: 1150px;
	margin: 0 auto;
	padding: 0em;
}

#main article {
	display: inline-block;
	width: 69.4%;
	background: #FFF; /*rgb(217,233,249);*/
	vertical-align: top;
	margin: 0em;
	padding: 0em;
	text-align: left;
}

#main article .bluebg {
	padding: 0.5em 1.5em;
}

#main article img {
	max-width: 275px;
	margin: 0.3em 1.2em 2.2em 0;
}

#main article strong, #main article p.strong {
	font-weight: bold;
}

#abnehmgruppe-detail, #entspannungsgruppe-detail {
	display: none;
}

#main aside {
	display: inline-block;
	width: 23%;
	margin-left: 4%;
	padding: 0em;
	vertical-align: top;
}

#main aside section {
	margin-bottom: 1.563em;
	background: #FFF;
}

#main article h2 {
	padding: 0.9em 0;
	font-weight: bold;
}

#main article p strong {
	font-weight: bold;
}

#main article p {
	padding: 0 0 1.8em 0;
}

#main aside section h2 {
	padding: 0.2em 0em;
	color: rgb(11, 109, 188);
	width: 171px;
	border-radius: 3.3px;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 1.15em;
}

.highlight {
	color: #FFF;
	background: rgb(255, 144, 39);
	border-radius: 5px;
}

#main aside section p {
	padding: 0.4em 0.6em;
}

#main aside section strong {
	font-weight: bold;
	color: rgb(11, 109, 188);
}

.bluebg {
	background: #EAF3FB;
	white-space: normal;
	padding: 0.5em 0;
}

#main aside section h3 {
	padding: 0.2em 0.6em 0em 0.6em;
	margin-bottom: 0;
	font-size: 95%;
	font-weight: bold;
	text-align: left;
	color: rgb(11, 109, 188);
	margin-top: 0;
}

#main aside section ul {
	padding: 0em 1.875em 1.25em 2.5em;
}

footer {
	margin-top: 5em;
	border-top: 1px solid #ccc;
	padding-top: 0em;
}

.mobile {
	display: none;
}

.desktop {
	display: block;
}

footer ul {
	display: block;
	width: 100%;
	max-width: 980px;
	text-align: left;
	width: 96%;
	max-width: 1136px;
	margin-left: 27.4em;
	margin: 0 auto;
	padding: 0em;
}

footer ul li {
	display: inline;
	font-size: 0.8em;
	line-height: 2.8em;
	color: #000;
	padding: 0em 0.624em 0em 0.624em;
}

footer ul li a {
	color: rgb(29, 99, 170);
}

footer ul li.fl-right {
	float: right;
}

/* mobile style */

@media screen and (max-width:700px) {
	#main aside, #main article {
		width: 96%;
		display: block;
		margin: 2%;
		font-size: 1.05em;
	}
	#menubar {
		text-align: left;
	}
	img#slogan {
		margin-top: 0;
		margin-left: 6.3em;
	}
}

@media screen and (min-width:550px) {
	nav.nav {
		display: block !important;
		height: auto;
	}
}

@media screen and (max-width:550px) {
	body {
		font-size: 95%;
	}
	#main article p {
		padding: 0 0 1.25em 0;
	}
	p {
		line-height: 1.6em;
	}
	nav ul li {
		margin: 0em 0;
	}
	nav ul li a {
		line-height: 2.1em;
	}
	footer ul li {
		display: block;
		font-size: 1em;
		line-height: 1.5em;
		margin: 0.313em 0em 0.313em 0em;
        margin-top: 4px;
        text-decoration: none;

	}

	.mobile {
		display: block;
	}

	.desktop {
		display: none;
	}
	
	footer ul li.mobile a {
		text-decoration: none;
		font-weight: bold;
		padding: 0.1em;
		margin-left: -0.1em;
	}

	footer ul {
		padding-top: 1.5em;
		margin-left: 0;
		margin-right: 0;
		width: 97%;
		padding-left: 3%;
		background: #f7d4b4;
		padding-bottom: 2em;
	}
	footer ul li.fl-right {
		float: none;
	}
	article img {
		float: none;
	}
	#main aside section h2 {
		padding-top: 1.5em;
	}
	article.large-image>* {
		margin-left: 0;
	}
	article.large-image img {
		width: 58%;
	}
	#main article.large-image img {
		max-width: 95%;
		width: 95%;
	}
	article.small-image>*, article.small-image ul, article.small-image ul ul, article.small-image h3 {
		margin-left: 0;
	}

	#menubar a {
		float: none;
	}
	img#slogan {
		margin-top: 0;
		margin-left: 21.5%;
		width: 50%;
	}
	img#menu {
		display: block;
		float: right;
		margin-top: 0.7em;
		width: 15%;
		max-width: 5em;
	}
	#menubar {
		text-align: left;
		max-width: 100%;
		padding: 0.5em 0;
		background: #EAF3FB;
		margin: 0;
		background: #EAF3FB;
		min-height: auto;
		position: fixed;
		width: 100%;
	}
	#main {
		padding: 8.5em 0 0 0;
	}
	nav {
		display: none;
		height: auto;
		margin-top: 30%;
		position: fixed;
		width: 100%;
		padding: 1.5em 0 1.5em 0.5em;
	}
	nav ul li {
		display: block;
		margin: 0.3em 0em 0.3em 0em;
	}
	#main article img {
		max-width: 100%;
	}
	#main aside section {
		clear: both;
		margin: 0;
	}
	#main article .textbox {
		clear: both;
		margin: 0;
	}
	.bluebg {
		width: 100%;
	}
	img#logo {
		width: 81%;
		max-width: 369px;
		margin-left: 0.5em;
	}
}