.head {
    background: #d6ce93;
    border-bottom: solid 2px #b8b075;
}

.head > .stats > .xp {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    padding: 5px 0 5px 0;
}

.head > .stats > .xp > .level {
    text-align: center;
    font-size: 16px;
}

.head > .stats > .xp > .level > h3 {
    padding: 3px;
    background: #0358f1;
    color: #ffffff;
    border-radius: 5px;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    border: solid 2px #0046c8;
}

.head > .stats > .xp > .road {
    width: 80%;
    background: #bbbbbb;
    padding: 4px;
    border-radius: 5px;
    border: solid 2px #888888;
}

.head > .stats > .xp > .road > .stroke {
    height: 18px;
    background: #0358f1;
    border-radius: 3px;
}

.head > .stats > .results {
    padding: 5px 0 5px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.head > .stats > .results > div {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px;
    width: 25%;
    border-radius: 5px;
}

.head > .stats > .results > div > img {
    width: 20px;
}

.head > .stats > .results > div > h4 {
    font-size: 20px;
    margin-left: 10px;
}

.head > .stats > .results > .wins {
    background: #b7e4c7;
    border: solid 2px #02C39A;
}

.head > .stats > .results > .draws {
    background: #bcd4ff;
    border: solid 2px #0358f1;
    margin: 0 3% 0 3%;
}

.head > .stats > .results > .loses {
    background: #ffbbbb;
    border: solid 2px #d80606;
}

.head > .stats > .rating {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 0 5px 0;
}

.head > .stats > .rating > h3 {
    font-size: 22px;
}

.head > .stats > .rating > img {
    width: 20px;
    margin: 0 10px 0 10px;
}