/* 
<div class="fotos">
  <div class="foto">
    <div class="imageContainer">
      <img class="imageVertical" />
    </div>
    <div class="fotoTitle"></div>
  </div>
</div>  
*/

.fotos
{
  overflow: hidden;
  border-bottom: 1px solid #d8e5f5;
  padding: 5px 3px;
  _zoom: 1;
  text-align:center;
}

.foto
{
  float: left;
  margin: 0 2px;
}
.fotoTitle
{
  display: block;
  width: 120px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  color: #05488a;
  padding: 10px;
  /*
  _padding: 10px 0px;  om te voorkomen dat de laatste letters van de laatste title op de volgende regel zichtbaar zijn... 
  */
}
.imageContainer
{
  background: #f1f7ff;
  text-align: center;
  width:132px;
  /*width: 136px;*/
  height: 80px;
  border:4px solid #f1f7ff;
  overflow:hidden;
  /*
  _width: 139px;  
  om te voorkomen dat de laatste letters van de laatste title op de volgende regel zichtbaar zijn... 
  */
}

.imageHorizontal
{
  width: 120px;
  height: 90px;
  background: #ddd;
  margin-top: 25px;
}
.imageVertical
{
  margin-top: 10px;
  width: 90px;
  height: 120px;	   
  background: #ddd;
}

.imageContainer img 
{
  /*width: 140px; height: 140px;*/
}