.vertical-menu {
    color:#555555;
    text-align:center;
    font-size: 1.3em;
    display:none;
    float: left;
}

.vertical-menu ul {
    list-style: none;
    margin: 0;
    padding:0;
}
.vertical-menu ul li {
    margin:0;
    padding: 0
}
.vertical-menu ul a {
    text-decoration: none;
    color:#555555;
}
.vertical-menu >ul>li {
    border-bottom: solid 2px #d4d4d4;
}
.vertical-menu .menu-item {
    display: block;
    padding:3.5mm 0;
}
.vertical-menu .vertical-menu-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 300ms ease-out;
    background-color: #f0f5fe;
}
.vertical-menu li.expanded>.vertical-menu-submenu {
    height: auto;
    max-height: 500px;
    width: auto!important;
}

.vertical-menu li .ex_close {
    height: 0;
}
.vertical-menu li.expanded .ex_close {
    height: 9mm;
}

.vertical-menu li .ex_open {
     height: 9mm;
}
.vertical-menu li.expanded .ex_open {
    height: 0;
}

.vertical-menu .has-submenu { position:relative;}
.vertical-menu .has-submenu > a {
    color: #528df9;
    margin: 3.5mm 0;
    display:inline-block;
}

.vertical-menu li .expander {
    width: 9mm;
    height: 7mm;
    float: right;
}
.vertical-menu li .expander:after {
    content: '';
    display: table;
    clear: both;
}
.vertical-menu li .ex_close,
.vertical-menu li .ex_open {
    width: 9mm;
    /*height: 7mm;*/
    min-width: 0;
    min-height: 0;
    cursor: pointer;
    
    /*position: absolute;
    right: 0;*/
    /*vertical-align: super;*/
    -webkit-mask-position-y: center;
    /*overflow: hidden;*/
    transition: height 150ms ease-out;
    display:block;
}
.vertical-menu .vertical-menu-heading {
    border-bottom: solid 2px #d4d4d4;
    padding:4mm 0;
}
.vertical-menu li.has-submenu {
    padding:0;
}


@media (min-width: 768px) {
    .vertical-menu {display:block;}
}