content { display: flex; flex-direction: column; } tabs { margin-top: 1em; /* added so you can see it in the display */ display: flex; justify-content: space-evenly; border-bottom: var(--color-accent); } tabs a { text-decoration: none; color: var(--color-text); border-bottom: 1px solid var(--color-accent); border-width: thin; width: 100%; text-align: center; padding: 2rem 0rem 0.5rem; } tabs a:hover { box-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; } tabs a.active { background-color: var(--color-bg-secondary); } panel { display: none; } panel.active { border: 1px solid var(--color-accent); display: flex; flex-direction: column; padding: 1em; }