body {
	position:relative;
	border-radius:0px;
	box-shadow:black 0px 0px 2px;
/*	background: #004800; */
	margin:0px auto;
	border:solid 0px black;
	font-family: arial, sans-serif;
	padding:0px;
    width: 100%;
    height: 100%;
	overflow: hidden;
	user-select: none;
}

#conference {
	position: absolute;
	left: calc(100% - 375px);
	top: 5px;
	width: 240px;
	height: 130px;
	background-color: darkblue;
	z-index: 100000;
	display: block;
}

#card-table {
	background-color:#004800;
    width: 100%;
    height: 100%;
}
.card {
	border-radius: 12px;
	box-shadow: -2px 0px 2px blue;
	-moz-box-shadow: -2px 0px 2px black;
	-webkit-box-shadow: -2px 0px 2px black;
}
#buttons {
	text-align:center;
}

a img {
	position: absolute;
	top: 0;
	right: 0;
	border: 0;
}
a:hover {
 cursor:pointer;
}
button {
    width:100px;
	height:30px;
	/*box-shadow:inset 0px -3px 7px 0px #29bbff;*/
	background:linear-gradient(to bottom, #2dabf9 5%, #1E62D0 100%);
	background-color:#2dabf9;
	border-radius:3px;
	border:1px solid #0b0e07;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:12px;
	font-weight:bold;
	padding:1px 1px;
	text-decoration:none;
	text-shadow:0px 1px 0px #263666;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
.tarock-small {
	font-size:12px;
}
.tarock-middle {
	font-size:14px;
}
.tarock-big {
	font-size:16px;
}
button1 {
	color: white;
	height:30px;
	width:100px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	box-shadow: 1px 1px 1px 2px #56DDEE;
	background-color: #004800;
}
button:disabled {
   background-color: #2dabf9;
   opacity: 0.6;
   cursor: not-allowed;
   color:white;
}
button:hover {
  color:black;
  background-color:#5ae4ff;
}
button.platzNehmen {
	color: white;
	height:30px;
	width:40px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	font-size: 10px;
	background: url('./img/chair.png');
	background-repeat: no-repeat;
	background-position: center;
	/*box-shadow: 1px 1px 1px 2px #0e3fa1;
	background-color: #5e8deb;*/
	box-shadow: 1px 1px 1px 2px #cfcfcf;
	background-color: #cfcfcf;
}
button.setFriend {
	color: white;
	height:20px;
	width:20px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 0px;
	border: 0px;
	font-size: 10px;
	box-shadow: 0px;
	background: url('./img/nofriend.png');
	background-repeat: no-repeat;
	background-position: center;
	background-color: transparent;
}
button.unSetFriend {
	color: white;
	height:20px;
	width:20px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 0px;
	border: 0px;
	font-size: 10px;
	box-shadow: 0px;
	background: url('./img/friend.png');
	background-repeat: no-repeat;
	background-position: center;
	padding: 3px;
}
button.deleteTable {
	height:30px;
	width:27px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	/*box-shadow: 1px 1px 1px 2px #ad1025;*/
	background: url('./img/delete_table.png');
	background-repeat: no-repeat;
	background-position: center;
}
button.gotoLobby {
	color: white;
	height:30px;
	width:150px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	font-size: 10px;
	box-shadow: 1px 1px 1px 2px #0e3fa1;
	background: url('./img/chair.png');
	background-color: #5e8deb;
	background-repeat: no-repeat;
	background-position: center;
}
button.messageCall {
	height:30px;
	width:39px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	background: url('./img/message.png');
	background-repeat: no-repeat;
	background-position: center;
}

button.makeNewTable {
	color: white;
	height:50px;
	width:83px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	box-shadow: 1px 1px 1px 2px #114991;
	background: url('./img/table.png');
	background-color: #111a8f;
	background-repeat: no-repeat;
	background-position: center;
}

button.turnier {
	color: white;
	height:50px;
	width:50px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	box-shadow: 1px 1px 1px 2px #114991;
	background: url('./img/tournament.png');
	background-color: #ffffff;
	background-repeat: no-repeat;
	background-position: center;
}

button.turnierJoin {
	color: white;
	height:30px;
	width:30px;
	box-sizing: border-box;
	text-decoration:none;
	text-align:center;
	border-radius: 8px;
	box-shadow: 1px 1px 1px 2px #114991;
	background: url('./img/tournament_join.png');
	background-color: #ffffff;
	background-repeat: no-repeat;
	background-position: center;
}

button.noBG {
	border-radius: 0px;
	box-shadow: 0px 0px 0px 0px #ffffff;
}

.resetpoints {
	height:50px;
	width:50px;
	background: url('./img/paperbin.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px 0px 0px #fffdbe;
	background-color: #fffdbe;
}
.resetpoints:disabled {
   background-color: #fffdbe;
}
.seepoints {
	height:50px;
	width:50px;
   background: url('./img/document.png');
   background-repeat: no-repeat;
   border: none;
   box-shadow: 0px 0px 0px 0px #fffdbe;
   background-color: #fffdbe;
}
.highscore {
	height:50px;
	width:50px;
   background: url('./img/highscore.png');
   background-repeat: no-repeat;
   border: 2px solid #4CAF50;
   box-shadow: 0px 0px 0px 0px #fffdbe;
   background-color: #fffdbe;
}
button.weiter {
	background:linear-gradient(to bottom, #18ab5f 5%, #1E62D0 100%);
   background-color: #18ab5f;
}
.save {
	height:40px;
	width:40px;
   margin:0px;
   padding:0px;
   background: url('./img/save.png');
   background-repeat: no-repeat;
   border: 0pt solid #515151;
   box-shadow: -1px -1px #515151, 1px 1px #515151, 2px 2px #828282;
   background-color: #fffdbe;
}
#strategy_add {
	height:30px;
	width:30px;
   margin:0px;
   padding:0px;
   background: url('./img/new.png');
   background-repeat: no-repeat;
   border: 1pt solid #515151;
   box-shadow: -1px -1px #515151, 1px 1px #515151, 2px 2px #828282;
   background-color: #fffdbe;
}
#strategy_copy {
	height:30px;
	width:30px;
   margin:0px;
   padding:0px;
   background: url('./img/copy.png');
   background-repeat: no-repeat;
   border: 1pt solid #515151;
   box-shadow: -1px -1px #515151, 1px 1px #515151, 2px 2px #828282;
   background-color: #fffdbe;
}
#strategy_delete {
	height:30px;
	width:30px;
   margin:0px;
   padding:0px;
   background: url('./img/delete.png');
   background-repeat: no-repeat;
   border: 1pt solid #515151;
   box-shadow: -1px -1px #515151, 1px 1px #515151, 2px 2px #828282;
   background-color: #fffdbe;
}
#strategy_save {
	height:30px;
	width:30px;
   margin:0px;
   padding:0px;
   background: url('./img/save_s.png');
   background-repeat: no-repeat;
   border: 1pt solid #515151;
   box-shadow: -1px -1px #515151, 1px 1px #515151, 2px 2px #828282;
   background-color: #fffdbe;
}
#strategy_import {
	height:30px;
	width:30px;
   margin:0px;
   padding:0px;
   background: url('./img/import.png');
   background-repeat: no-repeat;
   border: 1pt solid #515151;
   box-shadow: -1px -1px #515151, 1px 1px #515151, 2px 2px #828282;
   background-color: #fffdbe;
}
#strategy_export {
	height:30px;
	width:30px;
   margin:0px;
   padding:0px;
   background: url('./img/export.png');
   background-repeat: no-repeat;
   border: 1pt solid #515151;
   box-shadow: -1px -1px #515151, 1px 1px #515151, 2px 2px #828282;
   background-color: #fffdbe;
}
img.preload {
	display:none;
}
#languageDe {
	height:35px;
	width:35px;
   background: url('./img/de.png');
   background-repeat: no-repeat;
   box-shadow: 0px 0px;
}
#languageEn {
	height:35px;
	width:35px;
   background: url('./img/en.png');
   background-repeat: no-repeat;
   box-shadow: 0px 0px;
}
#showRules {
	height:20px;
	width:35px;
   background: url('./img/arrow.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
}
#showUtilities {
	height:20px;
	width:35px;
   background: url('./img/arrow.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
}
#multiPlayerTables {
   display:none;
	position:fixed;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   top: calc(15%);
   left: calc(50% - 330px);
   min-height: 10%;
   max-height: 80%;
   width: 660px;
   /*background:#FFF;*/
   margin:5px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   font-size: 10pt;
   padding:5px;
   overflow: auto;
   overflow-x: auto;
   background-color:#fffdbe;
   z-index: 10101;
}
@media only screen and (max-width: 768px) {
	#multiPlayerTables {
		left: 5px;
        width: calc(100% - 60px);
        top: 5px;
        min-height: 40%;
        max-height: calc(100% - 10px);
	}
}
#multiPlayerTables td {
	font-size: 10px;
	height: 30px;
}

#navleft {
	height:20px;
	width:35px;
   left:5px;
   background: url('./img/navleft.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#navleft2 {
	height:20px;
	width:35px;
   left:5px;
   background: url('./img/navleft.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#navright {
	height:20px;
	width:35px;
   left: 100%;
   background: url('./img/navright.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#navright2 {
	height:20px;
	width:35px;
   left: 100%;
   background: url('./img/navright.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#rulesReset {
	height:30px;
	width:30px;
   background: url('./img/reset.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#resetNames {
	height:20px;
	width:20px;
   background: url('./img/reset.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#saveGamePoint {
	height:25px;
	width:25px;
   background: url('./img/ok.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#savePraemiePoint {
	height:25px;
	width:25px;
   background: url('./img/ok.png');
   background-repeat: no-repeat;
   background-position: center;
   box-shadow: 0px 0px;
   border: 0pt;
}
#speedReset {
   color: black;
   background-color:#fffdbe;
   width: 65px;
}
.speedButton {
   color: black;
   background-color:#fffdbe;
   width: 45px;
   height: 40px;
}
h1 {
	font-size:60px;
	text-align:center;
	padding:0px;
	margin:10px auto;
}

a:visited {color:blue;}

footer {
	font-size : 12px;
	color:grey;
	margin:8px;
}

footer a, footer a:visited{
	color:grey;
}

footer a:hover {
	color:black;
}
footer td {
	font-size: 12px;
	color: grey;
}

#deal {
	position: fixed;
	left:calc(90%);
	width: 50px;
	top:20px;
	display: none;
}
#script {
	position: fixed;
	right: 10px;
	width: 30px;
	height: 30px;
	top: 240px;
	background: url('./img/script.png');
	background-repeat: no-repeat;
	border: none;
}
#manuell {
	position: fixed;
	right: 10px;
	width: 30px;
	height: 30px;
	top: 200px;
	background: url('./img/manual_mode.png');
	background-repeat: no-repeat;
	border: none;
}
#editor {
	position: fixed;
	right: 50px;
	width: 30px;
	height: 30px;
	top: 200px;
	background: url('./img/editor.png');
	background-repeat: no-repeat;
	border: none;
}
#undo {
	position: fixed;
	right:50px;
	top: 45px;
	width: 30px;
	height: 30px;
	background: url('./img/undo.png');
	background-repeat: no-repeat;
	border: none;
	z-index:21000;
}
#reset {
	position: fixed;
	left:calc(100% - 120px);
	width: 70px;
	top:5px;
	z-index: 21000;
}
#fertig {
	position: absolute;
	left:calc(100% - 120px);
	width: 70px;
	top:45px;
	z-index: 21000;
}
#repeat {
	position: fixed;
	right:90px;
	top: 45px;
	width: 30px;
	height: 30px;
	background: url('./img/repeat.png');
	background-repeat: no-repeat;
	border: none;
	z-index:21000;
}
#karten {
	position: fixed;
	left:calc(100% - 80px);
	width: 30px;
	height: 30px;
	top:240px;
	background: url('./img/cards.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#analyse {
	position: fixed;
	left:calc(100% - 40px);
	width: 30px;
	height: 30px;
	top:240px;
	background: url('./img/analysis.png');
	background-repeat: no-repeat;
	border: none;
	z-index:21000;
}
#newdeal {
	position: fixed;
	left:calc(100% - 150px);
	width: 100px;
	top:5px;
	z-index:21001;
}
#spielExport {
   width: 80px;
}
#spielImport {
   width: 80px;
}
#spielImportFilterOk {
   color: black;
   background-color:#fffdbe;
   width: 80px;
}
#deleteAIdata {
   color: black;
   background-color:#fffdbe;
   width: 40px;
}
#exportAIdata {
   color: black;
   background-color:#fffdbe;
   width: 50px;
}
#importAIdata {
   color: black;
   background-color:#fffdbe;
   width: 50px;
}
#logfile {
	width: 40px;
	height:40px;
	background: url('./img/logfile.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px 0px 0px #004800;
}
#exportVariante {
	width: 30px;
	height:30px;
	background: url('./img/rules_save.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px 0px 0px #004800;
}
#importVariante {
	width: 30px;
	height:30px;
	background: url('./img/rules_load.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px 0px 0px #004800;
}
#dataview {
	width: 40px;
	height:40px;
	background: url('./img/ai.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px 0px 0px #004800;
}
#strategyview {
	width: 40px;
	height:40px;
	background: url('./img/strategy.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px 0px 0px #004800;
}

#gameButtons {
	position: fixed;
	right: 5px;
    width: 35px;
    top: 0px;
}
/*
#exitapp {
	position: absolute;
	left:calc(100% - 45px);
	width: 45px;
	height: 30px;
	top:40px;
	z-index: 10000;
	background: url('./img/exitApp.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}*/
#toggle-menu {
	position: relative;
	width: 30px;
	height: 15px;
	top: 75px;
	z-index: 10000;
	background: url('./img/arrowup.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#config {
	position: relative;
	width: 30px;
	height: 30px;
	top: 50px;
	z-index: 10000;
	background: url('./img/config.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#info {
	position: relative;
	width: 30px;
	height: 30px;
	top:10px;
	background: url('./img/info.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#tableInfosDiv {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	height: 100px;
	width: 120px;
	top: calc(100% - 200px);
	left: calc(100% - 135px);
	color: darkgrey;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	font-size: 8pt;
	padding:5px;
	overflow: hidden;
	background-color:#fffdbe;
	z-index: 10001;
}

#tableInfos {
	position: absolute;
	left:calc(100% - 35px);
	width: 30px;
	height: 30px;
	top:calc(100% - 35px);
	background: url('./img/table_info.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:1000;
}
#multiplayer {
	position: relative;
	width: 30px;
	height: 30px;
	top:90px;
	background: url('./img/multiplayer.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#tutorial {
	position: relative;
	width: 30px;
	height: 24px;
	top:130px;
	background: url('./img/tutorial.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#onlineAlarm {
	position: relative;
	width: 30px;
	height: 25px;
	top:150px;
	background: url('./img/alarm_blau.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#donate {
	position: relative;
	width: 30px;
	height: 25px;
	top:150px;
	background: url('./img/heart_red.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px ;
	z-index:21000;
}
#infoclose {
	position: absolute;
	width: 30px;
	height: 30px;
	top:10px;
	left: calc(100% - 35px);
	background: url('./img/close.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px;
}

#tutorialclose {
	position: sticky;
    top: 10px;
    left: calc(100%);
    width: 30px;
	background: url('./img/close.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px;
}
#tablesclose {
	width: 30px;
	height: 30px;
	background: url('./img/close.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px;
}

#tablesclose_helper {
	position: relative;
	float: right;
	z-index: 15000;
}
#strategyclose {
	position: relative;
	width: 30px;
	height: 30px;
	top:0px;
	background: url('./img/close.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px;
}
#infoscreenclose {
	position: relative;
}
#verlauf {
	position: relative;
	top:10px;
	left:10px;
	width: 150px;
}

#spieleBG {
   position: absolute;
   width: 245px;
   height: 360px;
   top: 0px;
   left: 5px;
   display: inline-block;
   border-radius:8px;
/*   background-color:#004800;
 	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75); */
   display:none;
   z-index: 9999;
}
#praemienBG {
   position: absolute;
   width: 360px;
   height: 210px;
   top: 0px;
   left: 5px;
   border-radius:8px;
   display: inline-block;
   display:none;
   background-color: transparent;
   z-index: 9999;
}
#trischakenWahl {
   position: absolute;
   color: white;
   width: 150px;
   height: 50px;
   top: 0px;
   left: 5px;
   border-radius:8px;
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   display: inline-block;
   display:none;
   background-color: #026b02;
   z-index: 9999;
}
#vorhandWahl {
	position: absolute;
	color: white;
	/*width: 250px;
	height: 50px;*/
	top: 30px;
	left: 5px;
	padding: 5px;
	border-radius:8px;
	 box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	display: inline-block;
	display:none;
	background-color: #026b02;
	z-index: 9999;
 }

#koenigeBG {
	position: absolute;
	width: 34%;
	height: 25%;
	top: 5%;
	left: 31%;
	background-color:#004800;
	display: inline-block;
	border-radius:8px;
	padding-top: 5px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	display:none;
	z-index: 19999;
}
#rufer {
	position: absolute;
	left:10px;
	top:5px;
}
#trischaken {
	position: absolute;
	left:10px;
	top:45px;
}
#sechserdreier {
	position: absolute;
	left:10px;
}
/*#zwiccolo {
	position: absolute;
	left:10px;
	top:125px;
   z-index: 10000;
}
#piccolo {
	position: absolute;
	left:10px;
	top:165px;
	z-index: 10000;
}
#solorufer {
	position: absolute;
	left:10px;
	top:205px;
	z-index: 10000;
}
#farbensolorufer {
	position: absolute;
	font-size: 12px;
	left:10px;
	top:205px;
   z-index: 10000;
}
#besserrufer {
	position: absolute;
	left:10px;
	top:245px;
   z-index: 10000;
}
#pagatrufer {
	position: absolute;
	left:10px;
	top:5px;
   z-index: 10000;
}
#bettler {
	position: absolute;
	left:10px;
	top:325px;
   z-index: 10000;
}
#uhurufer {
	position: absolute;
	left:10px;
	top:5px;
   z-index: 10000;
}
#farbendreier {
	position: absolute;
	left:130px;
	top:5px;
   z-index: 10000;
}
#dreier {
	position: absolute;
	left:130px;
	top:45px;
   z-index: 10000;
}
#zwiccoloOuvert {
	position: absolute;
	left:130px;
	font-size: 12px;
	top:85px;
	z-index: 10000;
}
#piccoloOuvert {
	position: absolute;
	left:130px;
	top:125px;
	font-size: 12px;
   z-index: 10000;
}
#kakadurufer {
	position: absolute;
	left:130px;
	top:165px;
   z-index: 10000;
}
#bettlerOuvert {
	position: absolute;
	left:130px;
	font-size: 12px;
	top:205px;
   z-index: 10000;
}
#quapilrufer {
	position: absolute;
	left:130px;
	top:5px;
   z-index: 10000;
}
#farbensolo {
	position: absolute;
	left:130px;
	top:285px;
   z-index: 10000;
}
#solodreier {
	position: absolute;
	left:130px;
	top:325px;
   z-index: 10000;
}*/
#weiter {
	position: absolute;
	left:130px;
	top:365px;
	z-index: 10000;
}
#herz {
	position: absolute;
	background: url('./pics/industrie/H8.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	border: none;
	z-index: 20000;
}
#pik {
	position: absolute;
	background: url('./pics/industrie/P8.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	border: none;
	z-index: 20000;
}
#karo {
	position: absolute;
	background: url('./pics/industrie/D8.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	border: none;
	z-index: 20000;
}
#kreuz {
	position: absolute;
	background: url('./pics/industrie/K8.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	border: none;
	z-index: 20000;
}
#vierten {
	position: absolute;
	left: 64%;
	top: 10%;
	width: 7.5%;
	height: 19%;
	background: url('./pics/nouveau/vierten.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	border: none;
	z-index: 20000;
}
#aufgeben {
	position: absolute;
    z-index: 10000;
}
.kontra {
   background: rgba(159,8,21,0.7);
}
#praemienWeiter {
	position: absolute;
	left:250px;
	top:45px;
	z-index: 10000;
	display:none;
}
#spielKontra {
	position: absolute;
	left:250px;
	top:5px;
   z-index: 10000;
   display:none;
}
#spielReKontra {
	position: absolute;
	left:250px;
	top:5px;
	z-index: 10000;
	font-size: 11px;
	display:none;
}
#spielSubKontra {
	position: absolute;
	left:250px;
	top:5px;
    z-index: 10000;
	font-size: 11px;
    display:none;
}
#praemienReset {
	position: absolute;
	left:250px;
	top:125px;
	width: 40px;
	border: 0pt solid;
	background: transparent;
	background: url(./img/undo.png);
	background-repeat: no-repeat;
	background-position: center;
	z-index: 10000;
	display:none;
}

#spielstand {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: 5px;
	left: 370px;
	height: 370px;
	width: 370px;
	background:#FFF;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	font-size: 8px;
	padding:5px;
	overflow: scroll;
	overflow-x: auto;
	background-color:#fffdbe;
	z-index: 25001;
}
#spielstand tr {
	font-size: 10px;
}
#spielstand tr:nth-child(odd) {
    background-color: #dcdcdc;
}
#spielstandMultiPlayer {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: 5px;
	left: 370px;
	height: 370px;
	width: 400px;
	background:#FFF;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	font-size: 8pt;
	padding:5px;
	overflow: scroll;
	overflow-x: auto;
	background-color:#fffdbe;
	z-index: 25001;
}
#information {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: 5px;
	left: 5px;
	height: 395px;
	width: 600px;
	margin:5px auto;
	padding: 5px;
	border:solid 1px black;
	font-family: arial, sans-serif;
    font-size: 12px;
	overflow: scroll;
	overflow-x: auto;
	background-color:#fffdbe;
	z-index: 10001;
}

#information td {
    font-size: 12px;
}
#information_header {
	position: -webkit-sticky;
	position:sticky;
	float: right;
	top: 0px;
	left: calc(100% - 50px);
	width: 50px;
	height: 30px;
}

#variantenExplain {
	display:none;
	position:absolute;
	top: 5px;
	left: 15px;
	max-width: 300px;
    font-size: 10px;
	background-color:#fcba03;
	z-index: 20001;
	border-radius: 5px;
	padding: 2px;
}
#friendsContext {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: 5px;
	left: 15px;
	height: 50px;
	width: 200px;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	font-size: 12px;
	color: white;
	padding:5px;
	overflow: none;
	background-color:#004800;
	z-index: 25001;
}
#settings {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: 5px;
	left: 15px;
	height: fit-content;
	max-height: calc(100% - 50px);
	width: 360px;
	background:#FFF;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	font-size: 12px;
	padding:5px;
	overflow: auto;
	overflow-x: none;
	background-color:#fffdbe;
	z-index: 10001;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */

}
@media screen and (max-height: 500px) {
  #settings {
    height: calc(100% - 10px);
  }
}
#settings td {
	font-size: 12px;
}

.settingsPics {
	float:right;
	border: 1px solid grey;
	box-shadow: 2px 2px 0px grey;
}
#debug {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: 5px;
	font-size : 10px;
	color: grey;
	left: 323px;
	height: 390px;
	width: 190px;
	background:#FFF;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	padding:5px;
	overflow: scroll;
	overflow-x: auto;
	background-color:#fffdbe;
	z-index: 12001;
}
#history {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: 5px;
	font-size : 10px;
	color: grey;
	left: 323px;
	height: 390px;
	width: 190px;
	background:#FFF;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	padding:5px;
	overflow: scroll;
	overflow-x: auto;
	background-color:#fffdbe;
	z-index: 12001;
}
#aiData {
   display:none;
	position:absolute;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   top: calc(100% - 350px);
   left: calc(50% - 250px);
   height: 300px;
   width: 500px;
   background:#FFF;
   margin:5px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   overflow: scroll;
   overflow-x: auto;
   background-color:#fffdbe;
   z-index: 10500;
}
#strategyData {
   display:none;
	position:absolute;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   top: 5px;
   left: 5px;
   height: 780px;
   width: 1000px;
   background:#FFF;
   margin:5px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   overflow: hidden;
   background-color:#fffdbe;
   z-index: 10500;
}
#strategy_control {
   display:inline;
	position:absolute;
   left: 5px;
   width: 98%;
   top: 270px;
   height: 30px;
}
#strategyCloseContainer {
   display:inline;
	position:absolute;
   left: calc(100% - 35px);
   width: 30px;
   top: 5px;
   height: 30px;
}
#strategyText {
   display:inline;
	position:absolute;
   left: 10px;
   top: 5px;
}
#accordionContainer {
   display:inline;
	position:absolute;
   border: 1pt solid blue;
   left: 30px;
   top: 330px;
   width: 900px;
   height: 450px;
}
#stats {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 300px;
   top: 10px;
   left: 10px;
   /* height: 400px;*/
   min-height: 10%;
   max-height: 75%;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow-y: auto;
   overflow-x: none;
   z-index: 10000;
   float:bottom;
}

#statspic {
	position:absolute;
   width: 40px;
   top: 5px;
   left: calc(100% - 50px);
   height: 40px;
   float:right;
   opacity:0.6;
}

#info1 {
   position: fixed;
 	border-radius:5px;
   max-width: 200px;
   min-height: 20px;
   left: calc(50% - 100px);
   color: #fcba03;
   font-size: 14px;
   text-shadow: 2px 2px black;
   padding:2px;
   text-align: center;
   display: inline-block;
   cursor: default;
}
#info2 {
   position: fixed;
 	border-radius:5px;
   max-width: 120px;
   min-height: 20px;
   bottom: 50%;
   color: #fcba03;
   font-size: 14px;
   text-shadow: 2px 2px black;
   padding:5px;
   text-align: right;
   display: inline-block;
   cursor: default;
}
#info3 {
   position: fixed;
	border-radius:5px;
   max-width: 200px;
   min-height: 20px;
   top: calc(23%);
   left: calc(50% - 100px);
   color: #fcba03;
   font-size: 14px;
   text-shadow: 2px 2px black;
   padding:5px;
   text-align: center;
   display: inline-block;
   cursor: default;
}
#info4 {
   position: fixed;
 	border-radius:5px;
   max-width: 120px;
   min-height: 20px;
   bottom: 50%;
   color: #fcba03;
   font-size: 14px;
   text-shadow: 2px 2px black;
   padding:5px;
   text-align: left;
   display: inline-block;
   cursor: default;
}
#partner1 {
   position: fixed;
   width: 30px;
   height: 30px;
   bottom: 0px;
   left: calc(50% - 15px);
   z-index:9500;
}
#partner2 {
   position: fixed;
   width: 30px;
   height: 30px;
   top: calc(50% - 20px);
   z-index:9500;
}
#partner3 {
   position: fixed;
   width: 30px;
   height: 30px;
   top: 0px;
   left: calc(50% - 15px);
   z-index:9500;
}
#partner4 {
   position: fixed;
   width: 30px;
   height: 30px;
   top: calc(50% - 15px);
   z-index:9500;
}
#avatar1 {
   position: fixed;
   width: 30px;
   height: 30px;
   bottom: 0px;
   left: calc(50% - 15px);
   z-index:9500;
}
#avatar2 {
   position: fixed;
   width: 30px;
   height: 30px;
   top: calc(50% - 20px);
   z-index:9500;
}
#avatar3 {
   position: fixed;
   width: 30px;
   height: 30px;
   top: 0px;
   left: calc(50% - 15px);
   z-index:9500;
}
#avatar4 {
   position: fixed;
   width: 30px;
   height: 30px;
   top: calc(50% - 15px);
   z-index:9500;
}
#info5 {
   position: fixed;
 	border-radius:5px;
    padding-right: 4px;
/*   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);*/
   bottom: 0px;
   left: 10px;
/*   background-color:#004800;*/
   color: yellow;
   font-size: 12px;
   text-shadow: 2px 2px black;
   text-align: left;
   z-index:100;
   display: inline-block;
   cursor: default;
}
#info6 {
   position: absolute;
   max-width: 220px;
   top: 5px;
   left: 5px;
   /*background-color:#004800;
   opacity: 40%;*/
   color: yellow;
   font-style: italic;
   font-size: 14px;
   text-shadow: 2px 2px black;
   text-align: left;
   padding:3px;
   z-index:9990;
   cursor: default;
}
#info7 {
   position: fixed;
   direction: ltr;
/*   height: 20px; */
   min-width: 10px;
   max-width: 140px;
   bottom: 0;
   right: 10px; /* 28.2.2023 von 0 auf 30px geändert #359 */
   background-color:#545454;
   border-radius: 2px;
   color: yellow;
   font-style: italic;
   font-size: 14px;
   text-shadow: 2px 2px black;
   text-align: left; /* 28.2.2023 von right auf left geändert #359 */
   display: inline-block;
   padding:3px;
   z-index:9990;
   cursor: default;
}
#info8 {
   position: fixed;
/* 	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);*/
   bottom: 0px;
   left: 10px;
/*   background-color:#004800; */
   color: yellow;
   font-size: 12px;
   text-shadow: 2px 2px black;
   text-align: left;
   z-index:100;
   display: inline-block;
   cursor: default;
}
#info9 {
   position: fixed;
   top: 10px;
   left: calc(50% - 120px);
   background-color:grey;
   border-radius:8px;
   padding:5px;
   color: yellow;
   font-size: 12px;
   text-shadow: 2px 2px black;
   text-align: left;
   z-index:100000;
   display: inline-block;
   cursor: default;
}
#is_in_online_game {
	position: fixed;
	top: 0px;
	right: 0px;
	width: 10px;
	height: 10px;
	background-color:red;
	border-radius:5px;
	z-index: 1;
}
#errorScreen {
	position: absolute;
	width: 200px;
	top: calc(15%);
	left: calc(50% - 100px);
	background-color:#c3c3c3;
	color: #1a27ba;
	font-size: 20px;
	text-align: center;
	display: inline-block;
	padding:20px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	border: 10px solid yellow;
	border-image: repeating-linear-gradient( 45deg, yellow, yellow 4%, black 1%, black 8%) 10;
	border-radius:10px;
	z-index: 30000;
}
#highlightCards {
	position: absolute;
	width: 0px;
	height: 0px;
	top: 0px;
	left: 0px;
	display: inline-block;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	border: 10px solid yellow;
	border-image: repeating-linear-gradient( 45deg, yellow, yellow 4%, black 1%, black 8%) 10;
	border-radius:10px;
	z-index: 30000;
}
#infoScreen {
	position: absolute;
	width: 200px;
	top: calc(15%);
	left: calc(50% - 100px);
	background-color:#c3c3c3;
	color: #1a27ba;
	font-size: 20px;
	text-align: center;
	display: inline-block;
	padding:20px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	border: 10px solid yellow;
	border-image: repeating-linear-gradient( 45deg, grey, grey 4%, black 1%, black 8%) 10;
	border-radius:10px;
	z-index: 30000;
}
#tutorialScreen {
	position: absolute;
	width: 400px;
	top: calc(5%);
	left: calc(50% - 200px);
	background-color:blue;
	color: #1a27ba;
	font-size: 14px;
	text-align: center;
	display: inline-block;
	padding:20px;
    color: white;
    text-align: left;
/*	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	border: 10px solid yellow;
	border-image: repeating-linear-gradient( 45deg, grey, grey 4%, black 1%, black 8%) 10;*/
	border-radius:10px;
	z-index: 10000;
}
#tutorialContainer {
    position:absolute;
    display:none;
    border-radius:8px;
    -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
    box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
    width: 330px;
    top: 25px;
    left: 350px;
    height: calc(100% - 50px);
    margin:0px auto;
    border:solid 1px black;
    font-family: arial, sans-serif;
    font-size: 12pt;
    text-align: center;
    padding:5px;
    background-color:#f1f2dc;
    overflow: hidden;
    z-index: 15000;
    overflow: auto;
    float:bottom;
}
#tutorialContainer a:link {
    color: white;
}
#watermark {
	position: absolute;
	width: 450px;
	color: black;
	-webkit-text-stroke: 1px red;
	text-align: center;
	top: calc(40%);
	left: calc(50% - 200px);
	opacity: 0.3;
	z-index: 1;
	cursor: default;
}
#loading_animation {
	position: absolute;
	height: 150px;
	width: 150px;
	top: 10%;
	left: 50%;
	margin-right: 75px;
	background: url('./img/loading.gif');
	background-repeat: no-repeat;
	border: none;
	border-radius: 10px;
	z-index: 10000000;
}
#messageScreen {
	position: absolute;
	width: 500px;
	top: 50px;
	left: calc(50% - 250px);
	max-height: 300px;
	background-color:#c3c3c3;
	color: #1a27ba;
	font-size: 16px;
	text-align: left;
	color: black;
	display: inline-block;
	padding:20px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	border: 10px solid yellow;
	border-image: repeating-linear-gradient( 45deg, grey, grey 4%, black 1%, black 8%) 10;
	border-radius:10px;
	z-index: 30000;
	overflow: auto;
}
#tipOfDayScreen {
	position: absolute;
	width: 500px;
	bottom: 5px;
	left: calc(50% - 250px);
	height: fit-content;
	background-color:#f79be7;
	color: #1a27ba;
	font-size: 16px;
	text-align: left;
	color: black;
	display: inline-block;
	padding:5px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	border-radius:10px;
	z-index: 30000;
	overflow: auto;
}
#multiPlayerChat {
	position: fixed;
	width: 30%;
	height: 80px;
	top: 40px;
    word-wrap: break-word;
	right: 45px;
	color: black;
	background-color:darkgrey;
	border-radius:5px;
	padding: 2px 2px 2px 2px;
	font-size: 12pt;
	font-style: italic;
	text-align: left;
	overflow-y: auto;
	opacity: 0.7;
	z-index: 8000;
}
#multiPlayerChatText {
	position: fixed;
	width: 30%;
	height: 30px;
	top: 5px;
	right: 45px;
	color: white;
	background-color:darkgrey;
	padding: 3px 0px 0px 3px;
	border-radius:5px;
	font-size: 14pt;
	text-align: left;
	opacity: 0.8;
	z-index: 8000;
}
#multiPlayerChatSmileys {
	position: fixed;
	width: 30%;
	top: 70px;
	right: 45px;
	color: white;
	background-color:darkgrey;
	padding: 3px 0px 0px 3px;
	border-radius:5px;
	font-size: 14pt;
	text-align: left;
	opacity: 1;
	z-index: 8001;
}

#conferenceButton {
	position: absolute;
	width: 30px;
	height: 30px;
	top:0px;
	left: calc(100% - 55px);
	background: url('./img/conferenceOff.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px;
	display: none;
}

#multiPlayerChatPrivat {
	position: absolute;
	width: 24px;
	height: 30px;
	top:0px;
	left: calc(100% - 24px);
	background: url('./img/private_inactive.png');
	background-repeat: no-repeat;
	border: none;
	box-shadow: 0px 0px;
}
.strike {
  content: '';
  position: absolute;
  left: -0.1em;
  right: -0.1em;
  top: 0.38em;
  bottom: 0.38em;
  background: linear-gradient(to left top, transparent 45.5%, red 48.5%, red 51.5%, transparent 54.5%);
  pointer-events: none;
}

.card .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #555;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;

    /* Position the tooltip text */
    position: absolute;
    top: -25px;
    left: 10%;
    margin-left: -60px;
    display:block;
    z-index: 1000;

    /* Fade in tooltip */
    opacity: 0;
    transition: opacity 0.3s;
}

.card .tooltiptext_top {
    visibility: hidden;
    width: 120px;
    background-color: #555;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;

    /* Position the tooltip text */
    position: absolute;
    top: 100%;
    left: 10%;
    margin-left: -60px;
    display:block;
    z-index: 1000;

    /* Fade in tooltip */
    opacity: 0;
    transition: opacity 0.3s;
}


/* Show the tooltip text when you mouse over the tooltip container */
.card:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.card:hover .tooltiptext_top {
    visibility: visible;
    opacity: 1;
}

#first {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 400px;
   top: calc(50% - 200px);
   left: calc(50% - 200px);
   height: 400px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow: hidden;
   z-index: 10000;
   float:bottom;
}

#startscreen {
	position:fixed;
	text-align:center;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: calc(100% - 165px);
	left: calc(50% - 150px);
	width: 300px;
	margin:0px auto;
	font-size: 11px;
	/*   border: 10px solid red;
	border-image: repeating-linear-gradient( 45deg, red, red 4%, black 1%, black 8%) 10;
	border-radius:10px; */
	font-family: arial, sans-serif;
	padding:5px;
	background-color:#fffdbe;
	overflow: hidden;
	opacity: 0.7;
	z-index: 10000;
	float:bottom;
}
#donatescreen {
	position:absolute;
	text-align:center;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: calc(35%);
	left: calc(50% - 100px);
	width: 200px;
	background:#FFF;
	margin:0px auto;
	font-size: 11px;
	/*   border: 10px solid red;
	border-image: repeating-linear-gradient( 45deg, red, red 4%, black 1%, black 8%) 10;
	border-radius:10px; */
	font-family: arial, sans-serif;
	padding:5px;
	background-color:#b4ae06;
	overflow: hidden;
	opacity: 0.9;
	z-index: 10000;
	float:bottom;
}

#kartenDetails {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 300px;
   top: calc(50% - 200px);
   left: calc(20%);
   height: 400px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow: hidden;
   z-index: 15000;
   float:bottom;
}
#logfileContainer {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 330px;
   top: 30px;
   left: 350px;
   height: 245px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow: hidden;
   z-index: 15000;
   float:bottom;
}
#spielExportContainer {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 330px;
   top: 30px;
   left: 370px;
   height: 245px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow: hidden;
   z-index: 15000;
   float:bottom;
}
#spielImportContainer {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 370px;
   top: 30px;
   left: 390px;
   height: 340px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow: hidden;
   z-index: 15000;
   float:bottom;
}
#spielImportContainerHelper {
	position:relative;
   height: 200px;
   overflow-y: scroll;
}
#settingsLoadContainer {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 370px;
   top: 30px;
   left: 390px;
   height: 340px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow-y: scroll;
   z-index: 15000;
   float:bottom;
}
#ssettingsLoadContainerHelper {
	position:relative;
   height: 200px;
   overflow-y: scroll;
}
#variantenImportContainer {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 420px;
   top: 30px;
   left: 400px;
   height: 370px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow: hidden;
   z-index: 15000;
   float:bottom;
}
#variantenImportContainerHelper {
	position:relative;
   height: 200px;
   overflow-y: scroll;
}
#makeNewTableContainer {
	position:absolute;
	display:none;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	min-width: 400px;
	max-width: 500px;
	height: 390px;
	top: calc(50% - 195px);
	left: calc(50% - 200px);
	margin:0px auto;
	border:solid 1px black;
	padding:5px;
	background-color:#1a0968;
    overflow-y: scroll;
	z-index: 15000;
	float:bottom;
}
.makeNewTableTable {
	color: white;
	font-family: arial, sans-serif;
	font-weight: bold;
	width: calc(100% - 15px);
	background: linear-gradient(45deg, #1a0968, #4424d4);
	box-shadow:0px 0px 2px 2px #9edbee;
    -webkit-box-shadow:0px 0px 2px 2px #9edbee;
    -moz-box-shadow:0px 0px 2px 2px #9edbee;
    margin: 6px;
}
#bestenListe {
	display:none;
	position:absolute;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	top: calc(50% - 150px);
	left: calc(50% - 150px);
	height: 300px;
	width: 300px;
	background:#FFF;
	margin:5px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	font-size: 8pt;
	padding:5px;
	overflow: scroll;
	overflow-x: auto;
	background-color:#fffdbe;
	z-index: 25001;
}
#tablePasswortHelper {
	position:absolute;
	display:none;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	width: 250px;
	height: 70px;
	top: calc(50% - 50px);
	left: calc(50% - 125px);
	background:#FFF;
	margin:0px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	padding:5px;
	background-color:#fffdbe;
	overflow: hidden;
	z-index: 15000;
	float:bottom;
}
#analyseDetails {
	position:absolute;
   display:none;
	border-radius:8px;
   -webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   -moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
   box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
   width: 500px;
   top: calc(50% - 130px);
   left: calc(20% + 330px);
   height: 260px;
   background:#FFF;
   margin:0px auto;
   border:solid 1px black;
   font-family: arial, sans-serif;
   padding:5px;
   background-color:#fffdbe;
   overflow: auto;
   z-index: 15000;
   float:bottom;
}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
.switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 20px;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 20px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
input:checked + .slider {
  background-color: #2196F3;
}
input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}
input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
.slider.round {
  border-radius: 10px;
}
.slider.round:before {
  border-radius: 50%;
}
#downloadPics {
   width: 20px;
   height: 20px;
   background: url('./img/download.png');
   background-repeat: no-repeat;
   border: none;
   box-shadow: 0px 0px 0px 0px #56DDEE;
   background-color: #004800;
}
.download {
   width: 20px;
   height: 20px;
   background: url('./img/download.png');
   background-repeat: no-repeat;
   border: none;
   box-shadow: 0px 0px 0px 0px #56DDEE;
   background-color: #004800;
}
.wizard {
   width: 30px;
   height: 20px;
   background: url('./img/wizard.png');
   background-repeat: no-repeat;
   border: none;
   box-shadow: 0px 0px 0px 0px #56DDEE;
   /*background-color: #004800;*/
}
#wizardContainer {
	position:absolute;
	display:none;
	border-radius:8px;
	-webkit-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);
	box-shadow: 6px 6px 20px 0px rgba(0,0,0,0.75);	width: 150px;
	width: 530px;
	top: 50px;
	left: calc(50% - 250px);
	height: 300px;
	margin:0px auto;
	border:solid 1px black;
	font-family: arial, sans-serif;
	font-size: 12px;
	color: white;
	font-weight: bold;
	padding:15px;
	background-color:#a011ad;
	overflow: none;
	z-index: 15000;
	float:bottom;
}
.tabs {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 5px 5px;
  font-weight: 600;
  width: 65px;
  height: 30px;
  text-align: center;
  color: #abc;
/*  border: 1px solid transparent;
  border-radius: 3px;
  box-shadow: 1px 1px 1px 2px #abc;
  background-color: #fffdbe;*/
}

.tabs:before {
  font-weight: normal;
  margin-right: 10px;
}
.tabs:hover {
  color: #789;
}
.tabs.active {
  color: white;
}

input[type=text] {
  width: 100%;
  padding: 2px 2px;
  margin: 0px 0;
  border: 1px solid #C1C1C1;
  border-radius: 6px;
  box-sizing: border-box;
  font-weight:bold;
  background-color:#57cdff;
}
input.chatText {
  width: 240px;
  height: 24px;
  padding: 0px 0px;
  margin: 0px 0;
  border: 1px solid #C1C1C1;
  border-radius: 2px;
  font-weight:normal;
  box-sizing: border-box;
  background-color:darkgrey;
}

table.table-points { table-layout:fixed; }
table.table-points tr td { font-size: 9px; max-width: 15%; width: 15%; }
table.table-points tr:nth-child(odd) {
    background-color: #dcdcdc;
}

#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#sortable li { margin: 1px 2px 1px 2px; padding: 0.3em; padding-left: 10px; font-size: 1.2em; height: 15px; }
#sortable li span { position: absolute; margin-left: -1.3em; }

.sortable_strat { list-style-type: none; margin: 0; padding: 0; width: 90%; height: 30px; }
.sortable_strat li { margin: 0 3px 3px 3px; padding: 0.3em; padding-left: 10px; font-size: 1em; height: 30px; }
.sortable_strat li span { position: absolute; margin-left: -0.3em; height: 30px; }

#listPraemien { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#listPraemien li { margin: 1px 2px 1px 2px; padding: 0.3em; padding-left: 10px; font-size: 1.2em; height: 15px; }
#listPraemien li span { position: absolute; margin-left: -1.3em; }

.listPraemien_strat { list-style-type: none; margin: 0; padding: 0; width: 90%; height: 30px; }
.listPraemien_strat li { margin: 0 3px 3px 3px; padding: 0.3em; padding-left: 10px; font-size: 1em; height: 30px; }
.listPraemien_strat li span { position: absolute; margin-left: -0.3em; height: 30px; }

#feedback { font-size: 1.4em; }
#spielImportList .ui-selecting { background: #4171fe; }
#spielImportList .ui-selected { background: #F39814; color: white; }
#spielImportList { list-style-type: none; margin: 0; padding: 0; width: 80%; }
#spielImportList li { margin: 3px; padding: 0.4em; font-size: 1.4em; }

#variantenImportList .ui-selecting { background: #4171fe; }
#variantenImportList .ui-selected { background: #F39814; color: white; }
#variantenImportList { list-style-type: none; margin: 0; padding: 0; width: 80%; }
#variantenImportList li { margin: 3px; padding: 0.4em; font-size: 1.4em; }

#settingsLoadList .ui-selecting { background: #4171fe; }
#settingsLoadList .ui-selected { background: #F39814; color: white; }
#settingsLoadList { list-style-type: none; margin: 0; padding: 0; width: 80%; }
#settingsLoadList li { margin: 3px; padding: 0.4em; font-size: 1em; }

table.onlineTable {
	border: 1px solid black;
	/*background-color: #D0E4F5;*/
	background: linear-gradient(45deg, #dcdce3, #4a4a4d);
	width: 100%;
	text-align: center;
	border-collapse: collapse;
}
table.onlineTable td, table.onlineTable th {
	padding: 3px 2px;
}
table.onlineTable tr {
	font-size: 10px;
}
tr.onlineTableHead td {
	font-size: 12px;
	font-weight: bold;
	background-color: #0B6FA4;
	color: #ffffff;
}
table.onlineTable tr:nth-child(even) {
	background: #dcdce3;
}
table.onlineTable thead {
	/*background: #0B6FA4;*/
	background: linear-gradient(45deg, #dcdce3, #4a4a4d);
	border-bottom: 1px solid black;
}
table.onlineTable thead th {
	font-size: 11px;
	font-weight: bold;
	color: black;
	text-align: center;
}
.ui-autocomplete {
    max-height: 350px;
	overflow: auto;
	font-weight: normal;
}
#toast {
	min-width: 250px;
	margin-left: -125px;
	background-color: #333;
	border: 3px solid;
	border-color: red;
	color: #fff;
	text-align: center;
	border-radius: 5px;
	padding: 10px;
	position: fixed;
	z-index: 10000000;
	left: 50%;
	top: calc(15%);
	font-size: 14px;
}
#features-exp{
	position: fixed;
	height: 4px;
	left: calc(50% - 78px);
	top: 1px;
	width: 100px;
	background: rgba(159, 159, 159, 0.5);
	border-radius: 10px;
	padding: 2px;
	z-index: 100000;
}
#features-points{
	position: fixed;
	height: 4px;
	left: calc(50% + 28px);
	top: 1px;
	width: 100px;
	background: rgba(159, 159, 159, 0.5);
	border-radius: 10px;
	padding: 2px;
	z-index: 100000;
}
.features-progressbar {
	position: relative;
	display: block;
	height: 100%;
	/*padding: 2px;
	color:white;
	font-size: 8pt;*/
	background-color: green;
	border-radius: 10px;
	z-index: 100000;
}