ul
  list-style-type: none
  margin: -2px auto
  padding: 0

  /*overflow: hidden;
  background-color: hsla(0, 0%, 100%, 0.8)
  border: 2px solid darkred
  display: inline-block
  transition: all 60ms
  box-shadow: inset -2px -2px 10px lightblue, inset 2px 2px 10px lightblue

  &.navUl
    height: 33px

li
  float: left
  width: auto

  /*height: 33px;
  margin: 0px 0px

  /*border: 1px solid lightgrey;
  border-radius: 0px

  a
    display: block
    color: darkred
    text-align: center
    padding: 7px 16px
    text-decoration: none
    margin: 1px 0 4px
    font-weight: bold

nav > ul > li
  width: 100px

li a
  &:active, &:hover, &:focus, &.active
    background: none
    color: red
    text-decoration: underline

  &:active, &:hover, &:focus
    transition: 1s
    transform: scale(1.1)

ul li ul li
  display: inline-block

.submenu
  visibility: hidden
  position: relative
  margin-top: -5px
  margin-left: -10px
  background-color: rgb(255, 255, 255)

  li
    a
      display: block
      float: none
      border-bottom: 1px solid goldenrod
      margin: 0 0 0 0

    display: block
    float: none
    border-bottom: 1px solid goldenrod
    margin: 0 0 0 0

.submenuActive
  visibility: visible

nav > ul > li > ul > li
  margin: middle
