@charset "utf-8";

		/*Mobile-----------------------------------------------*/
			/*Mobile-----------------------------------------------*/
			/*Mobile-----------------------------------------------*/
			/*Mobile-----------------------------------------------*/
		@media only screen and (max-width: 1023px) {
			
			@keyframes blur {
							0%{	text-shadow:	0px 0px 10px #fff,
												0px 0px 10px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 50px #fff,
												0px 0px 50px #fff,
												0px 0px 50px #7B96B8,		  
												0px 0px 150px #7B96B8,
												0px 10px 100px #7B96B8,
												0px 10px 100px #7B96B8,
												0px 10px 100px #7B96B8,
												0px 10px 100px #7B96B8,
												0px -10px 100px #7B96B8,
												0px -10px 100px #7B96B8,
												0px 0px 25px #fff,
												0px 0px 7px #fff,
												0px 0px 5px #fff}
							 
							 								
							
							20%{text-shadow:	none}
							60%{text-shadow:	none}
							70%{text-shadow:	none}
							100%{text-shadow:	none}
							
							  
						}
			body {
				background: url(../image/Backround_-1.jpg) no-repeat;
				background-size: cover;				
				background-position: center center fixed;
				font-size: 14px;
				font-family:sans-serif!important;
			}
			header {
				width: 60%;
				margin: auto;
			}
			
			h1 {				
				margin: 0 auto;				
				text-align: center; /*horizontale Ausrichtung*/							
				color: white;				
				font-size: 12vw!important;				
				animation: blur 5s ease-out;
				text-shadow: 0px 0px 5px #fff, 0px 0px 7px #fff;
			}
			h2 {				
				font-size: 3vw!important;
				text-align: center;	
				color: white;
			}
			.privat {
				text-align:center; 
				font-size:4vw!important; 
				width: 50vw; 
				margin:auto
			}
			.knopf {
				
				font-size:3vw!important;
				background-color: black;      
				color: white;
				padding: 1.5vw!important;
				margin: 0vw!important;
				text-align: center;
				text-decoration: none;
				display: inline-block;
				border: 1px solid white!important;
				border-radius: 6px;
				border-color: black;				
				cursor: pointer;
				transition-duration: 0.4s;
				box-shadow: 2px 2px 5px hsla(0,0%,0%,.7);
				text-shadow:2px 4px 4px hsla(0,0%,0%,.8);
				background-image: radial-gradient(160% 100% at 50% 0% ,hsla(0,0%,100%,.3) 50%,hsla(0,0%,100%,0) 52%);
				-webkit-box-shadow: 2px 5px 40px -10px rgba(0,0,0,0.57);
				-moz-box-shadow: 2px 5px 40px -10px rgba(0,0,0,0.57);		
			}
			.home {
				position: absolute;
				background-color: rgba(0,0,0,0.60);	
				color: white;
				width: 100vw!important;
				top: 24vh;
				height: 80vh!important;
				left:0!important;
				overflow: auto;
				font-size:1.3vw;
			}	
			h3 {
				font-size:3vw!important;
			}
			#durchgefuehrt{
				
			text-align:center;
			width:100vw!important;
			position:absolute;
			vertical-align:middle;
			top:45vh!important;
			margin-top:10vh!important;
			}
			#uebersicht {
				width:100vw;
			}
			#arbeiten{
			width: 100vw!important; 
			font-size: 3vw!important;
			background-color:rgb(255, 255, 255);
			color:black;
			padding:1vw;
			
			overflow:auto;
			margin-right:0px!important;
			
			margin-top:2vh;
			margin-bottom:2vh;
		 
			
			}
			#formnotiz {
				font-size:2vw!important;
			}
			#formarbeiten {
				text-align:center!important;
			}
			input {
				font-size:3vw!important;
				margin-bottom:2vw!important;
				padding:2vw!important;
				cursor:pointer;
				
			}
			textarea {
				font-size:3vw!important;
				min-height: 10vh!important;
			}
			h4 {
				font-size:3vw!important;
			}
			#kundenbereich {
				margin-top:10vh;
			}
			
		
		}
		
		
		
/*Desktop----------------------------------------------------------------*/		
/*Desktop----------------------------------------------------------------*/		
/*Desktop----------------------------------------------------------------*/		
/*Desktop----------------------------------------------------------------*/		
/*Desktop----------------------------------------------------------------*/		
		@keyframes blur {
							0%{	text-shadow:	0px 0px 10px #fff,
												0px 0px 10px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 25px #fff,
												0px 0px 50px #fff,
												0px 0px 50px #fff,
												0px 0px 50px #7B96B8,		  
												0px 0px 150px #7B96B8,
												0px 10px 100px #7B96B8,
												0px 10px 100px #7B96B8,
												0px 10px 100px #7B96B8,
												0px 10px 100px #7B96B8,
												0px -10px 100px #7B96B8,
												0px -10px 100px #7B96B8,
												0px 0px 25px #fff,
												0px 0px 7px #fff,
												0px 0px 5px #fff}
							 
							 								
							
							20%{text-shadow:	none}
							60%{text-shadow:	none}
							70%{text-shadow:	none}
							100%{text-shadow:	none}
							
							  
						}
body {
				background: url(../image/Backround_-1.jpg);
				background-size: cover;
				background-position: center center fixed;
				background-attachment: fixed;
				height: auto;
				font-family:sans-serif!important;				
			}
			
			header {
				top: 0px;
				position: fixed !important;
				position: absolute;
				z-index: 999;
				height: 10%;
				width: 100%;
				margin: auto;
			}
			
			h1 {
				font-family: Castellar, sans-serif;
				margin: 0 auto;				
				text-align: center; /*horizontale Ausrichtung*/							
				color: white;				
				font-size: 6vw;				
				animation: blur 18s ease-out;
				animation-iteration-count: infinite;
				text-shadow: 0px 0px 5px #fff, 0px 0px 7px #fff;
			}
			h2 {
				font-family: Castellar, sans-serif;
				font-size: 1.2vw;
				text-align: center;	
				color: white;
			}
			h3 {
				font-size: 19px;
				margin-top: 15px;
				margin-bottom: 15px;				
			}
			h4 {
				margin-top: 15px;
			}
			
				.home {
				position: absolute;
				background-color: rgba(0,0,0,0.60);				
				color: white;
				width: 85vw;
				top: 24vh;
				height: 67vh;
				left: 7.5vw;
				overflow: auto;
				font-size:1.3vw;
			}	
			.privat {
				text-align:center; 
				font-size:2.2vw; 
				width: 50vw; 
				margin:auto
			}
			#kundenbereich {
				text-align: center;
				padding-bottom: 7vh;
				padding-top: 3vh;
				font-size: 18px!important;
			}
			.knopf {
				background-color: black;      
				color: white;
				padding: 0.3vw;
				text-align: center;
				text-decoration: none;
				display: inline-block;
				border: 1px solid black;
				border-radius: 6px;
				border-color: black;				
				margin: 4px 2px;
				cursor: pointer;
				transition-duration: 0.4s;
				box-shadow: 2px 2px 5px hsla(0,0%,0%,.7);
				text-shadow:2px 4px 4px hsla(0,0%,0%,.8);
				background-image: radial-gradient(160% 100% at 50% 0% ,hsla(0,0%,100%,.3) 50%,hsla(0,0%,100%,0) 52%);
				-webkit-box-shadow: 2px 5px 40px -10px rgba(0,0,0,0.57);
				-moz-box-shadow: 2px 5px 40px -10px rgba(0,0,0,0.57);		
			}
			.knopf:hover{
				background-color: white;
				color: black;
				border: 1px solid black;
				box-shadow: 1px 1px 1px 1px rgba(255,255,255,0.24);
				background-image: radial-gradient(160% 100% at 50% 0% ,hsla(0,0%,100%,.3) 50%,hsla(0,0%,100%,0) 52%);
				transition: all 0.3s ease-in-out ;
				-webkit-box-shadow: 2px 5px 40px -10px rgba(0,0,0,0.57);
				-moz-box-shadow: 2px 5px 40px -10px rgba(0,0,0,0.57);
			
			}
			.input {
				padding:1.2vw;
				border-radius:5px;
				background-color:black;
				color:white;
			}
			#arbeiten{
			width: 50vw; 
			font-size: 1.3vw;
			background-color:rgb(255, 255, 255);
			color:black;
			padding:1vw;
			max-height:45vh; 
			overflow:auto;
			margin-left:2vw; 
			margin-right:2vw; 
			margin-top:2vh;
			margin-bottom:2vh;
			float:right; 
			
			}
			#durchgefuehrt{
			width:40vw;
			position:absolute;
			right:2vw; 
			top:6vh; 
			}
			#formnotiz {
				text-align:center;
			}
			#uebersicht {
				width:80vw;
			}