body {
	font-family: Arial,sans-serif;
	margin-t0p:0px;
}


i {
	pointer-events: none;
}

/*
 * Ajax Loading Spinner ;-)
 */
.loader {
  border: 10px solid #9f97FC;
  border-radius: 50%;
  border-top: 10px solid #9f97FC;
  width: 60px;
  height: 60px;
  -webkit-animation: spin 1s linear infinite; /* Safari */
  animation: spin 1s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
#loadingDiv {
	position:absolute;
	top:50%;
	left:50%;
	z-index:1;
}

/*
 * Menue
 */
 
 #menue {
	border-bottom: 2px solid #ccc;
	position: fixed;
	top: 0;
	left: 0px;
	width: 100%;
	background-color: white;
	z-index: 10000;
	padding-top: 1em;
	padding-bottom: 1em;
	min-height: 50px;
}

#menue #navMenue {
	margin-left: 120px;
margin-right: 1em;
margin-top: 8px;
}

#menueButtons { display: flex; }

#menueButtons a {
  flex-grow: 1;
  flex-basis: 0;
  padding: 10px;
  text-decoration: none;
  text-align: center;
}

#navMenue label, #hamburger { display: none; }

/*
#menue #navMenue #homeButton {
	position: absolute;
	right: 20.5em;
	top: 0.5em;
	
}

#menue #navMenue #aboutButton {
	position: absolute; 
	right: 11.5em;
	top: 0.5em;
	
}
#menue #navMenue #contactButton {
	position: absolute;
	right: 0.5em;
	top: 0.5em;
	
}

*/

#menue #logo {
	display: block;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: absolute;
	left: 0.5em;
	top:1em;
	background: url(../images/logoT.png) no-repeat;
	width: 100px; /* Width of new image */
	height: 50px; /* Height of new image */
	
}

#menue .active {
	color: #fff;
}



/*
 *  Home
 */
 
 #homeText  {
 
	padding-left: 10%;
	top: 1em;
	padding-top: 70px;
}



/*
 * About
 */
 

 #aboutInfoText  {
 
 	padding-left: 10%;
 	top: 1em;
 	padding-top: 70px;
 }
 
 /*
 * Contact
 */
 
 #contact {
 
 padding-left: 10%;
 padding-top: 70px;
 }
 
 #contact #mailAdress {
 
 width: 20em;
 }
 
 #contact #mailText {
 
 width: 90% ;
 left:50%;
 height: 10em;
 
 }

 /*
 * Dark Pattern
 */
 #darkPattern  {
 
	padding-left: 10%;
	top: 1em;
	padding-top: 70px;
}

/*
* Gamedesign Guide 30+
*/

#gamedesignGuide  {
 
	padding-left: 10%;
	top: 1em;
	padding-top: 70px;
}


  /*
  *=============================================================================================================
  * For mobile dives 
  *=============================================================================================================
 */
 
 @media  only screen and (max-width: 820px) {
 
 /*
 * Menue
 */
#menueButtons a {
    box-sizing: border-box;
    display: block;
    width: 100%;
    border-top: 1px solid #333;
  }
  
  #navMenue label { 
    display: inline-block; 
    color: 536938;
	background: #9f97FC;
    font-style: normal;
    font-size: 1.2em;
    padding: 10px;
    right: 0.9em;
	position: absolute;
	top: 1em;
	cursor: pointer;
  }
  
  #menueButtons { 
  	display: none;
  	margin-top: 3em;
 }
  
  #navMenue input:checked ~ #menueButtons { display: block; }
 
 /*
 *  Home
 */
 
 #translator {
	margin-top: 60px;
}
#translator #toTranslate {
	clear: both;
	width: 95% ;
	margin-top: 2em;
	
}
#translator textarea {
	width: 100% ;
	height: 10em;
}

#translator #dtranslateButton {
	clear: both;
	position: relative;
	left: 50%;
	margin-left:-50px;
	width: 20% ;
	height: 2em;
	margin-top: 1em;
}

#translator #dtranslateButton #btnBackground {
	width: 140px;
	height: 50px;
	background-color: #9f97FC ;
	position: relative;
	margin-left:-70px;
	left: 50%;
	top: 60%;
	margin-top: -35px;	
	text-align: center;
}

#translator #dtranslateButton #translateButton{	
	display: block;
	width: 140px;
	cursor: pointer;
	text-align: center;
	line-height: 55px;
	
}
#translator #dtranslateButton #translateButton:hover {
	background-color: #9f97FC;
	height: 50px;
}




#translator #result {
	clear: both;
	width: 95% ;
	margin-top: 2em;
}

#helpVideo {
	clear: both;
}
 
 
  /*
 * Contact
 */
 
  #contact {
 
 padding-left: 5%;
 }
 
 /*
 * About
 */
 
 #aboutInfoText  {
 
 	padding-left: 5%;
 	top: 1em;
 }
 
 
 
 }