/*
Theme Name: Cesnet
Theme URI: http://wordpress.org/
Author: Cesnet
*/

body {
	font: 1em/1.5 Lato, sans-serif;
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6 {
	margin: 1em 0 0.5em;
}

h1 {
	font-size: 2.3rem;
}

h2 {
	font-size: 1.6rem;
}

h3 {
	font-size: 1.2rem;
}

p {
	margin: 0.75em 0;
}

a {
	color: #0068a2;
	text-decoration-skip: ink;
}

:visited {
	color: #004164;
}

a:hover {
	color: #f27930;
/*	background-color: #000;
	text-decoration: none; */
}

table {
	border-collapse: collapse;
}

tr {
	vertical-align: baseline;
}

td, th {
	padding: 0.5em;
	text-align: left;
}

td:first-child, th:first-child {
	padding-left: 0;
}

td:last-child, th:last-child {
	padding-right: 0;
}

.sede td, .sede th {
	padding: 0.5em;
}

ul {
	list-style-type: square;
}

ol {
	list-style-type: decimal;
}

ol ol {
	list-style-type: lower-alpha;
}

ol ol ol {
	list-style-type: lower-roman;
}

ol.roman {
  list-style-type: lower-roman;
}

ol.alpha {
  list-style-type: lower-alpha;
}

body{
	counter-reset: polozka;
}

ol.hier {
	list-style-type: none;
}

ol.hier ol.hier {
	counter-reset: polozka;
	padding-left: 3em;
}

ol.hier > li:before {
	counter-increment: polozka;
	content: counters(polozka,".") " ";
	float: left;
	margin-left: -2em;
}

ol.hier ol.hier > li:before {
	margin-left: -3em;
}

dd {
	margin-bottom: 0.75em;
}

dt {
	margin-top: 0.75em;
}

dd p {
	margin-top: 0;
}

.content {
	display: flex;
	flex-direction: column;
	align-items: center;
}

main {
	width: 100%;
	max-width: 60rem;
	margin: 0 auto;
	padding: 0.5rem;
	box-sizing: border-box;
}

header {
	background-color: #0068a2;
	background-image: linear-gradient(to right, #051427, #0068a2, #0068a2, #051427);
	width: 100%;
	padding: 1rem;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}

.home header {
	background-image: url(./images/cesnet-prouzek.svg), linear-gradient(to right, #051427, #0068a2, #0068a2, #051427);
	background-repeat: repeat-x, no-repeat;
	background-position: left bottom;
	background-size: 30rem, cover;
	padding: 1rem 1rem 2rem;
}

header a,
header a:visited {
	color: #fff;
}

header a:hover {
	color: #fff;
	background-color: transparent;
	filter: drop-shadow(0 0 5px #fff);
	text-decoration: underline;
}

footer {
	width: 100%;
}

footer .darkbg a {
	color: #ddd;
	text-decoration: none;
}

footer .darkbg a:visited {
	color: #ccc;
}

footer .darkbg a:hover {
	color: #f27930;
}

footer ul {
	padding-left: 1em;
	margin-left: 0;
}

footer .box h2:first-child,
footer .box h3:first-child {
	text-align: left;
}

footer .logo {
	margin: 0 10% 1rem;
	display: inline-block;
	opacity: 0.75;
}

.logo img {
	height: 2rem;
}

.logoline {
	text-align: center;
}

.footernav {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

.mainnav {
	width: 100%;
	max-width: 59rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}

img.sitelogo {
	width: 10rem;
}

.mainmenu {
	padding: 0.5rem;
	font-size: larger;
	flex-grow: 1;
	max-width: 35em;
}

.mainmenu ul {
	list-style-type: none;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
}

.mainmenu a {
	display: block;
	padding: 0.3em 0.5em;
}

.menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menu li {
	display: inline-block;
}

.menu a {
	display: inline-block;
	padding: 0.25em;
	text-decoration: none;
}

.current-menu-item a, .current-page-ancestor a {
	font-weight: bold;
	border-bottom: solid 0.2em #fff;
}

.sitesearch {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}

.sitesearchform {
	display: inline-block;
}

.searchbox {
	border-radius: 2em;
	border: solid 1px rgba(255,255,255,0.3);
	padding: 0.2em 0.5em 0.2em 3em;
	background: rgba(255,255,255,0.1) url(./images/loupe-icon.svg) no-repeat 0.9em center;
	background-size: 1.75em;
	color: #fff;
	height: 3em;
	width: 0em;
	transition: all 0.25s;
}

.searchbox:focus {
	width: 15em;
}

#language {
	margin: 0 0.5em 0 0;
}

#lang_sel_list ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: inline;
}

#lang_sel_list li {
	display: inline;
}

#lang_sel_list li a {
	text-decoration: none;
}

#lang_sel_list li a.lang_sel_sel {
	font-weight: bold;
	text-decoration: underline;
}

.carousel {
	margin: 0.5rem auto 0;
	width: 100%;
	max-width: 59rem;
}

.breadcrumbs {
	color: #888;
	font-size: 85%;
	text-align: left;
}

.homeicon {
	height: 1em;
}

.postinfo, .edit-date {
	text-align: right;
	margin-top: 1em;
	padding-right: 0.5em;
	border-right: solid 1.3em #0068a2;
}

nav.pagination {
	display: flex;
	align-items: baseline;
}

.pagination h2 {
	font-size: 1.2em;
	margin-right: 1em;
}

.page-numbers {
	margin-right: 1em;
}

.page-numbers.current {
	font-weight: bold;
}

.aktuality {
	margin-top: 0.5rem;
}

.aktuality .post {
	border: solid 1px #0068a2;
}

.aktuality p {
	margin: 0.5rem;
	font-weight: normal;
}

.post-header {
	background-color: #0068a2;
	margin: 0;
	padding: 0.5rem;
	min-height: 3.5rem;
}

.post-header a {
	color: #fff;
	text-decoration: none;
}

.akt-obsah {
}

/* v aktualitách se zobrazují jen featured image (třída introimg) */

.aktuality img {
	display: none;
}

.introimg {
	display: none;
}

@supports ( object-fit: cover ) {

	.aktuality img.introimg {
		display: block;
//		mix-blend-mode: luminosity;
//		opacity: 0.7;
	}

	.introimg-bg {
		background-color: #0068a2;
	}

	.introimg {
		max-width: 100%;
		height: 7rem;
		object-fit: cover;
	}

}

.akce p {
	border-top: solid 1px #0068a2;
	padding: 0.75em 0;
	margin: 0;
}

.navigation-prev-next {
	margin-top: 1em;
}

.nav-previous {
	float: left;
	margin-right: 2em;
	max-width: 50%;
}

.nav-next {
	text-align: right;
}

blockquote.right {
	float: right;
	clear: right;
	margin: 0 0 0.5em 0.5em;
	padding: 0.5em 1rem;
	max-width: 30%;
	background-color: #eee;
}

.graybg {
	background-color: #eee;
	background-image: url(/wp-content/uploads/2017/12/pozadi-trojuhelniky-seda.svg);
	background-size: cover;
}

.darkbg {
	background-color: #5a5a5a;
	background-image: url(/wp-content/uploads/2017/12/pozadi-trojuhelniky-seda-tmava.svg);
	background-size: cover;
	color: #ccc;
}

.darkbg a,
.sekce-tmava a {
	color: #9accdf;
}

.darkbg a:visited,
.sekce-tmava a:visited {
	color: #c1dae7;
}

.bluebg {
	background-color: #0068a2;
	background-image: url(/wp-content/uploads/2017/12/pozadi-trojuhelniky-modra-tmava.svg);
	background-size: cover;
	color: #fff;
}

.bluebg a,
.sekce-modra a /*,
.aktuality .post:hover a,
.akce p:hover a */ {
	color: #ffdac4;
}

.bluebg a:visited,
.sekce-modra a:visited /*,
.aktuality .post:hover a:visited,
.akce p:hover a:visited */ {
	color: #ffeadd;
}

.graybg.noimage,
.darkbg.noimage,
.bluebg.noimage {
	background-image: none;
}

.dubg {
	background-color: #a70057;
	color: #fff;
}

.dubg a {
	color: #fbb731;
}

.dubg a:visited {
	color: #ffd481;
}

.box {
	padding: 0.5rem;
}

.box h2:first-child,
.box h3:first-child {
	text-align: center;
	margin-top: 0;
}

.sekce-modra,
.sekce-seda,
.sekce-tmava {
	background-repeat: repeat-x, repeat-x, no-repeat;
	background-position: left top, left bottom;
	background-size: 30rem, 30rem, cover;
	margin: 1rem -1rem;
	padding: 2rem 1rem;
/*	margin: 1rem calc(-50vw + 50%);
	padding: 2rem calc(50vw - 50%); */
}


.sekce-modra h2:first-child,
.sekce-seda h2:first-child,
.sekce-tmava h2:first-child {
	margin-top: 0;
}

.sekce-modra {
	background-color: #0068a2;
	color: #fff;
/*	background-image: url(./images/cesnet-prouzek.svg), url(./images/cesnet-prouzek.svg),repeating-linear-gradient(20deg, transparent, rgba(0,0,0,0.05) 3rem), repeating-linear-gradient(60deg, transparent, rgba(0,0,0,0.05) 3rem ), repeating-linear-gradient(-60deg, transparent, rgba(0,0,0,0.05) 3rem ), linear-gradient(to right, #000, #0068a2, #000); */
	background-image: url(./images/cesnet-prouzek.svg), url(./images/cesnet-prouzek.svg),url(/wp-content/uploads/2017/12/pozadi-trojuhelniky-modra-tmava.svg);
}

.sekce-seda {
	background-color: #eee;
/*	background-image: url(./images/cesnet-prouzek.svg), url(./images/cesnet-prouzek.svg),repeating-linear-gradient(20deg, transparent, rgba(0,0,0,0.03) 3rem), repeating-linear-gradient(60deg, transparent, rgba(0,0,0,0.03) 3rem ), repeating-linear-gradient(-60deg, transparent, rgba(0,0,0,0.03) 3rem ), linear-gradient(to right, #ccc, #eee, #ccc); */
	background-image: url(./images/cesnet-prouzek.svg), url(./images/cesnet-prouzek.svg), url(/wp-content/uploads/2017/12/pozadi-trojuhelniky-seda.svg);
}

.sekce-tmava {
	background-color: #5a5a5a;
	color: #fff;
/*	background-image: url(./images/cesnet-prouzek.svg), url(./images/cesnet-prouzek.svg),repeating-linear-gradient(20deg, transparent, rgba(255,255,255,0.03) 3rem), repeating-linear-gradient(60deg, transparent, rgba(255,255,255,0.03) 3rem ), repeating-linear-gradient(-60deg, transparent, rgba(255,255,255,0.03) 3rem ), linear-gradient(to right, #000, #5a5a5a, #000); */
	background-image: url(./images/cesnet-prouzek.svg), url(./images/cesnet-prouzek.svg), url(/wp-content/uploads/2017/12/pozadi-trojuhelniky-seda-tmava.svg);
}

.sekce-modra > *,
.sekce-tmava > * {
	color: #fff;
}

.custombg {
	background-image: var(--bg-img);
	background-size: 200%;
/*	background-position: 20% 30%; */
}

.prouzek-dole, .prouzek-nahore {
	background-image: url(./images/cesnet-prouzek.svg);
	background-repeat: repeat-x;
	background-size: 30rem;
}

.prouzek-dole {
	background-position: bottom left;
	padding-bottom: 1.5rem;
}


.prouzek-nahore {
	background-position: top left;
	padding-top: 1.5rem;
}

/*** Dočasné styly ***/

.page-id-15889 h1,
.sunshine {
	background-color: #fbb731;
	color: #fff;
	margin: 1rem -1rem;
	padding: 0.5em 1rem;
	box-shadow: 0 0 1rem #fbb731;
}

/*** Utility ***/

.dim { opacity: 0.4; }

.sede { background-color: #eee; }

.nowrap { white-space: nowrap; }

.big { font-size: 150%; }

.centertext { text-align: center; }
.righttext { text-align: right; }
.lefttext { text-align: left; }

.narrowblock {
	display: inline-block;
	max-width: 75%;
}

.bigskip { margin-top: 3em; }
.medskip { margin-top: 1.5em; }

.warning {
	color: #fff;
	background-color: #e68a17;
	padding: 0.2em 0.5em;
}

.imgborder { border: solid 1px #ccc; }

a.tlacitko {
	display: block;
	text-decoration: none;
	text-align: center;
	font-size: 1.5rem;
	max-width: 20rem;
	padding: 0.5em 0.75em;
	color: #fff;
	background-color: #0068a2;
	background: linear-gradient(to right, #033c61, #0068a2, #033c61);
	border: solid 1px #051427;
	border-radius: 0.2rem;
}

.button {
	display: inline-block;
	padding: 0.4em 1em;
	background-color: #5a5a5a;
	color: #fff;
	text-decoration: none;
	margin: 0.2em;
	border: none;
}

.button a {
	color: #fff;
	text-decoration: none;
}

.button.compact {
	padding: 0 0.5em;
}

.sekce-modra .button, .sekce-modra .button:visited,
.sekce-tmava .button, .sekce-tmava .button:visited,
.bluebg .button, .bluebg .button:visited,
.darkbg .button, .darkbg .button:visited  {
	background-color: #fff;
	color: #0068a2;
}

.sekce-modra .button a,
.sekce-tmava .button a,
.bluebg .button a,
.darkbg .button a {
	color: #0068a2;
}

.button:hover {
	background-color: #0068a2;
	color: #fff;
	cursor: pointer;
}

.flex-spread {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}


/*** otevírání/zavírání tlačítkem ***/

.switchable {
	display: none;
}

.switch:checked ~ .switchable {
	display: block;
}

.switch {
	/* position: absolute; */
	/* left: -200vw; */
	display: none;
}

.switchopen, .switchclose {
	margin-right: 1em;
}

.switch:checked ~ .switchopen {
	display: none;
}

.switch:not(:checked) ~ .switchclose {
	display: none;
}

/*** Typy souborů ***/

a[href$='.pdf'], a[href$='.doc'], a[href$='.docx'], a[href$='.epub'], a[href$='.mobi'], a[href$='.ppt'], a[href$='.pptx'] {
	background-position: center right;
	background-repeat: no-repeat;
	background-size: 1.3em;
	padding-right:1.4em;
}

a[href$='.pdf'] {
	background-image: url(./images/icon-pdf.svg);
}

a[href$='.doc'], a[href$='.docx'] {
	background-image: url(./images/icon-doc.svg);
}

a[href$='.epub'], a[href$='.mobi'] {
	background-image: url(./images/icon-book.svg);
}

a[href$='.ppt'], a[href$='.pptx'] {
	background-image: url(./images/icon-ppt.svg);
}

a.noicon {
	padding-right:0;
	background-image: none;
}

/*** responzivní deklarace ***/

@media ( min-width: 30rem ) {

	.mainnav {
		flex-direction: row;
	}

}

@media ( min-width: 45rem ) {

/*	@supports not ( grid-auto-flow: row ) { */

	.grid {
		display: block;
		column-gap: 1rem;
	}

	.grid > * {
		break-inside: avoid;
		margin-bottom: 1rem;
	}

	.grid2, .grid4 { column-count: 2; }

	.grid3, .grid6 { column-count: 3; }

/*	} */

	@supports ( grid-auto-flow: row ) {

		.grid {
			display: grid;
			grid-row-gap: 1rem;
			grid-column-gap: 1rem;
			column-count: auto;
		}

		.grid > * { margin-bottom: 0; }


		.grid2 {
		grid-template-columns: repeat( 2, 1fr );
		}

		.grid3 {
		grid-template-columns: repeat( 3, 1fr );
		}

		.grid4 {
		grid-template-columns: repeat( 4, 1fr );
		}

		.grid6 {
		grid-template-columns: repeat( 6, 1fr );
		}

		.g-col2 {
		grid-column: auto / span 2;
		}

		.g-col3 {
		grid-column: auto / span 3;
		}

		.g-colall {
		grid-column: 1 / -1;
		}

		.g-row2 {
		grid-row: auto / span 2;
		}

		.g-row3 {
		grid-row: auto / span 3;
		}

		.g-rowall {
		grid-row: 1 / -1;
		}

	}

}

.home main h2 {
	text-align: center;
	font-size: 2.3rem;
	margin: 2rem 0 0.5rem;
}

.alignright, .floatright {
	float: right;
	margin: 0 0 0.2rem 0.5rem;
}

.alignright {
	clear: right;
}

.aligncenter {
	display: block;
	margin: 0.5rem auto;
}

.clear {
	clear: both;
}

.sticky {
	position: sticky;
	top: 0.5em;
	box-shadow: 0 0 1.5rem #fff;
}

@media print {

	header, footer { display: none; }

	body { font-size: 12pt; }

	.content { display: block; }

}

/*** hack pro MSIE ***/

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

	* { background-image: none !important; }

	.mainnav {
    	justify-content: center;
	}

}
