.tabs input[type="radio"] {
    display: none;
}
.tabs ul {
    display: flex;
    list-style: none;
}
.tabs ul li label {
    cursor: pointer;
    border-bottom: solid 1px rgba(255, 255, 255, 0.5);
}
.tabs .tab-content section {
    display: none;
}

/* Supports 2 tabs only. If we require more, then add a new record for each. */
/* This approach allows us to avoid using JavaScript for tab functionality. */
.tabs input[type="radio"]:nth-of-type(1):checked ~ ul ~ .tab-content section:nth-child(1),
.tabs input[type="radio"]:nth-of-type(2):checked ~ ul ~ .tab-content section:nth-child(2) {
    display: block;
}
.tabs input[type="radio"]:nth-of-type(1):checked ~ ul li:nth-child(1) label,
.tabs input[type="radio"]:nth-of-type(2):checked ~ ul li:nth-child(2) label {
    border-bottom: solid 1px rgba(255, 255, 255, 1);
}
