html, body{
	font-family: Arial ,sans-serif;
	background-color: black;
	background-image: url(bilder/Merry%20Christmas%20ultra%20hd%20wallpapers.jpg);
	background-attachment: fixed;
	background-size: cover;
	color: white;
	background-repeat: no-repeat;
	
}
table:not(:hover){
	margin: 0 auto;
  width: 500px;
	border: 5px rgba(0, 255, 39, 0.69);
	border-style: double dotted double dotted;
  transition: all 2s;
}
table:hover{
	border: 7px #8C0E0E;
	border-style: double dotted double dotted;
  transition: all 2s;
  margin: 0 auto;
  width: 700px;
}
.td_tag{
	font-size: 25px;
	color: rgba(66, 183, 245, 0.7);
}
.td_tag2{
	font-size: 20px
}
a:not(:hover){
  color: black;
	text-decoration: none;
}
a:hover{
	color: #8C0E0E;
}
#bild_maps{
  display: block;
  margin: 0 auto;
}
#bild_partner{
  margin: 0 auto;
}
#center{
  text-align: center;
}
.links{
  float: left;
  text-align: left;
}
#entwickler{
	background-color: rgba(255, 255, 255, 0.71);
  color: black;
  padding: 20px;
  text-align: center;
 	margin-top: 20px;
  margin-bottom: 50px;
  margin-left: 100px;
  margin-right: 100px;
  border-radius: 20px;
}

#ptag{
  text-align: right;
  margin-right: 120px;
  font-weight: bold;
}
nav ul{
  list-style-type: none;
  text-align: center;
}
nav li:not(:hover){
  display: inline;
  padding-top: 20px;
  padding-right: 25px;
  padding-bottom: 20px;
  padding-left: 25px;
  margin: 20px;;
  border-radius: 5px;
	border: solid #8C0E0E;
	color: #8C0E0E;
	transition: 400ms;
}
nav li:hover{
	display: inline;
	padding-top: 20px;
	padding-right: 25px;
	padding-bottom: 20px;
	padding-left: 25px;
	margin: 20px;
	border: solid #8C0E0E;
	border-radius: 10px;
	background-color: #8C0E0E;
	color: white;
	transition: 400ms;
}
#abholen:not(:hover){
  padding: 10px;
  color: #FF6600;
  background-color: black;
  border-radius: 10px;
}
#abholen:hover{
  padding-left: 20px;
  padding-right: 20px;
  color: black;
  background-color: #FF6600;
  border-radius: 10px;
}
#text:not(:focus){
  transition: all 2s;
  border-radius: 5px;
	background-color: rgba(140, 14, 14, 0.89);
  text-align: center;
  font-family: Century Gothic, sans-serif;
  font-weight: bold;
}
#text:focus{
  padding-bottom: 100px;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 20px;
  transition: all 2s;
  border-radius: 10px;
	background-color: rgba(140, 14, 14, 0.68);
  text-align: center;
  font-family: Century Gothic, sans-serif;
  font-weight: bold;
	outline: 0;
}form{
    text-align: center;
}
#animation:not(:active){
  width: 150px;
  height: 150px;
	background-color: rgba(255, 0, 0, 0.49);
  margin: 0 auto;
  animation-name: move;
  border-radius: 15px;
	animation-duration: 1s;
  animation-direction: alternate-reverse;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
	animation-timing-function: ease-in;
  animation-play-state: running;
}
#animation:active{
  width: 150px;
  height: 150px;
	background-color: rgba(255, 0, 0, 0.49);
  margin: 0 auto;
  animation-name: move;
  border-radius: 15px;
  animation-duration: 1s;
  animation-direction: alternate-reverse;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
	animation-timing-function: ease-in;
  animation-play-state: paused;
}
@keyframes move{
   0%{
   padding: 0px;
	border: 5px dashed green;
   }10%{
      padding: 5px;
		border: 5px dashed green;
	}30%{
         padding: 10px;
			border: 5px dashed green;
   }50%{
            padding: 30px;
            background-color: rgba(0, 0, 255, 0.57);
				border: 5px dotted green;
   }70%{
         	  padding: 40px;
				  border: 5px dashed green;
   }100%{
			      padding: 50px;
					border: 5px dashed green;
	}
   }
#farben{
  background-color: rgba(0, 0, 0, 0.71);
}
#farben2{
  background-color: rgba(255, 255, 255, 0.71);
  color: black;
}
#sendesamu:not(:hover){
	background-color: rgba(255, 255, 255, 0.71);
  border-radius: 15px;
  color: rgb(83, 83, 83);
  font-family: Century Gothic, sans-serif;
  font-weight: bold;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 5px;
  padding-top: 5px;
  transition: all 1s;
}
#sendesamu:hover{
	background-color: #8C0E0E;
  border-radius: 10px;
  color: rgba(255, 255, 255, 0.71);
  font-family: Century Gothic, sans-serif;
  font-weight: bold;
  transition: all 1s;
  padding-right: 20px;
  padding-left: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: bold;
  font-size: 20px;
	transform: rotateX(90deg);
}
#border:hover{
  animation-name: wechsel;
  animation-direction: alternate-reverse;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
}
#gif{
  margin: 0 auto;
  width: 400px;
  display: block;
  border-radius: 15px;
}
#weiterlinks{
  margin-right: 100px;
  margin-left: 310px;
}
input:not(:focus){
  background-color: rgba(40, 220, 235, 0.66);
  transition: all 1s; 
	box-shadow: 0px 0px 14px rgb(255, 0, 0);
	color: #14FF64;
	font-size: 20px;
}
input:focus{
  background-color: rgba(48, 168, 155, 0.29);
  border-radius: 10px;
  transition: all 1s;
	box-shadow: 0px 0px 14px #39FF14;
	color: #ff0000;
	font-size: 20px;
	outline: 0;
}
button:not(:active){
	background-color: rgba(40, 220, 235, 0.66);
  border-radius: 5px;
	padding: 2px;
  box-shadow: 10px 10px 20px 10px;
}
button:active{
	background-color: rgba(48, 168, 155, 0.29);
  border-radius: 5px;
	padding: 2px;
  box-shadow: 10px 10px 20px 10px;
}
#checkbox{
  margin: 0 auto;
  width: 0px;
  border: 0px;
}
input::-webkit-input-placeholder{
	color: darkred !important;
}
#css:not(:hover){
	color: red;
	padding: 100px;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 50px;
	margin-left: 100px;
	margin-right: 100px;
	border-radius: 20px;
	border-radius: 5px;
	background-image: url(bilder/Unbenannt.PNG);
	box-shadow: 0px 0px 200px #ff0000;
	background-size: 100% auto !important;
}
#css:hover{
	padding: 100px;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 50px;
	margin-left: 100px;
	margin-right: 100px;
	border-radius: 20px;
	border-radius: 5px;
	animation-name: entwickler;
	animation-direction: alternate-reverse;
	animation-duration: 2s;
	animation-fill-mode: forwards;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	background-size: 100% auto !important;
	background-position: fixed;
}
@keyframes entwickler{
	from{
		box-shadow: 0px 0px 200px #23ff32;
		background-image: url(bilder/Unbenannt2.PNG);
		transform: rotateY(20deg);
		color: greenyellow;
		background-size: 100% auto !important;
	}to{
		box-shadow: 0px 0px 200px #ff0000;
		background-image: url(bilder/Unbenannt.PNG);
		transform: rotateY(0deg);
		color: red;
		background-size: 100% auto !important;
	}
}