.menu--quicklinks {
  --spacing: 0.25rem;

  ul {
    display: grid;
    align-items: center;
    column-gap: calc(var(--spacing)*8);
    grid-template-columns: repeat(1,minmax(0,1fr));

    @media (min-width: 768px) {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    @media (min-width: 992px) {
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
    @media (min-width: 1200px) {
      grid-template-columns: repeat(5,minmax(0,1fr));
    }

    .nav-item {
      list-style: none;
      margin: 0 0 10px 0;
      padding: 0;


      a {
        background-color: #0068b4;
        text-decoration: none;
        border-radius: 50px;
        margin: 0;
        padding: 12px;
        text-align: center;
        transition: box-shadow 0.2s ease, color 0.2s ease;
        color: #fff;

        &:hover {
          box-shadow: 2px 2px 10px #00477a inset;
          color: #8ed3ff;
        }
      }
    }
  }
}