Hi, I know I am very delayed in my response, but here is the code I am using. Since my original post, I have made some additional updates to my navigation bar. I've pasted my updated code below. I hope this helps!
//NAVIGATION BAR//
// Hide index link from nav bar //
a[href="/sip-the-tee-1"]{pointer-events: none;};
a[href="/about-nav"]{pointer-events: none;}
a[href="/what-we-do-1"]{pointer-events: none;}
//static floating header//
.Header {border-bottom: 2px solid gray;}
@media screen and (min-width: 768px) {
.Header {position: fixed; z-index: 9999; width: 100%; top: 0px;}
.Content-outer {margin-top: 100px;}
}
//--- Add a border between links:
.Header-nav-folder a {border-bottom:1px dotted gray}
//--- Increase the space between links:
.Header-nav-folder a {padding-bottom:.5rem!important; }
//--- give drop down list a shadow:
.Header-nav-folder{box-shadow: 5px 5px 15px rgba(0,0,0,0.5)}
.Header-nav-folder{background-color:white!important}
//--- active link highlight---//
.Header-nav-item {margin: 10px!important; padding: 5px!important;}
.Header-nav-item:hover {border: 2px solid #990000!important;}
.Header-nav-item.Header-nav-item--active {background: #990000!important; color: white!important}
.Header-nav-folder-title.Header-nav-folder-title--active{
color: white!important;
background-color: #990000;
padding-left: 6px;
padding-right: 5px;
border: 4px solid #990000;
margin-left: -5px!important;
margin-right: -5px;
margin-top: -2px;}
//--- grey highlight folder link on hover---//
.Header-nav-folder-item:hover {background-color: #e7e6e6!important}
