nav {
    margin:  20px auto 0;
    padding:  10px;
    background-color: #fc0;
    color:  #522b83;
}

nav > ul {
    display: flex;
    font-weight:  bold;
    justify-content:  space-evenly;
    list-style-type: none;
    margin: 0 auto;
    width: fit-content;
}

nav > ul > li {
    flex: 1;
    padding: 0 20px;
    position: relative;
    font-weight:  bold;
    font-size:  x-large;
    white-space: nowrap;
}

nav > ul ul {
    background-color: #522b83;
    border: 2px solid #522b83;
    color: #fc0;
    list-style-type: none;
    padding: 10px;
    position: absolute;
    display: none;
}

nav > ul > li > ul li {
  margin: 20px 0;
}

.show {
    display: block;
}

.hide {
    display:  none;
}