body {
			margin: 0;
			padding: 0;
			font-family: 'Comic Sans MS', 'Comic Sans', cursive;
		}
		#loader {
			display: none;
			position: absolute;
			width: 100%;
			text-align: center;
			margin-top: 2%;
		}
		#loader img {
			animation: loadAn 1.5s infinite linear;
		}
		@keyframes loadAn {
  			from {
   				transform: rotate(0deg);
  			}
  			to {
				transform: rotate(359deg);
			}
		}
		#spFl {
			/*background-image: url(../bilder/grillspiel_bild_0.gif);
			/*background-image: url(grillspiel_bild.jpg);*/
			background-size: 100% auto;
			position: relative; 
			width: 800px; 
			height: 417px;
			margin: auto;
			display: none;
			overflow: hidden;
		}
		#bg {
			display: block;
			width: 100%;
			user-select: none; 
			-drag: none; 
			-moz-user-select: none; 
			-webkit-user-drag: none; 
			-webkit-user-select: none;
		}
		#titel {
			margin: auto;
			width: 250px;
			padding: 1.4% 0.75% 0.75% 0.75%;
			visibility: hidden;
			text-align: center;

		}
		#titel img {
			width: 100%;
		}
		#titel p {
			font-size: 1.2em;
			margin: 0em;
			color: #aaa;
			display: none;
		}
		#starten, #ende {
			position: absolute;
			width: 20%;
			left: 40%;
			top: 18%;
			display: none;
		}
		#ende {
			top: 8%;
			z-index: 12;
		}
		#starten img, #ende img {
			width: 90%;
			padding: 5%;
		}
		#tilt {
			display: none;
			position: absolute;
			z-index: 101;
		}
		#tilt img {
			width: 50%;
		}
		#herstP0, #herstP1, #herstP2 {
			position: absolute;
			left: 48.5%;
			top: 57%;
			width: 27%;
			height: 34.5%;
			/*background-color: #aaa;
			opacity: 0.6;*/
		}
		#herstP1 {
			left: 12%;
			top: 55.25%;
			width: 24.25%;
			height: 39.75%;
		}
		#herstP2 {
			left: 75.25%;
			top: 49.5%;
			width: 19.75%;
			height: 40.5%;
			/*background-color: #aaa;
			opacity: 0.6;*/
		}
		#prd_3_0 {
			z-index: 30;
		}
		#prdx0, .wurst, #prdx1, .pommes, #prdx2, .getraenk {
			position: absolute;
			left: 34%;
			top: 60.5%;
			width: 7%;
			padding: 4% 6% 4% 5%;
			opacity: 0;
			pointer-events: auto;
			/*touch-action: none;*/
		}
		#prdx1, .pommes {
			left: 0%;
			top: 40%;
			width: 6%;
		}
		#prdx2, .getraenk {
			opacity: 0.0;
			left: 89%;
			top: 30.25%;
			width: 5.2%;
			padding: 4% 3% 4% 3%;
			/*background-color: #aaaaaa;*/
		}
		#prod3_0 {
			z-index: 20;
		}
		.wurstW, .pommesW, .getrW  {
			position: absolute;
			width: 6%;
			display: none;

		}
		.getrW {
			left: 85.5%;
			top: 71.5%;
			width: 5.5%;
			height: 26%;
			display: none;
		}

		.wurstW img, .pommesW img, .getrW img {
			position: absolute;
			width: 100%;
		}
		.wurstW img:nth-of-type(2), .pommesW img:nth-of-type(2) {
			opacity: 0;
			animation-name: wurstAn;
  			animation-duration: 16s;
  			animation-fill-mode: forwards;
  			animation-delay: 0s;
		}
		.wurstW img:nth-of-type(3), .pommesW img:nth-of-type(3) {
			opacity: 0;
			animation-name: wurstAn;
  			animation-duration: 30s;
  			animation-fill-mode: forwards;
  			animation-delay: 10s;
		}
		.wurstW img:nth-of-type(5), .pommesW img:nth-of-type(5), .getrW img:nth-of-type(5) {
			position: absolute;
			width: 80%;
			height: auto;
			left: 0;
			animation-name: sternAn;
  			animation-duration: 1s;
  			animation-iteration-count: 400;
  			animation-fill-mode: forwards;
		}
		.pommesW img:nth-of-type(5) {
			right: 0;
			top: 0;
			margin-left: 40%;
			/*padding-top: 100%;*/
		}
		.getrW img:nth-of-type(5) {
			right: 0;
			top: 0;
			margin-left: -19%;
			padding-top: 70%;
		}
		
		.getrW img {
			width: 100%;
			position: absolute;
		}
		.getrW img:nth-of-type(2) {
			display: block;
			opacity: 1;
			top: 0;
			height: 1%;
			margin-top: 100%;
			width: 80%;
			animation-name: getrAn;
  			animation-duration: 3s;
  			animation-fill-mode: forwards;
  			animation-delay: 0s;
		}

		.getrW img:nth-of-type(4) {
			opacity: 0;
			display: none;
			animation-name: wurstAn;
  			animation-duration: 1.5s;
  			animation-fill-mode: forwards;
  			animation-delay: 1.2s;
			
		}
		.trG {
			display: none;
			position: absolute;
			width: 8.6%;
 			top: 14.8%;
 			opacity: 0.6;
		}
		
		.spBlW, .spBlU {
			position: relative; 
			z-index: 10;
		}
		.spBlW img, .spBlU img {
			position: absolute;
			display: none;
		}
		/*.spBlU img {
			width: 19%;
		}*/
		.spBlx {
			display: none;
			position: absolute;
			width: 18.5%;
		}
		.spBlx img {
			width: 100%;
			user-select: none; 
			-drag: none; 
			-moz-user-select: none; 
			-webkit-user-drag: none; 
			-webkit-user-select: none;

		}
		#muell {
			display: none;
			position: absolute;
			top: 69.5%;
			left: 1.88%;
			width: 10.4%;
		}
		#muell img {
			width: 100%;
		}
		#kundenGes {
			position: absolute;
			width: 61.5%;
			background-color: blue;
			left: 14.5%;
			top: 26.25%;
			opacity: 1;
		}
		#blasen {
			position: absolute;
			width: 77%;
			background-color: blue;
			left: 5.5%;
			top: 2.25%;
			opacity: 1;
			pointer-events: none;
		}
		.kdRg {
			display: none;
		}
		.kdRg div {
			position: absolute; 
			width: 18.5%;
			background-color: transparent;

			user-select: none; 
			-drag: none; 
			-moz-user-select: none; 
			-webkit-user-drag: none; 
			-webkit-user-select: none;
		}
		.kdRg img {
			width: 100%;
			user-select: none; 
			-drag: none; 
			-moz-user-select: none; 
			-webkit-user-drag: none; 
			-webkit-user-select: none;
		}
		#kdWuensche, #kdWuenscheO, #kdWuenscheU {
			display: flex;
			justify-content: space-between; 
			z-index: 10; 
			width: 77.5%;
			height: 5%;
			position: absolute; 
			left: 5.5%; 
			top: 11.4%;
			/*background-color: #aaa;
			opacity: 0.6;*/
		}
		#kdWuenscheO, #kdWuenscheU {
			left: 11%;
			top: 5.3%;
			width: 68%;
		}
		#kdWuenscheU {
			left: 10%;
			top: 17.5%;
		}
		#kdWuensche div, #kdWuenscheO div, #kdWuenscheU div {
			padding: 0;
			position: relative;
			width: 5.5%;
			text-align: center;
			/*background-color: #bbb;
			opacity: 0.5;*/
		}
		#kdWuenscheO div, #kdWuenscheU div {
			width: 6.27%;
		}
		#kdWuensche img, #kdWuenscheO img, #kdWuenscheU img {
			display: block;
			opacity: 0;
			padding-left: 25%;
			position: absolute;
			user-select: none; 
			-drag: none; 
			-moz-user-select: none; 
			-webkit-user-drag: none; 
			-webkit-user-select: none;

			animation-name: bestAn;
  			animation-duration: 1.2s;
  			animation-iteration-count: 1200;
  			animation-fill-mode: forwards;
		}

		.tgEinn {
			rotate: 11deg;
			position: absolute;
			left: 80.5%;
			top: 35%;
			width: 10.2%;
		}

		.zahlW {
			position: absolute;
			top: 0%;
			width: 20%;
		}
		.zahlW img {
			position: absolute;
			width: 100%;
			display: none;
		}

		#finishShield {
			background-color: transparent;
			display: none;
			z-index: 99;
			position: absolute;
			width: 57.2%;
			left: 21.4%;
			top: 42.25%;
			font-size: 1.15em;
			line-height: 117.5%;
			text-align: center;
			margin: 0;
			padding: 0;
		}
		#finishShield .rhm {
			clear: both; 
			width: 100%;
			height: auto;
			margin: 0;
			padding: 0;
			background-color: transparent;
			display: block;
		}
		#finishShield .fCont {
			display: none;
			box-sizing: border-box;
			border-left: 0.25em solid black;
			border-right: 0.3em solid black;
			background-color: white;
			margin: 0;
			padding: 0;
			width: 100%;
			position: relative;
		}
		#finishShield p {
			background-color: white;
			/*display: none;*/
			margin: 0;
			padding: 2%;
			padding-top: 0;
			width: 96%;
			border-left: 5% solid black;
		}
		#finishShield img {
			display: inline-block;
		}
		#finishShield input {
			margin: 0;
			width: 100%;
			margin-bottom: 0;
			background-color: transparent;
			border: none;
			font-size: 1em;
			text-align: center;
			font-family: 'Comic Sans MS', 'Comic Sans', cursive;
		}
		#finishShield input:focus {
			outline: none;
		}
		#finishShield .okT {
			display: none;
		}
		#finishShield .formBeh {
			/*display: none;*/
			width: 50%;
			float: left;
			text-align: center;
		}
		#finishShield .formBeh.breit {
			width: 66%;
		}
		#finishShield .formBeh div, #finishShield .formBeh.breit div {
			box-sizing: border-box;
			margin-left: 0; 
			width: 100%; 
			height: 1.93em; 
			padding: 1.75% 0 1.75% 0; 
			background-image: url('../bilder/input_hg_grau.gif'); 
			background-size: auto 100%;
			background-repeat: no-repeat;
			background-position: center center;
			margin-bottom: 2%;
		}
		#finishShield .formBeh.breit div {
			height: 1.89em; 
			background-image: url('../bilder/input_hg_grau_breit.gif'); 
		}
		.fCont p.blMod {
			margin: 0;
			display: inline-block;
			float: left;
			width: auto;
			font-size: 0.8em;
			font-weight: bold;
			line-height: 105%;
			background-color: yellow;
		}
		@keyframes wurstAn {
  			from {opacity: 0;}
  			to {opacity: 0.95;}
		}

		@keyframes bestAn {
  			0%   {width: 57%; margin-top: 0; margin-left: 0;}
  			50%  {width: 52%; margin-top: 5%; margin-left: 2%;}
  			100% {width: 57%; margin-top: 0; margin-left: 0;}
		}

		@keyframes sternAn {
  			0%   {width: 40%; left: 5%; margin-top: 8%;}
  			50%  {width: 94%; left: -22%; margin-top: -12%;}
  			100% {width: 40%; left: 5%; margin-top: 8%;}
		}

		@keyframes getrAn {
  			from {height: 1%; margin-top: 100%; width: 81%;}
  			to {height: 45%; margin-top: -0.0%; width: 100%;}
		}