.tabs {
    margin:  0;
    padding: 0;
    list-style: none;
    display: table; /* [1] */
    table-layout: fixed; /* [2] */
    width: 100%; /* [3] */
}

    .tabs__item {
        display: table-cell; /* [4] */
    }

        .tabs__link {
            display: block; /* [5] */
        }


/**
 * Primary nav. Extends `.tabs`.
 *
 * 1. Stop tabs’ corners leaking out beyond our 4px round.
 */
.primary-nav {
    text-align: center;
    border-radius: 4px;
    overflow: hidden; /* [1] */
}

        .primary-nav a {
            padding: 1em;
            background-color: #0183c1;
            color: #fff;
            font-weight: bold;
            text-decoration: none;
        }

        .primary-nav a:hover {
            background-color: #de6103;
            opacity: 1;
        }