/* HTML Nav Styles */
 /* HTML Nav Styles */
 /* HTML Nav Styles */
 .link-nav .link-menuitem {
    position:left;
    display:block;
    opacity:0;
    cursor:pointer;
 }
 
 .link-nav .link-menuitem > .link-menu {
    position: absolute;
    pointer-events:none;
 }
 .link-nav > .link-menu { display:flex; }
 
 .link-nav > .link-menu > .link-menuitem { pointer-events: all; opacity:1; }
 .link-menu .link-menuitem .link-a { white-space:pre-wrap; display:block; }
    
 .link-menuitem:hover > .link-menu {
    pointer-events:initial;
 }
 .link-menuitem:hover > .link-menu > .link-menuitem,
 menu:hover > .link-menuitem{
    opacity:1;
 }
 .link-nav > .link-menu > .link-menuitem .link-menuitem .link-menu {
    transform:translateX(100%);
    top:0; right:0;
 }
 /* User Styles Below Not Required */
 /* User Styles Below Not Required */
 /* User Styles Below Not Required */
 
 .link-nav { 
   margin-top: 20px;
 }
 
 .link-nav .link-a  {
    left: -50px;
    background:rgba(255, 255, 255, 0.075);
    color:#FFF;
    min-width:100px;
    transition: background 0.5s, color 0.5s, transform 0.5s;
    margin:0px 3px 3px 0px;
    padding:10px 20px;
    box-sizing:border-box;
    border-radius:3px;
    border: solid 1px #ffffff;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
    position:relative;
 }
 
 .link-nav .link-a:hover:before {
    content: '';
    top:0;left:0;
    position:absolute;
    background:rgba(255, 255, 255, 0.5);
    width:100%;
    height:100%;
    opacity: 0;
 }

 /*.link-nav > .link-menu > .link-menuitem > .link-a + menu:after
    content: '';
    position:absolute;
    border:10px solid transparent;
    border-top: 10px solid white;
    left:12px;
    top:-50px;  
 }
 .link-nav .link-menuitem > .link-menu > .link-menuitem > .link-a + menu:after
    content: '';
    position:absolute;
    border:10px solid transparent;
    border-left: 10px solid white;
    top: 30px;
    left: -240px;
 }*/
 
 .link-nav > .link-menu > .link-menuitem > .link-menu > .link-menuitem{
    transition: transform 0.6s, opacity 0.6s;
    transform:translatey(150%);
    opacity:0;
 }
 .link-nav > .link-menu > .link-menuitem:hover > .link-menu > .link-menuitem,
 .link-nav > .link-menu > .link-menuitem.hover > .link-menu > .link-menuitem{
    transform:translatey(0%);
    opacity: 1;
 }
 
 .link-menuitem > .link-menu > .link-menuitem > .link-menu > .link-menuitem{
    transition: transform 0.6s, opacity 0.6s;
    transform:translatex(195px) translatey(0%);
    opacity: 0;
 } 
 .link-menuitem > .link-menu > .link-menuitem:hover > .link-menu > .link-menuitem,  
 .link-menuitem > .link-menu > .link-menuitem.hover > .link-menu > .link-menuitem{  
    transform:translateX(0) translateY(0%);
    opacity: 1;
 }