/* Responsive overrides – aktivuje se pod 1000px */
@media (max-width: 1000px) {
	/* Grid – ruší fixní 960px šířku */
	.row-main { width: auto; max-width: 960px; padding: 0 15px; box-sizing: border-box; }
	.col { float: none; left: auto; }
	.col-full { margin-left: 0; width: auto; }

	/* Header – odstraňuje absolutní pozicování a velké pozadí.
	   Barvy odpovídají bg-header.png (světle zelený pruh + tmavší obrys) */
	#header {
		height: auto;
		min-width: 0;
		background: #50b050;
		padding: 0;
	}
	/* Reorder: #site-menu (ročníky) -> #logo -> #main-menu */
	#header .row-main {
		display: flex;
		flex-direction: column;
	}
	#site-menu { order: 1; }
	#logo { order: 2; align-self: center; }
	#main-menu { order: 3; }

	/* Logo se žlutým kruhem (jako v bg-header.png) a tmavším zeleným prstencem */
	#logo {
		position: static;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 170px;
		height: 170px;
		background: #f0e010;
		border-radius: 50%;
		box-shadow: 0 0 0 20px #70e060;
		margin: 40px auto;
	}
	#logo img {
		width: 140px;
		height: auto;
	}

	#site-menu, #main-menu {
		position: static;
		margin: 0 -15px;
		padding: 4px 15px;
		background: #70e060;
	}
	#site-menu ul, #main-menu ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	#site-menu ul li, #main-menu ul li { float: none; }
	#site-menu ul li, #main-menu ul li { padding: 0; }
	#site-menu ul li a, #main-menu ul li a {
		height: auto;
		padding: 3px 6px;
		color: #000;
	}
	#site-menu ul li a:hover, #main-menu ul li a:hover { color: #f00000; }

	#main-menu ul li a { padding: 4px 10px; }

	/* Footer – tmavší zelená z bg-footer.png */
	#footer {
		min-width: 0;
		height: auto;
		background: #50b050;
		border-top: none;
		padding: 12px 15px;
		margin: 25px 0 0;
		box-sizing: border-box;
		color: #000;
	}
	#footer a { color: #000; }
	#footer .fl, #footer .fr { float: none; display: block; text-align: center; }

	/* Obrázky – nechce se nám overflow */
	img { max-width: 100%; height: auto; }

	/* Rotator na úvodní stránce – přepíše .fr (inline + float right),
	   aby jquery.cycle správně spočítal rozměry kontejneru.
	   Explicitní rozměry kvůli tomu, že globální img { height: auto }
	   by jinak ještě před načtením dal výšku 0 a cycle plugin by
	   spočítal nulovou výšku kontejneru. */
	.cycle {
		float: none !important;
		display: block !important;
		width: 270px;
		height: 320px;
		max-width: 100%;
		margin: 0 auto 20px;
	}
	.cycle img {
		width: 270px;
		height: 320px;
		max-width: 100%;
	}

	/* Tabulky – povolíme horizontální scroll u širokých */
	table { display: block; overflow-x: auto; max-width: 100%; }
	table.plain { display: table; overflow: visible; }

	/* Bannery sponzorů */
	#banners img { margin: 5px 8px; max-height: 90px; width: auto; }

	/* Sponzoři – obrázek nad textem */
	.item-box .img-box { float: none; text-align: center; margin-bottom: 10px; }
	.item-box .img-box img { float: none; margin: 0 auto; display: inline-block; }

	/* Půlené sloupce → plná šířka */
	.col-h-l, .col-h-r { width: 100%; float: none; display: block; }

	/* Formulář – plná šířka inputů */
	.form-box { padding: 15px; }
	.form-box input.inp-text, .form-box textarea { width: 100%; box-sizing: border-box; }
}

/* Mobilní telefony */
@media (max-width: 600px) {
	body { font-size: 95%; }
	#site-menu ul li a { padding: 2px 4px; font-size: 90%; }
	h1 { font-size: 1.5em; }
	h3 { font-size: 1.15em; }

	/* Hlavní úvodní tabulka – mobilní stack */
	table.plain.big tr,
	table.plain tr { display: block; margin-bottom: 8px; }
	table.plain td { display: block; padding: 2px 0; }
}