/* CSS placed here will be applied to all skins */
@keyframes wd-cube-rot {
from { transform: rotateX(-20deg) rotateY(0); }
to { transform: rotateX(-20deg) rotateY(360deg); }
}
#wd-cube-3d {
perspective: 800px;
perspective-origin: 50px 50px;
}
#wd-cube {
position: relative;
width: 100px;
height: 100px;
transform-style: preserve-3d;
animation: wd-cube-rot 2s infinite linear;
}
#wd-cube div {
position: absolute;
width: 100px;
height: 100px;
background-image: url("/ShareX/wdcube-side.png");
}
#wdcube-front {
transform: translateZ(50px);
background-image: url("/ShareX/wdcube-front.png") !important;
}
#wdcube-back {
transform: translateZ(-50px) rotateY(180deg);
}
#wdcube-left {
transform: translateX(-50px) rotateY(-90deg);
}
#wdcube-right {
transform: translateX(50px) rotateY(90deg);
}
#wdcube-top {
transform: translateY(-50px) rotateX(-90deg);
}
#wdcube-wd {
padding-left: 20px;
}