.category{
width: 90%;
    margin:10px auto;
}
.category_title{
background-color:red;
padding:10px 0;
text-align:center;
font-size:18px;
color:white;
font-weight:800;

}
navmenu .nav-handle-container {
  box-sizing: border-box;
  width: 100%;
  padding: 4px;
 
  background: red;
  cursor: pointer;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  display: none;
}

navmenu .nav-handle-container .nav-handle {
  height: 5px;
  width: 50px;
  background: white;
  position: absolute;
  display: block;
  left: -webkit-calc(100% - 100px);
  left: calc(100% - 100px);
  top: 75px;
  
}

navmenu .nav-handle-container .nav-handle:before, nav .nav-handle-container .nav-handle:after {
  content: "";
  height: 5px;
  width: 50px;
  background: white;
  position: absolute;
  display: block;
}

navmenu .nav-handle-container .nav-handle:before { top: -20px; }

navmenu .nav-handle-container .nav-handle:after { bottom: -20px; }

navmenu ul {
  list-style: none;
  background-color:lightgray;
  overflow: hidden;
  color: black;
  margin: 0;
  padding: 0;
  text-align: center;
  -webkit-transition: max-height 0.4s ease-in-out;
  transition: max-height 0.4s ease-in-out;
}

navmenu ul li {
  display: list-item;
  padding: 10px; 
}

navmenu ul li a {
  text-decoration: none;
  color: inherit;
  display: block;
}
navmenu ul li a:hover {
  text-decoration: none;
  color: inherit;
}
navmenu ul li:hover { background: gray; }
 @media screen and (max-width: 760px) {
.category{
margin-top:0px;
}
.category_title{
display:none;

}
.down-arrow{
line-height:20px;
font-weight:800;
}
.res_category{
padding:5px 0;
text-align:center;
font-size:18px;
color:white;
font-weight:800;
}
navmenu .showing { max-height: 30.5em; }

navmenu ul { max-height: 0px; }

navmenu ul li {
  box-sizing: border-box;
  width: 100%;
  
  
}

navmenu .nav-handle-container { display: block; }

}