/*----------------------------------------------------------------- */
/* HEADER
/*----------------------------------------------------------------- */

header
{
	position: absolute;
	z-index: 1000;
	top: 0;
	left: 0;

	width: 100%;
	height: var(--header__height);

	background: transparent;
}

header.header_bg
{
	background: var(--color__blue);
}

header.sticky_scrolling
{
	position: fixed;

	height: auto;

	background: var(--color__blue);
}

header.sticky_scrolling .header__socials
{
	display: none;
}

.notification-active header
{
	top: var(--header__notification-height);
}

.notification-active header.sticky_scrolling
{
	top: 0;
}

header .row > .row
{
	flex: 1;
}

header.sticky_scrolling .header__main
{
	padding: 12px 0;
}

/* SOCIAL ICONS */
.header__socials
{
	margin-top: 13px;
	margin-bottom: 12px;
}

.header__socials .container
{
	align-items: center;

	gap: 14px;
}

.header__main-grid
{
	display: grid;
	align-items: center;
	justify-content: space-between;

	gap: 105px;
	grid-template-columns: 1fr 1fr;
}

.header__main-grid .logo {
	display: flex;
	gap: 30px;
}

.header__main-grid .logo a {
	display: flex;
	align-items: center;
}

.header__main-grid .logo-praha img {
	max-height: 45px;
}

.header__main-grid .logo-pii img {
	max-height: 40px;
}

@media (min-width: 960px)
{
	.header__main
	{
		padding-top: 10px;
	}
	.logo
	{
		padding-top: 5px;
	}
}

@media (max-width: 1100px)
{
	.header__main-grid
	{
		gap: 40px;
	}
}


@media (max-width: 960px)
{
	header
	{
		display: flex;
		align-items: center;
	}

	header.sticky_scrolling .header__main
	{
		height: var(--header__height);
		padding: 0;
	}

	.header__socials
	{
		display: none;
	}

	.header__main
	{
		width: 100%;
		height: var(--header__height);
	}

	.header__main-grid
	{
		grid-template-columns: 1fr 70px;
	}

	.header__main-grid .logo {
		gap: 10px;
	}

	.tools
	{
		justify-self: flex-end;
	}
}

/* LOGO
----------------------------------------- */
.logo
{
	font-size: 0;
}

.logo h1
{
	font-size: 0;
	line-height: 0;

	margin: 0;
}

.logo img
{
	width: auto;
	height: 56px;

	image-rendering: -webkit-optimize-contrast;
}

@media (max-width: 960px)
{
	.logo img
	{
		height: 36px;
	}
}

/* PRIMARY NAVIGATION
----------------------------------------- */
.main-menu,
.sub-menu
{
	margin: 0;
}

.main-menu > li
{
	position: relative;
}

.main-menu a
{
	font-size: 1.3rem;

	position: relative;

	text-decoration: none;
	letter-spacing: 0.5px;
	text-transform: uppercase;

	color: var(--color__white);
}

.main-menu > li:last-child
{
	margin-right: 0;
}

.main-menu > li:hover > a,
.main-menu a:hover,
.main-menu .active-item > a,
.main-menu .active-item_post-ancestor > a,
.main-menu .active-item_archive-ancestor > a,
.main-menu .active-item_term-ancestor > a
{
	color: var(--color__red-light);
}

.main-menu > li.active-item > a:before,
.main-menu > li.active-item_post-ancestor > a:before,
.main-menu > li.active-item_archive-ancestor > a:before,
.main-menu > li.active-item_term-ancestor > a:before
{
	position: absolute;
	right: 0;
	bottom: -8px;
	left: 0;

	display: block;

	width: 0;
	height: 0;
	margin: 0 auto;

	content: '';

	border-width: 0 5px 3px 5px;
	border-style: solid;
	border-color: transparent transparent var(--color__red-light) transparent;
}

.main-menu .active-item > a
{
	font-weight: var(--font-weight__medium);

	cursor: default;
	pointer-events: none;
}

/* .main-menu > li.menu-item-has-children
{
	padding-right: 15px;
} */

/* .main-menu > li.menu-item-has-children:after
{
	position: absolute;
	top: 7px;
	right: 0;

	display: inline-block;

	padding: 3px;

	content: '';
	transition: border-color var(--transition-duration__default), transform var(--transition-duration__default);
	-webkit-transform: rotate(45deg);
	        transform: rotate(45deg);

	border: solid var(--color__white);
	border-width: 0 1px 1px 0;
} */

.main-menu > li.menu-item-has-children:hover:after,
.main-menu > li.menu-item-has-children.active-item_post-ancestor:after,
.main-menu > li.menu-item-has-children.active-item_archive-ancestor:after,
.main-menu > li.menu-item-has-children.active-item_term-ancestor:after
{
	border-color: var(--color__red-light);
}

.main-menu .sub-menu
{
	position: absolute;
	z-index: 999;
	top: 0;
	left: 100%;

	visibility: hidden;

	padding: 24px 24px 8px 24px;

	transition: opacity 0.3s linear;

	opacity: 0;
	color: var(--color__black);
	background: var(--color__white);
	box-shadow: 0 16px 28px rgba(225, 229, 255, 0.35);
}

.main-menu > li > .sub-menu
{
	top: 35px;
	left: -22px;

	width: 340px;
}

.main-menu > li > .sub-menu:before
{
	position: absolute;
	right: 0;
	bottom: 100%;
	left: 0;

	display: block;

	width: 100%;
	height: 12px;

	content: '';
}

.main-menu li:hover > .sub-menu
{
	visibility: visible;

	opacity: 1;
}

.main-menu .sub-menu li
{
	position: relative;

	display: inline-block;
}

.main-menu .sub-menu a
{
	font-size: 1.4rem;

	display: inline-block;

	margin-bottom: 8px;

	text-decoration: none;
	text-transform: none;

	color: var(--black);
}

.main-menu .sub-menu > li > a:hover,
.main-menu .sub-menu > li.active-item a
{
	text-decoration: underline;
}

.menu-item__description
{
	font-size: 1.2rem;
	line-height: 2rem;

	display: block;

	margin-bottom: 20px;
	padding-bottom: 12px;

	border-bottom: 1px solid var(--color__grey-light);
}

.sub-show
{
	display: none;
}

@media (max-height: 700px)
{
	.sticky.sticky_scrolling .nav-wrapper.nav-wrapper
	{
		height: calc(100vh - 80px);
		max-height: none;
	}
	.nav-wrapper__inner
	{
		display: flex;
		flex-direction: column;

		height: 100%;
	}
	.nav-wrapper__inner .nav_main
	{
		flex: 1 1 auto;
	}
}

@media (max-width: 960px) and (min-height: 701px)
{
	.nav-wrapper
	{
		max-height: 535px;
	}
}

@media (max-width: 960px)
{
	.nav-wrapper
	{
		position: absolute;
		z-index: 999;
		top: var(--header__height);
		right: 0;
		left: auto;

		display: none;
		overflow: auto;

		width: 100%;
		max-width: 288px;
		height: calc(100vh - 148px);

		background: var(--color__blue);
	}

	.nav-wrapper::-webkit-scrollbar
	{
		width: 8px;
		height: 8px;

		-webkit-appearance: none;
	}

	.nav-wrapper::-webkit-scrollbar-thumb
	{
		border: 1px solid var(--color__black);
		border-radius: 10px;
		background-color: var(--color__white);
	}

	.main-menu
	{
		padding: 24px;
	}

	.main-menu li
	{
		display: block;

		width: 100%;
	}

	.main-menu > .menu-item > a
	{
		font-weight: var(--font-weight__regular);
	}

	.main-menu a
	{
		font-size: 1.6rem;
		line-height: 4.8rem;

		display: block;

		margin: 0;
		padding: 0 8px;

		background: none;
	}

	.main-menu > li.active-item > a:before,
	.main-menu > li.active-item_post-ancestor > a:before,
	.main-menu > li.active-item_archive-ancestor > a:before,
	.main-menu > li.active-item_term-ancestor > a:before
	{
		display: none;
	}

	.main-menu > li.current_page_item::before
	{
		display: none;
	}

	.main-menu > li.menu-item-has-children
	{
		padding-right: 0;
	}

	.main-menu > li.menu-item-has-children > a
	{
		margin-bottom: 10px;

		border-bottom: 1px solid var(--color__white);
	}

	.main-menu > li.menu-item-has-children::after
	{
		display: none;
	}

	.main-menu .sub-menu
	{
		position: static;

		visibility: visible;

		padding: 0;

		opacity: 1;
		border: none;
	}

	.main-menu > li > .sub-menu:before
	{
		display: none;
	}

	.main-menu > li.menu-item-has-children > .sub-show
	{
		position: absolute;
		top: 0;
		right: -4px;

		display: flex;
		align-items: center;
		justify-content: center;

		width: 50px;
		height: 50px;
	}

	.main-menu > li.menu-item-has-children > .sub-show::after
	{
		position: absolute;
		top: 15px;
		right: 18px;

		display: block;

		width: 12px;
		height: 12px;
		padding: 3px;

		content: '';
		transition: transform var(--transition-duration__default);
		-webkit-transform: rotate(45deg);
		        transform: rotate(45deg);

		border: solid var(--color__white);
		border-width: 0 1px 1px 0;
	}

	.main-menu > li.menu-item-has-children > .sub-show:hover
	{
		text-decoration: none;
	}

	.main-menu > li.menu-item-has-children > .sub-show svg
	{
		display: block;

		width: 19px;
		height: 30px;
	}

	.main-menu > li.menu-item-has-children > .sub-show svg path
	{
		fill: var(--color__white);
	}

	.main-menu > li.menu-item-has-children > .sub-show.active
	{
		-webkit-transform: rotate(180deg);
		        transform: rotate(180deg);
	}

	.main-menu > li > .sub-menu
	{
		display: none;

		width: 100%;
		padding: 0 8px 16px;

		border: none;
		background-color: var(--color__blue);
		box-shadow: none;
	}

	.main-menu .sub-menu li
	{
		display: block;

		width: 100%;
	}

	.main-menu .sub-menu a
	{
		font-size: 1.4rem;
		line-height: 3.2rem;

		display: block;

		margin-bottom: 0;
		padding: 0;

		color: var(--color__white);
	}

	.menu-item__description
	{
		display: none;
	}

	/* NAV TOOLS & SOCIALS
	----------------------------------------- */
	.nav-wrapper__tools
	{
		padding: 0 32px 16px;
	}

	.nav-wrapper__tools a
	{
		color: var(--color__white);
	}

	.nav-wrapper__socials
	{
		padding: 21px 32px;

		border-bottom: 2px solid var(--color__blue);
		background: var(--color__white);
	}

	.nav-wrapper__socials .socials a
	{
		color: var(--color__blue);
	}
}

/* Rewrites inline styles added via JavaScript function */
@media (min-width: 961px)
{
	.nav-wrapper,
	.main-menu .sub-menu
	{
		display: flex !important;
		flex-direction: column;

		height: auto !important;
	}

	.main-menu > li
	{
		margin-right: 2.6rem;
	}

	.nav-wrapper__tools,
	.nav-wrapper__socials
	{
		display: none;
	}
	.main-menu .sub-menu a
	{
		font-weight: var(--font-weight__medium);
	}
}

@media (min-width: 1251px)
{
	.main-menu > li
	{
		margin-right: 4.2rem;
	}
}

/* TOOLS
----------------------------------------- */
a.tools__search
{
	font-size: 0;

	color: var(--color__white);
}

a.tools__search:hover,
body.search a.tools__search
{
	color: var(--color__yellow);
}

/* .tools__search .icon
{
	width: 20px;
	height: 20px;
} */

.tools__nav-btn
{
	display: none;
}

@media (max-width: 960px)
{
	a.tools__search
	{
		display: none;
	}
}

/* LANGUAGES */
.languages
{
	font-size: 1.3rem;
	line-height: 20px;

	position: relative;

	margin: 0 0 0 20px;

	text-align: center;

	color: var(--color__white);

	margin: 0 0 10px 0;
}

.lang-btn
{
	font-size: 1.3rem;
	font-weight: var(--font-weight__bold);
	line-height: 13px;

	position: relative;

	width: inherit;
	height: inherit;
	padding-right: 15px;

	text-transform: uppercase;

	color: var(--color__white);
}

.lang-btn::after
{
	position: absolute;
	top: -3px;
	right: 0;

	display: block;

	content: url('data:image/svg+xml,%3Csvg width=\'8\' height=\'4\' viewBox=\'0 0 8 4\' fill=\'currentColor\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cpath fill-rule=\'evenodd\' clip-rule=\'evenodd\' d=\'M0 0L4 4L8 0L0 0Z\' fill=\'white\'/%3E%3C/svg%3E%0A');
	transition: var(--transition-duration__default);
	transform-origin: 50% 65%;
}

.lang-btn:hover,
.lang-btn.active
{
	text-decoration: underline;

	/* color: var(--color__blue); */
}

.lang-btn.active::after
{
	-webkit-transform: rotate(180deg);
	        transform: rotate(180deg);
}

.lang-btn {
	display: none;
}

.lang-box .lang-list
{
	display: flex;
	/* position: absolute;
	z-index: 999;
	top: 30px;
	left: -5px;

	display: none;

	padding: 8px 22px 8px 7px;

	background: var(--color__white);
	box-shadow: 0 16px 28px rgba(225, 229, 255, 0.35); */
}

.lang-box ul
{
	margin: 0;
}

.lang-box .lang-item {
	display: flex;
	align-items: center;
}

.lang-box .lang-item-active a
{
	border: solid 1px var(--primary);
}

.lang-box a
{
	font-weight: var(--font-weight__bold);
	line-height: normal;

	display: block;

	padding: 0 5px;

	text-transform: uppercase;

	color: var(--color__blue);
}

.lang-box a:hover
{
	color: var(--color__blue);
}

@media (max-width: 960px)
{
	.languages
	{
		position: static;
		position: relative;

		padding: 0;
	}

	.languages .lang-btn
	{
		display: none;
	}

	.lang-btn
	{
		background: none;
	}

	.lang-list
	{
		display: flex;
	}

	.lang-list .lang-item-active
	{
		display: block;
	}

	.lang-box
	{
		position: static;

		display: block;

		padding: 8px 0;

		background: transparent;
		box-shadow: none;
	}

	/* NAVIGATION BUTTON */
	button.tools__nav-btn
	{
		font-size: 1.3rem;
		font-weight: var(--font-weight__normal);

		position: relative;

		display: block;

		width: auto;
		height: 22px;
		margin-left: 20px;
		padding-right: 32px;

		letter-spacing: 1.6px;
		text-transform: uppercase;

		color: var(--color__white);
	}

	.tools__nav-btn:hover
	{
		text-decoration: none;
	}

	.tools__nav-btn span
	{
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;

		display: block;

		width: 21px;
		height: 2px;
		margin: auto 0;

		transition: width 0.3s, background 0.3s;

		background: var(--color__white);
	}

	.tools__nav-btn.active span
	{
		background: rgba(0,0,0,0);
	}

	.tools__nav-btn:hover.active span
	{
		width: 0;

		background: rgba(0,0,0,0);
	}

	.tools__nav-btn:before,
	.tools__nav-btn:after
	{
		position: absolute;
		right: 0;

		display: block;

		width: 21px;
		height: 2px;

		content: '';
		transition: opacity var(--transition-duration__default), transform var(--transition-duration__default), top var(--transition-duration__default), bottom var(--transition-duration__default);

		background: var(--color__white);
	}

	.tools__nav-btn:before
	{
		top: 0;
	}

	.tools__nav-btn:after
	{
		bottom: 0;
	}

	.tools__nav-btn.active:before
	{
		top: 10px;

		-webkit-transform: rotate(45deg);
		        transform: rotate(45deg);
	}

	.tools__nav-btn.active:after
	{
		bottom: 10px;

		-webkit-transform: rotate(-45deg);
		        transform: rotate(-45deg);
	}

	.tools__nav-btn.active:before,
	.tools__nav-btn.active:after
	{
		background: var(--color__white);
	}
}

@media (max-width: 760px)
{
	.tools
	{
		right: 15px;
	}
}
