* {
  margin: 0;
  padding: 0;
  font-size: 0;
}

body {
  background-color: #222;
}

#entries {
  margin: auto;
  text-align: center;
  margin: 0 20px;
  border-left: 1px solid #333;
}

div.entry {
  float: left;
  display: block;
  white-space: nowrap;
  width:200px;
  height: 200px;
  vertical-align: top;
  position: relative;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
}
div.entry:hover {
  opacity: 0.5;
  cursor: pointer;
}

div.entry img {
  vertical-align: top;
}

.open-entry img {
  padding-bottom: 100px;
}
.open-entry div.shadow {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: black;
  opacity: 0.4;
  width: 200px;
  height: 200px;
}
.open-entry div.details {
  display: block;
  position: absolute;
  top: 200px;
  height: 100px;
  background-color: black;

  left: -200px; /* TODO: Make dynamic */
  width: 800px; /* TODO: Make dynamic */
}

.shadow, .details {
  display: none;
}