.story{
    margin-right: 10px;
    margin-bottom: 10px;
    float: left;
    overflow: hidden;
    position: relative;
    height: 250px;
    border 1px solid red;
}

.story.quarter{
    width: 213.7px;
    height: 156px;
}

.story.third{
    width: 353px;
}

.story.two_thirds{
    width: 522px;
}
.story.full{
    width: 885px;
}


.story .title{
    background-color: rgba(0, 0, 0, 0.62);
    color: #ffffff;
    font-family: 'open-sans-light',sans-serif;
    font-size: 18px;
    height: 80px;
    left: 0;
    padding-left: 10px;
    padding-right: 30px;
    padding-top: 16px;
    position: absolute;
    top: 170px;
    line-height: 22px;
}

.story.third .title{
    width: 312px;
}
.story.two_thirds .title{
    width:482px;
}
.story.full .title{
    width:845px;
}
.story.quarter .title{
    font-size: 11px;
    line-height: 16px;
    padding-top: 18px;
    top: 90px;
    width: 175px;
}
.story.third img{
    height:100%;
}
.story.two_thirds img{
    width:522px;
}
.story.full img{
    width:885;
}
.story.quarter img{
    height:100%;
}
.story .readmore {
    background-color: rgba(255, 255, 255, 0.6);
    color: #FFFFFF !important;
    font-size: 10px;
    height: 11px;
    left: 180px;
    line-height: 9px;
    padding: 10px;
    position: absolute;
    top: -31px;
    white-space: nowrap;
    width: 70px;
    z-index: 3;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    transform-origin:0% 100%;
    -webkit-transform-origin:0% 100%;
    -ms-transform-origin:0% 100%;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='your_transparent.png', sizingMethod='scale');
}
.story.third .readmore{
    left: 322px; 
}
.story.two_thirds .readmore{
    left: 492px; 
}
.story.full .readmore{
    left: 855px;
}
.story.quarter .readmore{
    left:183px;
    font-size: 9px;
    padding-left: 5px;
    padding-right: 15px;
    padding-bottom: 10px;
}

#wide .story.quarter{
    width: 290px;
}
#wide .story.third{
    width: 410px;
}
#wide .story.two_thirds{
    width: 770px;
}
#wide .story.third .title{
    width: 369px;
}
#wide .story.two_thirds .title{
    width:810px;
}
#wide .story.quarter .title{
    width: 275px;
}

#wide .story img{
  display: block;
  margin: 0 auto;
}
#wide .story.third img{
    width: 410px;
    height: auto;
}
#wide .story.quarter img{
    width: 290px;
    height: auto;
}
#wide .story.two_thirds img{
    width:770px;
    height: auto;
}

#wide .story.third.wider_image img{
    width: auto;
    height: 250px;
}
#wide .story.quarter.wider_image img{
    width: auto;
    height: 250px;
}
#wide .story.two_thirds.wider_image img{
    width:auto;
    height: 250px;
}

#wide .story.third .readmore{
    left: 323px; 
    left: 380px; 
}
#wide .story.two_thirds .readmore{
    left: 492px; 
    left: 740px; 
}
#wide .story.quarter .readmore{
    left:183px;
    left:260px;
}

#wide .imageCenterer {
  width: 1000px;
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -500px;
}
.imageCenterer {
  height: 100%;
}

.story a:link, .story a:visited, .story a:hover {
    color: white !important;
    text-decoration: none;
    display: block;
    margin:0;
}