body {
  font-size: 18px;
  background: #e3e1e1;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

section {
  position: relative;
  width: 400px;
  margin: 40px auto;
  box-shadow: 1px 1px 4px rgba(0,0,0,.2);
}

img {
  display: block;
  width: 100%;
}

header {
  background: #ecf0f1;
  max-height: 190px;
  background: #edeeefe6;
  overflow: hidden;
}

.left {
  padding: 30px 30px;
  float: left;
  width: 190px;   
}

.right {
  padding: 30px 0;
  float: left;
  width: 150px; 
  text-align: center;
}

#play {
  height: 40px;
  width: 40px;
  border: 0;
  background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/38816/1383113001_playback_play.png') center center no-repeat;
}

#pause {
  background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/38816/1383113014_playback_pause.png') center center no-repeat;
  height: 30px;
  width: 30px;
  border: 0;
}

h1 {
  font-size: 1.5em;
  color: #333;
}

h2 {
  margin: 5px 0; 
  color: #838787;
}