.karta {
	background-color: #3FA413;
	border: 1px solid #E3E3E3;
	box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 0.68);	
	position:absolute;
}
.karta img {
	max-width: 100%;
	height: auto;	
}
.outer-karta {
	display:block;
	float:left;	
	width: calc(20% - 10px);
	height: 0px;
	margin: 5px;
	padding-bottom: calc(20% - 10px);
	position: relative;
}
.inner-karta {
	position: absolute;
	width: 90px;
	height: 90px;
	left: 0px;
}
h2 {
	font-size: 30px;
	font-family: Verdana;
	margin: 20px;
}
h3 {
	font-size: 17px;
	text-align: center;
	font-family: Arial;
}
#restart {
	cursor: pointer;
}
.wrapper {
	box-sizing: border-box;
}
.wrapper:after{
	content: "";
	clear:both;
}
/*bootstrap css override*/
.skore-navbar {
	font-size: small;
}
.panel-default {
	width:80%;
	margin:auto;
}
/*media query optimalizace pro desktop*/
@media (min-width: 1000px){
        .panel-default {
			width:40%;
		}
		.outer-karta {
			width: calc(12.5% - 10px);
			padding-bottom: calc(12.5% - 10px);
		}
		.karta {
			border: 1px solid #E3E3E3;
			border-radius: 5px;
			box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 0.68);
		}
		.karta:hover {
			box-shadow: 0px 0px 0px 1px #BABABA;
		}
}
@media (min-width: 1580px){
        .panel-default {
			width:32%;
		}
		.outer-karta {
			width: calc(10% - 10px);
			padding-bottom: calc(10% - 10px);
		}
		.karta {
			border: 1px solid #E3E3E3;
			border-radius: 5px;
			box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 0.68);
		}
		.karta:hover {
			box-shadow: 0px 0px 0px 1px #BABABA;
		}
}