/**
 * Responzivní úpravy – zachovává vzhled na desktopu (1024px), na mobilu bez horizontálního scrollu.
 */

/* --- Tablet a menší desktop --- */
@media screen and (max-width: 1100px) {
	#all {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}

	#all_head {
		position: relative;
		width: 100%;
	}

	#slideshow {
		position: relative;
		top: auto;
		left: auto;
		width: 100%;
		height: auto;
		max-height: none;
	}

	.cycle-slideshow {
		width: 100% !important;
		max-width: 100%;
		height: auto !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.cycle-slideshow img {
		width: 100% !important;
		height: auto !important;
		max-height: 40vw;
		object-fit: cover;
	}

	#main_and_footer {
		position: relative;
		top: auto !important;
		left: auto;
		width: 100%;
	}

	#main,
	#end {
		width: auto;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
		box-sizing: border-box;
	}

	#main_n {
		width: 100%;
	}

	.main_l,
	.main_r {
		display: none;
	}

	.main_c {
		width: 100%;
		float: none;
		background: #330000;
	}

	.menu_l,
	.menu_r {
		display: none;
	}

	.menu_c {
		width: auto;
		float: none;
		flex: 1;
		min-width: 0;
		/* bez textury prošívání – jednolitá barva menu */
		background: #330000;
	}

	.menu {
		display: flex;
		flex-wrap: wrap;
		height: auto;
		min-height: 44px;
		background: #330000;
	}

	.menu ul {
		margin-left: 0;
		padding: 4px 8px;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
		background: transparent;
	}

	.menu li {
		background: transparent;
	}

	.menu a {
		padding: 10px 14px 8px;
		font-size: 1em;
		height: auto;
		color: #e8ddd4;
	}

	.menu a:hover {
		color: #ffffff;
		background: rgba(255, 255, 255, 0.15);
	}

	.menu .current_page a {
		color: #ffffff;
		background: #996666;
		font-weight: bold;
	}

	#head_foto_l,
	#head_foto_r,
	#footer_end_l,
	#footer_end_r {
		display: none;
	}

	#head_foto_c,
	#footer_end_c {
		width: 100%;
		float: none;
	}

	#head_foto {
		height: auto;
		min-height: 12px;
	}

	#up {
		right: 8px;
		left: auto;
	}
}

/* --- Mobil --- */
@media screen and (max-width: 768px) {
	body {
		font-size: 14px;
	}

	h1 {
		font-size: 1.75em;
	}

	h2 {
		font-size: 1.35em;
	}

	#head {
		height: auto;
		min-height: 70px;
		padding-bottom: 8px;
		overflow: hidden;
	}

	#head img {
		margin-left: 12px;
		max-width: 45%;
		height: auto;
	}

	#head h1 {
		margin-left: 12px;
		font-size: 1.35em;
	}

	#head p {
		margin-left: 12px;
	}

	.head_item,
	.head_item2,
	#login {
		float: none;
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
		text-align: center;
		margin: 6px 0 0;
	}

	#login {
		margin-right: 0;
		padding: 0 12px 8px;
	}

	#login_login,
	#login_password {
		max-width: 100%;
		box-sizing: border-box;
	}

	.menu li {
		display: block;
		width: 100%;
	}

	.menu a {
		float: none;
		display: block;
		width: 100%;
		box-sizing: border-box;
		text-align: center;
		border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	}

	.menu .current_page a {
		color: #ffffff;
		background: #996666;
	}

	#main .title {
		padding: 20px 16px 14px;
		font-size: 1.5em;
	}

	#main .entry {
		padding: 0 16px 16px;
		font-size: 1.05em;
	}

	#main .bottom {
		background-size: contain;
		background-position: center bottom;
	}

	.global_notice {
		font-size: 0.95em;
		padding: 4px;
	}

	.table-wrap {
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		margin-bottom: 1em;
	}

	.table-wrap table {
		width: 100%;
		min-width: 260px;
	}

	.div-table {
		display: block;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		box-sizing: border-box;
	}

	.div-row {
		display: block;
		width: 100%;
	}

	.div-column {
		display: block;
		width: 100% !important;
		float: none;
		box-sizing: border-box;
		padding: 4px 8px;
		border-bottom: 1px solid #ddd;
	}

	.div-head .div-column {
		font-weight: bold;
		background-color: #550000;
		color: #fff;
	}

	textarea {
		max-width: 100%;
		width: 100%;
		box-sizing: border-box;
	}

	.ui-dialog {
		max-width: 95vw !important;
	}
}

/* Velmi úzké displeje */
@media screen and (max-width: 400px) {
	.menu a {
		padding: 8px 10px 6px;
		font-size: 0.95em;
	}

	.cycle-slideshow img {
		max-height: 50vw;
	}
}