.cube{transform-style:preserve-3d;transition:all .3s ease-in-out;position:absolute;transform:rotateY(-45deg)rotateX(-15deg)rotate(15deg)}.side{border:1px solid #6e6e6e;justify-content:center;align-items:center;display:flex;position:absolute}.front{background-color:#c8c8c8;transform:rotateY(0)translateZ(30px)}.back{transform:rotateY(180deg)translateZ(30px)}.right{background-color:#a4a4a4;transform:rotateY(90deg)translateZ(30px)}.left{transform:rotateY(-90deg)translateZ(30px)}.top{background-color:#e7e7e7;transform:rotateX(90deg)translateZ(30px)}.bottom{transform:rotateX(-90deg)translateZ(30px)}.front,.back,.right,.left,.top,.bottom{transition:all .5s ease-in-out}