#image-container img {
  max-height: 140px;
}

li {
  height: 140px;
  min-width: 100px;
  display: block;
  float: left;
  list-style: none;
  margin: 0 5px 5px 0;
  background-color: black;
  background-position: center center;
  background-repeat: no-repeat;
}

li img,
#status {
  -webkit-transition: opacity 0.4s;
     -moz-transition: opacity 0.4s;
      -ms-transition: opacity 0.4s;
          transition: opacity 0.4s;
}

li.is-loading {
  background-color: black;
  background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/loading.gif');
}

li.is-broken {
  background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/82/broken.png');
  background-color: #be3730;
  width: 120px;
}

li.is-loading img,
li.is-broken img {
  opacity: 0;
}

.buttons { margin-bottom: 1.0em; }

button {
  font-size: 18px;
  padding: 0.4em 0.8em;
  font-family: sans-serif;
}

#status {
  opacity: 0;
  position: fixed;
  right: 20px;
  top: 20px;
  background: hsla( 0, 0%, 0%, 0.8);
  padding: 20px;
  border-radius: 10px;
  z-index: 2; /* over other stuff */
}