@charset "UTF-8";
/* CSS Document index kk */



/*braun rgba(96,36,33,1.00)
gelb rgba(248,176,0,1.00)
blau rgba(13,133,176,1.00)
braun hover rgba(81,30,27,1.00)
gelb hell rgba(253,231,178,1.00)
*/

body{
	box-sizing: border-box;
	margin-top: 0;
	background-color: rgba(96,36,33,1.00);
	}

.wrapper{
		margin:0rem auto;
		max-width: 75rem;
	}

.header {
		display: flex;
		z-index: 1000;
		position: fixed;
		width: 75rem;
		border-bottom: rgba(248,176,0,1.00) solid 2rem;
		}

.wrap-move{
	max-width: 75rem;
	position: absolute;
	overflow: hidden;}

.typo{position: relative;
	left: -3.95rem;} 

/* C E N T E R */

.flex-1{
	display: flex;
	flex-direction: row;
	width: 100%;
	padding-top: 12rem;
	/*background-color: #EAAA26;*/}

.left{
	width: 15%;
	background-color: rgba(248,176,0,1.00);}

.center{
	width: 70%;
	height: 900rem;
	background-color: rgba(248,176,0,1.00);
	padding-top: 3rem;
	padding-bottom: 0;}

.close{
	width: 4%;
	height: auto;}

.yellow{
	background-color:rgba(253,231,178,0.00);
	padding-top: .5rem;
	width: auto;
	height: 35rem;
	position: fixed;}

.link_rechts{text-align: right;}

/*.flex-y{
	display: flex;}*/



.linie-unten{
	width: 24.75rem;
	height: 0.75rem;
	background-color:rgba(96,36,33,1.00);
	border: 0;
	margin-top: 0;
}
	

.play{
	background-image:url("../bilder/play_y-w.png");
	background-repeat: no-repeat;
	background-size:contain;
	height: 1.1rem;
	width: 1.4rem;
	margin-left: .5rem;
	background-color: rgba(81,30,27,0.00);}

.pause{
	background-image:url("../bilder/pause_y_w.png");
	background-repeat: no-repeat;
	background-size:contain;
	height: 1.1rem;
	width: 1.9rem;
	background-color: rgba(6,6,6,0.00);}


/*.tracks{
	display: flex;
	flex-direction: column;
	width: 24.75rem;
	height: 32.375rem;
	padding-left: 1rem;
	padding-top: 0;
	background-color: #F19193;
}*/

/*.tracks p{
	color: rgba(248,176,0,1.00);
	background-color: rgba(96,36,33,1.00);
	font-family: panton-extra-bold;
	font-size: 2rem;
	line-height: 3.2rem;
	letter-spacing: .06rem;
	padding-left: 1rem;
	margin-top: 1rem;
	margin-bottom: .5rem;}

.tracks a{
	background-color:rgba(248,176,0,1.00);
	color: rgba(96,36,33,1.00);
	line-height: 1.5rem;
	margin-bottom: .5rem;
	padding-left: 1rem;
	text-decoration: none;
	font-size: 1rem;
	font-family: panton-bold;}*/

.stoerer{
	text-align: left;
	position: relative;
	left: 2.8rem;
	top:-9.7rem;}

.stoerer img{width: 40%;}

/**/

.right{	
	width: 15%;
	background-color: rgba(248,176,0,1.00);}

.navi{height: auto; 
	width: 11.25rem;
	padding-top: 4rem;
	position: fixed;
	display: none;
	
		}



.navi div{background-color: rgba(96,36,33,1.00);
	height: 2rem;
	width: 9.5625rem;
	padding-bottom: 0.5rem;
	margin-bottom: 0.5rem;
	position: relative;
	right: -1.8rem;
	border-radius: 0.5rem 0 0 0.5rem;
	}

h1{
	font-family:acumin;
	font-variation-settings: 'wght' 800, 'wdth' 50, 'slnt' 0;
	text-transform: uppercase;
	color: rgba(13,133,176,1.00);
	font-size: 3rem;
	line-height: 3rem;
	padding-top: 700rem;}

/*Animationen*/

.play:hover, .pause:hover{
	transform:scale(1.15);
	transition: .5s;
	}
.play:active, .play:focus, .play:visited{
	background-image:url("../bilder/play_b-y.png");
}

.pause:active, .pause:focus,.pause:visited{
	background-image: url("../bilder/pause_b_y.png")
}/**/


.move{animation-name: move-1;
	  animation-duration: 180s;
	  animation-iteration-count: infinite;}

@keyframes move-1 {
	0%  {transform: translateX(-16rem);}
	
}/**/
.navi-1:hover {transition: 1s;
	background-color: rgba(81,30,27,1.00);} 
.navi-2:hover {transition: 1s;
	background-color: rgba(81,30,27,1.00);} 
.navi-3:hover {transition: 1s;
	background-color: rgba(81,30,27,1.00);} 
.navi-4:hover {transition: 1s;
	background-color: rgba(81,30,27,1.00);} 
.navi-5:hover {transition: 1s;
	background-color: rgba(81,30,27,1.00);}