b-core.css

aside {
    display: flex;
}

a.button, a.button:visited {
    align-items: center;
    border: solid 1px;
    border-radius: var(--padding-large);
    color: var(--color-link);
    display: flex;
    font-size: var(--text-size-standard);
    padding: var(--padding) calc(var(--padding) * 1.5);
    text-decoration: none;
    margin-left: var(--padding);
}

a.button--all {
    padding-left: calc(var(--padding-medium) * 1.5);
    padding-right: calc(var(--padding-medium) * 1.5);
}

a.button--design {
    color: var(--color-accent-one) !important;
    border-color: var(--color-accent-one) !important;
}

a.button--code {
    color: var(--color-accent-two) !important;
    border-color: var(--color-accent-two) !important;
}

a.button--words {
    color: var(--color-accent-three) !important;
    border-color: var(--color-accent-three) !important;
}

a.selected--all {
    background-color: var(--color-link-t);
}

a.selected--design {
    background-color: var(--color-accent-one-t);
}

a.selected--code {
    background-color: var(--color-accent-two-t);
}

a.selected--words {
    background-color: var(--color-accent-three-t);
}

header {
    align-items: center;
    display: flex;
    font-size: var(--text-size-header);
    font-weight: var(--font-weight-thin);
    justify-content: space-between;
    margin: var(--padding-large) var(--padding-large) var(--padding-xlarge) var(--padding-large);
    white-space: nowrap;
}

main {
    padding-bottom: calc(var(--padding-xlarge) + var(--padding-large));
    margin: var(--padding-large) var(--padding-large) 0 calc(var(--padding) * 14);
}

/* content section */
.content {
    display:flex;
    font-family: var(--text-font-name-secondary), sans-serif;
    font-size: var(--text-size-standard);
    font-weight: var(--font-weight-bold);
}

.content__links {
    display:flex;
    flex-direction: column;
    font-weight: var(--font-weight-regular);
}

.content__link {
    align-items: flex-start;
    display:flex;
    margin-left: var(--padding-xlarge);
    padding-bottom: var(--padding-medium);
}

.content__link a, a:visited {
    color: var(--color-dark);
}

.content__padder {  
    height: calc(var(--padding) * 6);
    width: 1px;;
}

.content__types {
    align-items: center;
    display:flex;
    padding-right: var(--padding);
}

.content__timeline {
    display:flex;
    flex-direction: column;
}

.content__timeline-line {
    background-color: var(--color-gray);
    flex-grow: 1;
    margin: var(--padding) 0 var(--padding) var(--padding);
    width: 1px;
}

/* work types */
.type {
    height: calc(var(--padding) * 1.5);
    width: calc(var(--padding) * 1.5);
    background-size: 100% 100%;
    margin-right: calc(var(--padding) / 2);
    pointer-events: none;
}

.content__types, .type {
    margin-top: 2px;
}

.type__design {
    background: url(../assets/design.svg);
}

.type__code {
    background: url(../assets/code.svg);
}

.type__words {
    background: url(../assets/words.svg);
}

.type__no-design {
    background: url(../assets/no-design.svg);
}

.type__no-code {
    background: url(../assets/no-code.svg);
}

.type__no-words {
    background: url(../assets/no-words.svg);
}