.dice__scene{width:70px;height:70px;-webkit-perspective:210px;perspective:210px}

#dice__cube{position:relative;width:100%;height:100%;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform:translateZ(-35px);transform:translateZ(-35px);-webkit-transition:-webkit-transform ease;transition:-webkit-transform ease;transition:transform ease;transition:transform ease,-webkit-transform ease;-webkit-transition-duration:.5s;transition-duration:.5s}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube{-webkit-transform-style:flat;transform-style:flat;-webkit-transform:none!important;transform:none!important}

}


#dice__cube.show-front{-webkit-transform:translateZ(-35px) rotateY(0);transform:translateZ(-35px) rotateY(0)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube.show-front .dice__side--front{display:block}

}

#dice__cube.show-front.show-same{-webkit-animation:showSameFont .5s ease;animation:showSameFont .5s ease}

#dice__cube.show-right{-webkit-transform:translateZ(-35px) rotateY(-90deg);transform:translateZ(-35px) rotateY(-90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube.show-right .dice__side--right{display:block}

}

#dice__cube.show-right.show-same{-webkit-animation:showSameRight .5s ease;animation:showSameRight .5s ease}

#dice__cube.show-back{-webkit-transform:translateZ(-35px) rotateY(-180deg);transform:translateZ(-35px) rotateY(-180deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube.show-back .dice__side--back{display:block}

}

#dice__cube.show-back.show-same{-webkit-animation:showSameBack .5s ease;animation:showSameBack .5s ease}

#dice__cube.show-left{-webkit-transform:translateZ(-35px) rotateY(90deg);transform:translateZ(-35px) rotateY(90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube.show-left .dice__side--left{display:block}

}

#dice__cube.show-left.show-same{-webkit-animation:showSameLeft .5s ease;animation:showSameLeft .5s ease}

#dice__cube.show-top{-webkit-transform:translateZ(-35px) rotateX(-90deg);transform:translateZ(-35px) rotateX(-90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube.show-top .dice__side--top{display:block}

}

#dice__cube.show-top.show-same{-webkit-animation:showSameTop .5s ease;animation:showSameTop .5s ease}

#dice__cube.show-bottom{-webkit-transform:translateZ(-35px) rotateX(90deg);transform:translateZ(-35px) rotateX(90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube.show-bottom .dice__side--bottom{display:block}

}

#dice__cube.show-bottom.show-same{-webkit-animation:showSameBottom .5s ease;animation:showSameBottom .5s ease}

.dice__side{position:absolute;width:100%;height:100%;background-size:100% auto;background-position:center;background-repeat:no-repeat;background-color:#fff;box-shadow:inset 0 0 7px rgba(0,0,0,.1);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.dice__side{display:none;-webkit-transform:none!important;transform:none!important}

}

.dice__side--front{-webkit-transform:rotateY(0) translateZ(35px);transform:rotateY(0) translateZ(35px);background-image:url(../assets/images/dice-1.png)}

.dice__side--back{-webkit-transform:rotateY(180deg) translateZ(35px);transform:rotateY(180deg) translateZ(35px);background-image:url(../assets/images/dice-6.png)}

.dice__side--right{-webkit-transform:rotateY(90deg) translateZ(35px);transform:rotateY(90deg) translateZ(35px);background-image:url(../assets/images/dice-4.png)}

.dice__side--left{-webkit-transform:rotateY(-90deg) translateZ(35px);transform:rotateY(-90deg) translateZ(35px);background-image:url(../assets/images/dice-3.png)}

.dice__side--top{-webkit-transform:rotateX(90deg) translateZ(35px);transform:rotateX(90deg) translateZ(35px);background-image:url(../assets/images/dice-2.png)}

.dice__side--bottom{-webkit-transform:rotateX(-90deg) translateZ(35px);transform:rotateX(-90deg) translateZ(35px);background-image:url(../assets/images/dice-5.png)}




@-webkit-keyframes showSameFont{100%{-webkit-transform:translateZ(-35px) rotateY(360deg);transform:translateZ(-35px) rotateY(360deg)}

}

@keyframes showSameFont{100%{-webkit-transform:translateZ(-35px) rotateY(360deg);transform:translateZ(-35px) rotateY(360deg)}

}

@-webkit-keyframes showSameRight{100%{-webkit-transform:translateZ(-35px) rotateY(-450deg);transform:translateZ(-35px) rotateY(-450deg)}

}

@keyframes showSameRight{100%{-webkit-transform:translateZ(-35px) rotateY(-450deg);transform:translateZ(-35px) rotateY(-450deg)}

}

@-webkit-keyframes showSameBack{100%{-webkit-transform:translateZ(-35px) rotateY(-540deg);transform:translateZ(-35px) rotateY(-540deg)}

}

@keyframes showSameBack{100%{-webkit-transform:translateZ(-35px) rotateY(-540deg);transform:translateZ(-35px) rotateY(-540deg)}

}

@-webkit-keyframes showSameLeft{100%{-webkit-transform:translateZ(-35px) rotateY(450deg);transform:translateZ(-35px) rotateY(450deg)}

}

@keyframes showSameLeft{100%{-webkit-transform:translateZ(-35px) rotateY(450deg);transform:translateZ(-35px) rotateY(450deg)}

}

@-webkit-keyframes showSameTop{100%{-webkit-transform:translateZ(-35px) rotateX(-450deg);transform:translateZ(-35px) rotateX(-450deg)}

}

@keyframes showSameTop{100%{-webkit-transform:translateZ(-35px) rotateX(-450deg);transform:translateZ(-35px) rotateX(-450deg)}

}

@-webkit-keyframes showSameBottom{100%{-webkit-transform:translateZ(-35px) rotateX(450deg);transform:translateZ(-35px) rotateX(450deg)}

}

@keyframes showSameBottom{100%{-webkit-transform:translateZ(-35px) rotateX(450deg);transform:translateZ(-35px) rotateX(450deg)}

}


.dice__scene2{width:70px;height:70px;-webkit-perspective:210px;perspective:210px}

#dice__cube2{position:relative;width:100%;height:100%;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform:translateZ(-35px);transform:translateZ(-35px);-webkit-transition:-webkit-transform ease;transition:-webkit-transform ease;transition:transform ease;transition:transform ease,-webkit-transform ease;-webkit-transition-duration:.5s;transition-duration:.5s}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube2{-webkit-transform-style:flat;transform-style:flat;-webkit-transform:none!important;transform:none!important}

}


#dice__cube2.show-front{-webkit-transform:translateZ(-35px) rotateY(0);transform:translateZ(-35px) rotateY(0)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube2.show-front .dice__side--front{display:block}

}

#dice__cube2.show-front.show-same{-webkit-animation:showSameFont .5s ease;animation:showSameFont .5s ease}

#dice__cube2.show-right{-webkit-transform:translateZ(-35px) rotateY(-90deg);transform:translateZ(-35px) rotateY(-90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube2.show-right .dice__side--right{display:block}

}

#dice__cube2.show-right.show-same{-webkit-animation:showSameRight .5s ease;animation:showSameRight .5s ease}

#dice__cube2.show-back{-webkit-transform:translateZ(-35px) rotateY(-180deg);transform:translateZ(-35px) rotateY(-180deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube2.show-back .dice__side--back{display:block}

}

#dice__cube2.show-back.show-same{-webkit-animation:showSameBack .5s ease;animation:showSameBack .5s ease}

#dice__cube2.show-left{-webkit-transform:translateZ(-35px) rotateY(90deg);transform:translateZ(-35px) rotateY(90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube2.show-left .dice__side--left{display:block}

}

#dice__cube2.show-left.show-same{-webkit-animation:showSameLeft .5s ease;animation:showSameLeft .5s ease}

#dice__cube2.show-top{-webkit-transform:translateZ(-35px) rotateX(-90deg);transform:translateZ(-35px) rotateX(-90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube2.show-top .dice__side--top{display:block}

}

#dice__cube2.show-top.show-same{-webkit-animation:showSameTop .5s ease;animation:showSameTop .5s ease}

#dice__cube2.show-bottom{-webkit-transform:translateZ(-35px) rotateX(90deg);transform:translateZ(-35px) rotateX(90deg)}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){#dice__cube2.show-bottom .dice__side--bottom{display:block}

}

#dice__cube2.show-bottom.show-same{-webkit-animation:showSameBottom .5s ease;animation:showSameBottom .5s ease}

.dice__side2{position:absolute;width:100%;height:100%;background-size:100% auto;background-position:center;background-repeat:no-repeat;background-color:#fff;box-shadow:inset 0 0 7px rgba(0,0,0,.1);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}

@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.dice__side2{display:none;-webkit-transform:none!important;transform:none!important}

}

.dice__side--front{-webkit-transform:rotateY(0) translateZ(35px);transform:rotateY(0) translateZ(35px);background-image:url(../assets/images/dice-1.png)}

.dice__side--back{-webkit-transform:rotateY(180deg) translateZ(35px);transform:rotateY(180deg) translateZ(35px);background-image:url(../assets/images/dice-6.png)}

.dice__side--right{-webkit-transform:rotateY(90deg) translateZ(35px);transform:rotateY(90deg) translateZ(35px);background-image:url(../assets/images/dice-4.png)}

.dice__side--left{-webkit-transform:rotateY(-90deg) translateZ(35px);transform:rotateY(-90deg) translateZ(35px);background-image:url(../assets/images/dice-3.png)}

.dice__side--top{-webkit-transform:rotateX(90deg) translateZ(35px);transform:rotateX(90deg) translateZ(35px);background-image:url(../assets/images/dice-2.png)}

.dice__side--bottom{-webkit-transform:rotateX(-90deg) translateZ(35px);transform:rotateX(-90deg) translateZ(35px);background-image:url(../assets/images/dice-5.png)}
