.ladder-S6 {
    background: radial-gradient(#a39b86, #e6e0ca);
    background-image: url("../img/ladderS7-back.jpg");
    background-size: 100% 100%;
    color: #281b07 !important;
}

.ladder-S6 .ladder-header {
    color: #63211D;
    text-align: center;
    font-weight: bold;
    height: 17vh;
    font-size: 4.5vh;
    padding-top: 4vh;
    text-shadow: 0px .5px 0px #63211D, .5px 0px 0px #63211D, 0px -.5px 0px #63211D, -.5px 0px 0px #63211D;
}

.ladder-S6 .ladder {
    overflow: hidden;
    height: 83vh;
}

/*.ladder-S6 .ladder li:nth-of-type(odd) {
    background-color:rgba(214,214,214,.4); }*/
.ladder-S6 .ladder li {
    background-color: rgba(15, 15, 43, .5);
    color: white;
    margin: 5px auto;
    border-top: 1px solid rgb(193, 143, 70);
}

.ladder-S6 .ladder .info-title {
    position: relative;
    height: 52%;
    width: 100%;
    line-height: 5.2vh;
}

.ladder-S6 .ladder .info-content {
    height: 48%;
    width: 100%;
    line-height: 4vh;
}

.ladder-S6 .ladder-my-data {
    height: 11vh;
    color: #e9e4d6;
    background-image: url('../img/s7-myself.png');
    background-position: 0 0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.ladder-S6 .ladder-user-column .ladders-number {
    font-family: inherit;
    font-size: 4vmax;
    font-weight: 400;
    text-shadow: 0 0 0 transparent;
    border: 0;
}

.ladder-S6 .ladder-user-column .border-back {
    position: absolute;
    top: 5%;
    left: 16%;
}

.ladder-S6 .ladder-user-column .portrait {
    border-width: 0;
    position: relative;
    top: 0.72vh;
    left: 0.77vw;
}

.ladder-S6 .ladder-user-column .score {
    font-family: initial;
    font-size: 3vh;
    color: inherit;
    text-shadow: 0 0 0 transparent;
}

.ladder-S6 .ladder .ladder-rank1 {
    color: #eae4b3;
    /*background-color: #8b3540 !important;*/
    background-image: url('../img/s7-firstPrice.png');
    background-position: 0 0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-top: 1px solid #331d07;
    border-bottom: 1px solid #331d07;
    margin-bottom: 10px;
}

.ladder-S6 .ladder-rank1 .ladders-number {
    color: #f1cc36;
    font-size: 6vmax
}

.ladder-S6 .ladder-rank1 .border-back {
    background-image: url("../img/border-rank1.png");
    background-size: 100% 100%;
    width: 10vmax;
    height: 7.5vmax;
    position: absolute;
    top: 5%;
    left: 0;
}

.ladder-S6 .ladder-rank1 .portrait {
    position: relative;
    top: 0.8vh;
    left: 2.85vw;
    border-width: 0;
}

.ladder-S6 .ladder .ladder-rank2 {
    color: #ededed;
    background-image: url('../img/s7-secondPrice.png');
    background-position: 0 0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-top: 1px solid #331d07;
    border-bottom: 1px solid #331d07;
    margin: 8px auto;
}

.ladder-S6 .ladder-rank2 .border-back {
    border-width: 0;
    background-image: url("../img/border-rank2.png");
    background-size: 100% 100%;
    width: 7.5vmax;
    height: 7.5vmax;
}

.ladder-S6 .ladder-rank2 .ladders-number {
    font-size: 5vmax
}

.ladder-S6 .ladder .ladder-rank3 {
    color: #ededed;
    background-image: url('../img/s7-thirdPrice.png');
    background-position: 0 0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-top: 1px solid #331d07;
    border-bottom: 1px solid #331d07;
    margin: 6px auto;
}

.ladder-S6 .ladder-rank3 .ladders-number {
    color: #864617;
    font-size: 5vmax
}

.ladder-S6 .ladder-rank3 .border-back {
    border-width: 0;
    background-image: url("../img/border-rank3.png");
    background-size: 100% 100%;
    width: 7.5vmax;
    height: 7.5vmax;
}

.ladder-S6 .helmet {
    background-image: url("../img/helmet.png");
    background-size: 100% 100%;
    width: 4vh;
    height: 5vh;
    vertical-align: middle;
    display: inline-block;
}

.ladder-S6 .medal {
    background-image: url("../img/medal.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 56%;
    height: 56%;
    margin: 35% 24%;
}

.card-hide {
    right: -62% !important;
}

.s6-option-card {
    width: 70vw;
    height: 38vh;
    position: absolute;
    top: 33vh;
    right: 0;
    color: #CEBB9E;
    z-index: 3;
    transition: all ease-in-out .7s;
}

.s6-option-card .left-label {
    width: 13%;
    height: 43%;
    position: relative;
    top: 28%;
    line-height: 2.5vh;
    float: left;
}

.s6-option-card .left-label .top-trigo {
    width: 0;
    height: 0;
    border-top: 0vh solid transparent;
    border-right: 0vh solid transparent;
    border-bottom: 3vh solid #370606;
    border-left: 6vh solid transparent;
}

.s6-option-card .left-label .bottom-trigo {
    width: 0;
    height: 0;
    border-top: 0vh solid transparent;
    border-left: 0vh solid transparent;
    border-right: 6vh solid #370606;
    border-bottom: 3vh solid transparent;
}

.s6-option-card .left-label .content {
    background-color: #370606;
}

.s6-option-card .left-label .leftArrow {
    position: relative;
    top: 19px;
    width: 35%;
    height: 100%;
    float: left;
    left: -20%;
}

.s6-option-card .right-info {
    width: 88%;
    height: 100%;
    margin-left: 12%;
    padding: 5%;
    text-align: center;
    font-size: 2.2vmax;
    border-radius: 9px 6px 6px 9px;
    background: linear-gradient(to right, #370606, #581717, #370606);
}

.s6-option-card .right-info .header {
    font-size: 2.6vmax;
    margin-bottom: 3%;
}

.s6-option-card .right-info .tips {
    font-size: 1.5vmax;
}

.s6-option-card .search {
    height: 12%;
    color: #AB8F80;
    border-style: none;
    background-color: rgba(117, 97, 95, 0.32);
    margin-top: 1%;
}

.s6-option-card .btn-zone {
    width: 96%;
    border-radius: 4px;
    margin: 3% auto 0;
    padding: 1.5%;
    background-image: url("../img/border-optionCard.png");
    background-size: 100% 100%;
}