/* Icons (made with Icomoon.io) */

/* Menu styles */
/*.menu {
	display:none;
}*/

.menu {
	position: fixed;
	top: 0;
	right:-300px;
	width: 300px;
	height: 100vh;
	background: #f7f7f7;
	z-index:99999;
}

.menu__wrap {
	position: absolute;
	top: 90px;
	bottom: 0;
	overflow: hidden;
	width: 100%;
}

.menu__level {
	position: absolute;
	top: 0;
	left: 0;
	visibility: hidden;
	overflow: hidden;
	overflow-y: scroll;
	/*width: calc(100% + 50px);*/
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0 1px;
	list-style-type: none;
}

.menu__level--current {
	visibility: visible;
}

.menu__item {
	display: block;
	/*width: calc(100% - 50px);*/
	width: 100%;	
}

.menu__link {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	position: relative;
	display: block;
	/*padding: 1em 2.5em 1em 1.5em;*/
	text-align:center;
	color: #3e3934;
	background-color:#ececed;
	border-bottom:1px solid #f7f7f7;
	padding:25px;
	margin:0;

	-webkit-transition: color, background 0.3s linear;
	-ms-transition: color, background 0.3s linear;
	-o-transition: color, background 0.3s linear;
	-moz-transition: color, background 0.3s linear;
	transition: color, background 0.3s linear;
}

/*.menu__link[data-submenu]::after {
	content: '\e904';
	font-family: 'feather';
	position: absolute;
	right: 0;
	padding: 0.25em 1.25em;
	color: #2a2b30;
}
*/
.menu__link:hover,
.menu__link[data-submenu]:hover::after {
	color: #ad172b;
	background-color:#f7f7f7;
}
.menu__item.space .menu__link:hover,
.menu__item.space .menu__link[data-submenu]:hover::after {
	color: #3e3934;
	background-color:#ececed;
}

/*.menu__link--current::before {
	content: '\00B7';
	font-size: 1.5em;
	line-height: 0;
	position: absolute;
	top: 50%;
	left: 0.5em;
	height: 4px;
	color: #5c5edc;
}
*/
[class^='animate-'],
[class*=' animate-'] {
	visibility: visible;
}

.animate-outToRight .menu__item {
	-webkit-animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
	animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}

@-webkit-keyframes outToRight {
	to {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
}

@keyframes outToRight {
	to {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
}

.animate-outToLeft .menu__item {
	-webkit-animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
	animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}

@-webkit-keyframes outToLeft {
	to {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
}

@keyframes outToLeft {
	to {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
}

.animate-inFromLeft .menu__item {
	-webkit-animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
	animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}

@-webkit-keyframes inFromLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes inFromLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.animate-inFromRight .menu__item {
	-webkit-animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
	animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}

@-webkit-keyframes inFromRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes inFromRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.menu__breadcrumbs {
	line-height: 1;
	position: relative;
	padding: 1px 0;
	margin:0;
	display:inline-block;
	display:table;
	width:100%;
}

.menu__breadcrumbs a {
	font-size: 12px;
	font-weight: bold;
	display:inline-block;
	cursor: pointer;
	vertical-align: middle;
	text-transform: uppercase;
	color: #3e3934;
	margin:0;
	padding:0 10px;
	padding-top:68px;
	width:auto;
	max-width:30%;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.menu__breadcrumbs a:last-child {
/*	pointer-events: none;
*/}
.menu__breadcrumbs a:first-child {
	width:30px;
	padding-left:9px;
}

.menu__breadcrumbs a:hover {
	color: #ad172b;
}

/*.menu__breadcrumbs a:not(:last-child)::after {
	content: '\e902';
	font-family: 'feather';
	display: inline-block;
	padding: 0 0.5em;
	color: #33353e;
}
*/
.menu__breadcrumbs a:not(:last-child):hover::after {
	color: #33353e;
}

.menu__back {
	font-size: 1.05em;
	position: absolute;
	z-index: 100;
	top: 0;
	right: 2.25em;
	margin: 0;
	padding: 1.365em 0.65em 0 0;
	cursor: pointer;
	color: #2a2b30;
	border: none;
	background: none;
}

.menu__back--hidden {
	pointer-events: none;
	opacity: 0;
}

.menu__back:hover,
.menu__back:focus {
	color: #fff;
	outline: none;
}

/* Open and close buttons */
.action {
	position: absolute;
	display: block;
	margin: 0;
	padding: 0;
	cursor: pointer;
	border: none;
	background: none;
}

.action:focus {	outline: none;}

.action--open, .action--close {
	display: none;
		background:url(../../imgs/elem/logo_pq.png);
		background-size:48px 48px;
		width:48px;
		height:48px;
		right:50px; 
		top:15px; 
		position:fixed !important;
		z-index:999999!important;
}

.action--open:hover, .action--close:hover {
		background:url(../../imgs/elem/logo_pq_.png);
		background-size:48px 48px;
}
@media screen and (min-width: 951px) {
	.action--open {		display: none !important;	}
	.action--close {		display: none !important;	}
}
@media screen and (max-width: 950px) {
	.action--open {		display: block;	}
	/*.menu {
		display:block;
		z-index:99999;
		top: 0;
		right: 0px;
		height: 100vh;
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
		-webkit-transition: -webkit-transform 0.3s;
		transition: transform 0.3s;
	}
	.menu--open {
		-webkit-transform: translate3d(calc(100% - 300px), 0, 0);
		-moz-transform: translate3d(calc(100% - 300px), 0, 0);
		transform: translate3d(calc(100% - 300px), 0, 0);
	}*/
	
	.menu--open {
		right:0;
	}
	
}
@media only screen and (max-width: 550px) {
	.menu__breadcrumbs a {	font-size: 12px; 	}
	.action--close, .action--open, .action--open:hover, .action--close:hover {	width:40px; height:40px; right:20px; top:11px; background-size:40px 40px;	}
	.menu {		width: 100%;	 right:-100%;}
	.menu--open {
		right:0;
	}
	/*.menu--open {
		-webkit-transform: translate3d(0, 0, 0);
		-moz-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}*/
}