Custom Top Navigation - Examples

#header #edCustomappheader {}

.customTopNavigationLi  {
    color: black;
    list-style: none;
    font-weight: 100;
}

.customTopNavigationUl {
    display: inline-block;
    padding: 10px; 
    font-weight: 800;
    margin: 15px;
    margin-top: 5px;
}


.customTopNavigationMenu:hover .customTopNavigationDropdown {
    display: block;
}

.customTopNavigationDropdown {
    display: none;
    padding: 10px;
    background: white;
    color: black;
    position: absolute;
    border: 1px solid grey;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

/* Custom Menu */
  .customTopNavigationA {
      text-decoration-color: rgb(51, 51, 51) !important;
      color: black !important;
      background-color: transparent !important;
      text-decoration: none !important; 
      
  }
  
  .customTopNavigationLi  {
      list-style-type: none !important;
      font-weight: 200 !important;
      border-bottom: 0 !important;
      background: #f5f5f5 !important;
  }
  
  .customTopNavigationLi:hover  {
       list-style-type: none !important;
       font-weight: 200 !important;
       border-bottom: 2px solid #d22321 !important;
       background: lightgrey !important;
  }
  
  .customTopNavigationUlText {
      border-bottom: 2px solid black !important;
      margin-bottom: 8px !important;
      text-align: left;
      padding-left: 0px;
      padding-right: 10px;
      margin-top: 7px;
  }
  
  
  .customTopNavigationUl {
      display: inline-block !important;
      font-weight: 700 !important;
      padding: 0px; 
      margin: 10px;
      vertical-align: top;
      width: 47%;
  }
  
  .customTopNavigationDropdown {
      display: none !important;
      padding: 10px !important;
      color: black !important;
      position: absolute !important;
      border: 0 !important;
      background: #f5f5f5 !important;
      border-bottom-left-radius: 3px !important;
      border-bottom-right-radius: 3px !important;
      box-shadow: 0 1px 5px rgb(0 0 0 / 15%) !important;
      max-width: 700px !important;
      white-space: normal !important;
     
  }
  
  
  
  .customTopNavigationMenuLi:hover > .customTopNavigationDropdown{
      display: block !important;
  }