/* animate temp */
/* .animate {background-color: rgba(255, 0, 0, 0.096);} */

.theather-img {
	display: block;
	position: absolute;
}

.theather-box {
	position: absolute;
	inset: 0;
}

.theather-box > .theather-img {
	max-height: 100%;
}

.ti-base {
	width: 1920em;
	height: 1080em;
}

.ti-kytara {
	left: 411em;
	top: 349em;
	height: 246em;
	transform: rotate(60deg);
	animation-name: kytara-passive;
	animation-duration: 31s;
	animation-iteration-count: infinite;
	transform-origin: 61em 198em;
	filter: drop-shadow(0 0 6em #c0c0c0a2);
}

.ti-kytara.animate {
	animation-name: ti-kytara;
	animation-duration: 100s;
	animation-iteration-count: 1;
}

.ti-medved-container {
	transform-origin: 905em 794em;
	animation-name: medved-passive;
	animation-duration: 22s;
	animation-iteration-count: infinite;
	filter: drop-shadow(0 0 6em #c0c0c0a2);

}

.ti-medved-telo {
	left: 828em;
	top: 599em;
	height: 232em;
}

.ti-medved-pracka {
	left: 811em;
	top: 668em;
	height: 79em;
	transform: rotate(-30deg);
	transform-origin: 34em 16em;
}

.ti-medved-pracka.animate {
	animation-name: ti-medved-pracka;
	animation-duration: 100s;
}

.ti-princezna-bg {
	left: 1673em;
	top: 282em;
	height: 200em;
}

.ti-princezna-container {
	animation-name: princezna-passive;
	animation-duration: 30s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}

.ti-princezna-prava-ruka {
	left: 1683em;
	top: 342em;
	height: 33em;
	transform-origin: 63em 20em;
	transform: rotate(0deg);
}

.ti-princezna-prava-ruka.animate {
	animation-name: ti-princezna-prava-ruka;
	animation-duration: 100s;
}

.ti-princezna-telo {
	left: 1714em;
	top: 307em;
	height: 131em;
}

.ti-harfa {
	left: 1671em;
	top: 330em;
	height: 101em;
	transform-origin: 45em 95em;
	transform: rotate(7deg);
}

.ti-harfa.animate {
	animation-name: ti-harfa;
	animation-duration: 100s;
}

.ti-princezna-leva-ruka {
	left: 1691em;
	top: 357em;
	height: 26em;
	transform-origin: 65em 10em;
	transform: rotate(0deg);
}

.ti-princezna-leva-ruka.animate {
	animation-name: ti-princezna-leva-ruka;
	animation-duration: 100s;
}

.ti-zamek {
	right: 0em;
	top: 174em;
	height: 645em;
}

.ti-kricici-strom-bg {
	left: 0em;
	top: 0em;
	height: 627em;
	filter: drop-shadow(0 0 6em #c0c0c054);
}

.ti-kricici-strom-bg, .ti-kricici-strom-fg {
	animation-name: kricici-strom;
	animation-duration: 6s;
	animation-iteration-count: infinite;
	transform-origin: 170em 550em;
}

.ti-rulik-container {
	filter: drop-shadow(0 0 6em #a8df2641);
}

.ti-rulik-container, .ti-klicka-containers {
	animation-name: rulik;
	animation-iteration-count: infinite;
	animation-duration: 60s;
}

.ti-rulik {
	left: 1162em;
	top: 36em;
	height: 721em;
}

.ti-klicka-bg, .ti-klicka-fg {
	left: 1340em;
	top: 183em;
	height: 191em;
}

.ti-piskle-container {
	/* left: 0em;
	top: 0em; */
	animation-name: piskle-passive;
	animation-duration: 5s;
	animation-iteration-count: infinite;
}

.ti-piskle-container-inner {
	left: 0em;
	top: 0em;
	width: 1920em;
	height: 1080em;
	transform-origin: 1415em 292em;
	transform: scale(1) rotate(0deg);
}

.ti-piskle-container-inner.animate {
	animation-name: ti-piskle-container-inner;
	animation-duration: 100s;
	animation-timing-function: ease-in-out;
}

.ti-piskle-telo {
	left: 1301em;
	top: 258em;
	height: 87em;
}

.ti-piskle-ruka {
	right: 511em;
	top: 279em;
	width: 72em;
	height: 34em;
}

.ti-piskle-ruka.animate {
	animation-name: ti-piskle-ruka;
	animation-duration: 100s;
}

.ti-destnikova-zena {
	left: 251em;
	top: 839em;
	height: 252em;
	transform: rotate(16deg);
	filter: drop-shadow(0 0 8em #ffffff3d);
}

.ti-destnikova-zena.animate {
	animation-name: ti-destnikova-zena;
	animation-duration: 100s;
}

.ti-kricici-strom-fg {
	left: 0em;
	top: 0em;
	height: 627em;
}

.ti-vetrna-vetev-container {
	animation-name: vetrna-vetev;
	animation-duration: 6s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
	transform-origin: 1390em 1660em;
}

.ti-vetrna-vetev {
	left: -112em;
	top: 466em;
	height: 645em;
}

.ti-jesterka {
	left: 1340em;
	top: 538em;
	height: 179em;
	transform: rotate(20deg);
}

.ti-jesterka.animate {
	animation-name: ti-jesterka;
	animation-duration: 100s;
}

.ti-kluk-container {
	animation-name: vetrna-vetev-kontra;
	animation-duration: 6s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
	transform-origin: 530em 860em;
}

.ti-kluk-telo {
	left: 476em;
	top: 622em;
	height: 298em;
	transform-origin: 50em 220em;
}

.ti-kluk-telo.animate {
	animation-name: kluk-telo;
	animation-duration: 100s;
}

.ti-bonga {
	left: 483em;
	top: 808em;
	height: 42em;
}

.ti-bonga.animate {
	animation-name: ti-bonga;
	animation-duration: 100s;
}

.ti-rukavicka-prava {
	left: 475em;
	top: 788em;
	height: 38em;
	transform: rotate(-20deg);
}

.ti-rukavicka-prava.animate {
	animation-name: ti-rukavicka-prava;
	animation-duration: 100s;
}

.ti-rukavicka-leva {
	left: 554em;
	top: 791em;
	height: 29em;
}

.ti-rukavicka-leva.animate {
	animation-name: ti-rukavicka-leva;
	animation-duration: 100s;
}

.ti-popelnice-telo {
	left: 1026em;
	top: 633em;
	height: 235em;
}

.ti-popelnice-rucicka {
	left: 1129em;
	top: 770em;
	height: 99em;
	transform: rotate(-70deg);
}

.ti-popelnice-rucicka.animate {
	animation-name: ti-popelnice-rucicka;
	animation-duration: 100s;
	animation-timing-function: ease-out;
}

.ti-popelnice-hlava-container {
	left: 0em;
	top: 0em;
	transform: rotate(0deg);
	transform-origin: 1124em 661em;
	filter: drop-shadow(0 0 6em #5353537a);
}

.ti-popelnice-hlava-container.animate {
	animation-name: ti-popelnice-hlava-container;
	animation-duration: 100s;
}


.vetrak-container-1 {
	position: absolute;
	left: 1051em;
	top: 621em;
	height: 61em;
	aspect-ratio: 1 / 1;
	transform: perspective(80em) rotateX(30deg) rotateY(-25deg);
	border-radius: 100vw;
	overflow: hidden;
}

.ti-popelnice-vetrak-1 {
	width: 100%;
	height: 100%;
}

.ti-popelnice-vetrak-1.animate {
	animation-name: ti-popelnice-vetraky-C;
	animation-duration: 100s;
}

.vetrak-container-2 {
	position: absolute;
	left: 1118em;
	top: 638em;
	height: 47em;
	aspect-ratio: 1 / 1;
	transform: perspective(40em) rotateX(2.5deg);
	border-radius: 100vw;
	overflow: hidden;
}

.ti-popelnice-vetrak-2 {
	width: 100%;
	height: 100%;
}

.ti-popelnice-vetrak-2.animate {
	animation-name: ti-popelnice-vetraky-A;
	animation-duration: 100s;
}

.vetrak-container-3 {
	position: absolute;
	left: 1173em;
	top: 632em;
	height: 46em;
	aspect-ratio: 1 / 1;
	transform: perspective(80em) rotateX(12deg) rotateY(5deg);
	border-radius: 100vw;
	overflow: hidden;
}

.ti-popelnice-vetrak-3 {
	width: 100%;
	height: 100%;
}

.ti-popelnice-vetrak-3.animate {
	animation-name: ti-popelnice-vetraky-B;
	animation-duration: 100s;
}

.ti-popelnice-hlava {
	left: 1020em;
	top: 574em;
	height: 123em;
}

.ti-vlny-5 {
	left: 1489em;
	top: 940em;
	height: 205em;
}

.ti-vlny-1 {
	left: 1507em;
	top: 941em;
	height: 128em;
}

.ti-bubliny-containers {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 468em;
	height: 500em;
}

.ti-bubliny {
	position: absolute;
	/* left: 0em; */
	/* bottom: 0em; */
	height: 50em;
	aspect-ratio: 1/1; /* vymenit*/
	background-image: url(../img/bublina-1.png);
	background-size: contain;
	/* opacity: 0.8; */
}

.ti-bubliny.animate {
	animation-name: ti-bubliny;
	animation-duration: 100s;
}

.ti-vlny-2 {
	left: 1492em;
	top: 973em;
	height: 92em;
	animation-delay: 7s;
}

.ti-vlny-3 {
	left: 1473em;
	top: 1006em;
	height: 120em;
	animation-delay: 3s;
}

.ti-vlny-4 {
	left: 1468em;
	top: 1036em;
	height: 120em;
	animation-delay: 11s;
}

.vlna {
	opacity: 0.9;
	filter: drop-shadow(5em -10em 4em #1d1d1d94);
	animation-name: wave;
	animation-duration: 14s;
	animation-timing-function: ease-in-out;
	animation-direction: alternate;
	animation-iteration-count: infinite;
}

.ti-briza {
	left: 0em;
	bottom: 0em;
	height: 440em;
}

.ti-lisejnik-1 {
	left: 422em;
	top: 945em;
	height: 197em;
	transform: rotate(40deg);
}

.ti-kululu {
	left: 426em;
	top: 904em;
	height: 153em;
	transform: rotate(-60deg);
}

.ti-kululu.animate {
	animation-name: ti-kululu;
	animation-duration: 100s;
}

.ti-lisejnik-2 {
	left: 328em;
	top: 976em;
	height: 241em;
	transform: rotate(15deg);
	filter: drop-shadow(2em 0 4em #16161691);
}

.steblo-container {
	position: absolute;
	inset: 0;
	animation: light-wind;
	animation-duration: 10s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}

.steblo-container-1 {
	transform-origin: 833em 1090em;
}

.ti-steblo-1 {
	left: 818em;
	bottom: -37em;
	height: 256em;
}

.ti-steblo-1.animate {
	animation-name: ti-steblo-1;
	animation-duration: 100s;
}

.steblo-container-2 {
	transform-origin: 893em 1070em;
	animation-delay: .2s;
}

.ti-steblo-2 {
	left: 883em;
	bottom: -37em;
	height: 256em;
}

.ti-steblo-2.animate {
	animation-name: ti-steblo-2;
	animation-duration: 100s;
}

.steblo-container-3 {
	transform-origin: 965em 1088em;
	animation-delay: .5s;
}

.ti-steblo-3 {
	left: 951em;
	bottom: -37em;
	height: 256em;
}

.ti-steblo-3.animate {
	animation-name: ti-steblo-3;
	animation-duration: 100s;
}

.steblo-container-4 {
	transform-origin: 1042em 1075em;
	animation-delay: .4s;
}

.ti-steblo-4 {
	left: 1027em;
	bottom: -37em;
	height: 256em;
}

.ti-steblo-4.animate {
	animation-name: ti-steblo-4;
	animation-duration: 100s;
}

.ti-steblo-1, .ti-steblo-2, .ti-steblo-3, .ti-steblo-4 {
	transform-origin: 26em 228em;
	filter: drop-shadow(0 0 8em #ececec62);
}

.ti-hodiny-rameno-1-container {
	left: 800em;
	top: -128em;
	width: 40.266em;
	height: 207em;
	filter: drop-shadow(2em -4em 12em #ffffffa2);
	animation-name: hodiny-passive;
	animation-duration: 18s;
	animation-iteration-count: infinite;
}

.ti-hodiny-rameno-1-container-inner.animate {
	animation-name: hodiny-rameno-active;
	animation-duration: 100s;
}

.ti-hodiny-rameno-1 {
	width: 100%;
	height: 100%;
}

.ti-hodiny-rameno-2-container {
	position: absolute;
	left: 10em;
	top: 190em;
	width: 29.95em;
	height: 154em;
	transform-origin: 7em -5em;
}

.ti-hodiny-rameno-2-container.animate {
	animation-name: hodiny-passive;
	animation-duration: 100s;
}

.ti-hodiny-rameno-2-container-inner {
	transform-origin: 14em 2em;
}

.ti-hodiny-rameno-2-container-inner.animate {
	animation-name: hodiny-rameno-active;
	animation-duration: 100s;
}

.ti-hodiny-rameno-2 {
	width: 100%;
	height: 100%;
}

.ti-hodiny-telo-container {
	position: absolute;
	left: -37em;
	top: 135em;
	width: 98.316em;
	height: 198em;
	transform-origin: 55em 10em;
}

.ti-hodiny-telo-container.animate {
	animation-name: hodiny-rameno-active;
	animation-duration: 100s;
}

.ti-hodiny-telo {
	width: 100%;
	height: 100%;
}

.ti-hodiny-rucicka-mala {
	left: 47.4em;
	bottom: 35em;
	height: 44.3em;
}

.ti-hodiny-rucicka-mala.animate {
	animation-name: ti-hodiny-rucicka-mala;
	animation-duration: 100s;
	animation-timing-function: linear;
}

.ti-hodiny-rucicka-velka {
	left: 47em;
	bottom: 34em;
	height: 48.3em;
}

.ti-hodiny-rucicka-velka.animate {
	animation-name: ti-hodiny-rucicka-velka;
	animation-duration: 100s;
	animation-timing-function: linear;
}

.ti-rickroll {
	left: 70em;
	bottom: 0em;
	height: 400em;
	filter: drop-shadow(0 0 30em #ffac2f70);
	transform: translateY(120%);
}

.ti-rickroll.animate {
	transition: transform 0.6s ease-in-out;
	transform: translateY(0%);
}

.ti-vetrnik-container {
	transform: rotate(2deg);
	transform-origin: 69em 1082em;
	filter: drop-shadow(-3em -5em 6em #0000006b);
	animation-name: vetrnik-passive;
	animation-duration: 30s;
	animation-iteration-count: infinite;
}

.ti-vetrnik-tycka {
	left: 40em;
	top: 870em;
	height: 218em;
}

.ti-vetrnik-telo-container {
	transform-origin: 75em 858em;
}

.ti-vetrnik-telo-container.animate {
	animation-name: ti-vetrnik-container;
	animation-duration: 100s;
}

.ti-vetrnik-telo {
	left: -2em;
	top: 781em;
	height: 158em;
	animation-name: vetrnik-telo-passive;
	animation-duration: 80s;
	animation-iteration-count: infinite;
}
