gutenbergsite/gutenberg/new_nav.css

/*Strip the ul of padding and list styling*/
nav {
  background-color:#EDDAB7;
  color:#000000;
  left: 0;
  padding: 0 10vw 0 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 999;
  height:40px;
  font-family: "Trebuchet MS",Helvetica, sans-serif;
}
#main_logo{
  top:0;
  left:0;
  position: absolute;
}

nav .searchbox{
	position: relative;
	float:left;
	width:320px;
	padding:3px;
}
nav .donatelink {
    padding: 8px;
}
nav .searchbox input[type=text]{
	height:25px;
	width:250px;
	border-radius:8px;
	color: black;
	background-color: #f5f5f5;
	padding-right:10px;
	padding-left:10px;
}
nav .searchbox input[type="submit"] {
    padding-right: 0px;
    padding-left: 0px;
}
nav .donate{
	background-color:#F5ECDB;
	color:black;
	font-size: 16px;
	width:115%;
	margin-top: 40px;
    margin-left:129px;
    height: 40px;
}
nav .donate p{
	margin-top:0px;
	margin-left:10px;
	display: inline;
}
nav .donate .donbtn{
  display:inline-block;
  cursor: pointer;
  vertical-align: text-top;
}
nav .donate a:link{
  text-decoration: underline;
}
nav .donate a:hover{
	background: #BDAE92;
	color: #fff; /* white */
}
@media screen and /*(orientation: portrait)*/(max-width : 1024px) {
  nav {
    height:auto;
    font-size:12px;
    position:absolute;
		}
  nav .donate{
    display: none;
	  }
  nav .searchbox{
    margin-left: 65px;
    float:left;
		display:inline-block;
    padding: 5px;
	}
}

#menu{
  margin-left:140px;
  background-color: #EDDAB7;
  font-weight:bold;

}
#menu a{
 text-decoration:none;
}

#menu ul {
  margin: 0;
  padding: 0;
}

#menu .main-menu {
  display: none;
  background-color:#EDDAB7;
}

#tm:checked + .main-menu {
  display: block;
}

#menu input[type="checkbox"],
#menu ul span.drop-icon {
  display: none;
}

#menu li,
#toggle-menu,
#menu .sub-menu {
  border-style: solid;
  border-color: rgba(0, 0, 0, .05);
}

#menu li,
#toggle-menu {
  border-width: 0 0 1px;
}

#menu .sub-menu {
  background-color: #f0e1c5;
  border-width: 1px 1px 0;
  margin: 0 1em;
}

#menu .sub-menu li:last-child {
  border-width: 0;
}

#menu li,
#toggle-menu,
#menu a {
  position: relative;
  display: block;
  color: black;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .125);
}

/*#toggle-menu {
  background: #333;
}*/

#toggle-menu,
#menu a {
  padding: 8px 1.5em;
}

#menu a {
  transition: all .125s ease-in-out;
  -webkit-transition: all .125s ease-in-out;
}

#menu a:hover {
  color: #09c;
}

#menu .sub-menu {
  display: none;
}

#menu input[type="checkbox"]:checked + .sub-menu {
  display: block;
}

#menu .sub-menu a:hover {
  color: #444;
}

#toggle-menu .drop-icon,
#menu li label.drop-icon {
  position: absolute;
  right: 0;
  top: 0;
}

#menu label.drop-icon, #toggle-menu span.drop-icon {
  padding: 1em;
  font-size: 1em;
  text-align: center;
  background-color: rgba(0, 0, 0, .125);
  text-shadow: 0 0 0 transparent;
  color: rgba(255, 255, 255, .75);
}
@media only screen and (max-width: 1200px) and (min-width:1024px) {

}
@media only screen and (min-width: 1024px) {
  /*TESTING_____________________*/
  #menu .main-menu > li:last-child{
    display: none;
  }
  #menu .main-menu li{
  background-color:#EDDAB7;
}
  #menu .main-menu {
    display: block;
  }

  #toggle-menu,
  #menu label.drop-icon {
    display: none;
  }

  #menu ul span.drop-icon {
    display: inline-block;
  }

  #menu li {
    float: left;
    border-width: 0 1px 0 0;
  }

  #menu .sub-menu li {
    float: none;
  }

  #menu .sub-menu {
    border-width: 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    width:max-content;
    z-index: 3000;
    max-height: 80vh;
    overflow-y: auto;
   }

  #menu .sub-menu,
  #menu input[type="checkbox"]:checked + .sub-menu {
    display: none;
  }

  #menu .sub-menu li {
    border-width: 0 0 1px;
    background-color:  #f0e1c5;
    /*width: max-content;*/
  }

  #menu .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }

 #menu .sub-menu .drop-icon {
    position: absolute;
    top: 0;
    right: 0;
    padding: 1em;
  }

  #menu li:hover > input[type="checkbox"] + .sub-menu {
    display: block;
  }
}