/*allgemeine Anweisungen*/
body {
	margin: 0;
	font-family:"Tahoma", "Sans", sans-serif;
	background-color:#020331;
	color:#f9faac;
	border:0;
	line-height:1.5em;
	letter-spacing:0.02em;
	text-align: justify;
	hyphens: auto;
}
a, .more, .less{
	color:#f9faac;
}
a:hover, .more:hover, .less:hover{
	color:#f4f76e;
	cursor:pointer;
}

hr{
	border-width:0;
	margin:0px;
}
p{
	margin:0;
}
.mobile{
	display: block;
}
.important{
	display: none;
}
	/*alle Kapitel gleich, außer homegallery*/
.wrapper{
	position:relative;
	width:90%;
	padding:5%;
	padding-top:7%;
	padding-bottom:7%;
	border-top: #f9faac 1px solid;
	/*border-bottom: #f9faac 1px solid;*/
}
.innerwrap{
	width:94%;
	margin:3%;
	margin-top:6%;	
	display:inline-block;
	position:relative;
}
.slideshow{
	width:100%;
	clear:both;
}
	/*allgemeine Liste*/
ul {	
	list-style-type:square;
    list-style-image:url("../images/icon.gif");
    margin:0px;
	float:left;
	position:relative;
}
		/*Navigationsliste*/
ul.topnav{
	padding:0;	/*kein Einrücken der Zeilen*/
}
h2{
	font-size:1.8em;
	margin:0;
}
h3{
	float:none;
	width:100%;
	margin:0;
}
.secondlevel:hover{
	cursor:pointer;
}
	/*allgemeiner Button*/
.button{
	width: 20px;
	height: 20px;
	z-index: 999;
	background: rgba(249,250,172,0.2);
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	text-align:center;
	color:rgb(249,250,172);
	padding:10px;
}
		/*back-to-top-button*/
a.back-to-top {
	display: none;
	position: fixed;
	right: 2%;
	bottom: 5%;
	font-size:20px;
}
.button:hover{
	background:rgba(249,250,172,1);
	color:#030444;
}
	/*Footer*/
.foot{
	border-top:2px solid black;
	background-color:#110e29;
	width:100%;
	height:15%;
	margin-left:0;
	margin-right:0;
	padding:0;
	line-height:1em;
	display:inline-block;
}
.foot p{
	color:#f9faac;
	font-size:0.6em;
	padding:5px;
	margin-bottom:0;
}
.foot p a{
	
	font-size:1.2em;
	padding:5px;
	text-decoration:none;
}
.foot p a:hover{
	text-decoration:underline;
}
.foot > img{
	float:left;
}
.foot .sm{
	min-width:35px;
	background-color:#110e29;
	display:block;float:right;
}
	/*allgemeiner Icon (zur Navigation)*/
.icon{
	display:inline-block;
	position:absolute;
	z-index:6;
	right:5%;
	bottom:50%;
}

.icon:hover{
	transform: scale(1.2);
}
	/*Personengallerie-Elemente*/
.foto{
	position:relative;
}
.foto img{
	float:left;
	width:100%;
}
.nameWrapper{
	width:94%;
	position:relative;
	height:1.5em;
	margin:3%;
	padding-top:3%;
	padding-bottom:3%;
}
.news_caption{
	width:94%;
	position:relative;
	height:1.5em;
	margin:3%;
	padding-bottom:0;
	margin-bottom:0;
}
.gallery{
	width:100%;
	display:inline-block;
}
.next{
	display:none;
}
.highlight{
	font-weight:bold;
	font-style:normal;
}
.thumbline{
	display:none;
}
	/*Repertoire-Liste*/
.aufz ul{
	padding:16px;
}
	/*Kontakt-Formular*/
.error{
	display:inline-block;
}
.notmobile{
	display: none;
}
input[type=text],textarea{
	outline:none;
	font-size:0.8em;
	font-family:Verdana;
	padding:10px;
	background-color:white;
	border:3px solid black;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	color:#110e29;
}
input[type=submit],input[type=reset]{
        background: #f9faac/*#ECECEC*/;
        border-radius: 15px;
        padding: 10px 20px;
        font-family: arial;
		font-size:1.1em;
		display:inline;
        font-weight: bold;
        color:#030444/*#7f7f7f*/;
        text-decoration: none;
        text-shadow:0px 1px 0px #fdfee7;
        border:1px solid #d5d90d/*#a7a7a7*/;
        margin:10px;
        box-shadow: 0px 2px 1px #fdfee7 inset, 0px -2px 8px #fdfee7, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1);
        -webkit-transition: box-shadow 0.5s;
		outline:none;
		cursor:pointer;
}
input[type=text]:focus,textarea:focus{
	border:3px solid #f9faac;
}
input[type=text]{
	width:30%;
}
textarea{
	width:70%;
	min-height:200px;
}

input[type=submit]:hover,input[type=reset]:hover{
	box-shadow: 0px 2px 1px #fdfee7 inset, 0px -2px 10px #fdfee7, 0px 2px 5px rgba(0, 0, 0, 0.1), 0px 8px 10px rgba(0, 0, 0, 0.1);
}
input[type=submit]:active,input[type=reset]:active{
	box-shadow: 0px 1px 2px rgba(255, 255, 0, 0.5) inset, 0px -2px 10px #fdfee7, 0px 1px 5px rgba(0, 0, 0, 0.1), 0px 2px 10px rgba(0, 0, 0, 0.1);
    background:-webkit-linear-gradient(top, #f6f887 0%,#f9faac 100%);
}

.divider{
	display:none;
}
.more, .less{
	display:none;
}
/*Anweisungen für kleine Bildschirme (Smart-phones)*/
@media only screen and (max-width:700px){
body{
	font-size:0.8em;
}
#menu{
	display:none;
}
#logo img{
	width:100%;
}
.content{
	width:90%;
	margin:auto;
	display:none;
	background-color:#070854;
}
.content>p{
	padding:2%;
	text-align: justify;
	hyphens: auto;
}
.beschreibung{
	width:94%;
	margin-top:3%;
	text-align:justify;
}
.secondlevel{
	width:94%;
	margin:auto;
	/*padding:3%;*/
}
	/*Footer*/
.foot>img{
	width:50%;
	padding:3%;
	padding-right:7%;
	border-top: #f9faac 1px solid;
	}
.foot p{
	float:left;
	clear:both;
	/*text-align:center;	*/	
}

.foot .sm{
	width:10%;
	padding:1%;
}
	/*Personengalerie-Elemente*/
.foto{
	float:none;
	margin-top:0px;
	border:none;
}
.foto img{
	display:block;
}
.innerwrap{
	width:
}
	/*Repertoire-Liste*/
.aufz ul{
	padding-bottom:20px;
}
	/*Kontakt-Formular*/
input[type=submit],input[type=reset]{
	display:block;
	width:50%;
	min-width:150px;
}
input[type=text], textarea{
	width:90%;
}
.fullwidth{
	width:100%;
}
}
/*Anweisungen für große Bildschirme (Desktop)*/
@media screen and (min-width:700px){
body{
	font-size:1.2em;
}
h2{
	font-size:2.2em;
}
	/*Navigationsleiste*/
#logo{
	width:100%;
	margin: 0px 0px;
	border:0;
	overflow:hidden;
	z-index:6;
	background-color:#110e29;
}
#logo img{
	width:30%;
	z-index:6;
}
#navbar{
	width:100%;
	z-index:5;
	background-color:#110e29;
	border-bottom:1vw black;
	padding-bottom:1vw;
	padding-top:1vw;
}
.mobile{
	display:none;
}
.nav{
	padding:0.8vw;
	text-decoration:none;
	font-size:2vw;
	flex-grow: 1;
}
.nav:hover{
	color:#f9faac;
}
.nav img{
	width:3vw;
}
.notmobile{
	display: block;
}
#menu{
	margin-left:33vw;
		display: flex;
	width: 66vw;
	text-align: center;
	align-items: center;
}
#balken{
	background-color:#f9faac;
	position:absolute;
	bottom:-4px;
}
.kapitel:not(.slideshow){
	margin-left:10%;
	margin-right:10%;
	/*margin-bottom:10%;*/
	width:80%;
	/*background-color:#110848;
	border: black 5px solid;*/
}
.firstlevel{
	display:none;
}
/*Personengalerie-Elemente*/
.gallery{
	position:relative;
	width:88%;
	background-color:#110e29;
	padding:5vw;
	border-radius:10px;
	border: 1.5px solid black;
}
.next{
	display:block;
	position: absolute;
	z-index: 3;
	top: 250px;
	font-size: 5vw;
	cursor:pointer;
}
.next.rightIcon{
	right: 2.5%;
}
.next.leftIcon{
	left:2.5%;
}
.foto.secondlevel{
	width:100%;
	background-color: #020331;
	border-radius:10px;
	border: 2px solid #f9faac;
}
.foto.secondlevel:not(.show){
	display:none;
}
.secondlevel:hover{
	cursor:auto
}
.secondlevel h3{
	text-align:center;
}

.foto .icon{
	display:none;
}
.nameWrapper{
	width:100%;
	padding:3% 0 4% 3%;
	font-size:x-large;
	margin:0;
}

.nameWrapper h3{
	text-align: left;
}
.news_caption{
	width:100%;
	margin:0;
	margin-bottom:2%;

}
.foto:hover .nameWrapper h3{
	font-weight:bold;
}
.innerwrap{
	width:100%;
	margin:0;
}
/*Personengalerie-Elemente*/
.gallery{
	position:relative;
	width:88%;
	background-color:#110e29;
	padding:5vw;
	border-radius:15px;
	border: 1.5px solid black;
}
.foto img {
	display:inline-block;
	width:35%;
	padding: 0 2.5% 2.5% 2.5%;
}
.beschreibung{
	display:inline-block;
}
.beschreibung p{
	margin-top:0;
	margin-left:3%;
	margin-bottom: 3%;
	float:left;
	width:54%;
	text-align:justify;
	hyphens:auto;
}
.thumbline{
	width:96%;
	float: none;
	display:inline-block;
	background-color: #110e29;
	padding: 0% 2% 0 2%;
}
.thumbWrapper{
	width:16%;
	float:left;
	background-color:#f9faac;
	position:relative;
	border-radius: 0 0 10px 10px;
	margin:0 0.2% 0 0.2%;
	color: #020331;
	top:-2px;

}
.thumbWrapper img{
	display: none;
	width:100%;
}
.thumbWrapper:hover:not(.selected) img{
	cursor:pointer;
	/*display:block;*/
}
.thumbWrapper h3{
	position: relative;
	text-align: center;
	font-size:medium;
	font-weight:normal;
	padding:10% 0 10% 0;
}
.thumbwrapper, .home h3{
	font-weight:bold;
}
.thumbwrapper, .selected{
	background-color: #020331;
	color:#f9faac;
	border:2px solid #f9faac;
	border-top:2px solid #020331;
}
.thumbwrapper, .selected h3{
	padding:30% 0 10% 0;
	font-size: large;
	font-weight: bold;
}

.slideshow{
	width:100%;
	background-color:black;
	/*margin-bottom:10%;*/
}
.wrapper{
	border:none;
	/*border-bottom:black solid 5px;*/
	text-align:center;
	padding-top:0%;
}


	/*Repertoire-Liste*/
.liste{
	display:block;
}
.erweiterung{
	display:none;
}
	/*Footer*/
.foot p{
	float:left;
}
.foot p a{
	float:left;
}
.foot>img{
	width:10%;
	padding:2%;
	padding-right:7%;
}
.foot a:hover{
	text-decoration:underline;
}
.foot .sm{
	padding:0.5%;	
	width:3%;
}
	/*Personengallerie-Elemente*/

.icon.arrow{
	display:none;
}
	/*Repertoire-Gallerie-Elemente*/
.aufz{
	float:left;
	width:18vw;
	margin:1%;
}
.aufz ul{
	font-size:0.9em;
	text-align:left;
}
.divider{
		width:60%;
		display:block;
		margin-left: auto;
		margin-right:auto;
		margin-bottom: 12%;
		margin-top:12%;
}
.more, .less{
	text-decoration:underline;
}

}
/*Anweisungen, die durch Skripte angepasst werden*/

	/*entsprechendes Element wird angezeigt*/
.show{
	display:block;
}
.showItem{
	display:list-item;
}
.close{
	display:none;
	position:absolute;
	top:0;
	right:0;
}
.icon-spin-forward {
    animation-duration: 0.3s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-direction: normal;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
    animation-play-state: running;
    animation-name: spinfor;
}
@keyframes spinfor {
    from {transform:rotate(360deg);}
    to {transform:rotate(270deg);}
}
.icon-spin-backward {
    animation-duration: 0.3s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-direction: normal;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
    animation-play-state: running;
    animation-name: spinback;
}
@keyframes spinback {
    from {transform:rotate(270deg);}
    to {transform:rotate(360deg);}
}
.absolute{
	position:absolute;
	top:7vw;
}
.fix{
	position:fixed;
	top:0;
}