#arena.stone>.player.minskin[data-position='4']{top:calc(100% - 305px);left:calc(100% - 120px);}
#arena.stone>.card[data-position='4']{top:calc(100% - 297px);left:calc(100% - 112px);}
#arena.stone>.popup[data-position='4']{top:calc(100% - 340px);left:calc(100% - 112px);}
#arena.stone>.player.minskin[data-position='6']{top:calc(100% - 305px);left:calc(100% - 260px);}
#arena.stone>.card[data-position='6']{top:calc(100% - 297px);left:calc(100% - 252px);}
#arena.stone>.popup[data-position='6']{top:calc(100% - 340px);left:calc(100% - 252px);}
#arena.stone>.player.minskin[data-position='7']{top:calc(100% - 305px);left:140px;}
#arena.stone>.card[data-position='7']{top:calc(100% - 297px);left:148px;}
#arena.stone>.popup[data-position='7']{top:calc(100% - 340px);left:148px;}
#arena.stone>.player.minskin[data-position='5']{top:calc(100% - 305px);left:0;}
#arena.stone>.card[data-position='5']{top:calc(100% - 297px);left:8px;}
#arena.stone>.popup[data-position='5']{top:calc(100% - 340px);left:8px;}

#arena.stone>.player.minskin[data-position='9']{top:30px;left:calc(100% - 120px);}
#arena.stone>.card[data-position='9']{top:38px;left:calc(100% - 112px);}
#arena.stone>.popup[data-position='9']{top:160px;left:calc(100% - 112px);}
#arena.stone>.player.minskin[data-position='11']{top:10px;left:calc(100% - 260px);}
#arena.stone>.card[data-position='11']{top:18px;left:calc(100% - 252px);}
#arena.stone>.popup[data-position='11']{top:140px;left:calc(100% - 252px);}
#arena.stone>.player.minskin[data-position='10']{top:10px;left:140px;}
#arena.stone>.card[data-position='10']{top:18px;left:148px;}
#arena.stone>.popup[data-position='10']{top:140px;left:148px;}
#arena.stone>.player.minskin[data-position='8']{top:30px;left:0;}
#arena.stone>.card[data-position='8']{top:38px;left:8px;}
#arena.stone>.popup[data-position='8']{top:160px;left:8px;}
#arena:not(.chess).mobile>.player[data-position='0']>.name{
    top:30px;
}
#arena .player>.name{
    top:36px;
}
#arena.slim_player .player>.name{
    top:33px;
}
#arena .player.linked>.name{
    transform: rotate(90deg) translate(120px,-96px);
}
#arena .player.linked>.name.name2{
    transform: rotate(90deg) translate(98px,-31px);
}

.player>.identity.menubutton.round{
    padding: 0;
    transform: scale(1.2) translate(-2px,2px);
}
.card .wunature{
	top:74px;
	left:6px;
    right: auto;
}
.player .equips{
    z-index: 4;
}

#arena:not(.chess).mobile .player[data-position='0']:not(.minskin)>.identity{
    left: 102px;
    top: -7px;
}

#deck-builder{
    overflow: hidden;
}
#deck-builder>.shadowed.list{
    width: 200px;
    height: 100%;
    right: 0;
    top:0;
    border-radius: 0px;
    transform: translateX(200px);
    opacity: 0;
}
#deck-builder.shown>.shadowed.list{
    transform: none;
    opacity: 1;
}
#deck-builder>.shadowed.list>.menubutton.large.create{
    position: absolute;
    bottom: 10px;
    left: auto;
    right: 10px;
    margin: 0;
    padding: 0;
    width: 180px;
    height: 50px;
    font-size: 36px;
    line-height: 50px;
    z-index: 2;
}
#deck-builder>.shadowed.list>.list-container{
    width:100%;
    left:0;
    height: calc(100% - 60px);
    overflow-y: scroll;
    overflow-x: visible;
    text-align: left;
}
#deck-builder>.shadowed.list>.list-container:not(.deck){
    z-index: 1;
}
#deck-builder>.shadowed.list>.list-container.deck{
    pointer-events: none;
    opacity: 0;
}
#deck-builder>.shadowed.list>.list-container.deck.shown{
    pointer-events: auto;
    opacity: 1;
}
#deck-builder>.shadowed.list>.list-container.deck>.card{
    zoom:0.8;
    margin-bottom: 15px;
    margin-top: 0;
    transition: all 0s;
}
#deck-builder>.shadowed.list>.list-container.deck>.card:nth-child(2n+1){
    margin-left: 15px;
}
#deck-builder>.shadowed.list>.list-container.deck>.card:nth-child(2n){
    margin-left: 7px;
}
#deck-builder>.shadowed.list>.list-container.deck>.card:first-child,
#deck-builder>.shadowed.list>.list-container.deck>.card:first-child+div{
    margin-top: 15px;
}
.deckitem{
    position: relative;
    width: 170px;
    margin-left: 15px;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 15px;
    margin-bottom: 0px;
    text-align: left;
    font-size:24px;
	line-height:30px;
	font-family:'xinwei';
    border-radius: 40px 4px 4px 40px;
    background-size: cover;
    white-space: nowrap;
    transition: all 0s;
}
.deckitem.random{
    border-radius: 4px;
    text-align: center;
}
.deckitem.random>span{
    margin-left: 0;
}
.deckitem:last-child{
    margin-bottom: 15px;
}
.deckitem>span{
    margin-left: 46px;
}
.deckitem>.menubutton.round{
    position: absolute;
    left: -1px;
    top: -2px;
    width: 34px;
    height: 34px;
}
#deck-builder>.shadowed.career{
    width: 240px;
    height: 240px;
    right: 220px;
    bottom: 20px;
    opacity: 0;
    transform: scale(0) translateX(300px);
    transform-origin: right bottom;
    transition-duration: 0.3s;
    z-index: 8;
}
#deck-builder>.shadowed.career.shown{
    transform: scale(1) translateX(0);
    opacity: 1;
}
#deck-builder>.shadowed.career>div{
    width: 80px;
    height: 80px;
    margin: 0;
    padding: 0;
    position: relative;
    display: inline-block;
}
#deck-builder>.shadowed.career>div>.menubutton.round{
    left: 15px;
    top: 5px;
}
#deck-builder>.shadowed.career>div>.text{
    font-size: 12px;
    width: 100%;
    text-align: center;
    top: 58px;
}
#deck-builder>.dialog.fixed{
    left: auto;
    right: 240px;
    width: calc(100% - 280px);
    /*opacity: 0;*/
    animation: none;
    -webkit-animation:none;
    /*transform: scale(0.8);*/
    /*pointer-events: none;*/
    /*-webkit-animation:dialog_start2 0.5s;*/
    transition: all 0.5s;
}
#deck-builder:not(.shown)>.dialog.fixed{
    opacity: 0;
    transform: scale(0.8);
    pointer-events: none;
}
#deck-builder>.dialog.fixed.shown{
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
}
#deck-builder>.controls{
    opacity: 0;
    height: 50px;
    width: calc(100% - 200px);
    bottom: 10px;
    left: 0;
    text-align: right;
    z-index: 9;
    pointer-events: none;
}
#deck-builder>.controls>div{
    position: relative;
    margin-top:5px;
    margin-left: 5px;
    margin-right: 5px;
}
#deck-builder>.controls>.card-count{
    position: absolute;
    width: 100px;
    height: 100%;
    left: calc(50% - 50px);
    text-align: center;
    font-family: 'xinwei';
    font-size: 24px;
    line-height: 50px;
    margin: 0;
}
#deck-builder>.controls>div:last-child{
    margin-right: 40px;
    white-space: nowrap;
     -webkit-user-select: text;
}
#deck-builder>.controls.shown{
    opacity: 1;
    pointer-events: auto;
}
#arena>.player.stone_deck{
    transform: scale(1) translateX(100px);
    opacity: 0;
    transition: all 0.5s;
    left: calc(5% + 50px);
    top:calc(50% - 90px);
}
#arena>.player.stone_deck.shown{
    transform: scale(0.8);
    opacity: 1;
}
#arena>.player.stone_deck.shown.removing{
    transform: scale(0.6) translateX(-100px);
}
#arena>.player.stone_deck>div:not(.avatar):not(.avatar2){
    display: none !important;
}

#arena>.skillbar{
    width: 65px;
    height: 65px;
    border-radius: 100%;
    font-size: 55px;
    font-family: 'huangcao';
    top:calc(50% - 110px);
    line-height: 65px;
    text-align: center;
}
#arena>.skillbar.left{
    left:0;
    right: auto;
}
#arena>.skillbar.right{
    right:0;
    left:auto;
}
#arena>.skillbar>div{
    border-radius: 100%;
    width: 55px;
    height: 55px;
    position: absolute;
    margin: 0;
    padding: 0;
    left: 5px;
    top: 5px;
    overflow: hidden;
}
#arena>.skillbar>.skillbarshadow{
    box-shadow: 0px 0px 8px #222 inset;
    z-index: 1;
}
#arena>.skillbar>.skillbarfill>div{
    box-shadow: 0px 0px 10px #555 inset,rgba(0, 0, 0, 0.05) 0 0 0 1px;
    width: 200%;
    height: 200%;
    position: absolute;
    margin: 0;
    padding: 0;
    background-color: rgba(63, 119, 173,1);
    left: -50%;
    top: 100%;
}
#arena>.skillbar.full>.skillbarfill>div{
    box-shadow: none;
    background-color: red;
}
#arena>.skillbar.full{
    /*transform: scale(1.1);*/
    /*box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px;
    -webkit-animation:skillbarglow 3s infinite;*/
}
#arena>.skillbar>.skillbartext{
    font-family: 'xinwei';
    font-size: 35px;
    width: 100%;
    text-align: center;
    height: 35px;
    line-height: 40px;
    overflow: visible;
    margin: 0;
    padding: 0;
    left: 0;
    top: 15px;
    z-index: 2;
    opacity: 0;
}
/*#arena>.skillbar>.skillbartext:hover{
    opacity: 1;
}*/
@-webkit-keyframes skillbarglow{
	0%{box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px}
	50%{box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px,rgba(255, 0, 0, 0.4) 0 0 5px,
        rgba(255, 0, 0, 0.4) 0 0 12px, rgba(255, 0, 0, 1) 0 0 30px, rgba(255, 0, 0, 0.2) 0 0 30px}
	100%{box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 1px, rgba(255, 0, 0, 0.4) 0 0 5px}
}

div[data-career='mage']{
    background-image: url('../../../image/card/stone_mage.png');
    background-size:cover;
}
div[data-career='druid']{
    background-image: url('../../../image/card/stone_druid.png');
    background-size:cover;
}
div[data-career='hunter']{
    background-image: url('../../../image/card/stone_hunter.png');
    background-size:cover;
}
div[data-career='shaman']{
    background-image: url('../../../image/card/stone_shaman.png');
    background-size:cover;
}
div[data-career='paladin']{
    background-image: url('../../../image/card/stone_paladin.png');
    background-size:cover;
}
div[data-career='rogue']{
    background-image: url('../../../image/card/stone_rogue.png');
    background-size:cover;
}
div[data-career='priest']{
    background-image: url('../../../image/card/stone_priest.png');
    background-size:cover;
}
div[data-career='warrior']{
    background-image: url('../../../image/card/stone_warrior.png');
    background-size:cover;
}
div[data-career='warlock']{
    background-image: url('../../../image/card/stone_warlock.png');
    background-size:cover;
}
div[data-career='knight']{
    background-image: url('../../../image/card/stone_knight.png');
    background-size:cover;
}