html, body {max-width: 100%; overflow-x: hidden; }

ul {list-style-type: none; margin: 0; padding: 0;}

.full {width: 100%;}
.logo {width: 20%; float: left;}
.logo img { max-width: 199px; max-height: 62px; width: auto; height: auto; display: block; object-fit: contain; }
.search {width: 37%; float: left; padding: 15px 0; }
.top-links {width: 40%; float: right; margin-top: 20px; text-align: right;}
.top-links div, .top-links a {display: inline-block; margin-left: 5px;}

.dropdown-menu {z-index: 9000;}
.modal {z-index: 9050;}
.tooltip {background: transparent !important; z-index: 9999999 !important;}

.dropdown-menu {margin-top: 7px;}
.dropdown-menu:before, #playlists-container:before {position: absolute;top: -7px;left: 9px;display: inline-block;border-right: 7px solid transparent;border-bottom: 7px solid #ccc;border-left: 7px solid transparent;border-bottom-color: rgba(0, 0, 0, 0.2);content: '';}
.dropdown-menu:after, #playlists-container:after {position: absolute;top: -6px;left: 10px;display: inline-block;border-right: 6px solid transparent;border-bottom: 6px solid #ffffff;border-left: 6px solid transparent;content: '';}
.navbar .navbar-right > li > .dropdown-menu:before, .navbar .nav > li > .dropdown-menu.navbar-right:before, .dropdown-menu-right:before { right: 12px; left: auto;}
.navbar .navbar-right > li > .dropdown-menu:after, .navbar .nav > li > .dropdown-menu.navbar-right:after, .dropdown-menu-right:after {right: 13px; left: auto;}
#playlists-container:before { right: 1px; left: auto;}
#playlists-container:after { right: 2px; left: auto;}

ul.menu {margin: 0; padding: 0;}
ul.menu li {float: left; font-size:13px; margin-right: 1px;}
ul.menu li.upload {float: right; margin-right: 0; margin-top: 10px;}
ul.menu li a {display: block; padding: 15px 15px;}
ul.menu li.upload a {padding: 4px 8px;}
ul.menu > li > ul {display: none;width: 100%;position: absolute;padding: 5px 0;z-index: 9000;left: 0;margin: 0;list-style: none;box-sizing: border-box;}
ul.menu > li > ul:before,ul.menu > li > ul:after {content: "";display: table;}
ul.menu > li > ul:after {clear: both;}
ul.menu > li > ul > li, ul.menu > li.active > ul > li {width: 100%;text-align: center;list-style: none;margin: 0;}
ul.menu > li > ul > li > a,ul.menu > li.active > ul > li > a {display: inline-block;margin: 0 2px 5px 2px;}
ul.menu > li > ul.categories-dropdown > li > a {padding: 5px; }
ul.menu > li > ul.categories-dropdown > li > a.see-more {width: 100px; padding-top: 40px; text-align: center; vertical-align: top;}
ul.menu > li > ul.categories-dropdown > li > a.see-more i {display: block; margin-bottom: 27px;}

.container {position: relative;}
.content {margin-top: 10px; padding: 0 5px 0 5px;}
.content-right, .profile-info, .model-info, .channel-info, .profile-c-content {margin-left: 225px;width: auto;overflow: hidden;position: relative;min-height: 100%;}
.content-left, .profile-image, .model-image, .channel-image, .profile-c-menu {width: 215px;float: left;position: relative;}

ul.videos, ul.thumbs, ul.users, ul.categories, ul.albums, ul.photos, ul.models, ul.channels, ul.playlists {text-align: center;}
ul.videos li, ul.thumbs li, ul.users li, ul.categories li, ul.albums li, ul.photos li, ul.models li, ul.channels li, ul.playlists li {height: auto; display: inline-block; margin: 0 4px 10px 4px; vertical-align: top; overflow: none; position: relative; font-size: 14px; text-align: left; }

.video-thumb, .model-thumb, .category-thumb, .channel-thumb, .playlist-thumb, .user-thumb, .photo-thumb {position: relative; margin-bottom: 5px; width: 100%; overflow: none;}
.video-thumb img, .model-thumb img, .category-thumb img, .channel-thumb img, .playlist-thumb img, .user-thumb img, .photo-thumb img {width: 100%; max-width: 100%; min-width: 100%; height: auto;}
.video-thumb video {width: 100%; height: 100%; position: absolute; top:0; left: 0; padding: 0; margin: 0; }
.video-thumb > .thumb-slider {position: absolute; z-index: 3; left: 0; top: 0; width: 100%; height: 3px; }
.video-thumb > .thumb-slider > div {height: 100%; color: red; line-height: 3px; width: 0;}
.video-thumb > .thumb-loader {position: absolute; z-index: 3; right: 5px; top: 5px;}
.private-overlay {display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-align: center; opacity: 0.9; font-size: 20px; padding-top: 15%; z-index:1213131311231331;}
.private {width: 100%; min-height: 200px; text-align: center; padding: 20% 0; font-weight: bold;}
.premium-overlay {display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 20px; text-align: center; opacity: 0.9; font-size: 16px; font-weight: bold;}

.actions {position: absolute; z-index: 4; left: 5px; top: 5px;}
.thumb {display: inline-block; border: 2px solid transparent; margin: 0 5px 7px 0; width: 202px;}
.title {max-height: 34px; overflow: hidden; display: block; line-height: 116%; width: 100%; }
.views {display: inline-block; font-size: 13px;}
.rating {margin-left: 5px; font-size: 13px;}
.up i {color: green;}
.down i {color: red;}

.btn-playlist {position: absolute; z-index: 4; right: 5px; top: 5px;}
.btn-filter {min-width: 98%;}
.btn-toolbar-menu, .btn-profile-edit {float: right;}
.panel-title-left {float: left;}

.model-title, .category-title, .channel-title, .playlist-title, .user-title {max-height: 19px; overflow: hidden; display: block; line-height: 116%; width: 100%;}
.model-videos, .category-videos, .channel-videos, .playlist-videos, .category-albums {position: absolute; z-index: 2; top: 0px; right: 0px;}
.model-rank, .channel-rank {position: absolute; z-index: 2; left: 0px; bottom: 0px; width: 100%; padding: 2px 0;}
.channel-rank {bottom: -1px;}
.model-filters-container, .user-filters-container {padding: 20px 10px;}
.model-filters-container span.filter-label, .user-filters-container span.filter-label {font-size: 12px; padding-bottom: 3px; display: block;}
.model-filter-col, .user-filter-col {width: 19.9%; float: left; margin-bottom: 15px; display: block;}
.model-image {width: 180px;}
.model-info {margin-left: 200px;}

.model-image img, .channel-image img {width: 100%; height: auto; }

.channel-image {width: 160px; overflow: none;}
.channel-info {margin-left: 180px; min-height: 200px;}

.playlist-container {position: relative;}
.playlist-overlay {position: absolute; z-index: 2; width: 100%; bottom: 0; }
.playlist-view, .playlist-play {width: 50%; display: inline-block; float: left; text-align: center; padding: 2px 0; }

.user-comments {padding: 0 20px;}
.user-online {position: absolute; z-index: 2; top: 0; right: 0; padding: 2px 3px;}

.info {padding: 10px 5px 10px 5px; display: block; font-size: 13px; color: #575757;}
.profile {position: relative; overflow: hidden;}
.profile-image {width: 200px; position:relative;}
.profile-image-edit {position: absolute; left: 5px; bottom: 5px;}
.profile-info {margin-left: 220px;}
.profile-left {margin-left: -360px; margin-right: 10px; position: relative; min-height: 100%; width: 100%; overflow: hidden; float: left;}
.profile-left .tablist, .profile-stream {margin-left: 360px;}
.profile-right {width: 350px; float: left; margin: 10px 0 0 0;}
.profile-content {padding: 10px 5px 0 5px !important;}
.stream {width: 100%; margin-bottom: 10px;}
.profile-content-header {padding: 5px 15px 20px 15px;}
.profile-title {font-size: 16px; font-weight: bold; }
.profile-title span {font-size: 14px; font-weight: normal;}
.profile-action {float: left; margin-right: 5px;}
.profile-username {float: left;}

.profile-c {padding: 5px;}
.profile-c-left {float: left;}
.profile-c-right {float: right;}
.profile-c-image {width: 190px; position: relative; float: left;}
.profile-c-image .profile-image-edit {left: 7px; bottom: 7px;}
.profile-c-info {width: auto; margin-left: 200px; overflow: hidden; }
.profile-c-row {width: 100%; margin-bottom: 5px;}
.profile-c-label {width: 140px; float: left; position: relative; }
.profile-c-value {width: auto; margin-left: 150px; overflow: hidden; font-weight: bold;}
.profile-c-about {margin-top: 10px; padding-top: 10px;}
.profile-c-menu {width: 130px; }
.profile-c-menu img {width: 118px; margin: 5px;}
.profile-c-content {margin-left: 135px;}
.profile-c-actions {text-align: center; width: 100%; padding: 5px 0 0 0;}
.profile-c-action {display: inline-block;}
.profile-c-friend {float: none !important; margin: 0 !important;}
.profile-c-panel {padding: 10px 5px 10px 5px !important;}
h1.profile-c-username {font-size: 20px; text-align: center; font-weight: bold; padding: 0; margin-top: 0;}

.members {position: relative;}
.members-left {width: auto; overflow: hidden; margin-right: 360px; position: relative;}
.members-right {float: right; width: 350px; overflow: hidden;}

.margin-top-10 {margin-top: 10px;}
.margin-bottom-10 {margin-bottom: 10px;}

#profile-cover {width: 100%; max-height: 270px; }
#profile-avatar {position: absolute;}
#profile-header {}
#profile-wall {padding: 10px 0 20px 0; width: 100%; }
#profile-wall-buttons {margin-top: 10px; display: none;}
#profile-wall-actions {width: 100%; text-align: center; }
.profile-wall-action {padding-top: 10px; width: 100%;}
#profile-editor-toolbar {width: auto; margin 0 auto; text-align: center; }
#profile-editor {min-height: 200px;border-collapse: separate;padding: 4px;box-sizing: content-box;overflow: auto;outline: none;margin: 10px 0; }

.wall-rating {}
.wall-comments {padding-top: 10px;}

.none, .perms {padding: 10% 0; width: 100%; text-align: center; font-weight: bold; font-size: 14px;}
.perms {padding: 10px 0;}
.copyright {padding: 10px 0; text-align: center; }
.alert-response {padding: 10px 5px 10px 5px; text-align: center; margin: 5px 5px 5px 5px;}

.adv, .adv-native {width: 100%; text-align: center; margin-bottom: 5px;}
.adv img, .adv-native img {max-width: 100%; height: auto;}
.adv-native {margin: 0 10px 0 15px; padding: 0;}
.adv-container {padding: 10px 0 5px 0; margin-bottom: 10px; text-align: center;}
.adv-square {width: 310px;height: 100%;float: right;text-align: center;overflow: hidden;}
.adv-footer {width: 310px;height: auto; display: inline-block; text-align: center; overflow: hidden;}

#content {padding-bottom: 10px; }
#content h1 {width: 100%; height: 30px; font-size: 18px; font-weight: bold; overflow: hidden; padding: 0; margin:0;}
#content h3 {font-size: 16px; font-weight: bold; margin: 0; padding: 0 0 5px 0;}
#content .right {width: 302px; float: right; display: block; padding: 10px; }
#content .left {margin-right: 310px; width: auto; overflow: hidden; position: relative; padding: 10px;}
#content .left-tab-content {border-top: 0; padding: 20px 0 10px 0;}
#content .left-full {margin-right: 0; margin-left: 0; width: 100%;}

#video {}
#video .right, #album .right, #photo .right, #playlist .right {width: 302px; float: right; display: block; text-align: center; }
#video .container-left, #playlist .container-left, #album .container-left, #photo .container-left {width: 100%; float: left; margin-right: -310px;}
#video .left, #playlist .left, #album .left, #photo .left, #playlist .left {margin-right: 310px; }
#video .container-premium {width: 100%;}
#video h1, #playlist h1, #album h1 {width: 100%; height: 30px; overflow: hidden;}
#photo {margin-bottom: 10px;}
.content-group {overflow: hidden;}
.content-group-left {width: 180px; float: left; }
.content-group-right {margin-left: 180px; width: auto; overflow: hidden; position: relative; text-align: left;}
.content-group-header:hover {cursor: pointer;}
.channel-logo {text-align: center;}
.channel-logo img {max-width: 180px; height: auto;}
.channel-name {font-size: 15px; font-weight: bold;}
p.channel-desc {font-size: 13px;}

#playlist h1 {width: auto;}
.content-rating {width: 70%; }
.progress {height: 5px; background: red; border-radius: 0; margin: 0; padding: 0;}
.progress .progress-bar {background: green;}
.content-info, .topic-posts, .topic-posted, .post-posted {width: 100%; margin-bottom: 5px;}

ul.buttons {}
ul.buttons li {margin-right: 10px; display: inline-block;}

#player-container {position: relative; display: block; width: 100%; padding-bottom: 56.25%; min-height: 240px; }
#player-container-fluid {width: 100%; position: relative; display: block; min-height: 240px;}
#player {position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: 100% auto;}
#player-fluid {display: none; width: 100%; height: 100%;}
#player-advertising {background: rgb(0, 0, 0);background: rgba(0, 0, 0, 0.5);position: absolute;text-align: center;width: 306px;height: 280px;padding: 5px 0;top: 45%;left: 50%;margin: -140px 0 0 -153px;z-index: 1002;}
#player-premium {background: rgb(0, 0, 0);background: rgba(0, 0, 0, 0.5);position: absolute;text-align: center;width: 80%;height: 30%;padding: 10% 0 15% 0;top: 20%;left: 10%;z-index: 2; font-size: 22px; font-weight: bold; display: none;}
.player-none {text-align: center;width: 100%;height: 200px !important;padding: 100px 0 0 0 !important;font-size: 22px; font-weight: bold; }
#player-close {display: block;margin-top: 3px 0 3px 0;font-weight: bold;}

.post-comment {margin-bottom: 20px;}
.post-comment textarea {height: 65px;}
.post-comment-image {width: 64px; float: left; display: block;}
.post-comment-image img {width: 64px;}
.post-comment-message {margin-left: 74px; width: auto; overflow: hidden; position: relative;}
.post-comment-message input {margin-bottom: 5px;}
.post-comment-footer {margin-top: 5px;}
.comment-vote-response {display: none;}
.comment-spam-response {font-size: 12px;}
#comments {padding: 10px 5px;}
#comment-field {display: none;}
.comments-container {margin-top: 10px; text-align: left;}
.btn-post {float: right;}

ul.footer {list-style-type: none; width: 100%; }
ul.footer li {display: inline; padding: 0 10px;}

ul.list-footer {list-style-type: none; font-size: 14px;}
ul.list-footer li {width: 100%; margin: 5px 0;}
ul.list-footer li.list-header {font-weight: bold; margin-bottom: 10px;}

hr {margin: 18px 10px 18px 10px;}

.embed-video-title {width: 100%; display: block; text-align: center;}

.scrollable-menu {height: auto;max-height: 200px;overflow-x: hidden;}

.content-search-right {margin-left: 225px;width: auto;overflow: hidden;position: relative;min-height: 100%;}
.content-search-left {width: 215px;position: relative;float: left;}

.panel-title-left {float: left;}
.panel-title-right {float: right;}
.panel-search {margin-bottom: 5px;}

#push-menu, #push-search {position: absolute;top: 10px;display: none;z-index: 3;}

#push-menu {left: 5px;}
#push-search {right: 5px;}

#image {position: relative; width: 100%; text-align: center; padding: 10px 0;}
#slideshow {float: right;}
.photo-prev, .photo-next {position: absolute; top: 0; height: 100%; display: none; width: 35px;}
.photo-prev {left: 0px;}
.photo-next {right: 0px;}
.photo-prev i, .photo-next i {position: absolute; top: 49%; left: 5px;}
.photo-none {width: 100%; height: 100px; padding-top: 50%; text-align: center; font-weight: bold;}

.panel-forum h1 {width: 70% !important; overflow: hidden;}
.forum-box, .forum {width: 100%; }
.forum-border {border-bottom: 0;}
.forum-header, .forum-footer {margin-top: 0; padding: 10px 0;}
.forum-pagination {float: left; width: 69%; padding: 0; margin: 0; }
.forum-pagination .pagination {margin: 0; padding: 0;}
.forum-action {float: right; text-align: right; width: 29%;}
#post-content {width: 100%; height: 300px;}
.topic, .post {padding: 10px 5px; overflow: none;}
.topic-info, .forum-info {width: 60%; float: left; }
.topic-read, .forum-read {width: 40px; padding: 2px 3px; text-align: center; float: left; font-size: 18px;}
.topic-title, .forum-title {float: left; font-size: 16px; margin-left: 5px; overflow: hidden; width: 90%; white-space: nowrap;}
.topic-added {font-size: 12px; display:block;} 
.topic-stats, .forum-stats {width: 14%; float: left; text-align: right;}
.topic-last, .forum-last {width: 24%; float: right; }
.topic-user, .post-user {float: left; padding: 10px 20px 10px 10px; text-align: center;}
.topic-img, .post-img {position: relative; width: 100%;}
.topic-user img, .post-user img {width: 100%; height: auto;}
.topic-content, .post-content {float: right; padding: 0 10px 0 0; }
.topic-text img, .post-text img {max-width: 100%; height: auto; position: relative;}
.topic-footer, .post-footer {width: 100%; }
.signature {float: left;}
.topic-actions, .post-actions {float: right; text-align: right;}
.quote {width: 100%; padding: 5px;}
.topic-posted, .forum-desc {display: block;}

ul.columns {width: 100%; padding: 5px;}
ul.columns li {width: 19.70%; float: left; margin-left: 0.3%;}
ul.image-list {}
ul.image-list li {width: 60px; height: 100px; padding: 5px 10px;}
ul.image-list li a {text-decoration: none; border: 1px solid red;}
ul.image-list li a:hover {text-decoration: none;}
ul.image-list li a.model-image-l {
  width: 60px; float: left;
}
ul.image-list li .model-name-l {float: right;}
ul.image-list li .model-rank-l {}
ul.list-features {padding-left: 10px;}

.kb-title {display: block;}
.kb-content {display: block;}

table.inbox {width: 98%;margin: 0 1%;}
table.inbox > tbody > tr > td,
table.inbox > thead > tr > th {vertical-align: middle;}
table.inbox > tbody > tr > td > a.new {font-weight: bold;}
table.inbox > tbody > tr > td > a:hover {text-decoration: none;}

.inbox {padding: 0 10px; }
.inbox-message {padding: 5px 0; }
.inbox-image {width: 60px; padding: 0 10px 0 0; float: left; }
.inbox-info {width: auto; overflow: hidden; vertical-align: middle;}
.inbox-date {float: right; font-size: 12px;}

#push-users {display: none; float: right;}
#close-users {margin: 5px 5px 0 0; display: none; float: right; }
.chat-container {position: relative;}
.chat {margin-right: 260px; height: 100%; overflow: hidden;}
.chat-users {width: 250px; float: right; display: block; overflow: hidden;}
.chat-users-header {padding: 5px;}
.chat-users-list ul {height: 100%; overflow: auto; padding: 0; }
.chat-avatar {width: 60px; float: left;}
.chat-profile {float: left;}
.chat-actions {float: right;}
#friend, #block {float: right; margin-left: 5px;}
.chat-body {height: 500px; overflow: auto;}
.chat-footer span {display: block; }
.chat-footer textarea {margin: 5px 0;}
.message-icon {width: 20px; float: left; }
.message-username {float: left;}
.message-info {float: right; }
.message-body {display: block; }

.dashboard {display: block; margin-top: 10px; margin-bottom: 25px; font-size: 18px;}

@media (max-width: 1023px) {
    .top {
        height: 80px !important;
    }

    .logo {
        width: 100% !important;
        height: 60px !important;
        top: -5px !important;
        left: 0 !important;
        text-align: center !important;
        float: none !important;
        position: absolute !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
    }

    .logo img {
        width: auto !important;
        max-width: 170px !important;
        height: auto !important;
        max-height: 50px !important;
        margin: 0 auto !important;
    }

    #menu {
        top: 79px !important;
    }
}

/* =========================================================
   TabooHELL Shorts Homepage Widget
   ========================================================= */

.videos-shorts {
    display: flex;
    flex-wrap: nowrap;
    gap: 15px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}

.videos-shorts .video-short {
    flex: 0 0 calc(20% - 12px);
    min-width: 0;
    margin: 0;
    padding: 0;
}

.videos-shorts .short-image {
    display: block;
    text-decoration: none;
}

.videos-shorts .short-thumb {
    position: relative;
    width: 100%;
    aspect-ratio: 9 / 16;
    overflow: hidden;
    background: #111;
    border-radius: 5px;
}

.videos-shorts .short-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.videos-shorts .short-play {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin: -21px 0 0 -21px;
    border-radius: 50%;
    background: rgba(0, 0, 0, .65);
    color: #fff;
    font-size: 17px;
    opacity: .95;
}

.videos-shorts .short-play i {
    margin-left: 2px;
}

.videos-shorts .short-duration {
    position: absolute;
    right: 6px;
    bottom: 6px;
    padding: 2px 5px;
    border-radius: 3px;
    background: rgba(0, 0, 0, .75);
    color: #fff;
    font-size: 11px;
    line-height: 1.3;
}

.videos-shorts .short-title {
    display: block;
    margin-top: 7px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.videos-shorts .short-title a {
    color: inherit;
    text-decoration: none;
}

.videos-shorts .short-views {
    display: inline-flex !important;
    align-items: center;
    margin-top: 0;
    margin-right: 10px;
    color: #888;
    font-size: 12px;
}

.videos-shorts .short-meta {
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin-top: 3px;
}

.videos-shorts .short-like {
    display: inline-flex !important;
    align-items: center;
    color: #888;
    font-size: 12px;
}

.videos-shorts .video-short:hover .short-play {
    opacity: 1;
}

@media (max-width: 991px) {
    .videos-shorts .video-short {
        flex-basis: calc(25% - 12px);
    }
}


.videos-shorts .short-meta {
    display: flex;
    gap: 8px;
    margin-top: 4px;
    color: #888;
    font-size: 12px;
}

.videos-shorts .short-like {
    color: #e74c3c;
}

.videos-shorts .short-meta i {
    margin-right: 3px;
}

.videos-shorts .short-badge {
    position: absolute;
    top: 6px;
    left: 6px;
    padding: 3px 7px;
    border-radius: 4px;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    z-index: 5;
}

.videos-shorts .short-hd {
    background: rgba(0,120,255,.9);
}

/* SHORT BADGES FINAL */

.videos-shorts .short-badge {
    position: absolute;
    top: 6px;
    z-index: 10;
    padding: 3px 7px;
    border-radius: 4px;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    text-shadow: 0 1px 2px #000;
}

.videos-shorts .short-hd {
    left: 6px;
    background: rgba(0,120,255,.90);
}

.videos-shorts .short-duration {
    display:flex;
    align-items:center;
    gap:5px;
}

.videos-shorts .short-like {
    color:#fff;
    font-size:11px;
}

.videos-shorts .short-like i {
    margin-right:2px;
}

/* SHORT FINAL BADGES */

.videos-shorts .short-badge {
    position: absolute;
    top: 6px;
    z-index: 20;
    padding: 3px 8px;
    border-radius: 4px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    text-shadow: 0 1px 2px #000;
}

.videos-shorts .short-hd {
    left: 6px;
    background: #1677ff;
}

.videos-shorts .short-meta {
    display: flex;
    gap: 10px;
    margin-top: 5px;
    font-size: 12px;
}

.videos-shorts .short-like {
    color: #e74c3c;
}

.videos-shorts .short-like i {
    margin-right: 3px;
}


.videos-shorts .short-duration {
    display:flex;
    align-items:center;
    gap:5px;
}

.videos-shorts .short-like {
    color:#fff;
    font-size:11px;
    white-space:nowrap;
}


.videos-shorts .short-meta {
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:3px;
}

.videos-shorts .short-views,
.videos-shorts .short-like {
    display:inline-flex;
    align-items:center;
    font-size:12px;
}

.videos-shorts .short-like {
    color:#e74c3c;
}

.videos-shorts .short-like i,
.videos-shorts .short-views i {
    margin-right:4px;
}


/* FIX SHORTS VIEWS + LIKE SAME LINE */

.videos-shorts .short-meta {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: 100%;
}

.videos-shorts .short-meta .short-views,
.videos-shorts .short-meta .short-like {
    display: inline-flex !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 18px;
}

.videos-shorts .short-like {
    color: #e74c3c;
}

.videos-shorts .short-views i,
.videos-shorts .short-like i {
    margin-right: 3px;
}


/* SHORT META FINAL INLINE */

.videos-shorts .short-meta {
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    white-space: nowrap !important;
}

.videos-shorts .short-meta > span {
    display: inline-flex !important;
    width: auto !important;
    float: none !important;
}

.videos-shorts .short-views,
.videos-shorts .short-like {
    margin-right: 10px !important;
    margin-top: 0 !important;
}


/* HOME SHORTS - views + likes inline */
.videos-shorts .short-meta {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    margin-top: 5px !important;
    margin-bottom: 0 !important;
    white-space: nowrap !important;
}

.videos-shorts .short-meta .short-views,
.videos-shorts .short-meta .short-like {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    margin: 0 !important;
}

.videos-shorts .short-meta .short-like {
    color: #e74c3c !important;
}


/* HOME SHORTS STATS INLINE */
.videos-shorts .short-widget-stats {
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    margin-top:5px !important;
    white-space:nowrap !important;
}

.videos-shorts .short-widget-stats .short-views,
.videos-shorts .short-widget-stats .short-like {
    display:inline-flex !important;
    align-items:center !important;
    width:auto !important;
    margin:0 !important;
}

.videos-shorts .short-widget-stats .short-like {
    color:#e74c3c !important;
}

.videos-shorts .short-widget-stats i {
    margin-right:3px;
}


/* FINAL HOME SHORTS LAYOUT FIX */

.videos-shorts .short-title {
    display:block !important;
}

.videos-shorts .short-widget-stats {
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:10px !important;
    width:auto !important;
    margin-top:4px !important;
}

.videos-shorts .short-widget-stats .short-views,
.videos-shorts .short-widget-stats .short-like {
    display:inline-flex !important;
    align-items:center !important;
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
}

.videos-shorts .short-widget-stats .short-like {
    color:#e74c3c !important;
}

.videos-shorts .short-widget-stats i {
    margin-right:3px !important;
}


/* FORCE HOME SHORT INLINE TEST */
ul.videos-shorts li.video-short .short-widget-stats {
    display:inline-flex !important;
    flex-direction:row !important;
    vertical-align:middle !important;
    gap:10px !important;
}

ul.videos-shorts li.video-short .short-widget-stats span {
    display:inline-flex !important;
    float:none !important;
    width:auto !important;
}

ul.videos-shorts li.video-short .short-views,
ul.videos-shorts li.video-short .short-like {
    display:inline-flex !important;
    float:none !important;
}


.videos-shorts .short-bottom {
    display:flex !important;
    flex-direction:column !important;
}

.videos-shorts .short-widget-stats {
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:12px !important;
}

.videos-shorts .short-widget-stats .short-views,
.videos-shorts .short-widget-stats .short-like {
    display:inline-flex !important;
    align-items:center !important;
    margin:0 !important;
}


/* Make sure the thumbnail is the positioning reference */
.videos-shorts li.video-short .short-thumb {
    position: relative !important;
}


/* === SHORTS BADGES CLEAN === */
.videos-shorts .short-thumb .short-badge {
    position: absolute !important;
    top: 6px !important;

    display: inline-block !important;

    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;

    height: auto !important;

    padding: 3px 7px !important;
    margin: 0 !important;

    box-sizing: border-box !important;
    white-space: nowrap !important;

    color: #fff !important;
    font-size: 11px !important;
    font-weight: bold !important;
    line-height: 1.2 !important;

    z-index: 20 !important;
}

.videos-shorts .short-thumb .short-hd {
    left: 6px !important;
    right: auto !important;
    background: #1677ff !important;
}

.videos-shorts .short-thumb .short-premium {
    left: auto !important;
    right: 6px !important;
    background: #f5a623 !important;
}


/* === PREMIUM DEBUG === */
.videos-shorts .short-thumb .short-premium {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    left: auto !important;

    display: block !important;

    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;

    height: 30px !important;

    padding: 0 !important;
    margin: 0 !important;

    background: red !important;
    color: white !important;

    border: 3px solid blue !important;
    box-sizing: border-box !important;

    overflow: hidden !important;
    white-space: nowrap !important;

    text-align: center !important;
    line-height: 24px !important;

    flex: none !important;
    float: none !important;
}

/* === HOME SHORTS - UPLOADER + AGE === */
.videos-shorts .short-extra-meta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 4px !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

.videos-shorts .short-uploader-label {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 0 !important;
}

.videos-shorts .short-uploader {
    display: inline !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    text-decoration: none !important;
}

.videos-shorts .short-uploader:hover {
    text-decoration: underline !important;
}

.videos-shorts .short-age {
    opacity: .75 !important;
    flex: 0 0 auto !important;
}

/* === SHORTS META SEPARATOR === */
.videos-shorts .short-extra-meta {
    gap: 0 !important;
}

.videos-shorts .short-extra-meta .short-age {
    margin-left: 9px !important;
    padding-left: 9px !important;
    border-left: 1px solid rgba(255,255,255,.30) !important;
}

/* === SHORTS META DOT SEPARATOR === */
.videos-shorts .short-extra-meta {
    gap: 0 !important;
}

.videos-shorts .short-age {
    margin-left: 8px !important;
    padding-left: 8px !important;
    border-left: 0 !important;
}


/* === SHORTS META DOT - DIRECT HTML ELEMENT === */
.videos-shorts .short-extra-meta .short-meta-separator {
    display: inline-block !important;
    margin: 0 8px !important;
    padding: 0 !important;
    width: auto !important;
    color: rgba(255,255,255,.65) !important;
}

.videos-shorts .short-extra-meta .short-age {
    margin-left: 0 !important;
    padding-left: 0 !important;
    border-left: 0 !important;
}

/* =========================================================
   MOBILE SHORTS - CLEAN 4 CARD LAYOUT
   ========================================================= */
@media (max-width: 767px) {

    /* Scoatem uploader + data de pe mobil */
    .videos-shorts .short-extra-meta {
        display: none !important;
    }

    /* Titlul poate ocupa maximum 2 randuri */
    .videos-shorts .short-title {
        display: block !important;
        width: 100% !important;
        height: 2.7em !important;
        max-height: 2.7em !important;

        margin-top: 5px !important;
        margin-bottom: 2px !important;

        overflow: hidden !important;

        white-space: normal !important;
        text-overflow: clip !important;

        line-height: 1.35 !important;
    }

    .videos-shorts .short-title a {
        display: -webkit-box !important;

        width: 100% !important;

        overflow: hidden !important;

        white-space: normal !important;
        text-overflow: ellipsis !important;

        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;

        line-height: 1.35 !important;
    }

    /* Views + like raman pe aceeasi linie */
    .videos-shorts .short-widget-stats {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;

        flex-wrap: nowrap !important;

        width: 100% !important;

        margin-top: 2px !important;
        margin-bottom: 0 !important;

        gap: 7px !important;

        white-space: nowrap !important;
        overflow: hidden !important;

        font-size: 10px !important;
        line-height: 1.3 !important;
    }

    .videos-shorts .short-widget-stats .short-views,
    .videos-shorts .short-widget-stats .short-like {
        display: inline-flex !important;
        align-items: center !important;

        width: auto !important;
        min-width: 0 !important;

        margin: 0 !important;

        white-space: nowrap !important;

        flex: 0 0 auto !important;
    }

    .videos-shorts .short-widget-stats i {
        margin-right: 3px !important;
    }

    /* Nu lasam like-ul sa impinga views-ul pe rand nou */
    .videos-shorts .short-widget-stats .short-like {
        flex-shrink: 0 !important;
    }
}

/* =========================================================
   SHORTS MOBILE FINAL - 4 CARDS
   ========================================================= */
@media screen and (max-width: 900px) {

    .videos-shorts .short-extra-meta {
        display: none !important;
    }

    .videos-shorts .short-title {
        display: block !important;
        width: 100% !important;
        height: 2.7em !important;
        max-height: 2.7em !important;
        overflow: hidden !important;
        margin-top: 5px !important;
        margin-bottom: 2px !important;
        white-space: normal !important;
        text-overflow: clip !important;
        line-height: 1.35 !important;
    }

    .videos-shorts .short-title a {
        display: -webkit-box !important;
        width: 100% !important;
        overflow: hidden !important;
        white-space: normal !important;
        text-overflow: ellipsis !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        line-height: 1.35 !important;
    }

    .videos-shorts .short-widget-stats {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 7px !important;
        width: 100% !important;
        margin-top: 2px !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        font-size: 10px !important;
    }

    .videos-shorts .short-widget-stats .short-views,
    .videos-shorts .short-widget-stats .short-like {
        display: inline-flex !important;
        align-items: center !important;
        width: auto !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        white-space: nowrap !important;
    }
}


/* =========================================================
   MOBILE HOME SHORTS - FINAL
   4 cards / row
   Hide uploader + age
   2-line title
   Views + likes inline
   ========================================================= */

@media screen and (max-width: 991px) {

    /* Keep exactly 4 Shorts per row */
    .videos-shorts {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 10px !important;
        overflow: hidden !important;
    }

    .videos-shorts .video-short {
        flex: 0 0 calc(25% - 7.5px) !important;
        width: calc(25% - 7.5px) !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    /* Hide desktop uploader / age metadata */
    .videos-shorts .short-extra-meta {
        display: none !important;
    }

    /* Title: maximum 2 lines */
    .videos-shorts .short-bottom .short-title,
    .videos-shorts .short-title {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
        white-space: normal !important;
        text-overflow: ellipsis !important;
        line-height: 1.25 !important;
        height: 2.5em !important;
        max-height: 2.5em !important;
        margin-top: 6px !important;
    }

    .videos-shorts .short-title a {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
        white-space: normal !important;
        text-overflow: ellipsis !important;
        line-height: 1.25 !important;
    }

    /* Views + likes stay on the same line */
    .videos-shorts .short-widget-stats {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        width: 100% !important;
        margin-top: 4px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }

    .videos-shorts .short-widget-stats .short-views,
    .videos-shorts .short-widget-stats .short-like {
        display: inline-flex !important;
        align-items: center !important;
        width: auto !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        line-height: 16px !important;
        font-size: 11px !important;
    }

    .videos-shorts .short-widget-stats i {
        margin-right: 3px !important;
    }

    /* Keep thumbnail / badges / duration untouched */
    .videos-shorts .short-thumb {
        width: 100% !important;
    }
}


/* === DESKTOP SHORTS META SIZE === */
@media screen and (min-width: 901px) {
    .videos-shorts .short-extra-meta {
        font-size: 13px !important;
        line-height: 1.4 !important;
    }

    .videos-shorts .short-uploader-label,
    .videos-shorts .short-uploader,
    .videos-shorts .short-age,
    .videos-shorts .short-meta-separator {
        font-size: 13px !important;
    }
}

/* === SHORTS DESKTOP META FINAL === */
.videos-shorts .short-extra-meta,
.videos-shorts .short-uploader-label,
.videos-shorts .short-uploader,
.videos-shorts .short-age,
.videos-shorts .short-meta-separator {
    font-size: 14px !important;
}

.video-extra-meta {
        display: block;
        width: 100%;
        margin-top: 2px;
        font-size: 13px;
        line-height: 18px;
}
.video-extra-meta .video-uploader,
.video-extra-meta .video-age {
        display: inline;
}


/* =========================================================
   Normal video badges
   ========================================================= */

.video-thumb .normal-hd-badge {
    position: absolute;
    z-index: 5;
    top: 6px;
    left: 6px;
    display: inline-block;
    padding: 3px 8px;
    margin: 0;
    border-radius: 3px;
    box-sizing: border-box;
    background: #e00000;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
}

.video-thumb .normal-premium-badge {
    position: absolute;
    z-index: 5;
    top: 6px;
    right: 6px;
    left: auto;
    bottom: auto;
    display: inline-block;
    width: auto;
    min-width: 0;
    max-width: max-content;
    height: auto;
    padding: 3px 8px;
    margin: 0;
    border-radius: 3px;
    box-sizing: border-box;
    background: #f5a623;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
}

.video-thumb .duration {
    position: absolute;
    z-index: 5;
    right: 6px;
    bottom: 6px;
    padding: 2px 5px;
    border-radius: 3px;
    background: rgba(0, 0, 0, .75);
    color: #fff;
    font-size: 11px;
    line-height: 1.3;
}

/* =========================================================
   Normal video metadata - mobile responsive
   ========================================================= */

@media (max-width: 767px) {
    ul.videos li .views,
    ul.videos li .rating {
        font-size: 11px;
        line-height: 16px;
        vertical-align: middle;
    }

    ul.videos li .rating {
        margin-left: 3px;
    }

    ul.videos li .video-extra-meta {
        display: block;
        width: 100%;
        margin-top: 1px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 10px;
        line-height: 15px;
    }

    ul.videos li .video-extra-meta .video-uploader,
    ul.videos li .video-extra-meta .video-age,
    ul.videos li .video-extra-meta .video-meta-separator {
        font-size: 10px;
        line-height: 15px;
    }

    ul.videos li .video-extra-meta .video-uploader,
    ul.videos li .video-extra-meta .video-age,
    ul.videos li .video-extra-meta .video-meta-separator {
        display: inline;
    }

    ul.videos li .video-extra-meta .video-meta-separator {
        margin: 0 2px;
    }
}


/* =========================================================
 * TabooHELL Premium Upload Trailer Overlay
 * ========================================================= */

#player-container {
    position: relative;
}

#player-premium.premium-overlay,
#player-premium {
    position: absolute;
    inset: 0;
    z-index: 100;
    display: none;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
}

#player-premium.premium-overlay::before,
#player-premium::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .78);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

#player-premium > *,
#player-premium .premium-overlay-box {
    position: relative;
    z-index: 2;
}

#player-premium .premium-overlay-box {
    width: min(430px, 92%);
    padding: 32px 28px 28px;
    border-radius: 16px;
    background: rgba(20, 20, 24, .97);
    border: 1px solid rgba(255, 255, 255, .12);
    box-shadow: 0 20px 70px rgba(0, 0, 0, .55);
}

#player-premium .premium-overlay-icon {
    width: 58px;
    height: 58px;
    margin: 0 auto 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 193, 7, .12);
    font-size: 27px;
}

#player-premium h3 {
    margin: 0 0 12px;
    font-size: 24px;
    font-weight: 700;
}

#player-premium p {
    margin: 0 0 22px;
    opacity: .85;
    line-height: 1.5;
}

#player-premium .premium-overlay-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

#player-premium .premium-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 42px;
    padding: 0 18px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    transition: transform .15s ease, opacity .15s ease;
}

#player-premium .premium-btn:hover {
    transform: translateY(-1px);
    opacity: .92;
}

#player-premium .premium-btn-primary {
    background: #f5b800;
    color: #111;
}

#player-premium .premium-btn-secondary {
    background: rgba(255, 255, 255, .10);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .15);
}

#player-premium .premium-overlay-close {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 5;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    cursor: pointer;
    font-size: 15px;
}

#player-premium .premium-overlay-close:hover {
    background: rgba(255, 255, 255, .16);
}

@media (max-width: 600px) {
    #player-premium {
        padding: 12px;
    }

    #player-premium .premium-overlay-box {
        width: 94%;
        padding: 28px 20px 22px;
    }

    #player-premium h3 {
        font-size: 20px;
    }

    #player-premium .premium-btn {
        width: 100%;
    }
}


/* =========================================
   Modern Photo Album Card
   ========================================= */

#album .photos .photo {
    position: relative;
}

#album .photos .photo-extra-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 6px;
    font-size: 13px;
    line-height: 18px;
}

#album .photos .photo-views,
#album .photos .photo-likes {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

#album .photos .photo-views i,
#album .photos .photo-likes i {
    margin-right: 4px;
}

#album .photos .photo-uploader {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 2px;
    font-size: 12px;
    line-height: 18px;
}

#album .photos .photo-uploader > i {
    margin-right: 1px;
}

#album .photos .photo-age {
    margin-left: 1px;
}


/* Photo album - align cards naturally */
#album ul.photos {
    text-align: left;
}

#album ul.photos li.photo {
    vertical-align: top;
}


/* =========================================================
   Modern Individual Photo View
   ========================================================= */

#photo .photo-modern-image {
    position: relative;
    width: 100%;
    margin: 0 auto 14px;
    text-align: center;
    background: #111;
    border-radius: 8px;
    overflow: hidden;
}

#photo .photo-modern-image-link {
    display: block;
    line-height: 0;
}

#photo .photo-modern-img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 80vh;
    margin: 0 auto;
    object-fit: contain;
}

#photo .photo-modern-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    border-radius: 50%;
    background: rgba(0,0,0,.65);
    color: #fff;
    text-decoration: none;
    z-index: 5;
    opacity: 0;
    transition: opacity .2s ease, background .2s ease;
}

#photo .photo-modern-nav:hover {
    background: rgba(0,0,0,.9);
    color: #fff;
}

#photo .photo-modern-prev {
    left: 14px;
}

#photo .photo-modern-next {
    right: 14px;
}

#photo .photo-modern-image:hover .photo-modern-nav,
#photo .photo-modern-image:focus-within .photo-modern-nav {
    opacity: 1;
}

#photo .photo-modern-uploader,
#photo .photo-modern-album {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    font-size: 13px;
    line-height: 22px;
}

#photo .photo-modern-uploader i,
#photo .photo-modern-album i {
    width: 16px;
    text-align: center;
    opacity: .75;
}

#photo .photo-modern-uploader a,
#photo .photo-modern-album a {
    font-weight: 600;
}

#photo .photo-modern-info {
    margin: 0 0 14px;
    padding: 12px 14px;
    border-radius: 8px;
    background: rgba(0,0,0,.03);
}

#photo .photo-modern-description {
    font-size: 13px;
    line-height: 20px;
    white-space: pre-line;
}

#photo .photo-modern-share {
    margin: 0 0 14px;
    padding: 14px;
    border-radius: 8px;
    background: rgba(0,0,0,.03);
}

#photo .photo-modern-share-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 600;
}

#photo .photo-modern-share-link {
    margin-top: 14px;
}

#photo .photo-modern-share-link label {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
}

#photo .photo-modern-comments {
    margin-top: 18px;
}

#photo .photo-modern-comments-header {
    padding: 12px 14px;
    border-radius: 8px 8px 0 0;
    background: rgba(0,0,0,.04);
    font-size: 14px;
    font-weight: 600;
}

#photo .photo-modern-comments-header small {
    font-size: 11px;
    font-weight: normal;
    opacity: .65;
}

#photo .photo-modern-comments-body {
    padding: 14px;
    border-radius: 0 0 8px 8px;
    background: rgba(0,0,0,.02);
}

#photo .photo-modern-deleted {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 250px;
    padding: 30px;
    border-radius: 8px;
    background: #111;
    color: #fff;
    font-size: 15px;
}

@media (max-width: 767px) {

    #photo .photo-modern-img {
        max-height: 70vh;
    }

    #photo .photo-modern-nav {
        width: 36px;
        height: 36px;
        line-height: 36px;
        opacity: .9;
    }

    #photo .photo-modern-prev {
        left: 8px;
    }

    #photo .photo-modern-next {
        right: 8px;
    }

    #photo .photo-modern-comments-body {
        padding: 10px;
    }
}


@media (max-width: 767px) {

    #photo .photo-modern-actions .buttons {
        gap: 6px;
    }
}




/* =========================================================
   FINAL MODERN PHOTO VIEW
   ========================================================= */

#photo .photo-modern-info-bar {
    margin: 0 0 14px;
    padding: 10px 14px;
    border: 1px solid rgba(127,127,127,.16);
    border-radius: 9px;
    background: rgba(127,127,127,.045);
}

#photo .photo-modern-info-top {
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    flex-wrap: wrap;
    gap: 8px !important;
}

#photo .photo-modern-stats {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
}

#photo .photo-modern-rating {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
}

#photo .photo-modern-stat {
    display: inline-flex;
    align-items: center;
    gap: 4px !important;
    white-space: nowrap;
    font-size: 13px !important;
    line-height: 20px !important;
    font-weight: 400 !important;
}

#photo .photo-modern-stat i {
    font-size: 13px !important;
    opacity: .75;
}

#photo .photo-modern-stat strong {
    font-weight: 600;
}

#photo .photo-modern-stat > span {
    font-size: 12px !important;
    opacity: .65 !important;
    font-weight: 400 !important;
    margin-left: 0 !important;
}

#photo .photo-modern-meta {
    margin: 2px 0 12px !important;
    padding: 0 !important;
}

#photo .photo-modern-userline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px !important;
    font-size: 12px;
    line-height: 20px;
    color: inherit;
    margin-left: 4px !important;
}

#photo .photo-modern-user {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

#photo .photo-modern-album {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    font-size: 12px !important;
    line-height: 19px !important;
    min-height: 19px !important;
    margin-top: 1px !important;
    opacity: .9 !important;
}

#photo .photo-modern-user i {
    font-size: 11px;
    opacity: .7;
}

#photo .photo-modern-album i {
    width: 15px !important;
    min-width: 15px !important;
    text-align: center !important;
    font-size: 12px !important;
    opacity: .7 !important;
}

#photo .photo-modern-user a {
    font-weight: 600;
    text-decoration: none;
}

#photo .photo-modern-album a {
    font-weight: 600 !important;
    text-decoration: none;
}

#photo .photo-modern-separator {
    opacity: .45;
    margin: 0 1px;
}

#photo .photo-modern-dot {
    margin: 0 1px !important;
    opacity: .55 !important;
}

#photo .photo-modern-date {
    opacity: .65;
}

/* ACTION BUTTONS */

#photo .photo-modern-actions {
    margin: 3px 0 14px !important;
    padding: 0 !important;
}

#photo .photo-modern-actions .buttons {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#photo .photo-modern-actions .buttons li {
    margin: 0 !important;
    padding: 0 !important;
}

#photo .photo-modern-action-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    min-width: 88px;
    min-height: 30px !important;
    padding: 5px 9px !important;
    border: 1px solid rgba(127,127,127,.22);
    border-radius: 5px !important;
    background: rgba(127,127,127,.055);
    box-shadow: none;
    font-size: 12px !important;
    line-height: 18px !important;
    text-decoration: none !important;
    transition: background .18s ease,
                border-color .18s ease,
                transform .18s ease;
}

#photo .photo-modern-action-btn i {
    font-size: 12px !important;
}

#photo .photo-modern-action-btn:hover {
    background: rgba(127,127,127,.11);
    border-color: rgba(127,127,127,.35);
    transform: translateY(-1px);
}

#photo .photo-modern-action-btn.rate-up:hover,
#photo .photo-modern-action-btn.rate-up.active {
    color: #198754;
}

#photo .photo-modern-action-btn.rate-down:hover,
#photo .photo-modern-action-btn.rate-down.active {
    color: #dc3545;
}

#photo .photo-modern-action-btn.favorite-photo:hover {
    color: #e83e8c;
}

#photo .photo-modern-action-btn.flag:hover {
    color: #dc3545;
}

/* ALBUM DESCRIPTION */

#photo .photo-modern-description-card {
    margin: 0 0 18px;
    padding: 14px 16px;
    border: 1px solid rgba(127,127,127,.16);
    border-radius: 9px;
    background: rgba(127,127,127,.035);
}

#photo .photo-modern-card-title {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 20px;
    font-weight: 600;
}

#photo .photo-modern-card-title i {
    font-size: 13px;
    opacity: .7;
}

#photo .photo-modern-description {
    font-size: 13px;
    line-height: 21px;
    white-space: normal;
    word-break: break-word;
    opacity: .82;
}

/* SHARE */

#photo .photo-modern-share {
    margin: 0 0 18px;
    padding: 14px 16px;
    border: 1px solid rgba(127,127,127,.16);
    border-radius: 9px;
    background: rgba(127,127,127,.035);
}

#photo .photo-modern-share-link {
    margin-top: 14px;
}

#photo .photo-modern-share-link label {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
    opacity: .7;
}

/* COMMENTS */

#photo .photo-modern-comments {
    margin-top: 18px;
}

#photo .photo-modern-comments-header {
    padding: 11px 14px;
    border: 1px solid rgba(127,127,127,.16);
    border-radius: 8px 8px 0 0;
    background: rgba(127,127,127,.045);
}

#photo .photo-modern-comments-title {
    float: left;
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    line-height: 20px;
    font-weight: 600;
}

#photo .photo-modern-comments-title i {
    font-size: 13px;
    opacity: .7;
}

#photo .photo-modern-comments-toggle {
    float: right;
    line-height: 20px;
}

#photo .photo-modern-comments-toggle small {
    font-size: 11px;
    opacity: .6;
}

#photo .photo-modern-comments-body {
    padding: 14px;
    border: 1px solid rgba(127,127,127,.16);
    border-top: 0;
    border-radius: 0 0 8px 8px;
    background: rgba(127,127,127,.02);
}

/* DELETED */

#photo .photo-modern-deleted {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 250px;
    padding: 30px;
    border-radius: 9px;
    background: #111;
    color: #fff;
    font-size: 15px;
}

/* MOBILE */

@media (max-width: 767px) {

    #photo .photo-modern-info-bar {
        padding: 10px 11px;
    }

    #photo .photo-modern-info-top {
        display: block;
    }

    #photo .photo-modern-stats {
        gap: 10px !important;
        margin-bottom: 4px !important;
    }

    #photo .photo-modern-rating {
        gap: 10px !important;
    }

    #photo .photo-modern-stat {
        font-size: 12px !important;
        line-height: 20px !important;
    }

    #photo .photo-modern-stat > span {
        font-size: 11px !important;
    }

    #photo .photo-modern-userline {
        font-size: 11px !important;
    }

    #photo .photo-modern-actions .buttons {
        gap: 6px !important;
    }

    #photo .photo-modern-action-btn {
        min-width: 0 !important;
        min-height: 36px !important;
        padding: 8px 10px !important;
    }

    #photo .photo-modern-action-btn span {
        display: none;
    }

    #photo .photo-modern-action-btn i {
        font-size: 14px !important;
    }

    #photo .photo-modern-description-card,
    #photo .photo-modern-share {
        padding: 12px;
    }

    #photo .photo-modern-comments-body {
        padding: 10px;
    }
}