.wrap-slider{width:100%; float:left; padding-top: 30px; display:block; padding-bottom:50px; background:var(--colorBg); background:#fff;}
.wrap-slider .colMedia{width:calc(100% - 460px); float:left; position:relative; padding-right:30px; z-index:3;}
.wrap-slider .colMedia .plyr{width:100%; float:left; position:relative; border-radius:20px; overflow:hidden; z-index:2;}
.wrap-slider .colMedia .controlVideo{right:30px}
.wrap-slider .colListMedia{width:460px; float:right; position:relative; background:#fff; border-radius:10px; padding: 20px 15px 60px 15px; box-shadow: 0 0 0 1px rgba(0,0,0,.1)}
.wrap-slider .colListMedia .slick-arrow{width:35px; height:35px; display:flex; align-items:center; justify-content:center; position:absolute; top:100%; border:1px solid rgba(0,0,0,.07); border-radius:5px; margin-top:5px; background:#f9f9f9}
.wrap-slider .colListMedia .slick-arrow:before{font-family: "Font Awesome 5"; font-weight: 400;}
.wrap-slider .colListMedia .nav-prev{left:10px;}
.wrap-slider .colListMedia .nav-prev:before{content:"\f077";}
.wrap-slider .colListMedia .nav-next{left:55px;}
.wrap-slider .colListMedia .nav-next:before{content: "\f078";}


.infoPlayer{width:100%; float:left; position:relative; background:none; border-radius: 0 0 20px 20px; margin-top:-20px; padding: 50px 0px 0px 0px}
.infoPlayer h2{font-weight:900; font-size:24px; color:#000 ; margin-bottom:15px; width:100%; float:left}
.infoPlayer .row-info{width:100%; float:left; position:relative;}
.infoPlayer .row-info .wrap-attr{float:left; position:relative; padding-left:50px;}
.infoPlayer .row-info .wrap-attr img{width:40px; border-radius:50%; position:absolute; top:0; left:0;}
.infoPlayer .row-info .wrap-attr .nameAuthor{color:var(--color1); transition:.3s;margin-top:-2px; margin-bottom:5px; font-weight:500; display:block }
.infoPlayer .row-info .wrap-attr .col-timeDate{float:left; position:relative; padding-left:22px; margin-right:15px; font-size:14px;}
.infoPlayer .row-info .wrap-attr .col-timeDate i{position:absolute; top:1px; left:0; opacity:.5; font-size:16px; }
.infoPlayer .row-info .wrap-attr .col-timeDate:last-of-type{margin-right:0;}
.infoPlayer .row-info .typeVideoHome{float:right; display:none; position:relative; text-transform:uppercase; font-size:13px; font-weight:bold; line-height:39px; height:38px; background:#fff; padding: 0 20px 0 40px; border-radius:19px; margin-right:5px;} 
.infoPlayer .row-info .typeVideoHome:before{font-family: "Font Awesome 5"; font-weight: 400; font-size:16px; padding-right:10px; position:absolute; top:0; left:15px;}
.infoPlayer .row-info .livestream{box-shadow:0 0 0 2px var(--colorLive); color:var(--colorLive)}
.infoPlayer .row-info .livestream:before{content: "\f8dd";}
.infoPlayer .row-info .livestream:after{content:'Livestream'}
.infoPlayer .row-info .clip{box-shadow:0 0 0 2px var(--colorClip); color:var(--colorClip)}
.infoPlayer .row-info .clip:before{content: "\f03d";}
.infoPlayer .row-info .clip:after{content:'Clip'}
.infoPlayer .row-info .short{box-shadow:0 0 0 2px var(--colorShort); color:var(--colorShort)}
.infoPlayer .row-info .short:before{content: "\f3a0";}
.infoPlayer .row-info .short:after{content:'Short'}

.slider-for{width:100%; float:left; position:relative;}

ul#listVideoSlider{width:100%; float:left; position:relative;margin:0 0 ; padding:0; list-style:none;}
ul#listVideoSlider li{width:100%; float:left; position:relative; margin:0px 0; }
ul#listVideoSlider li a{width:100%; float:left; position:relative; float:left; padding:15px; border-radius:7px;}
ul#listVideoSlider li a .ind{position:absolute; display:none; left:15px; top:15px; z-index:2; background:#fff; line-height:26px; height:25px; width:25px; text-align:center; border-radius:7px 0 7px 0; font-size:14px; font-weight:500;}
ul#listVideoSlider li .wrap-img{width:170px; float:left; position:relative; overflow:hidden; border-radius:7px; }
ul#listVideoSlider li .wrap-img img{width:100%; float:left; position:relative; z-index:1; }
ul#listVideoSlider li .wrap-info{width:calc(100% - 170px); float:right; position:relative; margin-top:0; padding-left:15px;}
ul#listVideoSlider li .wrap-info .nameVideo{width:100%; float:left; position:relative;font-size:16px; width:100%; font-weight:normal; float:left; margin:-5px 0 15px 0; line-height:22px; -webkit-line-clamp: 2; display: box; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow:hidden}
ul#listVideoSlider li .wrap-info .wrap-attr{float:left; position:relative; padding-left:46px;}
ul#listVideoSlider li .wrap-info .wrap-attr img{width:34px; border-radius:50%; position:absolute; top:0; left:0;}
ul#listVideoSlider li .wrap-info .wrap-attr .nameAuthor{float:left; color:var(--color1); transition:.3s; width:100%; margin-top:-5px; margin-bottom:2px; font-size:14px;}
ul#listVideoSlider li .wrap-info .wrap-attr .col-timeDate{float:left; position:relative; padding-left:18px; margin-right:15px; font-size:13px;}
ul#listVideoSlider li .wrap-info .wrap-attr .col-timeDate i{position:absolute; top:1px; left:0; opacity:.5; font-size:16px; }
ul#listVideoSlider li .wrap-info .wrap-attr .col-timeDate:last-of-type{margin-right:0;}
ul#listVideoSlider li.slick-current a{background:var(--color1); }
ul#listVideoSlider li.slick-current a .wrap-info .nameVideo{color:#fff;}
ul#listVideoSlider li.slick-current a .wrap-info .wrap-attr .nameAuthor{color:#fff;}
ul#listVideoSlider li.slick-current a .wrap-info .wrap-attr .col-timeDate{color:#fff;}
ul#listVideoSlider li.slick-current a .wrap-info .wrap-attr .col-timeDate i{color:#fff; opacity:.7}

@media (max-width:1200px){
    .wrap-slider{padding-top:0; padding-bottom:10px;}
    .wrap-slider .colMedia{width:calc(100% + 30px);padding-right:0; margin-left:-15px;}
    .wrap-slider .colMedia .plyr{border-radius:0;}
    .wrap-slider .colListMedia{width:calc(100% + 30px); margin-left:-15px; padding-bottom:70px; float:left; border-radius:0; box-shadow:none}
    .wrap-slider .colListMedia .slick-arrow{margin-top:15px;}
    .wrap-slider .colListMedia .IsAutoPlay{bottom:30px;}
    .wrap-slider .colListMedia .nav-prev:before{content:"\f053"}
    .wrap-slider .colListMedia .nav-next:before{content:"\f054"}
    .slider-for{background:#fff; margin-top:-20px; padding:20px 20px 10px 20px;}
}
@media (max-width:767px) {
    .wrap-slider{padding:0; overflow:hidden; border-bottom:10px solid var(--colorBg) }
    .wrap-slider .colMedia{width:calc(100% + 30px); margin-left:-15px;}
    .wrap-slider .colListMedia{width:calc(100% + 30px); margin-left:-15px; border-radius:0; float:left;}
    ul#listVideoSlider li .wrap-img{width:100%;}
    ul#listVideoSlider li .wrap-info{width:100%; padding-left:0; padding-top:18px;}
}


.wrap-scheduleLivestream{width:100%; float:left; position:relative; background:var(--colorBg); padding: 20px 0 }
.wrap-scheduleLivestream .inner{max-width:1300px; width:100%; border-radius:0px; display:flex; margin: 0 auto ; padding: 40px 0; position:relative; }
.wrap-scheduleLivestream .inner ul.listAuthor{width:100%; margin:0; padding:0; list-style:none; display:flex;}
.wrap-scheduleLivestream .inner ul.listAuthor li{width:33.33333333333%; position:relative; padding:0 20px; }
.wrap-scheduleLivestream .inner ul.listAuthor li a{position:absolute; top:0; left:0; width:100%; height:100%; z-index:3;}
.wrap-scheduleLivestream .inner ul.listAuthor li .avatarAuthor{width:110px; border-radius:10px; float:left;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info{width:calc(100% - 110px); float:right; padding-left:20px; position:relative;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info label{margin:-5px 0 0 0; text-transform:uppercase; font-size:13px; font-weight:500; color:var(--color3); float:left;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .totalVideo{float:right; position:absolute; top:-6px; right:0; background:var(--color3); color:#fff; line-height:20px; height:20px; border-radius:10px; padding: 0 10px; font-size:13px;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info h4{margin:0; padding:5px 0 0 0; font-size:21px; font-weight:bold; color:var(--color1); width:100%; float:left;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-label{float:left; font-size:13px; background:var(--color2) ; padding: 1px 10px; color:#fff; border-radius:4px; margin: 18px 0 0 -30px; box-shadow: 0 3px 10px rgba(0,0,0,.15)}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-data{width:100%; float:left; position:relative; margin-top:8px;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-data span{font-weight:bold; font-size:15px;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-data span:first-child:before{content:'Lúc:'; padding-right:5px; font-weight:normal; opacity:.7; font-size:14px;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-data span:last-child{margin-left:20px;}
.wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-data span:last-child:before{content:'Ngày:'; padding-right:5px; font-weight:normal; opacity:.7; font-size:14px;}

@media (max-width: 767px) {
    .wrap-scheduleLivestream{padding:0;}
    .wrap-scheduleLivestream .inner{padding:15px 0 35px 0; }
    .wrap-scheduleLivestream .inner ul.listAuthor{display:block;}
    .wrap-scheduleLivestream .inner ul.listAuthor li{width:100%; margin-top:20px; padding: 0; float:left;}
}

@media (min-width:768px) and (max-width: 991px) {
    .wrap-scheduleLivestream .inner ul.listAuthor li{padding-top:30px; position:relative;}
    .wrap-scheduleLivestream .inner ul.listAuthor li .avatarAuthor{margin: 0 auto 10px auto; display:block; float:initial}
    .wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info{width:100%; padding-left:0; text-align:center; position:initial}
    .wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info label{position:absolute; top:0; width:100%; text-align:center; left:0; }
    .wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .totalVideo{position:absolute; top:20px; transform:translateX(-50%); left:50%; width:auto; float:left; display:inline-table; background:var(--color1); box-shadow: 0 0 0 4px #fff; }
    .wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-label{margin:15px auto 0 auto ; display:inline-block; float:initial }
    .wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-data span{display:block; margin:0!important}
}

@media (min-width:992px) and (max-width: 1199px){
    .wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-label{margin-top:12px;}
    .wrap-scheduleLivestream .inner ul.listAuthor li .wrap-info .schedule-data span{display:block; margin-left:0!important}
}

.title-groupVideo{width:100%; float:left; position:relative; margin-bottom:0px;}
.title-groupVideo label{float:left; position:relative; margin:0; padding:0; font-weight:bold; font-size:23px;}
.title-groupVideo .nav-more{float:right; line-height:28px;box-shadow: 0 0 0 1px rgba(0,0,0,.07); height:28px; border-radius:14px; padding:0 15px; background:#fff; display:block; font-size:14px; font-weight:500; transition:.3s; margin: 5px 0 0 0}
.title-groupVideo .nav-more:hover{background:var(--color1); color:#fff; box-shadow: 0 0 0 1px var(--color1)}

.wrap-videoLivestream{width:100%; float:left; position:relative; background:var(--colorBg); padding-bottom:50px; background-image: linear-gradient(#ffffff, var(--colorBg));}
.wrap-videoLivestream .title-groupVideo{padding-top:40px;}

.wrap-clipShort{width:100%; float:left; position:relative; padding-top:70px; margin-left:0;}
.wrap-clipShort .col-pageLeft{width:320px; float:left; position:relative;}
.wrap-clipShort .col-pageRight{width:calc(100% - 320px); float:left; position:relative; margin: 0; padding-left:30px;}
.wrap-clipShort .col-pageRight .title-groupVideo{margin-top:50px;}
.wrap-clipShort .col-pageRight .title-groupVideo:first-of-type{margin-top:0;}

ul.listTypeSick{margin:0;padding:0; width:100%; float:left; list-style:none; }
ul.listTypeSick li{width:100%; float:left; position:relative; margin-top:15px;}
ul.listTypeSick li:first-child{margin-top:0;}
ul.listTypeSick li a{width:100%; float:left; position:relative; background:var(--colorBg); border-radius:7px; height:80px; padding: 20px 20px 0 70px; transition:.3s;}
ul.listTypeSick li a .icon{width:40px; height:40px; margin-top:-20px; background:#fff; border-radius:50%; position:absolute; top:50%; left:15px; display:flex; align-items:center; justify-content:center;}
ul.listTypeSick li a .icon svg,
ul.listTypeSick li a .icon img{height:24px; fill:var(--color1)}
ul.listTypeSick li a h3{font-size:16px; margin:0; padding-bottom:3px;}
ul.listTypeSick li a .totalSick{display:block; float:left; font-size:13px; padding-right:15px; }
ul.listTypeSick li a .totalSick span{opacity:.7}
ul.listTypeSick li a .totalSick span:after{content:':'; padding-right:5px;}
ul.listTypeSick li a:hover{background:var(--color1); color:#fff;}

@media (max-width:991px){
    .wrap-clipShort{padding-top:30px;}
    .wrap-clipShort .col-pageRight .title-groupVideo{margin-top:30px;}
    .wrap-clipShort .col-pageLeft{width:100%; display:none;}
    .wrap-clipShort .col-pageRight{width:100%; padding-left:0;}
}
@media (max-width:767px) {
    .wrap-clipShort .col-pageRight{padding-bottom:20px;}
}

ul#listLession li { width: calc(20% - 20px);}

@media (max-width: 767px){
    .wrap-videoLivestream .title-groupVideo{border-top:none;}
    ul#listLession li { width: calc(50% - 20px);}
    ul#listLession li:nth-child(n+7){display:none;}

    ul#list-shorts li,
    ul#list-clips li { width: calc(50% - 20px);}
}

@media (min-width: 768px) and (max-width: 991px){
    ul#listLession li { width: calc(33.333333333333% - 20px);}
    ul#listLession li:nth-child(n+7){display:none;}
   
    ul#list-shorts li,
    ul#list-clips li { width: calc(33.3333333333% - 20px);}
}


@media (min-width: 992px) and (max-width: 1199px){
    ul#listLession li { width: calc(33.333333333333% - 20px);}
    ul#listLession li:nth-child(n+7){display:none;}

    ul#list-shorts li,
    ul#list-clips li { width: calc(50% - 20px);}
}


@media (min-width: 1200px) and (max-width: 1439px){
    ul#listLession li { width: calc(25% - 20px);}
    ul#listLession li:nth-child(n+5){display:none;}

    ul#list-shorts li,
    ul#list-clips li { width: calc(33.333333333% - 20px);}
}

@media (min-width: 1440px) and (max-width: 1749px) {
    ul#listLession li { width: calc(25% - 20px);}
    ul#listLession li:nth-child(n+5){display:none;}
}

@media (min-width: 1750px){
    ul#listLession li { width: calc(20% - 20px);}
    ul#listLession li:nth-child(n+6){display:none;}
}