main {
    width: 55em;
    max-width: 100%;
    margin: 0 auto;
    padding: 1em 2.5em;
}
h1 {
    clear: both;
}

nav {
    font-family:"Trebuchet MS",sans-serif;
    font-size: 0.8125em;
}
nav ul {
    margin: 0;
    padding: 0;
}
nav li {
    display: inline-block;
    list-style: none;
    margin: 0 1.5em 1em -4px;
}
#main-nav {
    float: right;
    border-bottom: 1px solid #7EA419;
    margin-right: 8.1em;
}
#main-nav ul {
    margin: 0.9em 0 0.8em;
}
#main-nav li {
    border-right: 2px solid #CCC;
    margin: 0 0 0 -3px;
}
#main-nav li:last-child {
    border-right: 0;
}
#main-nav li a {
    display: inline-block;
    margin: 0 0.5em -0.5em;
    padding: 0.5em 1em 0.8em;
    border-radius: 0.25em 0.25em 0 0;
    position: relative;
}
#main-nav li a:focus,
#main-nav li a:hover,
#main-nav li a.active {
    background: #7EA419;
    color: #FFF;
}
#main-nav li a:focus i,
#main-nav li a:hover i,
#main-nav li a.active i {
    background: #7EA419;
    position: absolute;
    left: 50%;
    bottom: -5px;
    width: 10px;
    margin-left: -5px;
    aspect-ratio: 2;
    clip-path: polygon(50% 100%,100% 0,0 0);
}
.shelves {
    padding: 0;
}
.shelves li {
    display: inline-block;
    list-style: none;
    margin: 0 1.5em 1em 0;
}