/* CSS Document */


#zaehlTrainer {
	max-width:500px;
	min-height:533px;
	margin:auto;
	text-align:center;
	padding:10px;
	border-radius:15px;
	box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 1);
}
.ztOben {
	height:220px;
	width:100%;
	position:relative;
}
.ztEinstellungen,
.ztSteuerung {
	width:calc(50% - 60px);
	height:200px;
	float:left;
}
.ztMenTitel {
	height:40px;
	line-height:40px;
	text-align:left;
	padding-left:20px;
	font-weight:bold;
	text-shadow:rgba(0, 0, 0, 0.5);
	margin-bottom:2px;
	overflow:hidden;
	text-overflow: ellipsis;
}

.ztMenPlatz {
	height:20px;
	/* nur 1 weil doppelt */
	margin-bottom:1px;
}
.ztButton {
	max-width:150px;
	margin:auto;
	height:40px;
	line-height:40px;
	cursor:pointer;
	user-select: None; 
	border-radius:5px;
	box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.5);
	overflow:hidden;
	text-align:left;
	padding-left:16px;
	margin-bottom:2px;
	text-overflow: ellipsis;
}
.ztButtonSmall {
	line-height:15px;
	font-size:10px;
	padding-top:4px;
	padding-bottom:5px;
	box-shadow:none;
}
.ztButtonOpt {
	text-align:left;
	padding-left:46px;
	background:url(../skat-client/images/bgButton.png) no-repeat top center transparent;
	background-position:6px -1090px;
}
.ztButtonOpt.aktiv {
	background-position:10px -1150px;
}

.ztButtonZeit {
	max-width:150px;
	height:40px;
	line-height:40px;
	margin:auto;
	overflow:hidden;
	padding-left:16px;
	margin-bottom:2px;
}
.ztButtonLabel {
	float:left;
	padding-left:3px;
	max-width:14px !important;
	overflow:hidden;
}
.tfZeit {
	float:left;
	width:32px;
}
.tfZeit input {
	font-size:14px;
	line-height:normal;
	padding:0;
	padding-top:3px;
	text-align:center !important;
}
.ztButtonLinks,
.ztButtonRechts {
	width:37px;
	height:40px;
	float:right;
	background:url(../skat-client/images/bgButton.png) no-repeat top center transparent;
	background-position:10px -5050px;
	user-select: None; 
	cursor:pointer;
}
.ztButtonRechts {
	background-position:10px -5230px;
}

.ztMitte {
	float:left;
	width:120px;
	height:200px;
	margin-top:10px;
}
.ztStapel {
	width:120px;
	height:160px;
}
.ztStapel > div {
	box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 1);
	margin-left:10px;
}

.stichBezeichnung {
	height:50px;
	padding-top:28px;
}
.stichZeit {
	background-color:#aaa;
	height:1px;
	width:100%;
	margin:auto;
	display:none;
}
.ztKartenIch,
.ztKartenDu {
	width:165px;
	height:250px;
	float:left;
	overflow:hidden;
	display:none;
}
.ztKartenDu {
	float:right;
}
.ztKartenSkat {
	width:230px;
	height:220px;
	margin:auto;
	display:none;
}
.ztKartenSkat > div {
	margin-left:10px;
	margin-top:55px;
}
.ztUnten {
	width:100%;
	min-height:100px;
	height:250px;
}
.ztUntenInner {
	margin:auto;
	min-width:230px;
	max-width:402px;
	height:250px;
}

.ztKarten1,
.ztKarten2,
.ztKarten3 {
	overflow:hidden;
}
.ztKarten1 {
	margin-left:5px;
	margin-top:5px;
	
}
.ztKarten2 {
	margin-left:60px;
	margin-top:-130px;
}
.ztKarten3 {
	margin-left:40px;
	margin-top:-100px;
}

.ztAuswertung {
	clear:both;
	width:402px;
	margin:auto;
}
.ztAuswertung > table .spalten3 td {
	float:left;
	width:33%;
}
.zErgebnis td {
	min-height:20px;
}
.karte {
	box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.2);
	cursor:default;
}
.ztAuswertung input {
	text-align:center;
}
.zInfo > td {
	height:34px;
}
.zInfo div {
	font-size:12px;
	display:none;
}
#bAuswertung.deaktiviert {
	box-shadow:none;
	color:#999999;
	cursor:default;
}
.richtig {
	background:url(../images/ok.gif) no-repeat top center transparent;
	background-position:right center;
}



.stichX {
	clear:both;
	display:block;
	width:230px;
	height:50px;
	overflow:hidden;
	margin:auto;
}
.stichX > div {
	margin-left:-38px;
}
.stichX > div:first-child {
	margin-left:0px;
}


@media screen and (max-width: 400px) { 
	.ztStapel {
		width:100px;
	}
	.ztStapel .karte {width:80px; height:120px; background-size:640px auto; background-position: 0px 0px;} 
	.ztStapel .karte > div  {width:78px; height:118px; border-width:1px;} 
	.ztStapel .kR {
		background-position:0px 0px !important;
		background-size:80px 120px;
	}
	.ztMitte {
		width:100px;
	}
	.ztMenTitel,
	.ztButton {
		padding-left:5px;
	}
	.ztButtonZeit {
		padding-left:0px;
		font-size:10px;
	}
	.ztButtonLabel {
		font-size:10px;
	}
	.ztButtonOpt {
		padding-left:35px;
		background-position:0px -1090px;
	}
	.ztButtonOpt.aktiv {
		background-position:0px -1150px;
	}
	.ztEinstellungen,
	.ztSteuerung {
		width:calc(50% - 50px);
	}
	.ztOben div.ztButton {
		font-size:12px;
	}
	.ztAuswertung {
		width:100%;
	}
	.ztButtonLinks,
	.ztButtonRechts {
		width:34px;
	}

}