:root {
	scroll-behavior: smooth;
}

/* přidání loga Frajt do menu */
#header #main-logo {
	background: url(/gr/logo-frajt.png) no-repeat center center;
	background-size: 140px 60px;
	color: transparent;
	width: 140px;
}
@media screen and (max-width: 768px) {
	#header #main-logo {
		background-size: 100px 40px;
		width: 100px;
		margin: 0 0 0 10px;
	}
	
}


h1 {
	text-align: center;
	font-size: 30px;
	line-height: 32px;
	margin: 20px 0;
	padding: 0;
}
h2 {
	font-size: 24px;
	line-height: 26px;
	margin: 20px 0;
	padding: 0;
}

p.info {
	font-size: 16px;
	line-height: 1.2;
	padding: 10px;
	background-color: var(--pale-grey);
}

input, button, select, textarea {
	/* na iOS 15 jsou tyto prvky modře obarveny -> explicitně určíme černou */
	color: var(--my-black);
}

.center {
	text-align: center;
}
@media screen and (max-width: 560px) {
	.not-mobile {
		display: none;
	}
}

.breadcrumbs {
	margin-bottom: 2em;
}

/* základní ošetření případné typické galerie, než se na její finální podobu a funkcionalitu vrhne javascript */
:root {
	--photo-row-cnt: 2;
	--photo-gap: 10px;
}
@media (min-width: 480px) {
	:root {
		--photo-row-cnt: 3;
	}
}
@media (min-width: 640px) {
	:root {
		--photo-row-cnt: 4;
	}
}
@media (min-width: 960px) {
	:root {
		--photo-row-cnt: 3;
	}
}
@media (min-width: 1024px) {
	:root {
		--photo-row-cnt: 4;
	}
}
#photogallery {
	overflow: hidden;
	/* display: none !important; */
}
#photogallery .thumbnails:not(#mevr-photogallery) {
	font-size: 0;
	line-height: 1;
	margin: calc(var(--photo-gap) / -2);
}
#photogallery .thumbnails:not(#mevr-photogallery) a {
	margin: 0;
	padding: 0;
	text-decoration: none;
}
#photogallery .thumbnails:not(#mevr-photogallery) a img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	width: calc((100% / var(--photo-row-cnt)) - var(--photo-gap));
	margin: calc(var(--photo-gap) / 2);
}



/* ikonky aut na HP směřující na katalogové listy - začátek */
#catalog-icons {
	position: relative;
	margin: 30px 0 60px 0;
	padding: 0px 0px 40px 0px;
	background-color: var(--pale-grey);
}
#catalog-icons h3 {
	text-align: center;
	font-size: 20px;
	/* text-transform: uppercase; */
	line-height: 1;
	padding: 10px;
	background-color: var(--pale-grey-two);
}
#catalog-icons h3 .mini {
	font-size: 17px;
	font-weight: 300;
}
#catalog-icons ul {
	display: flex;
	flex-wrap: wrap;
	/* jen pro úvod, kdy je málo článků o málo vozech */
	justify-content: center;
	margin: 0;
	padding: 0;
	height: 210px;
	overflow: hidden;
}
#catalog-icons li {
	margin: 10px 0 0 0;
	padding: 0 0 20px 0;
	display: block;
	width: 150px;
	height: 80px;
	list-style: none;
	line-height: normal;
}
#catalog-icons li a {
	display: block;
	padding: 0 10px;
	width: calc(100% - 20px);
	height: 100%;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 80%;
	color: var(--my-black);
	text-decoration: none;
	font-size: 17px;
	position: relative;
	/* box-shadow: inset -1px 0 0 0 var(--white-two); */
	transition: background-size 0.2s;
	font-weight: 300;
	text-shadow: /* bílý lem kolem názvu */
		 1px  1px 0 var(--my-white),
		-1px  1px 0 var(--my-white),
		-1px -1px 0 var(--my-white),
		 1px -1px 0 var(--my-white),
		-1px  0px 0 var(--my-white),
		 1px  0px 0 var(--my-white),
		 0px -1px 0 var(--my-white),
		 0px  1px 0 var(--my-white);
}
#catalog-icons li a:hover {
	background-size: 90%;
	transition: background-size 0.2s;
}
#catalog-icons p {
	margin: 0;
	text-align: center;
}
#catalog-icons label {
	position: relative;
	width: 0;
  display: inline-block;
}
#catalog-icons #selector-p {
	position: absolute;
	text-align: center;
	width: 100%;
}
#catalog-icons #selector-p select {
	-webkit-appearance: none;
  -moz-appearance: none;
	/* text-align: center; */
	max-width: calc(100vw - 40px);
	position: relative;
	margin: 10px 0 10px 0;
	font-size: 1.1rem;
	font-weight: normal;
	padding: 1rem 2rem;
  border-radius: 0;
	border: none;
	color: var(--my-black);
  background-color: var(--pale-grey-two);
	cursor: pointer;
	/* box-shadow: inset 0 0 0 1px var(--battleship-grey-light); */
  /* display: block; */
}
#catalog-icons #selector-p select:hover {
  background-color: var(--my-white);
  box-shadow: inset 0 0 0 2px var(--pale-grey-two);
}
#catalog-icons #selector-p label::after {
	position: relative;
  content: "\f0d7";
	font-family: "Font Awesome 5 Free";
	font-weight: bold;
	font-size: 24px;
  color: var(--battleship-grey);
  margin: 0 -0.5em 0 -3em;
  padding: 14px 0.8em;
  top: 2px;
  pointer-events: none;
	border-left: 1px solid var(--my-white);
}
/* ikonky aut na HP směřující na katalogové listy - konec */



/* specifikace pomocných tříd použitých pro reklamní plochy */
div#ad_site_top,
div#ad_main_top,
div#ad_main_middle,
div#ad_main_bottom,
div#ad_aside_1,
div#ad_aside_2,
div#ad_aside_3,
div#ad_site_top {
	text-align: center;
	display: block;
	width: 100%;
	position: relative;
	margin: 20px auto;
	background-color: var(--header-bg-color);
}
/* kvůli poskakování obsahu po donačtení reklam (CLS), které Google penalizuje, uvedeme typické hodnoty výšek reklaních ploch */
div#ad_site_top:not(:empty),
div#ad_main_top:not(:empty),
div#ad_main_bottom:not(:empty) {
	min-height: 280px;
}
div#ad_main_middle:not(:empty) {
	min-height: 200px;
}
div#ad_aside_1:not(:empty),
div#ad_aside_2:not(:empty),
div#ad_aside_3:not(:empty) {
	min-height: 600px;
}
/* nadepsání reklamních ploch */
div#ad_site_top:before,
div#ad_main_top:before,
div#ad_main_middle:before,
div#ad_main_bottom:before,
div#ad_aside_1:before,
div#ad_aside_2:before,
div#ad_aside_3:before,
div#ad_site_top:before {
	content: "advertisement";
	display: block;
	position: absolute;
	top: -12px;
	right: 0;
	text-align: right;
	z-index: 1;
	font-size: 10px;
	line-height: 1;
	text-transform: uppercase;
	color: var(--battleship-grey);
}

.language-flag {
	font-size: 13px;
	text-transform: uppercase;
	font-weight: bold;
	color: var(--my-white);
	background-color: var(--battleship-grey);
	padding: 2px 5px;
	margin: 0 5px 0 0;
	position: relative;
	top: -5px;
	border-radius: 3px;
	line-height: 1;
}
/* zobrazení kódu země u článků, které nemají kód vyplněný, ale mejí jej definovaný jako css proměnnou */
body:not(.single-language) .language-flag:empty:before {
	content: var(--language-code);
}
/* skrytí kódu země v případě, že má uživatel vyfiltrovány jazyky na jeden */
body.single-language .language-flag {
	display: none;
}

.no-articles {
	box-sizing: border-box;
	width: 100%;
	max-width: 840px;
	margin: 10vh auto;
	font-size: 16px;
	font-weight: normal;
	line-height: 28px;
	text-align: center;
	text-transform: uppercase;
	background-color: var(--pale-grey);
	padding: 10% 20px;
	box-shadow: inset 10px 0 0 0 var(--pale-grey-two);
}

.nonactivated-account-note {
	margin: 0 0 20px 0;
	padding: 10px;
	color: var(--my-black);
	background-color: var(--marigold);
	text-align: center;
	font-size: 15px;
	font-weight: normal;
	line-height: 1.2;
}
.nonactivated-account-note i {
	font-style: normal;
}
.nonactivated-account-note::before {
	content: "\f071";
	font-family: "Font Awesome 5 Free";
	margin: 0 10px 0 0;
	font-weight: 900;
	font-size: 18px;
}

.site-views {
	width: 100%;
	text-align: right;
	color: var(--battleship-grey);
}
.site-views .title {
	display: none;
}
.site-views > * {
	color: var(--my-black);
	font-weight: bold;
}
.site-views > ::before {
	font-size: 80%;
	font-weight: normal;
	color: var(--battleship-grey);
}
.site-views .today::before {
	content: "T";
}
.site-views .yesterday::before {
	content: "Y";
}
.site-views .last7days::before {
	content: "7D";
}
.site-views .last28days::before {
	content: "28D";
}
.site-views .overall::before {
	content: "ALL";
}

button.edit {
	font-size: 18px;
	font-weight: bold;
	color: var(--my-black);
	background-color: var(--pale-grey-two);
	padding: 5px 20px;
	margin: 0 10px;
	border-radius: 3px;
}

button.edit:hover {
	color: var(--my-white);
	background-color: var(--battleship-grey);
}

button#next-articles-button {
	display: block;
	width: 380px;
	max-width: 100%;
	height: 70px;
	line-height: 68px;
	margin: 10px auto;
	text-align: center;
	background-color: var(--pale-grey-two);
	color: var(--my-black);
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
	position: relative;
}
button#next-articles-button::after {
	content: "\f0d7";
	font-family: "Font Awesome 5 Free";
	display: block;
	color: var(--battleship-grey);
	margin: -2px 5px 2px 2px;
	font-weight: 900;
	font-size: 18px;
	position: absolute;
	left: calc(50% - 10px);
	width: 20px;
	text-align: center;
	top: 20px;
}
.no-more-articles {
	text-align: center;
	text-transform: uppercase;
	font-size: 15px;
}

p.warning {
	padding: 10px;
	background-color: var(--warning);
}

#page.unpublished::before,
#page.censored::before {
	content: "article not published - this is an 'admin-view'";
	display: block;
	color: var(--my-white);
	background-color: var(--reddish-pink);
	font-size: 20px;
	text-align: center;
	margin: 20px 0 0 0;
	padding: 20px;
	width: 100%;
	box-sizing: border-box;
}
#page.censored::before {
	content: "article is censored - this is an 'admin-view' - contact us at info@myevreview.com";
}

#page .author-actions,
#page .superadmin-actions {
	margin-top: 20px;
}
#page .superadmin-actions + .author-actions {
	margin-top: 0;
}
#page .author-actions button,
#page .author-actions a.button,
#page .author-actions input[type="button"],
#page .superadmin-actions button,
#page .superadmin-actions a.button,
#page .superadmin-actions input[type="button"] {
	font-size: 13px;
	font-weight: bold !important;
	text-transform: uppercase;
	border: 0;
	border-radius: 3px;
	cursor: pointer;
	color: var(--my-white);
	background-color: var(--reddish-pink);
	padding: 10px;
	margin: 0 10px 10px 0;
	line-height: normal;
	text-decoration: none;
	height: auto;
	width: auto;
}
#page .author-actions button:hover,
#page .author-actions a.button:hover,
#page .author-actions input[type="button"]:hover,
#page .superadmin-actions button:hover,
#page .superadmin-actions a.button:hover,
#page .superadmin-actions input[type="button"]:hover {
	color: var(--my-black) !important;
	background-color: var(--reddish-pink) !important;
}

	/* ----- about, terms, ... - zacatek ----- */
#page.paper {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	font-size: 18px;
	line-height: 24px;
	font-weight: 300;
}
#page.paper h1 {
	width: 100%;
	max-width: 740px;
	box-sizing: border-box;
	margin: auto;
	padding: 20px;
	font-size: 25px;
	text-align: left;
}
#paper {
	width: 100%;
	box-sizing: border-box;
	max-width: 840px;
	margin: 0 auto 20px auto;
	padding: 40px 20px;
	background-color: var(--pale-grey);
	box-shadow: inset 10px 0 0 0 var(--pale-grey-two);
	overflow: hidden;
}
#paper > * {
	box-sizing: border-box;
	width: 100%;
	max-width: 700px;
	margin: 0 auto 20px auto;
}
#paper h3 {
	margin: 40px auto;
	font-size: 26px;
	line-height: 30px;
	font-weight: 300;
}
#paper h4 {
	margin: 20px auto 0 auto;
	text-transform: uppercase;
	font-size: 100%;
}
#paper p.author {
	text-align: center;
}
#paper p.author img {
	display: block;
	margin: 0 auto 10px auto;
	width: 100px;
	height: 100px;
	clip-path: path('M50,0c37.5,0,50,12.5,50,50S87.5,100,50,100S0,87.5,0,50C0,12.5,12.5,0,50,0z');
	-webkit-clip-path: path('M50,0c37.5,0,50,12.5,50,50S87.5,100,50,100S0,87.5,0,50C0,12.5,12.5,0,50,0z');
}
@media (min-width: 960px), print {
	#page.paper h1 {
		padding: 40px 20px;
	}
}
/* ----- about, terms, ... - konec ----- */

/* ----- přidej článek - zacatek ----- */
.add-article-text {
	margin: 0 0 20px 0;
	padding: 20px;
	padding-left: 30px;
	box-shadow: inset 10px 0 0 0 var(--pale-grey-two);
	background-color: var(--pale-grey);
}
.add-article-text h3 {
	font-size: 24px;
	font-weight: normal;
	margin: 0;
}
.add-article-text p {
	font-size: 16px;
	line-height: 24px;
	margin: 20px 0 0 0;
}
.add-article-text .submit-review-button {
	text-align: center;
}
.add-article-text .submit-review-button a {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin: 0 auto;
	padding: 0 20px 0 40px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 13px;
	color: var(--my-black);
	background-color: var(--my-white);
	border-radius: 3px;
}
.add-article-text .submit-review-button a::before {
	content: "+";
	color: var(--type-test);
	font-size: 32px;
	margin-right: 10px;
	top: 0;
	left: 15px;
	position: absolute;
	z-index: 2;
}
.add-article-text .submit-review-button a:hover {
	background-color: var(--pale-grey-two);
}
/* ----- přidej článek - konec ----- */

/* ----- footer - zacatek ----- */
	#footer {
		position: relative;
		box-sizing: border-box;
		min-width: 300px;
		max-width: 100%;
		padding: 10px;
		margin: 20px auto 0 auto;
		clear: both;
		background-color: var(--my-black);
		color: var(--my-white);
		border-top: 5px solid var(--aqua-marine);

		display: block;
		/* display: none; */
		/* bottom: 0;
		clear: left;
		height: 50px;
		min-width: 320px;
		width: 90%;
		max-width: var(--max-width);
		margin: -50px auto 0 auto;
		padding: 0;
		overflow: hidden;
		background: rgba(0,0,0,0.16);	 */
		/*box-shadow: inset 0px 0px 0px 1px rgba(0,255,0,0.5);*/
	}
	#footer a {
		color: var(--my-white);
	}
	#footer a:hover {
		color: var(--aqua-marine);
	}
	#footer>*:first-child {
		margin: 0;
	}
	#footer h4 {
		display: none;
	}
	#footer ul {
		display: block;
		margin: 0;
		padding: 15px 20px;
		text-align: center;
		font-size: 12pt;
	}
	/* #footer ul li {
		display: inline-block;
		list-style: none;
		margin: 0 5px;
	} */
/* ----- footer - konec ----- */

/* ----- forms (login, register, edit) - zacatek ----- */
	form input[type=text],
	form input[type=number],
	form input[type=date],
	form input[type=time],
	form input[type=password],
	form select,
	form textarea {
		display: block;
		box-sizing: border-box;
		width: 100%;
		min-height: 30px;
		line-height: 30px;
		font-family: var(--default-font);
		font-size: 18px;
		border: 1px solid var(--pale-grey-two);
		/* border-radius: 5px; */
		border-radius: 0;
		margin: 0;
		padding: 0 10px;
	}
	form textarea {
		overflow: auto;
	}
	/* form textarea[name*=perex] {
		min-height: 100px;
	}
	form textarea[name*=body] {
		min-height: 300px;
	} */
	form > p,
	form > div {
		margin: 1em 0;
	}
	form p > label,
	form p > span,
	form p > input + i,
	form div > label,
	form div > span,
	form div > input + i {
		font-style: normal;
		display: block;
		font-size: 12px;
		line-height: 1;
		color: var(--battleship-grey);
	}
	form p > label,
	form div > label {
		text-transform: uppercase;
		line-height: 1.3;
		margin-bottom: 5px;
	}
	form > p > span,
	form > div > span {
		text-align: right;
	}
	form > p > input + i b,
	form > div > input + i b {
		color: var(--my-black);
	}
	form > p.important,
	form > div.important {
		background: rgba(255,0,0,0.05);
		box-shadow: 0 0 10px 10px rgba(255,0,0,0.05);
	}
	form #lng {
		display: block;
		box-sizing: border-box;
		max-height: 290px;
		width: 100%;
		overflow: auto;
		border: 1px solid var(--pale-grey-two);
		border-radius: 5px;
		margin: 0;
		padding: 3px;
	}
	form #lng label {
		display: block;
		text-align: left;
		margin: 0;
		padding: 2px 10px 2px 30px;
		font-size: 12pt;
		color: var(--my-black);
		cursor: pointer;
		line-height: 1.5;
	}
	form #lng label:hover {
		background: var(--pale-grey);
	}
	form #lng label input {
		position: relative;
		margin: 0 10px 0 -20px;
		top: -2px;
	}


	form input[type="submit"],
	form input[type="cancel"],
	form input[type="button"] {
		width: 100%;
		font-size: 12pt;
		padding: 10px;
		border: 1px solid var(--pale-grey-two);
		border-radius: 5px;
		background: var(--pale-grey);
	}
	form input[type="button"] {
		display: none;
	}


	form input[type="submit"]:hover,
	form input[type="cancel"]:hover,
	form input[type="button"]:hover {
		background: var(--pale-grey-two);
		border-color: var(--pinkish-grey);
	}

	#page .account-settings {
		display: flex;
		margin: 0;
	}
	#edit-credentials-form,
	#edit-additional-form {
		box-sizing: border-box;
		width: 50%;
		/* float: left; */
		margin: 0;
		padding: 20px;
	}
	#edit-additional-form {
		border-left: 1px solid var(--pale-grey-two);
	}
	#edit-credentials-form h2,
	#edit-additional-form h2{
		margin: 0 0 20px 0;
		padding: 0;
	}




	/* dodatečná úprava - logování/registrace/ztracené heslo/potvrzování */
	#page > .signing {
		background-color: var(--pale-grey);
		margin: 0 auto;
		padding: 0 0 20px 0;
		box-sizing: border-box;
		max-width: 820px;
		box-shadow: -10px 0 0 0 var(--pale-grey), 10px 0 0 0 var(--pale-grey);
	}
	#page > .signing > h3 {
		background-color: var(--pale-grey-two);
		font-size: 100%;
		margin: 0 auto;
		padding: 0;
		height: 50px;
		line-height: 50px;
		width: 100%;
		box-sizing: border-box;
		max-width: 500px;
		box-shadow: -200px 0 0 0 var(--pale-grey-two), 200px 0 0 0 var(--pale-grey-two);
	}
	#page > .signing > p,
	#page > .signing .errors {
		width: 100%;
		box-sizing: border-box;
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
		line-height: 1.4;
	}
	#page > .signing .errors {
		margin-top: 20px;
		padding: 10px;
		border: none;
		border-radius: 0;
		color: var(--my-white);
		background-color: var(--pastel-red);
		font-size: 16px;
		font-weight: bold;
	}
	#page > .signing .errors h4 {
		font-size: 18px;
		margin: 0 0 10px 0;
		padding: 0;
	}
	#page > .signing .errors ul {
		margin: 0 0 0 1em;
		padding: 0;
	}
	#page > .signing .errors li {
		list-style-type: "- ";
		margin: 0;
		padding: 0;
	}
	#page > .signing label {
		font-size: 14px;
		font-weight: bold;
		text-transform: uppercase;
		color: var(--my-black);
	}
	#page > .signing input[type="text"],
	#page > .signing input[type="password"],
	#page > .signing select {
		box-sizing: border-box;
		width: 100%;
		height: 50px;
		line-height: 50px;
		margin: 0;
		padding: 0 10px;
		color: var(--my-black);
		background-color: var(--my-white);
		border: none;
		border-radius: 2px;
		box-shadow: inset 0 0 0 1px var(--pale-grey-two);
		font-size: 20px;
		font-weight: normal;
	}
	#page > .signing select {
		-webkit-appearance: none;
		background-color: var(--pale-grey-two);
	}
	#page > .signing input[type="checkbox"] {
		float: left;
	}
	#page > .signing input[type="checkbox"] + label {
		font-weight: normal;
		text-transform: none;
		margin-left: 30px;
	}
	#page > .signing input[type="button"],
	#page > .signing input[type="submit"],
	#page > .signing input[type="cancel"],
	#page > .signing a.button,
	#page > .signing button,
	#page > #paper button {
		display: inline-table;
		box-sizing: border-box;
		width: 100%;
		max-width: 500px;
		height: 50px;
		line-height: 50px;
		margin: 10px auto 0 auto;
		padding: 0 10px;
		color: var(--my-white);
		background-color: var(--my-black);
		border: none;
		border-radius: 2px;
		font-size: 14px;
		font-weight: bold;
		text-transform: uppercase;
		text-decoration: none;
		text-align: center;
	}
	#page > .signing p span {
		font-size: 14px;
		font-weight: normal;
		color: var(--pinkish-grey);
		text-transform: uppercase;
		margin-top: 4px;
		line-height: 1;
		text-align: left;
	}
	#page > .signing .narrow {
		max-width: 300px;
	}
	#page > .signing .smaller {
		font-size: 16px;
		margin-top: 0;
		margin-bottom: 0;
	}
	#page > .signing .uppercase {
		text-transform: uppercase;
	}
	#page > .signing .lowercase {
		text-transform: lowercase;
	}
	#page > .signing .top-space-small {
		margin-top: 10px;
	}
	#page > .signing .top-space {
		margin-top: 20px;
	}
	#page > .signing .bottom-space-small {
		margin-bottom: 10px;
	}
	#page > .signing .bottom-space {
		margin-bottom: 20px;
	}
	#page > .signing .top-line {
		margin-top: 10px;
		padding-top: 20px;
		border-top: 1px dashed var(--pinkish-grey);
	}




/* >>> úprava registrace pro Frajt >>> */
	#page > h3 {
		text-align: center;
	}
	#page > #register-form.signing {
		display: flex;
    flex-direction: column;
    flex-wrap: wrap;
	}
	#page > #register-form.signing fieldset {
		border: none;
		flex: 1;
	}
	#page > #register-form.signing fieldset.assignment {
		flex: 1 1 100%;
		text-align: center;
	}
	#page > #register-form.signing fieldset.assignment input[type="checkbox"] {
		float: none;
	}
	#page > #register-form.signing fieldset.assignment label {
		display: inline-block;
		margin-left: 0.5rem;
	}
	#page > #register-form.signing fieldset .info {
		margin: 0;
		padding: 0;
		color: var(--battleship-grey);
	}
	#page > #register-form.signing legend {
		margin: 0;	
		padding: 1rem 0 0.3rem 0;
		font-size: 110%;
		font-weight: bold;
	}
	#page > #register-form.signing #register-button[disabled] {
		opacity: 0.5;
	}
	@media (min-width: 720px), print {
		#page > #register-form.signing {
			flex-direction: row;
		}
	}
/* <<< úprava registrace pro Frajt <<< */



	@media (min-width: 840px), print {
		#page > .signing h3 {
			background-color: var(--my-white);
			font-size: 25px;
			margin: 0 auto;
			padding: 0;
			height: 100px;
			line-height: 110px;
			width: 100%;
			box-sizing: border-box;
			max-width: 500px;
			box-shadow: -200px 0 0 0 var(--my-white), 200px 0 0 0 var(--my-white);
		}
		#page > .signing.space-bottom {
			margin-bottom: 200px;
		}
	}
	#paper #resend {
		font-size: 90%;
		text-align: center;
		margin-top: 20px;
		border-top: 1px dashed var(--battleship-grey);
		padding-top: 20px;
	}
	#paper .warning {
		padding: 10px 20px;
		background-color: var(--marigold);
	}
	#page > #paper button {
		width: auto;
		padding-left: 20px;
		padding-right: 20px;
	}



/* ----- forms (login, register, edit) - konec ----- */

div.errors {
	background: rgba(200,0,0,0.1);
	border: 1px solid rgba(200,0,0,0.7);
	border-radius: 4px;
	font-size: 12pt;
	margin: 0 0 20px 0;
}

div.errors h2 {
	margin: 0;
	padding: 5px 10px;
	background: rgba(200,0,0,0.5);
	color: #fee;
	font-size: 12pt;
}

div.info {
	background: rgba(0,10,100,0.1);
	border: 1px solid rgba(0,10,100,0.5);
	border-radius: 4px;
	font-size: 12pt;
	margin: 0 0 20px 0;
}

div.info h2 {
	margin: 0;
	padding: 5px 10px;
	background: rgba(0,10,100,0.3);
	color: #eef;
	font-size: 12pt;
}

div.info p {
	margin: 10px;
}

#page > ul.contacts {
	box-sizing: border-box;
	display: block;
	list-style: none;
	width: 100%;
	min-width: 320px;
	margin: 0 auto;
	padding: 0;
}
#page > ul.contacts li {
	margin: 5px 0;
	padding: 0;
	font-size: 0;
}
#page > ul.contacts li > dt,
#page > ul.contacts li > dd {
	box-sizing: border-box;
	display: inline-block;
	margin: 0;
	padding: 0 10px;
	font-size: 12pt;
	width: 50%;
}
#page > ul.contacts li dt {
	text-align: right;
	font-size: 10pt;
	text-transform: uppercase;
	color: var(--battleship-grey);
}
#page > ul.contacts li p {
	font-size: 12pt;
	text-align: center;
}

/* stylování checkboxu jako oválného přepínače - začátek */
#page input[type=checkbox].style-1 {
	position: fixed;
	left: -100px;
	top: -100px;
}
#page input[type=checkbox].style-1 ~ label {
	position: relative;
	padding-left: 60px;
	cursor: pointer;
	background-color: var(--checkbox-off);
	color: var(--my-white);
	display: inline-block;
	border-radius: 4px;
	height: 40px;
	line-height: 40px;
	margin: 0 0 0 60px;
	padding: 0 10px;
}
#page input[type=checkbox].style-1 ~ label span.on {
	display: none;
}
#page input[type=checkbox].style-1 ~ label::before,
#page input[type=checkbox].style-1 ~ label::after {
	content: "";
	display: block;
	position: absolute;
	top: 7px;
	left: -60px;
}
#page input[type=checkbox].style-1 ~ label::before {
	width: 48px;
	height: 24px;
	background-color: var(--checkbox-off);
	border-radius: 9999em;
	-webkit-transition: background-color 0.25s ease;
	transition: background-color 0.25s ease;
}
#page input[type=checkbox].style-1 ~ label::after {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background-color: var(--my-white);
	box-shadow: 0 0 0 2px var(--checkbox-off-dark);
	-webkit-transition: left 0.25s ease;
	transition: left 0.25s ease;
}
#page input[type=checkbox].style-1:checked ~ label {
	background-color: var(--checkbox-on);
}
#page input[type=checkbox].style-1:checked ~ label span.on {
	display: inline;
}
#page input[type=checkbox].style-1:checked ~ label::before {
	background-color: var(--checkbox-on);
}
#page input[type=checkbox].style-1:checked ~ label::after {
	box-shadow: 0 0 0 2px var(--checkbox-on-dark);
	left: -36px;
}
/* stylování checkboxu jako oválného přepínače - konec */

/* stylování checkboxu jako oválného přepínače V2 - začátek */
#page input[type=checkbox].style-2 {
	position: fixed;
	left: -100px;
	top: -100px;
}
#page input[type=checkbox].style-2 ~ label {
	position: relative;
	cursor: pointer;
	/* background-color: var(--my-white); */
	background-color: transparent;
	color: var(--my-black);
	display: inline-block;
	border-radius: 4px;
	height: 40px;
	line-height: 40px;
	margin: 0 0 0 10px;
	padding: 0 65px 0 10px;
}
#page input[type=checkbox].style-2 ~ label span.on {
	display: none;
}
#page input[type=checkbox].style-2 ~ label::before,
#page input[type=checkbox].style-2 ~ label::after {
	content: "";
	display: block;
	position: absolute;
	top: 7px;
	right: 5px;
}
#page input[type=checkbox].style-2 ~ label::before {
	width: 48px;
	height: 24px;
	background-color: var(--checkbox-off);
	border-radius: 9999em;
	-webkit-transition: background-color 0.25s ease;
	transition: background-color 0.25s ease;
}
#page input[type=checkbox].style-2 ~ label::after {
	width: 24px;
	height: 24px;
	right: 30px;
	border-radius: 50%;
	background-color: var(--my-white);
	box-shadow: 0 0 0 2px var(--checkbox-off-dark);
	-webkit-transition: left 0.25s ease;
	transition: left 0.25s ease;
}
/* #page input[type=checkbox].style-2:checked ~ label {
	background-color: var(--checkbox-on);
} */
#page input[type=checkbox].style-2:checked ~ label span.on {
	display: inline;
}
#page input[type=checkbox].style-2:checked ~ label::before {
	background-color: var(--checkbox-on);
}
#page input[type=checkbox].style-2:checked ~ label::after {
	box-shadow: 0 0 0 2px var(--checkbox-on-dark);
	right: 5px;
}
/* stylování checkboxu jako oválného přepínače V2 - konec */


/* stylování checkboxu jako tlačítka pro publikování V3 - začátek */
#page input[type=checkbox].style-3 {
	position: fixed;
	left: -100px;
	top: -100px;
}
#page input[type=checkbox].style-3 ~ label {
	position: relative;
	top: 2px;
	cursor: pointer;
	background-color: var(--pale-grey);
	color: var(--my-black);
	font-size: 16px;
	text-transform: none;
	font-weight: normal;
	display: inline-block;
	border: 1px solid var(--pale-grey);
	border-radius: 4px;
	line-height: normal;
	margin: 0 0 0 10px;
	padding: 10px 0;
	overflow: hidden;
	width: 0;
	padding-left: calc(100% / 3);
}
#page input[type=checkbox].style-3 ~ label:hover {
	border-color: rgb(203, 203, 203);
	background-color: transparent;
}
#page input[type=checkbox].style-3 ~ label::before {
	content: "Publish";
	position: absolute;
	display: block;
	text-align: center;
	left: 0;
	min-width: 100%;
}
#page input[type=checkbox].style-3:checked ~ label::before {
	content: "UNpublish";
}
#page input[type=checkbox].style-3 ~ label span.on {
	display: none;
}
#page input[type=checkbox].style-3:checked ~ label span.on {
	display: inline;
}
/* stylování checkboxu jako tlačítka pro publikování V3 - konec */



/* komponenty clanku */
/* #perex { padding: 1em; background: var(--pale-grey); }
#article table, #article table td, #article table th { border: 1px solid var(--pale-grey-two); }
#article .lcmstt-image-cover,
#article .lcmstt-video-cover { box-sizing: border-box; position: relative; width: 40%; min-width: 280px; clear: left; float: left; padding: 0; margin: 0 2em 1em 0; box-shadow: 0 0 1px 1px rgba(0,0,0,0.1); background: rgba(0,0,0,0.1); }
#article .lcmstt-image-cover .lcmstt-image-caption,
#article .lcmstt-video-cover .lcmstt-video-caption { padding: 1em; font-style: italic; }
#article .lcmstt-image-cover.lcmstt-image-center,
#article .lcmstt-video-cover.lcmstt-video-center { clear: both; float: none; width: 80%; margin: 0 auto 1em auto; }
#article .lcmstt-image-cover.lcmstt-image-right,
#article .lcmstt-video-cover.lcmstt-video-right { clear: right; float: right;  margin: 0 0 1em 2em;}
#article .lcmstt-image-cover a { cursor: pointer; }
#article .lcmstt-image-cover img,
#article .lcmstt-video-cover iframe { box-sizing: border-box; width: 100%; }
#article .lcmstt-video-cover iframe { height: 20vw; min-height: 160px; max-height: 270px; }
#article .lcmstt-video-cover.lcmstt-video-center iframe { height: 40vw; max-height: 540px; } */




/* --- GALERIE --- */
#mica { display: block; position: fixed; margin: 0; padding: 0; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.2); z-index: 10; }
#mica.transparent { background: transparent; z-index: 3; }
#desk { font-family: Arial, sans-serif; display: block; position: fixed; margin: 0; padding: 0; top: 40px; right: 40px; bottom: 40px; left: 40px; border-radius: 3px; border: 1px solid #808090; background: #3a4249; color: var(--my-white); box-shadow: 0 0 10px rgba(0,0,0,0.6); z-index: 11; }

#desk-header { position: absolute; display: block; margin: 0; padding: 0; top: 10px; right: 10px; bottom: auto; left: 10px; border-top-left-radius: 3px; border-top-right-radius: 3px; background: #3a4249; }
#desk-header:after { content: ""; display: block; clear: both; height: 0; }
/*
#desk-header p { display: block; margin: 0; padding: 0; width: 50%; float: left; }
#desk-header p:last-child { float: right; }
#desk-header p a { display: block; margin: 0; padding: 10px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: none; border-bottom: 1px solid rgba(0,0,0,0.4); text-align: center; font-size: 20px; font-weight: bold; color: var(--my-white); text-decoration: none; }
#desk-header p a.selected { background: #576068; box-shadow: 0 0 6px rgba(0,0,0,0.4); border-bottom: none; }
#desk-header p a:hover { background: rgba(255,255,255,0.2); }
*/
#desk-header p { display: block; margin: 0; padding: 0; font-size: 20px; line-height: 30px; text-align: center; font-weight: bold; }

#desk-footer { display: block; position: absolute; margin: 0; padding: 0; top: auto; right: 0; bottom: 10px; left: 0; border: 0; width: 100%; height: 30px; }
#desk-footer p { margin: 0; padding: 0; text-align: center; }
#desk-footer p label[for="filter"] { float: left; margin: 0 30px; font-size: 16px; color: #808090; height: 30px; line-height: 30px; }
#desk-footer p label[for="filter"] input { margin: 0 10px; padding: 0 10px; font-size: 16px; height: 30px; line-height: 30px; border-radius: 3px; box-sizing: border-box; }
#desk-footer p a { float: right; display: block; margin: 0 10px; width: 150px; height: 30px; line-height: 30px; text-align: center; text-decoration: none; border-radius: 3px; font-size: 16px; color: var(--my-white); background: #677078; }
#desk-footer p a:hover { background: #8adaf6; color: var(--black); }
#desk-footer span.sandbox { position: relative; font-size: 20px; color: var(--my-white); top: 5px; }

#desk ul.imgs { display: block; position: absolute; margin: 0; padding: 10px 0 0 10px; top: 50px; right: 0px; bottom: 50px; left: 0px; background: #3a4249; overflow: auto; border: 10px solid #576068; box-shadow: inset 0 0 10px rgba(0,0,0,0.4); }
#desk ul.imgs.over { background: #8adaf6; }
#desk ul.imgs::-webkit-scrollbar { -webkit-appearance: show; width: 10px; background: #808090; }
#desk ul.imgs::-webkit-scrollbar-thumb { border-radius: 5px; background-color: var(--my-white); -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5); box-shadow: 0 0 1px rgba(255,255,255,.5); }
#desk ul.imgs li { display: inline-block; list-style-type: none; width: 180px; height: 180px; padding: 10px; margin: 0 10px 10px 0; box-shadow: 2px 2px 4px rgba(0,0,0,0.2); border-radius: 3px; background: white; }
#desk ul.imgs li.hide { display: none; }
#desk ul.imgs li:hover { position: relative; box-shadow: 4px 4px 8px rgba(0,0,0,0.5); background: #8adaf6; }
#desk ul.imgs li * { position: relative; }
#desk ul.imgs li a:first-child { display: block; width: 180px; height: 120px; box-shadow: inset 0 0 4px rgba(0,0,0,0.4); text-decoration: none; background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; }
#desk ul.imgs li:hover a:first-child { box-shadow: inset 3px 3px 8px rgba(0,0,0,0.4); background-size: cover; border-color: rgba(0,0,0,0.2); }
#desk ul.imgs li input[name="name"] { display: block; width: 180px; height: 22px; margin: 5px 0 3px 0; border: none; font-family: Arial, sans-serif; font-size: 14px; font-weight: bold; text-align: center; }
#desk ul.imgs li input[readonly="readonly"] { background: transparent; }
#desk ul.imgs li span { display: block; width: 180px; height: 15px; border: none; font-size: 12px; color: gray; text-align: center; }
#desk ul.imgs li a.delete,
#desk ul.imgs li a.zoom { display: none; }
#desk ul.imgs li:hover a.delete,
#desk ul.imgs li:hover a.zoom { display: block; top: -180px; right: 0; width: 30px; height: 30px; line-height: 30px; float: right; background: rgba(0,0,0,0.2); color: var(--my-white); border-radius: 50%; text-decoration: none; text-align: center; font-family: gallery, Arial, sans-serif; font-size: 24px; }
#desk ul.imgs li:hover a.zoom { float: left; left: 0; }
#desk ul.imgs li:hover a.delete:hover,
#desk ul.imgs li:hover a.zoom:hover { background: white; color: black; }
#desk ul.imgs li#imghash_new { border: 0; width: 180px; height: 180px; box-shadow: none; background: transparent; cursor: pointer; color: #808090; }
#desk ul.imgs li#imghash_new:hover *,
#desk ul.imgs li#imghash_new:hover { background: #475058; color: var(--my-white); }
#desk ul.imgs li#imghash_new * { display: block; text-align: center; }
#desk ul.imgs li#imghash_new b { font-family: gallery, Arial, sans-serif; font-size: 80px; line-height: 1; padding: 20px 0 16px 0; color: var(--my-white); }
#desk ul.imgs li#imghash_new span { font-size: 14px; margin-bottom: 30px; }

#image-preview { position: fixed; z-index: 20; margin: 0; padding: 0; left: 0; right: 0; top: 0; bottom: 0; background-color: #3a4249; background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; cursor: pointer; }
#image-preview p { font-family: Arial, sans-serif; font-size: 20px; color: var(--my-white); text-shadow: 1px 1px 0 rgba(0,0,0,1); background: rgba(0,0,0,0.4); text-align: center; padding: 1em 2em; border-radius: 3px; position: fixed; z-index: 21; margin: 0; left: 100px; right: 100px; top: 100px; bottom: 100px; }
#image-preview p.back { bottom: auto; }
#image-preview p.usage { top: auto; }

#image-upload-progress { position: fixed; display: block; margin: -30px 150px 30px -150px; top: 50%; left: 50%; background: #576068; color: var(--my-white); border-radius: 5px; border: 10px solid var(--my-white); box-shadow: 0 0 0 20px rgba(0,0,0,0.5); font-family: Arial, sans-serif; font-size: 24px; font-weight: bold; height: 60px; line-height: 60px; width: 300px; z-index: 100000; text-align: center; }




.lang {
	position: relative;
	opacity: 0.4;
	font-size: 100%;
	background: transparent;
	border-width: 0;
	border-radius: 4px;
	margin: 0;
	padding: 0.2em;
	cursor: pointer;
}
.lang.selected {
	opacity: 1;
}
.lang:hover {
	opacity: 1;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
	top: -1px;
	left: -1px;
}
.lang:before {
	content: "";
	display: inline-block;
	position: relative;
	width: 1.5em;
	height: 1em;
	top: 0.15em;
	margin-right: 0.2em;
	box-shadow: 0 0 3px rgba(0,0,0,0.3);
}
.lang:hover:before {
	box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.lang.cs:before { /* must be 3:2 (w:h) */
	background:
		linear-gradient(34deg, blue 50%, transparent 50%) 0 0/50% 50% no-repeat,
		linear-gradient(-34deg, transparent 50%, blue 50%) 0 100%/50% 50% no-repeat,
		linear-gradient(white 50%, red 50%) 0 0/100% 100% no-repeat;
}
.lang.en:before {
	width: 2em; /* must be 2:1 (w:h) */
	background:
		linear-gradient(transparent 40%, red 40%, red 60%, transparent 60%),
		linear-gradient(90deg, transparent 45%, red 45%, red 55%, transparent 55%),
		linear-gradient(transparent 34%, white 34%, white 66%, transparent 66%),
		linear-gradient(90deg, transparent 42%, white 42%, white 58%, transparent 58%),
		linear-gradient(25deg, transparent 44%, red 44%, red 51%, transparent 51%) 0 0/50% 50% no-repeat,
		linear-gradient(25deg, transparent 41%, white 41%, white 61%, transparent 61%) 0 0/50% 50% no-repeat,
		linear-gradient(25deg, transparent 49%, red 49%, red 56%, transparent 56%) 100% 100%/50% 50% no-repeat,
		linear-gradient(25deg, transparent 39%, white 39%, white 59%, transparent 59%) 100% 100%/50% 50% no-repeat,
		linear-gradient(-25deg, transparent 44%, red 44%, red 51%, transparent 51%) 0 100%/50% 50% no-repeat,
		linear-gradient(-25deg, transparent 41%, white 41%, white 61%, transparent 61%) 0 100%/50% 50% no-repeat,
		linear-gradient(-25deg, transparent 49%, red 49%, red 56%, transparent 56%) 100% 0/50% 50% no-repeat,
		linear-gradient(-25deg, transparent 39%, white 39%, white 59%, transparent 59%) 100% 0/50% 50% no-repeat,
		navy;
}



/* --- SUPER-ADMIN --- */

/* --- futrál pro uploadova(tel)ný obrázek (katalog) --- */
#page.superadmin-catalog span.image {
	position: relative;
	display: inline-block;
	width: 200px;
	height: 150px;
	margin: 5px 0;
	border: none;
	background-color: var(--my-white);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	box-shadow: inset 0 0 0 1px var(--pale-grey-two), inset 0 0 0 2px var(--my-white);
	transition: all 0.2s;
}
#page.superadmin-catalog span.image > button.mini-cross {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 30px;
	height: 30px;
	line-height: 32px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: none;
	border-radius: 50%;
	background-color: #aaa;
	color: var(--my-white);
	box-shadow: 0 0 0 1px var(--my-white);
	font-size: 0;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	cursor: pointer;
}
#page.superadmin-catalog span.image > button.mini-cross:before {
	display: inline-block;
	width: 30px;
	height: 30px;
	line-height: 32px;
	border: none;
	content: "\00D7";
	font-size: 36px;
}
#page.superadmin-catalog span.image > button.mini-cross:hover {
	background-color: var(--black);
}
#page.superadmin-catalog span.image[data-value="0"] > button.mini-cross {
	display: none;
}
#page.superadmin-catalog span.image > input[type="file"] {
	position: absolute;
	top: -100px;
	left: -1000px;
	width: 0px;
	height: 0px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: none;
	background: transparent;
}
#page.superadmin-catalog span.image[data-value="0"]:before {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width: 100%;
	height: 100%;
	line-height: 150px;
	color: #aaa;
	text-shadow: -1px -1px var(--my-white), 1px -1px var(--my-white), 1px 1px var(--my-white), -1px 1px var(--my-white);
	border: none;
	content: "\002B";
	font-size: 100px;
	text-align: center;
	cursor: pointer;
}
#page.superadmin-catalog span.image[data-value="0"]:hover:before {
	color: var(--black);
}

#page.superadmin-catalog blockquote {
	background: var(--pale-grey);
	width: 100%;
	box-sizing: border-box;
	padding: 0.5em 2em;
	margin: 0.5em 0;
}
#page.superadmin-catalog button[type=button] {
	width: 100%;
	font-size: 12pt;
	font-family: Arial, Helvetica, sans-serif;
	height: 2em;
	line-height: 2em;
}

#superadmin-menu h2 {
	display: none;
}
#page .horizontal-menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between; /*center;*/
	margin: 0;
	padding: 0;
}
#page .horizontal-menu > * {
	margin: 0 1px 1px 0;
	padding: 0;
	list-style: none;
	flex: 1 1 auto;
}
#page .horizontal-menu > * a {
	display: block;
	height: 2em;
	line-height: 2em;
	padding: 0 1em;
	text-align: center;
	background: var(--pale-grey);
	text-decoration: none;
}
#page .horizontal-menu > * a:hover {
	background: var(--pale-grey-two);
}
#page .horizontal-menu > * b > a,
#page .horizontal-menu > * b > a:hover {
	background: var(--battleship-grey);
	color: var(--my-white);
}
#page .horizontal-menu.sub-menu {
	font-size: 80%;
	margin-top: 20px;
}

.table-cover {
	max-width: 100%;
	margin-top: 10px;
	overflow: auto;
}

table.roles {
	border-spacing: none;
	border-collapse: collapse;
	box-sizing: borderbox;
	width: 100%;
}
table.roles caption {
	font-size: 120%;
	font-weight: bold;
	margin: 1em 0;
}
table.roles thead td {
	background: var(--pale-grey-two);
	border: 1px solid var(--pale-grey);
	text-align: center;
	font-weight: bold;
}
table.roles tbody td {
	background: var(--my-white);
	border: 1px solid var(--pale-grey);
	text-align: center;
}
table.roles tbody tr:nth-child(2n) td {
	background: var(--pale-grey);
	border: 1px solid var(--pale-grey-two);
}
table.roles tbody td input[type=checkbox] {
	cursor: pointer;
	font-size: 200%;
}
table.roles tbody tr.focused td {
	background: #adf;
}

table.superadmin {
	border-spacing: none;
	border-collapse: collapse;
	box-sizing: borderbox;
	width: 100%;
}
table.superadmin caption {
	font-size: 120%;
	font-weight: bold;
	margin: 1em 0;
}
table.superadmin input {
	width: calc(100% - 8ch);
	display: inline-block;
	border: 1px solid var(--pale-grey-two);
	border-radius: 2px;
}
table.superadmin input[type=submit],
table.superadmin input[type=button] {
	background: var(--battleship-grey-light);
	color: var(--my-white);
}
table.superadmin input[type=submit]:hover,
table.superadmin input[type=button]:hover {
	background: var(--battleship-grey);
}

table.superadmin thead td {
	background: var(--pale-grey-two);
	border: 1px solid var(--pale-grey);
	text-align: center;
	font-weight: bold;
	padding: 5px;
}
table.superadmin tbody td {
	background: var(--my-white);
	border: 1px solid var(--pale-grey);
	text-align: center;
	padding: 5px;
	height: 2em;
	line-height: 2em;
}
table.superadmin tbody td.name,
table.superadmin tbody td.country,
table.superadmin tbody td.origin,
table.superadmin tbody td.nick,
table.superadmin tbody td.email {
	text-align: left;
}
table.superadmin tbody td.name {
	font-weight: bold;
	padding-left: 1em;
}
table.superadmin tbody td.registered,
table.superadmin tbody td.activated {
	white-space: nowrap;
}
table.superadmin thead td.censored,
table.superadmin tbody td.censored,
table.superadmin thead td.logged,
table.superadmin tbody td.logged {
	width: 110px;
	min-width: 110px;
}
table.superadmin tbody tr:nth-child(2n) td {
	background-color: var(--pale-grey);
	border: 1px solid var(--pale-grey-two);
}

table.superadmin.makes tbody tr:hover td {
	background-color: var(--pale-grey-two);
	border: 1px solid var(--pinkish-grey);
	cursor: pointer;
}

table.superadmin tbody td.uid {
	font-family: monospace;
	text-align: center;
}
table.superadmin tbody td.log {
	font-family: monospace;
	white-space: pre-wrap;
}
table.superadmin thead input {
	box-sizing: border-box;
	width: 100%;
}
table.superadmin tbody button,
table.superadmin tbody input {
	box-sizing: border-box;
	width: 100%;
	height: 2em;
	line-height: 2em;
	padding: 0 0.5em;
	font-size: 16px;
}
table.superadmin tbody input[type=checkbox] {
	zoom: 2;
	height: auto;
	width: auto;
}
table.superadmin td.logged button,
table.superadmin td.admin button,
table.superadmin td.censored button {
	display: none;
}
table.superadmin td.logged:hover button,
table.superadmin td.admin:hover button,
table.superadmin td.censored:hover button {
	display: inline;
}
table.superadmin td.logged:hover .placeholder,
table.superadmin td.admin:hover .placeholder,
table.superadmin td.censored:hover .placeholder {
	display: none;
}
table.superadmin tr#uid-new td {
	background: #cfc;
}
table.superadmin tbody select {
	max-width: 4em;
	font-size: 16px;
	height: 2em;
}

table.superadmin td.logo {
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

.sortinghandler {
	display: block;
	text-align: center;
}
.sortinghandler * {
	color: var(--my-white);
	cursor: pointer;
}
.sortinghandler .selected {
	color: var(--black);
}

.dragover {
	background: #8adaf6 !important;
}

select { /* vlastní stylování zobáčku selectu */
  /* Odebereme výchozí šipku (různé pro různé prohlížeče) */
  appearance: none;
  -webkit-appearance: none;  /* Pro Chrome, Safari, Edge */
  -moz-appearance: none;     /* Pro Firefox */
  /* Přidáme vlastní šipku jako background */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>');
  background-repeat: no-repeat;
  background-position: right 12px center; /* Pozice šipky */
  background-size: 16px; /* Velikost ikony */
  /* Volitelně: trochu odsadíme text, aby nepřekrýval šipku */
  padding-right: 40px; /* Udělej místo pro šipku */
}


/* @media only screen and (max-width: var(--media-mini-mobil-max)) { */
@media only screen and (max-width: 600px) {
	#footer {
		width: 100%;
		font-size: 90%;
		/* display: none; */
	}
	#footer > * {
		margin-left: 10px;
		margin-right: 10px;
	}

	#page form [contenteditable=true],
	#page form input,
	#page form textarea {
		font-size: 16px;
	}  
	#page form .ea-input.title input {
		font-size: 20px;
	}
	#page form [contenteditable=true] {
		padding: 10px;
	}
	#page form [contenteditable=true] h3 {
		font-size: 20px;
	}

	#footer ul {
		font-size: 9pt;
	}

	#page section.account-settings {
		display: block;
	}
	#edit-credentials-form,
	#edit-additional-form {
		width: 100%;
		border: none;
		padding: 0;
	}

	.nonactivated-account-note i {
		display: none;
	}


	/* --- SUPER-ADMIN --- */
	#superadmin-menu {
		max-width: 100%;
	}
	.table-cover table.roles thead tr:first-child td:not(:first-child) {
		height: 100px;
		max-width: 49px;
		text-align: left;
		font-size: 0;
	}
	.table-cover table.roles thead tr:first-child td:not(:first-child) b {
		position: relative;
		bottom: -15px;
		font-size: 10pt;
		max-height: 49px;
		line-height: 49px;
		display: block;
		text-align: left;
		transform: rotate(-90deg);
		-webkit-transform: -webkit-rotate(-90deg); /* Safari/Chrome */
		-moz-transform: rotate(-90deg); /* Firefox */
		-o-transform: rotate(-90deg); /* Opera */
		-ms-transform: rotate(-90deg); /* IE 9 */	 
	}
}

/* @media only screen and (max-width: var(--media-mini-tablet-max)) { */
@media only screen and (max-width: 800px) {
	.table-cover table.roles thead tr:nth-child(2) td {
		position: relative;
		font-size: 0;
		width: 24px;
		padding: 0;
	}
	.table-cover table.roles thead tr:nth-child(2) td:before {
		content: attr(data-short);
		display: block;
		text-align: center;
		font-size: 10pt;
		width: 24px;
		margin: auto;
	}
}

/* @media (min-width: var(--media-desktop-min) { */
/* @media (min-width: 960px) {
	form textarea[name*=perex],
	form textarea[name*=body] {
		min-height: 100%;
	}
} */



/* blok pro přihlášení k newsletteru - začátek */
#revue-embed {
	background-color: var(--pale-grey);
	padding: 20px;
	border-left: 10px solid var(--pale-grey-two);
	font-size: 16px;
	line-height: 1.4;
	margin: 40px 0;
	position: relative;
}
#revue-embed:first-of-type {
	margin-top: 0;
}
#revue-embed h3 {
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 24px;
	font-weight: normal;
}
#revue-embed label {
	display: none;
}
#revue-embed input[type="email"] {
	box-sizing: border-box;
	font-family: var(--default-font);
	font-size: 16px;
	height: 60px;
	line-height: 60px;
	width: 100%;
	padding: 0 10px;
	border: 2px solid var(--pale-grey-two);
	border-radius: 4px;
}
#revue-embed input[type="submit"],
#revue-embed input[type="cancel"],
#revue-embed a.button {
	box-sizing: border-box;
	font-family: var(--default-font);
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
	height: 70px;
	line-height: 70px;
	width: 100%;
	padding: 0 10px;
	border-radius: 4px;
	color: var(--my-white);
	background-color: var(--my-black);
	cursor: pointer;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	display: inline-block;
	margin: 0;
}
#revue-embed input[type="submit"]:hover,
#revue-embed a.button:hover {
	background-color: var(--battleship-grey);
}
#revue-embed .revue-form-credit,
#revue-embed .revue-form-footer {
	font-size: 14px;
}
#revue-embed .revue-form-credit {
	font-weight: bold;
	margin-top: 20px;
}
#revue-embed .hidden {
	display: none !important;
}
@media screen and (min-width: 660px) and (max-width: 959px) {
	#revue-embed:first-of-type {
		margin-top: 40px;
	}
	#revue-embed h3,
	#revue-embed .revue-form-info {
		width: calc(50% - 30px);
	}
	#revue-embed .revue-form-group,
	#revue-embed .revue-form-actions {
		position: absolute;
		width: calc(50% - 30px);
		float: right;
		top: 0;
		right: 20px;
	}
	#revue-embed .revue-form-actions {
		top: 70px;
	}
	#revue-embed .revue-form-unsubscribe,
	#revue-embed .revue-form-credit,
	#revue-embed .revue-form-footer {
		text-align: center;
	}
	#revue-embed .revue-form-unsubscribe {
		margin-top: 40px;
	}
	
}
/* blok pro přihlášení k newsletteru - konec */

@media print {
	@page {
		/* size: 297mm 420mm; */
		size: 210mm 297mm;
		padding: 10mm 10mm 10mm 0;
	}
	body {
		width: 1100px;
		padding-right: 10mm;
	}
	#header,
	#lang-filter,
	#footer,
	section.next-articles,
	.superadmin-actions,
	i.top-selector {
		display: none;
	}
	img,
	#revue-embed,
	#top-reviews .article-listing,
	#top-testdrives .article-listing,
	.article-listing .article-overview,
	.reviewers .reviewer,
	.considered-item,
	.thumbnails a {
		page-break-inside: avoid;
		break-inside: avoid;
	}
}

/* SOCIÁLNÍ SÍTĚ (Twitter, Facebook, Reddit, WhatsApp a email) */
/* nastylování elementu do čtverečku s ikonkou */
/* pro prvky s třídou "social-icon" a třídou určující soc. síť */
:root {
	--soc-icon-size: 2em;
	--soc-icon-bg: #777;
	--soc-icon-bg-hover: #555;
}
.social-icon {
	display: inline-block;
	overflow: hidden;
	padding-left: var(--soc-icon-size);
	width: 0;
	height: var(--soc-icon-size);
	line-height: var(--soc-icon-size);
	text-align: center;
	color: #fff;
	background-color: var(--soc-icon-bg);
	background-image: var(--soc-icon-img);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 60%;
}
.social-icon:hover,
.social-icon:active {
	background-color: var(--soc-icon-bg-hover);
}
.social-icon.twitter {
	--soc-icon-bg: #55acee;
	--soc-icon-bg-hover: #2795e9;
	--soc-icon-img: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M23.44%204.83c-.8.37-1.5.38-2.22.02.93-.56.98-.96%201.32-2.02-.88.52-1.86.9-2.9%201.1-.82-.88-2-1.43-3.3-1.43-2.5%200-4.55%202.04-4.55%204.54%200%20.36.03.7.1%201.04-3.77-.2-7.12-2-9.36-4.75-.4.67-.6%201.45-.6%202.3%200%201.56.8%202.95%202%203.77-.74-.03-1.44-.23-2.05-.57v.06c0%202.2%201.56%204.03%203.64%204.44-.67.2-1.37.2-2.06.08.58%201.8%202.26%203.12%204.25%203.16C5.78%2018.1%203.37%2018.74%201%2018.46c2%201.3%204.4%202.04%206.97%202.04%208.35%200%2012.92-6.92%2012.92-12.93%200-.2%200-.4-.02-.6.9-.63%201.96-1.22%202.56-2.14z%22%2F%3E%3C%2Fsvg%3E);
}
.social-icon.facebook {
	--soc-icon-bg: #3b5998;
	--soc-icon-bg-hover: #2d4373;
	--soc-icon-img: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M18.77%207.46H14.5v-1.9c0-.9.6-1.1%201-1.1h3V.5h-4.33C10.24.5%209.5%203.44%209.5%205.32v2.15h-3v4h3v12h5v-12h3.85l.42-4z%22%2F%3E%3C%2Fsvg%3E);
}
.social-icon.reddit {
	--soc-icon-bg: #5f99cf;
	--soc-icon-bg-hover: #3a80c1;
	--soc-icon-img: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M24%2011.5c0-1.65-1.35-3-3-3-.96%200-1.86.48-2.42%201.24-1.64-1-3.75-1.64-6.07-1.72.08-1.1.4-3.05%201.52-3.7.72-.4%201.73-.24%203%20.5C17.2%206.3%2018.46%207.5%2020%207.5c1.65%200%203-1.35%203-3s-1.35-3-3-3c-1.38%200-2.54.94-2.88%202.22-1.43-.72-2.64-.8-3.6-.25-1.64.94-1.95%203.47-2%204.55-2.33.08-4.45.7-6.1%201.72C4.86%208.98%203.96%208.5%203%208.5c-1.65%200-3%201.35-3%203%200%201.32.84%202.44%202.05%202.84-.03.22-.05.44-.05.66%200%203.86%204.5%207%2010%207s10-3.14%2010-7c0-.22-.02-.44-.05-.66%201.2-.4%202.05-1.54%202.05-2.84zM2.3%2013.37C1.5%2013.07%201%2012.35%201%2011.5c0-1.1.9-2%202-2%20.64%200%201.22.32%201.6.82-1.1.85-1.92%201.9-2.3%203.05zm3.7.13c0-1.1.9-2%202-2s2%20.9%202%202-.9%202-2%202-2-.9-2-2zm9.8%204.8c-1.08.63-2.42.96-3.8.96-1.4%200-2.74-.34-3.8-.95-.24-.13-.32-.44-.2-.68.15-.24.46-.32.7-.18%201.83%201.06%204.76%201.06%206.6%200%20.23-.13.53-.05.67.2.14.23.06.54-.18.67zm.2-2.8c-1.1%200-2-.9-2-2s.9-2%202-2%202%20.9%202%202-.9%202-2%202zm5.7-2.13c-.38-1.16-1.2-2.2-2.3-3.05.38-.5.97-.82%201.6-.82%201.1%200%202%20.9%202%202%200%20.84-.53%201.57-1.3%201.87z%22%2F%3E%3C%2Fsvg%3E);
}
.social-icon.whatsapp {
	--soc-icon-bg: #25d366;
	--soc-icon-bg-hover: #1da851;
	--soc-icon-img: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M20.1%203.9C17.9%201.7%2015%20.5%2012%20.5%205.8.5.7%205.6.7%2011.9c0%202%20.5%203.9%201.5%205.6L.6%2023.4l6-1.6c1.6.9%203.5%201.3%205.4%201.3%206.3%200%2011.4-5.1%2011.4-11.4-.1-2.8-1.2-5.7-3.3-7.8zM12%2021.4c-1.7%200-3.3-.5-4.8-1.3l-.4-.2-3.5%201%201-3.4L4%2017c-1-1.5-1.4-3.2-1.4-5.1%200-5.2%204.2-9.4%209.4-9.4%202.5%200%204.9%201%206.7%202.8%201.8%201.8%202.8%204.2%202.8%206.7-.1%205.2-4.3%209.4-9.5%209.4zm5.1-7.1c-.3-.1-1.7-.9-1.9-1-.3-.1-.5-.1-.7.1-.2.3-.8%201-.9%201.1-.2.2-.3.2-.6.1s-1.2-.5-2.3-1.4c-.9-.8-1.4-1.7-1.6-2-.2-.3%200-.5.1-.6s.3-.3.4-.5c.2-.1.3-.3.4-.5.1-.2%200-.4%200-.5C10%209%209.3%207.6%209%207c-.1-.4-.4-.3-.5-.3h-.6s-.4.1-.7.3c-.3.3-1%201-1%202.4s1%202.8%201.1%203c.1.2%202%203.1%204.9%204.3.7.3%201.2.5%201.6.6.7.2%201.3.2%201.8.1.6-.1%201.7-.7%201.9-1.3.2-.7.2-1.2.2-1.3-.1-.3-.3-.4-.6-.5z%22%2F%3E%3C%2Fsvg%3E);
}
.social-icon.email {
	--soc-icon-bg: #777777;
	--soc-icon-bg-hover: #5e5e5e;
	--soc-icon-img: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M22%204H2C.9%204%200%204.9%200%206v12c0%201.1.9%202%202%202h20c1.1%200%202-.9%202-2V6c0-1.1-.9-2-2-2zM7.25%2014.43l-3.5%202c-.08.05-.17.07-.25.07-.17%200-.34-.1-.43-.25-.14-.24-.06-.55.18-.68l3.5-2c.24-.14.55-.06.68.18.14.24.06.55-.18.68zm4.75.07c-.1%200-.2-.03-.27-.08l-8.5-5.5c-.23-.15-.3-.46-.15-.7.15-.22.46-.3.7-.14L12%2013.4l8.23-5.32c.23-.15.54-.08.7.15.14.23.07.54-.16.7l-8.5%205.5c-.08.04-.17.07-.27.07zm8.93%201.75c-.1.16-.26.25-.43.25-.08%200-.17-.02-.25-.07l-3.5-2c-.24-.13-.32-.44-.18-.68s.44-.32.68-.18l3.5%202c.24.13.32.44.18.68z%22%2F%3E%3C%2Fsvg%3E);
}
