html {
	-webkit-touch-callout: none;
	/* iOS Safari */
	-webkit-user-select: none;
	/* Safari */
	-khtml-user-select: none;
	/* Konqueror HTML */
	-moz-user-select: none;
	/* Old versions of Firefox */
	-ms-user-select: none;
	/* Internet Explorer/Edge */
	user-select: none;
	/* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

@font-face {
    font-family: 'allerregular';
    src: url('../allerregular/aller_rg-webfont.eot');
    src: url('../allerregular/aller_rg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../allerregular/aller_rg-webfont.woff2') format('woff2'),
         url('../allerregular/aller_rg-webfont.woff') format('woff'),
         url('../allerregular/aller_rg-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

body {
	background-color: #2E3A4C;
	margin: 0;
	font-family: 'EB Garamond', serif;
}

p {
	font-family: 'allerregular', Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
}

a {
	text-decoration: none;
	color: inherit;
}

.audio {
	width: 8rem;
	height: 8rem;
	position: absolute;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}

.ppbutton {
	position: absolute;
	cursor: pointer;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}

.fa-play {
	display: block;
	width: 42px;
	height: 42px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 42 42'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%232e3a4c;%7D.b%7Bfill:%23e5bd50;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M7209.7974-7201.5244l-14.9034-9.06a2.0368,2.0368,0,0,0-3.0229,1.7779v17.6132a2.0356,2.0356,0,0,0,3.0229,1.7779l14.9034-8.5523A2.039,2.039,0,0,0,7209.7974-7201.5244Z' transform='translate(-7179 7221)'/%3E%3Cpath class='b' d='M7200-7221a20.9964,20.9964,0,0,0-21,21,20.9964,20.9964,0,0,0,21,21,20.9964,20.9964,0,0,0,21-21A20.9964,20.9964,0,0,0,7200-7221Zm9.7972,23.0323-14.9032,8.5524a2.036,2.036,0,0,1-3.023-1.7782v-17.613a2.0371,2.0371,0,0,1,3.023-1.7782l14.9032,9.0605A2.0388,2.0388,0,0,1,7209.7972-7197.9677Z' transform='translate(-7179 7221)'/%3E%3C/svg%3E");
}

.fa-pause {
	display: block;
	width: 42px;
	height: 42px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 42 42'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%232e3a4c;%7D.b%7Bfill:%23e5bd50;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M7206.7744-7208.1289H7202.71a1.3582,1.3582,0,0,0-1.3545,1.3545v13.5488a1.3582,1.3582,0,0,0,1.3545,1.3545h4.0649a1.3582,1.3582,0,0,0,1.3545-1.3545v-13.5488A1.3582,1.3582,0,0,0,7206.7744-7208.1289Z' transform='translate(-7179 7221)'/%3E%3Cpath class='a' d='M7197.2905-7208.1289h-4.0649a1.3582,1.3582,0,0,0-1.3545,1.3545v13.5488a1.3582,1.3582,0,0,0,1.3545,1.3545h4.0649a1.3582,1.3582,0,0,0,1.3545-1.3545v-13.5488A1.3582,1.3582,0,0,0,7197.2905-7208.1289Z' transform='translate(-7179 7221)'/%3E%3Cpath class='b' d='M7200-7221a20.9964,20.9964,0,0,0-21,21,20.9964,20.9964,0,0,0,21,21,20.9964,20.9964,0,0,0,21-21A20.9964,20.9964,0,0,0,7200-7221Zm-1.3548,27.7742a1.3589,1.3589,0,0,1-1.3549,1.3548h-4.0645a1.3588,1.3588,0,0,1-1.3548-1.3548v-13.5484a1.3588,1.3588,0,0,1,1.3548-1.3548h4.0645a1.3589,1.3589,0,0,1,1.3549,1.3548Zm9.4838,0a1.3588,1.3588,0,0,1-1.3548,1.3548H7202.71a1.3589,1.3589,0,0,1-1.3549-1.3548v-13.5484a1.3589,1.3589,0,0,1,1.3549-1.3548h4.0645a1.3588,1.3588,0,0,1,1.3548,1.3548Z' transform='translate(-7179 7221)'/%3E%3C/svg%3E");
}

.rotate {
	animation: rotation 4s infinite linear;
}

@keyframes rotation {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(359deg);
	}
}

.obrazek {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
}

.img {
	width: 128px;
	height: 128px;
}

h1 {
	font-size: 1rem;
	padding: 1rem;
	margin: 0;
  color: #E5BD50;
}

h2 {
	line-height: 2rem;
}

.dropbtn {
	background-color: #E5BD50;
	color: #2E3A4C;
	padding: 1rem;
	font-size: 1rem;
	border: none;
	cursor: pointer;
	height: 100%;
}

.dropdown {
	position: relative;
	display: inline-block;
	right: 0;
	margin-left: auto;
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

.dropdown-content a {
	color: #2E3A4C;
	padding: 1rem;
	text-decoration: none;
	display: block;
}

.dropdown-content a:hover {
	background-color: #f1f1f1
}

.dropdown:hover .dropdown-content {
	display: block;
}

.dropdown:hover .dropbtn {
	background-color: #E5BD50;
}

.dropdown svg {
	height: 1rem;
	width: auto;
	vertical-align: text-top;
	margin-right: 0.25rem;
	fill: #2E3A4C;
}

.menu {
	width: 100%;
	background-color: #2E3A4C;
	position: fixed;
	z-index: 1;
	display: inline-flex;
	top: 0;
	box-shadow: 0 0 1rem #19212d;
}

.podpis {
	text-align: center;
	color: #E5BD50;
	margin: 2rem 0 2rem 0;
	font-size: 0.9rem;
}

.podpis a:hover {
	text-decoration: underline;
}

@media screen and (min-width: 1025px) {
	.text {
		padding: 4rem 3rem 3rem 3rem;
		background-color: #f9f9f9;
		line-height: 1.5rem;
		font-size: 1rem;
		color: #2E3A4C;
	}
	.zastaveni {
		margin: auto;
		width: 50%;
		margin-top: 3rem;
	}
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
	.text {
		padding: 4rem 3rem 3rem 3rem;
		background-color: #f9f9f9;
		line-height: 1.5rem;
		font-size: 1rem;
		color: #2E3A4C;
	}
	.zastaveni {
		margin: auto;
		width: 75%;
		margin-top: 3rem;
	}
}

@media screen and (max-width: 767px) {
	.text {
		padding: 4rem 1rem 1rem 1rem;
		background-color: #f9f9f9;
		line-height: 1.5rem;
		font-size: 1rem;
		color: #2E3A4C;
	}
	.zastaveni {
		margin: auto;
		width: 100%;
	}
}