/* styling til character siden */

.character {
    display: flex;
    justify-content: space-between;
    padding-bottom: 5em;
    gap: 8em;
}

.character__left {
    flex: 6;
}

.character__right {
    flex: 4;
}

.character__subtitle {
    font-size: 1.25em;
    margin-bottom: 1.5em;
    color: #fff;
}

.character__text {
    font-size: 1.25em;
    margin-bottom: 1em;
    font-weight: 300;
}

.character__image {
    margin-bottom: 1em;
}

.character__table {
    width: 100%;
    border-collapse: collapse;
}

.character__tableheader,
.character__tabledata {
    font-size: 1.25em;
    padding-bottom: 1.2em;
}

.character__tableheader {
    text-align: left;
    color: #fff;
    font-weight: 300;
}
.highlight {
    color:#ffa500;
}

@media screen and (max-width:820px) {
    .character {
        flex-direction: column;
    }

    .character__left,
    .character__right {
        padding: 1em 0;
        flex: 1;
    }
}