*{margin:0;padding:0;outline:0 none;text-decoration:none;color:rgba(225,225,225,1);cursor:url(mouse.png),auto;}
        body, html{width:100%;height:100%;background-color:rgba(225,0,0,0)}
		html{background: url(bg2-rgb.jpg) no-repeat fixed center center / cover;
		}
		
		{
    
}
		
		h1{
			/*font-family: 'Cabin Sketch', cursive;*/
			font-family:'nes_controller', 'Finger Paint';
			font-size:100px;
			text-align:center;
			line-height: 51px;
			margin-top:30px;
			}
		h1 span{
			letter-spacing:-15px;
			font-size:150px;}
		h2{
			font-family: 'Cabin Sketch', cursive;
			font-size:50px;
			text-align:center;
			margin-bottom:20px;
		}
		h2 span{
			font-family:'nes_controller';
			letter-spacing:0px;
			font-size:55px;
		}
		h3{
			font-family: 'Cabin Sketch', cursive;
			font-size:30px;
			text-align:center;
			margin-bottom:20px;
		}
		p{font-family: 'Poiret One', cursive;margin-bottom:20px;}
		input{color:#000; width:10%; margin-left:45%; min-width:70px}
		a{font-family: 'Poiret One', cursive;}
		header{position:relative;height:100%;width: 100%;
			float:left;}
		header.imp{
			height:0%;
			animation-name:implogo;
			animation-duration:5s;			
			}
		#implogo2{
			opacity:1;
			position:absolute;
			top:0px;
			right:10px;
			animation-name:implogo2;
			animation-duration:8s;
		}
		#logo{
			background: url(bg2-rgb-lg.jpg) no-repeat fixed center center / cover;
			position:absolute;
			left:25%;
			top:25%;
			width:50%;
			height:auto;
			min-height: 200px;
			}
		.mob{
			animation-name:implogo3;
			animation-duration:10s;	
		}
			content{
			position:relative;
			height:auto;
			min-height:85%;
			width:100%;
			background: url(bg2.jpg) no-repeat fixed center center / cover;
			padding-top:15%;
			float:left;
			overflow:hidden;
			}
		content p{
		text-align:center;
		letter-spacing:1.5;
		margin:30px;
		}
		#picture{ /*Main*/
		position: relative;
		width: 25%;
		left: 35.5%;
		border: 10px solid #D3D3D3;
		border-bottom: 60px solid #D3D3D3;
		margin-top	: 50px;
		margin-bottom: 50px;
		box-shadow: 10px 10px 40px #000;
		border-radius: 0 0 2px 2px;
		transition:2s
		}
		#picture:active{
		border: 0px;
		left: 5%;
		width: 90%;
		transition:1s
		}
		
		
/**/	.pic::after{content:"Juni 2024";color:#000;position:relative;font-family: 'Rock Salt', cursive;}
		.pic::after{top:-130px;left:-2%}
		
		
		
		#line{
		position:absolute;
		height:1px;
		width:80%;
		left:10%;
		}
		#line2{
		position:absolute;
		height:1px;
		width:100%;
		}
		#line, #line2{
		background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 25%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 75%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 25%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 75%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
		}
		#contact{margin:32px; margin-top:70px}
		#contact p{font-size:30px}
		#copyright{
			position:absolute;
			bottom:10px;
			width:100%;
			color:#5d5d5d;
			text-align:center
		}
		#linkintern{
			position:absolute;
			bottom:10px;
			width:100%;
			color:#5d5d5d;
			text-align:center;
			cursor: no-drop
		}
		#mail:hover{color:rgb(225,225,0)}
		#imp{text-align:center}
		#imp:hover{color:rgb(225,225,0)}
		footer{
			position:relative;
			background:#00192B;
			height:300px;
			width:100%;
			box-shadow: inset 0 10px 20px #000, inset 0 -3px 7px #000;
			float:left
		}
		#watermark{
			position:absolute;
			width:50%;
			max-width:500px;
			height:auto;
			right:0px;
			top:0
		}
		#watermark img{
		width:100%;
		}
		#button{
		position:absolute;
		width:260px;
		right:50px;
		bottom:50px;
		transition:1s
		}
		#download{float:left}
		#datenschutz{float:center}
		#impressum{float:right}
		#button:hover{
			transition:1s
		}
		@font-face{font-family: 'nes_controller'; src: url('nes_controller.ttf') format('truetype')}
		
		/*--------------KEYFRAMES------------*/
		
		@keyframes implogo {
			from {height:100%;}
			to {height:0%;}
		}
		@keyframes implogo2 {
			0% {opacity:0;}
			50%{opacity:0;}
			100% {opacity:1;}
		}
		
		/*--------------MEDIA QUERYS------------*/
		
		@media only screen and (max-width: 900px){
		content{background:rgba(0,0,0,.5)}
		#logo{
			background:rgba(225,225,225,.3);
		}
		.mob{opacity:0;}
		@keyframes implogo3 {
			0% {opacity:1;}
			50%{opacity:0;}
		}
		#implogo2{display:none}
		
		#picture{ /*Main*/
		width: 50%;
		left: 25%;
		}
		}
		@media only screen and (max-width: 785px){
			h1{
				font-size:70px;
				}
			h1 span{
				letter-spacing:-10px;
				font-size:100px;
				}
			h2{
				font-size:40px;
				}
			h3{
				font-size:30px;
				}
			#picture{
				width:80%;
				left:7%;
				border: 10px solid #D3D3D3;
				border-bottom: 60px solid #D3D3D3;
				box-shadow: 10px 10px 40px #000;
				border-radius: 0 0 2px 2px;
				transition:2s
			}
			#picture:active{
				border: 10px solid #D3D3D3;
				border-bottom: 60px solid #D3D3D3;
				left:7%;
				width:80%;
				transition:2s
			}
			#picture:hover{
				border: 0px;
				left: 0%;
				width:100%;
				transition:.5s
			}
		}
		@media only screen and (max-width: 530px){
			h1{
				font-size:45px;
				}
			h1 span{
				letter-spacing:-6px;
				font-size:70px;
				}
			h2{
				font-size:35px;
				}
			h3{
				font-size:28px;
				}
			#contact p{font-size:20px}
			#button{
				position:absolute;
				width:60%;
				right:20%;
				bottom:50px
			}
			#button:hover{
				width:80%;
				right:10%;
			}
		}
		@media only screen and (max-width: 365px){
			h1{
				font-size:35px;
				}
			h1 span{
				letter-spacing:-3px;
				font-size:45px;
				}
			h2{
				font-size:30px;
				}
			h3{
				font-size:25px;
				}
		}