.topBtn, .respNav, .menuBtn {
	display: none;
}

.topNav {
	flex: auto;
}

.topNav .section {
	position: static;
	padding-left: 0;
	padding-right: 0;
}

.topNav ul {
	margin: 0;
	padding: 0;
}

.topNavLvl1 {
	margin: 0;
	padding: 0;
	display: flex;
}

.topNavLvl1__item {
	float: left;
	flex: auto;
	height: 82px;
	display: flex;
}

.topNavLvl1__link {
	padding: 0 12px;
	width: 100%;
	position: relative;
	line-height: 1.2;
	color: white;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 1.25em;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 8px;
	transition-duration: .15s;
	transition-timing-function: ease-out;
}

.topNavLvl1__link:hover, .topNavLvl1__item:hover .topNavLvl1__link {
	color: #000;
	text-decoration: none;
	background: #fff;
}

.topNavLvl1__item:hover .submenu {
	opacity: 1;
	visibility: visible;
}

.topNavLvl1__item.subex:hover .topNavLvl1__link:after {
	border-top-color: #acacac;
}

.topNavLvl1__item.subex .topNavLvl1__link:after {
	content: " ";
	display: block;
	width: 0;
	height: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 9px 4px 0 4px;
	border-color: #fff transparent transparent transparent;
	transition: all 0.15s ease-out;
}


/* submenu */

.submenu {
	position: absolute;
	background: white;
	left: 0;
	top: 92px;
	z-index: 100;
	width: 100%;
	box-shadow: 0 20px 20px rgba(0, 0, 0, .05);
	padding: clamp(4px, 4vw, 24px);
	opacity: 0;
	transition: opacity 0.15s ease-out;
	visibility: hidden;
}

.topNavLvl2 {
	display: flex;
	flex-flow: row wrap;
	margin: 0 -10px;
}

.topNavLvl2__item {
	width: 20%;
	padding: 10px;
}

.topNavLvl2__link {
	color: #000;
	font-weight: 700;
	padding: 3px 0;
	text-transform: uppercase;
	display: block;
	text-decoration: none;
	font-size: 1rem;
}

.topNavLvl3__link {
	color: #000;
	font-size: 1em;
	text-transform: uppercase;
	display: block;
	text-decoration: none;
}

.topNavLvl3__link:hover {
	text-decoration: underline;
}

.topNavLvl2__img {
	display: block;
	margin-bottom: 10px;
}

.topNavLvl2__img img {
	width: 100%;
	max-width: 160px;
	height: auto;
	display: block;
}


/*simple menu*/

.subex--simple {
	position: relative;
}

.subex--simple .topNavLvl2 {
	display: block;
	padding: 0;
}

.subex--simple .topNavLvl2__link {
	text-transform: none;
	color: var(--textColor);
	font-weight: var(--fwN);
	font-size: .9em;
}

.subex--simple .topNavLvl2__item {
	width: 100%;
	padding: 0;
}

.subex--simple .submenu {
	min-width: 240px;
}


.upperBtn {
	cursor: pointer;
	display: inline-block;
	line-height: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	text-align: center;
	font-size: 18px;
	text-decoration: none;
	font-size: .9em;
	border: 1px solid var(--bdrColor);
	border-width: 0 1px 0 0;
	padding: 0 10px;
}

.upperBtn.active {
	background: #f7f7f7
}

.upperBtn i {
	min-width: 1.3em;
	display: inline-block;
	text-align: right;
}

.upperBtn--user {
	color: var(--primColor);
}

.upperBtn--user i {
	text-align: left;
}

.upperDialogs {
	display: flex;
}

.upperDialogs .dialog {
	max-width: 100%;
	width: 100%;
	min-width: 100%;
}

.upperBtn--lang:hover {
	text-decoration: none;
}

.flag {
	display: block;
	border: 1px solid var(--bdrColor);
	max-width: 18px;
	height: auto;
	margin: 0 auto;
}

.dialogBox {
	position: relative;
}

.dialog {
	position: absolute;
	display: none;
	top: 36px;
	right: 0;
	width: 100%;
	z-index: 99;
	overflow: visible;
	padding-top: 6px;
	min-width: 240px;
}

.dialogIn {
	background: white;
	border: 1px solid #fefefe;
	box-shadow: 0 0 20px rgba(0, 0, 0, .12);
}

.dialogMenu {
	margin: 0;
	padding: 0;
}

.dialogMenu__item + .dialogMenu__item {
	border-top: 1px solid #fefefe;
}

.dialogMenu__item {
	margin: 0;
	padding: 0;
	display: block;
	float: none;
}

.dialogMenu__link i {
	min-width: 1.2em;
	display: inline-block;
	float: right;
	line-height: 1em;
	font-size: 14px;
	text-align: center;
	min-width: 2em;
	opacity: .5;
	margin-right: -3px;
}

.dialogMenu__link .num {
	margin: -3px 0 -3px 3px;
	background-color: white;
}

.dialogMenu__link {
	display: block;
	text-decoration: none;
	padding: 10px 15px;
	text-align: left;
	color: var(--textColor);
	line-height: 1em;
}

.dialogMenu__link:hover {
	text-decoration: none;
	color: var(--primColor);
}

@media (max-width: 960px) {
	/*MENU IKONA*/
	.menuBtn {
		position: fixed;
		height: 50px;
		width: auto;
		padding: 0 15px;
		display: flex;
		align-items: center;
		right: 0;
		top: 0;
		line-height: 14px;
		color: #fff;
		font-size: 14px;
		text-transform: uppercase;
		cursor: pointer;
		z-index: 200;
		transition: color .2s ease-out;
		transition-delay: .4s;
	}
	.menuBtn em, .menuBtn span:after, .menuBtn span:before {
		background: #fff;
	}
	.menuBtn:after {
		content: 'MENU';
		padding-left: 10px;
	}
	.menuBtn span {
		display: inline-block;
		vertical-align: middle;
		width: 20px;
		margin: 0 auto;
		position: relative;
		height: 16px;
		overflow: hidden;
	}
	.menuBtn em {
		display: block;
		height: 2px;
		margin: 7px auto 0 auto;
		width: 20px;
		transition: width .2s, background-color .2s;
	}
	.menuBtn span:after, .menuBtn span:before {
		display: block;
		height: 2px;
		content: " ";
		width: 100%;
		position: absolute;
		left: 0;
		top: 0;
		transition: all .2s;
		transition-delay: .2s;
		transform-origin: 50% 50%;
	}
	.menuBtn span:before {
		top: auto;
		bottom: 0;
	}
	/* vyjizdeci menu */
	.respNav {
		background: white;
		overflow: hidden;
		position: fixed;
		z-index: 150;
		right: 0;
		top: 0;
		right: 0;
		bottom: 0;
		width: 275px;
		display: block;
		transform: translateX(105%);
		transition: transform .25s ease-out;
		padding-top: 49px;
	}
	.respBoxTop {
		height: 50px;
		position: absolute;
		padding: 9px;
		border-left: 1px solid #efefef;
		background-color: white;
		position: absolute;
		z-index: 100;
		left: 0;
		top: 0;
		right: 0;
		display: flex;
		border-bottom: 1px solid #efefef;
	}
	.respNavIn {
		height: 100%;
	}
	.respNavBox {
		height: 100%;
		overflow-x: hidden;
		overflow-y: auto;
	}
	.menuLevel {
		height: 100%;
		max-height: 100%;
		position: fixed;
		top: 0;
		padding-top: 50px;
		background-color: white;
		left: 0;
		margin: 0;
		left: auto;
		width: 275px;
		overflow-x: hidden;
		overflow-y: auto;
		transform: translateX(100%);
		transition: transform .15s;
		z-index: 5;
	}
	.respNavBox ul a {
		display: block;
		text-decoration: none;
		color: #000;
		text-transform: uppercase;
		padding: 6px 20px;
		font-weight: 700;
	}
	.respNavBox ul a:hover {
		color: var(--primColor);
		text-decoration: none;
	}
	.respNavBox .subex .respNavItem {
		position: relative;
		padding-right: 40px;
	}
	.respNavBox ul {
		padding: 0;
		margin: 0;
		border-bottom: 1px solid #efefef;
		background: white;
		left: 0;
		position: relative;
		transition: left .15s;
	}
	.respNavBox li {
		border: 1px solid #efefef;
		border-width: 1px 0 0 0;
	}
	.respNavBox .active > .menuLevel {
		transform: translateX(0);
	}
	.submenuLock > .menuLevel > ul {
		height: 0;
		overflow: hidden;
	}
	.nextLevel {
		position: absolute;
		right: 0;
		top: 0;
		cursor: pointer;
		height: 100%;
		width: 40px;
		display: flex;
		text-align: center;
		align-items: center;
		justify-content: center;
		border: 1px solid #efefef;
		border-width: 0 0 0 1px;
		background: rgba(0, 0, 0, 0.05);
	}
	.nextLevel:before {
		content: "\f178";
		font: normal normal normal 14px/1 FontAwesome;
		font-weight: 400;
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
		display: inline-block;
		font-style: normal;
		font-variant: normal;
		text-rendering: auto;
		line-height: 1;
	}
	.goBack {
		background: rgba(0, 0, 0, 0.05);
	}
	.goBack .nextLevel:before {
		transform: rotate(180deg);
	}
	.respBoxTop .dialog {
		top: 35px;
	}
	.respBoxTop .upperBtn {
		border-width: 1px;
	}
	#dark {
		position: fixed;
		z-index: -100;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, .4);
		cursor: pointer;
		visibility: hidden;
		opacity: 0;
		transition: opacity .5s ease-out;
	}
	/* akce vysunuti menu */
	.menuOn {
		height: 100vh;
		overflow: hidden;
	}
	.menuOn .menuBtn em, .menuOn .menuBtn span:after, .menuOn .menuBtn span:before {
		background: #000;
	}
	.menuOn .menuBtn {
		background: transparent;
		border-color: transparent;
		color: #000;
	}
	.menuOn .menuBtn em {
		width: 0;
	}
	.menuOn .menuBtn span:after {
		top: 7px;
		transform: rotate(45deg);
	}
	.menuOn .menuBtn span:before {
		top: auto;
		bottom: 7px;
		transform: rotate(-45deg);
	}
	.menuOn #dark {
		z-index: 101;
		display: block;
		visibility: visible;
		opacity: 1;
	}
	.menuOn .respNav {
		transform: translateX(0);
		box-shadow: 0 0 30px rgba(0, 0, 0, .25);
	}
}