/* Menu */
.menu-wrap {
	position: fixed;
	overflow-y:auto;
	z-index: 1001;
	right:0;
	top:0;
	margin-top:90px;
	width: calc(44%);
	height: calc(100% - 90px);
	background-color:#fff;
	padding: 0px 30px; 
	-webkit-transform: translate3d(100%,0,0);
	transform: translate3d(100%,0,0);
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}

.menu-wrap.hidemenu { visibility:hidden; }
.menu-wrap.showmenu  { visibility: visible !important; }
.navi {	height: 100%; padding-left:0px !important;  }



/* Shown menu */
.show-menu .menu-wrap {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	-webkit-transition: -webkit-transform 0.8s;
	transition: transform 0.8s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}

.show-menu .icon-list,
.show-menu .icon-list a {
	-webkit-transform: none !important;
	transform: none !important;
}



/** HAMBURGER **/
#wrap-open-button {
	position: fixed;
	z-index: 100;
	top:22px;
	right:30px;
	padding: 0;
	/*width: 250px;*/
	height: auto;
	border:2px solid #E8122E; 
	cursor:pointer !important; 
}


#open-button {
	position: relative;
	padding: 0;
	width: 1.92em;
	height: 1.6em;
	font-size: 1.5em;
	color: transparent;
	background: transparent;
	border:none !important;
	float:right;
}

#mtitle {
	float:left; 
	margin:10px 14px 0px 10px; 
	color: #E8122E !important; 
	font-weight:500;
}


#wrap-hamburger {
	width:auto;
	max-width:auto;
	height:auto; 
	float:left;
}

#openmenu {
	display:block !important;
	cursor:pointer; 
	height:auto; 
}

#hamburger img {
	width:100%;
	height:auto; 
}


.hamburger {
  padding: 6px 6px 0px 10px;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
 outline:none !important;
/*margin-left:-60px; */
}
  .hamburger:hover {
   /* opacity: 0.7;*/
}

.hamburger-box {
  width: 30px;
  height: 26px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }

  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 30px;
    height: 2px;
    background-color: #E8122E !important;
    border-radius: 0px;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -10px; }
  .hamburger-inner::after {
    bottom: -10px; }


.hamburger--spin .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin .hamburger-inner::before {
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin .hamburger-inner::after {
    transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin.is-active .hamburger-inner {
  transform: rotate(225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
  .hamburger--spin.is-active .hamburger-inner::after {
    bottom: 0;
    transform: rotate(-90deg);
    transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); 
}


.show-menu #open-button {
	border:transparent !important; 
	background-color:transparent; 
}

.show-menu .hamburger-inner, .show-menu  .hamburger-inner::before, .show-menu  .hamburger-inner::after {
    background-color: #E8122E!important;
 }





/*******************************************************************************/
/* NAVIGTION   Desktop */  
/*******************************************************************************/

.slicknav_menu { display: none; }
#navigation { 
	position: absolute; 
	margin-top:40px;  
	margin-left:0px;  
	background-color:none; 
	z-index:1500; 
	overflow:visible; 
	height:auto;
	width:100%;
}



#menu { padding-left:0px !important; }
#menu ul {margin:0px;padding:0px;list-style-type:none !important;}
#menu li { list-style-type:none;     }
#menu li a { /*padding:26px 0px 26px 0px;*/ }
#menu li[class*="n"] > a { font-size:28px;    }
#menu li.n0 > a { border-bottom:2px solid #E8122E; width:100% !important; display:block; margin-bottom:12px; padding-bottom:5px }



#menu a, #menu a:visited {	text-decoration:none; color:#111; }
#menu a:hover { color:#E8122E;  }
#menu a.active, #menu li.active > a, #menu li ul.submenu li a.active { color:#E8122E !important;  } 

#menu li.n0 { margin-bottom:80px;  }
#menu .submenu li a { font-size:20px; }

#menu .submenu2 li {display: none;}

.hidemenu #navigation { display:none; }
.showmenu #navigation {	display:block;  }
#menu .col-6:first-child li:first-child { display:none; }
#menu .col-6:first-child li .submenu li:first-child { display:block !important; }
#menu .col-6:first-child li .submenu2 li:first-child { display:none !important; }


/* end nav */
/* ############################################################################################*/





/*******************************************************************************/
/* MEDIA QUERIES & MOBILE SETTINGS  */  
/*******************************************************************************/

@media screen and (max-height: 1000px) { 
	#menu li[class*="n"] > a { font-size:26px; }
	#menu li.n0 { margin-bottom:40px;  }
}

@media screen and (max-height: 780px) { 
	#menu li[class*="n"] > a { font-size:24px; }
	#menu li.n0 { margin-bottom:30px;  }
}


@media screen and (max-width: 1650px) { 
	.menu-wrap {
		width: 50%;
	}
}


@media screen and (max-width: 1350px) { 
	.menu-wrap {
		width: 60%;
	}
}


@media screen and (max-width: 1150px) { 
	.menu-wrap {
		width: 70%;
	}
}

@media screen and (max-width: 1000px) { 
	.menu-wrap {
		width: 85%;
	}

}


@media screen and (max-width: 680px) { 
	.menu-wrap {width: 100%; }
	
	#navigation, .menu-wrap, #wrap-open-button { display:none; height:0px; }
	.slicknav_menu { display:block !important; }
	.js .navbar-collapse {  display:none !important; }
	.js .menu {  display:block; z-index:50; }
	
	#menu .submenu2 li {display: block;}
	
}



/* end */
/*******************************************************************************/