/*
 Title:          Divi Child Theme Mobile Menu
 Author:         Frank Otto
 Author URI:     http://singularica.com
 Version:        1.0.0
/* ------------------------------------------------------- */

/************ Divi Mobile Menu ************/

/* fixed header */

@media (max-width: 980px) {
   .et_non_fixed_nav.et_transparent_nav #main-header,
   .et_non_fixed_nav.et_transparent_nav #top-header,
   .et_fixed_nav #main-header,
   .et_fixed_nav #top-header {
      position: fixed;
   }
   .et_menu_container {
      width: 90%;
   }
   #top-header.et-fixed-header {
      display: none;
   }
   .et-fixed-header .et_mobile_menu {
      /* top: 45px; */
   }
   #et-info a {
      display: none;
   }
   #et-info #et-info-phone a,
   #et-info .et-social-icons a {
      display: inline !important;
   }
   #et-secondary-menu {
      display: block !important;
   }
   .et-fixed-header .logo_container img,
   .et-fixed-header .logo_container {
      /* height: 30px !important; */
   }
   #main-header.et-fixed-header {
      top: 0px !important;
      /* padding: 10px 0px 10px 0px; */
   }
   .et-fixed-header #et_mobile_nav_menu {
      /* margin-top: 5px !important; */
   }
   #main-header {
      /* top: 38px !important; */
      background-color: rgba(255, 255, 255, 0.86);
   }
   /* jumping iphone fix, 2adjust per site */
}

@media (max-width: 767px) {
   #et-info a {
      display: none;
   }
   #et-info #et-info-phone a,
   #et-info .et-social-icons a {
      display: inline-block !important;
   }
   #et-info {
      display: none;
   }
   #et-secondary-menu {
      display: block !important;
   }
}

/* Menu Nesting Menu */

/* when mobile menu is open, change hamburger icon to x icon */

#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before {
   content: '\4d';
   z-index: 9999;
}

/* - mobile menu toggling elements, injected via jQuery -
make menu list item be relative, to be able to position toggle within this item */

#main-header #mobile_menu.et_mobile_menu .menu-item-has-children {
   position: relative;
}

/* the new toggle element, which is added via jQuery */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle {
   position: absolute;
   z-index: 1;
   width: 36px;
   height: 36px;
   line-height: 36px;
   border-radius: 50%;
   /* right: 15%; */
   /*wanne toggler right ?*/
   left: 10px;
   cursor: pointer;
   text-align: center;
   box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.1);
   margin-top: 5px;
}

/* the new toggle element when popped */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle.popped {
   /* background-color: rgba(255, 255, 255, 0.2); */
}

#main-header #mobile_menu.et_mobile_menu .sub-menu .sub-menu-toggle.popped {
   /* background-color: rgba(255, 255, 255, 0.2); */
}

/* toggle icon */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle::before {
   font-family: 'ETmodules' !important;
   font-weight: normal;
   font-style: normal;
   font-variant: normal;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   line-height: 36px;
   font-size: 24px;
   text-transform: none;
   speak: none;
   content: '\35';
}

/* toggle icon when triggered */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle.popped::before {
   content: '\33';
}

/* makes  sub menu icon be right arrow instead of down arrow */

#top-menu .menu-item-has-children > a:first-child::after,
#et-secondary-nav .menu-item-has-children > a:first-child::after {
   content: '\35';
}

/* hide sub menus by default */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle ~ ul.sub-menu {
   display: none !important;
   /* padding-left: 0; */
}

/* show sub menu when triggered via jQuery toggle, and add slight bg color */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle.popped ~ ul.sub-menu {
   display: block !important;
}

/* remove sub menu list item left padding, since padding will be on anchors */

#main-header #mobile_menu.et_mobile_menu li li {
   /* padding-left: 0; */
}

/* adjust mobile menu anchors side paddings */

#main-header #mobile_menu.et_mobile_menu li a {
   padding-left: 60px;
   padding-right: 30px;
   margin-right: 20%;
}

#main-header #mobile_menu.et_mobile_menu li ul.sub-menu {
   /* indent for toggler */
   padding-left: 30px;
}

#main-header #mobile_menu.et_mobile_menu li ul.sub-menu a {
   padding-left: 45px;
}

#main-header #mobile_menu.et_mobile_menu li ul.sub-menu ul.sub-menu a {
   padding-left: 15px;
}

.sub-menu-toggle.popped + a {
   font-weight: 700 !important;
}

/* indent sub sub menus further */

#main-header #mobile_menu.et_mobile_menu .menu-item-has-children > a {
   background-color: transparent;
   font-weight: inherit;
}

/* make the current page's mobile menu link be different */

#main-header #mobile_menu.et_mobile_menu li.current-menu-item > a {
   font-weight: bolder;
}

/****** Code Style: Menu Full-screen ******/

/* Font Awesome */

.fa {
   margin: 10px;
}

.et_mobile_menu {
   top: 80px;
   left: 0;
   position: fixed;
   z-index: 9998;
   overflow: scroll !important;
   padding: 30% 0;
   height: 100%;
   border-top: 0px;
}

@media (orientation: landscape) {
   .et_mobile_menu {
      padding: 20px 0;
   }
}

.et_mobile_menu li a {
   text-transform: uppercase;
   padding: 10px 0;
}

.mobile_nav ul#mobile_menu .current_page_item > a {
   /* background-color: rgba(255, 255, 255, 0.05);
    border-radius: 0px 13px 13px 0px; */
}

.mobile_nav ul#mobile_menu li ul li a {
   margin: auto;
}

.et_mobile_menu li a:hover {
   color: #000000;
   -webkit-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

/****************** mobile menu end ********/
