/**
 * @Project VIDEO CLIPS AJAX 3.x
 * @Author PHAN TAN DUNG (phantandung92@gmail.com)
 * @Copyright (C) 2013 PHAN TAN DUNG. All rights reserved
 * @Createdate Dec 08, 2013, 09:57:59 PM
 */

.clipBreakLine{clear: both;}
#mesHide{position:absolute;left:50%;top:50%;display:none;z-index:-1;width:150px;border:1px #51A8FF solid;background:#C4E1FF;padding:6px;margin-left: -75px;margin-top: -30px;}
.marginbottom10{margin-bottom:10px}
.marginbottom15{margin-bottom:15px}

/* List video */
.otherClips{margin-left: -5px;margin-right: -5px;}
.otherClips .otherClipsContent{width:25%;float:left;margin-bottom:15px;padding-left: 5px;padding-right: 5px;}
.otherClips.cThree .otherClipsContent{width:33.3333333333333%;}
.otherClips.cTwo .otherClipsContent{width:50%;}
.otherClips.cOne .otherClipsContent{width:100%;}
.otherClips .ctn1{}
.otherClips .ctn2{}
.otherClips .ctn3{font-size: 0.85em;}
.otherClips .ctn3 img{width: 100%;}
.otherClips .vImg{position: relative;display: block;}
.otherClips .play{position:absolute;left:50%;top:50%;height:32px;width: 32px;background:transparent url(../images/video-clip/play.png) no-repeat center center;text-align:center;margin-left: -16px;margin-top: -16px;}
.otherClips .vtitle{font-weight: 700;line-height: 16px;margin-top: 5px;max-height: 32px;overflow: hidden;}
.otherClips .vtitle a{text-decoration:none}
.otherClips .viewHits{color:#666}
.otherClips .viewHits span{font-weight:700}
.otherClips .generate_page{text-align:center;border:1px #d6d6d6 solid;padding:1px;background:#fff;margin-top:15px}
.otherClips .generate_page .ctn3{background:#f1f1f1;padding:4px;}
.detailContent{position:relative}
.detailContent .videoplayer{background:#3f3f3f;position:relative}
.detailContent .videoplayer .cont{background:#000 url(../images/video-clip/wait.gif) no-repeat center center;position:absolute;left: 0;top: 0;width: 100%;height: 100%;}
.detailContent .video-player-frame,
.detailContent .video-player-html5{display:block;width:100%;height:100%;border:0;background:#000;}
.detailContent .video-player-html5{object-fit:contain;}
.detailContent .videoTitle{margin-bottom:10px}
.youtube-player-facade{position:relative;display:block;width:100%;height:100%;margin:0;padding:0;overflow:hidden;border:0;background:#000;cursor:pointer;}
.youtube-player-poster{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:contrast(1.03) saturate(1.03);}
.youtube-player-play{position:absolute;left:50%;top:50%;display:flex;align-items:center;justify-content:center;width:74px;height:52px;margin:-26px 0 0 -37px;border-radius:14px;background:#ff0033;color:#fff;font-size:24px;box-shadow:0 8px 24px rgba(0,0,0,.28);transition:transform .2s ease,background .2s ease;}
.youtube-player-play em{margin-left:3px;}
.youtube-player-facade:hover .youtube-player-play,.youtube-player-facade:focus .youtube-player-play{background:#d9002b;transform:scale(1.06);}
.youtube-player-facade:focus{outline:3px solid #07599c;outline-offset:-3px;}

/* Detail video */
.videoInfo{background:#fff;position:relative;border:1px #d6d6d6 solid;padding:1px}
.videoInfo .cont{background:#f1f1f1;position:relative;padding:2px}
.videoInfo .cont .cont2{height:56px;font-size: 0.75em;}
.videoInfo .cont .fCont{position:relative}
.videoInfo .cont .fl{position:absolute;top:4px;left:4px}
.videoInfo .cont .fr{position:absolute;top:4px;right:4px;text-align:right}
.videoInfo .shareFeelings{margin-bottom:8px;height:12px}
.videoInfo a.likeButton{display:inline-block;background:#E1E1E1;border:1px #d6d6d6 solid;padding:5px 10px;text-decoration:none;color:#5B5B5B;margin-right:2px;}
.videoInfo a.likeButton img.likehit{background:transparent url(../images/video-clip/like.png) no-repeat left top;width:15px;height:14px;margin-right:4px}
.videoInfo a.likeButton img.unlikehit{background:transparent url(../images/video-clip/like.png) no-repeat left -14px;width:15px;height:14px;margin-right:4px;vertical-align:middle}
.videoInfo a.likeButton img.broken{background:transparent url(../images/video-clip/like.png) no-repeat left -28px;width:15px;height:14px;margin-right:4px;vertical-align:middle}
.videoInfo a.likeButton:hover{background:#f3f3f3;text-decoration:none}
.videoInfo div.viewcount{position:relative;color:#5B5B5B;text-align:right;margin-bottom:8px}
.videoInfo div.viewcount span{font-weight:700}
.videoInfo div.image{width:220px;position:relative;text-align:left;margin-bottom:2px;height:3px;line-height:3px}
.videoInfo div.image0{background:#ccc}
.videoInfo div.imageunlike{background:#4491b2}
.videoInfo div.image img.like{height:3px;background:#ed3056;position: relative;top:-1px}
.videoInfo div.likeDetail{width:220px;color:#5B5B5B;position:relative}
.videoInfo .likeLeft{float:left}
.videoInfo .likeRight{float:right}
.videoInfo .strong{font-weight:700}
.videoInfo .hometext{position:relative;padding:6px}
.videoInfo .bodytext{position:relative;margin-top:10px}
.videoInfo div.bodybutton{position:relative;margin-top:10px;text-align:center;font-size: 0.75em;}
.videoInfo a.bodybutton{display:inline-block;background:#E1E1E1;border:1px #d6d6d6 solid;padding:3px;text-decoration:none;color:#5B5B5B}
.videoInfo .hide{display:none}
#videoCont{margin:0 auto;}

@media (max-width: 569px){
#likeDetailWrap{display:none;}
.videoInfo div.viewcount{padding-top: 30px;}
}
@media (max-width: 400px){
#likeDetailWrap{display:none;}
.videoInfo div.viewcount{padding-top: 0;}
}
@media (max-width: 350px){
.videoInfo a.likeButton span{display:none}
}

/* Main */
.videoMain{position: relative;}
.videoMain .toggleNav{display: none;background: #E1E1E1;border: 1px #d6d6d6 solid;padding: 5px 10px;text-decoration: none;color: #5B5B5B;margin-bottom: 10px;}
.videoMain .col1{width:170px;float:left}
.videoMain .col2{padding-left:180px;}
.videoMain.mobile .toggleNav{display: block;}
.videoMain.mobile .col1{width:100%;display: none;position: absolute;z-index: 10;top: 30px;left: 0;background: #fff;box-shadow: 1px 1px 2px rgba(0,0,0, 0.175);}
.videoMain.mobile .col1.open{display: block;}
.videoMain.mobile .col2{padding-left:0;}
.videoMain .col1 .topicList{display:block;padding:5px 0;border-bottom:1px #dadada dotted;text-indent:10px}
.videoMain .col1 .topicList.current{background:url('../images/video-clip/current.png') no-repeat right center;color:#fff}
.videoMain.mobile .col1 .topicList.current{background-image:none;color:inherit;font-weight: 700;}
.videoMain .col1 .topicList.sub{padding-left:10px}
.videoMain .col1 .topicList.sub.current{background-image:none;color:inherit;font-weight:bold}
.videoMain .col1 .col1-sub{display:none}

/* Block, list video */
.video-clip-block{border-bottom:1px #dadada dashed;padding-bottom:10px;margin-bottom:10px}
.video-clip-block img{float:left;margin-right:10px}
.video-clip-block a{font-weight:bold}

/* Block zing style */
.zing-clip-big{position:relative}
.zing-clip-big a.img{width: 100%;display: block;}
.zing-clip-big a.img img{width:100%;}
.zing-clip-big p.icon{margin-bottom: 0;;position:absolute;bottom:10px;left:10px;display:block;background: rgba(0, 0, 0, 0.4) url(../images/video-clip/Zicons.png) 10px -1409px !important;border: 1px solid rgba(247, 247, 247, 0.41);border-radius: 3px;width: 35px;height: 35px;}
.zing-clip-big-h1{font-size:12px;line-height:18px;padding:5px;margin:0 0 10px 0;background:#0098D3}
.zing-clip-big-h1 a{display:block;color:#fff;font-weight:bold}
.zing-clip-big-h1 a:hover{text-decoration:underline}
.zing-clip-small{margin-bottom:10px;position:relative}
.zing-clip-small .img{display:block;width:100%;height:80px;overflow:hidden}
.zing-clip-small .img img{width:100%;min-height:80px}
.zing-clip-small p.icon{display: block;position: absolute;top: 28px;left: 50%;background: rgba(0, 0, 0, 0.4) url(../images/video-clip/Zicons.png) 10px -1409px !important;border: 1px solid rgba(247, 247, 247, 0.41);border-radius: 3px;width: 35px;height: 35px;margin: 0 0 0 -18px;}
.zing-clip-small h1{font-size:12px;line-height:18px;padding:5px;margin:0;background:#0098D3;height:43px;overflow:hidden}
.zing-clip-small h1 a{display:block;color:#fff;font-weight:bold}
.zing-clip-small h1 a:hover{text-decoration:underline}

/* Block video box */
.vd-blbox{margin-bottom: 10px;border: 1px #dadada solid;border-radius: 5px;}
.vd-blbox .vheader{border-bottom: 1px #dadada solid;background: rgb(238,238,238); background: -moz-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(204,204,204,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,238,238,1)), color-stop(100%,rgba(204,204,204,1))); background: -webkit-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); background: -o-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); background: -ms-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 );}
.vd-blbox .vheader .pri{display: inline-block;padding: 10px;border-radius: 5px 5px 0 0;border: 1px #dadada solid;background: #fff;margin: 5px 10px -1px 5px;border-bottom-color: #fff;}
.vd-blbox .vheader .oth{margin-right: 10px;}
.vd-blbox .vcontent{padding: 10px;}
.vd-blbox .vcontent .img{position: relative;}
.vd-blbox .vcontent .fvd{margin-bottom: 10px;padding-bottom: 10px;border-bottom: 1px #dadada solid;}
.vd-blbox .vcontent .fvd .img{width: 230px;margin-right: 10px;float: left;height: 150px;overflow: hidden;}
.vd-blbox .vcontent .fvd .img a{position: absolute;width: 230px;height: 150px;top: 0;left: 0;background: url(../images/video-clip/play.png) no-repeat 10px 10px;}
.vd-blbox .vcontent .fvd .img img{min-height: 150px;}
.vd-blbox .vcontent .fvd h3{margin: 0;margin-bottom: 5px;}
.vd-blbox .vcontent .lvd{margin-left: -5px;margin-right: -5px;}
.vd-blbox .vcontent .lvd .it{float: left;width: 20%;padding-left: 5px;padding-right: 5px;}
.vd-blbox .vcontent .lvd .it .ct h3{font: inherit;width: 100%;}
.vd-blbox .vcontent .lvd .img{width: 100%;height: 90px;overflow: hidden;margin-bottom: 7px;}
.vd-blbox .vcontent .lvd .img a{position: absolute;width: 100%;height: 90px;top: 0;left: 0;background: url(../images/video-clip/play-small.png) no-repeat 10px 10px;}
.vd-blbox .vcontent .lvd .img img{min-height: 90px;width: 100%;}

/* Modern video library inside the existing site block layout. */
.phcn-video-library{
    margin:28px 0 42px;
    color:#333;
    font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
}
.phcn-video-library-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    padding-bottom:18px;
    margin-bottom:18px;
    border-bottom:1px solid #e3e9ee;
}
.phcn-video-library-kicker{
    display:block;
    margin-bottom:5px;
    color:#07599c;
    font-size:12px;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.phcn-video-library-heading h2{
    margin:0;
    color:#333;
    font-family:inherit;
    font-size:22px;
    font-weight:700;
    line-height:1.5;
}
.phcn-video-library-heading p{
    max-width:680px;
    margin:7px 0 0;
    color:#555;
    font-family:inherit;
    font-size:14px;
}
.videoMain.phcn-video-library .toggleNav{
    display:none!important;
}
.videoMain.phcn-video-library .col1,
.videoMain.phcn-video-library.mobile .col1{
    position:static;
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    width:auto;
    margin:0 0 24px;
    float:none;
    box-shadow:none;
    background:transparent;
}
.videoMain.phcn-video-library .col1 .topicList,
.videoMain.phcn-video-library.mobile .col1 .topicList{
    display:inline-flex;
    align-items:center;
    min-height:40px;
    padding:9px 17px;
    border:1px solid #d8e2e7;
    border-radius:999px;
    background:#fff;
    color:#385363;
    font-size:14px;
    font-weight:700;
    line-height:1.2;
    text-indent:0;
    transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease;
}
.videoMain.phcn-video-library .col1 .topicList:hover{
    border-color:#07599c;
    color:#07599c;
    transform:translateY(-1px);
}
.videoMain.phcn-video-library .col1 .topicList.current,
.videoMain.phcn-video-library.mobile .col1 .topicList.current{
    border-color:#07599c;
    background:#07599c;
    color:#fff;
    background-image:none;
}
.videoMain.phcn-video-library .col1 .col1-sub{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
}
.videoMain.phcn-video-library .col2,
.videoMain.phcn-video-library.mobile .col2{
    padding-left:0;
}
.phcn-video-library .otherClips{
    margin:0;
}
.phcn-video-library .phcn-video-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:24px;
}
.phcn-video-library .otherClips .otherClipsContent,
.phcn-video-library .otherClips.cThree .otherClipsContent,
.phcn-video-library .otherClips.cTwo .otherClipsContent,
.phcn-video-library .otherClips.cOne .otherClipsContent{
    width:auto;
    margin:0;
    padding:0;
    float:none;
}
.phcn-video-library .otherClipsContent .ctn3{
    height:100%;
    overflow:hidden;
    border:1px solid #e1e8ec;
    border-radius:14px;
    background:#fff;
    box-shadow:0 8px 24px rgba(20,59,80,.07);
    font-size:14px;
    transition:transform .2s ease,box-shadow .2s ease;
}
.phcn-video-library .otherClipsContent .ctn3:hover{
    transform:translateY(-4px);
    box-shadow:0 14px 32px rgba(20,59,80,.14);
}
.phcn-video-library .otherClips .vImg{
    aspect-ratio:16/9;
    overflow:hidden;
    background:#dfe8ec;
}
.phcn-video-library .otherClips .ctn3 img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .35s ease;
}
.phcn-video-library .otherClipsContent .ctn3:hover .vImg img{
    transform:scale(1.035);
}
.phcn-video-library .otherClips .play{
    display:flex;
    align-items:center;
    justify-content:center;
    left:50%;
    top:50%;
    width:52px;
    height:52px;
    margin:-26px 0 0 -26px;
    border:2px solid rgba(255,255,255,.86);
    border-radius:50%;
    background:rgba(7,89,156,.92);
    color:#fff;
    font-size:18px;
    text-indent:3px;
    box-shadow:0 6px 20px rgba(0,0,0,.24);
}
.phcn-video-card-body{
    padding:16px 17px 15px;
}
.phcn-video-library .otherClips .vtitle{
    min-height:44px;
    max-height:44px;
    margin:0 0 12px;
    overflow:hidden;
    font-size:16px;
    font-weight:700;
    line-height:22px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
}
.phcn-video-library .otherClips .vtitle a{
    color:#1a3f5e;
}
.phcn-video-library .otherClips .vtitle a:hover{
    color:#0e2132;
}
.phcn-video-library .otherClips .viewHits{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    color:#718591;
    font-size:12px;
}
.phcn-video-library .otherClips .viewHits span{
    font-weight:500;
}
.phcn-video-library .otherClips .viewHits em{
    margin-right:4px;
    color:#07599c;
}
.phcn-video-library .otherClips .generate_page{
    margin:30px 0 0;
    padding:0;
    border:0;
    background:transparent;
    text-align:center;
}
.phcn-video-library .pagination{
    margin:0;
}
.phcn-video-library .pagination>li>a,
.phcn-video-library .pagination>li>span{
    min-width:38px;
    margin:0 3px;
    border:1px solid #d9e3e8;
    border-radius:8px;
    color:#315262;
}
.phcn-video-library .pagination>.active>a,
.phcn-video-library .pagination>.active>a:hover,
.phcn-video-library .pagination>.active>span{
    border-color:#07599c;
    background:#07599c;
    color:#fff;
}
.phcn-video-library .clipBreakLine{
    display:none!important;
}

/* Clean up the featured video and information panel on this page. */
.phcn-module-video-clip .detailContent{
    margin-bottom:30px;
    overflow:hidden;
    border-radius:16px;
    background:#fff;
    box-shadow:0 10px 34px rgba(20,59,80,.09);
}
.phcn-module-video-clip .detailContent .videoTitle{
    margin:0;
    padding:18px 22px;
    color:#333;
    font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-size:22px;
    font-weight:700;
    line-height:1.35;
}
.phcn-module-video-clip .videoInfo{
    padding:0;
    border:0;
    border-radius:0 0 16px 16px;
}
.phcn-module-video-clip .videoInfo .cont{
    padding:14px 18px;
    background:#f5f8f9;
}
.phcn-module-video-clip .videoInfo a.likeButton{
    border-color:#d7e1e5;
    border-radius:7px;
    background:#fff;
}

@media (max-width:1199px){
    .phcn-video-library .phcn-video-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
}
@media (max-width:767px){
    .phcn-video-library{margin-top:20px;}
    .phcn-video-library-heading h2{font-size:22px;}
    .phcn-video-library-heading p{font-size:14px;}
    .phcn-video-library .phcn-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;}
    .phcn-video-card-body{padding:13px;}
    .phcn-video-library .otherClips .vtitle{font-size:15px;line-height:20px;min-height:40px;max-height:40px;}
    .phcn-video-library .otherClips .play{width:44px;height:44px;margin:-22px 0 0 -22px;font-size:15px;}
    .phcn-module-video-clip .detailContent .videoTitle{padding:15px 16px;font-size:19px;}
}
@media (max-width:479px){
    .phcn-video-library .phcn-video-grid{grid-template-columns:1fr;}
    .videoMain.phcn-video-library .col1 .topicList,
    .videoMain.phcn-video-library.mobile .col1 .topicList{flex:1 1 auto;justify-content:center;padding:9px 13px;}
    .phcn-video-library .otherClips .viewHits{font-size:11px;}
}