@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext&display=swap');
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
*{margin: 0; padding: 0; font-family: 'Roboto', sans-serif; box-sizing: border-box; -moz-box-sizing: border-box;}
*{  -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
html {width: 100%;}
body {width: 100%; -webkit-text-size-adjust:none; font-size: 14px; background-color: #2b303b; color: #ccc; z-index: 1;}
a {outline: none; text-decoration: none; transition: color .3s ease; color: #ddd;}
a:hover {color: #6bb6fc;}

.container {width: 100%; min-width: 300px; max-width: 1660px; margin: 0 auto; padding: 0 5px; overflow: hidden;}
.header {width: 100%; height: 50px; position: relative; z-index: 99; background-color: #22262f; transition: top .5s ease; border-bottom: 1px solid #333946;}
#overlay {display: none; position: fixed; left: 0; top: 50px; right: 0; bottom: 0; z-index: 98; background: #000; opacity: 0.5;}
.noscroll {margin: 0; height: 100%; overflow: hidden;}
a.logo {display: block; position: absolute; text-indent: -200%; overflow: hidden; left: 50%; top: 8px; width: 186px; height: 40px; margin-left: -94px; background: url("/assets/logo.png") 0 0 no-repeat; background-size: 186px 40px;}
.description {display: none;}
a#btn-menu {position: absolute; left: 10px; top: 14px; color: #fff;}
a#btn-search {position: absolute; right: 10px; top: 14px; color: #fff;}
a#btn-categories {position: absolute; right: 10px; top: 14px; color: #fff; display: none;}
a#btn-lang {position: absolute; right: 44px; top: 14px; color: #fff; line-height: 24px; padding-right: 14px; display: none;}
.lang-code {text-transform: uppercase; font-size: 15px;}
.lang-arrow {display: block; position: absolute; width: 10px; height: 10px; border: 5px solid transparent; border-top-color: #fff; right: 0; top: 10px;}
a#btn-menu.active, a#btn-search.active, a#btn-lang.active {color: #6bb6fc;}
a#btn-search i.search-hidden {display: inline-block;}
a#btn-search i.search-visible {display: none;}
a#btn-search.active i.search-hidden {display: none;}
a#btn-search.active i.search-visible {display: inline-block;}
.search {display:none; width: auto; position: absolute; left: 46px; right: 46px; top: 0; padding: 8px 100px 8px 10px; background: #0f1115;}
.search.opened {display: block;}
.sf {display: block; border: none; background: none; box-sizing: border-box; -webkit-appearance: none; border-radius: 0; line-height: 33px; width: 100%; outline: none; font-size: 14px; color: #ddd;}
.sb {display: block; position: absolute; right: 0; top: 0; border: none; box-sizing: border-box; -webkit-appearance: none; line-height: 49px; width: 46px; outline: none; cursor: pointer; text-align: center; background: #0f1115; color: #fff; border-radius: 21px;}
.sb i {vertical-align: middle;}
.sc {display: none; position: absolute; right: 47px; top: 0; border: none; box-sizing: border-box; -webkit-appearance: none; line-height: 49px; width: 38px; outline: none; cursor: pointer; text-align: center; background: none; color: #ddd;}
.sc i {vertical-align: middle; font-size: 16px;}
.bottomsearch {display: block; margin: 30px auto 20px auto; width: 300px; position: relative; left: auto; right: auto; top: auto; padding: 8px 100px 8px 20px; background: #0f1115; border-radius: 22px; border: 1px solid #333946;}
.bottomsearch .sf {line-height: 26px;}
.bottomsearch .sb, .bottomsearch .sc {line-height: 42px;}
::-webkit-input-placeholder {color: #aaa;}
:-moz-placeholder {color: #aaa;}
::-moz-placeholder {color: #aaa;}
:-ms-input-placeholder {color: #aaa;}
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    display: none;
}
.header.search-opened a.logo {display: none;}
.header.search-opened .search {display: block;}
body.scroll-header.header-on-scroll {padding-top: 60px;}
body.scroll-header.header-on-scroll .header {position: fixed; left: 0; top: 0;}
body.scroll-header.header-on-scroll .header {top: -60px; box-shadow: 0px 4px 8px rgba(0,0,0,0.5);}
body.scroll-header.header-on-scroll .header a.logo {display: none;}
body.scroll-header.header-on-scroll .header .search {display: block;}
body.scroll-header.header-on-scroll .header a#btn-search {display: none;}
body.scroll-header.header-on-scroll .header a#btn-categories {display: block;}
body.scroll-header.header-visible .header {top: 0;}

.autocomplete-suggestions {margin-top: 8px; font-size: 14px; overflow: auto; border: 1px solid #333946; border-top: none; background: #0f1115; box-shadow: 0px 4px 8px rgba(0,0,0,0.5); min-width: 190px;}
.autocomplete-suggestion {padding: 5px; white-space: nowrap; overflow: hidden; cursor: pointer; color: #ccc;}
.autocomplete-selected {background: #22262f; color: #ddd;}
.autocomplete-suggestions strong {font-weight: 400; color: #6bb6fc;}
.autocomplete-suggestions.history {padding-bottom: 40px; border-radius: 0 0 19px 19px;}
#btn-clear-history {display: block; position: absolute; cursor: pointer; bottom: 4px; left: 4px; right: 4px; line-height: 30px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 10px; font-size: 12px; font-weight: 500; background: #333946; color: #fff; border-radius: 15px;}
#menu {position: fixed; z-index: 100; width: 250px; top: 50px; bottom: 0; left: -250px; font-size: 0; padding: 5px; overflow-x: hidden; overflow-y: scroll; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: transparent; transition: all .5s ease; background-color: #22262f; border-right: 1px solid #333946;}
#menu.opened {left: 0;}
#menu .container {min-width: 0;}
#menu a {display: inline-block; vertical-align: top; width: 100%; font-size: 14px; line-height: 34px; color: #fff;}
#menu a i {vertical-align: middle; font-size: 20px; opacity: 0.6; padding-bottom: 2px;}
#menu hr {margin: 5px 0; border: 0; border-top: 1px solid #3f4551;}
#menu-ournetwork {display: block;}

#menu a#tolanguages {position: relative;}
#menu a#tolanguages .lang-arrow {top: 15px;}
#menu a#tolanguages.active {color: #6bb6fc;}
#menu a#tolanguages.active .lang-arrow {transform: rotate(180deg); border-top-color: #6bb6fc; top: 10px;}
#languages {display: none; width: 100%; padding: 4px; background-color: #2b303b; border: 1px solid #303642; border-radius: 19px;}
#languages.opened {display: block;}
#languages a {display: inline-block; vertical-align: top; width: 100%; font-size: 14px; line-height: 30px; padding: 0 10px; border-radius: 15px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#all_categories, #all_pornstars {position: relative;}
#all_categories_close, #all_pornstars_close {position: absolute; right: 5px; top: 20px;}

.h {display: block; padding: 5px; font-size: 0; text-align: left;}
h1,h2 {display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; line-height: 26px; font-size: 16px; font-weight: 500; text-transform: uppercase; color: rgba(255,255,255, 1);}
h1 span {display: inline-block; vertical-align: middle; margin-left: 5px; padding-left: 8px; font-size: 12px; line-height: 16px; font-weight: 400; border-left: 1px solid rgba(255,255,255,0.2); color: rgba(255,255,255,0.7); text-transform: none;}
h2 {display: block; padding: 5px; margin-top: 25px;}
#all_categories h2, #all_pornstars h2 {margin-top: 10px;}
.sorting, .durgrp, .pages {display: inline-block; width: 100%; margin-top: 6px; overflow: hidden; border-radius: 22px; padding: 4px; background: #22262f; border: 1px solid #333946; text-align: center;}
.sorting a, .durgrp a, .pages a {display: inline-block; text-align:center; padding: 0 5px; line-height: 32px; font-size: 14px; border-radius: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: top; min-width: 34px;}
.sorting a {width: 33.3333%;}
.durgrp a {width: 50%;}
.pages a.next, .pages a.prev, .pages a.first {font-weight: 700; font-size: 22px; line-height: 22px; padding: 5px;}
a.current, #languages a.current {background: #6bb6fc; color: #000; font-weight: 500;}

.content, .tcats {display: block; width: 100%; font-size: 0;}
center {width: 100%; font-size: 18px; padding: 20px 0;}
.content li, .tcats li {display: inline-block; width: 100%; padding: 7px 5px; vertical-align: top; overflow: hidden;}
.item {display: block; width: 100%; background: none; border: none;}
.thumb {display: block; width: 100%; position: relative; overflow: hidden; padding-top: 55.9%; border-radius: 4px; background: #22262f;}
.thumb img {display: block; position: absolute; left: 0; top: 0; width: 100%;}
.dur {display: block; position: absolute; right: 4px; bottom: 4px; width: 50px; text-align: center; background-color: rgba(0,0,0,0.7); line-height: 21px; font-size: 11px; font-weight: 700; color: #fff; z-index: 20; border-radius: 2px;}
.add {display: block; position: absolute; left: 4px; bottom: 4px; padding: 0 5px; background-color: rgba(0,0,0,0.7); line-height: 21px; font-size: 11px; font-weight: 500; color: #fff; z-index: 20; border-radius: 2px}
.hdlabel {display: block; position: absolute; right: 4px; top: 4px; width: 30px; text-align: center; background-color: rgba(0,0,0,0.7); line-height: 21px; font-size: 11px; font-weight: 500; color: #fff; border-radius: 2px;}
.rating {display: block; position: absolute; left: 4px; bottom: 4px; width: 44px; text-align: center; background-color: rgba(0,0,0,0.7); line-height: 21px; font-size: 11px; font-weight: 500; color: #fff; z-index: 20; border-radius: 2px; vertical-align: top;}
.rating i {font-size: 11px; line-height: 21px; vertical-align: top; font-weight: 400;}
.rating.neg {color: #fd5d57;}
.rating.pos {color: #3dea37;}
.info {position: relative; overflow: hidden;}
.info .title {padding: 0; display: block; font-size: 13px; line-height: 25px; min-height: 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 500; color: rgba(255,255,255, 0.75); transition: color .3s ease;}
.info .added {padding: 0 40px 0 0; display: block; font-size: 11px; line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 400; color: rgba(255,255,255, 0.6);}
.info .added.recent {color: rgba(255,255,255, 0.9); font-weight: 500; color: #6bb6fc;}
.info a.from {padding: 0 40px 0 0; display: block; font-size: 11px; line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 400; color: rgba(255,255,255, 0.75);}
.info .tags {width: 100%; height: 24px; padding: 0 5px; overflow: hidden;}
.info .tags a {display: none; margin-right: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 24px; font-size: 11px; font-weight: 400;}
.info .tags a:before {content: '#'; font-weight: 300; color: #6bb6fc;}
.info .tags a.src {display: inline-block;}
.info .tags a.src:before {display: none;}

.vote {display: none; position: absolute; bottom: 30px; left: 50%; font-size: 0; width: 136px; margin-left: -68px; padding: 4px 0 4px 4px; border-radius: 24px; background: #fff;}
a.voteup, a.votedown, a.voteclose {display: inline-block; vertical-align: top; width: 40px; height: 40px; margin-right: 4px; border-radius: 20px; color: #fff; text-align: center;}
.vote a i {font-size: 24px; line-height: 40px;}
.vote a:hover i {font-size: 28px;}
a.votedown {background: #b32d28;}
a.voteup {background: #2db328;}
a.voteclose {color: #000;}
.votedup, .voteddown {display: none; position: absolute; bottom: 30px; left: 50%; width: 60px; height: 60px; margin-left: -30px; border: 4px solid #fff; border-radius: 30px; font-size: 0; text-align: center;}
.votedup i, .voteddown i {vertical-align: top; font-size: 32px; line-height: 52px; color: #fff;}
.voteddown {background: #b32d28;}
.votedup {background: #2db328;}

a.report {display: block; position: absolute; right: 0px; top: 30px; width: 32px; height: 20px; text-align: right;}
a.report i {font-size: 20px;}
#report-form {display: block; padding: 0;}
#report-form-content {display: block; position: relative; padding-top: 34px; background: #22262f; border: 1px solid #22262f;}
a#report-form-close {position: absolute; right: 5px; top: 5px;}
#report-iframe {height: 400px;}
li.report-active {padding: 0;}
li.report-active .item {padding: 7px 5px; background: #22262f; border-color: #22262f; border-radius: 4px 4px 0 0;}

.tcats li .item {position: relative;}
.tcats li h3 {padding: 0 30px 0 0; font-size: 15px; line-height: 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; font-weight: 500; text-transform: uppercase;}
.tcats li .cnt {position: absolute; right: 0; bottom: 0; padding: 0; line-height: 25px; font-size: 11px; white-space: nowrap; text-align: right; font-weight: 500; color: rgba(255,255,255,0.5);}

.related {padding: 5px;}
.related>span {display: block; width: 100%; padding: 5px 0; margin-top: 10px; text-align: left; line-height: 26px; font-size: 16px; font-weight: 700; color: #ddd;}
.related a {display: inline-block; padding: 0 10px; margin-right: 5px; margin-bottom: 5px; line-height: 33px; font-size: 13px; border-radius: 17px; text-transform: capitalize; background: #22262f;}

.categories {padding: 0 5px; font-size: 0; margin-bottom: 40px;}
.categories ul {margin-bottom: 5px;}
.categories.popular ul {margin-bottom: 0;}
.categories ul li {list-style: none; display: inline-block; margin-right: 5px; margin-bottom: 5px;}
.categories .letter {margin: 0; padding: 0 15px; display: block; line-height: 33px; font-size: 16px; font-weight: 500; color: #ef4c8d;}
.categories ul li a {display: inline-block; width: 100%; padding: 0 15px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 33px; font-size: 13px; border-radius: 17px; text-transform: capitalize; background: #22262f;}
.categories ul li span {display: none;}

.tradeindex {padding: 0; font-size: 0;}
.tradeindex ul {margin-bottom: 20px; columns: 150px 4; column-gap: 0;}
.tradeindex ul li {display: block; margin-right: 0; padding: 0 10px; margin-bottom: 0; width: 100%; line-height: 30px; border-bottom: 1px solid #303642; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: #ef4c8d;}

.footer {padding: 10px 5px; margin-top: 30px; font-size: 12px; line-height: 14px; background: #22262f; border-top: 1px solid #333946; color: #ccc;}
.footer a {color: #6bb6fc;}
.footer i {font-size: 14px; line-height: 14px; vertical-align: top;}
.footer p {padding: 5px 0;}
#back-to-top {position: fixed; z-index: 9999; right: 20px; bottom: 7%; display: block; padding: 8px 10px; background-color: rgba(0,0,0,0.5); border-radius: 10px;}
#back-to-top i {font-size: 36px; color: #fff;}

@media all and (min-width: 340px) {
    .content li, .tcats li {width: 50%;}
}
@media all and (min-width: 600px) {
    .bottomsearch {width: 460px;}
    .sorting {width: calc(60% - 3px);}
    .durgrp {width: calc(40% - 3px);}
    .sorting {margin-right: 6px;}
    #report-iframe {height: 280px;}
}
@media all and (min-width: 680px) {
    .content li, .tcats li {width: 33.33333%;}
}
@media all and (min-width: 760px) {
    .content li, .tcats li {width: 33.33333%;}
    .filters {width: 100%;}
    .sorting {width: 240px;}
    .durgrp {width: 160px;}
    .pagination {display: inline-block; text-align: right; width: calc(100% - 406px);}
    .pages {width: auto;}
    .info .tags a {display: inline-block;}
    /*no pagination at the top*/
    h1 {display: block; float: left; width: auto; vertical-align: top; line-height: 42px;}
    .filters {display: block; float: right; vertical-align: top; text-align: right; width: auto; white-space: nowrap;}
    .h {padding-top: 10px;}
    .h:after {content: ''; display: table; clear: both;}
    .pagination {width: auto; margin-left: 6px;}
    .sorting, .durgrp, .pages {margin-top: 0;}
    .h.bottom .filters {width: 100%;}
    .h.bottom .pagination {width: calc(100% - 406px); margin-left: 0;}
}
@media all and (min-width: 900px) {
    .description {display: block; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-align: center; -webkit-line-clamp: 3; overflow: hidden; font-size: 12px; line-height: 14px; text-overflow: ellipsis; position: absolute; top: 14px; height: 42px; left: 250px; right: 370px;}
    #all_categories h2, #all_pornstars h2 {margin-top: 0;}
    .info .tags a {font-size: 12px;}
    .sorting {width: 270px;}
    .durgrp {width: 180px;}
    .h.bottom .pagination {width: calc(100% - 456px);}
}
@media all and (min-width: 1025px) {
    .container {position: relative;}
    a#btn-menu, a#btn-search, a#btn-lang {display: none;}
    body.with-fixed-header {padding-top: 0;}
    .header {position: relative; left: auto; right: auto; width: 100%; height: 70px; background: #2b303b;}
    a.logo {display: inline-block; position: static; left: auto; top: auto; margin-left: 0; margin-top: 15px; width: 210px; height: 45px; background-size: 210px 45px;}
    .search {display: block; position: absolute; z-index: 100; top: 13px; left: auto; right: 10px; width: 320px; border-radius: 22px; border: 1px solid #333946; padding-left: 20px;}
    .search .autocomplete-suggestions {margin-top: 7px;}
    .sb {background: #0f1115;}
    .sf {line-height: 26px;}
    .sb, .sc {line-height: 42px;}
    #menu {position: static; left: 0; top: auto; bottom: auto; overflow: visible; width: 100%; border-right: none; border-bottom: 1px solid #333946;}
    /*#menu .container {white-space: nowrap; -webkit-overflow-scrolling: touch; overflow: auto;}*/
    #menu hr {display: none;}
    #menu-ournetwork {display: none;}
    #menu a {width: auto; margin-right: 20px;}
    #menu a#tolanguages {display: inline-block; margin-right: 10px; float: right; position: relative; padding-right: 14px;}
    #menu a#tolanguages:hover .lang-arrow {border-top-color: #6bb6fc;}
    #languages {margin-top: 4px; margin-bottom: 4px;}
    #languages a {width: 16.6666%; margin-right: 0;}
    /*a.logo {margin-top: 10px; width: 245px; height: 50px; background-size: 245px 50px;}*/
    .description {left: 300px;}
    #menu a:hover {color: #6bb6fc;}
    #menu a i {color: #fff;}
    h1 {display: block; float: left; width: auto; vertical-align: top; line-height: 42px;}
    .filters {display: block; float: right; vertical-align: top; text-align: right; width: auto; white-space: nowrap;}
    .h:after {content: ''; display: table; clear: both;}
    .pagination {width: auto; margin-left: 6px;}
    .sorting, .durgrp, .pages {margin-top: 0;}
    .h.bottom .filters {width: 100%;}
    .sorting {width: 300px;}
    .durgrp {width: 200px;}
    .h.bottom .pagination {width: calc(100% - 506px);}
    /*
    .container {max-width: 1000px;}
    .search {right: 50%; margin-right: -490px;}
    */
    .content li.report-active:hover .item {background: #22262f;}
    .info .tags a:hover, a.from:hover, .content li:hover .info .title {color: #6bb6fc;}
    .content li:hover .info .title {color: #fff;}
    .categories {padding: 0;}
    .categories ul {margin-bottom: 20px; columns: 240px 6; column-gap: 0;}
    #all_pornstars .categories ul {columns: 240px 5;}
    .categories ul li {display: block; margin-right: 0; padding: 0 10px; margin-bottom: 0;}
    .categories .letter {padding: 0 10px; line-height: 30px; font-size: 18px;}
    .categories ul li a {background: none; border-radius: 0; padding: 0; width: 70%; line-height: 30px; border-bottom: 1px solid #303642; font-size: 14px; box-shadow: none;}
    .categories ul li span {display: inline-block; width: 30%; line-height: 30px; min-height: 31px; font-size: 11px; text-align: right; vertical-align: top; border-bottom: 1px solid #303642; color: rgba(255,255,255,0.5);}
    .related {margin-top: 10px;}
    .related>span {display: inline-block; width: auto; margin-top: 0; margin-right: 5px; line-height: 25px; font-size: 14px;}
    .related a {background: none; border-radius: 0; padding: 0; margin-right: 15px; font-size: 14px; box-shadow: none;}
    .related a:before {content: '#'; font-weight: 300; color: #6bb6fc;}
}
@media all and (min-width: 1280px) {
    .description {-webkit-box-orient: inherit; font-size: 13px; left: 24%; right: 30%;}
    h1,h2 {font-size: 20px;}
    .categories ul li a {font-size: 15px;}
    .categories ul li a {width: 75%;}
    .categories ul li span {width: 25%;}
    .container {max-width: 1330px;}
    .content li, .tcats li {width: 25%;}
    .search {right: 10px; margin-right: 0;}
    .tcats li h3 {font-size: 15px;}
    #languages {float: right;}
    #languages a {width: 8.3333%;}
    #menu-ournetwork {display: inline-block; vertical-align: top; max-width: 350px; overflow: hidden; white-space: normal; height: 34px;}
    .tradeindex ul {columns: 150px 6;}
    .tradeindex ul li {font-size: 15px;}
}
@media all and (min-width: 1340px) {
    .search {right: 50%; margin-right: -655px;}
}
@media all and (min-width: 1660px) {
    .container {max-width: 1660px;}
    .search {right: 50%; margin-right: -820px;}
    .content li, .tcats li {width: 20%;}
    #menu-ournetwork {max-width: 700px;}
}
