#video{
position: relative;
float: left;
width: 1015px;
height: 100%;
left: 50%;
margin-left: -500px;
margin-top: 27px;
margin-bottom: 60px;
}

#video_show{
  margin: 10px 0px 109px;
}
.videoblock{
float: left;
width: 196px;
background-color: #464646;
/*height: 158px;*/
margin: 2.5px;
}

.videoblock div{
color: white;
text-decoration: none;
cursor: pointer;
position: relative;
background-image: url(../images/video/video_play.png);
float: left;
    -o-transition: all .50s linear;
-webkit-transition: all .50s linear;
-moz-transition: all .50s linear;
transition: all .50s linear;
}
#videos_context{
float: left;
width: 100%;
color: #8d8d8d;
text-align: left;
font-size: 13px;
line-height: 17px;
margin-bottom: 35px;
}
.videoblock .name{
float: left;
height: 47px;
width: 100%;
margin-top: 0;
text-align: center;
position: absolute;
left: 0;
bottom: 0;
background-image: url(../images/video/video_bg.png);
display: table;
overflow: hidden;
}
.videoblock .name span{
display: table-cell;
vertical-align: middle;
font-size: 14px;
line-height: 18px;
text-align: left;
padding-left: 9px;
padding-right: 6px;
}
.videoblock .main_img{
position: relative;
float: left;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    -o-transition: all .50s linear;
-webkit-transition: all .50s linear;
-moz-transition: all .50s linear;
transition: all .50s linear;

}
.videoblock .main_img img{
    width: 100%;
}
.videoblock .plays{
position: absolute;
top: 0;
left: 0;
opacity: 0;
}
#videos_play{
position: relative;
float: left;
width: 100%;
margin-bottom: 22px;	
}

.active .main_img{
    -webkit-filter: grayscale(0%) !important;
    -moz-filter: grayscale(0%) !important;
    -ms-filter: grayscale(0%) !important;
    -o-filter: grayscale(0%) !important;
    filter: grayscale(0%) !important;
    filter: none !important;
}

.active .name{
	opacity: 0 !important;
}
.active .plays{
	opacity: 1 !important;
}