Menu.css

.menu {
	background-color: white; padding: 10px 0px; position: absolute; top: 0px; max-height: 0px; overflow: hidden; transform: translate(-100%, -30px); pointer-events: none;
	box-shadow: 0px 2px 8px rgba(0,0,0,0.1); border-radius: 2px; opacity: 0; transition: opacity 0.2s ease-out, transform 1s ease-out, max-height 0.2s ease-in-out; z-index: 99;
	display: inline-block; z-index: 99999999999999999; margin-top: 50px;
}
.menu-right { left: 100% }
.menu.visible { opacity: 1; max-height: 350px; transform: translate(-100%, 0px); transition: opacity 0.1s ease-out, transform 0.3s ease-out, max-height 0.3s ease-in-out; pointer-events: all }

.menu-item { display: block; text-decoration: none; color: black; padding: 6px 24px; transition: all 0.2s; border-bottom: none; font-weight: normal; padding-left: 32px; white-space: nowrap; }
.menu-item-separator { margin-top: 3px; margin-bottom: 3px; border-top: 1px solid #eee }

.menu-item:hover { background-color: #F6F6F6; transition: none; color: inherit; cursor: pointer; color: black; text-decoration: none }
.menu-item:active, .menu-item:focus {
background-color: transparent;
color: white; transition: none;
-webkit-tap-highlight-color: transparent;
}
.menu-item.selected:before {
	content: "L"; display: inline-block; transform: rotateZ(45deg) scaleX(-1); line-height: 15px;
	font-weight: bold; position: absolute; margin-left: -14px; font-size: 12px; margin-top: 2px;
}

.menu-radio { white-space: normal; line-height: 26px }
.menu-item:hover, .menu-radio:hover {background-color: transparent}
.menu-radio span, .menu-radio a.all, .menu-radio a.filter {
	background-color: #EEE; width: 18.5%; text-align: center; margin-top: 2px; margin-bottom: 2px; color: #333; font-weight: bold;
	text-decoration: none; font-size: 13px; transition: all 0.3s; text-transform: uppercase; display: inline-block;
}
.post-list-type .menu-radio a:hover {color: #333}
.menu-item .menu-radio .lang-on:hover,
.menu-radio .lang-on.selected {
background-color: rgba(130,255,137,0.2);
}
.menu-item .menu-radio .lang-off:hover,
.menu-radio .lang-off.selected {
background-color: rgba(255,138,140,0.2);
}
.menu-radio a:hover, .menu-radio a.all.active { transition: none; background-color: #d8f1d9;}
.menu-radio a.long { font-size: 11px }

.menu-radio span {
text-align: center;
width: 46%;
margin-top: 2px;
margin-right: 4px;
display: inline-block;
white-space: pre;
outline: 4px solid transparent;
}
.menu-radio a {
position: absolute;
white-space: pre;
display: block !important;
width: 59px !important;
}
.menu-radio a.all, .menu-radio a.filter {
position: relative;
width: 46% !important;
float: left;
margin-right: 4px !important;
}
.menu-radio .lang-on {
text-align: left;
color: #333;
}
.menu-radio .lang-off {
color: #333;
text-align: right;
margin-left: 59px !important;
}

.post-list-type .menu {
width: 280px;
text-align: left;
margin-left: -55px;
margin-top: 43px;
transform: none;
transition: max-height 0.3s ease-out;
}
.post-list-type .hub-menu, .post-list-type .filters-menu {
position: relative;
z-index: 1;
display: inline-block;
}
.post-list-type .filters-menu .menu {
margin-left: -85px;
width: 257px;
padding-left: 15px;
}
.post-list-type .hub-menu .menu .menu-item {
width: 90px;
overflow: hidden;
}
.post-list-type .hub-menu .menu .menu-item a {
width: 90%;
overflow: hidden;
text-overflow: ellipsis;
}
.post-list-type .menu .menu-item, .post-list-type .menu .menu-radio a {
padding: 0;
margin: 0px;
border-bottom: none !important;
}
.post-list-type .menu .menu-radio .all, .post-list-type .menu .menu-radio .filter {
margin-bottom: 2px;
margin-top: 2px;
}

/* Drop menu show after */

.show-after, .show-since {
padding: 3px 0;
}
.show-after .menu-item, .show-since .menu-item {
display: inline;
padding-right: 5px;
}
.show-after #show-after-date {
width: 100px;
border: 1px solid transparent;
border-bottom: 1px solid #333;
padding: 1px 5px;
}
.show-since #show-since-day {
width: 17px;
border: 1px solid transparent;
border-bottom: 1px solid #333;
padding: 1px 5px;
}