<div class="container mt-4">
    <div class="row text-center">
        <div class="col-12 box-padding">
            <div class="box rank-1">
                <span class="rank-name">User</span><br>
                <span class="rank-description">Default rank</span>
            </div>
        </div>
    </div>
    <div class="row text-center">
        <div class="col-md box-padding">
            <div class="box rank-2">
                <span class="rank-name">Adventurer</span><br>
                <span class="rank-description">Complete 1 adventure</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-2">
                <span class="rank-name">Settler</span><br>
                <span class="rank-description">Create a private plot</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-2">
                <span class="rank-name">Commander</span><br>
                <span class="rank-description">Clan with 5 members</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-2">
                <span class="rank-name">Volunteer</span><br>
                <span class="rank-description">Do 15 quests</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-2">
                <span class="rank-name">Newcomer</span><br>
                <span class="rank-description">Play 20 hours</span>
            </div>
        </div>
    </div>
    <div class="row text-center">
        <div class="col-md box-padding">
            <div class="box rank-3">
                <span class="rank-name">Explorer</span><br>
                <span class="rank-description">Complete 5 adventures</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-3">
                <span class="rank-name">Colonizer</span><br>
                <span class="rank-description">Create a plot with 900m2</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-3">
                <span class="rank-name">Chief</span><br>
                <span class="rank-description">Clan with 10 members</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-3">
                <span class="rank-name">Friend</span><br>
                <span class="rank-description">Do 50 quests</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-3">
                <span class="rank-name">Frequenter</span><br>
                <span class="rank-description">Play 100 hours</span>
            </div>
        </div>
    </div>
    <div class="row text-center">
        <div class="col-md box-padding">
            <div class="box rank-4">
                <span class="rank-name">Pioneer</span><br>
                <span class="rank-description">Complete 10 adventures</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-4">
                <span class="rank-name">Major</span><br>
                <span class="rank-description">Raise a plot to a city</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-4">
                <span class="rank-name">Lord</span><br>
                <span class="rank-description">Clan with 15 members</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-4">
                <span class="rank-name">Altruist</span><br>
                <span class="rank-description">Do 500 quests</span>
            </div>
        </div>
        <div class="col-md box-padding">
            <div class="box rank-4">
                <span class="rank-name">Legend</span><br>
                <span class="rank-description">Play 700 hours</span>
            </div>
        </div>
    </div>

    <div class="row text-center justify-content-center spacer">
        <div class="col-md box-padding">
            <div class="box rank-owner">
                <span class="rank-name">Owner</span><br>
                <span class="rank-description">kajetanjohannes</span>
            </div>
        </div>
    </div>
    <div class="row text-center justify-content-center">
        <div class="col-md box-padding">
            <div class="box rank-admin">
                <span class="rank-name">Admin</span><br>
                <span class="rank-description">
                    marvinius, MentorMentos, eropster, wertibaldi
                </span>
            </div>
        </div>
    </div>
    <div class="row text-center justify-content-center">
        <div class="col-md box-padding">
            <div class="box rank-builder-dev">
                <span class="rank-name">Builder / Developer</span><br>
                <span class="rank-description">Pretend to be busy</span>
            </div>
        </div>
        <div class="col-md">
            <div class="row">
                <div class="col-12 box-padding">
                    <div class="box rank-mod">
                        <span class="rank-name">Moderator</span><br>
                        <span class="rank-description">SirTerence7</span>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-12 box-padding">
                    <div class="box rank-supporter">
                        <span class="rank-name">Supporter</span><br>
                        <span class="rank-description">You may apply for that</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row text-center justify-content-center spacer">
        <div class="col-md box-padding">
            <div class="box rank-vip">
                <span class="rank-name">Influencer / Sponsor / VIP</span><br>
                <span class="rank-description">Be famous</span>
            </div>
        </div>
    </div>
</div>