Button Comparison

A button from YeOldeInn's website. The old version is a GIF that looks straight out of GeoCities. 😁 What's below is a not-trying-very-hard (because I'm not too artistically inclined) attempt to recreate it. NB: This doesn't use the HeroQuest web font because there's no way to reasonably shove that into a jsfiddle.

HTML

<div class="center">
<img src="http://north-american.yeoldeinn.com/images/button-frozen-horror.gif">
</div>
<div class="center box">
The Frozen Horror
</div>

CSS

body {
  background: #222
}

.center {
  display: flex;
  margin: auto;
  align-items: center;
  justify-content: center;
}

.box {
  background: linear-gradient(to right, #7f4f2f, #c59156, #f8c879, #f8c879, #f8c879, #c59156, #7f4f2f);
  width: 9.25rem;
  height: 1.6rem;
  box-shadow:
    inset 1em 1em 1em -1em white,
    inset -1em -1em 1em -1em black;
  font-size: 0.9rem;
}