.videopost {width:90%;position:relative;margin:0 auto 15px auto;overflow:hidden;-moz-box-shadow:1px 1px 3px 0 #444444;-webkit-box-shadow: 1px 1px 3px 0 #444444;box-shadow:1px 1px 3px 0 #444444;}
.videopost:after {padding-top: 52.25%;display: block;content: '';}
.videopost img {width:100%;}
.videopost a {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
/* fill parent */
background-color:#fff;
/* let's see it! */
color: white;
}
.videopost h3 {font-family: "Open Sans", "Arial", "Helvetica", sans-serif;;font-weight: bold;font-style: normal;z-index:5;position:absolute;overflow:hidden;background:none;bottom:12px;color:#FFF;text-decoration:none;padding:5px 5px 5px 5px;font-weight:bold;}
.videopost h3:hover {text-decoration:underline;}
span.videodate {color:#ccc;z-index:5;position:absolute;overflow:hidden;background:none;bottom:0;padding:0 5px 3px 5px;font:11px "Open Sans", "Arial", "Helvetica", sans-serif;}
.playside {position:absolute;overflow:hidden;z-index:2;width:100%;height:63%;left:0;bottom:0;background:-moz-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,0.7) 50%,#000 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(0,0,0,0)),color-stop(50%,rgba(0,0,0,0.7)),color-stop(100%,#000));background:-webkit-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,0.7) 50%,#000 100%);background:-o-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,0.7) 50%,#000 100%);background:-ms-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,0.7) 50%,#000 100%);background:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0.7) 50%,#000 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#f0000000',GradientType=0);display:block;}