body, .header-button i, .menu-box a i, .search-box button i, .filter-box a i, .thumb-inner p i, .pages-box span, .pages-box a, .list-box a i, .player-meta-box li span i, .player-meta-box li a i
{ background-color: rgb(34,34,34); }

.header-button, .menu-box a, .search-box button, .filter-box a, .filter-box span, .thumb-inner p, .bhor-box, .list-box a, .player-meta-box li span, .player-meta-box li a
{ background-color: rgb(44,44,44); background: linear-gradient(to right,rgb(49,49,49),rgb(44,44,44)); }

.header-box, .menu-box a i, .header-button i, .search-box-text, .search-box button i, .filter-box a i, .thumb-inner p i, .thumb-inner li span i, .pages-box span, .pages-box a, .list-box a i, .player-meta-box li span i, .player-meta-box li a i, .footer-box, .footer-box a
{ border-color: rgb(64,64,64); }

img, .thumb-inner-img, .bhor, .player-bhor
{ background-color: rgb(64,64,64); }

body
{ color: rgb(164,164,164); }

a:hover, a.logo-text span, .header-button i, .menu-box a i, .filter-box span, .filter-box a i, .thumb-inner p i, .list-box a i, .player-meta-box li a i, .footer-box p.footer-logo span
{ color: rgb(64,174,214); }

.header-button:hover, .header-button.active, .menu-box a:hover, .menu-box a.active, .menu-box li.active a,  h1 i, h2 i, .filter-box a:hover, .filter-box a.active, .filter-box li.active a, .thumb-inner a:hover p, .pages-box a:hover, .pages-box a.active, .pages-box li.active a, .list-box a:hover, .player-meta-box li a:hover, .up-button, .close:hover, .bot-close:hover
{ background-color: rgb(64,174,214); background: linear-gradient(to right,rgb(64,174,214),rgb(44,154,194)); color: rgb(255,255,255); }

.header-button:hover i, .header-button.active i, .menu-box a:hover i, .menu-box a.active i, .menu-box li.active a i, .search-box button:hover i, .filter-box a:hover i, .filter-box a.active i, .filter-box li.active a i, .thumb-inner a:hover p i, .list-box a:hover i, .player-meta-box li a:hover i
{ background-color: rgb(24,134,174); color: rgb(255,255,255); }

.header-button:hover i, .header-button.active i, .menu-box a:hover i, .menu-box a.active i, .menu-box li.active a i, .search-box button:hover i,  h1 i, h2 i, .filter-box a:hover i, .filter-box a.active i, .filter-box li.active a i, .thumb-inner a:hover p i, .pages-box a:hover, .pages-box a.active, .pages-box li.active a, .list-box a:hover i, .player-meta-box li a:hover i, .up-button, .close:hover, .bot-close:hover, .footer-box a:hover
{ border-color: rgb(84,194,234); }

a, a.logo-text, h1, h2, .search-box button, .thumb-inner li span i, .player-meta-box li span i, .footer-box p.footer-logo
{ color: rgb(244,244,244); }

.thumb-inner-dur
{ background-color: rgba(24,24,24,0.7); color: rgb(245,245,245); }

.thumb-inner-icon
{ background-color: rgba(24,24,24,0.3); color: rgb(255,255,255); }


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

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

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

li { list-style-type: none; }

img { display: block; }

a { text-decoration: none; }

h1, h2 { font-weight: bold; }
h1 { font-size: 24px; line-height: 28px; margin: 10px 5px 0 4px; padding-left: 1px; }
h1 i { border-width: 2px; border-style: solid; display: block; float: left; margin: 2px 5px 2px 0; width: 20px !important; height: 20px !important; line-height: 20px !important; font-size: 14px !important; border-radius: 50%; text-align: center; }
h2 { margin: 40px 5px 0 4px; padding-left: 1px; font-size: 22px; line-height: 26px; }
h2 i { border-width: 2px; border-style: solid; display: block; float: left; margin: 2px 5px 2px 0; width: 18px !important; height: 18px !important; line-height: 18px !important; font-size: 14px !important; border-radius: 50%; text-align: center; }


.header-box { padding-bottom: 10px; border-bottom-width: 2px; border-bottom-style: solid; }

a.logo-text { font-weight: bold; font-size: 16px; float: left; margin: 10px 5px 0 5px; height: 35px; line-height: 35px; }

.header-button { cursor: pointer; height: 35px; line-height: 35px; border-radius: 3px; margin: 10px 5px 0 5px; float: right; }
.header-button i { border-width: 2px; border-style: solid; display: block; float: left; margin: 3px; width: 25px; height: 25px; line-height: 25px; font-size: 14px; border-radius: 50%; text-align: center; }
.header-button span { display: none; font-size: 16px; padding-right: 10px; font-weight: bold; }

.top-menu-box { position: relative; overflow: visible; }

.menu-box { display: none; clear: both; }
.menu-box ul { margin: 10px 5px 0 5px; }
.menu-box li { margin-top: 2px; }
.menu-box a { border-radius: 3px; display: block; padding: 0 10px 0 2px; font-weight: bold; font-size: 18px; height: 61px; line-height: 61px; }
.menu-box a i { border-width: 2px; border-style: solid; display: block; float: left; margin: 8px; width: 41px; height: 41px; line-height: 41px; font-size: 20px; border-radius: 50%; text-align: center; }

.search-box { display: none; clear: both; padding: 10px 5px 0 5px; }
.search-box form { position: relative; border-radius: 3px; overflow: hidden; }
.search-box-text { background-color: rgb(255,255,255); border-style: solid; border-width: 2px; height: 47px; line-height: 47px; padding: 0 57px 0 15px; }
.search-box input { background: none; border: 0 none; width: 100%; outline: 0 none; font-size: 16px; height: inherit; line-height: inherit; }
.search-box button { position: absolute; top: 2px; right: 2px; border: 0 none; cursor: pointer; outline: 0 none; width: 47px; height: 47px; line-height: 47px; }
.search-box button i { border-width: 2px; border-style: solid; display: block; margin: 6px; width: 33px; height: 33px; line-height: 33px; font-size: 16px; border-radius: 50%; text-align: center;  }

.wrapper-box { margin: 0 auto; max-width: 990px; position: relative; }

.filter-box ul { margin: 8px 3px 0 3px; }
.filter-box li { float: left; margin: 2px 2px 0 2px; text-align: center; }
.filter-box li.filter-icon { display: none; }
.filter-box a { display: block; height: 35px; line-height: 33px; font-size: 14px; padding-right: 10px; border-radius: 3px; }
.filter-box a i { border-width: 2px; border-style: solid; display: block; float: left; margin: 3px 5px 3px 3px; width: 25px; height: 25px; line-height: 25px; font-size: 16px; border-radius: 50%; }
.filter-box span { display: block; height: 35px; line-height: 33px; font-size: 20px; width: 33px; border-radius: 3px; }

.thumb-inner { margin: 10px 5px 0 5px; }
.thumb-inner a { display: block; }
.thumb-inner-img { border-radius: 3px; position: relative; width: 100%; padding-bottom: 56.25%; }
.thumb-inner-img img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.thumb-inner-dur { position: absolute; top: 4px; right: 4px; height: 24px; line-height: 24px; font-size: 12px; padding: 0 5px; border-radius: 3px; z-index: 500; }
.thumb-inner-icon { display: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
.thumb-inner-icon i { position: absolute; top: 50%; left: 50%; margin: -20px 0 0 -20px; height: 40px; line-height: 40px; font-size: 28px; width: 40px; text-align: center; }
.thumb-inner a:hover .thumb-inner-icon { display: block; }
.thumb-inner p { height: 30px; line-height: 30px; font-size: 14px; margin-top: 4px; overflow: hidden; padding-right: 8px; border-radius: 3px; }
.thumb-inner p i { border-width: 2px; border-style: solid; display: block; float: left; margin: 2px 5px 2px 2px; width: 22px; height: 22px; line-height: 22px; font-size: 14px; border-radius: 50%; text-align: center; }
.thumb-inner ul { margin-top: 4px; border-radius: 3px; height: 30px; }
.thumb-inner li { float: left; margin-right: 10px; }
.thumb-inner li:last-child { float: right; margin-right: 0; }
.thumb-inner li span { display: block; height: 30px; line-height: 30px; font-size: 12px; text-align: left; }
.thumb-inner li span i { border-width: 2px; border-style: solid; display: block; float: left; margin: 2px 5px 2px 2px; width: 22px; height: 22px; line-height: 22px; font-size: 14px; border-radius: 50%; text-align: center; }
.thumb-inner li span.likes i, .thumb-inner li span.likes { color: rgb(64,194,154); }

.thumb-inner-2 p { font-size: 16px; height: 36px; line-height: 36px; }
.thumb-inner-2 p i { margin: 5px; }

.pages-box { margin-top: 10px; text-align: center; font-size: 0; }
.pages-box ul { margin: 6px 3px 0 3px; }
.pages-box li { display: inline-block; vertical-align: top; margin: 4px 2px 0 2px; }
.pages-box span, .pages-box a { border-width: 2px; border-style: solid; border-radius: 25px; display: block; height: 40px; line-height: 40px; min-width: 30px; padding: 0 5px; font-size: 14px; }
.pages-box ul.more-button a { border-radius: 4px; height: auto; line-height: 20px; font-size: 16px; padding: 15px; font-weight: bold; }

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

.list-box { font-size: 0; padding: 6px 3px 0 3px; }
.list-box li { page-break-inside: avoid; break-inside: avoid; padding: 4px 2px 0 2px; }
.list-box a { display: block; float: left; width: 100%; border-radius: 3px; }
.list-box span { display: block; height: 35px; line-height: 35px; margin-right: 10px; font-size: 13px; white-space: nowrap; }
.list-box a i { border-width: 2px; border-style: solid; display: block; float: left; margin: 3px 5px 3px 3px; width: 25px; height: 25px; line-height: 25px; font-size: 14px; border-radius: 50%; text-align: center; }

.player-wrapper-box { padding-top: 10px; }

.vid-box { margin: 0 5px; }
.vid-box-inner { width: 100%; display: table; }
.player-box { background-color: rgb(0,0,0); position: relative; padding-bottom: 56.25%; width: 100%; }
.player-box iframe, .player-box object, .player-box embed, .player-box video, .player-box source { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.on-player-box { display: none; background-color: rgba(0,0,0,0.5); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5000; text-align: center; }
.on-player { background-color: rgba(0,0,0,0.7); box-shadow: 0 0 15px -3px rgba(0,0,0,0.5); position: absolute; top: 50%; left: 50%; width: 300px; height: 250px; z-index: 5500; margin: -125px 0 0 -150px; overflow: visible; }
.close, .bot-close { border: 2px solid rgb(120,120,120); background-color: rgba(0,0,0,0.7); color: rgb(255,255,255); font-weight: bold; position: absolute; cursor: pointer; height: 35px; line-height: 35px; }
.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: 35px; font-size: 16px; top: 3px; right: 3px; border-radius: 50%;  }
.bot-close { left: 50%; bottom: 3px; font-size: 15px; width: 180px; margin-left: -90px; border-radius: 3px; overflow: hidden; height: 35px; line-height: 33px; }

.player-meta-box ul { margin: 8px 10px 0 0; float: left; }
.player-meta-box ul.channel { float: right; margin-right: 6px; }
.player-meta-box li { float: left; margin: 2px 4px 0 0; }
.player-meta-box li span, .player-meta-box li a { height: 35px; line-height: 33px; font-size: 14px; padding-right: 10px; border-radius: 3px; display: block; }
.player-meta-box li span i, .player-meta-box li a i { border-width: 2px; border-style: solid; display: block; float: left; margin: 3px; width: 25px; height: 25px; line-height: 25px; font-size: 14px; border-radius: 50%; text-align: center; }
.player-meta-box li a { font-weight: bold; }
.player-meta-box li span.player-meta-val { background: none; padding-right: 5px; }
.player-meta-box li span.player-meta-val i { margin-left: 0; }

.player-meta-box li a.download { color: #f4f4f4; }
.player-meta-box li a.download { font-weight: 100; }

.player-meta-box li a.like i { color: rgb(55,185,145); font-size: 18px; }
.player-meta-box li a.like { color: rgb(55,185,145); }
.player-meta-box li a.like:hover { background-color: rgb(55,185,145); background: linear-gradient(to right,rgb(55,185,145),rgb(35,165,125)); color: rgb(255,255,255); }
.player-meta-box li a.like:hover i { background-color: rgb(25,155,115); border-color: rgb(75,205,165); color: rgb(255,255,255); }

.player-meta-box li a.dislike i { color: rgb(235,105,105); font-size: 18px; }
.player-meta-box li a.dislike { color: rgb(235,105,105); }
.player-meta-box li a.dislike:hover { background-color: rgb(235,105,105); background: linear-gradient(to right,rgb(235,105,105),rgb(215,85,85)); color: rgb(255,255,255); }
.player-meta-box li a.dislike:hover i { background-color: rgb(205,75,75); border-color: rgb(255,125,125); color: rgb(255,255,255); }

.player-bhor-box { margin-top: 10px; text-align: center; font-size: 0; }
.player-bhor { display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; width: 300px; height: 250px; }
.player-bhor-2, .player-bhor-3 { display: none; }

a.download-box { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
a.download-box:after { content: ''; background-color: rgba(0,0,0,0.3); display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
a.download-box:hover:after { background-color: rgba(0,0,0,0.4); }
a.download-box img { width: 100%; height: auto; position: absolute; top: 0; left: 0; }
a.download-box span { background-color: rgba(0,0,0,0.4); color: rgb(255,255,255); border-radius: 3px; position: absolute; top: 50%; left: 50%; text-align: center; margin: -40px 0 0 -100px; display: block; width: 200px; z-index: 500; height: 80px; padding: 10px; overflow: hidden; line-height: 30px; font-size: 16px; white-space: nowrap; text-overflow: ellipsis;  }
a.download-box span i { display: block; height: 50px; line-height: 50px; font-size: 44px; }
a.download-box:hover span { background-color: rgba(0,0,0,0.5); }

.footer-box { border-top-width: 2px; border-top-style: solid; margin-top: 20px; padding: 10px 5px 20px 5px; text-align: center; font-size: 16px; line-height: 22px; }
.footer-box p { margin-top: 10px; }
.footer-box p.footer-logo { font-weight: bold; font-size: 18px; }
.footer-box ul { font-size: 0; margin-top: 8px; }
.footer-box li { display: inline-block; vertical-align: top; margin: 4px 2px 0 2px; }
.footer-box a { border-width: 2px; border-style: solid; height: 28px; line-height: 28px; font-size: 14px; display: block; padding: 0 10px; border-radius: 3px; }

.up-button { border-width: 2px; border-style: solid; display: none; opacity: 0.9; height: 40px; line-height: 40px; border-radius: 3px; padding: 0 15px; text-transform: uppercase; text-align: center; cursor: pointer; font-size: 16px; position: fixed; right: 10px; bottom: 10px; z-index: 1000; }
.up-button:hover { opacity: 1; }

@media all and (min-width:400px) {
    a.logo-text { font-size: 20px; }
    .pages-box ul.more-button a { width: 276px; height: 60px; line-height: 60px; padding: 0 20px; font-size: 18px; }
}

@media all and (min-width:430px) {
    .thumb { float: left; width: 50%; }
}

@media all and (min-width:500px) {
    a.logo-text { font-size: 32px; }
    .list-box ul { column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; }
    .on-player-box { display: block; }
}

@media all and (min-width:640px) {
    a.logo-text { font-size: 36px; height: 41px; line-height: 38px; }
    .menu-box ul { margin: 6px 3px 0 3px; text-align: center; font-size: 0; }
    .menu-box li { margin: 4px 2px 0 2px; display: inline-block; vertical-align: top; }
    .menu-box a { padding: 0 10px 0 0; font-size: 14px; height: 41px; line-height: 41px; }
    .menu-box a i { margin: 3px 10px 3px 3px; width: 31px; height: 31px; line-height: 31px; font-size: 16px; }
    .header-button { height: 41px; line-height: 41px; }
    .header-button i { margin: 3px 10px 3px 3px; width: 31px; height: 31px; line-height: 31px; font-size: 16px; }
    .header-button span { display: inline; }
    .filter-box li.filter-icon { display: block; }
    .pages-box { margin-top: 0; }  
    .pages-box ul { margin-top: 16px; }
    .list-box ul { column-count: 3; -moz-column-count: 3; -webkit-column-count: 3; }
    .player-wrapper { padding-bottom: 20px; }
    .bhor-2, .player-bhor-2 { display: inline-block; }
}

@media all and (min-width:660px) {
    .thumb { width: 33.3333%; }
}

@media all and (min-width:800px) {
    .menu-box a { padding: 0 15px 0 0; height: 51px; line-height: 51px; font-size: 16px; }
    .menu-box a i { margin: 8px 12px 8px 8px; width: 31px; height: 31px; line-height: 31px; }
}

@media all and (min-width:1010px) {
    .wrapper-box { width: 990px; max-width: 100%; }
    .filter-box a { height: 41px; line-height: 39px; padding-right: 15px; min-width: 90px; text-align: center; }
    .filter-box a i { margin: 6px 8px 6px 6px;  }
    .filter-box span { height: 41px; line-height: 41px; font-size: 24px; width: 41px; }
    h1 { font-size: 26px; line-height: 30px; }
    h1 i { width: 22px !important; height: 22px !important; line-height: 22px !important; }
    h2 { font-size: 24px; line-height: 28px; }
    h2 i { width: 20px !important; height: 20px !important; line-height: 20px !important; }
    .bhor-box { padding: 10px 0 20px 0; }
    .bhor-3 { display: inline-block; }
    .thumb { width: 330px; }
    .thumb-inner-2 p { font-size: 20px; height: 42px; line-height: 42px; }
    .thumb-inner-2 p i { width: 28px; height: 28px; line-height: 28px; }
    .list-box ul { column-count: 4; -moz-column-count: 4; -webkit-column-count: 4; }
    .list-box span { display: block; height: 41px; line-height: 41px; font-size: 14px; }
    .list-box a i { margin: 6px 8px 6px 6px; }
    .player-wrapper-box, .player-bhor-box { display: table-cell; vertical-align: top; }
    .player-bhor-box { width: 310px; margin: 0; }
    .player-bhor { margin: 10px 0 0 10px; }
    .up-button { height: 50px; line-height: 50px; padding: 0 20px; }
}

@media all and (min-width:1340px) {
    .wrapper-box { width: 1320px; }
    a.logo-text { font-size: 44px; margin-right: 15px; height: 51px; line-height: 46px; }
    .header-button { display: none; }
    .menu-box, .search-box { clear: none; display: block !important; }
    .menu-box { float: left; margin-right: 5px; }
    .menu-box ul { margin: 8px 3px 0 5px; }
    .menu-box li { display: block; float: left; margin: 2px 2px 0 0; }
    h1 { font-size: 28px; line-height: 32px; }
    h1 i { width: 24px !important; height: 24px !important; line-height: 24px !important; }
    h2 { font-size: 26px; line-height: 30px; }
    h2 i { width: 22px !important; height: 22px !important; line-height: 22px !important; }
    .bhor-4 { display: inline-block; }
    .list-box ul { column-count: 6; -moz-column-count: 6; -webkit-column-count: 6; }
    .list-box span { font-size: 13px; }
    .player-box { padding-bottom: 0; height: 510px; }
}

@media all and (min-width:1670px) {
    .wrapper-box { width: 1650px; }
    a.logo-text { font-size: 50px; height: 61px; line-height: 54px; }
    .menu-box a { height: 61px; line-height: 61px; font-size: 18px; padding-right: 20px; }
    .menu-box a i { font-size: 18px; width: 41px; height: 41px; line-height: 41px; margin-left: 10px; margin-right: 15px; }
    .search-box-text { height: 57px; line-height: 57px; padding: 0 67px 0 20px; }
    .search-box input { font-size: 18px; }
    .search-box button { width: 57px; height: 57px; line-height: 57px; }
    .search-box button i { width: 43px; height: 43px; line-height: 43px; }
    h1 { font-size: 30px; line-height: 34px; }
    h1 i { width: 26px !important; height: 26px !important; line-height: 26px !important; font-size: 16px !important; }
    h2 { font-size: 28px; line-height: 32px; }
    h2 i { width: 24px !important; height: 24px !important; line-height: 24px !important; }
    .bhor-5 { display: inline-block; }
    .list-box span { font-size: 14px; }
    .player-bhor-3 { display: inline-block; }
    .player-box { height: 770px; }
    .player-meta-box li span, .player-meta-box li a { height: 41px; line-height: 38px; padding-right: 14px; }
    .player-meta-box li span i, .player-meta-box li a i { margin: 6px 8px 6px 6px; width: 25px; height: 25px; line-height: 25px; }

}