/* @group Clear Stylesheet */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;background-image:none;}body{line-height:1;color:black;background:white;text-align:left;}ol,ul{list-style:none;}table{border-collapse:collapse;border-spacing:0;}caption,th,td{text-align:left;font-weight:normal;}blockquote:before,blockquote:after,q:before,q:after{content:"";}blockquote,q{quotes:"" "";}
/* @end */

html, body {
	height: 100%;
	min-height: 100%;
}

body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	background: #fff;
	color: #000;
	min-width: 400px;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

	@media(max-width: 600px){
		#canvas {
			width: 100%;
			min-width: 402px;
			overflow: hidden;
			margin: 0 auto;
			min-height: 100%;
		}
	}

body.page-template-startseite {
	background: #e0ecfd;
}

a {
	text-decoration: none;
}

b, strong {
	font-weight: bold;
}

i, em {
	font-style: italic;
}

h1, h2, h3, h4, h5 {
	font-weight: bold;
	text-transform: uppercase;
	line-height: 1.2;
}

	h1, h2 {
		font-size: 15px;
	}

	h3, h4, h5 {

	}

.clear {
	clear: both;
}

.content {
	line-height: 1.5;
}

	.content p {
		margin-top: 1em;
	}

.width {
	width: 880px;
	position: relative;
	margin: 0 auto;
}

	@media(max-width: 939px) {
		.width {
			width: 600px;
		}
	}

	@media(max-width: 600px) {
		.width {
			width: 400px;
		}
	}

.small {
	font-size: 80%;
}

.italic {
	font-style: italic;
}

.alignright {
	float: right;
}

.alignleft {
	float: left;
}

.aligncenter {
	display: block;
	margin: 5px auto;
}

#header-wrapper {
	height: 102px;
}

#header {

}

	#logo {
		display: block;
		background: url('../img/sprite.png') no-repeat 0 0;
		width: 52px;
		height: 0;
		padding-top: 32px;
		line-height: 2;
		overflow: hidden;
		display: none;
	}

	.menu-toggle {
		width: 50px;
		height: 50px;
		border: 1px solid transparent;
		background: #000;
		cursor: pointer;
		display: none;
		position: relative;
	}

		.menu-toggle.active {
			display: inline-block;
		}

		.menu-toggle .icon,
		.menu-toggle .icon:before,
		.menu-toggle .icon:after {
			pointer-events: none;
			display: block;
			height: 3px;
			background: #fff;
			width: 30px;
			left: 10px;
			top: 50%;
			position: absolute;

			-moz-transform: translate(0px, -50%);
			-webkit-transform: translate(0px, -50%);
			-o-transform: translate(0px, -50%);
			-ms-transform: translate(0px, -50%);
			transform: translate(0px, -50%);

			-webkit-transition: all 200ms ease-in-out;
			-o-transition: all 200ms ease-in-out;
			transition: all 200ms ease-in-out;
		}

			.menu-toggle .icon:before,
			.menu-toggle .icon:after {
				content: "";
				left: 0;
			}

			.menu-toggle .icon:before {
				margin-top: -8px;
			}

			.menu-toggle .icon:after {
				margin-top: 8px;
			}

		body:not(.menu-hidden) .menu-toggle .icon {
			background-color: transparent;
		}

			body:not(.menu-hidden) .menu-toggle .icon:before {
				margin-top: -3px;

				-moz-transform: rotate(45deg) translate(0px, 0px);
				-webkit-transform: rotate(45deg) translate(0px, 0px);
				-o-transform: rotate(45deg) translate(0px, 0px);
				-ms-transform: rotate(45deg) translate(0px, 0px);
				transform: rotate(45deg) translate(0px, 0px);
			}

			body:not(.menu-hidden) .menu-toggle .icon:after {
				margin-top: -3px;

				-moz-transform: rotate(-45deg) translate(0px, 0px);
				-webkit-transform: rotate(-45deg) translate(0px, 0px);
				-o-transform: rotate(-45deg) translate(0px, 0px);
				-ms-transform: rotate(-45deg) translate(0px, 0px);
				transform: rotate(-45deg) translate(0px, 0px);
			}

	#menu-main {
		opacity: 1;

		-webkit-transition: all 200ms ease-in-out;
		-moz-transition: all 200ms ease-in-out;
		-o-transition: all 200ms ease-in-out;
		-ms-transition: all 200ms ease-in-out;
		transition: all 200ms ease-in-out;
	}

		#menu-main.hidden,
		body.menu-hidden #menu-main {
			opacity: 0;
			pointer-events: none;
		}

		#menu-main .sub-menu {
			list-style-type: decimal;
			padding-left: 20px;
		}

		#menu-main,
		#menu-main .sub-menu {
			counter-reset: item;
		}

		#menu-main li {
			display: block;
		}

		#menu-main li a:before {
			content: counters(item, ".") " ";
			counter-increment: item;
		}

#menu-icon {
	width: 62px;
	height: 50px;
	position: absolute;
	top: -5px;
	right: 0;
	display: none;
	cursor: pointer;
	z-index: 100;
}

	#menu-icon div,
	#menu-icon div:after,
	#menu-icon div:before {
		position: absolute;
		width: 40px;
		height: 6px;
		background: #fff;
		border: 1px solid #000;
		pointer-events: none;
	}

		#menu-icon div {
			left: 10px;
			top: 20px;
		}

		#menu-icon div:after,
		#menu-icon div:before {
			content: "";
			left: -1px;
		}

		#menu-icon div:after {
			bottom: -13px;
		}

		#menu-icon div:before {
			top: -13px;
		}

@media(max-width: 939px) {

	#header-wrapper {
		height: 40px;
	}

	#header .width {
		margin: 0 auto;
		min-height: 50px;
	}

	#menu-main.hidden,
	body.menu-hidden #menu-main {
		opacity: 1;
		pointer-events: all;
	}

	#logo {
		margin-top: 10px;
	}

	#menu-main {
		position: absolute;
		right: -2px;
		top: 38px;
		background: #fff;
		width: 198px;
		border: 2px solid #000;
		z-index: 100;
		overflow: hidden;
	}

		#menu-main .sub-menu {
			padding-left: 0;
			overflow: hidden;
		}

		#menu-main a {
			font-size: 18px;
			display: block;
			padding: 5px 4px;
			color: #000;
		}

			#menu-main li.current-menu-item a,
			#menu-main li.current-page-ancestor a,
			#menu-main li.current-page-ancestor .sub-menu li.current-menu-item a {
				background: #000;
				color: #fff;
			}

				#menu-main .sub-menu li a {
					color: #000;
					background: none;
					padding-left: 20px;
				}

				#menu-main .sub-menu li a:hover {
					background: #000;
					color: #fff;
				}

	.menu-toggle {
		display: none !important;
	}

}

@media(max-width: 600px) {
	#header-wrapper {
		height: auto;
	}

	#menu-main {
		position: relative;
		top: 0;
		right: 0;
		margin-top: 20px;
		width: 402px;
		border-bottom: 0;
		margin-bottom: 2px;

		-webkit-transition: none;
		   -moz-transition: none;
		    -ms-transition: none;
		     -o-transition: none;
		        transition: none;
	}

	#menu-icon {
		display: block;
	}
}

@media(min-width: 940px) {

	#header {
		position: fixed;
		left: 0;
		top: 0;
		z-index: 100;
		width: 100%;
	}

		#header .width {
			height: 102px;
		}

		#header #logo {
			position: absolute;
			right: 0;
			top: 9px;
		}

		#header #menu-main {
			margin-left: 2px;
		}

			#header #menu-main a {
				width: 102px;
				height: 52px;
				display: block;
				float: left;
				font-weight: bold;
				text-transform: uppercase;
				font-size: 11px;
				color: #000;
				margin-left: -2px;
				border: 2px solid #000;
				position: relative;
				padding: 5px;
				line-height: 64px;
				z-index: 9;
				background: #fff;
				box-sizing: border-box;
			}

				#menu-main li a:before {
					position: absolute;
					margin-top: -26px;
				}

				#header #menu-main a:hover,
				#header #menu-main .current-menu-item > a,
				#header #menu-main .current-page-ancestor > a {
					background: #000;
					color: #fff;
				}

				#header #menu-main li:hover:before,
				#header #menu-main .current-menu-item:before,
				#header #menu-main .current-page-ancestor:before {
					color: #fff;
				}

				#header #menu-main li:before {
					position: absolute;
					top: 7px;
					left: 9px;
					z-index: 10;
				}

			#header #menu-main .sub-menu {
				position: absolute;
				left: 0;
				bottom: 0;
				padding-left: 2px;
				display: none;
			}

				#header #menu-main .current-menu-item .sub-menu,
				#header #menu-main .current-page-ancestor .sub-menu {
					display: block;
				}

				#header #menu-main .sub-menu li {
					display: inline;
				}

				#header #menu-main .sub-menu .current-menu-item > a,
				#header #menu-main .sub-menu .current-page-ancestor > a {
					background: #666;
				}

}

.main {
	width: 398px;
	margin-top: -2px;
	border: 2px solid #000;
	position: relative;
	background: #fff;
}

	@media(max-width: 939px){
		.main {
			margin-left: 0px !important;
		}
	}

	.main a {
		color: #000;
		text-decoration: underline;
	}

		.main a:hover {
			text-decoration: none;
		}

	#main-1 {
		position: absolute;
		top: 2px;
	}

		@media(max-width: 939px) {
			#main-1 {
				position: static;
			}
		}

	.main-wrapper {
		position: relative;

		-webkit-transition: opacity 200ms ease-in-out;
		-o-transition: opacity 200ms ease-in-out;
		transition: opacity 200ms ease-in-out;
	}

		body.menu-hidden .main-wrapper {
			opacity: 0;
			pointer-events: -webkit-transition: all 200ms ease-in-out;
			-o-transition: all 200ms ease-in-out;
			transition: all 200ms ease-in-out;;
		}

	#main-wrapper-button {
		position: absolute;
		top: -52px;
		height: 32px;
		width: 98px;
		padding-top: 16px;
		background: #fff;
		border: 2px solid #000;
		left: 50%;
		margin-left: -90px;
		text-transform: uppercase;
		text-align: center;
		font-weight: bold;
		cursor: pointer;
	}

	.content-block {

	}

		.content-block.border {
			border-top: 2px solid #000;
			border-bottom: 2px solid #000;
			margin-top: -2px;
			margin-bottom: -2px;
		}

		.content-block.black-bg {
			color: #fff;
			background: #000;
		}

			.content-block.black-bg a {
				color: #fff;
			}

		.content-block .content {
			padding: 12px;
		}

		.content-block.image img,
		.content-block.kursplan img {
			display: block;
		}

			.content-block.image.right img {
				margin: 0 0 0 auto;
			}

			.content-block.image.left img {
				margin: 0 auto 0 0;
			}

		.content-block.hr {
			line-height: 0;
			background: #000;
			overflow: hidden;
			padding: 0;
			margin: -2px 0 0 0;
		}

			.content-block.hr .big {
				height: 20px;
			}

			.content-block.hr .small {
				height: 2px;
			}

			.content-block.hr hr {
				display: none;
			}

	.content-block.form {

	}

		.content-block.form .form-error,
		.content-block.form .form-success {
			padding: 10px;
			margin: 20px 0;
		}

		.content-block.form .form-error {
			border: 2px solid #f00;
		}

		.content-block.form .form-success {
			border: 2px solid #0f0;
		}

		.content-block.form .form-error > p,
		.content-block.form .form-success > p {
			margin-top: 0;
		}

		.content-block.form input[type="submit"]{
			float: right;
		}

		.content-block.form .required-info {
			float: left;
		}

		.content-block.form .kurse {

		}

			.content-block.form .kurse h3 {
				margin-top: 20px;
			}

			.content-block.form .kurse label {
				cursor: pointer;
				text-transform: uppercase;
			}

	.content-block.kurse {

	}

		.content-block .category {
			display: block;
			text-transform: uppercase;
			margin-bottom: 1em;
		}

		.content-block .date {
			display: block;
			font-size: 14px;
			font-style: italic;
		}

		.content-block .meta {
			display: block;
			font-style: italic;
			margin-top: 1em;
		}

		.content-block .additional {
			display: block;
			font-style: italic;
			margin-top: 1em;
		}

		.content-block.kurse .image {
			width: 398px;
			margin: 12px 0 -10px -12px;
		}

			.content-block.kurse .image img {
				display: block;
				margin: 0 auto;
			}

				.content-block.kurse .image.right img {
					margin: 0 0 0 auto;
				}

	.content-block.gallery {
		text-align: right;
		font-style: italic;
	}

		.content-block.gallery + .content-block.gallery .content {
			padding-top: 0;
			margin-top: -10px;
		}

		.content-block.gallery + .content-block.gallery.border .content {
			padding: 12px;
			margin-top: 0;
		}

.content-block.unterrichtsplan {

}

	table.unterrichtsplan {
		width: 100%;
		line-height: 1.3;
		background: #fff;
		max-width: 800px;
		margin-left: auto;
		margin-right: auto;
		text-transform: uppercase;
		text-align: center;
		font-size: 11px;
	}

		table.unterrichtsplan b {
			font-size: 12px;
		}

		table.unterrichtsplan .color-red {
			color: red;
		}

		table.unterrichtsplan .teacher-open {
			font-weight: bold;
			color: #999;
		}

		table.unterrichtsplan th {
			font-weight: bold;
			text-align: center;
			vertical-align: middle;
			border: 2px solid #000;
			height: 60px;
		}

		table.unterrichtsplan td {
			border: 2px solid #000;
			height: 57px;
			width: 115px;
			min-width: 115px;
			text-align: center;
			vertical-align: middle;
			padding: 5px;
			box-sizing: border-box;
		}

		table.unterrichtsplan td,
		table.unterrichtsplan th {
			background: #fff; /* Safari Bugfix */
		}

		table.unterrichtsplan td.marked {
			background: #D4E3F3;
		}

		table.unterrichtsplan td.class {
			height: 115px;
		}

		table.unterrichtsplan td.class-half,
		table.unterrichtsplan tr {
			height: 57px;
		}

		table.unterrichtsplan th.closed,
		table.unterrichtsplan td.closed,
		table.unterrichtsplan td.closed .teacher-open {
			background: #AAA;
			color: #CCC;
		}
			table.unterrichtsplan th.closed {
				color: #000;
			}

body.buchungskalender {

}

	body.buchungskalender .main-wrapper {
		max-width: 1300px;
		width: 100%;
	}

	body.buchungskalender .main-wrapper #main {
		width: calc(100% - 4px);
		margin-left: 0 !important;
	}

		.content-block.buchungskalender {
			width: 100%;
		}

			.content-block.buchungskalender iframe {
				width: 100%;
				height: calc(100vh - 134px);
				min-height: 600px;
				display: block;
			}

.slideshow {
	position: relative;
	display: inline-block;
	padding: 0 40px;
}

	.slideshow .slides {
		position: relative;
	}

	.slideshow .navigation {

	}

		.slideshow .navigation div {
			width: 32px;
			height: 32px;
			margin-top: -16px;
			position: absolute;
			top: 50%;
			z-index: 100;
			cursor: pointer;
		}

			.slideshow .navigation .prev {
				left: 0;
				background: url('../img/sprite.png') no-repeat -221px 0;
			}

			.slideshow .navigation .next {
				right: 0;
				background: url('../img/sprite.png') no-repeat -261px 0;
			}

	.slideshow .slide {
		z-index: 10;
	}

		.slideshow .slide.active {
			z-index: 15;
		}

form {

}

	input,
	textarea {
		font-family: Helvetica, Arial, sans-serif;
		font-size: 13px;
		padding: 3px;
		border: 1px solid #000;
		display: inline-block;
		color: #000;
		margin: 5px 0;
		width: 100%;
		box-sizing: border-box;
	}

	textarea {
		height: 150px;
	}

		input.half {
			width: calc(50% - 5px);
		}

			input.half.left {
				margin-right: 5px;
			}

			input.half.right {
				margin-left: 5px;
			}

	input.required,
	textarea.required {
		border-color: #f00;
	}

	input[type="submit"],
	input[type="radio"],
	input[type="checkbox"] {
		width: auto;
	}

	input[type="submit"] {
		display: block;
		background: #000;
		color: #fff;
		cursor: pointer;
		padding: 5px;
		text-transform: uppercase;
		margin: 10px 0;
	}

		input[type="submit"]:hover {
			background: #666;
		}

	label {
		display: block;
		margin: 10px 0;
	}

#footer {

}

	#menu-footer {
		position: fixed;
		bottom: 10px;
		right: 10px;
		text-transform: uppercase;
		font-size: 11px;
	}

		#menu-footer a {
			color: #000;
			display: inline-block;
			margin-left: 10px;
		}

		#menu-footer li {
			display: inline;
		}

	#footer .social-icon a {
		display: inline-block;
		width: 40px;
		height: 0;
		padding-top: 40px;
		overflow: hidden;
		line-height: 2;
		background: no-repeat center center / contain;
		vertical-align: middle;
	}

		#footer .social-icon.facebook a {
			background-image: url(../img/icon_facebook.png);
		}

		#footer .social-icon.instagram a {
			background-image: url(../img/icon_instagram.png?v2);
		}

	@media(max-width: 939px){
		#menu-footer {
			position: static;
			margin: 20px auto;
			text-align: right;
		}
	}

.background-image {
	position: fixed;
	top: 0;
	left: 0;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	height: 100%;
	z-index: -1;
	pointer-events: none;
}

	.background-image.active {
		z-index: -2;
	}

	.background-image.next {
		z-index: -1;
		display: none;
	}

.galerie {
	text-align: center;
}

	.galerie img {
		display: block;
		margin: 40px auto;
		max-width: 100%;
		width: auto;
		height: auto;
	}

#main.hidden-content {
	margin-left: 0px;
	width: 100%;
	box-sizing: border-box;
	margin-top: 800px;
	margin-top: 100vh;
	margin-bottom: 40px;
}

#lightbox {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background: #000;
	background: rgba(0,0,0,.9);
	z-index: 100;
	cursor: pointer;
	display: block;
}

	#lightbox:after {
		content: "×";
		color: #fff;
		font-size: 20px;
		position: absolute;
		top: 10px;
		right: 10px;
	}

		#lightbox:before {
			content: "";
			display: none;
			width: 32px;
			margin-left: -16px;
			height: 32px;
			margin-top: -16px;
			background: url(../img/loading.gif) no-repeat center center;
			position: absolute;
			top: 50%;
			left: 50%;
			z-index: 105;
		}

		#lightbox.loading:before {
			display: block;
		}

	#lightbox-meta {
		color: #fff;
		text-align: center;
		position: absolute;
		bottom: 10px;
		left: 0;
		width: 100%;
	}

	#lightbox-content {
		width: 100%;
		height: 100%;
		display: block;
		z-index: 101;
		overflow: scroll;
	}

		#lightbox-content img {
			display: block;
			position: absolute;
			left: 50%;
			top: 50%;
		}

		#lightbox-content .html-content {
			display: table;
			width: 100%;
			height: 100%;
		}

			#lightbox-content .html-content .content {
				display: table-cell;
				vertical-align: middle;
				text-align: center;
				width: 100%;
				height: 100%;
			}

	.lightbox-html {
		display: none;
		cursor: pointer;
	}

	#lightbox-content .slideshow {
		padding-top: 20px;
		padding-bottom: 20px;
	}

.home_button {
	background: #000;
	color: #fff;
	text-align: center;
	display: inline-block;
	line-height: 1.3;
	text-transform: uppercase;
	font-weight: bold;
	padding: 20px 40px;
}

	.home_button:hover {
		background: #fff;
		color: #000;
	}

.plane {
	position: fixed;
	left: 50%;
	width: 780px;
	box-sizing: border-box;
	margin-left: -340px;
	top: 260px;
	background: url(../img/peace-plane.png) no-repeat right center;
	background-size: auto 100%;
	height: 180px;
	padding-right: 430px;
	display: flex;
	align-items: center;
	z-index: 1337;
}

	.plane .content {
		display: inline-block;
		font-weight: bold;
		text-transform: uppercase;
		padding: 10px 20px;
		border: 2px solid #000;
		background: #fff;
		max-width: 350px;
		box-sizing: border-box;
		text-align: left;
		color: #000;
	}

		.plane .content:hover {
			background: #000;
			color: #fff;
		}

		.plane .content *:first-child {
			margin-top: 0;
		}

	@media( max-width: 940px ) {

		.plane {
			display: none;
		}

	}

@media (max-width: 402px) {

	#canvas {
		min-width: 0;
	}

	body {
		min-width: 100%;
		max-width: 100%;
	}

	.width,
	#menu-main,
	.main,
	.content-block.kurse .image {
		width: 100%;
		min-width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}

	#menu-main {
		border-bottom: 2px solid #000;
		margin-bottom: -2px;
	}

	.content-block img {
		max-width: 100%;
		width: auto;
		height: auto;
	}

	#logo {
		margin-top: 10px;
		margin-bottom: -4px;
		margin-left: 5px;
	}

	#menu-footer {
		margin-right: 10px;
	}

	#menu-icon {
		position: fixed;
		top: 5px;
		z-index: 105;
	}

}

.backgroundvideo {
	position: absolute;
	z-index: 0;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	pointer-events: none;
	background: #000;
}

	.backgroundvideo iframe,
	.backgroundvideo video {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
	}

	.mute {
		position: fixed;
		left: 10px;
		bottom: 10px;
		width: 20px;
		height: 20px;
		background: url(../img/sound_on.svg) no-repeat left bottom;
		cursor: pointer;
		z-index: 150;
	}

		.mute.off {
			background-image: url(../img/sound_off.svg);
		}

/* new special menu buttons for archive: */

@media(min-width: 940px) {

	.main-art,
	.main-yoga {

	}

		#header #menu-main .main-art > a,
		#header #menu-main .main-yoga > a {
			width: 50%;
			line-height: 1;
			font-size: 52px;
			text-align: center;
		}

			#header #menu-main .main-art > a:before,
			#header #menu-main .main-yoga > a:before {
				display: none;
			}

}

body.page-template-home-switch {
	overflow: hidden;
}

	body.page-template-home-switch #menu-footer {
		z-index: 100;
	}

	body.page-template-home-switch #header-wrapper {
		display: none;
	}

	body.page-template-home-switch .links {
		position: absolute;
		z-index: 20;
		top: 0;
		height: 100%;
		left: 0;
		width: 100%;
	}

		body.page-template-home-switch .link {
			position: absolute;
			top: 0;
			width: 50%;
			height: 100%;
			z-index: 50;
			display: flex;
			align-items: center;
			line-height: 1;
			font-size: 100px;
			padding-top: 10px; /* fix line height */
			text-transform: uppercase;
			font-weight: bold;
		}

			body.page-template-home-switch .left-link {
				left: 0;
				text-align: right;
				justify-content: flex-end;
				color: #fff;
				background: #000;
			}
			
				body.page-template-home-switch.right-active .left-link {
					color: #000;
					background: #fff;
				}

			body.page-template-home-switch .right-link {
				right: 0;
				text-align: left;
				justify-content: flex-start;
				color: #000;
				background: #fff;
			}
			
				body.page-template-home-switch.right-active .right-link {
					color: #fff;
					background: #000;
				}

	body.page-template-home-switch.right-active #menu-footer a {
		color: #fff;
	}

	@media( max-width: 640px ) {

		body.page-template-home-switch .link {
			font-size: 50px;
			padding-top: 0;
		}

	}