<style>
    @font-face {
        font-family: "BeaufortLoL";
        src: url("{{ url_for('static', filename='beaufortlol.woff') }}") format('woff');
    }
</style>
<div class="game-panel">
    <div class="game-grid lol">
        <div class="player">
            <a href="https://matchhistory.euw.leagueoflegends.com/en/#match-history/EUW1/{{ record.account_id }}">
                <img src="http://avatar.leagueoflegends.com/EUW1/{{ record.summoner_name }}.png" class="player-image">
                <span class="player-name">{{ record.summoner_name }}</span>
            </a>
        </div>
        <div class="game-title level">
            LIVELLO
        </div>
        <div class="game-score level">
            <span>{{ record.level }}</span>
        </div>
        <div class="game-title mastery">
            MAIN
        </div>
        <div class="game-score mastery">
            <img src="{{ record.highest_mastery_champ_image() }}" title="{{ record.highest_mastery_champ_name() }}" class="rank">
        </div>
        <div class="game-title soloq">
            SOLO/DUO
        </div>
        <div class="game-score soloq">
            {% if record.solo_division is none %}
                <img src="{{ url_for('static', filename='lol-rank-icons/provisional.png') }}" title="Non classificato" class="rank">
            {% else %}
                <img src="{{ url_for('static', filename='lol-rank-icons/' + record.solo_division.name|lower + "_" + record.solo_rank.name|lower + ".png") }}" class="rank" title="{{ record.solo_division.name|capitalize }} {{ record.solo_rank.name }}">
            {% endif %}
        </div>
        <div class="game-title flexq">
            FLEX
        </div>
        <div class="game-score flexq">
            {% if record.flex_division is none %}
                <img src="{{ url_for('static', filename='lol-rank-icons/provisional.png') }}" title="Non classificato" class="rank">
            {% else %}
                <img src="{{ url_for('static', filename='lol-rank-icons/' + record.flex_division.name|lower + "_" + record.flex_rank.name|lower + ".png") }}" class="rank" title="{{ record.flex_division.name|capitalize }} {{ record.flex_rank.name }}">
            {% endif %}
        </div>
        <div class="game-title twtrq">
            3V3
        </div>
        <div class="game-score twtrq">
            {% if record.twtr_division is none %}
                <img src="{{ url_for('static', filename='lol-rank-icons/provisional.png') }}" title="Non classificato" class="rank">
            {% else %}
                <img src="{{ url_for('static', filename='lol-rank-icons/' + record.twtr_division.name|lower + "_" + record.twtr_rank.name|lower + ".png") }}" class="rank" title="{{ record.twtr_division.name|capitalize }} {{ record.twtr_rank.name }}">
            {% endif %}
        </div>
    </div>
</div>