/*body {  margin: 0 auto; max-width: 500px; }*/

.cube-404 {margin: 0 auto; width:500px;}

@media screen and (max-width: 576px){
.cube-404 { width:400px; }
}

.cube-unit {
  fill-opacity: .9;
  stroke-miterlimit:0;
}

.pink-cube {
  --mainColor: #c70a2d;
  --strokeColor: #E6E6E6;
  --lightColor: #c70a2d;
  --darkColor: #c70a2d;
}

@keyframes moveX {
  to { transform: translateX(var(--translate, 35px)); }
}
@keyframes moveY {
  to { transform: translateY(var(--translate, -35px)); }
}

.m-left, .m-right { 
  animation: 2s moveX alternate infinite paused; 
}
.m-up, .m-down { 
  animation: 2s moveY alternate infinite paused; 
}
.m-left { --translate: -50px; }
.m-right { --translate: 50px; }

body:hover * { animation-play-state: running; }