<div id="badge">
  <h1><i id="icomoon">&#xe000;</i><span>Zombtastic</span></h1>
</div>

@import url(https://fonts.googleapis.com/css?family=Ultra);

@font-face {
  font-weight: normal;
  font-style: normal;
  font-family: 'icomoon';
  src:url('http://www.nearertonever.com/mecarter/halloween-badge/fonts/icomoon.eot');
  src:url('http://www.nearertonever.com/mecarter/halloween-badge/fonts/icomoon.eot?#iefix') format('embedded-opentype'),
    url('http://www.nearertonever.com/mecarter/halloween-badge/fonts/icomoon.svg#icomoon') format('svg'),
    url('http://www.nearertonever.com/mecarter/halloween-badge/fonts/icomoon.woff') format('woff'),
    url('http://www.nearertonever.com/mecarter/halloween-badge/fonts/icomoon.ttf') format('truetype');
}

html,body {
  background: #800;
  color: #fff;
}
#badge {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -150px 0 0 -150px;
  width: 300px;
  height: 300px;
}

i {
  position: absolute;
  bottom: -62px;
  left: 9px;
  z-index: -1;
  font-size: 380px;
  line-height: 312px;
  width: 100%;
  text-align: center;
  color: #800;
  font-family: 'icomoon';
  width: 300px;
  height: 300px;
  border-radius: 50%;
  box-shadow: 0 0 3px #333;
  background: #f4f4f4;
  transform: skewY(10deg);
}

h1 {
  position: absolute;
  bottom: 62px;
  left: -9px;
  width: 328px;
  transform: skewY(-10deg);
}

h1 span {
  display: block;
  padding: 10px 20px;
  border-radius: 1px;
  background: #fff;
  box-shadow: 0 0 2px rgba(0,0,0,0.5);
  color: #800;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 1px 1px 0 #999;
  font-size: 36px;
  font-family: 'Ultra';
}

h1:before,
h1:after,
h1 span:before,
h1 span:after {
  position: absolute;
  content: '';
}
  
h1:before,
h1:after {
  top: -13px;
  z-index: -3;
  border-width: 26px;
  border-style: solid;
  border-color: #fff #fff #fff transparent;
}

h1:before {
  left: -32px;
}

h1:after {
  right: -32px;
  border-color: #fff transparent #fff #fff;
}

h1 span:before,
h1 span:after {
  top: -13px;
  z-index: -2;
  border-width: 15px 22px;
  border-style: solid;
  border-color: transparent #ccc transparent transparent;
}

h1 span:before {
  left: -23px;
}

h1 span:after {
  right: -23px;
  border-color: transparent transparent transparent #ccc;
}