/*listing*/
.videos ul{list-style:none;}
.videos li{
float:left;width:324px;height:431px;margin:0 20px 20px 0;position:relative;background:#000;display:table;
}
.videos li:nth-child(4n+4){
margin:0 0 20px 0/*4,8,12 etc*/
}
.videos .featured li{
width:690px;height:388px;margin:0 12px 20px 0;/*1*/
}
.videos .featured li:nth-child(2n+2){
margin:0 0 20px 0/*2*/
}
/*content inside listing*/
.info,.info:hover{
display:table-cell;vertical-align:bottom;position:relative;z-index:1;text-decoration:none;color:inherit
}
.info p{
margin:8px 0 0
}
.info article{
padding:16px 16px 5px 5px;position:relative;z-index:1;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;/*edit 30june, 3july*/
}
.info .ic-videoplay, .info .btn-subscribe,.info .btn-free{
margin:0 0 16px
}
.info .ic-videoplay{
margin:0 auto;visibility:hidden/*edit 30june*/
}
.info .datetiming{
position:absolute;bottom:16px;left:16px/*edit 30june*/
}
.overlay-img::before, .overlay-img-user::before{
content:"";
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.95) 95%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0.95) 95%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0.95) 95%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#e6000000',GradientType=0 ); /* IE6-9 */
}
.overlay-img,.overlay-img::before{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:0;
    overflow: hidden;
    border-radius: 8px;
}
.overlay-img-user,.overlay-img-user::before{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:0;
    overflow: hidden;
    border-radius: 8px 8px 0 0;
}
.overlay-img .time, .overlay-img-user .time{
    position:absolute;
    top:16px;
    left:16px;
    border-radius: 8px;
}
.featured-img,.featured .overlay-img{
width:690px;height:388px
}
.video-img,.overlay-img, .overlay-img-user{
width:324px;height:431px;
}

/* zoom effect toppick */
.zoom-img
{
	-webkit-transition: -webkit-transform .8s cubic-bezier(0,0,.18,.71);
    transition: -webkit-transform .8s cubic-bezier(0,0,.18,.71);
    transition: transform .8s cubic-bezier(0,0,.18,.71);
    transition: transform .8s cubic-bezier(0,0,.18,.71), -webkit-transform .8s cubic-bezier(0,0,.18,.71);
}
.info:hover .zoom-img
{
 	/*-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
    transform: scale(1.1);*/

}
/* zoom effect toppick */

/*single featured*/
.single-featured{
clear:both;position:relative;display:table;width:100%;height:507px
}
.single-featured .video-img,.single-featured .overlay-img{
width:100%;height:507px
}
.single-featured .info article{
padding:16px
}
/*hover*/
.onhover:hover .round-article{
    background:#000;
    opacity:0.7;
    height:198px;/*50%*/ /*edit 3july*/
    border-radius: 0 0 8px 8px;
}
.onhover:hover .shape-article{
    background:#000;
    opacity:0.7;
    height:198px;/*50%*/ /*edit 3july*/
}

.onhover .synopsis{
display:none;
}
.onhover:hover .synopsis {
overflow: hidden;
height: 103px;
display:block;font-size:14px;line-height:17px/*edit 30june*/
}
.onhover .info .ic-videoplay,.onhover .info .btn-subscribe,.onhover .info .btn-free{
-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)
}
.onhover:hover .info .ic-videoplay,.onhover:hover .info .btn-subscribe,.onhover:hover .info .btn-free{
-ms-transform:translateY(-20px);-webkit-transform:translateY(-20px);transform:translateY(-20px)
}
.onhover:hover .info .ic-videoplay{
margin:-128px auto 70px auto;visibility:visible/*edit 30june*/
}
.onhover:hover .info .btn-subscribe,.onhover:hover .info .btn-free{
margin:-48px 0 12px 0
}
.onhover:hover .info .btn-subscribe{
display: table !important;
}
.onhover:hover .info .btn-free{
display: table !important;
}
.onhover:hover .info .ic-videoplay{
display: block !important;
}
.onhover article{
    -webkit-transition:all 0.2s ease-out;
    -moz-transition:all 0.2s ease-out;
    -o-transition:all 0.2s ease-out;
    -ms-transition:all 0.2s ease-out;
    transition:all 0.2s ease-out;
}
.onhover .info .ic-videoplay,.onhover .info .btn-subscribe,.onhover .info .btn-free{
-webkit-transition:-webkit-transform 0.2s ease-out;-moz-transition:transform 0.2s ease-out;-o-transition:transform 0.2s ease-out;-ms-transition:transform 0.2s ease-out;transition:transform 0.2s ease-out;
}
/*lock fade*/
.lock .overlay-img,.lock .info h3,.lock .info .synopsis,.lock .info .datetiming{
opacity:0.5
}
.onhover-lock .btn-subscribe,.onhover-lock .btn-free{opacity:0}
.onhover-lock:hover .btn-subscribe,.onhover-lock:hover .overlay-img,.onhover-lock:hover .info h3,.onhover-lock:hover .info .synopsis,.onhover-lock:hover .info .datetiming,.onhover-lock:hover .btn-free{
opacity:1
}

/*1280*/
@media only screen
and (max-width: 1419px) {
/*listing*/
.videos li{
width:283px;height:377px
}
/*content inside listing*/
.video-img,.overlay-img,.overlay-img-user{
width:283px;height:377px;
}
/*single featured*/
.single-featured{height:465px}/*edit 3july*/
.single-featured .video-img,.single-featured .overlay-img,.single-featured .overlay-img-user{height:447px}
}
/*1024*/
@media only screen
and (max-width: 1259px) {
/*listing*/
.videos li{
width:299px;height:397px
}
/*content inside listing*/
.video-img,.overlay-img{
width:299px;height:397px;border-radius: 8px;
}
.overlay-img-user{
width:299px;height:397px;border-radius: 8px 8px 0 0;
}
/*single featured*/
.single-featured{height:350px}/*edit 3july*/
.single-featured .video-img,.single-featured .overlay-img,.single-featured .overlay-img-user{height:350px}
}
/*768*/
@media only screen
and (max-width: 1003px) {

.single-featured{height:260px}
.single-featured .video-img,.single-featured .overlay-img,.single-featured .overlay-img-user{height:260px}
/*.single-featured .overlay-img::before{background:none}*/

}
/*640 landscape*/
@media only screen
and (max-width: 747px) {
/*single featured*/
.single-featured{height:225px}/*edit 3july*/
.single-featured .video-img,.single-featured .overlay-img,.single-featured .overlay-img-user{height:225px}
}
/*375 portrait*/
@media only screen
and (max-width: 619px) {
/*listing*/
.videos li{
width:300px;height:400px
}
/*content inside listing*/
.video-img,.overlay-img{
width:300px;height:400px;border-radius: 8px;
}
.overlay-img-user{
width:300px;height:400px;border-radius: 8px 8px 0 0;
}
/*single featured*/
.single-featured{height:140px;}
.single-featured .video-img,.single-featured .overlay-img,.single-featured .overlay-img-user{height:140px}
.single-featured .info article{padding:10px}
.single-featured .overlay-img::before{
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 0%, rgba(0,0,0,0.95) 95%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 0%,rgba(0,0,0,0.95) 95%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 0%,rgba(0,0,0,0.95) 95%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#e6000000',GradientType=0 ); /* IE6-9 */
}
.single-featured .overlay-img-user::before{
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 0%, rgba(0,0,0,0.95) 95%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 0%,rgba(0,0,0,0.95) 95%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 0%,rgba(0,0,0,0.95) 95%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#e6000000',GradientType=0 ); /* IE6-9 */
}
/*hover*/
.onhover:hover .info .ic-videoplay{
margin:-100px auto 60px auto;visibility:visible
}
}
/*360 portrait*/
@media only screen
and (max-width: 374px) {
/*single featured*/
.single-featured{height:135px;}
.single-featured .video-img,.single-featured .overlay-img,.single-featured .overlay-img-user{height:135px}
}
/*320 portrait*/
@media only screen
and (max-width: 359px) {
/*listing*/
.videos li{
width:270px;height:360px
}
/*content inside listing*/
.video-img,.overlay-img{
width:270px;height:360px;border-radius: 8px;
}
.overlay-img-user{
width:270px;height:360px;border-radius: 8px 8px 0 0;
}
/*single featured*/
.single-featured{height:120px;}
.single-featured .video-img,.single-featured .overlay-img,.single-featured .overlay-img-user{height:120px}
}
/*less than 320*/
@media only screen 
and (max-width : 319px) {

}
