/* Updated style.css incorporating video card enhancements */

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

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

.full {width: 100%;}
.logo {padding:10px;}
.search {width: 37%; float: left; padding: 15px 0; }
.top-links {width: 40%; float: right; 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: 5px;}
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;}

/* --- Video List Styling --- */
ul.videos {
  text-align: center; /* Keep original text-align */
  /* Flexbox properties added via media query below */
}

/* --- Base Video Card Styling --- */
ul.videos li.video {
  /* display: inline-block; */ /* Overridden by flex below */
  /* vertical-align: top; */ /* Handled by flex */
  text-align: left; /* Keep text alignment */
  position: relative; /* Keep original position */
  font-size: 14px; /* Keep original font-size */
  overflow: hidden; /* Keep original overflow */

  /* --- New Card Styling (Using Variables - Define in theme CSS) --- */
  background-color: var(--dark-bg-secondary, #1E1E1E); /* Added fallback */
  border: 1px solid var(--dark-border-color, #333333); /* Added fallback */
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 20px;
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;

  /* --- Responsive Width --- */
  width: 100%; /* Default to full width (1 column) */
  margin-left: auto;
  margin-right: auto;
  max-width: 450px; /* Max width for single column */
}

ul.videos li.video:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 15px var(--dark-shadow-color, rgba(0, 0, 0, 0.4)); /* Added fallback */
}

/* --- Other Lists (Keep original basic layout) --- */
ul.thumbs, ul.users, ul.categories, ul.albums, ul.photos, ul.models, ul.channels, ul.playlists {
  text-align: center;
}
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: visible; /* Changed from none */
  position: relative;
  font-size: 14px;
  text-align: left;
}

/* --- Thumbnail Styling --- */
.video-thumb {
  position: relative;
  margin-bottom: 5px;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
  width: 100%;
  overflow: hidden; /* Keep overflow hidden */
}

ul.videos li.video .video-thumb img { /* Specific rule for video card thumbs */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
  border-radius: 6px; /* Match card radius */
  display: block;
}

ul.videos li.video:hover .video-thumb img {
  transform: scale(1.05);
}

/* Keep original rules for other thumb types */
.category-thumb, .channel-thumb, .playlist-thumb, .photo-thumb {
  position: relative;
  margin-bottom: 5px;
  padding-top: 56.25%;
  width: 100%;
  overflow: hidden; /* Changed from none */
}
.category-thumb img, .channel-thumb img, .playlist-thumb img, .photo-thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 5px;
}

.model-thumb, .user-thumb {
  position: relative;
  width: 100%;
  padding-bottom: 100%; /* 1:1 Aspect Ratio */
  overflow: hidden;
  margin-bottom: 5px; /* Added margin */
}
.model-thumb img, .user-thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 5px;
}


/* --- Video Card Text Container --- */
ul.videos li.video .video-info {
  padding-top: 10px;
}

/* --- Video Card Title (Height Consistency) --- */
ul.videos li.video .video-info .title {
  display: block;
  font-size: 15px;
  font-weight: 600; /* Moved from theme */
  line-height: 1.4;
  height: 2.8em; /* Force height for 2 lines */
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 8px;
  /* Removed max-height (using fixed height now) */
  /* color set in theme */
}

/* --- Video Card Metadata --- */
ul.videos li.video .video-info .views,
ul.videos li.video .video-info .rating {
  display: inline-block;
  font-size: 13px;
  margin-top: 4px;
  /* color set in theme */
}

ul.videos li.video .video-info .rating {
  margin-left: 12px;
}

ul.videos li.video .rating .fa {
  margin-right: 4px;
  vertical-align: middle;
  /* color set in theme */
}


/* Keep original non-video title/views/rating styles */
.title { /* General title style (if used elsewhere) */
  max-height: 34px;
  overflow: hidden;
  display: block;
  line-height: 116%;
  width: 100%;
}
.views { /* General views style */
  display: inline-block;
  font-size: 13px;
}
.rating { /* General rating style */
  margin-left: 5px;
  font-size: 13px;
}
.up i {color: green;} /* General rating colors */
.down i {color: red;}

.model-title, .category-title, .channel-title, .playlist-title, .user-title {
  max-height: 19px;
  overflow: hidden;
  display: block;
  line-height: 116%;
  width: 100%;
}

/* --- Video Preview / Overlays --- */
.video-thumb video {width: 100%; height: 100%; position: absolute; top:0; left: 0; padding: 0; margin: 0; border-radius: 5px; }
.video-thumb > .thumb-slider {position: absolute; z-index: 3; left: 0; top: 0; width: 100%; height: 3px; }
.video-thumb > .thumb-slider > div {height: 100%; line-height: 3px; width: 0;} /* color set in theme */
.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;} /* background set in theme */
.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 / Buttons --- */
.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;}
.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/Category/Channel/Playlist Specific --- */
.model-videos, .category-videos, .channel-videos, .playlist-videos {position: absolute; z-index: 2; top: 0px; right: 0px;} /* background/color set in theme */
.model-rank, .channel-rank {position: absolute; z-index: 2; left: 0px; bottom: 0px; width: 100%; padding: 2px 0;} /* background/color set in theme */
.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;} /* color set in theme */
.model-filter-col, .user-filter-col {width: 19.9%; float: left; margin-bottom: 15px; display: block;}
.model-image {width: 156px; height: 156px;}
.model-info {margin-left: 200px;}
.channel-image img {width: 100%; height: auto; }
.model-image img { width:156px !important; height:156px !important; }
.channel-image {width: 160px; overflow: visible;} /* Changed from 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; } /* background/color set in theme */
.user-comments {padding: 0 20px;}
.user-online {position: absolute; z-index: 2; top: 0; right: 0; padding: 2px 3px;} /* background/color set in theme */

/* --- General Info / Profile --- */
.info {padding: 10px 5px 10px 5px; display: block; font-size: 13px; color: #575757;} /* Keep original color? Might override theme */
.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;} /* border/background set in theme */
.profile-content-header {padding: 5px 15px 20px 15px;}
.profile-title {font-size: 16px; font-weight: bold; } /* color set in theme */
.profile-title span {font-size: 14px; font-weight: normal;} /* color set in theme */
.profile-action {float: left; margin-right: 5px;}
.profile-username {float: left;}

/* --- Profile Classic --- */
.profile-c {padding: 5px;} /* border set in theme */
.profile-c-left {float: left;}
.profile-c-right {float: right;}
.profile-c-image {width: 190px; position: relative; float: left;} /* background set in theme */
.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; } /* color set in theme */
.profile-c-value {width: auto; margin-left: 150px; overflow: hidden; font-weight: normal;} /* font-weight changed, color set in theme */
.profile-c-about {margin-top: 10px; padding-top: 10px;} /* border-top set in theme */
.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 Page --- */
.members {position: relative;}
.members-left {width: auto; overflow: hidden; margin-right: 360px; position: relative;}
.members-right {float: right; width: 350px; overflow: hidden;}

/* --- Margins --- */
.margin-top-10 {margin-top: 10px;}
.margin-bottom-10 {margin-bottom: 10px;}

/* --- Profile Wall --- */
#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; } /* background/border/color set in theme */
.wall-rating {} /* margin set in theme */
.wall-comments {padding-top: 10px;}
.wall-content {padding-bottom: 5px;} /* color set in theme */
.wall-footer {font-size: 12px; padding-top: 3px;} /* border-top set in theme */
.wall-percent {font-size: 12px; margin-top: 5px !important!}

/* --- General Placeholders / Messages --- */
.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; } /* color/background set in theme */
.alert-response {padding: 10px 5px 10px 5px; text-align: center; margin: 5px 5px 5px 5px;}

/* --- Advertisements --- */
.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;} /* border set in theme */
.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 Area Layout --- */
#content {padding-bottom: 10px; }
#content h1 {width: 100%; height: 30px; font-size: 18px; font-weight: bold; overflow: hidden; padding: 0; margin:0;} /* color set in theme */
#content h3 {font-size: 16px; font-weight: bold; margin: 0; padding: 0 0 5px 0;}
#content .right {width: 302px; float: right; display: block; padding: 20px; border-radius: 5px;} /* background/border set in theme */
#content .left {margin-right: 310px; width: auto; overflow: hidden; position: relative; padding: 20px; border-radius: 5px;} /* background/border set in theme */
#content .left-tab-content {border-top: 0; padding: 20px 0 10px 0;}
#content .left-full {margin-right: 0; margin-left: 0; width: 100%;}

/* --- Video/Album/Photo/Playlist Page Layout --- */
#video {}
#video .right, #album .right, #photo .right, #playlist .right {width: 302px; float: right; display: block; text-align: center; } /* border set in theme? */
#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 {margin-right: 310px; } /* border set in theme? */
#video .container-premium {width: 100%;}
#video h1, #playlist h1, #album h1 {width: 100%; height: 30px; overflow: hidden;} /* font-size/color set in theme? */
#photo {margin-bottom: 10px;}
.content-group {overflow: hidden;} /* background/padding set in theme? */
.content-group-left {width: 200px; float: left; }
.content-group-right {margin-left: 180px; width: auto; overflow: hidden; position: relative; text-align: left;}
.content-group-header:hover {cursor: pointer;} /* font-size/weight set in theme? */
.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%; } /* font-size/color set in theme? */
.progress {height: 5px; background: red; border-radius: 0; margin: 0; padding: 0;} /* Colors likely set in theme */
.progress .progress-bar {background: green;} /* Colors likely set in theme */
.content-info, .topic-posts, .topic-posted, .post-posted {width: 100%; margin-bottom: 5px;} /* font-size/color set in theme? */
ul.buttons {}
ul.buttons li {margin-right: 10px; display: inline-block;} /* color set in theme? */

/* --- Player --- */
#player-container { position: relative; width: 100%; padding-top: 56.25%; /* 16:9 Aspect Ratio */ background-color: #000; } /* Changed from absolute positioning */
#player {position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover;} /* Changed background-size, background-color set in theme */
#player-fluid {display: none; width: 100%; height: 100%;}
#player-advertising { position: absolute; text-align: center; width: 306px; height: 280px; padding: 5px 0; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1002; } /* Centered using transform */
#player-premium {background: rgba(0, 0, 0, 0.7); position: absolute; text-align: center; width: 80%; padding: 10% 5%; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; font-size: 22px; font-weight: bold; display: none; color: #fff;} /* Adjusted padding, centering, background */
.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: 10px auto 0 auto; font-weight: bold; background-color: #f9289a; height: 40px; padding: 10px; width: fit-content; cursor: pointer; border-radius: 5px; color: #fff; } /* Adjusted margin, added cursor/radius/color */

/* --- Comments --- */
.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;} /* color set in theme? */
.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;} /* color set in theme? */
.media {margin-bottom: 10px;} /* color set in theme? */
.media-body p {} /* color set in theme? */
.media-heading h4 {font-size: 14px; font-weight: bold; padding: 0; padding-top: 3px; margin: 0;}
.media-heading h4 a {} /* color set in theme? */
.media-heading small {font-size: 11px; margin-left: 10px;} /* color set in theme? */
.media-footer {} /* color set in theme? */

/* --- Footer --- */
ul.footer {list-style-type: none; width: 100%; text-align: center; } /* font-size/border set in theme? */
ul.footer li {display: inline; padding: 0 10px;} /* color set in theme? */
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;}
ul.list-footer li a {} /* color set in theme? */

/* --- Misc --- */
hr {margin: 18px 10px 18px 10px;} /* border set in theme? */
.embed-video-title {width: 100%; display: block; text-align: center;}
.embed-video-title a {} /* color set in theme? */
.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;}

/* --- Photo View --- */
#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;}

/* --- Forum --- */
.panel-forum h1 {width: 70% !important; overflow: hidden;}
.forum-box, .forum {width: 100%; } /* border set in theme? */
.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: visible;} /* Changed from none, border-top set in theme? */
.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;} /* color set in theme? */
.topic-added {font-size: 12px; display:block;}
.topic-stats, .forum-stats {width: 14%; float: left; text-align: right;} /* color set in theme? */
.topic-last, .forum-last {width: 24%; float: right; }
.topic-user, .post-user {float: left; padding: 10px 20px 10px 10px; text-align: center;} /* border-right set in theme? */
.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; width: calc(100% - 130px); } /* Added width calculation */
.topic-text img, .post-text img {max-width: 100%; height: auto; position: relative;}
.topic-footer, .post-footer {width: 100%; margin-top: 10px; padding-top: 5px; font-size: 13px; clear: both;} /* border-top/color set in theme?, added clear */
.signature {float: left;}
.topic-actions, .post-actions {float: right; text-align: right;}
.quote {width: 100%; padding: 5px; border-radius: 3px;} /* background set in theme? */
.quote-user {display: block; width: 100%; border-bottom: 1px solid #292929; margin-bottom: 5px;} /* border color might be theme */
.quote-user span {font-weight: bold;}
.topic-posted, .forum-desc {display: block;}
.username {font-weight: bold;} /* color set in theme? */
.topic-count, .forum-count, .post-count {font-weight: bold;} /* color set in theme? */
.topic-text a {} /* color/decoration set in theme? */
.size-1 {font-size: 10px;}
.size-2 {font-size: 13px;}
.size-3 {font-size: 16px;}
.size-4 {font-size: 18px;}
.size-5 {font-size: 24px;}
.size-6 {font-size: 32px;}
.size-7 {font-size: 48px;}

/* --- Columns / Lists --- */
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;} /* color set in theme? */
ul.image-list li .model-rank-l {}
ul.list-features {padding-left: 10px;}

/* --- KB --- */
.kb-title {display: block;} /* color set in theme? */
.kb-content {display: block; margin: 5px 15px;} /* color set in theme? */

/* --- Inbox --- */
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; } /* border-bottom set in theme? */
.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;} /* color set in theme? */

/* --- Chat --- */
#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;} /* background set in theme? */
.chat-users {width: 250px; float: right; display: block; overflow: hidden;} /* background/border set in theme? */
.chat-users-header {padding: 5px;}
.chat-users-list ul {height: 100%; overflow: auto; padding: 0; } /* background set in theme? */
.chat-users-list ul li {padding: 5px 5px; } /* border-top set in theme? */
.chat-users-list ul li.active {} /* background set in theme? */
.chat-avatar {width: 60px; float: left;}
.chat-profile {float: left;}
.chat-actions {float: right;}
#friend, #block {float: right; margin-left: 5px;}
.chat-header, .chat-body {padding: 5px; margin-bottom: 5px;} /* background/border set in theme? */
.chat-body {height: 500px; overflow: auto;}
.chat-footer span {display: block; } /* color set in theme? */
.chat-footer textarea {margin: 5px 0;}
.message {padding: 5px 0;} /* border-bottom set in theme? */
.message-icon {width: 20px; float: left; margin-top: 3px; } /* Added margin */
.message-username {float: left; font-weight: bold;}
.message-info {float: right; text-align:right; font-size: 12px;} /* color set in theme? */
.message-body {padding-left: 20px; font-size:13px; display: block; clear: both;} /* color set in theme?, added clear */

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

/* --- Captcha --- */
#recaptcha { float: left; display: block; margin-right: 5px; }
.captcha-math {width: 155px; float: left; display: block; margin-right: 5px;}
.captcha-math img {float: left;}
.captcha-math img:hover {cursor: pointer;}
.captcha-math a {display: block; clear:both; font-size: 11px;}
.captcha-math input {float: left; width: 50px; margin: 0 0 0 3px; padding-top:0 !important; padding-bottom: 0 !important; height: 30px; font-size: 12px;}

/* --- Slider --- */
.slider-title {width: 150px; height: 15px; overflow: hidden; font-size: 13px; text-align: center;} /* color set in theme? */
.slider-title:hover {text-decoration: none;}
.lSSlideOuter .lSPager.lSpg > li:hover a, .lSSlideOuter .lSPager.lSpg > li.active a {} /* background-color set in theme? */
.playlist-video {width: 150px; overflow: hidden;}
ul#lightSlider li.playlist-active {opacity: 0.8;}
ul#lightSlider li.playlist-active img {} /* border set in theme? */

/* --- Article --- */
.panel-article {padding: 10px 10px;}

/* --- Stream --- */
.stream-avatar {float:left; width: 50px;}
.stream-info {float: left; margin-left: 10px; font-size: 12px;} /* color set in theme? */
.stream-info a {font-size: 16px; font-weight: bold;} /* color set in theme? */
.stream-time {display: block; font-size: 12px;} /* color set in theme? */
.stream-content {width: 100%; display: block; margin: 20px 0 10px 0; overflow: hidden;}
.stream-content-channel {height: 220px;}
.stream-content-video {height: 230px;}
.stream-content-playlist {height: 190px;}
.stream-content-album {height: 200px;}
.stream-content-photo {height: 200px;}
.stream-content-model {height: 290px;}
.stream-content-profile {height: 210px;}
.stream-content-post {font-size: 14px; padding: 0 5px 0 5px;} /* color set in theme? */

/* --- Misc Form --- */
.remaining {font-size: 13px;} /* color set in theme? */
.slider.slider-horizontal {width: 100% !important;}
.slider.slider-horizontal .slider-track {height: 6px !important; margin-top: -3px !important;}
.slider-handle {} /* background set in theme? */
.sceditor-container {} /* background/border set in theme? */
.sceditor-container textarea, .sceditor-container iframe {padding: 5px !important;}
div.sceditor-toolbar {} /* background/border-bottom set in theme? */

/* --- Responsive Video Grid Media Queries --- */
/* Small screens and up (2 columns) */
@media (min-width: 640px) {
  ul.videos li.video {
    width: calc(50% - 16px); /* 2 columns with 8px gap */
    margin-left: 8px;
    margin-right: 8px;
    max-width: none;
  }
  ul.videos {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     padding-left: 0;
     list-style: none;
  }
}

/* Medium screens and up (3 columns) */
@media (min-width: 900px) {
  ul.videos li.video {
    width: calc(33.333% - 16px); /* 3 columns */
  }
}

/* Large screens and up (4 columns) */
@media (min-width: 1200px) {
  ul.videos li.video {
    width: calc(25% - 16px); /* 4 columns */
  }
}

/* --- Responsive Push Menu/Search --- */
/* These rules were missing from the original responsive.css but seem intended */
@media (max-width: 767px) {
  #push-menu, #push-search {
    display: inline-block; /* Show buttons on small screens */
  }
  /* Add rules here to hide/show the actual menu/search bar when buttons are clicked */
  /* Example: .top-links { display: none; } */
  /* Example: #menu { display: none; } */
}