#title {
    margin: 50px 0px 0px 15px;
}
#title-tip {
    margin: 50px 0px 0px 15px;
}
.player .avatar {
    float: left;
    display: inline;
    width: 100px;
    height: 100px;
    background: url(../FusionSummerTime_Logo_v2.png);
    background-size: cover;
}
.player .content .name {
    font-size: 20px;
}

@media screen and (min-width: 1000px) {
    #main {
        width: 960px;
        margin: 0 auto;
    }
    .player-list {
        margin-top: 50px;
        display: flex;
        flex-wrap: wrap;
    }
    .player {
        width: 450px;
        height: 100px;
        margin: 0px 15px 20px 15px;
    }
    .player .content {
        float: left;
        display: inline;
        padding: 10px;
        width: 300px;
        height: 100px;
    }
}

@media screen and (max-width: 999px) {
    #main {
        width: 100%;
    }
    .player-list {
        margin-top: 50px;
    }
    .player {
        width: 90%;
        height: 100px;
        margin: 0px 5% 20px 5%;
    }
    .player .content {
        float: left;
        display: inline;
        padding: 10px;
        width: auto;
        height: 100px;
    }
}