body, .brs-block, .list span.icon, .fr-list li span i, .list li a, .video-bottom li, .full-bns-block
{ background-color: rgb(80,80,88); }

.wrap
{ box-shadow: 0 0 15px -7px rgb(20,20,28); }

.wrap, .list span.icon, .fr-list li span i
{ background-color: rgb(60,60,68); }

.preview li
{ border-color: rgb(60,60,68); }

body, .list span.total
{ color: rgb(200,200,208); }

a:hover, .logo a span, .list span.val i, .fr-list li span i, .all-cats a i, .video-bottom a span i, .foot span, .foot a i
{ color: rgb(80,190,220); }

.preview a:hover .name
{ background-color: rgba(70,180,210,0.8); }

.button:hover, .button.active, .menu a:hover, .menu a.active, .menu li.active a, .search button:hover, .type-sort-pages, .list li a:hover, .all-cats a:hover, .close:hover, .bot-close:hover, .video-bottom a:hover
{ background-color: rgb(70,180,210); }

.type-sort-pages a, .list li a:hover span.icon, .fr-list li a:hover span i, .close, .bot-close
{ background-color: rgb(42,108,126); }

.type-sort-pages span
{ background-color: rgb(107,195,219); }

a, h1, h2, .preview-inn li i, .list span.icon, .video-bottom span i
{ color: rgb(247,247,255); }

.head, img, .preview-img, .br, .full-bn, .type-sort-pages a:hover, .type-sort-pages a.active, .type-sort-pages li.active a, .preview li, .all-cats a, .video-bottom li a
{ background-color: rgb(40,40,48); }

.menu, .search, .preview-inn:hover li
{ background-color: rgb(20,20,28); }

.button, .menu a, .search button
{ background-color: rgb(80,80,88); }

.menu a:hover i, .menu a.active i, .menu li.active a i, .list li a:hover span.val i, .list li a:hover span.total, .all-cats a:hover i, .video-bottom a:hover span i
{ color: rgb(0,0,8); }

.preview .name, .preview-2 .total
{ background-color: rgba(0,0,8,0.6); }

.search input::placeholder, .search input
{ color: rgb(40,40,48); }



body,html,div,p,a,ul,li,input,button,form,textarea,span,img,h1,h2,h3 { margin: 0; padding: 0; }

div, ul, li, a { overflow: hidden; }

body { font-family: Arial, sans-serif; text-transform: uppercase; }

li { list-style-type: none; }

img { display: block; }

a { text-decoration: none; }

h1, h2 { font-weight: normal; }
h1 { font-size: 24px; line-height: 32px; margin: 10px 15px 0 3px; float: left; }
h2 { font-size: 22px; line-height: 24px; margin: 40px 10px 0 10px; }

.wrap { width: 98%; margin: 0 auto; max-width: 992px; padding-bottom: 20px; }

.head { height: 50px; overflow: visible; }
.head .wrap { background: none; overflow: visible; position: relative; box-shadow: none; padding: 0; }

.logo { float: left; margin: 5px 5px 0 0; }
.logo a { color: rgb(255,255,255); height: 40px; line-height: 40px; font-size: 16px; display: block; }

.button { color: rgb(255,255,255); float: right; border-radius: 3px; cursor: pointer; height: 40px; line-height: 40px; width: 40px; font-size: 18px; margin: 5px 1px 0 1px; text-align: center; }
.button i { height: 40px; line-height: 40px; display: block; }

.menu { display: none; box-shadow: 0 5px 15px -7px rgb(0,0,0); position: absolute; top: 50px; right: 0; width: 160px; text-align: center; z-index: 10000; }
.menu ul { padding: 9px 10px; }
.menu li { margin: 1px 0; }
.menu a { color: rgb(255,255,255); display: block; padding: 10px; border-radius: 3px; }
.menu span { display: block; }
.menu span.icon { height: 30px; line-height: 30px; font-size: 24px; margin-top: 2px; }
.menu span.val { height: 25px; line-height: 25px; font-size: 16px; margin-bottom: 3px; }

.search { display: none; box-shadow: 0 5px 15px -7px rgb(0,0,0); position: absolute; top: 50px; right: 0; left: 0; z-index: 10000; padding: 10px 0; }
.search form { overflow: hidden; position: relative; margin: 0 10px; }
.search-input { background-color: rgb(255,255,255); border-radius: 3px; height: 60px; line-height: 60px; padding: 0 15px; margin-right: 62px;}
.search input { background: none; text-transform: uppercase; width: 100%; border: 0 none; outline: 0 none; font-size: 18px; height: 60px; line-height: 60px;}
.search button { color: rgb(255,255,255); position: absolute; top: 0; right: 0; border: 0 none; border-radius: 3px;  cursor: pointer; outline: 0 none; width: 60px; font-size: 20px; height: 60px; line-height: 60px; }
.search button i { height: 60px; line-height: 60px; display: block; }

.type-sort-pages { padding: 0 0 10px 7px; }
.type-sort-pages h1 { color: rgb(255,255,255); }

.type-sort { float: left; margin-top: 8px; }
.type-sort-pages ul { float: left; margin: 1px 16px 0 3px; }
.type-sort-pages li { margin: 1px 1px 0 0; float: left; text-align: center; }
.type-sort-pages a, .type-sort-pages span { color: rgb(255,255,255); border-radius: 3px; display: block; padding: 0 10px; font-size: 14px; height: 32px; line-height: 32px; }
.type-sort-pages span { min-width: 14px; }
.type-sort-pages a:hover, .type-sort-pages a.active, .type-sort-pages li.active a { color: rgb(255,255,255); }
.type-sort-pages i.fa-angle-right, .type-sort-pages i.fa-angle-left { display: block; height: inherit; line-height: inherit; }

.previews-block { padding: 4px 7px 0 7px; clear: both; }

.preview { width: 50%; float: left; }
.preview-inn { margin: 6px 3px 0 3px; }
.preview a { display: block; }
.preview-img { position: relative; padding-bottom: 75%;}
.preview-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.preview .name { color: rgb(255,255,255); font-size: 14px; height: 30px; line-height: 30px; position: absolute; padding: 0 10px; bottom: 0; left: 0; right: 0; }
.preview a:hover .preview-img img { opacity: 0.9; }
.preview ul { text-align: center; display: table; width: 100%; margin-top: 2px; }
.preview li { width: 33.3333%; display: table-cell; vertical-align: top; border-radius: 3px; border-left-width: 1px; border-left-style: solid; border-right-width: 1px; border-right-style: solid; }
.preview li:first-child { border-left: 0 none; }
.preview li:last-child { border-right: 0 none; }
.preview li span { display: block; }
.preview li span.icon { height: 25px; line-height: 25px; font-size: 18px; }
.preview li span.value { height: 15px; line-height: 15px; font-size: 12px; margin-bottom: 5px; }
.preview-inn:hover li { color: rgb(255,255,255); }
.preview-inn:hover li i { color: rgb(255,255,255); }
.preview-inn:hover li.rate i { color: rgb(76,226,146); }
.preview .hd { background-color: rgba(244,164,24,0.9); color: rgb(255,255,255); height: 22px; line-height: 22px; padding: 0 6px; font-size: 16px; position: absolute; bottom: 30px; right: 0; }
.preview a .icon { display: none; background-color: rgba(0,0,0,0.5); color: rgb(255,255,255); height: 34px; line-height: 34px; width: 40px; font-size: 24px; text-align: center; border-radius: 3px; position: absolute; top: 50%; left: 50%; margin: -17px 0 0 -20px; }
.preview a .icon i { display: block; height: 34px; line-height: 34px; }
.preview a:hover .icon { display: block; }

.preview .name-2 { font-size: 16px; height: 35px; line-height: 35px; }
.preview .total { color: rgb(255,255,255); height: 22px; line-height: 22px; padding: 0 6px; font-size: 12px; position: absolute; bottom: 37px; right: 0; }


.brs-block { border-radius: 3px; margin: 20px 10px 0 10px; padding-bottom: 10px; font-size: 0; text-align: center; }
.br { width: 300px; height: 250px; margin: 10px 5px 0 5px; display: inline-block; vertical-align: top; }
.br-2, .br-3, .br-4, .br-5 { display: none; }

.brs-block-2 { margin-top: 6px; }

.type-sort-pages-2 { margin-top: 6px; }
.type-sort-bottom a, .type-sort-bottom span { padding: 0 5px; min-width: 24px; width: auto; }

.list { padding: 4px 7px 0 7px; font-size: 0; }
.list li { page-break-inside: avoid; break-inside: avoid; padding: 6px 3px 0 3px; }
.list li a { border-radius: 3px; float: left; width: 100%; }
.list .list-ins { padding: 7px 7px 7px 10px; }
.list span { display: block; overflow: hidden; }
.list span.icon { border-radius: 3px; height: 40px; line-height: 40px; width: 40px; text-align: center; font-size: 24px; float: right; }
.list span.icon i { display: block; height: 40px; line-height: 40px; }
.list span.val { height: 25px; line-height: 25px; font-size: 16px; }
.list span.total { height: 15px; line-height: 15px; font-size: 12px; }
.list li a:hover { color: rgb(255,255,255); }
.list li a:hover span.icon { color: rgb(255,255,255); }

.fr-list li span { height: 35px; line-height: 35px; font-size: 16px; padding: 7px 7px 7px 10px; }
.fr-list li span i { border-radius: 3px; height: 35px; line-height: 35px; width: 35px; text-align: center; font-size: 20px; float: right; display: block; }
.fr-list li a:hover span i { color: rgb(255,255,255); }

.all-cats { text-align: center; }
.all-cats a { color: rgb(255,255,255); border-radius: 3px; display: inline-block; vertical-align: top; margin: 20px 10px 10px 10px; height: 50px; line-height: 50px; font-size: 18px; padding: 0 20px; min-width: 180px; }

.full-wrap { margin: 0 10px; }
.full-tab { display: table; width: 100%; }
.full-block { padding-top: 10px; }
.video { background-color: rgb(0,0,0); position: relative; width: 100%; padding-bottom: 56.25%; }
.video iframe, .video object, .video embed, .video video, .video source, .video div.fluid_video_wrapper video { width: 100% !important; height: 100% !important; position: absolute !important; top: 0 !important; left: 0 !important;}/*removed z-index*/
.video div.fluid_video_wrapper { position: absolute !important; width: 100% !important; height: 100% !important; top: 0 !important; left: 0 !important; }/*added*/
.video div { overflow: visible; }

.on-player-pl { display: none; background-color: rgba(0,0,0,0.5); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5000; }
.on-player { background-color: rgb(45,45,45); position: absolute; top: 50%; left: 50%; width: 300px; height: 250px; z-index: 5500; margin: -125px 0 0 -150px; overflow: visible; }
.close, .bot-close { color: rgb(255,255,255); border-radius: 3px; position: absolute; cursor: pointer; height: 30px; line-height: 30px; text-align: center; }
.on-player-sp { width: 300px; height: 250px; }
.on-player-sp iframe { width: 300px !important; height: 250px !important; position: static; }
.close { font-family: Arial, sans-serif; width: 30px; font-size: 18px; top: -15px; right: -15px; }
.bot-close { left: 50%; bottom: -15px; font-size: 16px; width: 140px; margin-left: -70px; }

.video-bottom { font-size: 0; text-align: center; }
.video-bottom ul { display: inline-block; vertical-align: top; margin: 8px 4px 0 4px; }
.video-bottom li { display: inline-block; vertical-align: top; margin: 2px 1px 0 1px; border-radius: 3px; }
.video-bottom li a { color: rgb(255,255,255); display: block; }
.video-bottom span { display: block; padding: 0 10px; overflow: hidden; }
.video-bottom span.icon { height: 20px; line-height: 20px; font-size: 18px; margin-top: 4px; }
.video-bottom span.val { height: 20px; line-height: 20px; font-size: 14px; margin-top: 2px; margin-bottom: 4px; }
.video-bottom a:hover { color: rgb(255,255,255); }
.video-bottom li a.like { background-color: rgb(56,186,126); color: rgb(255,255,255); height: 50px; line-height: 50px; width: 50px; font-size: 30px; cursor: pointer; }
.video-bottom li a.like:hover { background-color: rgb(36,166,106); }
.video-bottom li a.dislike { background-color: rgb(226,96,96); color: rgb(255,255,255); height: 50px; line-height: 50px; width: 50px; font-size: 30px; cursor: pointer; }
.video-bottom li a.dislike:hover { background-color: rgb(206,76,76); }
.video-bottom li a.like i, .video-bottom li a.dislike i { color: inherit; display: block; height: inherit; line-height: inherit; }
.video-bottom span.rate-icon { color: rgb(76,226,146); }

.full-bns-block { border-radius: 3px; margin: 20px 10px 0 10px; padding-bottom: 10px; font-size: 0; text-align: center; }
.full-bn { margin: 10px 5px 0 5px; display: inline-block; vertical-align: top; width: 300px; height: 250px; }
.full-bn-2, .full-bn-3 { display: none; }

.video-br-wide { background-color: rgb(0,0,0); padding-bottom: 10px; }
.video-mob-br-300 { background-color: rgb(40,40,40); margin: 10px auto 0 auto; width: 300px; height: 100px; }

.foot { padding: 15px 10px 30px 10px; font-size: 16px; line-height: 20px; text-align: center; }
.foot .wrap { background: none; box-shadow: none; padding: 0; }
.foot p { margin-top: 15px; }
.foot li { margin: 10px 10px 0 10px; display: inline-block; vertical-align: top; }
.foot a:hover { text-decoration: underline; }

@media all and (min-width:400px) {
    .logo a { font-size: 24px; }
    .list ul { column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; }
    .list span.val, .fr-list li span { font-size: 15px; }
}

@media all and (min-width:680px) {
    .logo a { font-size: 32px; }
    .preview { width: 33.3333%; }
    .on-player-pl { display: block; }
    .br-2, .full-bn-2 { display: inline-block; }
    .list ul { column-count: 3; -moz-column-count: 3; -webkit-column-count: 3; }
}

@media all and (min-width:800px) {
    .video-bottom span { min-width: 60px; }
    .video-bottom span.icon { height: 25px; line-height: 25px; font-size: 22px; }
    .video-bottom span.val { height: 25px; line-height: 25px; font-size: 16px; }
    .video-bottom li a.like, .video-bottom li a.dislike { height: 60px; line-height: 60px; width: 66px; font-size: 34px; }
}

@media all and (min-width:1020px) {
    .wrap { width: 992px; max-width: 100%; }
    .head, .head .wrap { overflow: hidden; }
    .head { height: 80px; }
    .button { display: none; }
    .logo { margin: 0 20px 0 0; }
    .logo a { height: 80px; line-height: 80px; font-size: 38px; }
    .menu { display: block !important; background: none; box-shadow: none; position: static; width: auto; float: right; }
    .menu ul { padding: 10px 0 0 0; }
    .menu li { margin: 0 0 0 2px; float: left; }
    .menu a { padding: 0 10px; min-width: 60px; }
    .search { display: block !important; background: none; box-shadow: none; padding: 10px 0; float: left; position: static; width: 300px; }
    .search input { font-size: 18px;  }
    h1 { line-height: 38px; }
    .type-sort { float: right; }
    .type-sort-pages ul { margin: 1px 9px 0 3px; }
    .type-sort-pages a, .type-sort-pages span { height: 38px; line-height: 38px; padding: 0 15px; }
    .type-sort-pages span { width: 40px; padding: 0; }
    .type-sort-bottom { float: left; }
    .type-sort-bottom ul { margin-left: 3; }
    .type-sort-bottom a, .type-sort-bottom span { min-width: 30px; padding: 0 5px; width: auto; }
    .preview { width: 326px; }
    .preview .name { font-size: 16px; }
    .preview .name-2 { font-size: 20px; height: 45px; line-height: 45px; }
    .preview .total { height: 26px; line-height: 26px; padding: 0 8px; font-size: 14px; bottom: 47px; }
    .br-3 { display: inline-block; }
    .list ul { column-count: 4; -moz-column-count: 4; -webkit-column-count: 4; }
    .list span.val, .fr-list li span { font-size: 16px; }
    .video-br-wide { display: none; }
    .full-block, .full-bns-block { display: table-cell; vertical-align: top; }
    .video-bottom ul { float: left; margin: 8px 10px 0 0; }
    .video-bottom li { float: left; margin: 2px 2px 0 0; }
    .full-bns-block { margin: 0; padding: 0; width: 310px; border-radius: 0; background: none; }
    .full-bn { margin: 10px 0 0 10px; }
} 

@media all and (min-width:1338px) {
    .wrap { width: 1318px; }
    .logo { margin-right: 40px; }
    .logo a { font-size: 46px; }
    .menu a { min-width: 80px; }
    .menu a span.val { font-size: 18px; margin-bottom: 4px; }
    .menu span.icon { margin-top: 1px; }
    .search { width: 500px; }
    .search input { font-size: 20px; }
    .type-sort-pages a, .type-sort-pages span { font-size: 16px; }
    h1 { font-size: 28px; }
    h2 { font-size: 26px; line-height: 28px; }
    .br-4 { display: inline-block; }
    .list ul { column-count: 6; -moz-column-count: 6; -webkit-column-count: 6; }
    .list span.val, .fr-list li span { font-size: 15px; }
    .video { padding: 0; height: 510px; }
}

@media all and (min-width:1664px) {
    .wrap { width: 1644px; }
    .search { width: 640px; }
    h1 { font-size: 30px; }
    h2 { font-size: 28px; line-height: 30px; }
    .list span.val, .fr-list li span { font-size: 18px; }
    .br-5 { display: inline-block; }
    .full-bn-3 { display: inline-block; }
    .video { height: 770px; }
    .video-bottom ul { margin: 8px 20px 0 0; }
    .video-bottom span { padding: 0 15px; }
} 
