/* --------------- Primary Menu ------------ */
.menu-item {

}

.region-primary-menu .menu-item,
.mobile-header .menu-item {
  float: none;
  list-style: none;
  margin: 0;
  padding: 0;
  height: auto;
  width: 100%;
}
.region-primary-menu .menu a {
  float: none;
  display: block;
  text-decoration: none;
  border-radius: 0px;
  padding: 0.9em 0 0.9em 10px; /* LTR */
}




.mobile-header .menu a {
  display: block;
  padding: 0.35rem 1.25rem 0.35rem 1rem;
  border-radius: 0;
}
.mobile-header .menu-item:first-child a {
  margin-top: 0.35rem;
}
.mobile-header .menu-item:last-child a {
  margin-bottom: 0.35rem;
}
.region-primary-menu .menu-item a.is-active {
  border-bottom: none;
}

/* ---------- Primary Menu Toggle ----------- */
/* Hide the toggle by default. */
.menu-toggle,
.menu-toggle-target {
  display: none;
}
/* Unhide it for the primary menu and mobile header menus. */
.region-primary-menu .menu-toggle-target,
.mobile-header .menu-toggle-target {
  display: inherit;
  position: fixed;
  top: 0;
}
.region-primary-menu .menu-toggle,
.mobile-header .menu-toggle-target {
  display: none;
}
.region-primary-menu .menu-toggle,
.mobile-header .menu-toggle  {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-decoration: none;
}
.region-primary-menu .menu-toggle {
  padding: 0.9em 10px 0.9em 10px;
}
.mobile-header .menu-toggle {
  padding: 0.5rem 1rem;
  border-radius: 0;
}
.region-primary-menu .menu-toggle:after,
nav.menu--main .menu-toggle:after {
  font-family: 'cela-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 1.25rem;
  display: inline-block;
  vertical-align: middle;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e90a";
  font-size: 1.25rem;
}
.region-primary-menu .menu-toggle-target-show:target ~ .menu-toggle,
.region-primary-menu .menu-toggle--hide,
.mobile-header .menu-toggle-target-show:target ~ .menu-toggle,
.mobile-header .menu-toggle--hide {
  display: none;
}
.region-primary-menu .menu-toggle-target-show:target ~ .menu-toggle--hide,
.mobile-header .menu-toggle-target-show:target ~ .menu-toggle--hide {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

@media all and (max-width: 861px) {
  .region-primary-menu ul.menu,
  .mobile-header ul.menu {
    display: none;
  }
  .region-primary-menu .menu-toggle-target-show:target ~ ul.menu,
  .mobile-header .menu-toggle-target-show:target ~ ul.menu {
    display: block;
  }
}

/**
 * Media queries for primary menu.
 */

@media all and (min-width: 861px) {
  .region-primary-menu .block-menu .menu {
    margin: 0;
    padding: 0 15px;
  }
  .region-primary-menu .menu-item,
  .region-primary-menu .menu-item {
    float: left; /* LTR */
    list-style: none;
    padding: 0 1px;
    margin: 0 1px;
    width: auto;
    height: auto;
    overflow: visible;
    display: inline-block;
  }
  .region-primary-menu .menu a {
    float: left; /* LTR */
    padding: 0.7em 0.8em;
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  .region-primary-menu .menu a:hover {
    border-bottom: none;
  }
  .region-primary-menu .menu-toggle {
    display: none;
  }
}

/**
 * Ensures that the open mobile menu hides when the screen dimensions become
 * 461px or wider.
 */
@media all and (min-width: 861px) {
  .region-primary-menu .menu-toggle-target-show:target ~ .menu-toggle--hide {
    display: none;
  }
 #menu_main a { /* we only want borders when the links are displayed horizontally */
    border-right-width: 2px;
    border-right-style: solid;
  }
   #menu_main ul li:last-child a {
    border-right: none;
  }
}

/* Main Menu */

#menu_main ul {
  padding: 0.1rem;
}

#menu_main li {
  margin: 0;
  padding: 0;
}

#menu_main a { 
  border-radius: 0;
  margin-left: 0;
  margin-right: 0;
  padding-left: 1rem;
  padding-right: 1rem;
  border-left-width: 0;
}

/* User account menu */

.region-secondary-menu {
  display: flex;
  align-items: center;
}

.region-secondary-menu > *:first-child:not(.block-menu) {
  margin-left: 1rem;
}

.region-secondary-menu > *:not(:last-child) {
  margin-right: 1rem;
}

.secondary-menu-wrapper {
  border-top-width: 1px;
  border-top-style: solid;
}

/*
div:not(.mobile-header)  {
  background-color: green ! important;
}
*/


#menu_account ul {
  
  padding: 0.1rem;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;

}


.mobile-header #menu_account ul {
  
  padding: 0;
  display: none;
  border: 1px solid;
  
}


#menu_account li {
  margin: 0;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}



#menu_account  a {
  padding: 0.5rem 0.8rem;
  border-radius: 0;
}

.mobile-header #menu_account  a {
  padding: 0.5rem 0.8rem;
  border-radius: 0;
  border: none;
  width: 100%;
}

#menu_account ul li:not(:last-child) a {
  border-right: 2px solid;
}


.mobile-header #menu_account ul li:not(:last-child) a {
  border-right: none;
}


#menu_account a:hover,
#menu_account a:active {
  border-bottom: none;
}

.mobile-header .menu--account:after {
  font-family: 'cela-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 1.25rem;
  display: inline-block;
  vertical-align: middle;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e909";
  font-size: 1.25rem;
}

.mobile-header .menu--main:after {
  font-family: 'cela-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 1.25rem;
  display: inline-block;
  vertical-align: middle;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e90a";
  font-size: 1.25rem;
}
