
/* Common styles of menus */


.dl-menuwrapper {
	width: 100%;position: relative;
	/*max-width: 300px; */
	float: left;	
	/*	-webkit-perspective: 1000px;
	perspective: 1000px;
	-webkit-perspective-origin: 50% 200%;
	perspective-origin: 50% 200%;*/ 
	margin-top:0 !important;top:0 !important;bottom:0 !important;
}
.dl-menuwrapper button.dl-trigger {
	background: none;line-height:42px;
	border: none; 
	text-transform:uppercase;
	padding-left:45px;
	color:#232121;
	overflow: hidden;
	position: relative;
	cursor: pointer; font-size: 12px;letter-spacing: 1px;font-weight: normal;
	outline: none;height:100%;
}

.dl-menuwrapper button:hover, .dl-menuwrapper button.dl-active, .dl-menuwrapper ul {background: none;}
.dl-menuwrapper ul {background: rgba(255,255,255,1);}
.dl-menuwrapper ul.dl-menu {background: rgba(255,255,255,1);margin-left:0; border-bottom: 2px solid #002e5f;box-shadow: 0 0 2px rgba(35, 33, 33, 0.15);z-index:9999;}
.dl-menuwrapper button.dl-trigger:before {
	content: '';
	position: absolute;
	width: 13px;
	height: 2px;
	background: #232121;
	top: 20px;
	left: 20px;
	box-shadow: 
		0 4px 0 #232121, 
		0 8px 0 #232121;
}
.dl-menuwrapper button.dl-close {
	background: #232121;line-height:42px;
	border: none;
	text-transform:uppercase;
	padding-left:45px;
	color:#fff;
	overflow: hidden;
	position: relative;
	cursor: pointer; font-size: 12px;letter-spacing: 1px;font-weight: normal;
	outline: none;height:100%;width: 50%;text-align: left;display:none;
}
.dl-menuwrapper button.dl-close:before {
	content: '';
	position: absolute;
	width: 12px;
	height: 12px;
	background-image: url('../img/close-white.png');background-repeat:no-repeat; background-size: 12px;
	top: 19px;
	left: 20px;
}
.dl-menuwrapper ul {
	padding: 0;margin-left:0;list-style: none; 
	/*	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;*/
}
.dl-menuwrapper li {position: relative;border-bottom: 1px solid #e9e8e7;}
.dl-menuwrapper li:last-child  {border-bottom:none;}
/* .dl-menuwrapper li.dl-subviewopen, .dl-menuwrapper li.dl-subview {border-bottom:none;} */
.dl-menuwrapper li a {
	display: block;
	position: relative;
	padding: 15px 40px;
	font-size: 12px;
	font-weight: 300;text-transform:uppercase;
	color: #232121 !important;
	outline: none; letter-spacing: 1px;text-decoration:none;
}

.no-touch .dl-menuwrapper li a:hover {background: rgba(255,248,213,0.1);text-decoration:none;}
.dl-menuwrapper ul.dl-subview ul.sub-menu li a {background: rgba(245,245,245,.96);}
.dl-menuwrapper li.dl-back > a {padding-left: 40px;background: rgba(0,0,0,0) !important;}
.dl-menuwrapper li a:hover, .dl-menuwrapper li.dl-back > a:hover,
.dl-menuwrapper li a:active, .dl-menuwrapper li.dl-back > a:active,
.dl-menuwrapper li a:focus, .dl-menuwrapper li.dl-back > a:focus
 {color: #232121 !important;background:none !important; transition:0.3s ease;-webkit-transition:0.3s ease;-moz-transition:0.3s ease;-ms-transition:0.3s ease;font-weight:bold;}
 .dl-menuwrapper ul.dl-subview ul.sub-menu li a:hover, .dl-menuwrapper ul.dl-subview ul.sub-menu li a:focus {background:rgba(245,245,245,.96) !important;}
 .dl-menuwrapper ul.dl-subview ul.sub-menu li.dl-back a:hover, .dl-menuwrapper ul.dl-subview ul.sub-menu li.dl-back a:focus {background:none !important;}
 .dl-menuwrapper li.hb-menu-img > a:hover{background:none !important;}
.dl-menuwrapper li.dl-back:after,
.dl-menuwrapper li > a:not(:only-child):after {
	position: absolute;
	top: 50%;
	content: "";width: 10px;height: 10px;margin-top: -5px;background-size: 10px;
	background-image: url('../img/right-grey.png');background-repeat:no-repeat;
}
.dl-menuwrapper li.dl-back:after {
	left: 20px;
	color: rgba(212,204,198,0.3);
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}
.dl-menuwrapper li > a:after {right: 30px;}
.dl-menuwrapper .dl-menu {
	/*margin: 16px 0 0 0;*/
	position: absolute;
	width: 100%;
	opacity: 0;
	pointer-events: none; 
	/*-webkit-transform: translateY(10px);
	transform: translateY(10px); 
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden; */
}
.dl-menuwrapper .dl-menu.dl-menu-toggle {transition: all 0.3s ease;}
.dl-menuwrapper .dl-menu.dl-menuopen {
	opacity: 1;
	pointer-events: auto; /*	
	-webkit-transform: translateY(0px);
	transform: translateY(0px);*/
}
/* Hide the inner submenus */
.dl-menuwrapper li .sub-menu {display: none;}

/* 
When a submenu is openend, we will hide all li siblings.
For that we give a class to the parent menu called "dl-subview".
We also hide the submenu link. 
The opened submenu will get the class "dl-subviewopen".
All this is done for any sub-level being entered.
*/
.dl-menuwrapper li.sf-menu-item-loggedin {display:none;}
.logged-in .dl-menuwrapper li.sf-menu-item-loggedin {display:block;}

.logged-in .dl-menuwrapper .dl-menu.dl-subview li.sf-menu-item-loggedin, .dl-menu.dl-subview li, .dl-menu.dl-subview li.dl-subviewopen > a, .dl-menu.dl-subview li.dl-subview > a {display: none;}
.dl-menu.dl-subview li.dl-subview,
.dl-menu.dl-subview li.dl-subview .sub-menu,
.dl-menu.dl-subview li.dl-subviewopen,
.dl-menu.dl-subview li.dl-subviewopen > .sub-menu,
.dl-menu.dl-subview li.dl-subviewopen > .sub-menu > li.dl-back,
.dl-menu.dl-subview li.dl-subviewopen > .sub-menu  > li,
.dl-menu.dl-subview li.dl-subviewopen > .sub-menu  .hb-submenu-full> li {display: block;}
/* Dynamically added submenu outside of the menu context */
.dl-menuwrapper > .dl-menu {
	position: absolute;
	width: 100%;
	top: 51px;
	left: 0;
	margin:0;
}
/* Animation classes for moving out and in */

.dl-menu.dl-animate-out-1 {-webkit-animation: MenuAnimOut1 0.15s ease;animation: MenuAnimOut1 0.15s ;}

@-webkit-keyframes MenuAnimOut1 {
	0% { }
	50% {}
	75% {opacity: .5;}
	100% {opacity: 0;}
}
@keyframes MenuAnimOut1 {
	0% { }
	50% {}
	75% {opacity: .5;}
	100% {opacity: 0;}
}

.dl-menu.dl-animate-in-1 {-webkit-animation: MenuAnimIn1 0.15s ease;animation: MenuAnimIn1 0.15s ease;}
@-webkit-keyframes MenuAnimIn1 {
	0% {opacity: 0;}
	20% {opacity: 0.5;}
	100% {opacity: 1;}
}
@keyframes MenuAnimIn1 {
	0% {opacity: 0;}
	20% {opacity: 0.5;}
	100% {opacity: 1;}
}

.dl-menuwrapper > .sub-menu.dl-animate-in-1 {-webkit-animation: SubMenuAnimIn1 0.15s ease;animation: SubMenuAnimIn1 0.15s ease;}
@-webkit-keyframes SubMenuAnimIn1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes SubMenuAnimIn1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
.dl-menuwrapper > .sub-menu.dl-animate-out-1 {-webkit-animation: SubMenuAnimOut1 0.15s ease;animation: SubMenuAnimOut1 0.15s ease;}
@-webkit-keyframes SubMenuAnimOut1 {
	0% {opacity: 1;}
	100% {opacity: 0;}
}
@keyframes SubMenuAnimOut1 {
	0% {opacity: 1;}
	100% {opacity: 0;}
}



/* custom menu css */
/*.hb-no-scroll {overflow: hidden;position:fixed;width:100%;height:100%;} */
.nb-main_navigation ul.menu > li.hb-menu-store, .nb-main_navigation ul.menu > li.hb-menu-lang,  .logged-in .nb-main_navigation ul.menu > li.hb-menu-logout {display:none !important;}

@media screen and (max-width: 767px){
	#mobile-header { height: 52px;padding:10px 0 !important; box-shadow: 0 0 2px rgba(35, 33, 33, 0.15);position: fixed !important;top: 0;transition: top 0.15s ease-in-out;width: 100%;}
	#mobile-header.nav-up{top: -52px;}
	#mobile-header #mobile-logo { position: absolute;top: 0;right: 0;}
	#mobile-header #mobile-logo a {max-width: 35px; margin-right: 20px; margin-top: 5px;}	
	.dl-menuwrapper li.hb-menu-lang ul li  a{ position: relative;padding-right:50px !important;}
	.dl-menuwrapper li.hb-menu-lang ul li.active a:after {background-image: url('img/tick-grey.png');background-repeat:no-repeat;top:50%;content: "";height: 14px;right:30px;margin: -7px 0 0 0;position: absolute;width: 14px;background-size:14px;}
}

/* mobile lanscape */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 640px) 
and (orientation : landscape) { 
	.dl-menuwrapper > .dl-menu {max-height: 220px; overflow-y: auto; }
}

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 640px) 
and (orientation : portrait) { 
	.dl-menuwrapper > .dl-menu {max-height: 350px; overflow-y: auto; }
}


/* custom menu css */