
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
nav#desktop {
   height: 100vh;
   position: fixed;
   z-index: 1040;
}
nav#desktop > ul {
   position: absolute;
   z-index: 91
}
nav#desktop > ul li {
   list-style: none;
   height: 30vh;
   position: relative;
}
nav#desktop > ul li div {
   height: 100%;
   position: absolute;
   bottom: 0;
   top: 50%;
   transform: translateY(-50%);
}
nav#desktop > ul li div img {
   position: absolute;
}
nav#desktop #menu {
   position: fixed;
   background-size: auto 50%;
   background-color: #f0f0f0;
   background-image: url('../../front/img/menu/bg_daun_side_menu_navigation.png');
   background-position: right bottom;
   background-repeat: no-repeat;
   /*display: none;*/
   height: 100vh;
   min-width: 45%;
   /*-webkit-transition: .3s all cubic-bezier(.58,.2,.39,.96);*/
   /*transition: .3s all cubic-bezier(.58,.2,.39,.96);*/
   transform: translateX(-100%);
   -webkit-overflow-scrolling: scrolling;
   -webkit-overflow-scrolling: touch;
   transition: transform .5s;
   padding-left: 145px;
   padding-right: 50px;
   padding-top: 30px;
   padding-bottom: 30px;
   overflow-y: auto;
}
.language a { text-decoration: none; color: #534741; }
.language .pull-left { margin-right: 10px; }
#menu .padding-bottom-menu { padding-bottom: 20px; }
#menu .padding-top-menu { padding-top: 20px; }
nav#desktop #menu .logo-menu { width: 458px; margin-top: 20px; margin-left: 20px; }
nav#desktop .open-menu { transform: translateX(0%) !important; }
nav#desktop #menu > div ul, nav#desktop #menu > ul li {
   padding: 0;
   margin: 0;
   list-style: none;
   font-size: 20px;
}
nav#desktop #menu > div ul > li {
   /*padding-top: 5px;*/
}
nav#desktop #menu ul li a {
   color: #534741;
   font-size: 18px;
}
nav#desktop #menu > div > ul > li::marker {
   color: transparent;
   letter-spacing: 1px;
}
nav#desktop #menu > div ul > li:hover::before,
nav#desktop #menu > div ul > li.active::before {
   color: white;
}
nav#desktop #menu > div ul > li > ul {
   display: none;
   margin-left: 60px;
}
nav#desktop #menu > div ul > li > ul > li {
   list-style: none;
   padding: 0;
   margin: 0;
}
nav#desktop #menu > div ul > li > ul > li a {
   color: #ffffff;
   font-size: 16px;
}
nav#desktop ul li#menu-language:hover::before, nav#desktop ul li#menu-language.active::before { color: transparent !important; }
nav#desktop #menu-language button { color: #ffffff; font-size: 20px; }

.main-menu .main-menu-container {
   border-bottom: 1px solid #d4d4d4;
}

.nav-link {
   color: #534741;
   border-bottom: 1px solid #d4d4d4;
}
.main-menu > .nav-item > .nav-link {
   background-color: #d3d3d3;
   color: #2e3287 !important;
}
.main-menu > .nav-item > .nav-link.collapsed {
   background-color: transparent;
   color: #534741 !important;
}

.sub-item { margin-left: 30px; }
.sub-item .nav-link { border-bottom: 0px solid #d4d4d4; font-size: 14px !important; padding: 5px !important; }
.sub-item .nav-item:first-child { padding-top: 20px !important; }
.sub-item .nav-item:last-child { padding-bottom: 20px !important; }
.nav-item{
    position:  relative;
}
.nav-link[data-toggle].collapsed:after {
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    content: "\f078"; 
    color:  #444444;
    position: absolute;
    right: 10px;
}
.nav-link[data-toggle]:not(.collapsed):after {
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    content: "\f077"; 
    color:  #2e3287;
    position: absolute;
    right: 10px;
}

#menu .download-app a { color: #2e3287 !important; font-size: 18px; border-bottom: 1px solid #2e3287; font-weight: 600; text-decoration: none; }
#menu .download-app a * { text-decoration: none; }

/* Mobile Nav body classes */
body.mobile-nav-active {
   overflow: hidden;
}

body.mobile-nav-active #mobile-nav {
   left: 0;
   padding: 20px;
}

body.mobile-nav-active #mobile-nav-toggle {
   color: #fff;
}

.hamburg { 
   position: fixed; 
   background-color: #ffffff; 
   height: 100vh; 
   z-index: 1040; 
   padding: 0px 15px;
   width: 95px;
   box-shadow: 7px 0px 6px -5px rgba(0,0,0,0.05);
   -webkit-box-shadow: 7px 0px 6px -5px rgba(0,0,0,0.05);
   -moz-box-shadow: 7px 0px 6px -5px rgba(0,0,0,0.05);
}
.menu-link-wrapper {
   width: 65px;
   height: 45px;
   cursor: pointer;
   top: 50%;
   transform: translateY(-50%);
   position: relative;
}

.menu-link {
   width: 100%;
   height: 100%;
} 

.lines {
   -moz-transition: background 0.2s ease 0.4s;
   -o-transition: background 0.2s ease 0.4s;
   -webkit-transition: background 0.2s ease;
   -webkit-transition-delay: 0.4s;
   transition: background 0.2s ease 0.4s;
   display: block;
   width: 100%;
   height: 2px;
   background: #aaa;
   -moz-transform-origin: 50% 50%;
   -ms-transform-origin: 50% 50%;
   -webkit-transform-origin: 50% 50%;
   transform-origin: 50% 50%;
   width: 60%;
   margin: 0 20%;
   position: relative;
   background: #2C3685;
   background: -webkit-linear-gradient(to right, #2C3685 0%, #039652 100%);
   background: -moz-linear-gradient(to right, #2C3685 0%, #039652 100%);
   background: linear-gradient(to right, #2C3685 0%, #039652 100%);
   top: 22px;
}

.lines:before,
.lines:after {
   display: block;
   width: 100%;
   height: 2px;
   background: #aaa;
   -moz-transform-origin: 50% 50%;
   -ms-transform-origin: 50% 50%;
   -webkit-transform-origin: 50% 50%;
   transform-origin: 50% 50%;
   position: absolute;
   left: 0;
   content: '';
   background: #2C3685;
   background: -webkit-linear-gradient(to right, #2C3685 0%, #039652 100%);
   background: -moz-linear-gradient(to right, #2C3685 0%, #039652 100%);
   background: linear-gradient(to right, #2C3685 0%, #039652 100%);
   -moz-transition: -moz-transform 0.2s ease 0s, width 0.2s ease 0.2s, top 0.2s ease 0.4s;
   -o-transition: -o-transform 0.2s ease 0s, width 0.2s ease 0.2s, top 0.2s ease 0.4s;
   -webkit-transition: -webkit-transform 0.2s ease, width 0.2s ease, top 0.2s ease;
   -webkit-transition-delay: 0s, 0.2s, 0.4s;
   transition: transform 0.2s ease 0s, width 0.2s ease 0.2s, top 0.2s ease 0.4s;
   -moz-transform-origin: 0 50%;
   -ms-transform-origin: 0 50%;
   -webkit-transform-origin: 0 50%;
   transform-origin: 0 50%;
}

.lines:before {
   top: -10px;
}

.lines:after {
   top: 10px;
}

.menu-trigger-open .lines {
   -moz-transition: background 0.2s ease 0s;
   -o-transition: background 0.2s ease 0s;
   -webkit-transition: background 0.2s ease;
   -webkit-transition-delay: 0s;
   transition: background 0.2s ease 0s;
}

.menu-trigger-open .lines:before,
.menu-trigger-open .lines:after {
   -moz-transition: top 0.2s ease 0s, width 0.2s ease 0.2s, -moz-transform 0.2s ease 0.4s;
   -o-transition: top 0.2s ease 0s, width 0.2s ease 0.2s, -o-transform 0.2s ease 0.4s;
   -webkit-transition: top 0.2s ease, width 0.2s ease, -webkit-transform 0.2s ease;
   -webkit-transition-delay: 0s, 0.2s, 0.4s;
   transition: top 0.2s ease 0s, width 0.2s ease 0.2s, transform 0.2s ease 0.4s;
   top: 0;
   width: 50%;
}

.menu-trigger-open .lines:before {
   -moz-transform: rotate3d(0, 0, 1, 45deg);
   -webkit-transform: rotate3d(0, 0, 1, 45deg);
   transform: rotate3d(0, 0, 1, 45deg);
}

.menu-trigger-open .lines:after {
   -moz-transform: rotate3d(0, 0, 1, -45deg);
   -webkit-transform: rotate3d(0, 0, 1, -45deg);
   transform: rotate3d(0, 0, 1, -45deg);
}

.lang:hover,
.lang.active,
.lang:focus { color: #2e3287 !important; }

.side-bar > .nav-item > .nav-link { background-color: transparent !important; }
.side-bar > .nav-item .active span { color: #2e3287 !important; }