#showList{
 border-radius: 12px;
 padding: 1em;
 margin: 1em;
 left: 1em;
 position: relative;
 height: 100%;
 overflow: hidden;
 vertical-align: bottom;
 display: table-row;
}

.showListImage{
 //border-style: ridge;
 //border-color: Rgba(0,0,0,1);
 //border-width: x-large;
 position: relative;
 left: 1em;
 margin: 5px;
 padding: 0px;
 vertical-align: top;
 float: left;
 display: inline;
 -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  /* ...and now for the proper property */
  transition:.5s;
}

.showListImage:hover{
 //border-color: white
}

.showListItemBox{
 width: 208px;
 float: left;
 margin: 5px;
 vertical-align: bottom;
 text-align: center;
 overflow: hidden;
 display: table-cell;
 height: 100%;
 position: relative;
}

.showListItem{
/* Use for when many shows are contained within a 
 * single image: i.e. for a season.
 */
 //border: 2px ridge black;
 //border-size: x-large;
 border-radius: 12px;
 width: 200px;
 margin: 5px;
 text-align: center;
 overflow: hidden;
 display: table-cell;
 height: 100%;

}

/* We need this because we're using the strict dtd */

.showListItem img{
 background-color: rgba(255,255,255,1);
 display: block;
 opacity: 0.9;
  filter:alpha(opacity=80);
  filter: sepia(90%);
  filter: grayscale(80%);
 -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  /* ...and now for the proper property */
  transition:.5s;
}

#showListLinkBox {
 background-color: rgba(150,0,0,0.8);
}


.showListItem:hover > img{
 opacity: 1.0;
 filter:alpha(opacity=100);
  filter: sepia(0%);
  filter: grayscale(0%);
 -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  /* ...and now for the proper property */
  transition:.5s;
}



.showListItem img:hover{
  opacity: 1.0;
  filter:alpha(opacity=100);
  filter: sepia(0%);
  filter: grayscale(0%);
 -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  /* ...and now for the proper property */
  transition:.5s;
}


.showListItem a {
 text-decoration: none;
 text-align: center;
 color: rgba(255, 166, 130, 1);
 position: relative;
 border-radius: 12px;
 -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  /* ...and now for the proper property */
  transition:.5s;
}

.showListItem a:visited {
 color: rgba(200, 116, 83, 1);
}

.showListItem a:hover {
 text-shadow: white 0 0 1em, white 1px 1px 2em, white -1px -1px 2em;
 color: rgba(255, 200, 180, 1);
}

.showListItem img {
 border-radius: 12px;
}