.container{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.containerme{align-items:center}.containerme,.containermedice{display:flex;flex-wrap:nowrap;justify-content:center;flex-direction:column}.containermedice{align-items:left}.dicelabel1{align-items:left;justify-content:left;padding:0 25px;width:100px}.dicelabel1,.dicelabel2{display:flex;flex-wrap:nowrap;flex-direction:column;height:40px}.dicelabel2{align-items:right;justify-content:right;width:200px}.containermerow{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;flex-direction:row}.pad{width:429px;height:558px;background-image:url(img/Pad.png);position:relative;background-repeat:no-repeat;margin-right:30px;margin-bottom:30px}.padme{border:10px solid #20a520!important}.square{width:30px;height:40px;position:absolute}.scoremarkerempty{background:transparent!important}.scoremarker1{color:red;background:rgba(255,0,0,.4)}.scoremarker1,.scoremarker2{width:36px;height:35px;position:relative;border:3px solid;border-radius:50%}.scoremarker2{color:green;background:rgba(0,128,0,.4)}.scoremarker3{color:#00f;background:rgba(0,0,255,.4)}.scoremarker3,.scoremarker4{width:36px;height:35px;position:relative;border:3px solid;border-radius:50%}.scoremarker4{color:orange;background:rgba(255,165,0,.4)}.scoremarker5{color:#730;background:rgba(119,51,0,.4)}.scoremarker5,.scoremarker6{width:36px;height:35px;position:relative;border:3px solid;border-radius:50%}.scoremarker6{color:#00c8c8;background:rgba(0,200,200,.4)}.scoremarker7{color:#c800c8;background:rgba(200,0,200,.4)}.scoremarker7,.scoremarker8{width:36px;height:35px;position:relative;border:3px solid;border-radius:50%}.scoremarker8{color:#67f82e;background:rgba(103,248,46,.4)}.scoremarker9{color:#80ffff;background:rgba(128,255,255,.4)}.scoremarker9,.scoremarker10{width:36px;height:35px;position:relative;border:3px solid;border-radius:50%}.scoremarker10{color:#ffbf81;background:rgba(255,191,129,.4)}.square2{width:14%;height:10%;position:absolute}.scorervalue1{color:#71be61}.scorervalue1,.scorervalue2{width:100%;text-align:center;height:35px;position:relative;font-size:25px}.scorervalue2{color:#e79c1d}.scorervalue3{color:#e26431}.scorervalue3,.scorervalue4{width:100%;text-align:center;height:35px;position:relative;font-size:25px}.scorervalue4{color:#d81834}.diceselected,.dicetoselect{opacity:1;transition:margin-left .5s}.diceselected{margin-left:150px!important}.YS{background-image:url(img/YS.png)}.RS,.YS{width:50px;height:50px;position:relative}.RS{background-image:url(img/RS.png)}.RK{background-image:url(img/RK.png)}.RK,.RM{width:50px;height:50px;position:relative}.RM{background-image:url(img/RM.png)}.BM{background-image:url(img/BM.png)}.BM,.BS{width:50px;height:50px;position:relative}.BS{background-image:url(img/BS.png)}.Xanim{animation:X 6s linear forwards}@keyframes X{to{width:90px;height:90px;background-image:url(img/X.png);position:absolute;z-index:2000;opacity:.3}}.XOn{width:90px;height:90px;background-image:url(img/X.png);position:absolute;z-index:2000;opacity:.3}.buttonvisible{display:inline-block!important}.buttoninvisible{display:none!important}.hiddenclass{visibility:hidden!important}.tooltip .tooltiptext{visibility:hidden;width:120px;background-color:#000;color:#fff;text-align:center;padding:15px;border-radius:6px;position:absolute;top:-85px;left:0;z-index:1}.tooltip:hover .tooltiptext{visibility:visible}@keyframes rolloff{0%{transform:translate3d(-10000px,-50px,0) rotateX(0deg) rotateY(0deg) rotate(0deg)}to{transform:translate3d(-10000px,-50px,0) rotateX(0deg) rotateY(0deg) rotate(0deg)}}@keyframes roll{0%{transform:translateZ(0) rotateX(0deg) rotateY(0deg) rotate(0deg)}13%{transform:translate3d(0,-10px,0) rotateX(1turn) rotateY(90deg) rotate(180deg)}24%{transform:translate3d(0,-20px,0) rotateX(1turn) rotateY(180deg) rotate(1turn)}35%{transform:translate3d(0,-10px,0) rotateX(180deg) rotateY(1turn) rotate(270deg)}42%{transform:translate3d(0,-20px,0) rotateX(90deg) rotateY(180deg) rotate(180deg)}49%{transform:translate3d(0,-30px,0) rotateX(1turn) rotateY(90deg) rotate(180deg)}67%{transform:translate3d(0,-40px,0) rotateX(270deg) rotateY(0deg) rotate(90deg)}to{transform:translate3d(0,-50px,0) rotateX(0deg) rotateY(0deg) rotate(0deg)}}@keyframes roll2{0%{transform:translateZ(0) rotateX(0deg) rotateY(0deg) rotate(0deg)}13%{transform:translate3d(0,-10px,0) rotateX(1turn) rotateY(90deg) rotate(180deg)}24%{transform:translate3d(0,-20px,0) rotateX(1turn) rotateY(180deg) rotate(1turn)}35%{transform:translate3d(0,-10px,0) rotateX(180deg) rotateY(1turn) rotate(270deg)}42%{transform:translate3d(0,-20px,0) rotateX(90deg) rotateY(180deg) rotate(180deg)}49%{transform:translate3d(0,-30px,0) rotateX(1turn) rotateY(90deg) rotate(180deg)}67%{transform:translate3d(0,-40px,0) rotateX(270deg) rotateY(0deg) rotate(90deg)}to{transform:translate3d(0,-50px,0) rotateX(0deg) rotateY(0deg) rotate(0deg)}}@keyframes num1{70%{transform:rotateX(0deg) rotateY(0deg) rotate(0deg)}to{transform:rotateX(0deg) rotateY(0deg) rotate(0deg)}}@keyframes num2{70%{transform:rotateX(0deg) rotateY(0deg) rotate(0deg)}to{transform:translate3d(0,-50px,0) rotateX(-90deg) rotateY(0deg) rotate(0deg)}}@keyframes num3{70%{transform:rotateX(0deg) rotateY(0deg) rotate(0deg)}to{transform:rotateX(0deg) rotateY(-90deg) rotate(0deg)}}@keyframes num4{70%{transform:rotateX(0deg) rotateY(0deg) rotate(0deg)}to{transform:rotateX(0deg) rotateY(90deg) rotate(0deg)}}@keyframes num5{70%{transform:rotateX(0deg) rotateY(0deg) rotate(0deg)}to{transform:translate3d(0,-50px,0) rotateX(90deg) rotateY(0deg) rotate(0deg)}}@keyframes num6{70%{transform:rotateX(0deg) rotateY(0deg) rotate(0deg)}to{transform:translate3d(0,-100px,0) rotateX(180deg) rotateY(0deg) rotate(0deg)}}.rolledoff{animation:rolloff 0s linear forwards}.rolled{animation:roll 3s linear forwards}.rolled2{animation:roll2 3s linear forwards}.num1{animation:num1 3s linear 1 forwards}.num2{animation:num2 3s linear 1 forwards}.num3{animation:num3 3s linear 1 forwards}.num4{animation:num4 3s linear 1 forwards}.num5{animation:num5 3s linear 1 forwards}.num6{animation:num6 3s linear 1 forwards}.wrapper{position:relative;width:100px;padding-top:50px;margin-left:30px;margin-top:50px;margin-right:100px;perspective:2000px}#dice1 span,#dice2 span,#dice3 span,#dice4 span,#dice5 span{position:absolute;right:0;margin:25px 0 0 25px;display:block;font-size:2.5em;padding:10px}#dice1,#dice2,#dice3,#dice4,#dice5,#diceresult1,#diceresult2,#diceresult3,#diceresult4,#diceresult5{position:absolute;width:50px;height:50px;transform-style:preserve-3d}.side{position:absolute;width:50px;height:50px;border-radius:4px}#dice1 .cover,#dice1 .inner,#dice2 .cover,#dice2 .inner,#dice3 .cover,#dice3 .inner,#dice4 .cover,#dice4 .inner,#dice5 .cover,#dice5 .inner{background:#eee;backface-visibility:hidden}#dice1 .cover,#dice2 .cover,#dice3 .cover,#dice4 .cover,#dice5 .cover{border-radius:0;transform:translateZ(0);z-index:-1}#dice1 .cover.x,#dice2 .cover.x,#dice3 .cover.x,#dice4 .cover.x,#dice5 .cover.x{transform:rotateY(90deg)}#dice1 .cover.z,#dice2 .cover.z,#dice3 .cover.z,#dice4 .cover.z,#dice5 .cover.z{transform:rotateX(90deg)}#dice1 .front,#dice2 .front,#dice3 .front,#dice4 .front,#dice5 .front{transform:translateZ(25px)}#dice1 .front.inner,#dice2 .front.inner,#dice3 .front.inner,#dice4 .front.inner,#dice5 .front.inner{transform:translateZ(24px)}#dice1 .back,#dice2 .back,#dice3 .back,#dice4 .back,#dice5 .back{transform:rotateX(-180deg) translateZ(25px)}#dice1 .back.inner,#dice2 .back.inner,#dice3 .back.inner,#dice4 .back.inner,#dice5 .back.inner{transform:rotateX(-180deg) translateZ(24px)}#dice1 .right,#dice2 .right,#dice3 .right,#dice4 .right,#dice5 .right{transform:rotateY(90deg) translateZ(25px)}#dice1 .right.inner,#dice2 .right.inner,#dice3 .right.inner,#dice4 .right.inner,#dice5 .right.inner{transform:rotateY(90deg) translateZ(24px)}#dice1 .left,#dice2 .left,#dice3 .left,#dice4 .left,#dice5 .left{transform:rotateY(-90deg) translateZ(25px)}#dice1 .left.inner,#dice2 .left.inner,#dice3 .left.inner,#dice4 .left.inner,#dice5 .left.inner{transform:rotateY(-90deg) translateZ(24px)}#dice1 .top,#dice2 .top,#dice3 .top,#dice4 .top,#dice5 .top{transform:rotateX(90deg) translateZ(25px)}#dice1 .top.inner,#dice2 .top.inner,#dice3 .top.inner,#dice4 .top.inner,#dice5 .top.inner{transform:rotateX(90deg) translateZ(24px)}#dice1 .bottom,#dice2 .bottom,#dice3 .bottom,#dice4 .bottom,#dice5 .bottom{transform:rotateX(-90deg) translateZ(25px)}#dice1 .bottom.inner,#dice2 .bottom.inner,#dice3 .bottom.inner,#dice4 .bottom.inner,#dice5 .bottom.inner{transform:rotateX(-90deg) translateZ(24px)}.dot{position:absolute;width:12px;height:12px;border-radius:50%;background:#000;box-shadow:inset 3px 0 5px #222}.dot.center{margin:19px 0 0 19px}.dot.dtop{margin-top:5px}.dot.dleft{margin-left:34px}.dot.dright{margin-left:5px}.dot.dbottom{margin-top:34px}.dot.center.dleft{margin:19px 0 0 5px}.dot.center.dright{margin:19px 0 0 34px}