/* style for the css menu dropdown container */
.menu {
    position:relative;
	 display:inline-block;
	 z-index:2; 
	 border: none;
	 padding: 10px 10px 10px 10px;
    margin: 0px 5px;
	 cursor: pointer;
    outline:0;
    font-size: 1.5rem;
    text-align:center;
	 background: Silver;
	 transition-duration: 0.4s;
}
.menu:hover {
  background-color: #008CBA;
  color: white;
}
/* style for the button 
.menu:before {
    content: "\271A"; 
    color:white;
	cursor: pointer;
    padding: 5px 10px;
    border-radius: 50%;
    background: #96305e;
}*/

.menu:focus { pointer-events:none; }

/* If :focus detected the dropdown menu is displayed by making it visible */
.menu:focus .menu-dropdown { opacity:1; visibility:visible; }

/* style for the dropdown box */
.menu-dropdown {
    background-color: #364656;
    width: auto;
    font-size: 1rem;
    text-align:left;
    margin:15px 0 0 0;
    padding: 10px;
    border-radius:3px;
    border:1px black solid;
    pointer-events: auto;
    position: absolute;
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    transition: visibility 1s;
    background: #1f8bd3;
}

/* style the links in the dropdown */
.menu-dropdown a {
    background:transparent;
    border:none;
    outline:0;
    display:block;
    color:white;
    text-decoration:none;
    width:160px;
    padding:5px;
}