/* {{generatedBy}} by {{authorName}} {{authorEmail}}
 *
 * Import this file instead of _eco.scss to only load the variables from core and custom for use in your own SCSS file.
 *
 * 
 */
/* {{generatedBy}} by {{authorName}} {{authorEmail}}
 *
 * This document contains variable definitions with default values provided for all customizable aspects of the eco
 * system. The atoms, molecules, organisms, and modifiers within eco should be making use of these to provide a
 * consistent and easily customizable user interface.
 */
/* {{generatedBy}} by {{authorName}} {{authorEmail}}
 *
 * Use this document to override default values for core eco SCSS variables or define your own SCSS variables to be used
 * within your custom atoms, mixins, modifiers, molecules, organisms, and other project level SCSS.
 */
.molecule_mobileMenu {
  position: fixed;
  top: 0;
  right: 0;
  width: 44px;
  height: 44px;
  transition: width 0s linear 0.25s, height 0s linear 0.25s;
}
.molecule_mobileMenu > label,
.molecule_mobileMenu > .label {
  display: none;
}
.molecule_mobileMenu ul {
  list-style: none;
  padding-left: 0;
}
.molecule_mobileMenu ul li {
  border-bottom: 1px solid #dadfe1;
}
.molecule_mobileMenu ul li:last-child {
  border-bottom: 0;
}
.molecule_mobileMenu ul li > a,
.molecule_mobileMenu ul li > .atom_a {
  display: block;
  padding: 10px 0 10px 1.2em;
}
.molecule_mobileMenu ul li ul {
  border-top: 1px solid #dadfe1;
}
.molecule_mobileMenu ul li ul li > a,
.molecule_mobileMenu ul li ul li > .atom_a {
  display: block;
  padding: 10px 0 10px 3.2em;
}
.molecule_mobileMenu .molecule_toggleControl {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 44px;
  height: 44px;
  padding: 10px;
  text-align: center;
}
.molecule_mobileMenu > .molecule_children {
  background: #ffffff;
  position: absolute;
  top: 44px;
  bottom: 0;
  transition: left 0.25s ease-out;
  padding-bottom: 60px;
  width: 100vw;
  left: 100vw;
  overflow: auto;
}
.molecule_mobileMenu.mod_active {
  width: 100vw;
  height: 100vh;
  transition: width 0s, height 0s;
}
.molecule_mobileMenu.mod_active > .molecule_children {
  left: 0;
}

.molecule_mobileMenu {
  display: none;
}

@media only screen and (max-width: 640px) {
  body.mobileMenu-open {
    overflow: hidden;
  }

  .molecule_mobileMenu {
    display: block;
  }
}
@media only screen and (max-width: 768px) {
  body.mobileMenu-showOnTablet.mobileMenu-open {
    overflow: hidden;
  }

  .molecule_mobileMenu.showOnTablet {
    display: block;
  }
}
.molecule_mobileMenu.showOnAll {
  display: block;
}
.molecule_mobileMenu.showOnAll body.mobileMenu-showOnAll.mobileMenu-open {
  overflow: hidden;
}

@media only screen and (max-width: 768px) and (min-width: 641px) {
  .hasSiteTools .molecule_mobileMenu.mod_active {
    max-width: calc(100vw - 64px);
  }
}

/*# scssSourceMappingURL=styles.css.map */