#arena.chess{
    width:100% !important;
    height:100% !important;
    left:0 !important;
    top:0 !important;
    transition:all 0s !important;
}
#arena.chess>#me,
#arena.chess>#mebg{
    bottom:0;
    top:auto;
    border-radius:0;
}

#chess-container{
    width:100%;
    height :calc(100% - 120px);
    left:0;
    top:0;
    overflow:scroll;
    text-align:center;
}
#chess{
    margin-top:36px;
    margin-bottom:36px;
    position:relative;
}
#arena .card.thrown{
    z-index:4;
}
#canvas2{
    position: absolute;
    z-index: 10;
    pointer-events: none;
}

#handcards1{
    height:120px;
    padding:0;
    top:calc(100% - 120px);
    width:calc(100% - 240px);
    left:120px;
}
#handcards2{
    display:none;
}
#mebg,#me{
    height:120px;
}

#system{
    z-index:5;
}
#arena>.dialog{
    width:400px;
    height:240px;
    left:calc(50% - 200px);
    top:calc(50% - 120px);
    background: rgba(0,0,0,0.2);
	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px;
	border-radius:8px;
}
#arena>.dialog.slim:not(.center){
    top:40px;
}
#control{
    top:calc(100% - 155px);
}
#arena.mobile #control{
    top:calc(100% - 170px);
}
.fakeme{
    width:120px;
    height:120px;
    border-radius:0px;
    top:0;
}
.fakeme.avatar{
    left:0;
    background-size:cover;
}
.fakeme.player{
    left:calc(100% - 120px);
    overflow:scroll;
    text-align:center;
}
.fakeme.player>div{
    width:45px;
    height:45px;
    background-size:cover;
    border-radius:4px;
    position:relative;
    left:0;
    top:8px;
    margin-left: 4px;
    margin-right: 4px;
    margin-bottom: 8px;
    transition:box-shadow 0.5s;
}

.fakeme.player>.selectable{
	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 1) 0 0 5px, rgba(0, 133, 255, 1) 0 0 10px;
}
.fakeme.player>.selected{
	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(255, 0, 0, 1) 0 0 5px, rgba(255, 0, 0, 1) 0 0 10px !important;
}
.fakeme.player>.dead{
    filter:grayscale(1);
    -webkit-filter:grayscale(1);
    opacity:0.5;
}
.card.drawing{
    animation: drawing2 1s;
    animation-fill-mode: forwards;
    -webkit-animation: drawing2 1s;
    -webkit-animation-fill-mode: forwards;
}

.player.playergrid{
    background: rgba(0,0,0,0.2);
	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px;
	border-radius:8px;
}
.playergrid.temp{
    opacity:0.3;
}
.chessscroll{
    height:calc(100% - 162px);
    width:20px;
    top:42px;
    z-index:1;
    position:fixed;
}
.chessscroll.left{
    left:0;
}
.chessscroll.right{
    right:0;
}
.button.forbidden{
    opacity:0.6
}
#arena.leaderhide>*:not(canvas){
    opacity:0 !important;
    transition: all 0.5s !important;
}
#arena.leadercontrol>#control{
    transition: all 0.5s !important;
}