/* Variables */
:root {
    --main-active-link-color: #FFF; /* active link color */
    --main-link-color: #7F8FA4; /* link color */
    --submenu-width: 224px;
    --submenu-font-size: 1rem;
    --submenu-font-color: #7F8FA4;
    --submenu-font-link-color: #FFFFFF;
    --submenu-item-padding: 16px;
    --submenu-bkg: #FFFFFF;
    --submenu-highlight: #777263;
    --submenu-two-highlight:#535148;
    --submenu-border-left-color: #777263;
    --submenu-border-bottom-color: #AAA596;
  }

/* custom code to hempworx */
#menu ul li a {
    color: var(--main-link-color);
    text-transform: uppercase;
    padding: 21px 30px 15px 15px !important;
}

#menu ul li a:hover {
    color: var(--main-link-color) !important; 
  }
  
#menu ul ul li a {
    color: var(--submenu-active-link-color) !important; 
}

#menu ul ul li a:hover {
    color: var(--submenu-font-link-color) !important; 
}

#menu ul ul li:hover, #menu ul li.active ul li:hover, #menu ul li:hover ul li:hover, #menu ul li.hover ul li:hover {
    color: #FFFFFF;
}

.menu-first-item-mod-gap-filler {
    /* Needed to create visual gap between main menu label and top of menu items, uncomment below to hide or delete the extrLI element in the HTML */
    /* display: none; */
    background: transparent !important; 
    height: 20px; /* change to desired height if needed */
}

#menu ul li ul li >p.arrow {
    /* display: inline-block; */
    /* float: right; */
    /* font-size: 2rem; */
    /* vertical-align: middle; */
    /* to hide this either remove the HTML or ucomment display below */
    display: none;
  }