.main-navigation {
  border-radius: var(--main-border-radius);

  .main-nav > ul {
    position: relative;
    z-index: 2;
  }

  .main-nav ul li a {
    position: relative;
    font-size: 16px;
    line-height: 37px;
  }

  .main-nav > ul > li > a {
    font-family: 'Patrick Hand', cursive;
  }

  .main-nav > ul > li > a:after {
    content: "";
    position: absolute;
    left: 100%;
    top: 20%;
    bottom: 20%;
    width: 1px;
    z-index: 1;
  }

  .main-nav ul ul li a {
    border-top: 1px solid #fff;
  }

  .main-nav ul ul li:first-child a {
    border-top-color: transparent;
  }

  .main-nav ul.sub-menu {
    background-color: transparent !important;

    li a {
      font-family: 'Patrick Hand', cursive;
    }

    li:first-child a {
      border-top-left-radius: var(--main-border-radius);
      border-top-right-radius: var(--main-border-radius);
    }

    li:last-child a {
      border-bottom-left-radius: var(--main-border-radius);
      border-bottom-right-radius: var(--main-border-radius);
    }
  }

  body & .main-nav ul li:hover > a,
  body & .main-nav ul li:focus > a,
  body & .main-nav ul li.sfHover > a {
    background-color: inherit;
  }
}