@import url('https://fonts.googleapis.com/css?family=Montserrat:700,800');
html{ margin: 0; padding: 0; position: relative;}
body{ background: #252525; font-family: "arial"; font-size: 14px; line-height: 1.2em; font-weight: 400; color: #ccc; margin: 0px; padding: 0px; -webkit-text-size-adjust: none; position: relative;}
h1, h2, h3, h4, h5, h6{ font-weight: 500;}
a{ color: #ccc; text-decoration: none !important; outline: none; -moz-outline: none;}
a:hover{ color: #f79100; text-decoration: none;}
a:focus, a:hover{ color: #f79100;}
a:active, a:focus{ outline: none;}
.highlight{ color: #f79100 !important;}
.dot{display: inline-block; margin: 3px 5px; width: 4px; height: 4px; background: #888; border-radius: 50%;}
strong{ font-weight: 600;}
.ulclear{ list-style: none; margin: 0; padding: 0;}
.bgcover{ background-size: cover; background-position: 50% 25%;}
.transition, #search .search-content .search-input{ transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s;}
.cut{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.full-width{position: relative; width: 100%;}
.full-width .box-main{overflow: hidden;}
/* mod */
.body-hidden{width: 100%; height: 100%; overflow: hidden; position: fixed; top: 0; bottom: 0; right: 0; left: 0;}
/* button */
.btn:hover{opacity: 0.9;}
.btn-site{background: #f79100 !important; color: #111 !important;}
.btn-social{height: 34px; width: 34px; font-size: 0; line-height: 1em; text-align: center; border-radius: 4px; color: #fff; background: #f79100; display: inline-block;}
.btn-social i{color: #fff; font-size: 16px; line-height: 34px;}
.btn-social:hover{opacity: 0.9;}
.btn-facebook{background: #197dd1;}
.btn-twitter{background: #0ebdd7;}
.btn-google{background: #d13434;}
.btn-flat{border: none;}
/* thumbnail */
.thumb{ display: inline-block; width: 100%; padding-bottom: 56%; position: relative; overflow: hidden; background: rgba(255,255,255,.1)}
.thumb img{ width: 100%; height: auto; min-height: 100%; position: absolute; top: 0; left: 0; right: 0;}
.thumb .thumb-mask{position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 3; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s;}
.thumb .thumb-mask .tm-btn{width: 60px; height: 60px; border-radius: 50%; position: absolute; top: 50%; left: 50%; margin-top: -30px; margin-left: -30px; background: rgba(255,255,255,0.9); display: none;}
.thumb .thumb-mask .tm-btn i{color: #f79100; font-size: 25px; position: absolute; top: 18px; left: 21px;}
.thumb .thumb-time{background: rgba(0,0,0,0.6); padding: 4px 5px; line-height: 1em; font-size: 12px; position: absolute; right: 8px; bottom: 8px; border-radius: 3px; z-index: 6; color: #fff; cursor: default}
.thumb .thumb-hd{background: rgba(255,255,255,0.9); font-size: 12px; line-height: 1em; letter-spacing: 1px; position: absolute; left: 8px; bottom: 8px; padding: 4px; border-radius: 3px; text-align: center; font-weight: 600; z-index: 6; color: #111; cursor: default}
.thumb .thumb-hd.thumb-hd-high{background: #F94D00; color: #fff;}
/* mobile */
#m-menu, #m-search{display: inline-block; cursor: pointer; position: absolute; top: 10px; left: 15px; width: 40px; height: 40px; text-align: center; border-radius: 50%; background: #fff}
#m-search{ left: auto; right: 15px; line-height: 40px;}
#m-search i{color: #111;}
#m-search.active i{ opacity: .5}
#m-menu:before, #m-menu:after{ content: ""; width: 18px; height: 2px; background: #111; position: absolute; top: 15px; left: 50%; margin-left: -9px;}
#m-menu:after{top: auto; bottom: 15px;}
/* layout */
#header{background: #18191c; height: 60px; position: relative; z-index: 5; margin-bottom: 20px; text-align: center; }
#header .container{position: relative;}
#header-right{float: right; display: none;}
#logo{margin: 7px auto; display: inline-block; line-height: 46px; font-family: "Montserrat"; font-weight: 800; font-size: 30px; color: #f94d00; text-shadow: 3px 0px 7px rgba(0,0,0,0.4);}
/* search */
#search_header{margin-bottom: 10px; padding: 20px 0; margin-top: -20px; position: relative; z-index: 9; display: none;}
#search{margin: 0; position: relative; z-index: 3; height: 40px; width: 100%;}
#search .search-content{position: relative; margin-right: 135px;}
#search .search-content .search-submit{height: 40px; cursor: pointer; padding: 0 15px; position: absolute; top: 0; right: -135px; border: none; z-index: 3; color: #fff; background: #f94d00; font-size: 16px; border-radius: 20px;}
#search .search-content .search-submit i{}
#search .search-content .search-input{height: 40px; width: 100%; border-radius: 20px; position: absolute; top: 0; left: 0; font-size: 16px; padding-left: 20px; padding-right: 55px; color: #111;  background: #fff; border: none !important; box-shadow: none !important; z-index: 9;}
#search .search-content .search-input:focus{background: #fff;}
#search_header.active{display: block;}
.watch_page #search_header{background: #18191C;}
.search-suggest{position: absolute; display: none; top: 50px; left: 0; right: 0; background: rgba(57,62,68,.98); z-index: 99; padding: 0; border-radius: 5px; box-shadow: 0 30px 30px 10px rgba(0,0,0,0.2);}
.search-suggest a{color: #fff;}
.search-suggest ul{max-height: 400px; overflow: auto;}
.search-suggest ul li{border-bottom: 1px solid rgba(255,255,255,.06); display: block;}
.search-suggest ul li:last-of-type{border-bottom: none;}
.search-suggest ul li a{padding: 15px 20px; padding-right: 70px; display: block; position: relative}
.search-suggest ul li.pstar a{ padding-right: 20px;}
.search-suggest ul li a:hover{background: rgba(255,255,255,.05);}
.search-suggest ul li.ss-bottom a{background: rgba(255,255,255,.1);}
.search-suggest ul li a strong{color: #f79100}
.search-suggest .ss-badge{background: #fff; display: inline-block; color: #111; font-size: 14px; line-height: 1em; padding: 2px 3px; border-radius: 3px; margin-left: 5px; font-weight: 600; position: absolute; top: 14px; right: 10px;}
.pstar .pstar-img{float: left; width: 60px; height: 33.75px; background-position: center center; background-size: auto 100%; -moz-background-size: auto 100%; -o-background-size: auto 100%;}
.pstar .pstar-name{ padding-left: 70px; padding-top: 7px;}
.related-search{ margin-bottom: 20px; background: rgba(255,255,255,.1); padding: 20px 20px 15px; color: #fff;}
.related-search ul li{float: left;}
.related-search ul li.rs-name{font-weight: 600; margin-right: 15px; color: #f79100}
.related-search ul li a{position: relative; color: #eee; margin: 0 15px 10px 0; display: inline-block;}
.related-search ul li a:before{content: ""; width: 100%; height: 1px; background: #eee; position: absolute; bottom: -1px; left: 0; right: 0;}
.related-search ul li a:hover{color: #f79100 !important;}
.related-search ul li a:hover:before{background: #f79100;}
.related-search ul li a.focus{font-weight: 600; font-size: 1.2em; color: #fff}
/* label home */
.label-home{ margin-bottom: 10px;}
.label-home .label-list{margin-bottom: 10px;}
.label-home .label-list:last-of-type{ margin-bottom: 0;}
.label-home .label-list ul li{ float: left; margin-right: 5px; margin-bottom: 5px;}
.label-home .label-list ul li a, .label-home .label-list ul li.head span{ height: 26px; line-height: 26px; padding: 0 10px; background: rgba(0,0,0,0.05); display: inline-block;}
.label-home .label-list ul li.head span{background: #f79100 !important; color: #fff !important; display: inline-block;}
.label-home .label-list ul li a:hover{background: #333; color: #fff;}
/* pagination */
.page {
	float: left;
	width: 100%;
}
.page .btn {
    padding: 3px 10px;
}
.page a.btn {
    border: 1px solid #444;
}
.page b.btn, .page .current.btn {
    color: #fff;
    background-color: #f79100;
}
.page ul {
	padding: 0;
}
.main_search .page {
	display: flex;
	margin: 15px 0;
}
.main_search .page ul {
	margin: auto;
}
.main_search .page ul li {
	list-style: none;
	width: auto !important;
    margin: 5px !important;
}
.main_search .page ul li a {
	padding: 8px;
	border: 1px solid #444;
}
.main_search .page ul li .active {
	color: #fff;
	background-color: #f79100;
}
.main_search .page .no-page, .page ul li.no-page .ellipsis {
	border: none;
	font-weight: bold;
}
.main_search .page .prev-page, .main_search .page .next-page {
	text-decoration: underline !important;
}
/* main */
#main{min-height: calc(100vh - 214px)}
/* box */
.box{ margin-bottom: 15px;}
.box .box-head{ margin-bottom: 15px;}
.box .box-head .bh-title{ color: #fff; font-weight: 600; font-size: 22px; margin: 0; margin-right: 30px; float: left; font-family: "Montserrat", arial}
.box .box-head .bh-tabs{float: left;}
.box .box-head .bh-tabs .nav-tabs > li{margin-right: 5px;}
.box .box-head .bh-tabs .nav-tabs > li > a{padding: 3px 10px; font-size: 14px; line-height: 1.2em;}
.box .box-head .bh-more{float: right; margin-top: 2px; font-weight: 600;}
.box .box-head .bh-more a{padding: 3px 5px; display: inline-block}
/* list item */
.item-grid-wrap{margin-left: -0.25%; margin-right: -0.25%;}
.item-grid-wrap ul li{width: 24.5%; margin: 0 0.25% 20px; float: left;}
.item-grid-wrap ul li .thumb{margin-bottom: 0;}
.item-grid-wrap ul li:hover .thumb .thumb-mask{background: rgba(0,0,0,0.4);}
.item-grid-wrap ul li:hover .thumb .thumb-mask .tm-btn{display: inline-block;}
.item-grid-wrap ul li .item-detail{background: rgba(255,255,255,.05); padding: 8px 10px; margin-top: -4px;}
.item-grid-wrap ul li .item-detail .item-detail-link{font-size: 14px; margin: 0 0 5px; color: #fff; line-height: 1.2em; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.item-grid-wrap ul li .item-detail .item-detail-link a{color: #eee;}
.item-grid-wrap ul li:hover .item-detail .item-detail-link a{color: #fff}
.item-grid-wrap ul li:hover .item-detail{background: rgba(255,255,255,.1) }
.item-grid-wrap ul li .item-detail .id-other{font-size: 12px; font-family: arial; opacity: .6}
/* list category */
.category-grid-wrap ul li .item-detail .cate-link{ font-size: 20px; margin: 0 0 5px; font-weight: 600;}
.category-grid-wrap ul li:hover .thumb .thumb-mask{border: 1px solid #f79100; background: rgba(223,34,56,0.1); transition: none; -webkit-transition: none; -moz-transition: none;}
.text-home{text-align: left; margin: 30px 0 0; line-height: 1.5em; font-size: 13px; font-style: italic; opacity: 0.5; padding: 30px 0; border-top: 1px solid rgba(255,255,255,.1);}
.infor-box{margin-bottom: 50px;}
.infor-box .article-infor{line-height: 1.4em; font-size: 14px;}
.infor-box .article-infor h3{font-size: 18px; font-weight: 600;  margin: 20px 0 10px;}
.infor-box .article-infor a{color: #f79100}
/* other */
#sitebody.homepage #search_header{display: block}
#sitebody.homepage #m-search{display: none}
.pre-tabs{ border-bottom: none; border: 1px solid #fff; border-radius: 3px;}
.pre-tabs .nav-item{font-size: 13px; font-weight: 400; margin-right: 0px; border-right: 1px solid #fff;}
.pre-tabs .nav-item:last-of-type{border-right: none;}
.pre-tabs .nav-item .nav-link{padding: 0px 13px; line-height: 28px; height: 28px; color: #ccc; background: none; border: none; border-radius: 0; margin-right: 0;}
.pre-tabs .nav-item .nav-link:hover{border-bottom-color: #222;}
.pre-tabs .nav-item .nav-link.active{background: #fff; color: #111;}
.watch_page #main .container{max-width: 1200px !important}
.watch_page #main #watch-area{background: #18191C; padding: 15px 0 0; margin-top: -20px; margin-bottom: 15px;}
.related-box .item-grid-wrap ul li{width: 24.5%;}
#watch-player{width: auto; position: relative;}
#watch-player iframe{position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100% !important; height: 100% !important;}
#wa-title{margin-bottom: 15px;}
#wa-title .badge{font-weight: 400; position: relative; top: -1px;}
#wa-title .video-title{font-size: 22px; margin: 0; line-height: 1.4em; color: #fff; font-weight: 600; display: block; margin-bottom: 5px;}
#watch-infor{margin-bottom: 20px;}
.rns-reaction{width: auto !important; padding-bottom: 18px !important;}
.rns-reaction .rns-icon{margin: 5px 0 !important}
.rns-reaction .rns-reaction-count {bottom: -25px !important;}
.rns-footer{display: none !important;}
.rns-plugin .rns-header{margin: 0 !important;}
.rns-plugin{margin: 0px 0 15px !important;}
.wi-tags{ margin: 0 0 15px;;}
.wi-tags a{display: inline-block; margin: 0 2px 4px 0; padding: 3px 5px; font-size: 12px; border: 1px solid #444; color: #888; border-radius: 3px;}
.wi-tags a:hover{color: #fff;}
.wi-tags a.label-main{background: #fff; border-color: #fff; color: #111;}
.wi-text{line-height: 1.4em;}
.wi-text p{ margin-bottom: 10px}
.wi-text-big{line-height: 1.4em; font-size: 1.1em; font-weight: 600; margin-bottom: 30px;}
.wi-text-btn{display: none;}
.wi-info{margin: 30px 0; border: 1px dashed rgba(255,255,255,.15); border-radius: 5px; position: relative; padding: 20px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#26292d+0,34383d+100 */
    background: rgb(38,41,45); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(38,41,45,1) 0%, rgba(52,56,61,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(38,41,45,1) 0%,rgba(52,56,61,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(38,41,45,1) 0%,rgba(52,56,61,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26292d', endColorstr='#34383d',GradientType=0 ); /* IE6-9 */
}
.wi-info .wii-title{position: absolute; height: 30px; line-height: 30px; padding: 0 15px; background: #26292D; top: -15px; left: 15px; font-weight: 600; color: #f79100; font-size: 18px;}
.wi-info .row{color: #fff;}
.wi-info .row span{opacity: 0.8;}
.wi-info a {
    color: #f79100;
}
.wa-btn{box-shadow: 0 20px 20px rgba(0,0,0,0.2); margin-bottom: 20px;}
.wi-cate{margin-bottom: 20px; line-height: 1.4em;}
.wi-search-recent{margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px dashed rgba(255,255,255,.2); line-height: 1.4em;}
.wi-search-recent .wsr-name{font-weight: 600; color: #fff; margin-right: 10px;}
.wi-search-recent a{color: #f79100; font-style: italic;}
.box-404{ font-size: 16px; line-height: 1.3em; padding: 80px 0;}
.box-404 .b4-text01{font-size: 8em; font-weight: 700; color: #fff; line-height: 1em; margin-bottom: 10px;}
.box-404 .b4-text02{ font-weight: 600; margin-bottom: 10px; color: #fff; font-size: 1.3em;}
.box-404 .b4-text03{ margin-bottom: 40px;}
/* pagination */
#pagination{ margin: 40px 0 40px; text-align: center;}
#pagination .pagination{border-radius: 0;}
#pagination .pagination li{margin: 5px;}
#pagination .pagination li .page-link{border-radius: 3px !important; background: rgba(255,255,255,.1); color: #ccc; border: none;}
#pagination .pagination li .page-link:hover{color: #fff;}
#pagination .pagination li.active .page-link{background: #f79100; color: #000;}
.p-breadcrumb .breadcrumb{background: none; padding: 0; margin: 0 0 10px; border-bottom: 1px solid rgba(255,255,255,.05); padding-bottom: 10px;}
.watch_page .p-breadcrumb .breadcrumb{ margin-top: 5px;}
/* sidebar menu*/
#sidebar_menu_bg, #sidebar_menu{transition: all .2s ease 0s; -webkit-transition: all .2s ease 0s; -moz-transition: all .2s ease 0s;}
#sidebar_menu_bg{ position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(38,41,45,.8); z-index: 100; display: none;}
#sidebar_menu_bg.active{display: block;}
#sidebar_menu{position: fixed; z-index: 101; font-size: 14px; left: -400px; opacity: 0; top: 0; bottom: 0; overflow-y: auto; width: 300px; padding: 20px; background: #18191c; box-shadow: 0 0 30px rgba(0,0,0,0.3); color: #ccc;}
#sidebar_menu.active{left: 0; opacity: 1;}
#sidebar_menu .toggle-sidebar{height: 40px; width: 40px; line-height: 40px; text-align: center; padding: 0; border-radius: 50%; font-size: 20px;}
#sidebar_menu .sidebar_menu-list{ font-size: 14px; margin-top: 10px;}
#sidebar_menu .sidebar_menu-list>.nav-item{display: block; width: 100%; border-bottom: 1px solid #222; position: relative; font-weight: 600;}
#sidebar_menu .sidebar_menu-list>.nav-item>.nav-link{display: block; padding: 12px 0; cursor: pointer;}
#sidebar_menu .sidebar_menu-list>.nav-item>.toggle-submenu{position: absolute; top: 5px; right: -10px; padding: 10px; z-index: 3; cursor: pointer}
#sidebar_menu .sidebar_menu-list>.nav-item .nav{margin-bottom: 20px;}
#sidebar_menu .sidebar_menu-list>.nav-item .nav>.nav-item{display: block; width: 100%; float: left;}
#sidebar_menu .sidebar_menu-list>.nav-item .nav>.nav-item>.nav-link{ padding: 5px 0; font-size: 13px; font-weight: 400;}
#sidebar_menu .sidebar_menu-list>.nav-item .nav>.nav-item>.nav-link:before{ content: "-"; margin-right: 8px; opacity: .3;}
#sidebar_menu .sidebar_menu-list > .nav-item .nav.sub-menu{max-height: 150px; overflow: hidden;}
#sidebar_menu .sidebar_menu-list > .nav-item .nav.sub-menu.active{max-height: none;}
#sidebar_menu #sub-menu-toggle{position: relative; margin-top: -20px;}
#sidebar_menu #sub-menu-toggle:before{content: ""; position: absolute; left: -5px; right: -5px; top: -150px; height: 150px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#18191c+0,18191c+100 */
    background: rgb(24,25,28); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(24,25,28,0) 0%, rgba(24,25,28,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(24,25,28,0) 0%,rgba(24,25,28,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(24,25,28,0) 0%,rgba(24,25,28,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#18191c', endColorstr='#18191c',GradientType=0 ); /* IE6-9 */
}
#sidebar_menu .sidebar_menu-list > .nav-item #sidebar_subs_genre.active #sub-menu-toggle{display: none;}
.site-h1{font-size: 26px; margin: 0; color: #f79100; text-align: center; background: rgba(0,0,0,.3); padding: 10px; font-weight: 600;; margin-bottom: 20px;}
/* bottom content */
.box-bottom{padding-top: 20px; margin-bottom: 20px; border-top: 1px solid rgba(255,255,255,.1);}
.box-bottom .btn-sm{margin: 0 3px 7px 0; font-size: 13px; padding: 3px 5px;}
/* modal */
.modal-cuz .modal-dialog{ width: 700px; margin: 60px auto;}
.modal-cuz .modal-dialog h6{ margin: 0 0 25px; padding: 0 0 15px; font-size: 24px;  position: relative;}
.modal-cuz .modal-dialog h6:before{content: ""; width: 80px; height: 3px; position: absolute; bottom: 0px; left: 0; background: #DD2339;}
.modal-cuz .modal-dialog .modal-content{ border-radius: 0;}
.modal-cuz .modal-body{ padding: 30px; color: #333}
.modal-cuz .close{ position: absolute; opacity: 0.5; top: 5px; right: 5px; color: #888; font-size: 20px; z-index: 9; padding: 5px; text-shadow: none;}
.modal-cuz .close:hover{ opacity: 1;}
.modal-mini .modal-dialog{width: 300px;}
.modal-mini .close{ position: relative; top: 0; right: 0; z-index: 9; padding: 4px; opacity: 1 !important; background: #ccc; line-height: 1em; font-size: 0; border-radius: 0 6px 0 6px;}
.modal-mini .close i{font-size: 16px; color: #fff; text-shadow: none;line-height: 1em;}
.modal-mini .min-icon{display: block; margin-bottom: 15px; color: #B0A376;}
.modal-mini .modal-body{padding: 25px 20px;}
/* footer */
#footer{background: #18191c; padding: 30px 0; font-size: 13px; position: relative;}
#footer .container{position: relative; z-index: 3;}
#footer .footer-links{ margin-bottom: 10px;}
#footer .footer-links ul li{ float: left; margin-right: 10px;}
@media screen and (min-width: 981px) {
    .none {
        display: none !important;
    }
}