/*--------------------------------------------------------------
 * Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Links
# Menus
# Navigation in single posts
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Links
--------------------------------------------------------------*/
a,
a:visited {
	color: #BD4B51;
	text-decoration: underline;
}
a:hover,
a:focus,
a:active {
	color: #8F412E;
	text-decoration: underline;
}

a figcaption {
	text-decoration: underline;
}

.wp-block-button {
	display: block;
	width: 100%;
}
/* define button color */
.wp-block-button__link {
	display: inline-block;
	background-color: #1F4C59;
}
.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wp-block-button__link:active {
	background-color: #4F7782;
}
/* keep button text white, the a/a:visited/a:hover rules above would otherwise force red text onto the dark button background */
.wp-block-button__link:link,
.wp-block-button__link:visited,
.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wp-block-button__link:active,
.wp-block-file__button:link,
.wp-block-file__button:visited,
.wp-block-file__button:hover,
.wp-block-file__button:focus,
.wp-block-file__button:active {
	color: #fff;
}
/* centered button */
.button--center {
	margin: 0 auto;
	text-align: center;
}

/*--------------------------------------------------------------
# Menus
--------------------------------------------------------------*/
/* wrapper for menu and search */
.wrap-site-navigation {
	/* relative positioning for display toggled search*/
	position: relative;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: stretch;
	justify-content: center;
  align-content: center;
	/* light green */
	background-color: #56812A;
}
/* font for all items in the header */
.wrap-site-navigation,
.menu-toggle,
.search-toggle {
	font-family: 'Oswald', sans-serif;
	font-size: 1.5rem;
	font-weight: 300;
}
/* style toggle" text MENU to display mobile menu */
.menu-toggle,
/* style text "toggle" to display the search form */
.search-toggle {
	display: block;
	border: none;
	background-color: transparent;
	color: white;
	text-transform: uppercase;
  padding: 0.5em;
	cursor: pointer;
	border-radius: 0;
}

/* hamburger icon before text MENU */
.menu-toggle__icon,
/* style search icon before text  */
.search-toggle__icon {
	width: 1.5rem;
	height: 1.5rem;
	/* vertical icon position */
	margin: -3px 0;
}
/* hamburger icon before text MENU */
.menu-toggle__icon {
	content: url('../images/material-menu-24px.svg');
}
/* search icon before text  */
.search-toggle__icon {
	content: url('../images/material-search-24px.svg');
}
/* toggle hamburger icon to close */
.main-navigation.toggled .menu-toggle__icon,
/* toggle search icon to close */
#site-search.toggled .search-toggle__icon {
	content: url('../images/material-close-24px.svg');
}

/* dark green when I stay on mobile menu button */
.menu-toggle:focus,
.menu-toggle:hover,
#site-navigation.toggled .menu-toggle,
.search-toggle:focus,
.search-toggle:hover,
#site-search.toggled .search-toggle {
  color: white;
  background-color: #375D10;
}

/* menu is not visible */
.menu-container {
	display: none;
}
/* display menu when menu button is toggled */
.main-navigation.toggled .menu-container {
	/* position to .wrap-site-navigation */
	position: absolute;
	z-index: 598;
	top: 100%;
	left: 0;
	display: block;
  width: 100%;
	padding: 0;
	/* dark green - same as around search form */
	background-color: #375D10;
}
/* style menu START */
/* display menu */
.menu-container ul {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
	/*font-size: 1.2rem;*/
}
.menu-container li {
	margin: 0;
	padding: 0;
}

.menu-container a {
	display: block;
	text-decoration: none;
	padding: 0.5em;
  color: white;
  border-top: thin solid #56812a; // striped mobile menu
}


/* second menu level has bigger space from left */
.menu-container li li a {
	padding-left: 2em;
}
/* highlight choosen menu item */
.menu-container a:active,
.menu-container a:hover,
.menu-container a:focus {
	color: white;
	background-color: #56812A;
	text-decoration: underline;
}

.menu-header > li:first-child {
  border-top: none; // 1. has no strip
}

/* maximum 2 levels of menu */
.menu-container ul ul ul {
	display: none;
}

/* SEARCH in the header */

/* default is search-form hidden */
#wrap-search-form {
  display: none;
}
/* display form when button is toggled */
#site-search.toggled #wrap-search-form {
  display: block;
}
/* style search form */
.site-search .search-form {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 598;
  background-color: #375D10;
  padding: 0.5em;
  width: 100%;
}
/* search form grow to 100% view width */
.site-search .search-form > label {
  flex-grow: 1;
}
.site-search .search-form .search-field {
  width: 100%;
}
/* space between search-field and search-button */
.site-search .search-form .search-submit,
/* margin for space at the left side - email and phone number under logo */
.left-margin-half{
  margin-left: 0.5em;
}

/* style menu END */
/*-----------------------------------------------------------------*/
@media screen and (min-width: 850px) {
	/* "toggle" text is lowercase on bigger screen - same as menu */
	.search-toggle {
		text-transform: none;
	}
	/* menu button is hiden on bigger screen */
	.menu-toggle {
		display: none;
	}
	/* display desktop menu (at mobil is not visible) */
	.menu-container {
		display: block;
    background-color: transparent;
    height: 100%;
	}

  /* reset mobile menu position - Zbyněk found bug */
  #site-navigation.toggled .menu-container {
    position: initial;
    background-color: transparent;
    padding: 0;
  }

  .menu-container a {
    border-top: none;
  }

	/* first level of menu is visible on bigger screen */
	.menu-container > ul {
		/* flex for display list items in one raw */
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    height: 100%;
	}
	.menu-container li {
		position: relative;
	}
	/* second level desktop menu */
	.menu-container ul ul {
		position: absolute;
		/* show over search form */
		z-index: 600;
		top: 100%;
		left: -999em;
	}
	/* width of second level desktop menu */
	.menu-container .sub-menu a {
		min-width: 20rem;
    padding-left: 1em;
	}

	/* display submenu */
	.menu-container ul li:hover > ul,
	/* .focus is .js for add class to li - to be accessible by keyboard */
	.menu-container ul > li.focus > ul {
		left: 0;
		background-color: #56812A;
		border: thin solid #375D10;
	}
	/* darker colours for hovered/focused item */
	/* .menu-container li:hover, */
	/* .menu-container li.focus, */
	.menu-container a:hover,
	.menu-container a:focus {
		background-color: #375D10;
	}
  /* stripped desktop submenu */
  .menu-container .sub-menu > li a {
    border-top: thin solid #375D10;
  }

  /* 1. li has no strip */
  .menu-container .sub-menu > li:first-child a {
    border-top: none;
  }

	/* arrow after menu with 2. level */
	.menu-container ul .menu-item-has-children > a:after {
		display: inline-block;
		margin: 0 0.1em 0.2em 0.4em;
		width: 0.4em;
		height: 0.4em;
		content: "";
		border-top: 0.08em solid white;
	  border-right: 0.08em solid white;
	  transform: rotate(135deg);
	}
}
/*--------------------------------------------------------------
# Navigation in single posts
--------------------------------------------------------------*/
.site-main .posts-navigation,
.site-main .post-navigation {
	font-family: 'Oswald', sans-serif;
	font-size: 1.5em;
	font-weight: 300;
	margin: 0 0 1.5em;
	display: flow-root;
}
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 50%;
}
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}
.nav-previous:before {
	content: "«";
	margin-right: 0.5rem;
}
.nav-next:after {
	content: "»";
	margin-left: 0.5rem;
}