@font-face {
	font-family: 'averta_demo_pe_cutted_demoRg';
	src: url('avertademopecutteddemo-regular-webfont.woff2') format('woff2'), url('avertademopecutteddemo-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'averta_demo_peextrabold';
	src: url('avertademope-extrabold-webfont.woff2') format('woff2'), url('avertademope-extrabold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
body {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	zoom: 1;
	overflow: hidden;
	padding: 0;
	margin: 0;
	background: #d7ccaf url(image/deska.jpg) center center repeat;
	font-family: averta_demo_pe_cutted_demoRg, sans-serif;
	font-weight: normal;
	color: #333;
	line-height: 36px;
	font-size: 24px;
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.deska {
	position: absolute;
	background: url(image/deska.jpg) center center repeat;
}
.deska:before,
.vsechno:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	image-rendering: pixelated;
	will-change: transform;
	background:
		url(image/deska_roh_1.jpg) top left no-repeat,
		url(image/deska_roh_2.jpg) top right no-repeat,
		url(image/deska_roh_3.jpg) bottom right no-repeat,
		url(image/deska_roh_4.jpg) bottom left no-repeat,
		url(image/deska_kraj_1.jpg) top center repeat-x,
		url(image/deska_kraj_2.jpg) center right repeat-y,
		url(image/deska_kraj_3.jpg) bottom center repeat-x,
		url(image/deska_kraj_4.jpg) center left repeat-y
}
.sirka_640 .deska:before,
.sirka_640 .vsechno:before {
	background-size: 30px 30px;
}
.sirka_480 .deska:before,
.sirka_480 .vsechno:before {
	background-size: 20px 20px;
}
#hra .maly {
	line-height: 24px;
	font-size: 18px;
}
/*
#hra div, #hra div :before, #hra div :after {
	box-sizing: border-box;
}
#hra img, #hra div, #hra div :before, #hra div :after {
	image-rendering: -webkit-optimize-contrast;
}
xxx#hra p {
	transform: perspective(0.1px);
}
*/
#hra a {
	color: #A27250;
}
#hra b,
#hra i,
.textcontent h3,
#hra .okno h3,
#hra .figurka_popis h5,
#karta .spravna_odpoved,
#karta .spatna_odpoved,
x#karta .oznameni,
#vezeni_hlaska {
	color: #ca7e65;
	font-weight: normal;
	font-style: normal;
	font-family: averta_demo_peextrabold, sans-serif;
	font-size: 28px;
}
#hra p {
	margin: 0;
	padding: 0;
}

@keyframes nic {
	0% {transform: translateZ(0)}
}

#hra {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-align: center;
	zoom: 1;
	xtransform-origin: top;
	box-sizing: border-box;
}
.sirka_1280 #hra {
	width: 1920px;
	height: 1080px;
	left: calc((100% - 1920px) / 2);
	top: calc((100% - 1080px) / 2);
}
.sirka_800 #hra {
	width: 1600px;
	height: 1200px;
	left: calc((100% - 1600px) / 2);
	top: calc((100% - 1200px) / 2);
}
.sirka_640 #hra {
	width: 960px;
	height: 960px;
	left: calc((100% - 960px) / 2);
	top: calc((100% - 960px) / 2);
}
.sirka_480 #hra {
	width: 640px;
	height: 960px;
	left: calc((100% - 640px) / 2);
	top: calc((100% - 960px) / 2);
}
.hra_kryt {
	position: absolute;
	left: 40px;
	right: 40px;
	top: 40px;
	bottom: 40px;
	background: #CABFAB url(image/deska.jpg) center center repeat;
	z-index: 40;
	opacity: 0;
	animation: nic 10s infinite linear;
}
.sirka_640 .hra_kryt {
	left: 30px;
	right: 30px;
	top: 30px;
	bottom: 30px;
}
.sirka_480 .hra_kryt {
	left: 20px;
	right: 20px;
	top: 20px;
	bottom: 20px;
}
.hra_kryt.pod_panely {
	display: none;
}
.hra_kryt.pod_panely.pod_videem {
	display: block;
	padding: 40px;
	box-sizing: border-box;
	background-clip: content-box;
}
.sirka_640 .hra_kryt.pod_panely.pod_videem {
	padding: 30px;
}
.sirka_480 .hra_kryt.pod_panely.pod_videem {
	padding: 20px;
}
.hra_kryt.vsechno {
	z-index: 100;
	background-clip: content-box;
	box-sizing: border-box;
}
.hra_kryt.uvod {
	z-index: 100;
	background-position: center 140px;
	background: url(image/logo_velke.jpg) center calc(50% - (540px - 632px / 2 - 140px)) no-repeat;
	opacity: 1;
}
.sirka_480 .hra_kryt.uvod,
.sirka_640 .hra_kryt.uvod {
	background-image: url(image/logo_stredni.jpg);
}
.hra_kryt.uvod.hra_kryt_out {
	animation: uvod_pryc 300ms 1 ease-in;
}
@keyframes uvod_pryc {
	to {transform: scale(2) rotate(-0deg) translateX(-0%) translateY(-0%);}
}

#loading {
	position: absolute;
	width: 483px;
	height: 33px;
	left: calc((100% - 483px) / 2);
	top: 860px;
	top: calc(50% + 320px);
	background: url(image/loading.jpg) center bottom no-repeat;
	padding: 10px;
	box-sizing: border-box;
	color: #d7ccaf;
}
#loading #loading_progress {
	left: 0;
	width: 0;
	height: 100%;
	background: #493919;
}
.uvod #loading.loaded {
	cursor: pointer;
	left: calc((100% - 809px) / 2);
	top: 140px;
	top: calc(50% - 400px);
	width: 809px;
	height: 753px;
	position: relative;
	background: none;
}
.sirka_480 #loading,
.sirka_640 #loading {
	top: calc(50% + 320px - 150px);
}
.sirka_480 .uvod #loading.loaded {
	top: calc(50% - 400px - 150px);
}

.uvod #loading.loaded #loading_progress {
	position: absolute;
	bottom: -20px;
	left: 232px;
}
.sirka_640 .uvod #loading.loaded #loading_progress {
	bottom: 120px;
}

#logo_30_let {
	position: absolute;
	width: 0;
	padding-left: 59px;
	overflow: hidden;
	height: 127px;
	right: 55px;
	bottom: 55px;
	background: url(image/logo_30_let.png) 0 0 no-repeat;
	z-index: 50;
}
.sirka_480 #logo_30_let {
	right: 30px;
	bottom: 30px;
}

@keyframes playbutton {
	0% {opacity: 0}
	100% {opacity: 1}
}
.uvod .loaded: after {
	display: none;
}

#dialog_global {
	display: none;
	position: absolute;
	z-index: 110;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: url(image/logo_stredni.jpg) center calc(50% - (540px - 380px / 2 - 240px)) no-repeat;
	z-index: 101;
}
.sirka_480 #dialog_global,
.sirka_640 #dialog_global {
	background-position: center top;
	max-height: 750px;
	top: calc((100% - 750px) / 2);
}
#dialog_global_text {
	position: absolute;
	width: 730px;
	left: calc((100% - 730px) / 2);
	bottom: calc(50% - 305px);
	z-index: 1;
}
.sirka_480 #dialog_global_text,
.sirka_640 #dialog_global_text {
	width: 355px;
	left: calc((100% - 355px) / 2);
	bottom: 0;
}
#dialog_global p {
	font-size: 36px;
	margin: 40px 0;
	font-weight: normal;
	font-family: averta_demo_peextrabold, sans-serif;
	font-size: 28px;
	letter-spacing: 1px;
	color: #8c7e5f;
}
#dialog_global p b {
	color: #cc7b5a;
	white-space: nowrap;
}
.dialog_volba {
	float: left;
	margin: 10px;
	cursor: pointer;
}

.misto {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-position: 0 0;
	background-repeat: repeat;
}
.misto.animace {
	animation: nic 10s infinite linear;
}
.misto_vrstva {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-position: 0 0;
	background-repeat: repeat;
}

.okno {
	display: none;
	position: absolute;
	z-index: 80;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: url(image/papir.jpg) center center  no-repeat;
	background-size: 100% 100%;
	box-sizing: border-box;
	box-shadow: rgba(0,0,0,0.5) 0 0 10px;
	transform: rotate(-0.5deg) perspective(0.1px);
	opacity: 1 !important;
}
.okno.okno_in {
	animation: okno_animace_in 1s 1 ease-out;
}
.okno.okno_out {
	animation: okno_animace_out 1s 1 ease-in;
}
@keyframes okno_animace_in {
	0% {transform: translate(-10%,100%) rotate(-10deg);}
	50% {transform: translate(0,0) rotate(-0.5deg);}
	100% {transform: translate(0,0) rotate(-0.5deg);}
}
@keyframes okno_animace_out {
	0% {transform: translate(0,0) rotate(-0.5deg);}
	50% {transform: translate(-20%,200%) rotate(-10deg);}
	100% {transform: translate(-20%,500%) rotate(-10deg);}
}
#video_okno.okno_in {
	animation: televize_animace_in 1s 1 ease-in;
	transform-origin: bottom;
}
@keyframes televize_animace_in {
	0% {transform: translateY(-200%) rotate(0deg);}
	35% {transform: translateY(0) rotate(-3deg);}
	40% {transform: translateY(-20px) rotate(0deg);}
	45% {transform: translateY(-20px) rotate(-1.5deg);}
	50% {transform: translateY(0) rotate(0deg);}
	100% {transform: translateY(0) rotate(0deg);}
}
#video_okno.okno_out {
	animation: televize_animace_out 1s 1 ease-in;
}
@keyframes televize_animace_out {
	0% {transform: translateY(0);}
	25% {transform: translateY(-200%);}
	100% {transform: translateY(-200%);}
}
.okno_vrstva {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
}
.okno_popis {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	left: 0;
	height: auto;
	background: rgba(0,0,0,0.6);
	padding: 20px 300px;
	color: #eee;
}
.okno_obsah {
	width: calc(100% - 40px);
	height: calc(100% - 40px);
	left: 20px;
	top: 20px;
}
#hra .okno .mCSB_dragger .mCSB_dragger_bar {
	background-color: #ca7e65;
	width: 20px;
	border-radius: 20px;
	margin: 0;
}
#hra .okno .mCSB_scrollTools {
	width: 20px;
}
#hra .okno .mCSB_dragger {
	height: 20px;
}
#soutez_iframe,
#pravidla_podrobne,
#statistika_podrobne,
#autori {
	top: 100px;
	left: 100px;
	height: calc(100% - 280px);
	width: calc(100% - 200px);
	overflow-y: auto;
	text-align: left;
}
#soutez_iframe {
	width: calc(100% - 170px);
	height: calc(100% - 280px);
}
#autori {
	text-align: center;
}
.sirka_480 #soutez_iframe,
.sirka_640 #soutez_iframe,
.sirka_480 #pravidla_podrobne,
.sirka_640 #pravidla_podrobne,
.sirka_480 #statistika_podrobne,
.sirka_640 #statistika_podrobne,
.sirka_480 #autori,
.sirka_640 #autori {
	top: 40px;
	left: 40px;
	height: calc(100% - 240px);
	width: calc(100% - 80px);
}
.sirka_640 #pravidla_podrobne,
.sirka_640 #statistika_podrobne,
.sirka_640 #autori {
	width: calc(100% - 100px);
	height: calc(100% - 220px);
}
.sirka_480 #soutez_iframe {
	width: calc(100% - 50px);
	height: calc(100% - 200px);
}
.sirka_640 #soutez_iframe {
	width: calc(100% - 70px);
	height: calc(100% - 220px);
}
#hra .okno h3 {
	margin: 0;
	padding: 40px 100px 20px 80px;
	font-size: 32px;
}
#hra .okno p {
	margin: 0;
	padding: 0px 100px 10px 80px;
}
#hra .okno ul {
	list-style-type: none;
	margin: 0;
	padding: 20px 100px 10px 80px;
}
.sirka_480 #hra .okno h3,
.sirka_480 #hra .okno p,
.sirka_480 #hra .okno ul {
	padding-left: 20px;
	padding-right: 20px;
}
.sirka_640 #hra .okno h3,
.sirka_640 #hra .okno p,
.sirka_640 #hra .okno ul {
	padding-left: 40px;
	padding-right: 40px;
}
.okno li {
	list-style-type: none;
	margin: 0;
	padding: 10px 0;
	position: relative;
	overflow: visible !important;
}
.sirka_480 #hra .okno #pravidla_podrobne ul.pravidla,
.sirka_640 #hra .okno #pravidla_podrobne ul.pravidla {
	padding-bottom: 40px;
}
.okno .pravidla li {
	padding-left: 70px;
	min-height: 70px;
}
.okno .pravidla li:before {
	content: "";
	display: block;
	float: left;
	width: 60px;
	height: 60px;
	border-radius: 60px;
	background-position: -5px center;
	background-repeat: no-repeat;
	background-size: 70px;
	position: absolute;
	left: 0px;
	top: -4px;
}
.okno .pravidla_kviz:before {
	background-image: url(image/karta_kviz.png);
}
.okno .pravidla_osobnost:before {
	background-image: url(image/karta_osobnost.png);
}
.okno .pravidla_udalost:before {
	background-image: url(image/karta_udalost.png);
}
.okno .pravidla_perlicka:before {
	background-image: url(image/karta_perlicka.png);
}
.okno .pravidla_akcni:before {
	background-image: url(image/karta_sance.png);
}
.okno .pravidla_vezeni:before {
	background-image: url(image/karta_vezeni.png);
}
.okno .pravidla_stb:before {
	background-image: url(image/karta_stb.png);
}
.okno .pravidla_letadlo:before {
	background-image: url(image/karta_letadlo.png);
}
#hra .okno #playlist {
	text-align: left;
	margin: 0 auto;
	padding: 0;
	max-width: 550px;
}
#hra .okno #playlist li {
	padding-left: 45px;
}
#hra .okno #playlist li a {
	cursor: pointer;
}
.sirka_480 #hra .okno #playlist li,
.sirka_640 #hra .okno #playlist li {
	padding-left: 60px;
}

.pravidla_ikonka_hudba {
	display: inline-block;
	background-image: url(image/ikony.png);
	background-repeat: no-repeat;
	top: 10px;
	left: 0;
	border-radius: 50px;
	width: 29px;
	height: 29px;
	background-position: -44px -3px;
	vertical-align: text-top;
	margin: 0 -3px;
}

#playlist .playlist {
	position: absolute;
	background-image: url(image/ikony.png);
	background-repeat: no-repeat;
	top: 10px;
	left: 0;
	border-radius: 50px;
	margin: 3px;
	width: 29px;
	height: 29px;
	background-position: -44px -3px;
	animation: nic 10s infinite linear;
}
#playlist .playlist.playing {
	margin: 0px;
	width: 35px;
	height: 35px;
	background-position: -41px 0;
}
.sirka_480 #playlist .playlist,
.sirka_640 #playlist .playlist {
	background-image: url(image/ikony_mobil.png);
	top: 2px;
	width: 44px;
	height: 44px;
	background-position: -113px -58px;
}
.sirka_480 #playlist .playlist.playing,
.sirka_640 #playlist .playlist.playing {
	width: 50px;
	height: 50px;
	background-position: -110px -55px;
}
.hudbaCeka:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: -3px;
	left: -3px;
	border: dotted 3px #988E78;
	border-radius: 100px;
	animation: hudbaCeka 5000ms infinite linear;
}
.sirka_480 .hudbaCeka:before,
.sirka_640 .hudbaCeka:before {
	border-style: dashed;
}
@keyframes hudbaCeka {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}
#ovladani_hudba.ovladani.hudbaCeka {
	right: 85px;
	top: 3px;
	width: 29px;
	height: 29px;
	background-position: -44px -3px;
	border-radius: 100px;
}
.ovladani_mobil #ovladani_hudba.hudbaCeka {
	right: 44px;
}
.sirka_480 #ovladani_hudba.hudbaCeka,
.sirka_640 #ovladani_hudba.hudbaCeka {
	width: 44px;
	height: 44px;
	right: 115px;
	background-position: -113px -58px;
}
.sirka_480 .ovladani_mobil #ovladani_hudba.hudbaCeka,
.sirka_640 .ovladani_mobil #ovladani_hudba.hudbaCeka {
	right: 59px;
}

#prehlidka {
	top: 10%;
	left: 20px;
	width: 500px;
	max-height: 80%;
	overflow-y: auto;
}
#prehlidka a {
	cursor: pointer;
}
#prehlidka a:hover {
	color: #7C0C00;
}
.sirka_480 #prehlidka,
.sirka_640 #prehlidka {
	display: none !important;
}

#ovladani {
	display: none;
	position: absolute;
	left: 45px;
	top: 45px;
	width: calc(100% - 90px);
	height: 35px;
	z-index: 60;
}
.ovladani {
	position: absolute;
	top: 0;
	width: 35px;
	height: 35px;
	background: url(image/ikony.png) 0 0 no-repeat;
	cursor: pointer;
}
#ovladani_zpet {
	left: 41px;
	background-position: 0 0;
}
#ovladani_mail {
	left: 0px;
	background-position: 0 -42px;
}
#ovladani_hudba {
	right: 82px;
	background-position: -41px 0;
}

#ovladani_hudba.off {
	background-position: -41px -42px;
}
#ovladani_dialogy {
	right: 41px;
	background-position: -82px 0;
}
#ovladani_dialogy.off {
	background-position: -82px -42px;
}
#ovladani_obrazovka {
	right: 0px;
}
#ovladani_obrazovka.state_0 {
	background-position: -123px -42px;
}
#ovladani_obrazovka.state_1 {
	background-position: -123px 0;
}
#ovladani_obrazovka.state_2 {
	background-position: -123px -42px;
}
#ovladani.ovladani_mobil {
}
.ovladani_mobil #ovladani_hudba {
	right: 41px;
}
.ovladani_mobil #ovladani_dialogy {
	right: 0px;
}
.ovladani_mobil #ovladani_obrazovka {
	display: none;
}
.sirka_480 #ovladani {
	left: 30px;
	top: 30px;
	width: calc(100% - 60px);
	height: 50px;
}
.sirka_640 #ovladani {
	left: 40px;
	top: 40px;
	width: calc(100% - 80px);
	height: 50px;
}
.sirka_480 .ovladani,
.sirka_640 .ovladani {
	background-image: url(image/ikony_mobil.png);
	width: 50px;
	height: 50px;
}
.sirka_480 #ovladani_zpet,
.sirka_640 #ovladani_zpet {
	left: 56px;
	background-position: 0 0;
}
.ovladani_mobil #ovladani_zpet {
	left: 0;
}
.sirka_480 #ovladani_mail,
.sirka_640 #ovladani_mail {
	background-position: -55px 0;
}
.ovladani_mobil #ovladani_mail {
	display: none;
}
.sirka_480 #ovladani_hudba,
.sirka_640 #ovladani_hudba {
	right: 112px;
	background-position: -110px -55px;
}
.sirka_480 #ovladani_hudba.off,
.sirka_640 #ovladani_hudba.off {
	background-position: -165px -55px;
}
.sirka_480 #ovladani_dialogy,
.sirka_640 #ovladani_dialogy {
	right: 56px;
	background-position: 0 -55px;
}
.sirka_480 #ovladani_dialogy.off,
.sirka_640 #ovladani_dialogy.off {
	background-position: -55px -55px;
}
.sirka_480 #ovladani_obrazovka.state_0,
.sirka_640 #ovladani_obrazovka.state_0 {
	background-position: -165px 0;
}
.sirka_480 #ovladani_obrazovka.state_1,
.sirka_640 #ovladani_obrazovka.state_1 {
	background-position: -110px 0;
}
.sirka_480 #ovladani_obrazovka.state_2,
.sirka_640 #ovladani_obrazovka.state_2 {
	background-position: -165px 0;
}
.sirka_480 .ovladani_mobil #ovladani_hudba,
.sirka_640 .ovladani_mobil #ovladani_hudba {
	right: 56px;
}
.sirka_480 .ovladani_mobil #ovladani_dialogy,
.sirka_640 .ovladani_mobil #ovladani_dialogy {
	right: 0px;
}


.prvek {
	display: none;
	position: absolute;
	z-index: 9;
	background-position: center center;
	background-repeat: no-repeat;
}

.hidden {
	display: none;
}

.clearfix: after {
	content: "";
	clear: both;
	display: table;
}

/*
@keyframes spin {
	0% { transform: translateZ(-100px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translateY(0); }
	16% { transform: translateZ(-100px) rotateX(180deg) rotateY(180deg) rotateZ(0deg) translateY(40px); }
	33% { transform: translateZ(-100px) rotateX(360deg) rotateY(90deg) rotateZ(180deg) translateY(80px); }
	50% { transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg) translateY(100px); }
	66% { transform: translateZ(-100px) rotateX(180deg) rotateY(360deg) rotateZ(270deg) translateY(80px); }
	83% { transform: translateZ(-100px) rotateX(270deg) rotateY(180deg) rotateZ(180deg) translateY(40px); }
	100% { transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg) translateY(0px); }
}
@keyframes roll {
	0% { transform: translate3d(-200px,-50px,-400px) }
	12% { transform: translate3d(0px,0,-100px) }
	25% { transform: translate3d(200px,-50px,-400px) }
	37% { transform: translate3d(0px,-100px,-800px) }
	50% { transform: translate3d(-200px,-50px,-400px) }
	62% { transform: translate3d(0px,0,-100px) }
	75% { transform: translate3d(200px,-50px,-400px) }
	87% { transform: translate3d(0px,-100px,-800px) }
	100% { transform: translate3d(-200px,-50px,-400px) }
}
*/
#kostka, #kostka_stin {
	position: absolute;
	width: 80px;
	height: 80px;
	top: calc((100% - 80px) / 2);
	left: calc((100% - 80px) / 2);
	perspective: 700px;
	transition-property: transform;
	transition-timing-function: ease-out;
	transform: translateY(0);
}
#kostka_stin {
	box-shadow: 5px 10px 60px #630;
}
#kostka.kostkaCekat, #kostka_stin.kostkaCekat {
	transition: none;
	animation: kostkaCekat 2s ease infinite;
}
@keyframes kostkaCekat {
	84% { transform: translateY(0px) rotate(0deg); }
	88% { transform: translateY(-30px) rotate(-5deg); }
	92% { transform: translateY(0px) rotate(0deg); }
	96% { transform: translateY(-15px) rotate(+5deg); }
	100% { transform: translateY(0px) rotate(0deg); }
}
@keyframes kostkaVyhodit {
	0% { transform: translateY(0px); }
	26% { transform: translateY(-100px); }
	53% { transform: translateY(0px); }
	66% { transform: translateY(-80px); }
	80% { transform: translateY(0px); }
	86% { transform: translateY(-40px); }
	93% { transform: translateY(0px); }
	961% { transform: translateY(-20px); }
	100% { transform: translateY(0px); }
}
.dice {
	position: absolute;
	width: 120px;
	height: 120px;
	left: -20px;
	top: -20px;
	transform-origin: 60px 60px 0px;
	transform-style: preserve-3d;
	transition-property: transform;
	transition-timing-function: linear;
	z-index: +1;
}
#kostka_stin .dice {
	width: 122px;
	height: 122px;
	left: -21px;
	top: -21px;
	transform-origin: 61px 61px 0px;
	z-index: -1;
}

.side {
	position: absolute;
	width: 120px;
	height: 120px;
	background: url(image/kostka_side_4.png) center center no-repeat;
	background-size: 100% 100%;
	border-radius: 100px;
	backface-visibility: hidden;
	box-sizing: border-box;
}
#kostka_stin .side {
	width: 122px;
	height: 122px;
	background: #B29476;
	backface-visibility: visible;
}
.sirka_480 #kostka_stin .side {
	background: #AE9473;
}
.dice .cover, .dice .inner {
	background: url(image/kostka_back_4.png);
	background-size: 100% 100%;
	backface-visibility: visible;
}
.dice .cover {
	border-radius: 0;
	transform: translateZ(0px);
}

.dice .cover.x { transform: rotateY(90deg); }
.dice .cover.z { transform: rotateX(90deg); }

.dice .front { transform: translateZ(60px); }
.dice .front.inner { transform: translateZ(59.5px); }
.dice .back { transform: rotateX(-180deg) translateZ(60px); }
.dice .back.inner { transform: rotateX(-180deg) translateZ(59.5px); }
.dice .right { transform: rotateY(90deg) translateZ(60px); }
.dice .right.inner { transform: rotateY(90deg) translateZ(59.5px); }
.dice .left { transform: rotateY(-90deg) translateZ(60px); }
.dice .left.inner { transform: rotateY(-90deg) translateZ(59.5px); }
.dice .top { transform: rotateX(90deg) translateZ(60px); }
.dice .top.inner { transform: rotateX(90deg) translateZ(59.5px); }
.dice .bottom { transform: rotateX(-90deg) translateZ(60px); }
.dice .bottom.inner { transform: rotateX(-90deg) translateZ(59.5px); }

#kostka_stin .front { transform: translateZ(61px); }
#kostka_stin .back { transform: rotateX(-180deg) translateZ(61px); }
#kostka_stin .right { transform: rotateY(90deg) translateZ(61px); }
#kostka_stin .left { transform: rotateY(-90deg) translateZ(61px); }
#kostka_stin .top { transform: rotateX(90deg) translateZ(61px); }
#kostka_stin .bottom { transform: rotateX(-90deg) translateZ(61px); }

.dot {
	position: absolute;
	width: 22px;
	height: 22px;
	border-radius: 20px;
	box-shadow: inset 0 0 3px #642;
	background: rgba(0,90,180,0.7);
}
.dot.center { left: 49px; top: 49px; }
.dot.dtop { top: 22px; }
.dot.dleft { left: 22px; }
.dot.dright { right: 22px; }
.dot.dbottom { bottom: 22px; }
.dot.center.dleft { left: 22px; top: 49px; }
.dot.center.dright { left: auto; right: 22px; top: 49px; }
.dot.odd { background: rgba(180,45,45,0.7); }

.sirka_480 #pole {
	left: 30px;
	top: 68px;
	width: 580px;
	height: 860px;
	background: url(image/hraci_pole_480.jpg) 0 0 no-repeat;
}
.sirka_640 #pole {
	left: 45px;
	top: 90px;
	width: 870px;
	height: 810px;
	background: url(image/hraci_pole_640.jpg) 0 0 no-repeat;
}
.sirka_800 #pole {
	left: 78px;
	top: 137px;
	width: 1455px;
	height: 960px;
	background: url(image/hraci_pole_800.jpg) 0 0 no-repeat;
}
.sirka_1280 #pole {
	left: 116px;
	top: 100px;
	width: 1730px;
	height: 880px;
	background: url(image/hraci_pole_1280.jpg) 0 0 no-repeat;
}

#pole span {
	display: block;
	position: absolute;
	border-radius: 100px;
}
.sirka_480 #pole span {
	width: 60px;
	height: 60px;
}
.sirka_640 #pole span {
	width: 70px;
	height: 70px;
}
.sirka_800 #pole span {
	width: 85px;
	height: 85px;
}
.sirka_1280 #pole span {
	width: 92px;
	height: 92px;
}
#pole .typ_start {
}
#pole .typ_konec {
}
#pole .typ_kviz {
}
#pole .typ_udalost {
}
#pole .typ_osobnost {
}
#pole .typ_perlicka {
}
#pole .typ_akcni {
}
#pole .typ_vezeni {
}
#pole .typ_letadlo {
}
#pole .typ_stb {
}

#figurka {
	background-size: 100% auto;
}
.sirka_480 #figurka {
	width: 90px;
	height: 90px;
	transform: translate(15px,53px) scaleX(-1);
}
.sirka_480 #figurka.figurka_obracena {
	transform: translate(15px,53px);
}
.sirka_640 #figurka {
	width: 100px;
	height: 100px;
	transform: translate(30px,75px) scaleX(-1);
}
.sirka_640 #figurka.figurka_obracena {
	transform: translate(30px,75px);
}
.sirka_800 #figurka {
	width: 120px;
	height: 120px;
	transform: translate(60px,120px) scaleX(-1);
}
.sirka_800 #figurka.figurka_obracena {
	transform: translate(60px,120px);
}
.sirka_1280 #figurka {
	width: 120px;
	height: 120px;
	transform: translate(101px,87px) scaleX(-1);
}
.sirka_1280 #figurka.figurka_obracena {
	transform: translate(101px,87px);
}

#karta {
	width: 640px;
	height: 912px;
	left: calc((100% - 640px) / 2);
	top: calc((100% - 912px) / 2);
	z-index: 70;
}
#karta .front,
#karta .back {
	padding: 0;
	box-sizing: border-box;
	background: url(image/karta_lic.png) center center no-repeat;
}
#karta .rub {
	background-image: url(image/karta_rub.png);
	cursor: pointer;
}
#karta .rub .obsah {
	display: none;
}
#karta h2 {
	display: none;
}
#karta .rub h2 {
	display: block;
	position: absolute;
	width: 0;
	padding-left: 214px;
	overflow: hidden;
	height: 214px;
	left: 212px;
	top: 316px;
}
#karta.karta_perlicka .rub h2 {
	background-image: url(image/karta_perlicka.png);
}
#karta.karta_osobnost .rub h2 {
	background-image: url(image/karta_osobnost.png);
}
#karta.karta_akcni .rub h2 {
	background-image: url(image/karta_sance.png);
}
#karta.karta_udalost .rub h2 {
	background-image: url(image/karta_udalost.png);
}
#karta.karta_kviz .rub h2 {
	background-image: url(image/karta_kviz.png);
}
#karta.karta_vezeni .rub h2 {
	background-image: url(image/karta_vezeni.png);
}
#karta.karta_letadlo .rub h2 {
	background-image: url(image/karta_letadlo.png);
}
#karta.karta_stb .rub h2 {
	background-image: url(image/karta_stb.png);
}

@keyframes kartaCekat {
	75% {transform: rotate(0deg)}
	80% {transform: rotate(-1deg)}
	85% {transform: rotate(+2deg)}
	90% {transform: rotate(-2deg)}
	95% {transform: rotate(+1deg)}
	100% {transform: rotate(0deg)}
}
@keyframes kartaUkazat {
	50% {transform: translateY(0)}
	100% {transform: translateY(0)}
}
@keyframes kartaSchovat {
	50% {transform: translateY(-50px)}
	100% {transform: translateY(0)}
}

#karta .obsah {
	box-sizing: border-box;
	position: absolute;
	padding: 65px;
	width: 100%;
	height: 100%;
	transform: translateZ(1px);
}
#karta .obsah:after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-position: 43px 57px;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	/*z-index: -1;*/
	pointer-events: none;
}
#karta.karta_kviz .obsah:after {
	background-image: url(image/ramecek_kviz.png);
}
#karta.karta_osobnost .obsah:after {
	background-image: url(image/ramecek_osobnost.png);
}
#karta.karta_udalost .obsah:after {
	background-image: url(image/ramecek_udalost.png);
}
#karta.karta_perlicka .obsah:after {
	background-image: url(image/ramecek_perlicka.png);
}
#karta.karta_akcni .obsah:after {
	background-image: url(image/ramecek_sance.png);
}

#karta .front { }
#karta .front .obsah { }
#karta .back { }
#karta .back .obsah { }
#karta .ilustrace {
	background-position: center center;
	background-repeat: no-repeat;
}
#karta .ilustrace img {
	width: auto;
	max-height: 480px;
	position: relative;
}
#karta .ilustrace canvas {
}

#karta h3, #karta h4 {
	position: absolute;
	margin: 0;
	padding: 0;
	font-weight: normal;
	font-family: averta_demo_peextrabold, sans-serif;
	font-size: 28px;
	color: #7C0C00;
	padding: 0 5px;
	background: url(image/karta_lic.png);
	z-index: 1;
}
#karta h3 {
	bottom: 49px;
	right: 94px;
	background-position: -400px -800px;
}
#karta h4 {
	top: 44px;
	left: 95px;
	background-position: -60px -40px;
}
#karta h3:before,
#karta h3:after,
#karta h4:before,
#karta h4:after {
	content: "";
	display: block;
	width: 10px;
	height: 100%;
	background: url(image/ramecek_konec.png) 0 0 repeat-y;
	position: absolute;
	top: 0;
	right: -10px;
}
#karta h3:before,
#karta h4:before {
	transform: scaleX(-1);
	right: auto;
	left: -10px;
}
#karta p i {
	font-size: 26px;
}
#karta.karta_kviz h3,
#karta.karta_kviz h4,
#karta.karta_kviz p b,
#karta.karta_kviz p i,
#hra .okno .pravidla_kviz b {
	color: #CAAA5F;
	color: #c99722;
}
#karta.karta_osobnost h3,
#karta.karta_osobnost h4,
#karta.karta_osobnost p b,
#karta.karta_osobnost p i,
#hra .okno .pravidla_osobnost b {
	color: #CE8068;
}
#karta.karta_udalost h3,
#karta.karta_udalost h4,
#karta.karta_udalost p b,
#karta.karta_udalost p i,
#hra #karta.karta_udalost .obsah .spravna_odpoved,
#hra .okno .pravidla_udalost b {
	color: #6A9BA5;
}
#karta.karta_perlicka h3,
#karta.karta_perlicka h4,
#karta.karta_perlicka p b,
#karta.karta_perlicka p i,
#hra .okno .pravidla_perlicka b {
	color: #6D956F;
}
#karta.karta_akcni h3,
#karta.karta_akcni h4,
#karta.karta_akcni p b,
#karta.karta_akcni p i,
#hra .okno .pravidla_akcni b {
	color: #B68196;
}
#karta.karta_vezeni h3,
#karta.karta_vezeni h4,
#karta.karta_vezeni p b,
#karta.karta_vezeni p i,
#hra .okno .pravidla_vezeni b {
	color: #302E2C;
}
#karta.karta_letadlo h3,
#karta.karta_letadlo h4,
#karta.karta_letadlo p b,
#karta.karta_letadlo p i,
#hra .okno .pravidla_letadlo b {
	color: #729DC7;
}
#karta.karta_stb h3,
#karta.karta_stb h4,
#karta.karta_stb p b,
#karta.karta_stb p i,
#hra .okno .pravidla_stb b {
	color: #D7615D;
}
#karta p,
#karta li {
	text-align: left;
	float: left;
	clear: both;
	margin: 26px 30px 0 34px;
	transition: color 150ms;
}
#karta ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#karta .front .sikmy {
	margin-top: -4px;
	/*transform: rotate(-3deg);*/
}
#hra n {
	font-size: 100%;
	vertical-align: 1%;
}
#hra d {
	font-size: 100%;
	vertical-align: -1%;
}
/*
#karta .stred {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	margin-left: 0;
	margin-right: 0;
}
#karta .stred.otocit:hover,
#karta .stred.pokracovat:hover {
	transform: translateX(-50%);
}
*/
#karta .otocit,
#karta .odpovedet,
#karta .pokracovat,
#karta .video_odkaz {
	cursor: pointer;
	padding-left: 45px;
	position: relative;
	font-weight: normal;
	font-family: averta_demo_peextrabold, sans-serif;
	font-size: 26px;
	color: #988E78;
	margin-top: 16px;
}
#karta .otocit:after,
#karta .odpovedet:after,
#karta .pokracovat:after,
#karta .video_odkaz:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 35px;
	height: 36px;
	background: url(image/ikony.png) 0 0 no-repeat;
}
#karta .otocit:after,
#karta .odpovedet:after {
	background-position: -204px -41px;
}
#karta .pokracovat:after,
#karta .otocit.proverka:after {
	background-position: -164px -41px;
}
#karta .video_odkaz:after {
	background-position: -204px 0px;
}
#karta.karta_udalost .video_odkaz:after {
	background-position: -284px 0px;
}
#karta.karta_osobnost .video_odkaz:after {
	background-position: -284px -41px;
}
#karta.karta_perlicka .video_odkaz:after {
	background-position: -325px 0px;
}
#karta.karta_letadlo .video_odkaz:after {
	background-position: -325px -41px;
}
#karta .otocit:hover,
#karta .odpovedet:hover,
#karta .pokracovat:hover,
#karta .video_odkaz:hover {
}
#karta.karta_kviz li.otocit:after,
#karta.karta_kviz li.odpovedet:after {
	background-position: -244px -41px;
}
#karta.karta_udalost li.otocit:after,
#karta.karta_udalost li.odpovedet:after {
	background-position: -244px 0px;
}
#karta ul li.otocit,
#karta ul li.odpovedet {
	margin-top: 26px !important;
}
#karta p.otocit,
#karta p.odpovedet,
#karta p.pokracovat {
	position: absolute;
	bottom: 96px;
}
#karta.karta_vezeni .front p.pokracovat,
#karta.karta_letadlo .front p.pokracovat,
#karta.karta_stb .front p.pokracovat {
	position: relative;
	bottom: auto;
}
#karta .oznameni {
	position: absolute;
	bottom: 146px;
	font-size: 24px;
	width: 440px;
}
#karta p.spravna_odpoved,
#karta p.spatna_odpoved {
	padding-top: 15px;
}
#hra #karta .obsah .spatna_odpoved {
	color: #D7615D;
}
#hra #karta .obsah .spravna_odpoved {
	color: #688659;
}

#karta.karta_kviz .front .obsah {
	padding-top: 550px;
	background: url(karty/kviz.jpg) center 70px no-repeat;
	background-size: 500px;
}

#karta.karta_vezeni .front .obsah {
	padding-top: 570px;
	background: url(karty/vezeni.jpg) center 70px no-repeat;
}
#karta.karta_vezeni .front .obsah:after,
#karta.karta_vezeni .front h3,
#karta.karta_vezeni .front h4 {
	display: none;
}
#karta.karta_vezeni .pravidla_brambor {
	position: relative;
	padding-left: 60px;
}
#karta.karta_vezeni .back .obsah:after {
	background-image: url(image/ramecek_vezeni.png);
}
#karta.karta_letadlo .back .obsah:after {
	background-image: url(image/ramecek_letadlo.png);
}
#karta.karta_stb .back .obsah:after {
	background-image: url(image/ramecek_stb.png);
}

#karta.karta_letadlo .front .obsah {
	padding-top: 610px;
	background: url(karty/letadlo.jpg) center 70px no-repeat;
}
#karta.karta_letadlo .front .obsah:after,
#karta.karta_letadlo .front h3,
#karta.karta_letadlo .front h4 {
	display: none;
}
#karta.karta_stb .front .obsah {
	padding-top: 570px;
	background: url(karty/stb.jpg) 133px 81px no-repeat;
}
#karta.karta_stb .front .obsah:after,
#karta.karta_stb .front h3,
#karta.karta_stb .front h4 {
	display: none;
}

#video_okno {
	background: none;
	width: 1085px;
	height: 792px;
	left: calc((100% - 1085px) / 2);
	top: calc((100% - 792px) / 2 + 45px);
	overflow: hidden;
	box-shadow: none;
}
.sirka_640 #video_okno {
	width: 775px;
	height: 566px;
	left: calc((100% - 775px) / 2);
	top: calc((100% - 566px) / 2);
}
.sirka_480 #video_okno {
	width: 620px;
	height: 492px;
	left: calc((100% - 600px) / 2);
	top: calc((100% - 492px) / 2);
}
#televize {
	background: url(image/televize.png) center bottom no-repeat;
	background-size: 100% auto;
	pointer-events: none;
}
#televize_cerna,
#video_okno video {
	width: 700px;
	height: 526px;
	position: absolute;
	left: 88px;
	top: 66px;
	background: url(image/monoskop.jpg) center center no-repeat;
	background-size: cover;
}
.sirka_640 #televize_cerna,
.sirka_640 #video_okno video {
	width: 500px;
	height: 375px;
	left: 63px;
	top: 49px;
}
.sirka_480 #televize_cerna,
.sirka_480 #video_okno video {
	width: 400px;
	height: 300px;
	left: 50px;
	top: 68px;
}
#tlacitko {
	position: absolute;
	left: 936px;
	top: 450px;
	width: 46px;
	height: 30px;
	background: linear-gradient(-30deg, #900, #e00);
	cursor: pointer;
	border: 2px solid #000;
	border-radius: 5px;
}
#televize_zavrit {
	position: absolute;
	left: auto;
	right: 20px;
	top: 30px;
	width: 35px;
	height: 35px;
	cursor: pointer;
	background: url(image/ikony.png) -164px 0px no-repeat;
	display: none;
}
.sirka_640 #televize_zavrit {
	right: 0px;
	top: 20px;
}
.sirka_480 #televize_zavrit {
	right: 36px;
	top: 0px;
}

#vezeni_okno {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: none;
	box-shadow: none;
	transform: none;
}
.mrize {
	z-index: 90;
	background: #000 url(image/vezeni_pozadi.jpg) center bottom;
	background-size: cover;
}
#hrnec {
	background-image: url(image/hrnec.png);
	width: 150px;
	height: 78px;
	left: 50%;
	top: 80%;
	z-index: 1;
}
.prkno {
	position: absolute;
	background: url(image/prkno1.png) center center no-repeat;
	background-size: 100% 100%;
	width: 25%;
	height: 10px;
	transform: rotate(10deg);
	transform-origin: 0 0;
	left: 0;
	top: 25%;
}
.prkno_prave {
	left: auto;
	right: 0;
	transform-origin: center center;
	transform: rotate(-190deg);
}
.prkno_sude {
	background-image: url(image/prkno2.png);
}
#brambora, .brambora {
	position: absolute;
	xbackground: #fc6;
	xbox-shadow: inset 0 0 10px #960;
	background: url(image/brambora1.png);
	width: 40px;
	height: 30px;
	border-radius: 20px;
	left: -20px;
	top: -15px;
}
div.brambora {
	animation: brambora 1s infinite linear;
}
div.brambora_prava {
	animation: brambora_prava 1s infinite linear;
}
@keyframes brambora {
	0% {transform: rotate(0)}
	50% {transform: rotate(180deg)}
	100% {transform: rotate(360deg)}
}
@keyframes brambora_prava {
	0% {transform: rotate(0)}
	50% {transform: rotate(-180deg)}
	100% {transform: rotate(-360deg)}
}
.brambora_neoloupana {
	xbackground: #960;
	xbox-shadow: inset 0 0 10px #630;
	background: url(image/brambora2.png);
}
.brambora_nechycena {
	z-index: 2;
}
.brambora_bod {
	position: absolute;
	font-size: 26px;
	color: #def;
}
.brambora_bod_minus {
	color: #fc6;
}

#vezeni_hlaska {
	top: 40px;
	text-align: center;
	color: #888;
}
#vezeni_score {
	top: 120px;
	text-align: center;
	color: #BB9374;
	font-size: 80px;
	text-shadow: #000 0px 0px 20px;
}
#vezeni_score span {
	font-size: 20px;
	display: block;
	padding-top: 10px;
}
span.brambora {
	position: absolute;
	left: 0px;
	top: 5px;
	animation: none;
	display: block;
	filter: drop-shadow(rgba(0,0,0,.8) 0px 1px 2px);
	transform: rotate(-20deg);
}

.figurka {
	width: 300px;
	height: 300px;
	background-size: 100% auto;
	background-position: center center;
	background-repeat: no-repeat;
}
.figurka {
	display: block;
	transform: scaleX(-1);
	position: absolute;
	top: 100%;
}
.sirka_480 .figurka, .sirka_640 .figurka {
	width: 150px;
	height: 150px;
	left: -150px;
	top: 20px;
}
.figurka_1 {
	background-image: url(image/favorit.png) !important;
}
.figurka_2 {
	background-image: url(image/trabi.png) !important;
}
.figurka_3 {
	background-image: url(image/skoda.png) !important;
}
.figurka_4 {
	background-image: url(image/ziguli.png) !important;
}

#vyber_figurky {
	position: relative;
}
#figurka_vyber_1,
#figurka_vyber_2,
#figurka_vyber_3,
#figurka_vyber_4 {
	box-sizing: border-box;
	position: absolute;
	text-align: left;
	clear: both;
	width: 322px;
	height: 457px;
}
.sirka_800 #figurka_vyber_1,
.sirka_800 #figurka_vyber_2,
.sirka_800 #figurka_vyber_3,
.sirka_800 #figurka_vyber_4 {
	top: 255px;
}
.sirka_800 #figurka_vyber_1 {
	left: 132px;
}
.sirka_800 #figurka_vyber_2 {
	left: 476px;
}
.sirka_800 #figurka_vyber_3 {
	left: 820px;
}
.sirka_800 #figurka_vyber_4 {
	left: 1164px;
}
.sirka_1280 #figurka_vyber_1,
.sirka_1280 #figurka_vyber_2,
.sirka_1280 #figurka_vyber_3,
.sirka_1280 #figurka_vyber_4 {
	top: 175px;
}
.sirka_1280 #figurka_vyber_1 {
	left: 235px;
}
.sirka_1280 #figurka_vyber_2 {
	left: 612px;
}
.sirka_1280 #figurka_vyber_3 {
	left: 989px;
}
.sirka_1280 #figurka_vyber_4 {
	left: 1366px;
}
.sirka_480 #figurka_vyber_1,
.sirka_480 #figurka_vyber_2,
.sirka_480 #figurka_vyber_3,
.sirka_480 #figurka_vyber_4 {
	width: 407px;
	height: 201px;
	left: 180px;
}
.sirka_480 #figurka_vyber_1 {
	top: 90px;
}
.sirka_480 #figurka_vyber_2 {
	top: 300px;
}
.sirka_480 #figurka_vyber_3 {
	top: 510px;
}
.sirka_480 #figurka_vyber_4 {
	top: 720px;
}
.sirka_640 #figurka_vyber_1,
.sirka_640 #figurka_vyber_2,
.sirka_640 #figurka_vyber_3,
.sirka_640 #figurka_vyber_4 {
	width: 407px;
	height: 201px;
	left: 320px;
}
.sirka_640 #figurka_vyber_1 {
	top: 70px;
}
.sirka_640 #figurka_vyber_2 {
	top: 280px;
}
.sirka_640 #figurka_vyber_3 {
	top: 490px;
}
.sirka_640 #figurka_vyber_4 {
	top: 700px;
}
.figurka_popis {
	position: absolute;
	background: url(image/figurka_popis.png) 0 0 no-repeat;
	text-align: left;
	width: 100%;
	height: 100%;
	top: 0;
	margin-top: -20px;
	box-sizing: border-box;
	transition: margin 200ms;
	padding: 30px;
}
.sirka_480 .figurka_popis,
.sirka_640 .figurka_popis {
	margin-left: 20px;
	margin-top: 0;
	background-image: url(image/figurka_popis_mobil.png);
	padding: 15px 15px 0px 47px;
}
.sirka_640 .figurka_popis {
	margin-left: 30px;
}
.figurka_popis h5 {
	font-size: 28px;
	margin: 0;
	padding: 90px 0 10px 0;
	background-position: 0 0;
	background-repeat: no-repeat;
}
#figurka_vyber_1 .figurka_popis h5 {
	background-image: url(image/logo_skoda.jpg);
}
#figurka_vyber_2 .figurka_popis h5 {
	background-image: url(image/logo_trabant.jpg);
}
#figurka_vyber_3 .figurka_popis h5 {
	background-image: url(image/logo_skoda.jpg);
}
#figurka_vyber_4 .figurka_popis h5 {
	background-image: url(image/logo_ziguli.jpg);
}
.figurka_popis p {
	font-size: 17px;
	line-height: 30px;
}
.sirka_480 .figurka_popis p,
.sirka_640 .figurka_popis p {
	line-height: 26px;
}
.sirka_480 .figurka_popis h5,
.sirka_640 .figurka_popis h5 {
	padding: 0;
	background-position: right top;
	background-size: auto 26px;
	font-size: 24px !important;
}

.sirka_480 .prvek:hover .figurka_popis,
.sirka_640 .prvek:hover .figurka_popis {
	margin-left: 10px;
}
.sirka_800 .prvek:hover .figurka_popis,
.sirka_1280 .prvek:hover .figurka_popis {
	margin-top: 0px;
}

#vybrat_figurku,
#pravidla,
#o_autorech,
#statistika,
#soutez,
#hrat_znovu,
.uvod #loading.loaded #loading_progress,
.dialog_volba {
	background: url(image/tlacitko.jpg) center center no-repeat;
	border-radius: 24px 29px;
	width: 345px !important;
	height: 73px;
	color: #d7ccaf;
	line-height: 70px;
	font-weight: normal;
	font-family: averta_demo_peextrabold, sans-serif;
	font-size: 28px;
	letter-spacing: 1px;
	transition: color 300ms, transform 300ms, background-image 300ms;
	transform: translateX(0);
}
#vybrat_figurku:hover,
#pravidla:hover,
#o_autorech:hover,
#statistika:hover,
#soutez:hover,
#hrat_znovu:hover,
.uvod #loading.loaded #loading_progress:hover,
.dialog_volba:hover {
	background-image: url(image/tlacitko_hover.jpg);
	color: #E8DBBD;
	transform: translateX(-5px);
}
#vybrat_figurku,
#pravidla,
#spustit_vezeni,
#o_autorech,
#statistika,
#soutez,
#hrat_znovu {
	left: calc((100% - 345px) / 2 + 2px);
}
.sirka_800 #vybrat_figurku,
.sirka_800 #pravidla,
.sirka_800 #spustit_vezeni,
.sirka_800 #o_autorech,
.sirka_800 #statistika,
.sirka_800 #soutez,
.sirka_800 #hrat_znovu {
	left: 1080px;
}
.sirka_1280 #vybrat_figurku,
.sirka_1280 #pravidla,
.sirka_1280 #spustit_vezeni,
.sirka_1280 #o_autorech,
.sirka_1280 #statistika,
.sirka_1280 #soutez,
.sirka_1280 #hrat_znovu {
	left: 1360px;
}
#vybrat_figurku,
#statistika {
	top: 639px;
}
.sirka_800 #vybrat_figurku,
.sirka_800 #statistika {
	top: 642px;
}
.sirka_1280 #vybrat_figurku,
.sirka_1280 #statistika {
	top: 588px;
}
#pravidla,
#soutez {
	top: 725px;
}
.sirka_800 #pravidla,
.sirka_800 #soutez {
	top: 726px;
}
.sirka_1280 #pravidla,
.sirka_1280 #soutez {
	top: 672px;
}
#o_autorech,
#hrat_znovu,
#spustit_vezeni {
	top: 810px;
}
.sirka_800 #o_autorech,
.sirka_800 #hrat_znovu,
.sirka_800 #spustit_vezeni {
	top: 813px;
}
.sirka_1280 #o_autorech,
.sirka_1280 #hrat_znovu,
.sirka_1280 #spustit_vezeni {
	top: 759px;
}

#podokno_zavrit {
	text-align: center;
	left: calc((100% - 160px) / 2);
	bottom: 80px;
	padding: 0;
	width: 160px;
	height: 55px;
	border: 3px solid #ca7e65;
	line-height: 56px;
	border-radius: 25px;
	color: #958972;
	font-weight: normal;
	font-family: averta_demo_peextrabold, sans-serif;
	font-size: 28px;
	letter-spacing: 1px;
}
#podokno_zavrit:hover {
	color: #ca7e65;
}

#hemala {
	width: 500px;
	height: 348px;
	left: calc((100% - 500px) / 2 + 3px);
	top: 270px;
	background: url(image/hemala_640.jpg) 0 0 no-repeat;
}
.sirka_800 #hemala {
	width: 909px;
	height: 661px;
	left: 90px;
	top: 285px;
	background: url(image/hemala_800.jpg) 0 0 no-repeat;
}
.sirka_1280 #hemala {
	width: 1080px;
	height: 800px;
	left: 128px;
	top: 184px;
	background: url(image/hemala_1280.jpg) 0 0 no-repeat;
}
#usta {
	position: absolute;
	width: 96px;
	height: 43px;
	top: 338px;
	left: 405px;
}
.sirka_480 #usta,
.sirka_640 #usta {
	transform-origin: 1% 1%;
	transform: scale(0.45);
	left: 192px;
	top: 156px;
}
.sirka_800 #usta {
	transform-origin: 0 0;
	transform: scale(0.85);
	left: 338px;
	top: 291px;
}

#hra_logo_stredni {
	width: 340px;
	height: 141px;
	right: calc((100% - 340px) / 2 + 11px);
	top: 93px;
	background: url(image/logo_male.jpg) 0 0 no-repeat;
}
.sirka_800 #hra_logo_stredni,
.sirka_1280 #hra_logo_stredni {
	background: url(image/logo_stredni.jpg) 0 0 no-repeat;
	width: 490px;
	height: 380px;
}
.sirka_800 #hra_logo_stredni {
	right: 100px;
	top: 225px;
}
.sirka_1280 #hra_logo_stredni {
	right: 155px;
	top: 170px;
}


#razitko_uspech {
	background: url(image/razitko.png) center center no-repeat;
	background-size: 100% 100%;
	width: 200px;
	height: 200px;
	left: 300px;
	top: 500px;
	z-index: 80;
}
#razitko_uspech.animace {
	animation: razitko 0.2s ease-in;
}
@keyframes razitko {
	from { transform: scale(3); opacity: 0; }
	to { transform: scale(1);  opacity: 1; }
}

#propustka {
	position: absolute;
	z-index: 80;
	width: 460px;
	height: 560px;
	left: calc((100% - 460px) / 2);
	top: calc((100% - 560px) / 2);
	background: url(image/propustka.jpg) center center  no-repeat;
	box-sizing: border-box;
	box-shadow: rgba(0,0,0,0.5) 0 0 10px;
	transform: rotate(2deg);
	animation: propustka 1s 1 cubic-bezier(0.22, 0.61, 0.36, 1);
}
@keyframes propustka {
	0% {transform: translate(0%,-200%) rotate(0deg);}
	100% {transform: translate(0,0) rotate(2deg);}
}
/*
.sirka_480 #propustka {
	top: 109px;
}
*/
#vezeni_okno #propustka p {
	padding: 110px 20px;
}
#vezeni_okno #propustka p b {
	color: #958972;
	font-size: 24px;
}
#vezeni_okno #propustka p span {
	font-size: 58px;
	display: block;
	padding-bottom: 10px;
}
#propustka #razitko_uspech {
	width: 210px;
	height: 210px;
	left: 125px;
	top: 225px;
}
#vezeni_zavrit {
	text-align: center;
	left: calc((100% - 180px) / 2);
	bottom: 35px;
	padding: 0;
	width: 180px;
	height: 55px;
	border: 3px solid #ca7e65;
	line-height: 56px;
	border-radius: 25px;
	color: #958972;
	font-weight: normal;
	font-family: averta_demo_peextrabold, sans-serif;
	font-size: 28px;
	letter-spacing: 1px;
	position: absolute;
}
#vezeni_zavrit:hover {
	color: #ca7e65;
}

#soutez_iframe iframe {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	border: none;
	float: left;
}
.sirka_640 #soutez_iframe iframe {
}
.sirka_480 #soutez_iframe iframe {
}

#statistika_podrobne .razitko {
	background: url(image/razitko.png) center center no-repeat;
	background-size: 100% 100%;
	width: 100px;
	height: 100px;
	display: inline-block;
	margin: 0 20px 20px 0;
}