@media (max-width: 900px) {
	html, body {
		background-image: none;
		background-color: #faf8f8;
	}

	body {
		padding-left: 0;
		display: flex;
		flex-direction: column;
	}

	#header {
		order: 1;
		position: relative;
		height: auto;
		min-height: 96px;
		padding: 10px 10px 12px 132px;
		text-align: left;
		background: none;
		color: #520000;
		border-bottom: 1px solid #c5adad;
		box-sizing: border-box;
	}

	#header h1 {
		position: absolute;
		top: 8px;
		left: 8px;
		width: 110px;
		height: 84px;
		margin: 0;
		background-position: left top;
		background-size: contain;
	}

	#header #adminName {
		position: static;
		width: auto;
		text-align: left;
		margin: 0 0 0.25em 0;
		color: #8b6666;
		font-size: 0.95em;
	}

	#header #pageUri {
		display: none;
	}

	#header h2,
	#header p {
		max-width: none;
		width: auto;
		margin-left: 0;
		text-align: left;
		word-break: break-word;
	}

	#header h2 {
		font-size: 1.9em;
		line-height: 1.08;
		margin-bottom: 0.15em;
		color: #520000;
	}

	#header p {
		color: #444444;
		margin-bottom: 0;
	}

	#menu {
		order: 2;
		position: static;
		float: none;
		width: auto;
		padding: 0;
		margin: 0 10px 1em;
		box-sizing: border-box;
		background: none;
		color: #520000;
	}

	#menu h2 {
		display: block;
		color: #520000;
		margin: 0 0 0.5em 0;
		font-size: 1.5em;
	}

	#menu ul,
	#menu ul ul {
		margin: 0;
		padding-left: 0;
		list-style: none;
	}

	#menu li {
		display: block;
	}

	/* POZOR: descendant selektor (#menu ul.navigation), NIE "#menu > ul.navigation".
	   Markup je #menu > nav > ul.navigation (nav wrapper kvoli pristupnosti), takze priamy
	   potomok tu nematchuje - a bez tychto pravidiel spadne navigacia na theme.css
	   "#menu a { color: white }", co je biely text na svetlom responzivnom pozadi. */
	#menu ul.navigation > li {
		background-color: #520000;
		/*border: 1px solid #7f5454;
		margin: 0 0 0.75em 0;*/
		padding: 0.45em 0.65em 0.55em;
	}

	#menu ul.navigation > li > a {
		padding: 0.1em 0 0.35em 0;
		font-size: 1.12em;
		font-weight: bold;
		color: #ffffff;
		background: none !important;
	}

	#menu ul.navigation > li > ul {
		padding: 0.1em 0 0 0.85em;
	}

	#menu ul.navigation > li > ul > li > a {
		padding: 0.2em 0;
		color: #ffffff;
		background: none !important;
	}

	#menu a.active {
		background: none !important;
		text-decoration: underline;
	}

	/* Navstevnost / prepinac jazyka / Discord maju desktopove odsadenie pre sidebar
	   (margin: 16px 6px 0 20px), takze sa v responzive rozchadzaju s blokmi navigacie.
	   Zarovnat na plnu sirku menu. !important je nutny: Discord tlacidlo ma styl v inline
	   <style> v main.php, ktory je v dokumente az ZA linkovanymi CSS a pri rovnakej
	   specificite by inak vyhral. */
	#menu .visit-counter,
	#menu .language-switcher,
	#menu a.ut3-discord-btn {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		box-sizing: border-box !important;
	}

	#menu .visit-counter {
		margin-top: 0.75em !important;
	}

	#menu .language-switcher,
	#menu a.ut3-discord-btn {
		margin-top: 0.5em !important;
	}

	#messages {
		order: 3;
		margin: 0 10px 1em;
	}

	div.message {
		margin: 0;
		padding: 0.85em 0.85em 0.85em 3.1em;
		background-position: 0.7em 0.7em;
	}

	#content {
		order: 4;
		margin-left: 10px;
		margin-right: 10px;
	}

	#content h2,
	#content h3 {
		background-size: 100% 32px;
	}

	fieldset {
		padding: 0.6em;
	}

	legend {
		background-size: 100% 32px;
		padding: 0 0.65em;
	}

	#newsdesk div#newsdeskts {
		float: none;
		width: auto;
		margin-top: 0;
		margin-bottom: 0.35em;
		text-align: left;
	}

	#footer {
		order: 5;
		padding: 0 10px 1.25em;
		text-align: left;
	}

	#content table.grid,
	#content table.noborder,
	#content > table,
	#content form > table,
	#content table[width="100%"] {
		display: block;
		max-width: 100%;
		overflow-x: auto;
		box-sizing: border-box;
	}

	input[type="text"],
	input[type="email"],
	input[type="password"],
	textarea,
	select {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}

	button,
	input.button {
		height: auto;
		min-height: 1.9em;
		white-space: normal;
	}

	dl,
	dd {
		margin-left: 0;
	}
}

@media (max-width: 640px) {
	body {
		font-size: 0.95em;
	}

	#header {
		min-height: 0;
		padding: 84px 8px 10px;
	}

	#header h1 {
		width: 96px;
		height: 72px;
	}

	#header h2 {
		font-size: 1.55em;
	}

	#menu {
		margin-left: 8px;
		margin-right: 8px;
	}

	#menu h2 {
		font-size: 1.35em;
	}

	#menu ul.navigation > li {
		padding: 0.4em 0.55em 0.5em;
	}

	#messages,
	#content,
	#footer {
		margin-left: 8px;
		margin-right: 8px;
	}

	#footer {
		padding-left: 0;
		padding-right: 0;
	}
}