/*list.tab*/
.game-list-tab {
    width: 100%;

}
.game-list-tab.fixed {
    position: fixed;
    top: 2.75rem;
    background-color: #FFF;
    box-shadow: 0 2px 4px rgba(0,0,0,.2);
    z-index: 101;
}
.game-list-tab.fixed ~ .game-list.active {
    margin-top: 2.75rem; /* tab only*/
    /*margin-bottom: 2.75rem; /* compensation of the offset */
}
.with-header .game-list-tab.fixed ~ .game-list.active {
    /*margin-top: 5.5rem; /* header + tab */
    /*margin-bottom: 2.75rem; /* compensation of the offset */
}
.game-list-tab > li {
    float: left;
    width: 33.333333%;
    text-align: center;
    height: 2.75rem;
    line-height: 2.75rem;
    font-size: 0.875rem;
}
.game-list-tab.duo > li {
    width: 50%;
}
.game-list-tab.tri > li {
    width: 33.333333%;
}
.game.list.tab.quad > li {
    width: 25%;
}
.game-list-tab > .active {
    color: #1ca7db;
    border-bottom: 2px solid #1ca7db;
}
/*list.body*/
.game-list-no-result {
    width: 65%;
    height: 2.5rem;
    padding: 2rem 0;
    margin: 0 17.5%;
}
.game-list-no-result i {
    color: #CCC;
    font-size: 2.5rem;
    display: inline-block;
    margin-right: 0.9rem;
}
.game-list-no-result .text {
    height: 100%;
    display: inline-block;
    /*padding-left: 1.5rem;*/
}
.game-list-no-result .text h3 {
    margin-bottom: .5rem;

}
.game-list-no-result .text p {
    font-size: .5rem;
    color: #CCC;
}
.game-list-title {
    padding-top: 1rem;
    height: 1.5rem;
    line-height: 1.5rem;
    padding-left: 1rem;
    background-color: #f1f2f4;
}
.game-list {
    position: relative;
    display: none;
    background-color: #f1f2f4;
}
.game-list.active {
    display: block;
}
.game-list-detail {
    height: 4rem;
    background-color: #fff;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.game-list-detail:active {
    background-color: #f7f8fa;
}
.game-list-detail:first-child {
    margin-top: 1rem;
}
.game-list-detail:last-child {
    margin-bottom: 1rem;
}
.game-list-span {
    height: 100%;
    line-height: 100%;
}
.game-list-span:first-child {
    /*width: 25.6%;*/
    width: 5rem;
}
.game-list-detail img {
    width: 4rem;
    /*margin-left: 16.6666666%;*/
    margin-left: 1rem;
}
.game-list-span:nth-child(2) {
    max-width: 46.2%;
    max-width: calc(100% - 12.9rem);
    width: -webkit-calc(100% - 11.9rem);
    width: calc(100% - 11.9rem);
    padding-left: 1rem;
}
.tag-list .game-list-span:nth-child(2) {
    max-width: 50%;
    max-width: calc(100% - 10rem);
    width: auto;
    width: -webkit-calc(100% - 10rem);
    width: calc(100% - 10rem);
}
.game-list-span:nth-child(3) {
    width: 5rem;
}
.game-top-sort {
    height: 1.2rem;
    line-height: 1.4rem;
    text-align: center;
    width: 1.2rem;
    color: #fff;
    background-color: #ccc;
    border-radius: 1.2rem;
    margin-right: 0.2rem;
    font-size: 0.75rem;
}
.game-top-sort.active {
    background-color: #7e838a;
}
.game-name {
    /*margin-top: 0.25rem;*/
    font-size: 1rem;
    height: 1.5rem;
    line-height: 1.5rem;
    color: #333;
}
.game-tag,
.game-count {
    font-size: 0.75rem;
    height: 1.25rem;
    line-height: 1.25rem;
    color: #999;
}
.game-count {
    color: #666;
}
.game-count > i {
    display: inline-block;
    margin-right: 0.25rem;
}
/*下载按钮样式*/
.game-download {
    margin-right: 1rem;
    width: 4rem;
    height: 1.75rem;
    /*line-height: 1.75rem;*/
    /*margin-top: 0.5rem;*/
    border: 1px solid #1ca7db;
    color: #1ca7db;
    font-size: 0.75rem;
    background-color: #fff;
    border-radius: 2px;
    text-decoration: none;
    text-align: center;
    padding: 0;
    outline-style: none;
}
.game-download:active {
    background-color: #1ba7dc;
    color: #fff;
}
/*游戏详情页面的footer*/
footer.secondary > ul.footer-btn-list > li.game-list-detail.right-large > .game-download.footer {
    background-color: #fff;
    color: #1ca7db;
}
footer.secondary > ul.footer-btn-list > li.game-list-detail.right-large > button[data-android-type="start"].game-download.footer {
    background-color: #41ba47;
    color: #fff;
    border-color: #41ba47;
}
button[data-android-type="start"].game-download {
    border-color: #41ba47;
    color: #41ba47;
}
button[data-android-type="start"].game-download:active {
    background-color: #41ba47;
    color: #fff;
}
button[data-android-type="downloading"].game-download:active {
    background-color: #fff;
    color: #1ca7db;
}
/*.game-download.game-open {
    border: 1px solid #41ba47;
}
.progress-title.game-open {
    color: #fff;
}
.progress-bar.game-open {
    background-color: #41ba47;
}*/
.game-download > i {
    width: 100%;
    height: 100%;
    line-height: 1.75rem;
}
.progress-bar {
    background-color: rgb(187,228,243);
    /*background-color: #1ca7db;
    opacity: 0.5;*/
    height: 100%;
}
.progress-hint {
    color: #999;
    font-size: 0.75rem;
    height: 1.5rem;
    line-height: 1.5rem;
    width: 4rem;
    margin-right: 1rem;
    text-align: center;
}
.game-list.grid {
    border-top: 1px solid #E5E7EB;
}
.game-list.grid > .game-list-detail {
    height: 6.5rem;
    width: 33%;
    max-width: 33%;
    min-width: 33%;
    width: -webkit-calc(33.3333333% - 1px);
    width: 33%;
    border-bottom: 1px solid #E5E7EB;
    border-right: 1px solid #e5e7eb;
    float: left;
    margin: 0 0;
    overflow: hidden;
}
.game-list.grid .game-list-span {
    display: block;
    height: auto;
    width: 4rem;
    margin: 0 auto;
    padding: 0 0 ;
}
.game-list.grid .game-list-span.desc {
    min-width: 100%;
    max-width: 100%; /*override*/
    width: 100%;
}
.game-list.grid img {
    margin: 0 0;
}
.game-list.grid label {
    /*width: 100%;*/
    margin: 0 0.5rem;
    text-align: center;
}
.game-list.tag-list li {
    height: 4rem;
    line-height: 4rem;
}
.tag-list {
    margin-bottom: 0;
}
.game-list.tag-list .game-list-span.right-mark {
    width: auto;
    line-height: 3rem;
    color: #CCC;
    margin-right: 1rem;
}

.game-list > .load-next-page {
    height: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    font-size: .9rem;
    color: #999;
    padding: 0 0 .5rem 0;
    display: none;
}
.game-list > .load-next-page.active {
    display: block;
}
.game-list > .load-next-page > img,
.game-list > .load-next-page > span {
    display: inline-block;
    height: 1.5rem;
    margin: 0 .25rem;
}
.game-list > .load-next-page > span {
    vertical-align: super;
}
