section.tiles {
  text-align: center;
  font-size:0;
  margin: 20px 20px;
}
section.tiles div.tile {
  display: inline-block;
  margin: 0 1px 1px 0;
  width:250px;
  height:250px;
  overflow: hidden;
  position:relative;
  text-align:left;
  background-size: 250px 250px;
}
section.tiles div.tile div {
  position:absolute;
  color:#eee;
  padding:10px 15px;
  text-decoration: none;
  opacity:0;
  transition: opacity 0.5s;
  pointer-events: none;
}
section.tiles div.tile div.title {
  font-size:18px;
  top:0;
  left:0;
}
section.tiles div.tile div.title span {
  font-size:14px;
}
section.tiles div.tile div.date {
  font-size:14px;
  bottom:0;
  right:0;
}
section.tiles div.tile > a.overlay {
    width:100%;
    height:100%;
    position:absolute;
    background-color:#000;
    opacity:0;
    transition: opacity 0.5s;
}
section.tiles div.tile:hover > a.overlay {
    opacity:0.5;
}
section.tiles div.tile:hover > div {
    opacity:1;
}
section.tiles div.tile:hover > div {
    opacity:1;
}