/**** LOGO ****/
#logo-wrapper { 
    height: 80px;
    position: absolute;
    top: 0; }
#logo { float: left; margin: 0; height: 80px; }
  
  
/*** Navigation ***/
#main-nav.sticky.is-stuck { background-color: rgba(240, 128, 128,1); top: 0; }
.topnav, .menu-button { float:right; height: 80px; }

nav { margin: 0 auto; max-width: 60em; }
nav ul { margin: 0; text-align: left; width: 100%; }


.menu { display: none; }
.menu .menu-item { list-style-type: none; }
.menu .menu-item a { color: #333; font-family:'Amatic SC', cursive; }
.menu .menu-item a:hover { color: #FFF; }

  /** menu icon button **/
  #main-nav .menu-icon { display: block; height: 100%; width: 100%; }
  #main-nav .menu-icon::after { display: none; }
  #main-nav .material-icons { line-height: 80px; margin-right: 1em; }
  
  /** when open **/
  .topnav.open { height: auto; }
  .topnav.open .menu { display: block!important; padding-right: 20px; padding-top: 80px; }
  .open .menu a { font-size: 1.6rem; line-height: 1.4; padding: 0; }
  .open .menu-item span { display: none; }
  
    /* @media screen and (min-width: 830px) {
      .topnav { height: 55px; }
      #main-nav .menu { display: flex; }
      #main-nav .menu-button,
      #main-nav .menu .menu-item:last-child span { display:none; }
      #main-nav .menu .menu-item,
      #main-nav .menu .menu-item a, 
      #main-nav .menu .menu-item span { display: inline-block; }
      #main-nav ul { text-align: center; }
      #main-nav .menu .menu-item a { font-size: 1.8rem; }
      #main-nav .menu .menu-item span { font-size: 2rem; }
    } */