/*
Theme Name: PhimViet
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
footer.footer-wrapper.dark.dark-page-wrapper {
    background: #00005d;
}
ul.footer-menu-items li {
    flex-basis: 18%;
    text-align: left;
    text-transform: uppercase;
    font-size: 13px;
    margin-bottom: 10px;
    list-style-type: none;
    margin-left: 0 !important;
}
ul.footer-menu-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: center;
    align-items: center;
}
#main.dark {
    background-color: #00005ded;
    min-height: 100vh;
}
.header-main {
    background: #00005d;
}
.header-main .nav > li > a{
    color: #fff;
}
.nav-pagination>li>a, .nav-pagination>li>span {
    height: 1.9em!important;
    line-height: 1.9em!important;
    min-width: 1.9em!important;
}
.blogpostdata .post-title.is-large {
    min-height: 55px !important;
    float: left;
}
#main{
    min-height: 100vh;
}
input.success {
    border: 2px solid green;
}
.wrap-title {
    min-height: 55px!important;
}
.image-cover.dienvien {
    border-radius: 50%;
    background: #fff;
}
.dienvienl .col-inner {
    padding: 5%;
    border-radius: 5px;
    border: 1px solid #eee;
    background: #0000000a;
}

.dienvienl {
    padding-bottom: 30px;
}
.dark .dienvienl .col-inner {
    padding: 5%;
    border-radius: 5px;
    border: 1px solid #0d0d5a;
    background: #0e0e73;
}
.dienvienl .post-title.is-large {
    text-align: center;
    display: flex;
    justify-content: center;
    font-weight: 500;
    margin-bottom: 3px;
}
#wrapiframe1{
    background:  #000;
    border-radius:3px;
}
.wrapiframe {
    max-width: 980px;
    background: #000;
    margin: 0 auto;
}
.off-canvas-right button.mfp-close {
    right: 3px !important;
    left: auto;
}
.choice_columns span {
    cursor: pointer;
    border-radius: 3px;
    border: 1px solid #eee;
    height: 22px;
    line-height: 14px;
    line-height: 22px;
    width: 30px;
    text-align: center;
    margin-right: 5px;
}

.choice_columns {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 10px;
    font-size: 0.9em;
    margin-bottom: 10px;
}
.choice_columns .active {
    background: #dbdbdbbd;
    border: 1px solid #8f8f8fb3;
}
.ctlb2g {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
    .onlymb {
        display: none;
    }
ul.myacountmenu {
    list-style-type: none;
    margin: 0;
    border-bottom: 1px solid #6a6a6a6e
    margin-bottom: 5px;
}
input.error {
    border: 2px solid red;
}
input#fontSizeSlider {
    margin: 0;
}

#fontSizeSlider {
    width: 100%;
}
.dark ul.myacountmenu a:hover {
    color: #f00000;
}
input.error {
    border: 2px solid red;
}

video#videoPreview {
    max-width: 100%;
    border: 2px solid #eeee;
}
#col-rowacountpage>.col-inner {
    padding: 30px 30px 0px 30px;
}
input#register-button {
    margin-top: 10px;
}
.btrt {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}
div#edit-form input#edit-avatar {
    display: block;
}
section.error-404.not-found.mt.mb > .row {
    display: flex;
    margin: 0 auto;
    flex-direction: column;
    align-content: center;
}
.success {
    padding: 10px;
    border-radius: 5px;
    border: 2px solid #7a9c59;
    background: unset;
}
input {
  border: 2px solid #ccc;
  padding: 8px;
  margin: 10px 0;
}

input.invalid {
  border-color: red;
}

input.valid {
  border-color: green;
}

.valid-check {
  color: green;
  display: none;
}

.valid .valid-check {
  display: inline;
}

.error-message {
  color: red;
  font-size: 12px;
  display: none;
}

.invalid + .error-message {
  display: block;
}

input#s {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
button.ux-search-submit.submit-button.secondary.button.icon.mb-0 {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}
#col-rowacountpage {
    padding-top: 30px;
    padding-bottom: 30px;
}
.header-bottom .nav-left {
    width: 100%;
    flex-basis: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#progressWrapper {
    width: 100%;
    background-color: #f3f3f3;
    margin-top: 10px;
}
span.btloadmore:hover {
    background: #b90000;
}
span.btloadmore {
    cursor: pointer;
    background: #ed3237;
    padding: 10px 20px;
    border-radius: 3px;
}
.top1info.publish {
    background: #017d00;
    border: unset;
    padding: 3px;
}
.top1info.pending {
    background: #dd3333;
    border: unset;
    padding: 3px;
}
.loadmorepagedata {
    display: none;
    text-align: center;
    justify-content: center;
    margin-bottom: 30px;
}

#progressBar {
    width: 0%;
    height: 30px;
    background-color: #4caf50;
    color: white;
    text-align: center;
    line-height: 30px;
    transition: width 0.4s ease-in-out; /* Hiệu ứng chạy mượt */
}
.nav>li>a>i {
    transition: color .3s;
    vertical-align: middle;
}
li#btacountmobile {
    font-size: 1.2em;
}
.header-wrapper {
    box-shadow: 1px 1px 15px rgba(0, 0, 0, .15);
}
header.header .dark.dark-page-wrapper {
    background: #00005d !important;
}
.response.success {
    margin-top: 10px;
    padding: 4px 10px;
    border-radius: 4px;
    color: #7a9c59;
    background: unset;
    border: 1px solid #7a9c59;
}
button.mfp-close {
    color: #f73900 !important;
    opacity: 1;
    mix-blend-mode: unset;
    top: -5px;
    opacity: 1!important;
}
select#video_orientation {
    margin-bottom: 2px;
}
ul.myacountmenu li {
    padding: 9px 0px;
    border-top: 1px solid #6a6a6a6e;
    margin: 0;
}
.wrap-setting {
    padding: 30px;
}
ul.myacountmenu {
    list-style-type: none;
}
span.textct {
    font-weight: bold;
    margin-bottom: 20px;
    float: left;
    width: 100%;
}
span.textct {
    font-weight: bold;
    margin-bottom: 7px;
    float: left;
    width: 100%;
    font-size: 1.1em;
}
input#videoFile {
    width: 100%;
    background: #dd3333;
    border: unset;
    border-radius: 3px;
}
.response.alert {
    background: none;
    border-radius: 3px;
    border: 2px solid #f00000;
    padding: 10px;
    margin-top: 13px;
    color: #f00000;
    background: #f0000017;
}
.textlogin {
    text-align: center;
    margin-top: 20px;
    font-size: 0.9em;
}
.wrapinfore {
    margin: 0 auto;
    max-width: 600px;
    text-align: center;
    padding: 5%;
}
.dark-page-wrapper select.choice_style {
    background: #292929;
    border: 1px solid #3c3c3c;
    color: #d2d2d2;
}
select.choice_style {
    border: 1px solid #dddddd;
    border-radius: 60px;
    width: 100px!important;
}

.select2-container--default .select2-results__option {
    font-size: 0.8em; /* Kích thước chữ cho các tùy chọn trong dropdown */
}
.select2-results__option {
    margin: 0;
}
.select2-dropdown{
    border: none!important;
}
/* Chế độ sáng */
.select2-container--default .select2-selection--single {
    background-color: #ffffff; /* Nền trắng */
    color: #777777; /* Màu chữ xám */
    border: 1px solid #cccccc; /* Viền */
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #777777; /* Màu chữ */
}

.select2-container--default .select2-results__option {
    background-color: #ffffff; /* Nền cho từng tùy chọn */
    color: #777777; /* Màu chữ cho từng tùy chọn */
}

.select2-container--default .select2-results__option--highlighted {
    background-color: #f2f2f2; /* Nền cho tùy chọn khi hover */
    color: #777777; /* Màu chữ cho tùy chọn khi hover */
}

/* Chế độ tối */
.dark .select2-container--default .select2-selection--single {
    background-color: #0f0f5a;
    color: #f1f1f1;
    border: navajowhite;
}
.dark .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #f1f1f1; /* Màu chữ sáng */
}

.dark .select2-container--default .select2-results__option {
    background-color: #131363; /* Nền cho từng tùy chọn */
    color: #f1f1f1; /* Màu chữ cho từng tùy chọn */
}

.dark .select2-container--default .select2-results__option--highlighted {
    background-color: #131363; /* Nền cho tùy chọn khi hover trong chế độ tối */
    color: #f1f1f1; /* Màu chữ cho tùy chọn khi hover */
}
  border-color: #FFFFFF transparent transparent transparent; /* Màu của mũi tên */
}
.nav-column>li>a, .nav-dropdown>li>a, .nav-vertical-fly-out>li>a, .nav>li>a {
    color: hsl(0deg 0% 0% / 85%);
    transition: all .2s;
}
.share-list {
    display: none;
}
div#actionshare i {
    color: #393939;
}
.liked,.disliked {
    color: red;
}
span.lovebt {
    cursor: pointer;
}
.liked #iconlike {
    color: red; /* Ví dụ đổi màu biểu tượng khi đã like */
}
input[type="submit"] {
    width: 100%;
    border-radius: 3px;
}
.has-dropdown .icon-angle-down {
    font-size: 16px;
    margin-left: .2em;
    opacity: .6;
    display: none;
}
.nav-outline>li>a {
    border: 1px solid transparent;
}
.dark .mfp-content {
    background: #0f0f5a !important;
}
.top1info {
    position: absolute;
    top: 3%;
    right: 4%;
    font-size: 0.7em;
    border: 1px solid #c1bfbf5c;
    padding: 1px 2%;
    line-height: 1;
    color: #fff;
    border-radius: 3px;
}
.top1info.hotc {
    background: unset;
}
.dark .response.success {
    color: #f0f0f0;
}
.topv_info {
    background: #04040421;
    width: 100%;
    position: absolute;
    bottom: 0;
    padding: 4%;
    padding-bottom: 2%;
    display: flex;
    flex-wrap: nowrap;
    color: #fff;
    font-size: 0.9em;
    background: rgb(0, 0, 0);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.3925945378151261) 0%, rgba(255, 255, 255, 0) 100%);
    justify-content: space-between;
}
div#progressBar {
    border-radius: 3px !important;
}

.row.large-12.col.center.mbbottomo.align-center {
    padding: 0;
}
.blog-wrapper.blog-archive.page-wrapper .large-12.text-center.col {
    padding-bottom: 14px;
}
span.livebt {
    cursor: pointer;
}
.menuacdrop a:hover {
    background: #202020;
}
.menuacdrop a {
    background: #f00000;
    padding: 5px 7px;
    border-bottom: 1px solid #6d6d6d6e;
    color: #fff;
    font-size: 0.9em;
}
li#uploadvideo a {
    font-weight: bold;
    color: #f00000;
}
.menuacdrop {
    display: none;
    position: absolute;
    width: 115px;
    left: -56px;
    font-size: 0.8em;
    flex-direction: column;
    margin-top: 8px;
}
span.s_quality {
    padding: 4px 5px;
    color: #fff;
    border-radius: 3px;
    text-transform: uppercase;
}
.homebox .ux-relay__control.ux-relay__control--bottom {
    position: absolute;
    width: 100px;
    right: 0;
    top: 8%;
}
.dark .heading-font, .dark a.lead, .dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6, .dark label, .hover-dark:hover a, .hover-dark:hover h1, .hover-dark:hover h2, .hover-dark:hover h3, .hover-dark:hover h4, .hover-dark:hover h5, .hover-dark:hover h6, .hover-dark:hover p {
    color: #ebebeb!important;
}
.header-bg-color,.header-bottom{
	background-color:unset!important;
}
.header-wrapper.stuck{
	background: #fff;
}
.nav-dropdown-default {
    padding: 10px;
}
.next-prev-thumbs li.has-dropdown:hover>.nav-dropdown, .no-js li.has-dropdown:hover>.nav-dropdown, li.current-dropdown>.nav-dropdown {
    left: 0;
    max-height: inherit;
    opacity: 1;
    visibility: visible;
}
li.has-dropdown.dark.dark-page-wrapper.current-dropdown ul.nav-dropdown {
    background: #000090 !important;
    color: #fff;
}
li.has-dropdown.dark.dark-page-wrapper.current-dropdown ul.nav-dropdown > li a{
    color: #fff!important;
}
.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a {
    border-bottom: unset;
    margin: 0 5px;
    padding-left: 0;
    padding-right: 0;
}
.dark .lightbox-content {
    background: #202020 !important;
}
.lightbox-content {
    border-radius: 7px !important;
}
.dark .wrp i {
    background: #202020;
    color: #c9c9c9 !important;
}

.dark .wrp, .dark .wrp a{
    background: #202020;
    color: #c9c9c9 !important;
}
.dark #tags_hot a, .dark .categories a {
    background: #0000c1;
    color: #ebebeb !important;
}
input[type=email], input[type=number], input[type=search], input[type=tel], input[type=text], input[type=url], textarea,.select-resize-ghost, .select2-container .select2-choice, .select2-container .select2-selection, input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea{
    border-radius: 3px;
}
.form-flat input:not([type=submit]), .form-flat select, .form-flat textarea {
    background-color: rgba(0, 0, 0, .03);
    border-color: rgba(0, 0, 0, .09);
    border-radius: 3px !important;
    box-shadow: none;
    color: currentColor !important;
}
a.loginbtt {
    background: #f00000;
    color: #fff;
    padding: 7px;
}
.btform a {
    background: #F00000;
    color: #ffff;
    padding: 5px 10px;
    width: 48%;
    text-align: center;
}
.btform {
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-evenly;
}
.categories {
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 0;
    margin-bottom: 13px;
}
#breadcrumbs {
    font-size: 0.8em;
    padding-top: 5px;
    padding-bottom: 5px;
}
.nav-line-bottom>li>a:before, .nav-line-grow>li>a:before, .nav-line>li>a:before {
    background-color: var(--fs-color-primary);
    content: " ";
    height: 2px;
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    transition: all .3s;
    width: 100%;
}
a.nav-top-link {
    margin-right: 5px;
    margin-left: 5px;
}
.box-image.thumnaildt {
    border-radius: 3px;
}
.maintop {
    margin-top: 15px;
}
.box-text {
    margin-bottom: 0;
    padding-bottom: 0;
}
h5.post-title {
    font-weight: 400;
    font-size: 1.1em;
}
h1.page-title.is-large {
    font-size: 1.3em;
}
.wrp i {
    margin-right: 8px;
}
.large-12.col {
    padding-bottom: 0;
}
#tags_hot a, .categories a {
    box-shadow: none;
    color: #393939;
    display: inline-block;
    font-size: 0.8em;
    font-weight: 400;
    text-shadow: none;
    vertical-align: middle;
    padding: 1px 5px;
    background: #f2f2f2;
    border-radius: 3px;
    margin-right: 7px;
    margin-bottom: 5px;
}


.entry-header-text {
    padding: 0;
}
.entry-content.single-page {
    padding: 0;
}
div#breadcrumbs p {
    margin: 0;
}
.hdtopt {
    padding: 0 15px 0px !important;
}
.blog-wrapper.blog-single.page-wrapper {
    padding-top: 10px;
}
div#tags_hot {
    margin-bottom: 15px;
}
h1.entry-title {
    font-size: 1.3em;
}
div#playlive {
    border-radius: 5px;
}
.wraptt-vd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 5px;
}
.fl_ttvideo {
    flex-basis: 100%;
    display: flex;
    justify-content: center;
}
.mbdiv {
    display: flex;
}
.post_data {
    display: flex;
    align-items: center;
}
#playlive .jw-progress, #playlive .jw-knob {
    background-color: rgb(225 53 31)!important;
}
.jw-breakpoint-7 .jw-controlbar .jw-slider-time {
    padding: 0!important;
    height: 15px!important;
}
.jw-breakpoint-7 .jw-controlbar .jw-button-container .jw-icon-inline:not(.jw-text-live), .jw-breakpoint-7 .jw-controlbar .jw-button-container .jw-icon-volume {
    height: 40px!important;
    width: 55px!important;
}
.jw-breakpoint-7 .jw-controlbar .jw-button-container .jw-icon-volume .jw-overlay {
    padding-bottom: 5%!important;
}
.jw-breakpoint-7 .jw-controlbar .jw-button-container {
    padding: 0!important;
}
.jw-breakpoint-7 .jw-controlbar .jw-slider-time .jw-slider-container{
    height: 5px!important
}
.dark #wide-nav {
    border-bottom: 2px solid #6161610f;
    background: #121261 !important;
}
#wide-nav {
    border-bottom: 2px solid #6161610f;
}
div#actionshare a {
    border: none;
    line-height: 30px;
    margin-bottom: 0;
}
.banner{
    background: unset!important;
}
.header-bottom .flex-col.hide-for-medium.flex-left {
    width: 100%;
    display: flex;
    justify-content: space-around;
}

button.sentvideo {
    text-transform: none;
    background: #f00000;
    color: #fff;
    border-radius: 3px;
    margin: 0;
}
button.ux-relay__button.ux-relay__load-more-button.button.primary.mb-0 {
    text-transform: unset;
    font-weight: normal;
    font-size: 0.8em;
    padding: 0px 13px;
    border-radius: 3px;
}
.nav-tabs+.tab-panels {
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 15px;
}
button.sentvideo:hover{
    background: #cb0000;
}
.content-area.page-wrapper {
    padding-top: 15px;
}
li.htmlbtt a {
    padding: 4px 10px;
}
li.htmlbtt.towbth a {
    color: #fff;
}
.dark #wbreadcrumb {
    background: #10105b;
}
#wbreadcrumb {
    background: #8b8b8b0f;
}
.page-wrapper {
    padding-bottom: 0;
    padding-top: 15px;
}
.dark .form-flat input:not([type=submit]), .dark .form-flat select, .dark .form-flat textarea, .nav-dark .form-flat input:not([type=submit]), .nav-dark .form-flat select, .nav-dark .form-flat textarea {
    background-color:#7c7c7c !important
    border-color: hsla(0, 0%, 100%, .09);
    color: #000!important;
}
#main.dark {
    background-color: #00005ded;
}
form#uploadVideoForm {
    margin-bottom: 0;
}
.my-popup .mfp-content {
    max-width: 500px; /* Đặt chiều rộng tối đa */
    width: 100%; /* Chiều rộng sẽ tự động điều chỉnh theo màn hình */
}
.extraicon {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
#respond {
    padding: 10px;
    border-radius: 3px;
    margin-bottom: 13px;
    display: none;
    border-radius: 10px;
    border: 1px solid #0000009c;
}
.primary, input[type=submit], input[type=submit].button {
    margin: 0;
}
form#commentform {
    margin-bottom: 0;
}
.wrp {
    cursor: pointer;
    padding: 4px 9px;
    color: #393939;
    align-items: center;
    /* margin: 1%; */
    background: #f2f2f2;
    border-radius: 5px;
    display: flex;
    font-size: 0.8em;
}

.wrapmb {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 390px;
}

a.show_comments {
    color: #393939;
}
.jw-controlbar {
    z-index: 10000;
}
.button.is-outline, input[type=button].is-outline, input[type=reset].is-outline, input[type=submit].is-outline {
    background-color: transparent;
    border: 1px solid;
}
.circle, .circle img {
    border-radius: 3px;
    -o-object-fit: cover;
    object-fit: cover;
}
div#actionshare a {
    margin-bottom: 0;
}
div#actionshare {
    display: flex !important;
    align-items: center;
    background: unset;
}

.btrt a {
    text-align: center;
    width: 48%;
    border-radius: 3px;
}
p.status.alert {
    border: 2px solid #f00000;
    border-radius: 3px;
    background: unset;
    color: #f00000;
}
.status.success {
    padding: 5px;
    border-radius: 3px;
    border: 2px solid #008903;
    background: unset;
    color: #008903;
}
.btrt {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
a.registerbtt {
    background: #413f3f;
    color: #fff;
    padding: 7px;
}
a#registerbt:hover{
    background: #000;
}
.ratio-16-9 {
    position: relative; 
    width: 100%;
    padding-top: 56.25%;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
}

.content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex; 
    justify-content: center;
    align-items: center;
    font-size: 15px;
    color: #333;
}
button.buttondt:hover{
    opacity: 1;
}
button.buttondt {
    margin: 0;
    padding: 0px 28px;
    background: #f00000;
    color: #fff;
    border-radius: 3px;
    font-style: normal;
    font-weight: normal;
    text-transform: none;
    opacity: 0.8;
}
button#save-profile {
    background: #008737;
    opacity: 0.8;
}
.video-viewed-l a {
    display: flex;
    justify-content: space-between;
}
.wr_content {
    margin-bottom: 20px;
}
.leftmt {
    flex-basis: 35%;
}
.leftmt img {
    border-radius:3px;
}
.video-viewed-l {
    margin-bottom: 20px;
}
.rightmt {
    flex-basis: 63%;
    display: flex;
    flex-direction: column;
}
.iconmtm span {
    font-size: 0.8em;
    padding: 0px 7px;
    border: 1px solid #c9c9c9;
    border-radius: 3px;
    margin-right: 5px;
}
.btform a {
    border-radius: 3px;
}
.btform {
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    max-width: 350px;
    margin: 0 auto;
    border-radius: 3px;
}
.wrap-setting a {
    color: #222;
}
.dark .wrap-setting a {
    color: #ebebeb;
}
span.vdlqt {
    font-weight: bold;
    margin-bottom: 15px;
    float: left;
    width: 100%;
}
a.clickshow {
    display: none;
}
button.mfp-close {
    color: #f73900 !important;
    mix-blend-mode: unset;
    top: -5px;
    opacity: 1 !important;
    left: 255px;
}
a.ntshowlink:hover {
    background: #ed3237;
}

a.ntshowlink {
    width: 27px;
    text-align: center;
}
a.authortg {
    background: #ed3237;
    margin-left: 0 !important;
    color: #fff;
}
li#settingl_before {
    display: none;
}
li.htmlbtt.towbth {
    margin-right: 0;
}
.dark a.authortg {
    background: #ed3237;
    margin-left: 0 !important;
    color: #fff;
}
.searchicon{
    cursor: pointer;
}
.nav-right i {
    font-size: 18px !important;
}
#dtdt{
    display: block!important;
}
.sharevid{
    display: none!important;
}
.nav-pagination.links li {
    margin: 3px;
}
#mbdt{
    display: none!important;
}
.nav-column>li>a, .nav-dropdown>li>a, .nav-vertical-fly-out>li>a, .nav>li>a {
    color: #000;
}
.nav-pagination>li>a, .nav-pagination>li>span {
    border: 1px solid;
    border-radius: 3px;
    display: block;
    border-color: #00000061;
    font-size: 1.1em;
    font-weight: bolder;
    height: 2.25em;
    line-height: 2em;
    min-width: 2.25em;
    padding: 0 7px;
    text-align: center;
    transition: all .3s;
    vertical-align: top;
    width: auto;
}
div#shareiframe span.share-icons-title {
    display: none;
}
.circle, .circle img {
    border-radius: 3px !important;
    -o-object-fit: cover;
    object-fit: cover;
}
.mcomment {
    display: flex;
    justify-content: flex-start;
    border-radius: 3px;
    margin-top: 10px;
    margin-bottom: 15px;
    align-items: center;
    border: 1px solid;
}
.cmleft {
    min-width: 140px;
    border-right: 1px solid;
}
.cmname {
    font-size: 0.8em;
    font-weight: bold;
    padding: 1px 3px;
    text-align: center;
    text-transform: uppercase;
    border-bottom: 1px dashed;
}
.cmtime {
    font-size: 0.7em;
    text-align: center;
    margin-top: 3px;
}
.cmright {
    padding: 5px;
    display: flex;
    align-items: center;
}
.cmright p{
    margin: 0!important;
}

@media only screen and (max-width: 767px) {
    ul.footer-menu-items li {
        flex-basis: 50%;
    }
    .row.homebox {
        margin-top: 25px !important;
    }
    .homebox .col.post-item {
        padding: 2px;
        padding-bottom: 10px;
    }
    .homebox .image-cover {
        padding-top: 59% !important;
    }
    #dtdt{
        display: none!important;
    }
    .sharevid{
        display: flex!important;
    }
    i.fa-solid.fa-magnifying-glass {
        margin-top: 4px;
    }
    ul.mobile-nav.nav.nav-right i,i.fa-solid.fa-magnifying-glass {
        font-size: 16px !important;
    }
    #mbdt{
        display: block!important;
    }
    .stuck .header-bottom.wide-nav {
        display: none!important;
    }
    .onlymb {
        display: block;
    }
    .extraicon {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
    }
    .wrapmb {
        display: flex;
        justify-content: space-around;
        align-items: center;
        width: auto !important;
        font-size: 0.8em;
    }
    .wrp {
        cursor: pointer;
        padding: 4px 9px;
        color: #393939;
        align-items: center;
        margin: 1%;
        background: #f2f2f2;
        border-radius: 3px;
        display: flex;
        text-align: center;
        flex-direction: column;
    }
    div#actionshare{
        display: none!important;
    }
    .categories {
        display: block;
    }
    #tags_hot a, .categories a {
        margin-bottom: 5px;
    }

}
#fontSizeSlider {
    width: 100%;
}

#toggleIcon {
    font-size: 40px; /* Kích thước biểu tượng */
    color: #0f0; /* Màu xanh khi bật */
    cursor: pointer;
    transition: color 0.3s;
}

#toggleIcon.on {
    color: #0f0; /* Màu xanh khi bật */
}

#toggleIcon:not(.on) {
    color: #f00; /* Màu đỏ khi tắt */
}

.dien-vien-list {
    list-style-type: none;
    padding: 0;
    margin: 20px 0;
    display: flex;
    flex-wrap: wrap;
}

.dien-vien-list li {
    margin: 10px;
    background: #f0f0f0;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s;
}

.dien-vien-list li:hover {
    transform: scale(1.05);
}

.dien-vien-list a {
    text-decoration: none;
    color: #333;
    padding: 10px 15px;
    display: block;
}

.dien-vien-list a:hover {
    background: #0073aa;
    color: #fff;
    border-radius: 5px;
}
.searchicon {
    cursor: pointer;
    color: #fff;
}
.homebox {
    margin: 0 !important;
    padding: 0 !important;
    padding-top: 10px!important;
    display: flex;
    justify-content: space-around;
    background: #0000c1;
    border-radius:5px;
    margin: 10px !important;
    margin-bottom:20px!important;
}
.dark .homebox {
    background: #000090 ;
}
.home_title span {
    background: #f10006;
    padding: 5px 10px;
    color: #fff;
    font-size: 1.2em;
    border-radius: 5px;
}
.home_title {
    position: relative;
    margin-top: -45px;
    text-align: left;
}
.dark .show-more-btn {
    color: #fff;}
.show-more-btn {
    max-width: 136px;
    margin: 0 auto;
    padding: 5px 10px;
    margin-bottom: 30px;
    width: 100%;
    margin-top: 10px;
    cursor: pointer;
    color: blue;
    text-decoration: underline;
    font-weight: bold;
    justify-content: center;
    text-align: center;
}

.show-more-btn .icon {
    margin-left: 5px;
    transition: transform 0.3s ease;
}

.expanded + .show-more-btn .icon {
    transform: rotate(90deg); /* Xoay icon khi mở rộng */
}
.classvip::before {
    content: "HOT";
    position: absolute;
    top: 45px;
    left: -29px;
    z-index: 1000;
    background-color: red;
    color: white;
    font-weight: bold;
    padding-top: 3px;
    padding-right: 40px;
    transform: rotate(-45deg);
    transform-origin: top left;
    font-size: 13px;
    padding-left: 40px;
}
#custom_select {
    position: relative;
}

.selected-option {
    width: 30px;
    height: 30px;
    cursor: pointer;
    display: inline-block;
}

.selected-option img {
    width: 30px;
    height: 30px;
}

.menuOptions {
    position: absolute;
    top: 41px;
    left: 0;
    background-color: white;
    z-index: 1000;
    width: 120px;
    display: none;
}
.dark .menuOptions {
    background: #000090;
}
.dark .menuOption:hover {
    background: #0f0f54;
}
.header-main .nav > li > a:hover{
    color: #f00000!important;
}
.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a{
    text-transform: none!important;
}
.menuOption {
    display: flex;
    align-items: center;
    padding: 5px;
    cursor: pointer;
}

.menuOption:hover {
    background-color: #f0f0f0;
}

.menuOption img {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}
li.htmlbtt a:hover {
    color: #fff !important;
}

li.htmlbtt .primary.is-outline:hover {
    background: #025caa;
}
#fontSizeControls {
    display: flex;
    align-items: center;
    font-size: 0.8em;
    line-height: 12px;
}
span#decreaseFontSize, span#increaseFontSize {
    cursor: pointer;
    width: 18px !important;
    line-height: 1;
    border-radius: 3px;
    color: #000;
    height: 14px;
    text-align: center;
}
li#fontcontrol {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
span#decreaseFontSize, span#increaseFontSize {
    cursor: pointer;
    width: 30px !important;
    line-height: 20px;
    border: 1px solid #000;
    border-radius: 3px;
    color: #000;
    height: 20px;
    text-align: center;
    margin: 5px;
}
.dark span#decreaseFontSize, .dark span#increaseFontSize{
    border: 1px solid #fff;
    border-radius: 3px;
    color: #fff;
}
span#decreaseFontSize:hover,span#increaseFontSize:hover {
    padding: 1px 8px;
    background: #ddd;
    border-radius: 3px;
}
.dark span#decreaseFontSize:hover,.dark span#increaseFontSize:hover {
    padding: 1px 8px;
    background: #ddd;
    color: #000;
}
.centerbutton{
    width: 100%;
    text-align: center;
    float: left;
}
.btloadmoreposts{
    cursor: pointer;
    padding: 5px 10px;
    background: #f00000;
    color: #fff;
}
.btloadmoreposts:hover{
    background: #9b0000;
}