@charset "utf-8";
/* CSS Document */

body{
	width:99%;
	height: 100%;
	font-family: 'Quicksand', sans-serif;
	font-size:1.444em;
	color:#0D0D0D;
	background: white;
}



nav{
	text-align: center;	
	height: 3em;
	padding:0;
	color:white;
	background-color:#660242;
	width:100%;
	padding-top:0.2em;
	border-bottom:solid white 1px;
	position: fixed;
}

nav li {
 	padding-left: 2em;
	padding-right: 2em;
	padding-bottom: 2em;
  	font-size:1em;
  	display: inline;
	color:white;
  	list-style-type: none;
}

nav ul li a{
	text-decoration:none;
	color:white;
	margin-top:0.2em;
}

nav ul li a:hover{
	border-top:solid white 1px;
}

#title{
	marign-top:auto;
	width:auto;
	height:auto;
	
	
}
#titelbild{
	width:100%;
	height:100%;
	margin-top:2em;
	
}
h1{
	
	font-family: 'Indie Flower', cursive;
	font-size: 2.5em;
	color:#0D0D0D;
}

#klangmassage{
	
	marign-top:5em;
	padding-top:0;
	display: inline;
	width: 100%;
	height:auto;
}

#klangmassage h1{
	
	text-align: center;
}

.klangmasse_text{
	
	float:left;
	padding-left:2em;
}

.klangmassage_bilder{
	float:right;
	padding-right:2em;
}



.klangmethoden_text{
	
	float:right;
	padding-right:2em;
	text-algin:right;
}

.klangmethoden_bilder{
	float:left;
	padding-left:2em;
}



#entwickelung{
	padding-left:2em;
	padding-right:2em;
	padding-top:10em;
}

#entwickelung a{
	text-decoration: underline;
	color:black;
}

#entwickelung h1{
	border-top:solid #660242 0.1em;
}
#angebot{
	
	background-image:url("bilder/hintergrund_angebot.png");
	background-repeat: no-repeat;
	width:auto;
	height:auto;
}

#angebote_text{
	color:white;
	text-align: center;
	padding-top:3em;
}

#angebot h1{
	color:white;
}

.beschreibungstext{
	font-size:0.7em;
	padding-top:0;
}

#gutscheine{
	padding-left:2em;
	
}

.gutscheine_bilder{
	float:right;
	padding-right:2em;
}

.gutschein_text{
	float:left;
	text-algin:right;
}

#gutscheine h1{
	text-align: center;
	color:#0D0D0D;
}

#kinder::after{
	padding-left:2em;
	content: "";
    clear: both;
    display: table;
}

.kinder_bilder{
	float:left;
	padding-right:2em;
}

.kinder_text{
	float:right;
	text-algin:right;
	padding-right:2em;
}

#kinder h1{
	text-align: center;
	color:#0D0D0D;
}

#regelung{
	margin-top:2em;
	background-color:#660242;
	color:white;
	height:2em;
	overflow: auto;
	text-align: center;
	padding-top:0.5em;
}

#kontakt{
	background-image:url("bilder/hintergrund_kontakt.png");
	background-repeat: no-repeat;
	width:auto;
	height:auto;
	text-align: center;
	color:white;
	margin-top:0;
}

#kontakt h1{
	color:white;
}

#werdegang{
	padding-left:2em;
	padding-right: 2em;
	text-align:center;
}

#werdegang h1{
	text-align: center;
	color:#0D0D0D;
}

footer{
	border-top:solid #660242 0.5em;
	color:black;
	text-decoration: none;
	list-style-type: none;
}



.right{
	float:right;
	padding: 1em;
}

.handy{
		display:none;
		visibility: hidden;
		}

.toggle-nav{
		display:none;
		visibility: hidden;
		}

@media only screen and (max-width:1024px){
	body{font-size:1.2em;}
	
	#menu{
	width:100%;
	height:50px;
	background-color:#660242;	
	margin:0;
	padding:0;
	font-size:0.7em;
	padding-top:20px;
		display:none;
		visibility: hidden;
	}	
	
	#regelung{
		height:auto;
	}
		.handy{
		display:none;
		visibility: hidden;
		}
	
			.menu {
		position:relative;
		display:inline-block;
	}

	.menu ul.active {
		display:none;
	}

	.menu ul {
		width:100%;
		position:absolute;
		top:120%;
		left:0px;
		padding:10px 18px;
		box-shadow:0px 1px 1px rgba(0,0,0,0.15);
		border-radius:3px;
		background:#303030;
	}

	.menu ul:after {
		width:0px;
		height:0px;
		position:absolute;
		top:0%;
		left:22px;
		content:'';
		transform:translate(0%, -100%);
		border-left:7px solid transparent;
		border-right:7px solid transparent;
		border-bottom:7px solid #303030;
	}

	.menu li {
		margin:5px 0px 5px 0px;
		float:none;
		display:block;
	}

	.menu a {
		display:block;
	}

	.toggle-nav {
		padding:20px;
		float:left;
		display:inline-block;
		box-shadow:0px 1px 1px rgba(0,0,0,0.15);
		border-radius:3px;
		background:#303030;
		text-shadow:0px 1px 0px rgba(0,0,0,0.5);
		color:#777;
		font-size:20px;
		transition:color linear 0.15s;
	}

	.toggle-nav:hover, .toggle-nav.active {
		text-decoration:none;
		color:white;
	}

	.search-form {
		margin:12px 0px 0px 20px;
		float:left;
	}

	.search-form input {
		box-shadow:-1px 1px 2px rgba(0,0,0,0.1);
	}
	
	.toggle-nav{
		display:none;
		visibility: hidden;
	}
}

@media only screen and (max-width:1000px){
	
	body{
		font-size:1em;
		margin-left: 2%;
		margin-right: 2%;
		padding:0;
		text-align: center;
	}
	
	
	.klangmassage_bilder{
		visibility: hidden;
		display: none;
	}
	#titelbild{
		visibility: hidden;
		display: none;
	}
	.klangmethoden_bilder{
		visibility: hidden;
		display: none;
	}
	.gutscheine_bilder{
		visibility: hidden;
		display: none;
	}
	
	.kinder_bilder{
		visibility: hidden;
		display: none;
	}
	.werdegang_bilder{
		visibility: hidden;
		display: none;
	}
	#regelung{
		font-size:0.7em;
		height:auto;
	}
	#entwickelung h1{ 
		border:none;
	}
		
	#angebot{
	
	background-image:url("bilder/hintergrund_kontakt.png");
	background-repeat: no-repeat;
	}
	
	.hess{
		height:5em;
		width: auto;
	}
	.fachverband{
		height:5em;
		width: auto;
	}
		
	.right{
		display:none;
		visibility: hidden;
		}
	
	.handy{
		display:inline;
		visibility: visible;
		padding-left:2em;
	}
	
	.handy img{
		height:2em;
	}

}