die {
  background: url(dice.jpg) no-repeat;
  border-radius: 12px;
  display: inline-block;
  height: 45px;
  overflow: hidden;
  position: relative;
  transition:
      transform 0.4s,
      margin 0.3s ease-in-out;
  width: 45px;
}

die.base-arrow                { background-position:     0px     0px; }
die.base-beer                 { background-position:   -45px     0px; }
die.base-dynamite             { background-position:   -90px     0px; }
die.base-gatling              { background-position:  -135px     0px; }
die.base-shot-1               { background-position:     0px   -45px; }
die.base-shot-2               { background-position:   -45px   -45px; }
die.coward-beer               { background-position:   -90px   -45px; }
die.coward-break-arrow        { background-position:  -135px   -45px; }
die.coward-double-beer        { background-position:     0px   -90px; }
die.loudmouth-bullet          { background-position:   -45px   -90px; }
die.loudmouth-double-gatling  { background-position:   -90px   -90px; }
die.loudmouth-double-shot-1   { background-position:  -135px   -90px; }
die.loudmouth-double-shot-2   { background-position:     0px  -135px; }
die.saloon-arrow              { background-position:   -45px  -135px; }
die.saloon-dynamite           { background-position:   -90px  -135px; }
die.saloon-shot-1             { background-position:  -135px  -135px; }

#dice.base2 .base3,
#dice.base2 .base4,
#dice.base2 .base5
{
  visibility: hidden;
}
#dice.base2 .coward,
#dice.base2 .loudmouth,
#dice.base5 .coward,
#dice.base5 .loudmouth,
#dice.base4-coward .base5,
#dice.base4-coward .loudmouth,
#dice.base4-loudmouth .base5,
#dice.base4-loudmouth .coward,
#dice.base5-coward .loudmouth,
#dice.base5-loudmouth .coward
{
  display: none;
}