/*--------------------------------------------------------------
 * Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Base Margins
# Icons
# Site
# Header
# Footer
# Front-page
# Posts and pages
# Archives
# Comments - no comments
# Media
# Captions
# Galleries
# Tables
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Base Margins
--------------------------------------------------------------*/
/* .container have to be first - margin-top is 0!! for centering the content */
.container {
	/* max width is 1200px + .site-main{ margin-left + margin-right } + 2px border */
	max-width: calc(1200px + 4rem + 2px);
	margin: 0 auto;
}
/* under logo is white space */
.site-header {
	margin-top: 1rem;
}
/* space between content and footer */
.site-content {
	padding-bottom: 2rem;
	background-color: white;
  background-image: url(/app/themes/zsotnice/assets/images/otnice-freepick-school-background-gray2-tiny.png);
}
.site-footer {
}
/* border and padding around main content */
.content-area {
  border: 1px solid #606060;
  border-top: none;
	background-color: white;
	padding: 2rem;
}
/* main margin for unificate spaces from the view */
.site-main {
	/* top border will be duplicite with .site-content */
	border-top: none;
}
/*--------------------------------------------------------------
# Icons
food menu + information system School online
(in the home-page on content + in the footer)
--------------------------------------------------------------*/
/* wrapper for icons */
.fast-icons {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: flex-start;
	align-items: flex-start;
	align-content: flex-start;
	justify-content: center;
}
/* block with icon and the text */
.fast-icons__item {
	display: block;
	margin-right: 1em;
	text-align: center;
}
/* icon image  */
.fast-icons__item img {
	width: 80px;
	height: 80px;
	margin-top: 1em;
}
/*--------------------------------------------------------------
# Site
--------------------------------------------------------------*/
.site {
	margin: 0 auto;
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
/* LOGO in the header */
.site-branding {
	display: block;
	text-align: center;
}
.custom-logo {
	width: 210px;
}
@media screen and (min-width: 850px) {
	.custom-logo {
		width: 100%; /* 280px */
	}
}
/* widget with phone number under the logo */
.sidebar-header .textwidget {
	display: block;
	text-align: center;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
/* wrap for sidebar with contacts and links */
.wrap-sidebar-1 {
	background-color: #56812A;
	color: white;
}
/* wrap for sidebar with partners logos */
.wrap-sidebar-2 {
	background-color: white;
}
/* wrap for copyright Zeni */
.copyright {
	background-color: #333;
	color: #FFFEF8;
}
/* arrow scroll back to top */
.arrow-back-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	background: #375D10;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	padding: 0.5rem;
}
/** footer LINKS **/
.site-footer a,
.site-footer a:visited {
	color: #FFFFDD;
}
#sidebar-footer-1 a:hover,
#sidebar-footer-1 a:focus,
#sidebar-footer-1 a:active {
	background-color: #375D10;
	color: white;
}
#sidebar-footer-2 a,
#sidebar-footer-2 a:visited,
#sidebar-footer-2 a:hover,
#sidebar-footer-2 a:focus,
#sidebar-footer-2 a:active {
	color: #8F412E;
}
#copyright a,
#copyright a:visited {
	color: #f8f6ed;
}
#copyright a:hover,
#copyright a:focus,
#copyright a:active {
	color: #f8f6ed;
}
/** END footer links **/
/* container for widgets at footer - there are 2 sidebars at footer */
.sidebar-footer {
	display: block;
}
.widget-footer-1 {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	text-align: center;
}
.widget-footer-2 {
	text-align: center;
}
/* block for map picture and text */
.footer1-map {
	display: block;
}

@media screen and (min-width: 700px) {
	/* container for widgets at footer - there are 2 sidebars at footer */
	.sidebar-footer {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: flex-start;
		-ms-align-items: flex-start;
		align-items: flex-start;
		align-content: flex-start;
		padding-top: 1rem;
		padding-bottom: 1rem;
	}
	.widget-footer-1 {
		width: calc( 50% - 4rem );
		text-align: left;
	}
	.footer1-icons {
		justify-content: flex-start;
	}
	/* widget with map is at new line and centered */
	.widget-footer-1:nth-child(3n) {
		width: 100%;
		text-align: center;
	}
	/* widget with map is centered */
	.widget-footer-1:nth-child(3n) .custom-html-widget {
		display: inline-block;
	}
}
/* widgets at footer 1 at biger screen */
@media screen and (min-width: 1000px) {
	.widget-footer-1,
	.widget-footer-1:nth-child(3n) {
		width: calc( 33.3% - 4rem );
		text-align: left;
	}
}

.copyright .container {
	padding-top: 1rem;
	padding-bottom: 1rem;
	text-align: center;
}

.sidebar-footer,
.copyright .container {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

/*--------------------------------------------------------------
# Front-page
--------------------------------------------------------------*/
/* reduction space between menu and group of introduction pictures */
#introduction__pictures {
	/*margin-top: -1rem;*/
	width: 100%;
	box-sizing: border-box;
}
/* group of introduction pictures display as flex */
#introduction__pictures .wp-block-group__inner-container {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: center;
	-ms-align-items: flex-start;
	align-items: flex-start;
	width: 100%;
	margin: 0;
	padding: 0;
}
/* display link to full image not only inline aria  */
#introduction__pictures a {
	position: relative;
	display: block;
}
/* pictures are without spaces, outer focus ring would be hidden under the next picture */
#introduction__pictures a:focus {
	outline: none;
	box-shadow: none;
}
/* two-colour focus indicator drawn inside the picture (no layout shift) */
#introduction__pictures a:focus::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border: 3px solid #000;
	box-shadow: inset 0 0 0 3px #fff;
	pointer-events: none;
}
#introduction__pictures a:focus:not(:focus-visible)::after {
	content: none;
}
/* pictures in group are withouth spaces! */
#introduction__pictures .wp-block-image {
	margin: 0;
	padding: 0;
	line-height: 0;
	width: 100%;
}
#introduction__pictures .wp-block-image img {
	width: 100%;
}
#introduction .fast-icons {
	/* background is same as border of blockquote */
	background-color: #CEC7AD;
	padding-top: 1em;
}
/* introduction pictures are at 2 columns */
@media screen and (min-width: 600px) {
	/* width for content at 2 columns */
	#introduction__pictures .wp-block-image {
		width: 50%;
	}
}
/* introduction pictures are at 3 columns */
@media screen and (min-width: 1150px) {
	/* width for content at 3 columns */
	#introduction__pictures .wp-block-image {
		width: calc( 100% / 3);
	}
}
/* "Novinky" heading is h2, but looks the same as h1 page titles */
h2.page-title {
	font-size: 2.5rem;
}
/*--------------------------------------------------------------
# Posts and pages
--------------------------------------------------------------*/
/* pictures with class picture-border has border as introduction picture */

.picture-border {
	border: 1px solid #666;
}

.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

/* post_thumbnail in the page and in the single */
.post-thumbnail {
	margin-top: 1.5em;
}

.entry-header {
}

/*NEW entry-meta at posts*/
/* the same metadata everywhere on the site */
.posted-on,
.byline,
.cat-links {
	display: block;
	margin-right: 0;
	padding-bottom: .5em;
	color: #666;
	font-size: 0.75rem;
	text-transform: uppercase;
}
@media screen and (min-width: 700px) {
	.posted-on,
	.byline,
	.cat-links {
		display: inline;
		margin-right: 1em;
		padding: 0;
	}
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}
/*--------------------------------------------------------------
# Archives
--------------------------------------------------------------*/
.wrap-archive-article article {
	display: block;
	background-color: #f8f6ed;
}
/* thumbnail and text (title, metadata, excerpt) is next to each other */
@media screen and (min-width: 700px) {
	/* flex for archive article content */
	.wrap-archive-article article {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-ms-align-items: flex-start;
		align-items: flex-start;
	}
	.wrap-archive-article article:nth-of-type(2n) {
		margin-right: 0;
	}
}
/* articles are at 2 columns */
@media screen and (min-width: 1000px) {
	/* flex is necesery for archive in 2 column */
	.wrap-archive-article {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	/* width for content at 2 columns */
	.wrap-archive-article article {
		width: calc(50% - 1em);
		margin-right: 1em;
	}
	/* width of second column (for content at 2 columns) */
	.wrap-archive-article article:nth-of-type(2n) {
		width: 50%;
		margin-right: 0;
	}
}
/* size of archive thumbnail */
.wrap-archive-article .wp-post-image {
	display: block;
	width: 200px;
	height: 200px;
	margin: 0 auto;
	padding-top: 0;
	/* fix for MS IE */
	flex-wrap: 0;
	flex-shrink: 0;
}

@media screen and (min-width: 350px) {
	.wrap-archive-article .wp-post-image {
		width: 300px;
		height: 300px;
	}
}
@media screen and (min-width: 700px) {
	.wrap-archive-article .wp-post-image {
		display: inline-block;
		margin: 0;
		padding-top: 0;
	}
}
/* smaller thumbnail when archive articles are at 2 columns */
@media screen and (min-width: 1000px) {
	.wrap-archive-article .wp-post-image {
		width: 200px;
		height: 200px;
	}
}
/* space between thumbnail and text (title, metadata, excerpt)*/
.wrap-archive-article .wrap-article-text {
	padding-right: 2rem;
	padding-left: 2rem;
	padding-top: 1rem;
}
@media screen and (min-width: 700px) {
	/* space between thumbnail and text (title, metadata, excerpt)*/
	.wrap-archive-article .wrap-article-text {
		padding-top: 0;
	}
}
.wrap-archive-article .entry-content p {
	margin-block-start: 0;
}
/*--------------------------------------------------------------
# Comments - no comments
--------------------------------------------------------------*/
.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/*--------------------------------------------------------------
# Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
# Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}

/* gallery block captions: solid scrim instead of the core transparent gradient, readable over any image */
#content .wp-block-gallery:not(.has-nested-images) .blocks-gallery-image figcaption,
#content .wp-block-gallery:not(.has-nested-images) .blocks-gallery-item figcaption,
#content .blocks-gallery-grid:not(.has-nested-images) .blocks-gallery-image figcaption,
#content .blocks-gallery-grid:not(.has-nested-images) .blocks-gallery-item figcaption {
	/* old gallery markup reserved space at the top for the gradient */
	padding-top: 0.7em;
	color: #fff;
	background: rgba(0, 0, 0, 0.75);
}
#content .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	color: #fff;
	background: rgba(0, 0, 0, 0.75);
}
#content .blocks-gallery-image figcaption a,
#content .blocks-gallery-item figcaption a,
#content .wp-block-gallery.has-nested-images figure.wp-block-image figcaption a {
	color: #fff;
}

/*--------------------------------------------------------------
# Tables
--------------------------------------------------------------*/
/* wide tables scroll horizontally inside the content */
.table-scroll,
.wp-block-table {
	max-width: 100%;
	overflow-x: auto;
}