@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

body,
html {
    width: 100%;
}

body {
    font-size: 14px;
    line-height: 140%;
}

body,
ul,
ol,
li,
p,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
table,
td,
img,
div,
tr {
    margin: 0;
    padding: 0;
    font-weight: 400;
}

input,
select {
    font-size: 12px;
    vertical-align: middle;
    border: none;
}

ul,
li {
    list-style-type: none;
}

img {
    border: 0;
}

p {
    margin-bottom: 10px;
}

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

:after,
:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.container {
    position: relative;
    margin-right: auto;
    margin-left: auto;
}

.row {
    position: relative;
    margin: 0;
    padding: 0;
}

.container:before,
.container:after,
.row:before,
.row:after,
.clearfix:before,
.clearfix:after {
    display: table;
    content: " ";
    clear: both;
}

h1 {
    font-size: 36px;
}

h2 {
    font-size: 32px;
}

h3 {
    font-size: 24px;
}

h4 {
    font-size: 18px;
}

h5 {
    font-size: 16px;
}

h6 {
    font-size: 14px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400;
    margin-bottom: 10px;
}

a,
button {
    text-decoration: none;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

button {
    border: 0;
}

button:hover,
input.btn {
    cursor: pointer;
}

a:focus,
a:hover,
a:active {
    text-decoration: none;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-overflow {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
}

.content {
    font-size: 16px;
    line-height: 30px;
    word-wrap: break-word;
    white-space: normal;
    word-break: normal;
}

.font-12 {
    font-size: 12px;
}

.font-13 {
    font-size: 13px;
}

.font-14 {
    font-size: 14px;
}

.font-15 {
    font-size: 15px;
}

.font-16 {
    font-size: 16px;
}

.font-18 {
    font-size: 18px;
}

.font-20 {
    font-size: 20px;
}

.font-22 {
    font-size: 22px;
}

.font-24 {
    font-size: 24px;
}

.font-25 {
    font-size: 24px;
}

.font-40 {
    font-size: 40px;
}

.font-bold {
    font-weight: 700;
}

img {
    border: 0;
    vertical-align: middle;
}

.img-circle {
    border-radius: 50%;
}

.img-rounded {
    border-radius: 5px;
}

.img-thumbnail {
    padding: 5px;
    border-radius: 5px;
}

.img-responsive {
    max-width: 100%;
}

.img-thumb {
    width: 220px;
}

.content img {
    display: block;
    max-width: 100%;
}

select {
    cursor: pointer;
    border: none;
    outline: none;
}

input,
textarea {
    outline: medium;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

input.form-control,
input.btn {
    outline: 0;
    -webkit-appearance: none;
}

input[type=checkbox] {
    vertical-align: -2px;
}

.form-control {
    display: block;
    width: 100%;
    height: 35px;
    padding: 0 10px;
    font-size: 14px;
    line-height: 20px;
    border-radius: 4px;
    -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
}

textarea.form-control {
    height: auto;
    padding: 10px;
}

.form-control.verify {
    width: 90px;
    text-align: center;
    margin-right: 10px;
    display: inline-block;
}

.pb10 {
    padding-bottom: 10px;
}

.pt10 {
    padding-top: 10px;
}

.pb15 {
    padding-bottom: 15px;
}

.pt15 {
    padding-top: 15px;
}

.pb20 {
    padding-bottom: 20px;
}

.pt20 {
    padding-top: 20px;
}

.pb30 {
    padding-bottom: 30px;
}

.pt30 {
    padding-top: 30px;
}

.mb10 {
    margin-bottom: 10px;
}

.mt10 {
    margin-top: 10px;
}

.mb15 {
    margin-bottom: 15px;
}

.mt15 {
    margin-top: 15px;
}

.mb20 {
    margin-bottom: 20px;
}

.mt20 {
    margin-top: 20px;
}

.mb30 {
    margin-bottom: 30px;
}

.mt30 {
    margin-top: 30px;
}

.spot {
    display: inline-block;
    margin-right: 5px;
    width: 8px;
    height: 8px;
    background-color: #fff;
    border-radius: 50%;
    border: 2px solid;
}

.split-line {
    display: inline-block;
    margin-left: 12px;
    margin-right: 12px;
    width: 1px;
    height: 14px;
    vertical-align: -2px;
}

.top-line,
.top-line-dot,
.bottom-line,
.bottom-line-dot {
    position: relative;
}

.top-line:before,
.top-line-dot:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    width: 100%;
    height: 1px;
}

.bottom-line:after,
.bottom-line-dot:before {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 1px;
}

.top-line:before {
    border-top: 1px solid;
}

.bottom-line:after {
    border-bottom: 1px solid;
}

.top-line-dot:before {
    border-top: 1px dotted;
}

.bottom-line-dot:before {
    border-bottom: 1px dotted;
}

.border {
    border: 1px solid;
}

.border-2x {
    border: 2px solid;
}

.border-3x {
    border: 3px solid;
}

.border-4x {
    border: 4px solid;
}

.border-5x {
    border: 5px solid;
}

.btn {
    display: inline-block;
    padding: 8px 30px;
    font-size: 12px;
}

.btn.btn-xs {
    padding: 4px 15px;
}

.btn.btn-sm {
    padding: 6px 20px;
}

.btn.btn-md {
    padding: 8px 25px;
}

.btn.btn-lg {
    padding: 12px 30px;
}

.btn.btn-block {
    display: block;
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
}

.btn.disabled {
    cursor: not-allowed;
}

.nav {
    position: relative;
}

.nav > li {
    float: left;
}

.nav > li.active > a {
    border-bottom: 2px solid;
}

.nav-head > li,
.nav-tabs > li {
    margin-top: 10px;
    margin-left: 30px;
}

.nav-head > li > a {
    padding-bottom: 8px;
    font-size: 16px;
}

.nav-tabs > li > a {
    padding-bottom: 10px;
}

.nav-tabs > li .dropdown-box {
    margin-left: -50px;
    padding-top: 0;
}

.nav-tabs > li .dropdown-box .item {
    width: 100px;
    text-align: center;
}

.nav-tabs > li .dropdown-box .item li {
    padding: 5px;
}

.nav-tag > li {
    margin-left: 10px;
}

.nav-tag > li > a {
    display: inline-block;
    padding: 0 10px;
    height: 25px;
    line-height: 23px;
    font-size: 14px;
    border-radius: 20px;
}

.nav-text > li {
    line-height: 30px;
}

.nav-text > li.active > a {
    color: #f80;
}

.nav-page {
    margin-left: 10px;
}

.nav-page > li {
    margin-left: 5px;
}

.nav-page > li > a {
    display: inline-block;
    font-size: 14px;
    padding: 0 6px;
    height: 25px;
    line-height: 23px;
}

.nav-page > li:first-child {
    margin-left: 0;
}

.nav-page > li:first-child > a {
    border-radius: 4px 0 0 4px;
}

.nav-page > li:last-child > a {
    border-radius: 0 4px 4px 0;
}

.pic-tag {
    position: absolute;
    display: inline-block;
    white-space: normal;
    text-align: left;
    line-height: 1.2em;
    padding: 5px;
    font-size: 11px;
    font-weight: normal;
    color: #4e2d03;
    background: linear-gradient(81.43deg, #C5A14B -26.81%, #EBD989 87.89%);
    border-radius: 0 5px 5px 0;
}

.pic-tag-top {
    top: 8px;
    left: 0;
}

.pic-text {
    display: block;
    width: 100%;
    position: absolute;
    z-index: 99;
    bottom: 0;
    left: 0;
    padding: 5px 10px;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
}

.pic-text-silde {
    padding-bottom: 20px;
    font-size: 14px;
}

.pic-text-lg {
    padding: 8px 20px;
    font-size: 14px;
}

.pic-title-top {
    display: block;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 5px 10px 10px;
    font-size: 12px;
    word-break: break-all;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pic-title-bottom {
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 5px 10px;
    font-size: 12px;
    word-break: break-all;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.qrcode-box {
    display: inline-block;
    position: relative;
    margin-bottom: 10px;
}

.qrcode-box .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -12.5px;
    margin-left: -12.5px;
    border-radius: 2px;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.dropdown {
    position: relative;
}

.dropdown-box {
    display: none;
    position: absolute;
    z-index: 99;
}

.dropdown-box.top {
    bottom: 100%;
    padding-bottom: 10px;
    left: 50%;
    margin-left: -80px;
}

.dropdown-box.bottom {
    top: 100%;
    padding-top: 10px;
    left: 50%;
    margin-left: -80px;
}

.dropdown-box.left {
    left: 100%;
    padding-left: 10px;
    bottom: 0;
}

.dropdown-box.right {
    right: 100%;
    padding-right: 10px;
    bottom: 0;
}

.dropdown-box .item {
    padding: 10px;
    width: 160px;
    border-radius: 2px;
}

.dropdown-hover {
    position: relative;
}

.dropdown-hover:hover .dropdown-box {
    display: block;
}

.open > .dropdown-box {
    display: block;
}

.myui-layout {
    position: relative;
}

.myui-panel {
    position: relative;
}

.myui-panel-box.active {
    padding: 0;
}

.myui-panel__head {
    position: relative;
    height: 30px;
}

.myui-panel__head .title {
    float: left;
    display: inline-block;
    margin: 0;
    padding-right: 10px;
    line-height: 30px;
}

.myui-panel__head .title img {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 10px;
    vertical-align: -5px;
}

.myui-panel__head .title,
.myui-panel__head .title a {
    display: block;
    font-family: rubik, sans-serif;
    font-weight: 600;
    color: #fff;
    font-size: 25px;
    line-height: 120%;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.myui-panel__head .more {
    line-height: 30px;
}

.myui-panel__head .operate {
    position: relative;
    padding-bottom: 5px;
}

.myui-panel__head .operate.open .dropdown-menu {
    display: block;
}

.myui-sidebar .myui-panel, .myui-sidebar .myui-panel-box {
    padding: 10px 0;
}

.myui-panel__head.active {
    height: 42px;
    margin: 0 0 10px 0;
    padding: 0 0 5px 0;
    color: #151F30;
    border-bottom: 2px dashed #5d5d5d;
    font-weight: 300;
    text-transform: uppercase;
}

.myui-vodlist__thumb {
    display: block;
    position: relative;
    background-position: 50% 50% !important;
    background-size: cover !important;
    overflow: hidden;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    border-radius: 7px;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}

.myui-vodlist__thumb.picture {
    background: 0 0;
    overflow: hidden;
}

.myui-vodlist__box:hover a {
    color: #da966e;
}

.myui-vodlist__thumb.picture img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.myui-block-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.myui-block-title {
    font-size: 24px;
    color: #ffffff;
    text-transform: uppercase;
    font-weight: bold;
    border-bottom: 2px solid red;
}

.myui-vodlist__thumb .play {
    opacity: 0;
    position: absolute;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2) url(../play-circle.svg) center no-repeat;
    background-color: rgba(0, 0, 0, 0.2);
    -webkit-transition: all ease-out 0.35s;
    transition: all ease-out 0.35s;
}

.myui-vodlist__thumb .play-v {
    opacity: 0;
    position: absolute;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    -webkit-transition: all ease-out 0.35s;
    transition: all ease-out 0.35s;
}

.myui-vodlist__thumb .play.active {
    opacity: 1;
}

.myui-vodlist__thumb:hover .play,
.myui-vodlist__thumb:hover .play-v {
    opacity: 1;
}

.myui-vodlist__detail {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    z-index: 3;
    width: 100%;
}

.myui-vodlist__detail.active {
    padding: 0 10px 10px;
}

.myui-vodlist__detail .title {
    margin: 10px 0 0;
    font-size: 15px;
    font-weight: 700;
}

.myui-vodlist__detail .title.active {
    font-size: 16px;
    margin-bottom: 10px;
}

.myui-vodlist__detail .text {
    min-height: 19px;
    font-size: 12px;
    margin-bottom: 0;
    margin-top: 0px;
}

.myui-vodlist__detail .text-title {
    font-size: 14px;
    line-height: 18px;
    margin: 11px 0 0;
    height: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.myui-vodlist__text li a {
    display: block;
}

.myui-vodlist__text.active li a {
    padding: 0 0 15px;
}

.myui-vodlist__text.active li:first-child a {
    padding-top: 0;
}

.myui-vodlist__text.striped li {
    padding: 10px 0;
}

.myui-vodlist__text.striped li a {
    display: inline-block;
    padding: 0;
}

.myui-vodlist__text.striped .striped-head {
    padding: 10px;
    border-radius: 5px;
}

.myui-vodlist__text .striped-head {
    font-weight: 700;
}

.myui-vodlist__text.to-color li {
    padding: 10px;
    border-radius: 5px;
}

.myui-vodlist__text.to-color li a {
    padding: 0;
}

.myui-vodlist__text.downlist {
    padding-top: 0;
}

.myui-vodlist__text.downlist li {
    padding: 10px 0;
}

.myui-vodlist__text.downlist li .text {
    line-height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
}

.myui-vodlist__text.downlist li a {
    display: inline-block;
    padding: 0;
}

.myui-vodlist__text.downlist li a.btn {
    padding: 4px 12px;
    margin-left: 10px;
}

.myui-vodlist__media li:first-child {
    padding-top: 0;
}

.myui-vodlist__media li:last-child {
    padding-bottom: 0;
}

.myui-vodlist__media .thumb,
.myui-vodlist__media .detail {
    display: table-cell;
    vertical-align: top;
}

.myui-vodlist__media .detail {
    width: 100%;
    padding: 0 0 0 20px;
}

.myui-vodlist__media .detail .desc {
    height: 40px;
}

.myui-vodlist__media .detail-side {
    padding: 0 10px;
}

.myui-vodlist__media .detail-left {
    padding: 0 20px 0 0;
}

.myui-vodlist__media .detail h4.title {
    margin: 10px 0;
    font-size: 18px;
    line-height: 25px;
}

.myui-vodlist__media .detail h5.title {
    font-size: 15px;
    height: 38px;
    line-height: 20px;
}

.myui-vodlist__screen {
    padding: 10px 0 5px;
}

.myui-vodlist__screen:first-child {
    padding-top: 0;
}

.myui-vodlist__screen:last-child {
    padding-bottom: 0;
}

.myui-vodlist__screen li {
    float: left;
    width: 25%;
    margin-bottom: 5px;
}

.myui-vodlist__rank li {
    margin-bottom: 10px;
}

.myui-vodlist__rank li:last-child {
    margin-bottom: 0;
}

.myui-link__text li {
    float: left;
    margin-right: 15px;
    margin-bottom: 10px;
}

.myui-content__list {
    position: relative;
}

.myui-content__list li {
    float: left;
    padding: 10px;
}

.myui-content__list li a {
    display: block;
    padding: 8px;
    text-align: center;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
}

.myui-play__list li {
    float: left;
}

.myui-play__list li a {
    display: block;
    padding: 8px 0;
    text-align: center;
}

.myui-article__title {
    margin: 0 0 10px;
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
}

.myui-article__sub {
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.myui-article__content {
    line-height: 30px;
    font-size: 16px;
}

.myui-article__content img {
    display: block;
    max-width: 100%;
}

.myui-screen__list {
    position: relative;
}

.myui-screen__list li {
    float: left;
}

.myui-screen__list li a.btn {
    padding: 5px 12px;
    font-size: 14px;
}

.myui-table {
    position: relative;
    width: 100%;
    max-width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.myui-table > thead > tr > th {
    vertical-align: bottom;
    border-bottom: 2px solid;
}

.myui-table > tbody > tr > td,
.myui-table > tbody > tr > th,
.myui-table > tfoot > tr > td,
.myui-table > tfoot > tr > th,
.myui-table > thead > tr > td,
.myui-table > thead > tr > th {
    padding: 8px;
    line-height: 25px;
    vertical-align: top;
    border-bottom: 1px solid;
}

.styu-message__list {
    position: relative;
    padding: 20px 0;
}

.styu-message__list .avatar {
    float: left;
    width: 60px;
}

.styu-message__list .data {
    margin-left: 60px;
}

.styu-message__list .data .name {
    margin: 0;
    font-size: 16px;
}

.styu-message__list .data .content {
    padding: 5px 0;
    line-height: 20px;
    word-wrap: break-word;
    white-space: normal;
}

.styu-message__list .data .admin,
.styu-message__list .data .content {
    margin: 0;
    font-size: 14px;
}

.styu-message__list.child {
    margin-top: 20px;
    padding-bottom: 0;
}

.myui-page {
    margin-bottom: 30px;
}

.myui-page li {
    display: inline-block;
    margin-left: 10px;
}

.myui-page li .num,
.myui-page li a {
    padding: 5px 15px;
}

.myui-extra {
    position: fixed;
    right: 50px;
    bottom: 50px;
}

.myui-extra li {
    position: relative;
    padding: 15px 10px 0;
}

.myui-extra li a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border-radius: 4px;
    font-size: 18px;
    cursor: pointer;
}

.flickity {
    position: relative;
    white-space: nowrap;
    overflow: hidden;
}

.flickity [class^=col-] {
    float: none !important;
    display: inline-block !important;
}

.flickity.dots {
    padding-bottom: 20px;
}

.flickity-enabled {
    position: relative;
}

.flickity-enabled:focus {
    outline: 0;
}

.flickity-viewport {
    position: relative;
    overflow: hidden;
    height: 100%;
}

.flickity-slider {
    position: absolute;
    width: 100%;
    height: 100%;
}

.flickity-viewport.is-pointer-down {
    cursor: -webkit-grabbing;
    cursor: grabbing;
}

.flickity-prev-next-button {
    position: absolute;
    top: 50%;
    width: 50px;
    height: 70px;
    border: none;
    background-color: rgba(0, 0, 0, 0.7);
    cursor: pointer;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all ease-out 0.35s;
    transition: all ease-out 0.35s;
    z-index: 3;
    display: none;
}

.flickity-prev-next-button.previous {
    left: 0;
    border-radius: 0;
}

.flickity-prev-next-button.next {
    right: 0;
}

.flickity-prev-next-button:disabled {
    cursor: auto;
}

.flickity-prev-next-button svg {
    width: 40px;
}

.flickity-prev-next-button .arrow {
    fill: #fff;
}

.flickity-prev-next-button.no-svg {
    color: #fff;
    font-size: 18px;
}

.flickity-page-dots {
    position: relative;
    text-align: center;
}

.flickity-page-dots .dot {
    display: inline-block;
    width: 15px;
    height: 3px;
    margin: 0 5px;
    opacity: 0.25;
    cursor: pointer;
}

.flickity-page-dots .dot.is-selected {
    opacity: 1;
}

.flickity:hover .flickity-prev-next-button {
    opacity: 1;
    background: rgba(0, 0, 0, 0.8);
}

.flickity.active .flickity-prev-next-button {
    margin-top: -25px;
}

.flickity.center .flickity-prev-next-button.previous {
    left: 0;
}

.flickity.center .flickity-prev-next-button.next {
    right: 0;
}

.carousel {
    position: relative;
}

.carousel-control {
    position: absolute;
    z-index: 99;
    top: 0;
    bottom: 0;
    display: block;
    width: 50px;
    height: 100%;
}

.carousel-control.left {
    left: 30px;
}

.carousel-control.right {
    right: 30px;
}

.carousel-control .fa {
    position: absolute;
    top: 50%;
    margin-top: -25px;
    display: block;
    width: 50px;
    height: 50px;
    text-align: center;
    font-size: 30px;
    line-height: 50px;
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    border-radius: 50%;
    opacity: 0.5;
}

.carousel-control:hover .fa {
    opacity: 1;
}

.carousel-indicators {
    position: absolute;
    z-index: 101;
}

.carousel-indicators-dots {
    width: 100%;
    bottom: 20px;
    left: 0;
    text-align: center;
}

.carousel-indicators-dots li {
    display: inline-block;
    margin: 0 5px;
    width: 15px;
    height: 3px;
    opacity: 0.25;
    cursor: pointer;
}

.carousel-indicators-dots li.active {
    opacity: 1;
}

.carousel-indicators-text {
    z-index: 2;
    top: 0;
    bottom: 0;
    right: 150px;
    width: 260px;
    padding: 50px 20px;
    background-color: rgba(32, 32, 32, 0.6);
}

.carousel-indicators-text li {
    padding: 10px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    cursor: pointer;
}

.carousel-indicators-text li:last-child {
    border-bottom: 0;
}

.carousel-indicators-text li .title {
    margin: 0;
    color: #ccc;
}

.carousel-indicators-text li .text {
    margin: 0;
    font-size: 12px;
    color: #999;
}

.carousel-indicators-thumb {
    bottom: 20px;
    left: 0;
    width: 100%;
    text-align: center;
}

.carousel-indicators-thumb li {
    display: inline-block;
    margin: 0 2px;
    border: 3px solid rgba(255, 255, 255, 0.6);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    border-radius: 2px;
    overflow: hidden;
}

.popup {
    position: fixed;
    z-index: 1001;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.popup.left {
    left: -100%;
    top: 0;
}

.popup.right {
    right: -100%;
    top: 0;
}

.popup.top {
    top: -100%;
    left: 0;
}

.popup.bottom {
    bottom: -100%;
    right: 0;
}

.popup-visible.left {
    left: 0;
}

.popup-visible.right {
    right: 0;
}

.popup-visible.top {
    top: 0;
}

.popup-visible.bottom {
    bottom: 0;
}

.popup-head {
    position: relative;
    padding: 10px 20px;
}

.popup-body {
    position: relative;
    padding: 10px;
}

.embed-responsive {
    position: relative;
    display: block;
    overflow: hidden;
    padding: 0;
    height: 0;
}

.embed-responsive .embed-responsive-item,
.embed-responsive embed,
.embed-responsive iframe,
.embed-responsive object,
.embed-responsive video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.embed-responsive-16by9 {
    padding-bottom: 56.25%;
}

.embed-responsive-4by3 {
    padding-bottom: 75%;
}

.fade {
    opacity: 0;
    -webkit-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}

.fade.in {
    opacity: 1;
}

.collapse {
    display: none;
}

.collapse.in {
    display: block;
}

.tab-content > .tab-pane,
.carousel-inner > .item {
    display: none;
}

.tab-content > .tab-pane.active,
.carousel-inner > .item.active {
    display: block;
}

.modal-open {
    overflow: hidden;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000;
}

.modal-backdrop.fade {
    opacity: 0;
}

.modal-backdrop.fade.in {
    opacity: 0.5;
}

.autocomplete-suggestions {
    position: absolute;
    top: 100%;
    width: 100%;
    z-index: 9999;
    padding: 10px;
    margin-top: 5px;
    border-radius: 4px;
}

.autocomplete-suggestion,
.autocomplete-suggestions li {
    padding: 5px 0;
    cursor: pointer;
}

.autocomplete-suggestion:first-child {
    border-top: 0;
}

.mobile-share {
    position: fixed;
    z-index: 999;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-animation: fade-in;
    animation: fade-in;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation: fade-in 0.5s;
}

.share-weixin {
    background: url(../img/share_weixin.png) rgba(0, 0, 0, 0.8) no-repeat;
    background-position: right top 10px;
    background-size: 80%;
}

.share-other {
    background: url(../img/share_other.png) rgba(0, 0, 0, 0.8) no-repeat;
    background-position: center bottom 10px;
    background-size: 80%;
}

.myui-nav__tabbar {
    display: none;
}

.hidden {
    overflow: hidden !important;
}

.relative {
    position: relative;
}

.fixed {
    position: fixed;
}

.block {
    display: block !important;
}

.inline-block {
    display: inline-block !important;
}

.top-fixed-up {
    margin-top: 0 !important;
}

.top-fixed {
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.pull-left {
    float: left !important;
}

.pull-right {
    float: right !important;
}

.margin-0 {
    margin: 0 !important;
}

.padding-0 {
    padding: 0 !important;
}

.margin-t0 {
    margin: 0 !important;
}

.padding-t0 {
    padding-top: 0 !important;
}

.margin-b0 {
    margin-bottom: 0 !important;
}

.padding-b0 {
    padding-top: 0 !important;
}

.radius-0 {
    border-radius: 0 !important;
}

.hide,
.visible-lg,
.visible-md,
.visible-sm,
.visible-xs,
.visible-mi,
.visible-inline-lg,
.visible-inline-md,
.visible-inline-sm,
.visible-inline-xs,
.visible-inline-mi {
    display: none !important;
}

.mask {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    -webkit-animation: fade-in;
    animation: fade-in;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation: fade-in 0.5s;
}

.fadeInDown {
    -webkit-animation: fadeInDown 0.5s 0.2s ease both;
    -moz-animation: fadeInDown 0.5s 0.2s ease both;
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }
    40% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }
    40% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-10px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

.col-pd,
.col-lg-1,
.col-lg-10,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-md-1,
.col-md-10,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-sm-1,
.col-sm-10,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-xs-1,
.col-xs-10,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
    position: relative;
    min-height: 1px;
}

.col-xs-1,
.col-xs-10,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-wide-1,
.col-xs-wide-10,
.col-xs-wide-15,
.col-xs-wide-2,
.col-xs-wide-25,
.col-xs-wide-3,
.col-xs-wide-35,
.col-xs-wide-4,
.col-xs-wide-45,
.col-xs-wide-5,
.col-xs-wide-55,
.col-xs-wide-6,
.col-xs-wide-65,
.col-xs-wide-7,
.col-xs-wide-75,
.col-xs-wide-8,
.col-xs-wide-85,
.col-xs-wide-9,
.col-xs-wide-95 {
    float: left;
}

.col-xs-10 {
    width: 10%;
}

.col-xs-9 {
    width: 11.1111111%;
}

.col-xs-8 {
    width: 12.5%;
}

.col-xs-7 {
    width: 14.2857143%;
}

.col-xs-6 {
    width: 16.6666667%;
}

.col-xs-5 {
    width: 20%;
}

.col-xs-4 {
    width: 25%;
}

.col-xs-3 {
    width: 33.3333333%;
}

.col-xs-2 {
    width: 50%;
}

.col-xs-1 {
    width: 100%;
}

.col-xs-wide-10 {
    width: 10%;
}

.col-xs-wide-9 {
    width: 90%;
}

.col-xs-wide-8 {
    width: 80%;
}

.col-xs-wide-7 {
    width: 70%;
}

.col-xs-wide-6 {
    width: 60%;
}

.col-xs-wide-5 {
    width: 50%;
}

.col-xs-wide-4 {
    width: 40%;
}

.col-xs-wide-3 {
    width: 30%;
}

.col-xs-wide-2 {
    width: 20%;
}

.col-xs-wide-15 {
    width: 15%;
}

.col-xs-wide-95 {
    width: 95%;
}

.col-xs-wide-85 {
    width: 85%;
}

.col-xs-wide-75 {
    width: 75%;
}

.col-xs-wide-65 {
    width: 65%;
}

.col-xs-wide-55 {
    width: 55%;
}

.col-xs-wide-45 {
    width: 45%;
}

.col-xs-wide-35 {
    width: 35%;
}

.col-xs-wide-25 {
    width: 25%;
}

.img-xs-300 {
    width: 300px;
}

.img-xs-220 {
    width: 220px;
}

.img-xs-190 {
    width: 190px;
}

.img-xs-160 {
    width: 160px;
}

.img-xs-150 {
    width: 150px;
}

.img-xs-140 {
    width: 140px;
}

.img-xs-130 {
    width: 130px;
}

.img-xs-120 {
    width: 120px;
}

.img-xs-110 {
    width: 110px;
}

.img-xs-100 {
    width: 100px;
}

.img-xs-90 {
    width: 90px;
}

.img-xs-80 {
    width: 80px;
}

.img-xs-70 {
    width: 70px;
}

@media (min-width: 768px) {
    .col-sm-1,
    .col-sm-10,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-wide-1,
    .col-sm-wide-10,
    .col-sm-wide-15,
    .col-sm-wide-2,
    .col-sm-wide-25,
    .col-sm-wide-3,
    .col-sm-wide-35,
    .col-sm-wide-4,
    .col-sm-wide-45,
    .col-sm-wide-5,
    .col-sm-wide-55,
    .col-sm-wide-6,
    .col-sm-wide-65,
    .col-sm-wide-7,
    .col-sm-wide-75,
    .col-sm-wide-8,
    .col-sm-wide-85,
    .col-sm-wide-9,
    .col-sm-wide-95 {
        float: left;
    }

    .col-sm-10 {
        width: 10%;
    }

    .col-sm-9 {
        width: 11.1111111%;
    }

    .col-sm-8 {
        width: 12.5%;
    }

    .col-sm-7 {
        width: 14.2857143%;
    }

    .col-sm-6 {
        width: 16.6666667%;
    }

    .col-sm-5 {
        width: 20%;
    }

    .col-sm-4 {
        width: 25%;
    }

    .col-sm-3 {
        width: 33.3333333%;
    }

    .col-sm-2 {
        width: 50%;
    }

    .col-sm-1 {
        width: 100%;
    }

    .col-sm-wide-10 {
        width: 10%;
    }

    .col-sm-wide-9 {
        width: 90%;
    }

    .col-sm-wide-8 {
        width: 80%;
    }

    .col-sm-wide-7 {
        width: 70%;
    }

    .col-sm-wide-6 {
        width: 60%;
    }

    .col-sm-wide-5 {
        width: 50%;
    }

    .col-sm-wide-4 {
        width: 40%;
    }

    .col-sm-wide-3 {
        width: 30%;
    }

    .col-sm-wide-2 {
        width: 20%;
    }

    .col-sm-wide-15 {
        width: 15%;
    }

    .col-sm-wide-95 {
        width: 95%;
    }

    .col-sm-wide-85 {
        width: 85%;
    }

    .col-sm-wide-75 {
        width: 75%;
    }

    .col-sm-wide-65 {
        width: 65%;
    }

    .col-sm-wide-55 {
        width: 55%;
    }

    .col-sm-wide-45 {
        width: 45%;
    }

    .col-sm-wide-35 {
        width: 35%;
    }

    .col-sm-wide-25 {
        width: 25%;
    }

    .img-sm-300 {
        width: 300px;
    }

    .img-sm-220 {
        width: 220px;
    }

    .img-sm-190 {
        width: 190px;
    }

    .img-sm-160 {
        width: 160px;
    }

    .img-sm-150 {
        width: 150px;
    }

    .img-sm-140 {
        width: 140px;
    }

    .img-sm-130 {
        width: 130px;
    }

    .img-sm-120 {
        width: 120px;
    }

    .img-sm-110 {
        width: 110px;
    }

    .img-sm-100 {
        width: 100px;
    }

    .img-sm-90 {
        width: 90px;
    }

    .img-sm-80 {
        width: 80px;
    }

    .img-sm-70 {
        width: 70px;
    }
}

@media (min-width: 1024px) {
    .col-md-1,
    .col-md-10,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-wide-1,
    .col-md-wide-10,
    .col-md-wide-15,
    .col-md-wide-2,
    .col-md-wide-25,
    .col-md-wide-3,
    .col-md-wide-35,
    .col-md-wide-4,
    .col-md-wide-45,
    .col-md-wide-5,
    .col-md-wide-55,
    .col-md-wide-6,
    .col-md-wide-65,
    .col-md-wide-7,
    .col-md-wide-75,
    .col-md-wide-8,
    .col-md-wide-85,
    .col-md-wide-9,
    .col-md-wide-95 {
        float: left;
    }

    .col-md-10 {
        width: 10%;
    }

    .col-md-9 {
        width: 11.1111111%;
    }

    .col-md-8 {
        width: 12.5%;
    }

    .col-md-7 {
        width: 14.2857143%;
    }

    .col-md-6 {
        width: 16.6666667%;
    }

    .col-md-5 {
        width: 20%;
    }

    .col-md-4 {
        width: 25%;
    }

    .col-md-3 {
        width: 33.3333333%;
    }

    .col-md-2 {
        width: 50%;
    }

    .col-md-1 {
        width: 100%;
    }

    .col-md-wide-10 {
        width: 10%;
    }

    .col-md-wide-9 {
        width: 90%;
    }

    .col-md-wide-8 {
        width: 80%;
    }

    .col-md-wide-7 {
        width: 70%;
    }

    .col-md-wide-6 {
        width: 60%;
    }

    .col-md-wide-5 {
        width: 50%;
    }

    .col-md-wide-4 {
        width: 40%;
    }

    .col-md-wide-3 {
        width: 30%;
    }

    .col-md-wide-2 {
        width: 20%;
    }

    .col-md-wide-15 {
        width: 15%;
    }

    .col-md-wide-95 {
        width: 95%;
    }

    .col-md-wide-85 {
        width: 85%;
    }

    .col-md-wide-75 {
        width: 75%;
    }

    .col-md-wide-65 {
        width: 65%;
    }

    .col-md-wide-55 {
        width: 55%;
    }

    .col-md-wide-45 {
        width: 45%;
    }

    .col-md-wide-35 {
        width: 35%;
    }

    .col-md-wide-25 {
        width: 25%;
    }

    .img-md-300 {
        width: 300px;
    }

    .img-md-220 {
        width: 220px;
    }

    .img-md-190 {
        width: 190px;
    }

    .img-md-160 {
        width: 160px;
    }

    .img-md-150 {
        width: 150px;
    }

    .img-md-140 {
        width: 140px;
    }

    .img-md-130 {
        width: 130px;
    }

    .img-md-120 {
        width: 120px;
    }

    .img-md-110 {
        width: 110px;
    }

    .img-md-100 {
        width: 100px;
    }

    .img-md-90 {
        width: 90px;
    }

    .img-md-80 {
        width: 80px;
    }

    .img-md-70 {
        width: 70px;
    }
}

@media (min-width: 1440px) {
    .col-lg-1,
    .col-lg-10,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-wide-1,
    .col-lg-wide-10,
    .col-lg-wide-15,
    .col-lg-wide-2,
    .col-lg-wide-25,
    .col-lg-wide-3,
    .col-lg-wide-35,
    .col-lg-wide-4,
    .col-lg-wide-45,
    .col-lg-wide-5,
    .col-lg-wide-55,
    .col-lg-wide-6,
    .col-lg-wide-65,
    .col-lg-wide-7,
    .col-lg-wide-75,
    .col-lg-wide-8,
    .col-lg-wide-85,
    .col-lg-wide-9,
    .col-lg-wide-95 {
        float: left;
    }

    .col-lg-10 {
        width: 10%;
    }

    .col-lg-9 {
        width: 11.1111111%;
    }

    .col-lg-8 {
        width: 12.5%;
    }

    .col-lg-7 {
        width: 14.2857143%;
    }

    .col-lg-6 {
        width: 16.6666667%;
    }

    .col-lg-5 {
        width: 20%;
    }

    .col-lg-4 {
        width: 25%;
    }

    .col-lg-3 {
        width: 33.3333333%;
    }

    .col-lg-2 {
        width: 50%;
    }

    .col-lg-1 {
        width: 100%;
    }

    .col-lg-wide-10 {
        width: 10%;
    }

    .col-lg-wide-9 {
        width: 90%;
    }

    .col-lg-wide-8 {
        width: 80%;
    }

    .col-lg-wide-7 {
        width: 70%;
    }

    .col-lg-wide-6 {
        width: 60%;
    }

    .col-lg-wide-5 {
        width: 50%;
    }

    .col-lg-wide-4 {
        width: 40%;
    }

    .col-lg-wide-3 {
        width: 30%;
    }

    .col-lg-wide-2 {
        width: 20%;
    }

    .col-lg-wide-15 {
        width: 15%;
    }

    .col-lg-wide-95 {
        width: 95%;
    }

    .col-lg-wide-85 {
        width: 85%;
    }

    .col-lg-wide-75 {
        width: 75%;
    }

    .col-lg-wide-65 {
        width: 65%;
    }

    .col-lg-wide-55 {
        width: 55%;
    }

    .col-lg-wide-45 {
        width: 45%;
    }

    .col-lg-wide-35 {
        width: 35%;
    }

    .col-lg-wide-25 {
        width: 25%;
    }

    .img-lg-300 {
        width: 300px;
    }

    .img-lg-220 {
        width: 220px;
    }

    .img-lg-190 {
        width: 190px;
    }

    .img-lg-160 {
        width: 160px;
    }

    .img-lg-150 {
        width: 150px;
    }

    .img-lg-140 {
        width: 140px;
    }

    .img-lg-130 {
        width: 130px;
    }

    .img-lg-120 {
        width: 120px;
    }

    .img-lg-110 {
        width: 110px;
    }

    .img-lg-100 {
        width: 100px;
    }

    .img-lg-90 {
        width: 90px;
    }

    .img-lg-80 {
        width: 80px;
    }

    .img-lg-70 {
        width: 70px;
    }
}

@media (min-width: 1600px) {
    .visible-lg {
        display: block !important;
    }

    .hidden-lg {
        display: none !important;
    }

    .visible-inline-lg {
        display: inline-block !important;
    }

    .visible-text-lg {
        visibility: visible !important;
    }

    .hidden-text-lg {
        visibility: hidden !important;
    }
}

@media (max-width: 1199px) and (min-width: 1023px) {
    .visible-md {
        display: block !important;
    }

    .hidden-md {
        display: none !important;
    }

    .visible-inline-md {
        display: inline-block !important;
    }

    .visible-text-md {
        visibility: visible !important;
    }

    .hidden-text-md {
        visibility: hidden !important;
    }
}

@media (max-width: 1023px) and (min-width: 767px) {
    .visible-sm {
        display: block !important;
    }

    .hidden-sm {
        display: none !important;
    }

    .visible-inline-sm {
        display: inline-block !important;
    }

    .visible-text-sm {
        visibility: visible !important;
    }

    .hidden-text-sm {
        visibility: hidden !important;
    }
}

@media (max-width: 1023px) {
    .dropdown-hover:hover .dropdown-box {
        display: none;
    }

    .myui-panel__head .more {
        line-height: 35px;
    }

    .myui-panel__head.active {
        height: 35px;
    }

    .nav-head > li,
    .nav-tabs > li {
        margin-top: 8px;
        margin-left: 15px;
    }

    .nav-tabs.active {
        height: 35px;
        white-space: nowrap;
        overflow-y: hidden;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
    }

    .nav-tabs.active li {
        float: none;
        display: inline-block;
    }

    .nav-tabs > li .dropdown-box {
        margin-left: -80px;
    }

    .myui-screen__list {
        white-space: nowrap;
        overflow-y: hidden;
    }

    .myui-screen__list li {
        float: none;
        display: inline-block;
        margin-bottom: 0;
    }

    .myui-screen__list li a.btn {
        font-size: 12px;
        white-space: nowrap;
    }

    .myui-vodlist__detail .title.active {
        font-size: 14px;
        margin-bottom: 0;
    }

    .myui-content__playlist {
        -webkit-overflow-scrolling: touch;
    }

    .myui-modal__dialog {
        width: 320px;
        margin: 50px auto;
    }
}

@media (max-width: 767px) {
    .visible-xs {
        display: block !important;
    }

    .hidden-xs {
        display: none !important;
    }

    .visible-inline-xs {
        display: inline-block !important;
    }

    .visible-text-xs {
        visibility: visible !important;
    }

    .hidden-text-xs {
        visibility: hidden !important;
    }

    body {
        font-size: 12px;
    }

    h1 {
        font-size: 24px;
    }

    h2 {
        font-size: 20px;
    }

    h3 {
        font-size: 18px;
    }

    h4 {
        font-size: 16px;
    }

    h5 {
        font-size: 14px;
    }

    h6 {
        font-size: 12px;
    }

    .btn {
        padding: 8px 16px;
    }

    .btn.btn-xs {
        padding: 4px 8px;
    }

    .btn.btn-sm {
        padding: 6px 12px;
    }

    .btn.btn-md {
        padding: 8px 16px;
    }

    .btn.btn-lg {
        padding: 12px 24px;
    }

    .myui-nav__tabbar {
        position: fixed;
        bottom: 0;
        width: 100%;
        padding: 5px 0 0;
        z-index: 999;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        border-top: 1px solid;
    }

    .myui-nav__tabbar .item {
        display: block;
        text-align: center;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .myui-nav__tabbar .item .icon {
        display: block;
        text-align: center;
        font-size: 20px;
        line-height: 20px;
    }

    .myui-nav__tabbar .item .icon-img {
        display: inline-block;
        margin-top: 5px;
        width: 24px;
        height: 24px;
    }

    .myui-nav__tabbar .item .title {
        margin: 5px 0;
        font-size: 12px;
    }

    .split-line {
        height: 12px;
        margin-left: 5px;
        margin-right: 5px;
    }

    .top-line:before,
    .top-line-dot:before {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: scaleY(0.5);
        transform: scaleY(0.5);
    }

    .bottom-line:after,
    .bottom-line-dot:before {
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
        -webkit-transform: scaleY(0.5);
        transform: scaleY(0.5);
    }

    .myui-panel__head .title,
    .myui-panel__head .title a {
        font-size: 18px;
    }

    .myui-vodlist__thumb .tag {
        padding: 0 5px;
    }

    .myui-vodlist__thumb .silde-title {
        font-size: 12px;
    }

    .myui-vodlist__detail .title,
    .myui-vodlist__detail .title.active {
        margin-bottom: 0;
        font-size: 12px;
    }

    .myui-vodlist__media li .detail.active {
        padding-left: 0;
        padding-right: 10px;
    }

    .myui-vodlist__media .detail h4.title {
        margin-top: 0;
        font-size: 14px;
        line-height: 18px;
    }

    .myui-vodlist__text li a {
        padding: 10px 0;
    }

    .myui-vodlist__text.downlist li {
        padding: 5px 0 0;
    }

    .myui-article__title {
        font-size: 18px;
    }

    .myui-page li {
        float: left;
        width: 20%;
        margin: 0;
        padding: 0 5px;
    }

    .myui-page li a {
        display: block;
        padding: 5px 0;
        text-align: center;
    }

    .myui-extra li {
        padding: 8px 0 0;
    }

    .myui-extra li a {
        width: 35px;
        height: 35px;
        line-height: 35px;
        font-size: 16px;
    }

    .flickity-prev-next-button {
        width: 20px;
        height: 40px;
    }

    .flickity-prev-next-button.previous {
        border-radius: 0;
    }

    .flickity-prev-next-button.next {
        border-radius: 0;
    }

    .carousel-control {
        width: 30px;
        height: 100%;
    }

    .carousel-control .fa {
        margin-top: -15px;
        display: block;
        width: 30px;
        height: 30px;
        font-size: 20px;
        line-height: 30px;
    }

    .carousel-control.left {
        left: 10px;
    }

    .carousel-control.right {
        right: 10px;
    }

    .m-margin-0 {
        margin: 0 !important;
    }

    .m-padding-0 {
        padding: 0 !important;
    }
}

body {
    color: #abb7c4;
    font-family: nunito sans, sans-serif;
    font-weight: 400;
    background-color: #0e0e1c;
    -webkit-font-smoothing: antialiased;
}

p {
    font-size: 14px;
    color: #abb7c4;
    font-weight: 300;
    text-transform: none;
    line-height: 24px !important;
}

.myui-header__top {
    position: relative;
    top: 0;
    z-index: 999;
    width: 100%;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    padding-top: 8px;
}

.fixed-header {
    position: fixed !important;
    background: linear-gradient(180deg, #0e0e1c, #0e0e1c, transparent);
}


.top-fixed-down {
    margin-top: -61px;
}

.color-orange {
    color: #ddd !important;
}

.myui-panel-list {
    margin-top: 1em;
    /*background: #01060a;*/
}

.myui-panel-list .myui-panel-box {
    padding: 0;
}

.myui-top-movies {
    margin-top: 20px;
}

.myui-top-movies.odd {
    padding-top: 15px;
}

.myui-top-movies.odd .myui-block-header {
    padding: 0 10px;
}

.myui-header__logo,
.myui-header__menu {
    float: left;
}

.myui-header__logo .logo {
    font-size: 1.5em;
    color: #fff !important;
    font-weight: 700;
    background: url("https://i.imgur.com/EdgbKUd.png") no-repeat;
    background-size: contain;
    display: block;
    width: 55px;
    height: 60px;
    /*text-indent: -9999px;*/
}
.logo-container {
    display: flex;
    align-items: center;
}
.brand-logo {
    font-family: 'roboto', sans-serif;
    font-weight: bold;
    margin-left: 0;
    margin-right: 0; /* VUIPHIM v98b: bỏ lề 50px gốc — làm logo chân trang lệch trái */
    font-size: 25px;
    position: relative; /* Thêm thuộc tính position: relative; */
}

.brand-logo::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -6px;
    width: 60%;
    height: 2px;
    background-color: red;
}

@media (max-width: 300px) {
    .brand-logo {
        display: none;
        margin-left: 20px;
    }
}
.myui_custom_header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition: background-color 0.2s ease;
    transition: background-color 0.2s ease;
    padding: 10px 0;
    position: relative;

}

.myui-header__search {
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 8px 0 8px 20px;
}

.myui-header__search .search-hot {
    line-height: 48px;
}

.myui-header__search .search-hot a {
    display: inline-block;
    margin-left: 20px;
    color: #fff;
}

.myui-header__search .search-hot span {
    color: #666;
}

.myui-header__search li {
    float: left;
}

.myui-header__search li.search-box {
    position: relative;
    width: 350px;
    height: 50px;
}

.icon--white {
    fill: #ffffff;
}

.icon-sign-in {
    width: 12px;
    height: 14px;
}

.icon-users {
    width: 15px;
    height: 14px;
}

.icon-bookmark {
    width: 10px;
    height: 14px;
}

#box-user-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
}

#box-user-menu a {
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 5px;
}

#box-user-menu .icon {
    margin-right: 5px;
}

.myui-header__search li.search-box .form-control {
    height: 32px;
    color: #000;
    border: 1px solid #353535;
    padding: 5px;
    font-style: italic;
    width: 100%;
    outline: none;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    border-radius: 10px;
}

.myui-header__search li.search-box .form-control:focus {
    border-color: #fff601;
}

.myui-header__search li.search-box .form-control:focus {
    border-color: none;
    -webkit-box-shadow: none;
}

.myui-header__search li.search-box .submit {
    position: absolute;
    top: 0px;
    height: 32px;
    width: 32px;
    text-align: center;
    background: 0 0;
    border: 0;
    color: #abb7c4;
    right: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.nav__content {
    background-color: #151f30;
    border-bottom: 1px solid #181818;
}

.myui-header__search li.search-box .dropdown-box {
    padding-top: 0;
    left: 0;
    margin-left: 0;
    background: #242d35;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.myui-header__search li.search-box .dropdown-box .item {
    width: 260px;
    padding: 20px;
}

.myui-header__search li.search-box.search-box:hover .search-dropdown-hot {
    display: block;
}

.myui-header__search li.search-select {
    position: relative;
    margin-top: 15px;
    padding: 0 10px 0 15px;
    border-right: 1px solid #eee;
    cursor: pointer;
}

.myui-header__search li.search-select .dropdown-box {
    margin-left: -40px;
    z-index: 101;
}

.myui-header__search li.search-select .dropdown-box .item {
    width: 80px;
    padding: 10px;
    text-align: center;
}

.myui-header__search li.search-select .dropdown-box .item p {
    margin: 0;
    padding: 5px 0;
}

.myui-header__search li.search-ul {
    position: relative;
    height: 50px;
    padding: 15px 20px 0;
    border-right: 1px solid #eee;
    cursor: pointer;
}

.myui-header__search li.search-ul .fa {
    font-size: 20px;
}

.myui-header__search li.search-ul .dropdown-box {
    margin-left: -30px;
    padding-top: 0;
}

.myui-header__search li.search-ul .dropdown-box .item {
    width: 500px;
}

.myui-header__search li.search-ul .dropdown-box .item li {
    padding: 6px;
}

.myui-header__menu {
    position: relative;
}

.myui-header__menu > li {
    position: relative;
    float: left;
}

.myui-header__menu > li > a {
    font-size: 16px;
    line-height: 40px;
    color: #fff;
    padding: 8px 10px;
    text-transform: uppercase;
    display: inline-block;
    position: relative;
}

.myui-header__menu > li.active > a, .myui-header__menu > li > a:hover {
    color: #da966e !important;
}

.myui-header__menu > li.active > a:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #ccc;
}

.myui-header__user {
    float: right;
}

.myui-header__user > li {
    float: left;
    position: relative;
    padding: 18px 0 10px;
    margin-left: 20px;
}

.myui-header__user > li > a,
.myui-header__user > li > a .fa {
    display: inline-block;
    font-size: 22px;
    line-height: 24px;
    color: #333;
}

.myui-header__user > li .dropdown-box {
    right: 0;
    margin-left: 0;
    margin-right: -120px;
    padding-top: 10px;
}

.myui-header__user > li .dropdown-box .item {
    width: 260px;
    padding: 20px;
}

.myui-header__user > li.menu .dropdown-box {
    right: 0;
    margin-left: 0;
    margin-right: -40px;
    padding-top: 10px;
}

.myui-header__user > li.menu .dropdown-box .item {
    width: 90px;
    padding: 10px;
}

.myui-header__user > li.menu .dropdown-box .item li {
    padding: 5px 0;
    text-align: center;
}

.myui-header__top.color {
    background: 0 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.myui-header__top.color .myui-header__menu > li > a,
.myui-header__top.color .myui-header__user > li > a,
.myui-header__top.color .myui-header__user > li > a .fa,
.myui-header__top.color .myui-header__search li.search-box .form-control,
.myui-header__top.color .myui-header__search li.search-ul .fa,
.myui-header__top.color .myui-header__search li.search-select .text {
    color: #fff;
}

.myui-header__top.color .myui-header__search li.search-ul,
.myui-header__top.color .myui-header__search li.search-select {
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.myui-header__top.color .myui-header__search {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.myui-header__top.color .myui-header__search .search-hot a {
    color: #ddd;
}

.myui-content__thumb {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 45%;
    flex: 0 0 45%;
    max-width: 45%;
    margin: 0 10px 10px 0;
}

.myui-content__thumb .btn-block {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
}

.myui-content__thumb .btn-block.btn-watch {
    background: #dd003f;
    color: #fff;
    text-transform: uppercase;
    border-radius: 0;
    font-weight: 600;
}

.myui-movie-detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 20px;
}

.movie-eps-all {
    border-left: 1px solid #405266;
}

.server-option {
    padding-right: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.movie-eps-all {
    padding-left: 10px;
}

.movie-server-item i.fa {
    font-size: 1.5em;
    color: #df433e;
    margin-right: 5px;
}

.movie-server-item {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    border-top: 1px solid #405266;
    border-bottom: 1px solid #405266;
    margin-top: 20px;
}

.movie-eps-wrapper {
    max-height: 100px;
    overflow: auto;
}

.movie-eps-item {
    display: inline-block;
    padding: 5px 7px;
    background-color: #fafafa;
    border-radius: 5px;
    color: #020d19;
    margin: 5px;
    border: 1px solid transparent;
    -webkit-transition: background-color 0.1s ease;
    transition: background-color 0.1s ease;
}

.more.icon-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.movie-eps-item:hover {
    border: 1px solid #da966e;
    background: transparent;
}

.icon-btn svg {
    width: 50px;
    height: 45px;
    padding-bottom: 5px;
}

.detail-block {
    padding: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background: #181818;
}

.myui-movie-detail .title {
    color: #da966e;
    position: relative;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 20px;
}

.myui-movie-detail .title::after {
    position: absolute;
    width: 15%;
    height: 2px;
    left: 0;
    background: #da966e;
    content: "";
    bottom: -10px;
    display: block;
}

.myui-content__thumb .myui-vodlist__thumb {
    width: 100%;
    max-height: 400px;
}

.myui-content__thumb.active .myui-vodlist__thumb {
    width: 150px;
}

.myui-content__detail {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 55%;
    flex: 0 0 55%;
    max-width: 55%;
}

.myui-content__detail.active {
    width: calc(100% - 150px);
}

.myui-content__detail .title {
    line-height: 30px;
    margin-top: 0;
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 5px;
    text-transform: uppercase;
    color: #ff9658;
}

.search-title {
    line-height: 30px;
    margin-top: 0;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 5px;
}

.myui-content__detail .title2 {
    font-size: 12px;
    color: #999;
}

.list-movie-ajax {
    list-style: none;
    padding: 0;
}

.list-movie-ajax .movie-item {
    position: relative;
    padding: 5px;
    color: #ddd;
    height: auto;
    display: inline-block;
    text-align: left;
    width: 100%;
}

.list-movie-ajax .movie-item .search-img {
    width: 60px;
    float: left;
    display: inline;
    height: 70px;
}

.list-movie-ajax .info {
    display: inline-block;
    width: 240px;
    margin: 5px;
}

.list-movie-ajax .info .movie-title-1 {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.video-p-first {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.video-p-first .cc-warning {
    padding: 10px;
    background: #0b1f35;
    font-size: 14px;
    max-width: 50%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
}

.video-p-first .myui-player__notice {
    background: #d9534f !important;
    border-color: #d9534f !important;
    max-width: 50%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    margin-bottom: 0;
    padding: 10px;
}

.list-movie-ajax .movie-item a:hover .movie-title-1 {
    color: #da966e;
}

.list-movie-ajax .info .movie-title-2, .list-movie-ajax .info .movie-title-chap {
    font-size: 12px;
    color: #abb7c4;
    line-height: normal;
}

.myui-content__detail .title .score {
    display: inline-block;
    margin-left: 10px;
    font-family: Georgia, times new roman, Times, serif;
}

.myui-content__detail .data {
    margin-bottom: 10px;
    line-height: 20px;
    word-wrap: break-word;
    white-space: normal;
    word-break: normal;
}

.myui-content__detail .score {
    margin-bottom: 20px;
}

.myui-content__detail .score .rating {
    display: inline-block;
    position: relative;
    top: 5px;
}

.myui-content__detail .score .rating li {
    cursor: pointer;
    display: inline-block;
    margin-right: 5px;
}

.myui-content__detail .score .rating li .fa {
    font-size: 24px;
}

.myui-content__detail .score .branch {
    display: inline-block;
    font-family: Georgia, times new roman, Times, serif;
    font-size: 24px;
    line-height: 24px;
}

.myui-content__operate {
    float: left;
    margin-top: 10px;
}

.myui-content__operate .btn {
    margin-left: 10px;
    margin-bottom: 10px;
}

.myui-content__operate .btn:first-child {
    margin-left: 0;
}

.myui-content__tag a {
    display: inline-block;
    line-height: 20px;
    padding: 2px 10px;
    margin-left: 5px;
    border: 1px solid rgb(255, 255, 255);
    font-size: 12px;
    border-radius: 15px;
}

.myui-content__detail .topline {
    position: relative;
    margin: 0;
    padding: 10px 0;
}

.myui-player {
    margin-top: 20px;
    padding-bottom: 15px;
}

.myui-player__item {
    position: relative;
    margin-bottom: 15px;
}

.myui-player__item .fixed {
    position: fixed;
    z-index: 998;
    right: 0;
    bottom: 0;
    padding: 10px;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.myui-player__item .is-btn {
    position: absolute;
    z-index: 99;
    top: 50%;
    right: -12px;
    margin-top: -30px;
    display: block;
    width: 12px;
    text-align: center;
    height: 60px;
    line-height: 60px;
    font-size: 10px;
    border-radius: 0 4px 4px 0;
    background-color: #404040;
    color: #999;
}

.myui-player__item .player-fixed-off {
    display: none;
    position: absolute;
    top: -10px;
    left: -10px;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    background-color: #fff;
    border-radius: 50%;
    color: #333;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.myui-player__item .tips {
    position: relative;
    height: 40px;
    line-height: 40px;
    overflow: hidden;
    padding: 0 20px;
    color: #fff;
}

.myui-player__operate {
    padding: 20px 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.myui-player__operate li {
    display: block;
    text-align: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.myui-player__detail .title {
    margin: 0 0 10px;
}

.myui-player__detail .detail-content {
    padding-top: 10px;
}

.myui-player__detail .desc {
    padding-left: 42px;
}

.myui-player__detail .desc .left {
    margin-left: -42px;
}

#player-sidebar::-webkit-scrollbar {
    width: 4px;
    background-color: #1c1b1e;
}

#player-sidebar::-webkit-scrollbar-thumb {
    background-color: #434145;
}

.myui-player__notice {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: #dd003f !important;
    color: #fff;
    border-color: #dd003f !important;
}

.myui-player__notice h3,
.myui-player__notice h5,
.myui-player__notice p {
    color: #fff;
}

.myui-player-links {
    position: relative;
    top: 15px;
    right: 10px;
}

.myui-player-links .btn {
    position: absolute;
    top: 0;
    right: -5px;
    border-radius: 0 5px 5px 0;
}

.myui-newslist li {
    padding: 30px 0;
}

.myui-newslist li .title {
    margin: 0;
    font-size: 22px;
    line-height: 30px;
    font-weight: 600;
}

.myui-newslist li .desc {
    text-indent: 2em;
    margin: 0;
    padding: 20px 0;
    line-height: 25px;
}

.myui-newslist__text li .title {
    margin: 0;
    font-size: 15px;
}

.myui-art__nav li {
    padding: 6px 0;
}

.myui-art__nav li.active a {
    font-weight: 700;
    color: #f90;
}

.myui-foot {
    padding: 20px 0;
}

.myui-foot p {
    color: #848484;
    margin-bottom: 0;
}

@media (max-width: 1400px) {
    .myui-header__top {
        padding: 0 20px;
    }

    .myui-header__search li.search-box {
        width: 180px;
    }

    .myui-header__menu > li {
        margin-left: 20px;
    }

    .myui-header__user > li {
        margin-left: 20px;
    }

    .myui-header__menu > li:hover .head-dropdown,
    .myui-header__user > li:hover .head-dropdown {
        display: none;
    }
}

@media (max-width: 767px) {
    .myui-panel-bg,
    .myui-vodlist__bg,
    .myui-vodlist__bg:hover {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .myui-panel__head .title,
    .myui-panel__head .title a {
        font-size: 18px;
    }

    .myui-header__top {
        padding: 0 10px;
    }

    .myui-header__search {
        width: 100%;
        margin: 0;
    }

    .myui-header__search li.search-box {
        position: relative;
        width: 100%;
        top: 0;
    }

    .myui-header__menu > li .dropdown-box {
        margin-left: -150px;
        padding-top: 0;
    }

    .myui-header__menu > li .dropdown-box .item {
        width: 300px;
    }

    .myui-header__user > li {
        margin-left: 15px;
        padding: 15px 0 10px;
    }

    .myui-header__user > li > a .fa {
        font-size: 20px;
        line-height: 20px;
    }

    .myui-header__user > li.menu .dropdown-box {
        margin-right: 0;
    }

    .myui-header__user > li.hist .dropdown-box {
        margin-right: -80px;
    }

    .myui-content__thumb .myui-vodlist__thumb {
        width: 120px;
    }

    .myui-content__thumb.active .myui-vodlist__thumb {
        width: 120px;
    }

    .myui-content__detail.active {
        width: calc(100% - 120px);
    }

    .myui-content__detail .title {
        margin: 5px 0 8px;
        font-size: 18px;
        line-height: 18px;
    }

    .myui-content__detail .data {
        margin: 0 0 10px;
        font-size: 12px;
        line-height: 18px;
        word-wrap: break-word;
        white-space: normal;
        word-break: normal;
    }

    .myui-content__detail .topline {
        padding: 5px 0;
    }

    .myui-content__thumb.actor {
        display: none;
    }

    .myui-content__detail .score {
        margin-bottom: 5px;
    }

    .myui-content__detail .score .branch {
        font-size: 16px;
    }

    .myui-content__detail .score .rating {
        top: 0;
    }

    .myui-content__detail .score .rating li {
        margin: 0;
    }

    .myui-content__detail .score .rating li .fa {
        font-size: 18px;
    }

    .myui-content__operate {
        margin-top: 20px;
        width: 100%;
        padding: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .myui-content__operate .btn {
        text-align: center;
        padding: 8px;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .myui-player {
        margin-top: 0;
    }

    .myui-player__item {
        padding: 0;
    }

    .myui-player__detail {
        margin: 0;
    }

    .myui-player__detail .data .title {
        font-size: 16px;
    }

    .myui-player__detail.detail .title {
        font-size: 18px;
    }

    .myui-player__operate li {
        margin: 0;
    }

    .myui-player__operate li .fa {
        display: block;
        margin-bottom: 5px;
        font-size: 16px;
    }

    .myui-player-links {
        top: 0;
        right: 0;
        padding: 0 10px;
    }

    .myui-player-links .btn {
        height: 35px;
        right: 8px;
    }

    .myui-newslist li .title {
        font-size: 18px;
        line-height: 30px;
    }

    .myui-art__nav li {
        display: inline-block;
        margin-right: 10px;
    }

    .myui-art__nav li.active a {
        font-weight: 700;
        color: #f90;
    }
}

.myui-panel,
.myui-panel-box {
    padding: 10px;
}

.myui-panel_hd {
    padding: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1.5;
    background-color: #151F30;
    margin-bottom: 15px;
    border-radius: 5px;
}

.myui-panel_hd_customize {
    position: relative; /* Đặt vị trí tương đối để sử dụng ::before và ::after */
    padding: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: 1.5;
    background-color: #151F30;
    margin-bottom: 15px;
    border-radius: 5px;
    color: white; /* Màu chữ */
}

.myui-panel_hd_customize::before,
.myui-panel_hd_customize::after {
    content: "";
    position: absolute;
    top: 50%; /* Đặt ở giữa theo chiều dọc */
    width: 39%; /* Chiều dài của đường thẳng */
    height: 2px; /* Độ dày của đường thẳng */
    background-color: white; /* Màu của đường thẳng */
}
@media only screen and (max-width: 767px) {
    .myui-panel_hd_customize::before,
    .myui-panel_hd_customize::after {
        width: 27%; /* Chiều dài của đường thẳng */
    }
}


.myui-panel_hd_customize::before {
    left: 0; /* Đặt bên trái */
    transform: translateY(-50%); /* Dịch lên trên một nửa chiều cao để đưa vào giữa */
}

.myui-panel_hd_customize::after {
    right: 0; /* Đặt bên phải */
    transform: translateY(-50%); /* Dịch lên trên một nửa chiều cao để đưa vào giữa */
}

/* Căn chỉnh văn bản vào giữa */
.myui-panel_hd_customize > * {
    flex: 1; /* Mở rộng chữa về toàn bộ không gian có sẵn */
    text-align: center; /* Căn chỉnh văn bản vào giữa */
}


.logo {
    height: 60px;
    line-height: 60px;
}

.nav-menu > li .sub {
    display: none;
    width: 600px;
    background: #151f30;
    overflow: hidden;
    position: absolute;
    top: 55px;
    left: 0;
    padding: 10px;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
    -ms-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
    -o-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
    z-index: 10;
}
.nav-menu > li .sub > li > a:hover {
    color: #DA966D;
}

.nav-menu > li .sub > li {
    float: left;
    width: 25%;
    line-height: 1em;
}

.nav-menu > li .sub > li > a {
    color: #fff;
    margin: 0 5px;
    padding: 10px;
    display: block;
    font-weight: normal;
}

.nav-menu > li:hover .sub {
    display: block;
}

.pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: 0.25rem;
}

.page-link,
.pagination .page-item span {
    position: relative;
    display: block;
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #007bff;
    background-color: #fff;
    border: 1px solid #dee2e6;
}


.col-md-12 {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.title2 {
    font-size: 120%;
}

.page-link:not(:disabled):not(.disabled) {
    cursor: pointer;
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}

.myui-panel__head.active {
    width: 100%;
}

#ploption {
    margin: 10px auto;
}

#player-loaded {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;
    background: #000;
    margin-top: 5px;
    margin-bottom: 5px;
}

#main-player iframe,
#main-player img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

#main-player img {
    width: 100%;
}

.loader,
.loader:before,
.loader:after {
    border-radius: 50%;
    width: 2.5em;
    height: 2.5em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: load7 1.8s infinite ease-in-out;
    animation: load7 1.8s infinite ease-in-out;
}

.loader {
    color: #28afdc;
    font-size: 10px;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
    position: absolute;
    left: 50%;
    top: 40%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.loader:before,
.loader:after {
    content: "";
    position: absolute;
    top: 0;
}

.loader:before {
    left: -3.5em;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.loader:after {
    left: 3.5em;
}

@-webkit-keyframes load7 {
    0%, 80%, 100% {
        -webkit-box-shadow: 0 2.5em 0 -1.3em;
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        -webkit-box-shadow: 0 2.5em 0 0;
        box-shadow: 0 2.5em 0 0;
    }
}

@keyframes load7 {
    0%, 80%, 100% {
        -webkit-box-shadow: 0 2.5em 0 -1.3em;
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        -webkit-box-shadow: 0 2.5em 0 0;
        box-shadow: 0 2.5em 0 0;
    }
}

::-webkit-input-placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #333;
    opacity: 1;
    /* Firefox */
}

::-moz-placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #333;
    opacity: 1;
    /* Firefox */
}

:-ms-input-placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #333;
    opacity: 1;
    /* Firefox */
}

::-ms-input-placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #333;
    opacity: 1;
    /* Firefox */
}

::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #333;
    opacity: 1;
    /* Firefox */
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #333;
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #333;
}

.myui-panel-box.active {
    margin: -10px;
}

a,
h1,
h2,
h3,
h4,
h5,
h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    color: #ddd;
}

a:hover {
    color: #da966e;
}

a.disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.text-333 {
    color: #333;
}

.text-muted {
    color: #fff;
}

.text-red {
    color: red;
}

.text-link {
    color: blue;
}

.text-fff {
    color: #fff;
}

.form-control {
    background-color: #ffffff;
    color: #999;
    border: 1px solid #eee;
}

.form-control:focus {
    border-color: #f90;
    -webkit-box-shadow: inset 0 1px 1px rgba(255, 136, 0, 0.075), 0 0 8px rgba(255, 136, 0, 0.6);
}

.btn-default {
    background-color: #eee;
    color: #333;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #eeeeee), to(#f6f6f6));
    background: linear-gradient(to right, #eeeeee 0, #f6f6f6 100%);
    -webkit-box-shadow: 0 5px 10px rgba(246, 246, 246, 0.25);
    box-shadow: 0 5px 10px rgba(246, 246, 246, 0.25);
}

.btn-warm {
    background-color: #f90;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #ff9900), to(#ff9f16));
    background: linear-gradient(to right, #ff9900 0, #ff9f16 100%);
    -webkit-box-shadow: 0 5px 10px rgba(255, 111, 0, 0.25);
    box-shadow: 0 5px 10px rgba(255, 111, 0, 0.25);
}

.btn-primary {
    background-color: #4fb1f7;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #4fb1f7), to(#6bb8ee));
    background: linear-gradient(to right, #4fb1f7 0, #6bb8ee 100%);
    -webkit-box-shadow: 0 5px 10px rgba(107, 184, 238, 0.25);
    box-shadow: 0 5px 10px rgba(107, 184, 238, 0.25);
}

.btn-danger {
    background-color: #fc000c;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #fc000c), to(#f9444d));
    background: linear-gradient(to right, #fc000c 0, #f9444d 100%);
    -webkit-box-shadow: 0 5px 10px rgba(249, 68, 77, 0.25);
    box-shadow: 0 5px 10px rgba(249, 68, 77, 0.25);
}

.btn-info {
    background-color: #5bc0de;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #5bc0de), to(#7cc1d6));
    background: linear-gradient(to right, #5bc0de 0, #7cc1d6 100%);
    -webkit-box-shadow: 0 5px 10px rgba(124, 193, 214, 0.25);
    box-shadow: 0 5px 10px rgba(124, 193, 214, 0.25);
}

.btn-gray {
    background-color: #282828;
    color: #ddd;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #282828), to(#3b3b3b));
    background: linear-gradient(to right, #282828 0, #3b3b3b 100%);
    -webkit-box-shadow: 0 5px 10px rgba(59, 59, 59, 0.25);
    box-shadow: 0 5px 10px rgba(59, 59, 59, 0.25);
}

.btn-warm,
.btn-primary,
.btn-danger,
.btn-info {
    color: #fff;
}

.btn-warm:hover,
.btn-primary:hover,
.btn-danger:hover,
.btn-info:hover,
.btn-gray:hover {
    color: #fff;
}

.btn.disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.border {
    border-color: #383737;
}

.border-primary {
    border-color: #4fb1f7;
}

.border-danger {
    border-color: red;
}

.border-info {
    border-color: #5bc0de;
}

.spot {
    border-color: #f90;
}

.split-line {
    background-color: #383737;
}

.top-line:before,
.bottom-line:after,
.top-line-dot:before,
.bottom-line-dot:before {
    border-color: #383737;
}

.dropdown-box .item {
    background-color: #fff;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.pic-tag.active,
.pic-tag-h {
    background-color: #f90;
    color: #fff;
}

.pic-text,
.pic-title-bottom {
    background-repeat: no-repeat;
    background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.5)));
    background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.5));
    color: #fff;
}

.pic-text.active {
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
}

.pic-title-top {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0)));
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
    color: #fff;
}

.myui-link__pic li img {
    display: block;
    padding: 2px 6px;
    border-radius: 4px;
    background-color: #fff;
}

.nav li.active a {
    border-color: #f90;
    color: #f90;
}

.nav-tabs li .dropdown-box .item li a {
    color: #333;
}

.nav-tabs li .dropdown-box .item li.active a {
    color: #f90;
}

.myui-panel-bg {
    background-color: #121625;
}

.myui-panel-bg2 {
    background-color: #272727;
}

.myui-vodlist__bg {
    background-color: #f5f5f5;
}

.myui-vodlist__bg:hover {
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.08);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.08);
}

.myui-vodlist__text.striped .striped-head,
.myui-vodlist__text.to-color li:nth-of-type(odd) {
    background-color: #272727;
}

.myui-table > thead > tr > th,
.myui-table > tbody > tr > td,
.myui-table > tbody > tr > th,
.myui-table > tfoot > tr > td,
.myui-table > tfoot > tr > th,
.myui-table > thead > tr > td,
.myui-table > thead > tr > th {
    border-color: #ddd;
}

.myui-content__list::-webkit-scrollbar,
.myui-playdown__list::-webkit-scrollbar {
    width: 4px;
    background-color: #f5f5f5;
}

.myui-content__list::-webkit-scrollbar-thumb,
.myui-playdown__list::-webkit-scrollbar-thumb {
    background-color: #ccc;
}

.myui-player__video {
    background-color: #000;
}

.myui-player__operate > li > a {
    color: #999;
}

.popup {
    background-color: #f8f8f8;
}

.popup-head {
    background-color: #fff;
}

.myui-content__detail .score .rating li .fa,
.myui-content__detail .score .branch {
    color: #f90;
}

.flickity-page-dots .dot {
    background-color: #f90;
}

.carousel-indicators-dots li {
    background-color: #f90;
}

.carousel-indicators-text li.active .title {
    color: red;
}

.carousel-indicators-thumb li.active {
    border: 3px solid #f90;
}

.myui-extra li a {
    background-color: #272727;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

.myui-extra li a.backtop {
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
}

.autocomplete-suggestions {
    background-color: #fff;
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.autocomplete-suggestion,
.autocomplete-suggestions li,
.autocomplete-suggestion,
.autocomplete-suggestions li a {
    color: #333;
}

.autocomplete-suggestions li strong {
    color: red;
}

.myui-nav__tabbar {
    background-color: #f8f8f8;
    border-color: #eee;
}

.myui-nav__tabbar .item .title {
    color: #999;
}

.myui-foot {
    border-top: 1px solid #2d2d2d;
    padding: 30px 0;
}

.text-logo {
    font-size: 1.5em;
    text-transform: uppercase;
    color: #fff !important;
}

.text-logo b {
    font-size: 1.5em;
    font-weight: 700;
}

[class*=col-],
.myui-content__list li,
.myui-vodlist__media.col li {
    padding: 10px;
}

.btn {
    border-radius: 5px;
}

.myui-vodlist__box {
    position: relative;
}

.myui-vodlist__thumb {
    padding-top: 150%;
    background: url(https://ae01.alicdn.com/kf/Ufe6157eb158e4f7d8a268d830bc7b512m.gif) no-repeat;
}

.myui-vodlist__thumb.square {
    padding-top: 100%;
    background: url(https://tva1.sinaimg.cn/large/007X8olVly1g7jy68sr1kg30dc0a03yg.jpg) no-repeat;
}

.myui-vodlist__thumb.wide {
    padding-top: 60%;
    background: url(https://ae01.alicdn.com/kf/Ufe6157eb158e4f7d8a268d830bc7b512m.gif) no-repeat;
}

.myui-vodlist__thumb.actor {
    padding-top: 140%;
}

.myui-panel {
    margin-bottom: 20px;
}

.myui-panel.detail-bl {
    margin-top: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.myui-panel-mb {
    margin-bottom: 20px;
}

.myui-player__item .fixed {
    width: 500px;
}

.myui-vodlist__text li a,
.myui-vodlist__media li {
    padding: 10px 0;
}

.myui-screen__list {
    padding: 10px 10px 0;
}

.myui-screen__list li {
    margin-bottom: 10px;
    margin-right: 10px;
}

.myui-page {
    padding: 0 10px;
}

.myui-extra {
    right: 20px;
    bottom: 30px;
}

.myui-media-info {
    background: #222;
    padding: 10px;
}

.info-block h6 {
    color: #bbb;
    font-size: 12px;
    font-weight: bold;
}

.info-block h6 span {
    font-weight: normal;
}

.info-block h6 span.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #777;
    border-radius: 0px;
}

@media (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }

    .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .container.min {
        width: 1200px;
        padding: 0;
    }

    .info-block {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .info-block h6 {
        -webkit-box-flex: 0;
        -ms-flex: 5;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    body,
    body.active {
        padding-bottom: 50px;
    }

    [class*=col-],
    .myui-panel,
    .myui-content__list li {
        padding: 5px;
    }

    .flickity-prev-next-button.previous {
        left: 5px;
    }

    .flickity-prev-next-button.next {
        right: 5px;
    }

    .myui-vodlist__text li a,
    .myui-vodlist__media li {
        padding: 10px 0;
    }

    .myui-screen__list {
        padding: 10px 5px 0;
    }

    .myui-screen__list li {
        margin-bottom: 5px;
        margin-right: 5px;
    }

    .myui-extra {
        right: 20px;
        bottom: 80px;
    }

    .myui-page {
        padding: 0 5px;
    }

    .mr-sm-10 {
        margin-left: 10px;
    }

    .myui_custom_header {
        padding: 0;
    }
}

.myui-topbg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
}

.block-comments {
    margin: 10px 0px 0px;
}

.page-single {
    padding: 10px;
    width: 670px;
}

.block-wrapper {
    position: relative;
    padding: 2px;
    background: #fff;
    border-bottom: 1px solid #868489;
    color: #ddd;
    height: auto;
    display: block;
}

#player img {
    width: 100%;
}

.tag-list h3 {
    display: inline;
    font-size: 13px;
    border: 1px solid #999;
    padding: 5px 10px;
    display: inline-block;
    margin-right: 10px;
    border-radius: 2px;
    margin-top: 0;
    line-height: 1;
}

.tag-list h3 a {
    color: #999 !important;
}

.myui-header__top .mobile-control {
    display: none;
}

@media screen and (max-width: 800px) {
    .myui-header__menu > li {
        width: 100%;
        margin-left: 0;
    }

    .myui-header__menu.nav-menu > li .sub > li {
        width: 33.33%;
    }

    .myui-header__menu > li > a {
        line-height: 32px;
    }

    .nav-menu > li .sub > li > a {
        color: #000;
    }

    .myui-header__menu.nav-menu > li .sub {
        position: static;
        display: block;
        width: auto !important;
        border-radius: 10px;
        background: #fff;
        padding-left: 0;
        padding-right: 0;
    }

    .myui-header__top .mobile-control {
        display: block;
    }

    .detail-bl.myui-panel.col-pd .myui-content__thumb {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 30%;
        flex: 0 0 30%;
        max-width: 30%;
    }

    .detail-bl.myui-panel .myui-content__detail {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 70%;
        flex: 0 0 70%;
        max-width: 70%;
    }

    .rating-block {
        text-align: center;
    }

    .menu-block.show,
    .myui-header__search.show {
        display: block;
    }

    .menu-block,
    .myui-header__search {
        display: none;
    }

    .myui-top-movies.even .myui-block-header {
        padding: 0 10px;
    }

    .myui-header__search {
        border-top: 0;
        position: absolute;
        bottom: 0;
        top: 55px;
        z-index: 2;
    }

    .myui-header__top {
        height: auto;
        background-position-x: -50px;
        background-repeat: no-repeat;
        -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
        box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
        position: relative;
    }

    #box-user-menu {
        display: none;
    }

    .myui-header__logo {
        margin: 0 auto;
    }

    .myui-header__logo .logo {
        height: 50px;
        width: 120px;
        background-position: center center;
    }

    body.active {
        padding-top: 0px;
    }

    .myui-header__top .mobile-control {
        position: absolute;
        right: 0px;
        top: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        height: 100%;
    }

    .nav__content {
        border: none;
    }

    .myui-header__top .mobile-control > div {
        height: 40px;
        width: 40px;
        cursor: pointer;
        background: #000;
        margin-right: 1px;
        color: #fff;
        border-radius: 4px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .myui-header__top .mobile-control > div:hover {
        background: #111;
    }

    .movie-eps-wrapper {
        max-height: 500px;
    }

    .movie-server-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .server-option {
        margin: 15px;
    }

    .movie-eps-all {
        border-left: none;
    }

    .video-p-first {
        padding: 0 10px;
    }

    .video-p-first .cc-warning, .video-p-first .myui-player__notice {
        max-width: 100%;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    }
}

.filter-box .form-control {
    padding: 0.25rem 0.75rem;
    border-radius: 0;
    -webkit-appearance: auto;
    background: #383838;
    border: 1px solid #383838;
    color: #fafafa;
    font-size: 14px;
}

.btn-submit {
    padding: 5.5px 8px;
    font-size: 12px;
    font-weight: bold;
    background: #666;
    color: #fff;
    border: none;
    outline: none;
    border-radius: 0;
}

.filter-box .row {
    margin-left: -5px;
    margin-right: -5px;
}

.filter-box .col-lg-2 {
    padding-left: 5px;
    padding-right: 5px;
}

.myui-panel__head.height-auto {
    height: auto;
}

a.btn.btn-default.active {
    background: #dd003f;
    color: #fff;
}

@media only screen and (max-width: 767px) {
    .fb-comments {
        width: 100% !important;
    }

    .fb-comments iframe[style] {
        width: 100% !important;
    }

    .fb-like-box {
        width: 100% !important;
    }

    .fb-like-box iframe[style] {
        width: 100% !important;
    }

    .fb-comments span {
        width: 100% !important;
    }

    .fb-comments iframe span[style] {
        width: 100% !important;
    }

    .fb-like-box span {
        width: 100% !important;
    }

    .fb-like-box iframe span[style] {
        width: 100% !important;
    }
}

.fb-comments, .fb-comments span {
    background-color: #eee;
}

.fb-comments {
    margin-bottom: 20px;
}

@media (max-width: 767px) {
    .filter-box .col-lg-2 {
        margin-bottom: 10px;
    }

    #playerLoaded iframe,
    .loadingData {
        height: 220px;
    }

    .filter-box .col-xs-6 {
        width: 50%;
    }
}

.m-nav-open {
    display: none;
}

@media all and (max-width: 812px) {
    .main-nav {
        display: none;
    }

    .m-nav-open {
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        border: none;
        background: none;
        padding: 0;
        cursor: pointer;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .m-nav-open svg {
        width: 40px;
        height: 40px;
    }
}

@media all and (max-width: 767px) {
    .m-nav-open {
        position: absolute;
        left: 5px;
        top: 5px;
    }
}

.acd-drop:after {
    content: "+";
}

.acd-drop.active:after {
    content: "−";
}

@media all and (min-width: 992px) {
    .m-nav, .m-nav-over {
        display: none !important;
    }
}

@media all and (max-width: 812px) {
    .m-nav-over {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 998;
        background: rgba(0, 0, 0, 0.5);
        -webkit-transition: all 0.15s ease-in-out;
        transition: all 0.15s ease-in-out;
    }

    .m-nav {
        display: block;
        position: fixed;
        top: 0;
        width: 280px;
        bottom: 0;
        z-index: 999;
        color: rgba(255, 255, 255, 0.75);
        background: #151F30;
        -webkit-transition: all 0.15s ease-in-out;
        transition: all 0.15s ease-in-out;
        left: -280px;
    }

    .m-nav.active {
        -webkit-box-shadow: 0 0 6px 0 rgba(255, 255, 255, 0.15);
        box-shadow: 0 0 6px 0 rgba(255, 255, 255, 0.15);
        left: 0;
    }

    .m-nav.active .m-nav-close {
        visibility: visible;
        opacity: 1;
    }

    .m-nav .m-nav-close {
        position: absolute;
        top: 0;
        width: 40px;
        height: 40px;
        left: 99%;
        background: #151F30;
        outline: none;
        color: white;
        font-size: 28px;
        cursor: pointer;
        -webkit-transition: inherit;
        transition: inherit;
        opacity: 0;
        visibility: hidden;
        border: 0.5px solid white;
    }

    .m-nav .nav-ct {
        height: 100%;
        overflow: auto;
    }

    .m-nav .nav-ct label {
        display: block;
        padding: 15px 15px 15px 65px;
        position: relative;
        border-bottom: solid 1px #444;
    }

    .m-nav .nav-ct label i {
        position: absolute;
        left: 18px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        margin-top: 1px;
    }

    .m-nav .nav-ct label span {
        color: #fff;
    }

    .m-nav ul a {
        display: block;
        font-size: 14px;
        font-family: arial;
        line-height: 20px;
        padding: 10px 15px 10px 18px;
        border-top: solid 1px #444;
    }

    .m-nav ul a:hover, .m-nav ul a.active {
        color: red;
    }

    .m-nav ul ul {
        background: rgba(255, 255, 255, 0.04);
        display: none;
    }

    .m-nav ul ul a {
        padding-left: 36px;
    }

    .m-nav ul ul ul a {
        padding-left: 54px;
    }

    .m-nav .acd-drop {
        width: 40px;
        height: 40px;
        float: right;
        position: relative;
        z-index: 1;
        font-size: 20px;
        color: inherit;
        font-family: monospace;
        outline: none;
        cursor: pointer;
        border-left: solid 1px #444;
        background: rgba(255, 255, 255, 0.04);
    }

    .m-nav svg {
        display: none;
    }
}

.leaderboard-card:hover h3, .leaderboard-card.active h3 {
    color: #e7e805;
}

.leaderboard-card-title h3 {
    font-size: 13px;
    color: #eee;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
.leaderboard-card-left svg {
    min-height: 16px;
    min-width: 16px;
    fill: #dda;
    transition: fill .5s;
}
.leaderboard {
    border-radius: 15px
}

.leaderboard-title {
    color: #fff;
    margin: 0;
    font-size: 18px;
    margin-top: 2px
}

.leaderboard li:first-child {
    border-radius: 15px 15px 0 0;
    overflow: hidden
}

.leaderboard li:last-child {
    border-radius: 0 0 15px 15px;
    overflow: hidden
}

.leaderboard-card {
    background: #151f3075;
    padding: 15px;
    margin-top: 5px;
    position: relative
}

.leaderboard-card-entry {
    display: flex;
    align-items: center
}

.leaderboard-card-left {
    position: relative;
    color: #dda;
    display: flex;
    align-items: flex-start;
    font-size: 12px;
    padding-right: 8px;
    padding-top: 2px;
    margin-right: 8px
}

.leaderboard-card-left::after {
    content: "";
    width: 1px;
    background: #ccc;
    height: 1rem;
    position: absolute;
    right: 0;
    top: 2px
}

.leaderboard-card-left span {
    font-weight: 600
}

.leaderboard-card-title {
    overflow: hidden
}

.leaderboard-card .card__add {
    position: relative;
    right: 0;
    top: 0;
    opacity: 1;
    pointer-events: auto
}

.leaderboard-card-title h3 {
    font-size: 13px;
    color: #eee;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0
}


.leaderboard-card-detail {
    display: flex;
    width: 100%;
    color: #ddd;
    font-size: 12px
}

.leaderboard-card-detail h4 {
    margin: 0;
    font-weight: 600
}

.leaderboard-card-detail img {
    height: 100px;
    max-width: 70px;
    width: 64px;
    object-fit: cover;
    border-radius: 10px;
    margin: 5px 10px 0 0
}

.leaderboard-card-content {
    font-size: 13px;
    margin-left: 5px;
    padding-top: 2px;
}

.leaderboard-card-desc {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-size: 13px
}

.leaderboard-rating {
    display: flex;
    position: relative;
    background: 0 0;
    height: 100%;
    transform: scale(.9);
    padding: 0;
    justify-content: left;
    align-items: center
}

.leaderboard-card:hover h3, .leaderboard-card.active h3 {
    color: #e7e805
}

.leaderboard-card:hover .leaderboard-card-detail, .leaderboard-card.active .leaderboard-card-detail {
    display: flex
}

.leaderboard-rank {
    position: absolute;
    color: #fff;
    font-size: 12px;
    border-bottom: 25px solid #b714c1d6;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    left: -16px;
    top: -3px;
    border-radius: 5px;
    -webkit-transform: rotate(-45deg)
}

.leaderboard-rank > span {
    position: absolute;
    font-weight: 700;
    top: 4.5px;
    left: -8.5px;
    -webkit-transform: rotate(45deg)
}

.leaderboard li:nth-child(1) .leaderboard-rank {
    border-bottom-color: #db8212d6
}

.leaderboard li:nth-child(2) .leaderboard-rank {
    border-bottom-color: #06b9b1d6
}

.leaderboard li:nth-child(3) .leaderboard-rank {
    border-bottom-color: #870920d6
}

.leaderboard li:nth-child(n+10) .leaderboard-rank > span {
    left: -12px
}

.overlay {
    padding-top: 30px;
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    backdrop-filter: blur(1px);
    z-index: 50
}

.list-film.leaderboard {
    max-height: 500px;
    overflow-y: auto;
}

@media (min-width: 992px) {
    .sticky-leaderboard {
        height: auto;
        position: sticky;
        top: 60px
    }

    .sticky-leaderboard .leaderboard {
        height: calc(100vh - 200px);
        overflow: auto;
        margin-top: 5px
    }

    .board-box {
        background: unset
    }

    .leaderboard::-webkit-scrollbar-thumb {
        background-color: #2f80ed;
        outline: 1px solid #151f30
    }

    .leaderboard::-webkit-scrollbar-track {
        background: #151f30
    }

    .leaderboard::-webkit-scrollbar {
        width: 3px
    }

    .leaderboard-card-detail {
        display: none
    }
}

.thumb_custom {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 7px;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
.img-xs-custom {
    width: 100%;
    height: 100%;
}

/*Slider Recommended*/
.pack_yk_pack,.pack_yk_pack_focus,.pack_yk_pack_v {
    position: relative;
    text-align: left
}

.pack_yk_pack .pack_pack_reserve,.pack_yk_pack_focus .pack_pack_reserve,.pack_yk_pack_v .pack_pack_reserve {
    position: relative;
    margin-bottom: 16px;
    min-height: 30px;
    text-align: center
}

.pack_yk_pack .pack_pack_reserve p,.pack_yk_pack_focus .pack_pack_reserve p,.pack_yk_pack_v .pack_pack_reserve p {
    position: relative;
    z-index: 20;
    display: inline-block;
    padding: 0 10px;
    height: 30px;
    color: hsla(0,0%,100%,.87);
    background: var(--bg-color);
    text-align: center;
    font-size: 16px;
    line-height: 30px
}

.pack_yk_pack .pack_pack_reserve:after,.pack_yk_pack_focus .pack_pack_reserve:after,.pack_yk_pack_v .pack_pack_reserve:after {
    content: "";
    width: calc(100% + 12px);
    height: 1px;
    background: hsla(0,0%,100%,.87);
    opacity: .2;
    position: absolute;
    left: 0;
    top: 15px;
    z-index: 10
}

.pack_yk_pack .pack_pack_ad,.pack_yk_pack_focus .pack_pack_ad,.pack_yk_pack_v .pack_pack_ad {
    display: block;
    height: 18px;
    line-height: 18px;
    padding: 1px 6px;
    background-color: rgba(0,0,0,.6);
    font-size: 12px;
    color: #fff;
    border-radius: 0 10px 0 10px
}

.pack_yk_pack .pack_vip_cover,.pack_yk_pack_focus .pack_vip_cover,.pack_yk_pack_v .pack_vip_cover {
    position: relative;
    padding-top: 55.74%;
    border-radius: 7px;
    background: #25252b;
    overflow: hidden
}

.pack_yk_pack .pack_vip_cover:hover,.pack_yk_pack_focus .pack_vip_cover:hover,.pack_yk_pack_v .pack_vip_cover:hover {
    box-shadow: 0 2px 6px 0 rgba(0,0,0,.4)
}

.pack_yk_pack .pack_vip_cover:hover img,.pack_yk_pack_focus .pack_vip_cover:hover img,.pack_yk_pack_v .pack_vip_cover:hover img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.pack_yk_pack .pack_vip_cover .pack_pack_preview:hover,.pack_yk_pack_focus .pack_vip_cover .pack_pack_preview:hover,.pack_yk_pack_v .pack_vip_cover .pack_pack_preview:hover {
    box-shadow: none
}

.pack_yk_pack .pack_vip_cover .pack_pack_preview:hover img,.pack_yk_pack_focus .pack_vip_cover .pack_pack_preview:hover img,.pack_yk_pack_v .pack_vip_cover .pack_pack_preview:hover img {
    -webkit-transform: none;
    transform: none
}

.pack_yk_pack .pack_vip_cover a,.pack_yk_pack_focus .pack_vip_cover a,.pack_yk_pack_v .pack_vip_cover a {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    text-decoration: none;
    color: #fff;
    z-index: 2
}

.pack_yk_pack .pack_vip_cover a .pack_rank_img,.pack_yk_pack_focus .pack_vip_cover a .pack_rank_img,.pack_yk_pack_v .pack_vip_cover a .pack_rank_img {
    width: 36px;
    height: 45px;
    position: absolute;
    left: 0;
    top: 0
}

.pack_yk_pack .pack_vip_cover a img,.pack_yk_pack_focus .pack_vip_cover a img,.pack_yk_pack_v .pack_vip_cover a img {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 7px;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out
}

.pack_yk_pack .pack_vip_cover a .pack_pack_watermark,.pack_yk_pack_focus .pack_vip_cover a .pack_pack_watermark,.pack_yk_pack_v .pack_vip_cover a .pack_pack_watermark {
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scale(.4);
    transform: scale(.4);
    border-radius: 0
}

.pack_yk_pack .pack_vip_cover .pack_bg,.pack_yk_pack_focus .pack_vip_cover .pack_bg,.pack_yk_pack_v .pack_vip_cover .pack_bg {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 44px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAACEBAMAAABWuNdhAAAAG1BMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACUUeIgAAAACXRSTlMtI0gRGjY/CAI+vRAXAAAA/UlEQVQoz62IMW7FIBAFHwU9SD4BBRfAkmsLDkBjHwDJXIDCvgE5dnY3345iKZG/lCl2dh4+BDzR8aqDQO9S/dh779gFUt+P/bv+VNsntNZeNU1S1GjT1FrAFNrXSE9DCC0EHgMlFfOGYghjiAgxxjFgvCqNEYm2MSGmRB/SyCAJMpLSuxqEWw0zMcAy8zlKWdh5sLO96rGMVdZQ8VWwxnApZbgUHWVgICiBS3EaQ4vs+MEtfyEDmk/OWfN7FaXOi9YL6C45g67WGotAY2a96rk24VYrs6Ey6zlKVdR1q2u96rFK9VK+eu9RSpEqhcu7UpyHYxcq75w7ywn/qk8K78I4GfQ69gAAAABJRU5ErkJggg==") repeat-x;
    border-radius: 0 0 4px 4px;
    z-index: 10
}

.pack_yk_pack .pack_vip_cover .pack_pack_rank,.pack_yk_pack_focus .pack_vip_cover .pack_pack_rank,.pack_yk_pack_v .pack_vip_cover .pack_pack_rank {
    position: relative;
    top: -12px;
    display: inline-block;
    width: 34px;
    height: 24px;
    background: url(https://img.alicdn.com/tfs/TB1Jj0bypzqK1RjSZFvXXcB7VXa-68-48.png) 0 0;
    background-size: 100%;
    line-height: 20px;
    text-align: center
}

.pack_yk_pack .pack_vip_cover .pack_pack_score,.pack_yk_pack_focus .pack_vip_cover .pack_pack_score,.pack_yk_pack_v .pack_vip_cover .pack_pack_score {
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    color: #61f6ff;
    font-weight: 700;
    text-align: right
}

.pack_yk_pack .pack_vip_cover .pack_pack_tag,.pack_yk_pack_focus .pack_vip_cover .pack_pack_tag,.pack_yk_pack_v .pack_vip_cover .pack_pack_tag {
    height: 18px;
    line-height: 18px;
    padding: 0 4px;
    border-radius: 0 7px 0 7px;
    background: #03c8d4;
    display: block
}

.pack_yk_pack .pack_vip_cover .pack_pack_tag .pack_tagtext,.pack_yk_pack_focus .pack_vip_cover .pack_pack_tag .pack_tagtext,.pack_yk_pack_v .pack_vip_cover .pack_pack_tag .pack_tagtext {
    display: inline-block;
    font-size: 12px;
    -webkit-transform: scale(.917);
    transform: scale(.917);
    vertical-align: text-bottom
}

.pack_yk_pack .pack_vip_cover .pack_tag_vip,.pack_yk_pack_focus .pack_vip_cover .pack_tag_vip,.pack_yk_pack_v .pack_vip_cover .pack_tag_vip {
    background: ;
    color: #4e2d03
}

.pack_yk_pack .pack_vip_cover .pack_tag_red,.pack_yk_pack_focus .pack_vip_cover .pack_tag_red,.pack_yk_pack_v .pack_vip_cover .pack_tag_red {
    background: #ff008c
}

.pack_yk_pack .pack_vip_cover .pack_tag_gray,.pack_yk_pack_focus .pack_vip_cover .pack_tag_gray,.pack_yk_pack_v .pack_vip_cover .pack_tag_gray {
    background: rgba(0,0,0,.6)
}

.pack_yk_pack .pack_vip_cover .pack_tag_svip,.pack_yk_pack_focus .pack_vip_cover .pack_tag_svip,.pack_yk_pack_v .pack_vip_cover .pack_tag_svip {
    background-image: -webkit-linear-gradient(210deg,#ffde9e,#f19dc7 75%,#b499ff);
    background-image: linear-gradient(240deg,#ffde9e,#f19dc7 75%,#b499ff);
    color: #4d0819
}

.pack_yk_pack .pack_vip_cover .pack_p_icon,.pack_yk_pack_focus .pack_vip_cover .pack_p_icon,.pack_yk_pack_v .pack_vip_cover .pack_p_icon {
    display: inline-block;
    vertical-align: text-bottom;
    font-size: 12px
}

.pack_yk_pack .pack_pack_cover,.pack_yk_pack_focus .pack_pack_cover,.pack_yk_pack_v .pack_pack_cover {
    position: relative;
    padding-top: 55.74%;
    border-radius: 10px;
    background: #25252b;
    overflow: hidden
}

.pack_yk_pack .pack_pack_cover:hover,.pack_yk_pack_focus .pack_pack_cover:hover,.pack_yk_pack_v .pack_pack_cover:hover {
    box-shadow: 0 2px 6px 0 rgba(0,0,0,.4)
}

.pack_yk_pack .pack_pack_cover:hover img,.pack_yk_pack_focus .pack_pack_cover:hover img,.pack_yk_pack_v .pack_pack_cover:hover img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.pack_yk_pack .pack_pack_cover .pack_pack_preview:hover,.pack_yk_pack_focus .pack_pack_cover .pack_pack_preview:hover,.pack_yk_pack_v .pack_pack_cover .pack_pack_preview:hover {
    box-shadow: none
}

.pack_yk_pack .pack_pack_cover .pack_pack_preview:hover img,.pack_yk_pack_focus .pack_pack_cover .pack_pack_preview:hover img,.pack_yk_pack_v .pack_pack_cover .pack_pack_preview:hover img {
    -webkit-transform: none;
    transform: none
}

.pack_yk_pack .pack_pack_cover a,.pack_yk_pack_focus .pack_pack_cover a,.pack_yk_pack_v .pack_pack_cover a {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    text-decoration: none;
    color: #fff;
    z-index: 2
}

.pack_yk_pack .pack_pack_cover a .pack_rank_img,.pack_yk_pack_focus .pack_pack_cover a .pack_rank_img,.pack_yk_pack_v .pack_pack_cover a .pack_rank_img {
    width: 36px;
    height: 45px;
    position: absolute;
    left: 0;
    top: 0
}

.pack_yk_pack .pack_pack_cover a img,.pack_yk_pack_focus .pack_pack_cover a img,.pack_yk_pack_v .pack_pack_cover a img {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 7px;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out
}

.pack_yk_pack .pack_pack_cover a .pack_pack_watermark,.pack_yk_pack_focus .pack_pack_cover a .pack_pack_watermark,.pack_yk_pack_v .pack_pack_cover a .pack_pack_watermark {
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scale(.4);
    transform: scale(.4);
    border-radius: 0
}

.pack_yk_pack .pack_pack_cover a .pack_pack_horizontalrankinvolved,.pack_yk_pack_focus .pack_pack_cover a .pack_pack_horizontalrankinvolved,.pack_yk_pack_v .pack_pack_cover a .pack_pack_horizontalrankinvolved {
    width: 100%;
    height: 70px;
    background-image: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(transparent));
    background-image: -webkit-linear-gradient(bottom,rgba(0,0,0,.5),transparent);
    background-image: linear-gradient(0deg,rgba(0,0,0,.5),transparent);
    border-radius: 0 0 10px 10px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2
}

.pack_yk_pack .pack_pack_cover a .pack_pack_horizontalrankinvolved span,.pack_yk_pack_focus .pack_pack_cover a .pack_pack_horizontalrankinvolved span,.pack_yk_pack_v .pack_pack_cover a .pack_pack_horizontalrankinvolved span {
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(hsla(0,0%,100%,0)));
    background-image: -webkit-linear-gradient(top,#fff,hsla(0,0%,100%,0));
    background-image: linear-gradient(180deg,#fff,hsla(0,0%,100%,0));
    -webkit-background-clip: text;
    color: transparent;
    font-size: 135px;
    height: 100px;
    line-height: 110px;
    font-family: Akrobat-ExtraBold;
    font-weight: 900
}

.pack_yk_pack .pack_pack_cover a .pack_pack_horizontalrankinvolved .pack_svgbox,.pack_yk_pack_focus .pack_pack_cover a .pack_pack_horizontalrankinvolved .pack_svgbox,.pack_yk_pack_v .pack_pack_cover a .pack_pack_horizontalrankinvolved .pack_svgbox {
    position: absolute;
    bottom: 0;
    left: 0
}

.pack_yk_pack .pack_pack_cover a .pack_pack_horizontalrankinvolved1,.pack_yk_pack_focus .pack_pack_cover a .pack_pack_horizontalrankinvolved1,.pack_yk_pack_v .pack_pack_cover a .pack_pack_horizontalrankinvolved1 {
    background-image: -webkit-gradient(linear,left bottom,left top,from(rgba(254,0,140,.5)),to(transparent));
    background-image: -webkit-linear-gradient(bottom,rgba(254,0,140,.5),transparent);
    background-image: linear-gradient(0deg,rgba(254,0,140,.5),transparent)
}

.pack_yk_pack .pack_pack_cover a .pack_pack_horizontalrankinvolved2,.pack_yk_pack_focus .pack_pack_cover a .pack_pack_horizontalrankinvolved2,.pack_yk_pack_v .pack_pack_cover a .pack_pack_horizontalrankinvolved2 {
    background-image: -webkit-gradient(linear,left bottom,left top,from(rgba(255,78,51,.5)),to(transparent));
    background-image: -webkit-linear-gradient(bottom,rgba(255,78,51,.5),transparent);
    background-image: linear-gradient(0deg,rgba(255,78,51,.5),transparent)
}

.pack_yk_pack .pack_pack_cover a .pack_pack_horizontalrankinvolved3,.pack_yk_pack_focus .pack_pack_cover a .pack_pack_horizontalrankinvolved3,.pack_yk_pack_v .pack_pack_cover a .pack_pack_horizontalrankinvolved3 {
    background-image: -webkit-gradient(linear,left bottom,left top,from(rgba(247,140,0,.5)),to(transparent));
    background-image: -webkit-linear-gradient(bottom,rgba(247,140,0,.5),transparent);
    background-image: linear-gradient(0deg,rgba(247,140,0,.5),transparent)
}

.pack_yk_pack .pack_pack_cover .pack_bg,.pack_yk_pack_focus .pack_pack_cover .pack_bg,.pack_yk_pack_v .pack_pack_cover .pack_bg {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 44px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAACEBAMAAABWuNdhAAAAG1BMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACUUeIgAAAACXRSTlMtI0gRGjY/CAI+vRAXAAAA/UlEQVQoz62IMW7FIBAFHwU9SD4BBRfAkmsLDkBjHwDJXIDCvgE5dnY3345iKZG/lCl2dh4+BDzR8aqDQO9S/dh779gFUt+P/bv+VNsntNZeNU1S1GjT1FrAFNrXSE9DCC0EHgMlFfOGYghjiAgxxjFgvCqNEYm2MSGmRB/SyCAJMpLSuxqEWw0zMcAy8zlKWdh5sLO96rGMVdZQ8VWwxnApZbgUHWVgICiBS3EaQ4vs+MEtfyEDmk/OWfN7FaXOi9YL6C45g67WGotAY2a96rk24VYrs6Ey6zlKVdR1q2u96rFK9VK+eu9RSpEqhcu7UpyHYxcq75w7ywn/qk8K78I4GfQ69gAAAABJRU5ErkJggg==") repeat-x;
    border-radius: 0 0 4px 4px;
    z-index: 10
}

.pack_yk_pack .pack_pack_cover .pack_pack_rank,.pack_yk_pack_focus .pack_pack_cover .pack_pack_rank,.pack_yk_pack_v .pack_pack_cover .pack_pack_rank {
    position: relative;
    top: -12px;
    display: inline-block;
    width: 34px;
    height: 24px;
    background: url(https://img.alicdn.com/tfs/TB1Jj0bypzqK1RjSZFvXXcB7VXa-68-48.png) 0 0;
    background-size: 100%;
    line-height: 20px;
    text-align: center
}

.pack_yk_pack .pack_pack_cover .pack_pack_score,.pack_yk_pack_focus .pack_pack_cover .pack_pack_score,.pack_yk_pack_v .pack_pack_cover .pack_pack_score {
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    color: #61f6ff;
    font-weight: 700;
    text-align: right
}

.pack_yk_pack .pack_pack_cover .pack_pack_tag,.pack_yk_pack_focus .pack_pack_cover .pack_pack_tag,.pack_yk_pack_v .pack_pack_cover .pack_pack_tag {
    height: 18px;
    line-height: 18px;
    padding: 1px 6px;
    border-radius: 0 10px 0 10px;
    background: #03c8d4;
    display: block
}

.pack_yk_pack .pack_pack_cover .pack_pack_tag .pack_tagtext,.pack_yk_pack_focus .pack_pack_cover .pack_pack_tag .pack_tagtext,.pack_yk_pack_v .pack_pack_cover .pack_pack_tag .pack_tagtext {
    display: inline-block;
    font-size: 12px;
    vertical-align: text-bottom
}

.pack_yk_pack .pack_pack_cover .pack_tag_vip,.pack_yk_pack_focus .pack_pack_cover .pack_tag_vip,.pack_yk_pack_v .pack_pack_cover .pack_tag_vip {
    background: linear-gradient(81.43deg, #C5A14B -26.81%, #EBD989 87.89%);
    color: #4e2d03
}

.pack_yk_pack .pack_pack_cover .pack_tag_red,.pack_yk_pack_focus .pack_pack_cover .pack_tag_red,.pack_yk_pack_v .pack_pack_cover .pack_tag_red {
    background: #ff008c
}

.pack_yk_pack .pack_pack_cover .pack_tag_gray,.pack_yk_pack_focus .pack_pack_cover .pack_tag_gray,.pack_yk_pack_v .pack_pack_cover .pack_tag_gray {
    background: rgba(0,0,0,.6)
}

.pack_yk_pack .pack_pack_cover .pack_tag_svip,.pack_yk_pack_focus .pack_pack_cover .pack_tag_svip,.pack_yk_pack_v .pack_pack_cover .pack_tag_svip {
    background-image: -webkit-linear-gradient(210deg,#ffde9e,#f19dc7 75%,#b499ff);
    background-image: linear-gradient(240deg,#ffde9e,#f19dc7 75%,#b499ff);
    color: #4d0819
}

.pack_yk_pack .pack_pack_cover .pack_p_icon,.pack_yk_pack_focus .pack_pack_cover .pack_p_icon,.pack_yk_pack_v .pack_pack_cover .pack_p_icon {
    display: inline-block;
    vertical-align: text-bottom;
    font-size: 12px
}


.pack_yk_pack .pack_pack_vertical,.pack_yk_pack_focus .pack_pack_vertical,.pack_yk_pack_v .pack_pack_vertical {
    padding-top: 133.3%
}

.pack_yk_pack .pack_info_list,.pack_yk_pack_focus .pack_info_list,.pack_yk_pack_v .pack_info_list {
    position: relative;
    padding-top: 9px;
    color: hsla(0,0%,100%,.87);
    z-index: 10;
    overflow: hidden;
    max-height: 44px
}

.pack_yk_pack .pack_info_list .pack_title,.pack_yk_pack_focus .pack_info_list .pack_title,.pack_yk_pack_v .pack_info_list .pack_title {
    white-space: pre-wrap;
    overflow: hidden;
    color: #fff
}

.pack_yk_pack .pack_info_list .pack_title a,.pack_yk_pack_focus .pack_info_list .pack_title a,.pack_yk_pack_v .pack_info_list .pack_title a {
    width: 100%;
    line-height: 22px;
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -moz-box-orient: vertical;
    -moz-appearance: 2;
    display: box;
    box-orient: vertical;
    font-weight: 500;
    word-break: break-word
}

.pack_yk_pack .pack_info_list .pack_title a:hover,.pack_yk_pack_focus .pack_info_list .pack_title a:hover,.pack_yk_pack_v .pack_info_list .pack_title a:hover {
    color: var(--title-hover-color)
}

.pack_yk_pack .pack_info_list .pack_short_title,.pack_yk_pack_focus .pack_info_list .pack_short_title,.pack_yk_pack_v .pack_info_list .pack_short_title {
    height: 22px;
    white-space: nowrap
}

.pack_yk_pack .pack_info_list .pack_short_title a,.pack_yk_pack_focus .pack_info_list .pack_short_title a,.pack_yk_pack_v .pack_info_list .pack_short_title a {
    display: block;
    height: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.pack_yk_pack .pack_info_list .pack_rows_title a,.pack_yk_pack_focus .pack_info_list .pack_rows_title a,.pack_yk_pack_v .pack_info_list .pack_rows_title a {
    line-height: 18px;
    height: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: nowrap
}

.pack_yk_pack .pack_info_list .pack_subtitle,.pack_yk_pack_focus .pack_info_list .pack_subtitle,.pack_yk_pack_v .pack_info_list .pack_subtitle {
    color: hsla(0,0%,100%,.5);
    margin-top: 3px;
    height: 14px;
    line-height: 14px;
    font-size: 14px;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.pack_yk_pack .pack_info_list .pack_desc,.pack_yk_pack_focus .pack_info_list .pack_desc,.pack_yk_pack_v .pack_info_list .pack_desc {
    color: hsla(0,0%,100%,.5);
    margin-top: 12px;
    height: 17px;
    line-height: 17px;
    font-size: 14px;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.pack_yk_pack .pack_info_list .pack_reserve,.pack_yk_pack_focus .pack_info_list .pack_reserve,.pack_yk_pack_v .pack_info_list .pack_reserve {
    position: absolute;
    right: 0;
    bottom: 0;
    display: block;
    width: 48px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 12px;
    color: #ff008c;
    box-sizing: border-box;
    border-radius: 16px;
    border: 1px solid rgba(255,0,140,.3)
}

.pack_yk_pack .pack_info_list .pack_reserve_vip,.pack_yk_pack_focus .pack_info_list .pack_reserve_vip,.pack_yk_pack_v .pack_info_list .pack_reserve_vip {
    position: absolute;
    right: 0;
    bottom: 0;
    display: block;
    width: 48px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 12px;
    color: linear-gradient(81.43deg, #C5A14B -26.81%, #EBD989 87.89%);
    box-sizing: border-box;
    border-radius: 16px;
    border: 1px solid rgba(255,221,154,.3)
}

.pack_yk_pack .pack_info_list .pack_reserved,.pack_yk_pack_focus .pack_info_list .pack_reserved,.pack_yk_pack_v .pack_info_list .pack_reserved {
    position: absolute;
    right: 0;
    bottom: 0;
    display: block;
    width: 48px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 12px;
    color: #999;
    box-sizing: border-box;
    border-radius: 16px;
    border: 1px solid hsla(0,0%,100%,.1);
    background: var(--bg-color)
}

.pack_yk_pack .pack_p_lb,.pack_yk_pack .pack_p_lt,.pack_yk_pack .pack_p_rb,.pack_yk_pack .pack_p_rt,.pack_yk_pack_focus .pack_p_lb,.pack_yk_pack_focus .pack_p_lt,.pack_yk_pack_focus .pack_p_rb,.pack_yk_pack_focus .pack_p_rt,.pack_yk_pack_v .pack_p_lb,.pack_yk_pack_v .pack_p_lt,.pack_yk_pack_v .pack_p_rb,.pack_yk_pack_v .pack_p_rt {
    position: absolute;
    color: #fff;
    font-size: 12px;
    z-index: 15
}

.pack_yk_pack .pack_p_rt,.pack_yk_pack_focus .pack_p_rt,.pack_yk_pack_v .pack_p_rt {
    display: block;
    right: 0;
    top: 0
}

.pack_yk_pack .pack_p_lt,.pack_yk_pack_focus .pack_p_lt,.pack_yk_pack_v .pack_p_lt {
    left: 8px;
    top: 8px
}

.pack_yk_pack .pack_p_rb,
.pack_yk_pack_focus .pack_p_rb,
.pack_yk_pack_v .pack_p_rb {
    line-height: 28px;
    right: 8px;
    bottom: 0;
    width: 100px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.pack_yk_pack_v .pack_pack_cover,.pack_yk_pack_v .pack_vip_cover {
    padding-top: 133.33%;
    background: #25252b
}

.pack_yk_pack_focus {
    position: relative;
    overflow: hidden;
    border-radius: 0 0 10px 10px
}

.pack_yk_pack_focus .pack_vip_cover {
    border-radius: 7px 7px 0 0;
    background: #25252b
}

.pack_yk_pack_focus .pack_vip_cover a img {
    border-radius: 7px 7px 0 0
}

.pack_yk_pack_focus .pack_vip_cover .pack_bg {
    border-radius: 0
}

.pack_yk_pack_focus .pack_pack_cover {
    border-radius: 10px 10px 0 0;
    background: #25252b
}

.pack_yk_pack_focus .pack_pack_cover a img {
    border-radius: 7px 7px 0 0
}

.pack_yk_pack_focus .pack_pack_cover .pack_bg {
    border-radius: 0
}

.pack_yk_pack_focus .pack_info_list {
    background-color: #25252b;
    padding: 18px;
    max-height: 80px;
    min-height: 80px
}

.pack_yk_pack_focus .pack_info_list .pack_title {
    margin-bottom: 6px;
    padding-right: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #fff;
    font-weight: 500;
    text-align: left
}

.pack_yk_pack_focus .pack_info_list .pack_title a {
    display: block;
    height: 20px;
    line-height: 20px;
    font-size: 20px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.pack_yk_pack_focus .pack_info_list .pack_subtitle {
    color: #999;
    font-weight: 400;
    height: 22px;
    line-height: 22px;
    font-size: 16px
}

.pack_yk_pack_focus .pack_focus_bg {
    position: absolute;
    width: 100%;
    opacity: .1;
    right: 0;
    bottom: 0
}

/*Slider trending week*/
.imgxb {
    filter: blur(3px); /* Điều chỉnh giá trị px tùy thuộc vào mức độ mờ bạn muốn */
}

.search-autocomplete {
    width: 422px !important;
    position: absolute;
    z-index: 99999;
    background-color: #fff
}

.search-autocomplete .autocomplete-activeItem, .search-autocomplete .search-for {
    background-color: #fafafa
}

.search-autocomplete .search-for a {
    color: #008eff
}

.search-autocomplete ul li {
    padding: 10px;
    text-overflow: unset;
    white-space: unset;
    overflow: hidden;
    border-bottom: 1px solid #ececec;
    position: relative
}

.search-autocomplete ul li .sIMG {
    float: left;
    overflow: hidden;
    width: 45px;
    height: 65px;
    margin-right: 10px;
    box-shadow: 0 0 3px rgba(0, 0, 0, .2)
}

.search-autocomplete ul li .sIMG img {
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    margin-bottom: 0;
    margin-right: 0;
    float: none
}

.search-autocomplete ul li .sLEFT span {
    display: block;
    overflow: hidden;
    white-space: unset;
    text-overflow: unset;
    font-size: .88em;
    color: #888;
    margin-bottom: 3px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-flex: 1;
    -webkit-box-orient: vertical
}

.search-autocomplete ul li .sLEFT span:hover {
    color: #2196f3
}

@media (min-width: 1024px) {
    .episodes span a {
        width: 40px !important
    }

    .tabs-slider .tab {
        width: 93px !important
    }
}

@media (max-width: 359px) {
    .episodes span a {
        width: 35px !important
    }

    .list-servers span {
        width: 160px !important
    }

    .list-servers div {
        width: 39.8% !important
    }
}

@media (min-width: 360px) and (max-width: 374px) {
    .episodes span a {
        width: 31px !important
    }

    .tabs-slider .tab {
        width: 106px !important
    }

    .list-servers span {
        width: 50% !important
    }

    .list-servers div {
        width: 41% !important
    }
}

@media (min-width: 375px) and (max-width: 389px) {
    .episodes span a {
        width: 34px !important
    }

    .tabs-slider .tab {
        width: 112px !important
    }

    .list-servers span {
        width: 50% !important
    }

    .list-servers div {
        width: 41.3% !important
    }
}

@media (min-width: 390px) and (max-width: 392px) {
    .episodes span a {
        width: 36px !important
    }

    .tabs-slider .tab {
        width: 117px !important
    }

    .list-servers span {
        width: 50% !important
    }

    .list-servers div {
        width: 41.8% !important
    }
}

@media (min-width: 393px) and (max-width: 411px) {
    .episodes span a {
        width: 37px !important
    }

    .tabs-slider .tab {
        width: 118px !important
    }

    .list-servers span {
        width: 50% !important
    }

    .list-servers div {
        width: 41.8% !important
    }
}

@media (min-width: 412px) and (max-width: 413px) {
    .episodes span a {
        width: 31px !important
    }

    .tabs-slider .tab {
        width: 124px !important
    }

    .list-servers span {
        width: 50% !important
    }

    .list-servers div {
        width: 42.2% !important
    }
}

@media (min-width: 414px) and (max-width: 427px) {
    .episodes span a {
        width: 40px !important
    }

    .tabs-slider .tab {
        width: 125px !important
    }

    .list-servers span {
        width: 50% !important
    }

    .list-servers div {
        width: 42.2% !important
    }
}

@media (min-width: 428px) and (max-width: 479px) {
    .episodes span a {
        width: 43px !important
    }

    .tabs-slider .tab {
        width: 129px !important
    }

    .list-servers span {
        width: 50% !important
    }

    .list-servers div {
        width: 42.5% !important
    }
}

@media (min-width: 480px) and (max-width: 639px) {
    .episodes span a {
        width: 60px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }

    .list-servers span {
        width: 50% !important
    }
}

@media (min-width: 640px) and (max-width: 767px) {
    .episodes span a {
        width: 63px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }

    .list-servers span {
        width: 160px !important
    }
}

@media (min-width: 768px) and (max-width: 779px) {
    .episodes span a {
        width: 43px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 780px) and (max-width: 799px) {
    .episodes span a {
        width: 63px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 800px) and (max-width: 801px) {
    .episodes span a {
        width: 35px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 802px) and (max-width: 804px) {
    .episodes span a {
        width: 65px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 805px) and (max-width: 819px) {
    .episodes span a {
        width: 65px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 820px) and (max-width: 833px) {
    .episodes span a {
        width: 32px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 834px) and (max-width: 849px) {
    .episodes span a {
        width: 33px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 850px) and (max-width: 883px) {
    .episodes span a {
        width: 65px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 884px) and (max-width: 900px) {
    .episodes span a {
        width: 29px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

@media (min-width: 901px) and (max-width: 1023px) {
    .episodes span a {
        width: 61px !important
    }

    .tabs-slider .tab {
        width: 130px !important
    }
}

.loop {
    margin-bottom: 15px;
    width: 75% !important;
    float: left;
    overflow: hidden
}

.loop.notrend {
    width: 100% !important
}

.slide-content {
    font-family: open sans, arial, helvetica, sans-serif;
    font-size: 13px
}

.slide-content .ellipsis {
    float: none !important;
    display: block !important
}

.slide-content .extras {
    margin-top: 5px !important
}

.slide-content .title .release-year {
    font-size: 13px !important;
    color: #ffc107 !important;
    margin: 0 !important
}

.slide-content .rating .site-vote .dashicons {
    font-size: 52px !important;
    width: initial !important;
    height: auto !important
}

.slide-content .cast strong {
    color: unset !important;
    font-weight: 400 !important
}

.owl-dot.active span, .owl-dot.active:hover span {
    background: #ffd400 !important
}

.slide-item.full .slide-content {
    padding: 40px 25px !important
}

.slide-shadow {
    background-image: url(../images/pattern.png) !important;
    background-color: rgba(0, 0, 0, .7) !important;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, .7) !important
}

.loop .owl-item.active.center {
    z-index: 0
}

.slide-content .extras div {
    color: #ddd !important
}

.slide-content .excerpt {
    max-height: 100px;
    overflow: hidden
}

.slidtop {
    overflow: hidden;
    max-height: 220px;
    direction: initial
}

.slidtop .trending {
    overflow: hidden
}

.slidtop .trending .tdb {
    cursor: pointer;
    height: 220px;
    margin-left: 7px;
    position: relative
}

.slidtop .trending .tdb .crown {
    background-image: url(/themes/motchill/static/crown.png);
    background-size: 100%;
    position: absolute;
    right: 5px;
    top: 10px;
    height: 40px;
    width: 40px;
    z-index: 3
}

.slidtop .trending .tdb .imgxa {
    height: 100%;
    width: 100%;
    overflow: hidden;
    background-size: auto 100%;
    background-position: top center
}

.slidtop .trending .tdb .imgxa .imgxb {
    height: 100%;
    width: 100%;
    background-position: center;
    background-size: cover
}

.slidtop .trending .tdb .textbg {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    transition: opacity .2s;
    z-index: 1;
    box-shadow: inset 0 0 40px #000
}

.slidtop .trending .tdb .textbg.blxc {
    color: #eee
}

.slidtop .trending .tdb .textbg .bghover {
    margin-top: 40%;
    padding: 0 5%;
    line-height: 19px;
    text-align: left;
    text-transform: uppercase
}

.slidtop .trending .tdb .textbg .bghover .numa {
    display: block;
    font-size: 16px
}

.slidtop .trending .tdb .textbg .bghover .numb {
    display: block;
    font-size: 17px;
    margin-top: 5px;
    height: 55px;
    overflow: hidden
}

.owl-nav {
    display: none
}

.owl-dot {
    background: 0 0 !important;
    border: 0 !important;
    padding: 0 !important
}

.owl-carousel .animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.owl-carousel .owl-animated-in {
    z-index: 0
}

.owl-carousel .owl-animated-out {
    z-index: 1
}

.owl-carousel .fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.owl-height {
    -webkit-transition: height .5s ease-in-out;
    -moz-transition: height .5s ease-in-out;
    -ms-transition: height .5s ease-in-out;
    -o-transition: height .5s ease-in-out;
    transition: height .5s ease-in-out
}

.owl-carousel {
    display: none;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    z-index: 1
}

.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y
}

.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0
}

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    -webkit-transform: translate3d(0px, 0px, 0px)
}

.owl-carousel .owl-controls .owl-nav .owl-prev, .owl-carousel .owl-controls .owl-nav .owl-next, .owl-carousel .owl-controls .owl-dot {
    cursor: pointer;
    cursor: hand;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.owl-carousel.owl-loaded {
    display: block
}

.owl-carousel.owl-loading {
    opacity: 0;
    display: block
}

.owl-carousel.owl-hidden {
    opacity: 0
}

.owl-carousel .owl-refresh .owl-item {
    display: none
}

.owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    -webkit-transform-style: preserve-3d
}

.owl-carousel.owl-text-select-on .owl-item {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto
}

.owl-carousel .owl-grab {
    cursor: move;
    cursor: -webkit-grab;
    cursor: -o-grab;
    cursor: -ms-grab;
    cursor: grab
}

.owl-carousel.owl-rtl {
    direction: rtl
}

.owl-carousel.owl-rtl .owl-item {
    float: right
}

.no-js .owl-carousel {
    display: block
}

.owl-carousel .owl-item .owl-lazy {
    opacity: 0;
    -webkit-transition: opacity .4s ease;
    -moz-transition: opacity .4s ease;
    -ms-transition: opacity .4s ease;
    -o-transition: opacity .4s ease;
    transition: opacity .4s ease
}

.owl-carousel .owl-item img {
    transform-style: preserve-3d
}

.owl-carousel .owl-video-wrapper {
    position: relative;
    height: 100%;
    background: #000
}

.owl-carousel .owl-video-play-icon {
    position: absolute;
    height: 80px;
    width: 80px;
    left: 50%;
    top: 50%;
    margin-left: -40px;
    margin-top: -40px;
    cursor: pointer;
    z-index: 1;
    -webkit-backface-visibility: hidden;
    -webkit-transition: scale .1s ease;
    -moz-transition: scale .1s ease;
    -ms-transition: scale .1s ease;
    -o-transition: scale .1s ease;
    transition: scale .1s ease
}

.owl-carousel .owl-video-play-icon:hover {
    -webkit-transition: scale(1.3, 1.3);
    -moz-transition: scale(1.3, 1.3);
    -ms-transition: scale(1.3, 1.3);
    -o-transition: scale(1.3, 1.3);
    transition: scale(1.3, 1.3)
}

.owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon {
    display: none
}

.owl-carousel .owl-video-tn {
    opacity: 0;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    -webkit-transition: opacity .4s ease;
    -moz-transition: opacity .4s ease;
    -ms-transition: opacity .4s ease;
    -o-transition: opacity .4s ease;
    transition: opacity .4s ease
}

.owl-carousel .owl-video-frame {
    position: relative;
    z-index: 1
}

.owl-item.active.center .slide-item {
    padding: 0;
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%)
}

.owl-item.active.center {
    z-index: 3
}

.owl-item.active.center .slide-content {
    visibility: visible
}

.owl-item.active.center .slide-bg {
    background: #666;
    -webkit-filter: blur(20px);
    -moz-filter: blur(20px);
    -o-filter: blur(20px);
    -ms-filter: blur(20px);
    filter: blur(20px)
}

.owl-item.active.center .slide-shadow {
    box-shadow: inset -300px 40px 200px 0 rgba(0, 0, 0, .75), 0 0 15px 5px rgba(0, 0, 0, .8);
    background-color: rgba(0, 0, 0, .7)
}

.owl-item.active .slide-bg {
    background: #222
}

.owl-prev, .owl-next {
    position: absolute;
    top: 50%;
    margin-top: -20px;
    font-size: 40px;
    text-shadow: 0 0 5px rgba(0, 0, 0, .7)
}

.owl-prev:hover, .owl-next:hover {
    color: #f3d872
}

.owl-prev {
    left: 0
}

.owl-next {
    right: 0
}

.owl-carousel .owl-item .slide-content img {
    width: auto;
    box-shadow: 0 3px 2px rgba(0, 0, 0, .3);
    border-radius: 3px
}

.slide-item {
    height: 250px
}

.slide-bg {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: #222;
    overflow: hidden
}

.slide-bg img {
    min-height: 100%;
    min-width: 704px;
    width: 100%;
    height: auto;
    top: 0;
    left: 0
}

.slide-shadow {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 2;
    background-color: rgba(0, 0, 0, .7)
}

.slide-content {
    position: absolute;
    top: -10px;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 3;
    padding: 39px 20px;
    text-align: left
}

.slide-content .poster {
    float: right;
    margin: 30px 0 0 5px
}

.slide-content .poster img {
    max-width: 100%;
    height: 120px
}

.slide-content .title {
    display: block;
    font-size: 15px;
    color: #fff;
    text-transform: uppercase
}

.slide-content .title .release-year {
    font-size: 14px;
    margin-left: 10px;
    color: #00ab76
}

.slide-content .extras {
    display: block;
    margin-top: 10px
}

.slide-content .extras div {
    display: inline-block;
    margin-right: 10px
}

.slide-content .excerpt {
    display: block;
    margin-top: 30px
}

.slide-content .excerpt .title {
    display: block;
    font-size: 12px;
    margin-bottom: 6px;
    font-weight: 700;
    color: #ccc
}

.slide-content .excerpt p {
    line-height: 19px;
    color: #ddd;
    margin: 0
}

.slide-content a {
    color: #ddd
}

.slide-content .cast {
    display: block;
    margin-top: 10px
}

.slide-content .cast span {
    display: block;
    margin-right: 10px;
    margin-bottom: 7px;
    width: 70%;
    line-height: normal;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #ddd;
    overflow: hidden
}

.slide-content .cast strong {
    color: #00ab76
}

.slide-content .rating {
    display: inline-block;
    height: 48px;
    float: left;
    margin-top: -4px;
    margin-left: -9px
}

.slide-content .rating .site-vote {
    font-size: 48px;
    color: #f3d872;
    position: relative;
    float: left;
    margin-right: 8px
}

.slide-content .rating .site-vote .dashicons {
    font-size: 42px;
    width: initial;
    height: auto
}

.slide-content .rating .site-vote span span {
    font-size: 14px;
    position: absolute;
    left: 12px;
    top: 25px;
    color: #0a0a0a;
    font-weight: 600
}

.slide-content .rating .site-vote span:before {
    margin: 0
}

.slide-content .ellipsis {
    max-width: 65%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    float: left;
    line-height: 26px
}

.slide-content .title a {
    color: #f5cc2a;
    font-weight: 700
}

.slide-content .title a:hover {
    text-decoration: none;
    color: #f3d872
}

.slide-content .extra-category {
    display: inline-block;
    margin-right: 10px;
    max-width: 30%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    float: left;
    line-height: 20px;
    margin-top: -4px
}

.owl-dots {
    position: absolute;
    bottom: 35px;
    right: 0;
    left: 0;
    text-align: center
}

.owl-dot {
    display: inline-block
}

.owl-dot span {
    padding: 6px;
    background: rgba(255, 255, 255, .24);
    margin: 1px 3px;
    display: inline-block;
    border-radius: 10px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .6), inset 0 1px 1px rgba(0, 0, 0, .52)
}

.owl-dot.active span, .owl-dot.active:hover span {
    background: rgba(243, 216, 114, .54)
}

.owl-dot:hover span {
    background: rgba(255, 255, 255, .54)
}

.owl-carousel.normal {
    box-shadow: none;
    width: 92%;
    margin: 0 auto 30px
}

.owl-carousel.normal .slide-item {
    height: auto
}

.owl-carousel.normal .owl-prev, .owl-carousel.normal .owl-next {
    position: absolute;
    top: 50%;
    margin-top: -30px;
    font-size: 40px;
    text-shadow: 0 0 5px rgba(0, 0, 0, .7)
}

.owl-carousel.normal .owl-prev:hover, .owl-carousel.normal .owl-next:hover {
    color: #f3d872
}

.owl-carousel.normal .owl-prev {
    right: 100%;
    left: inherit
}

.owl-carousel.normal .owl-next {
    left: 100%
}

.owl-carousel.normal .slider-content {
    margin-top: 15px
}

.owl-carousel.normal .owl-dots {
    position: absolute;
    bottom: -15px;
    right: 0;
    left: 0;
    text-align: center
}

@media only screen and (max-width: 800px) {
    .loop {
        margin-bottom: 0
    }

    .slide-content .poster img {
        height: 110px;
        margin-top: 29px
    }

    .slide-content .excerpt {
        max-height: 118px
    }
}

@media only screen and (max-width: 695px) {
    .slide-item.full .slide-content {
        padding: 20px !important
    }
}

@media only screen and (max-width: 650px) {
    .loop {
        float: none;
        width: 100% !important
    }
}

.typez {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 12px;
    padding: 2px 5px;
    line-height: normal;
    border-radius: 3px;
    color: #fff;
    background: #333;
    display: flex;
    flex-direction: row;
    align-items: center;
    z-index: 3;
    transition: .3s;
    opacity: 1;
    pointer-events: none;
    height: 30px;
    width: auto;
    padding: 0 8px;
    transform: scale(.8);
    border-radius: 6px;
    background-color: rgba(21, 31, 48, .75);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    cursor: default;
}

.myui-block-title-regions {
    padding: 0 10px;
    font-size: 24px;
    color: #ffffff;
    text-transform: uppercase;
    font-weight: bold;
    padding-bottom: 10px;
    padding-top: 30px;
}

button.regions-list-film {
    margin-left: 15px;
    padding: 6px 20px;
    border-radius: 40px;
    background-color: #FF8200;
    -webkit-transition: background-color .2s ease, color .2s ease;
    transition: background-color .2s ease, color .2s ease;
    font-weight: 700;
    color: #FFFFFF;
}

button.regions-list-film.active {
    margin-left: 15px;
    padding: 11px 30px 9px;
    border-radius: 40px;
    background: #3898ec;
    -webkit-transition: background-color .2s ease, color .2s ease;
    transition: background-color .2s ease, color .2s ease;
    color: #3b4b57;
    font-weight: 700;
    color: #FFFFFF;
}

@media screen and (max-width: 991px) {
    .regions-list-film {
        position: static;
        margin-top: 0;
        margin-bottom: 20px;
        text-align: center;
    }
    button.regions-list-film {
        margin-left: 15px;
        padding: 11px 30px 9px;
        border-radius: 40px;
        background-color: #0c2738;
        -webkit-transition: background-color .2s ease, color .2s ease;
        transition: background-color .2s ease, color .2s ease;
    }
}

.film-note {
    font-size: 11px;
    margin: 2px;
    display: inline-block;
    height: 24px;
    line-height: 17px;
    border-radius: 3px !important;
    cursor: pointer;
    padding: 4px 5px;
    background: #25354c;
    color: #eee;
    text-shadow: 0 1px 0 rgb(0 0 0 / 50%);
    box-shadow: inset 0 1px 1px rgb(255 255 255 / 7%), 0px 1px 3px rgb(0 0 0 / 29%);
    margin:0;
    float:right;
    font-weight: 700;
    margin-right: 20px;
}
.back-to-top-btn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    border-radius: 10%;
    background-color: #f3a908;
    color: #0a0a0a;
    font-size: 20px;
    border: none;
    outline: none;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    z-index: 9999; /* Đảm bảo nút hiển thị trên top các phần tử khác */
}

.back-to-top-btn.show {
    display: block;
    opacity: 1;
}
/* CSS cho các thiết bị máy tính */
/*@media (max-width: 767px) {*/
/*    footer {*/
/*        display: none;*/
/*    }*/
/*}*/

/* Footer container */
.footer {
    border: 1px solid #6c757d;
    background-color: #000;
    color: #f8f9fa;
    margin: auto;
    text-align: center;
    margin-top: 2rem;
}

/* Footer content container */
.footer-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-top: 2.5rem;
    gap: 1.25rem;
    padding-left: 0.375rem;
    padding-right: 0.375rem;
}

/* Footer logo */
.footer-logo {
    display: flex;
    justify-content: center;
    gap: 0.1875rem;
}

.footer-logo img {
    width: 9.375rem;
    height: 2.1875rem;
}

/* Footer description */
.footer-description p {
    font-size: 0.875rem;
    color: #ccc;
}

/* Footer links */
.footer-links {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.1875rem;
    font-size: 0.875rem;
}

.footer-links > div {
    display: flex;
    flex-direction: column;
    gap: 0.1875rem;
}

.footer-links span {
    text-transform: uppercase;
    color: #ccc;
}

.footer-links a {
    color: #ccc;
}

.footer-links a:hover {
    color: #007bff;
}

/* Footer legal information */
.footer-legal {
    padding-top: 0.375rem;
    font-size: 0.875rem;
    color: #ccc;
    border-top: 1px solid #6c757d;
    position: relative;
}

.footer-legal span {
    position: relative;
    top: 0.0625rem;
}

.footer-legal button {
    background-color: #6c757d;
    color: #f8f9fa;
    padding-left: 0.375rem;
    padding-right: 0.375rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    border-radius: 0.125rem;
    position: absolute;
    right: 0.125rem;
    top: 0.0625rem;
}


/*# sourceMappingURL=main.css.map */

/*Taiwind css*/

/*! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com*/


*,:after,:before {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59,130,246,.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia:
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59,130,246,.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia:
}



.top-2 {
    top: .5rem
}

.top-7 {
    top: 1.75rem
}

.z-10 {
    z-index: 10
}

.z-20 {
    z-index: 20
}

.z-30 {
    z-index: 30
}

.z-50 {
    z-index: 50
}

.z-\[100\] {
    z-index: 100
}

.z-\[50px\] {
    z-index: 50px
}

.z-\[60\] {
    z-index: 60
}

.col-span-10 {
    grid-column: span 10/span 10
}

.col-span-12 {
    grid-column: span 12/span 12
}

.col-span-2 {
    grid-column: span 2/span 2
}

.col-span-3 {
    grid-column: span 3/span 3
}

.col-span-6 {
    grid-column: span 6/span 6
}

.col-span-9 {
    grid-column: span 9/span 9
}

.float-right {
    float: right
}

.-m-2 {
    margin: -.5rem
}

.m-1 {
    margin: .25rem
}

.m-auto {
    margin: auto
}

.mx-4 {
    margin-left: 1rem;
    margin-right: 1rem
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.my-1 {
    margin-bottom: .25rem;
    margin-top: .25rem
}

.my-2 {
    margin-bottom: .5rem;
    margin-top: .5rem
}

.my-4 {
    margin-bottom: 1rem;
    margin-top: 1rem
}

.-mb-px {
    margin-bottom: -1px
}

.mb-0 {
    margin-bottom: 0
}

.mb-1 {
    margin-bottom: .25rem
}

.mb-1\.5 {
    margin-bottom: .375rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-3 {
    margin-bottom: .75rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.me-1 {
    margin-inline-end:.25rem}

.ml-1 {
    margin-left: .25rem
}

.ml-10 {
    margin-left: 2.5rem
}

.ml-2 {
    margin-left: .5rem
}

.ml-3 {
    margin-left: .75rem
}

.ml-4 {
    margin-left: 1rem
}

.ml-8 {
    margin-left: 2rem
}

.mr-1 {
    margin-right: .25rem
}

.mr-1\.5 {
    margin-right: .375rem
}

.mr-2 {
    margin-right: .5rem
}

.mr-3 {
    margin-right: .75rem
}

.mr-4 {
    margin-right: 1rem
}

.ms-auto {
    margin-inline-start:auto}

.mt-1 {
    margin-top: .25rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-3 {
    margin-top: .75rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-6 {
    margin-top: 1.5rem
}

.line-clamp-2 {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    overflow: hidden
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.inline {
    display: inline
}

.flex {
    display: flex
}

.inline-flex {
    display: inline-flex
}

.grid {
    display: grid
}

.hidden {
    display: none
}

.h-10 {
    height: 2.5rem
}

.h-16 {
    height: 4rem
}

.h-2 {
    height: .5rem
}

.h-2\.5 {
    height: .625rem
}

.h-24 {
    height: 6rem
}

.h-3 {
    height: .75rem
}

.h-36 {
    height: 9rem
}

.h-4 {
    height: 1rem
}

.h-48 {
    height: 12rem
}

.h-5 {
    height: 1.25rem
}

.h-6 {
    height: 1.5rem
}

.h-60 {
    height: 15rem
}

.h-7 {
    height: 1.75rem
}

.h-8 {
    height: 2rem
}

.h-9 {
    height: 2.25rem
}

.h-auto {
    height: auto
}

.h-full {
    height: 100%
}

.h-px {
    height: 1px
}

.h-screen {
    height: 100vh
}

.max-h-60 {
    max-height: 15rem
}

.max-h-full {
    max-height: 100%
}

.min-h-\[50px\] {
    min-height: 50px
}

.min-h-full {
    min-height: 100%
}

.w-1\/2 {
    width: 50%
}

.w-10 {
    width: 2.5rem
}

.w-16 {
    width: 4rem
}

.w-2 {
    width: .5rem
}

.w-2\.5 {
    width: .625rem
}

.w-2\/5 {
    width: 40%
}

.w-20 {
    width: 5rem
}

.w-24 {
    width: 6rem
}

.w-3 {
    width: .75rem
}

.w-3\/5 {
    width: 60%
}

.w-32 {
    width: 8rem
}

.w-4 {
    width: 1rem
}

.w-4\/5 {
    width: 80%
}

.w-48 {
    width: 12rem
}

.w-5 {
    width: 1.25rem
}

.w-5\/12 {
    width: 41.666667%
}

.w-6 {
    width: 1.5rem
}

.w-7 {
    width: 1.75rem
}

.w-7\/12 {
    width: 58.333333%
}

.w-8 {
    width: 2rem
}

.w-\[95\%\] {
    width: 95%
}

.w-auto {
    width: auto
}

.w-full {
    width: 100%
}

.w-screen {
    width: 100vw
}

.min-w-0 {
    min-width: 0
}

.min-w-\[280px\] {
    min-width: 280px
}

.min-w-\[60px\] {
    min-width: 60px
}

.max-w-2xl {
    max-width: 42rem
}

.max-w-\[1150px\] {
    max-width: 1150px
}

.max-w-\[170px\] {
    max-width: 170px
}

.max-w-\[180px\] {
    max-width: 180px
}

.max-w-md {
    max-width: 28rem
}

.max-w-sm {
    max-width: 24rem
}

.max-w-xl {
    max-width: 36rem
}

.max-w-xs {
    max-width: 20rem
}

.flex-1 {
    flex: 1 1 0%
}

.flex-auto {
    flex: 1 1 auto
}

.basis-1\/2 {
    flex-basis: 50%
}

.basis-1\/4 {
    flex-basis: 25%
}

.basis-2\/4 {
    flex-basis: 50%
}

.origin-top-right {
    transform-origin: top right
}

.-translate-x-1\/2 {
    --tw-translate-x: -50%;
    transform: translate(-50%,var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-1\/2 {
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x),-50%) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-0 {
    --tw-translate-y: 0px;
    transform: translate(var(--tw-translate-x)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-1 {
    --tw-translate-y: 0.25rem;
    transform: translate(var(--tw-translate-x),.25rem) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-4 {
    --tw-translate-y: 1rem;
    transform: translate(var(--tw-translate-x),1rem) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-\[2px\] {
    --tw-translate-y: 2px;
    transform: translate(var(--tw-translate-x),2px) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-90 {
    --tw-rotate: 90deg;
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(90deg) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.scale-105 {
    --tw-scale-x: 1.05;
    --tw-scale-y: 1.05;
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(1.05) scaleY(1.05)
}

.scale-105,.transform {
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@keyframes spin {
    to {
        transform: rotate(1turn)
    }
}

.animate-spin {
    animation: spin 1s linear infinite
}

.cursor-default {
    cursor: default
}

.cursor-pointer {
    cursor: pointer
}

.select-none {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.list-disc {
    list-style-type: disc
}

.list-none {
    list-style-type: none
}

.grid-cols-1 {
    grid-template-columns: repeat(1,minmax(0,1fr))
}

.grid-cols-12 {
    grid-template-columns: repeat(12,minmax(0,1fr))
}

.grid-cols-2 {
    grid-template-columns: repeat(2,minmax(0,1fr))
}

.grid-cols-3 {
    grid-template-columns: repeat(3,minmax(0,1fr))
}

.grid-cols-4 {
    grid-template-columns: repeat(4,minmax(0,1fr))
}

.flex-row {
    flex-direction: row
}

.flex-col {
    flex-direction: column
}

.flex-wrap {
    flex-wrap: wrap
}

.items-start {
    align-items: flex-start
}

.items-center {
    align-items: center
}

.justify-start {
    justify-content: flex-start
}

.justify-end {
    justify-content: flex-end
}

.justify-center {
    justify-content: center
}

.justify-between {
    justify-content: space-between
}

.gap-1 {
    gap: .25rem
}

.gap-10 {
    gap: 2.5rem
}

.gap-2 {
    gap: .5rem
}

.gap-3 {
    gap: .75rem
}

.gap-4 {
    gap: 1rem
}

.gap-x-1 {
    -moz-column-gap: .25rem;
    column-gap: .25rem
}

.gap-x-2 {
    -moz-column-gap: .5rem;
    column-gap: .5rem
}

.gap-x-3 {
    -moz-column-gap: .75rem;
    column-gap: .75rem
}

.gap-x-4 {
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.gap-x-6 {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem
}

.gap-x-8 {
    -moz-column-gap: 2rem;
    column-gap: 2rem
}

.gap-y-2 {
    row-gap: .5rem
}

.gap-y-3 {
    row-gap: .75rem
}

.gap-y-4 {
    row-gap: 1rem
}

.gap-y-6 {
    row-gap: 1.5rem
}

.gap-y-8 {
    row-gap: 2rem
}

.space-x-1>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-left: .25rem;
    margin-left: calc(.25rem*(1 - var(--tw-space-x-reverse)));
    margin-right: 0;
    margin-right: calc(.25rem*var(--tw-space-x-reverse))
}

.space-x-2>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-left: .5rem;
    margin-left: calc(.5rem*(1 - var(--tw-space-x-reverse)));
    margin-right: 0;
    margin-right: calc(.5rem*var(--tw-space-x-reverse))
}

.space-x-3>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-left: .75rem;
    margin-left: calc(.75rem*(1 - var(--tw-space-x-reverse)));
    margin-right: 0;
    margin-right: calc(.75rem*var(--tw-space-x-reverse))
}

.space-y-1>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: 0;
    margin-bottom: calc(.25rem*var(--tw-space-y-reverse));
    margin-top: .25rem;
    margin-top: calc(.25rem*(1 - var(--tw-space-y-reverse)))
}

.space-y-2>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: 0;
    margin-bottom: calc(.5rem*var(--tw-space-y-reverse));
    margin-top: .5rem;
    margin-top: calc(.5rem*(1 - var(--tw-space-y-reverse)))
}

.space-y-3>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: 0;
    margin-bottom: calc(.75rem*var(--tw-space-y-reverse));
    margin-top: .75rem;
    margin-top: calc(.75rem*(1 - var(--tw-space-y-reverse)))
}

.space-y-4>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: 0;
    margin-bottom: calc(1rem*var(--tw-space-y-reverse));
    margin-top: 1rem;
    margin-top: calc(1rem*(1 - var(--tw-space-y-reverse)))
}

.space-y-8>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: 0;
    margin-bottom: calc(2rem*var(--tw-space-y-reverse));
    margin-top: 2rem;
    margin-top: calc(2rem*(1 - var(--tw-space-y-reverse)))
}

.divide-y>:not([hidden])~:not([hidden]) {
    --tw-divide-y-reverse: 0;
    border-bottom-width: 0;
    border-bottom-width: calc(1px*var(--tw-divide-y-reverse));
    border-top-width: 1px;
    border-top-width: calc(1px*(1 - var(--tw-divide-y-reverse)))
}

.divide-zinc-600>:not([hidden])~:not([hidden]) {
    --tw-divide-opacity: 1;
    border-color: #52525b;
    border-color: rgb(82 82 91/var(--tw-divide-opacity))
}

.divide-zinc-700>:not([hidden])~:not([hidden]) {
    --tw-divide-opacity: 1;
    border-color: #3f3f46;
    border-color: rgb(63 63 70/var(--tw-divide-opacity))
}

.overflow-auto {
    overflow: auto
}

.overflow-hidden {
    overflow: hidden
}

.overflow-y-auto {
    overflow-y: auto
}

.overflow-x-hidden {
    overflow-x: hidden
}

.truncate {
    overflow: hidden;
    text-overflow: ellipsis
}

.truncate,.whitespace-nowrap {
    white-space: nowrap
}

.break-words {
    overflow-wrap: break-word
}

.rounded {
    border-radius: .25rem
}

.rounded-full {
    border-radius: 9999px
}

.rounded-lg {
    border-radius: .5rem
}

.rounded-md {
    border-radius: .375rem
}

.rounded-sm {
    border-radius: .125rem
}

.rounded-xl {
    border-radius: .75rem
}

.rounded-t {
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem
}

.rounded-t-lg {
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem
}

.rounded-br-md {
    border-bottom-right-radius: .375rem
}

.rounded-tr-md {
    border-top-right-radius: .375rem
}

.border {
    border-width: 1px
}

.border-0 {
    border-width: 0
}

.border-2 {
    border-width: 2px
}

.border-b {
    border-bottom-width: 1px
}

.border-l {
    border-left-width: 1px
}

.border-l-\[3px\] {
    border-left-width: 3px
}

.border-t {
    border-top-width: 1px
}

.border-solid {
    border-style: solid
}

.border-dashed {
    border-style: dashed
}

.border-\[\#0088cc\] {
    --tw-border-opacity: 1;
    border-color: #08c;
    border-color: rgb(0 136 204/var(--tw-border-opacity))
}

.border-\[\#0A66C2\] {
    --tw-border-opacity: 1;
    border-color: #0a66c2;
    border-color: rgb(10 102 194/var(--tw-border-opacity))
}

.border-\[\#1877F2\] {
    --tw-border-opacity: 1;
    border-color: #1877f2;
    border-color: rgb(24 119 242/var(--tw-border-opacity))
}

.border-\[\#1DA1F2\] {
    --tw-border-opacity: 1;
    border-color: #1da1f2;
    border-color: rgb(29 161 242/var(--tw-border-opacity))
}

.border-\[\#da966e\] {
    --tw-border-opacity: 1;
    border-color: #da966e;
    border-color: rgb(218 150 110/var(--tw-border-opacity))
}

.border-gray-300 {
    --tw-border-opacity: 1;
    border-color: #d1d5db;
    border-color: rgb(209 213 219/var(--tw-border-opacity))
}

.border-gray-800 {
    --tw-border-opacity: 1;
    border-color: #1f2937;
    border-color: rgb(31 41 55/var(--tw-border-opacity))
}

.border-zinc-600 {
    --tw-border-opacity: 1;
    border-color: #52525b;
    border-color: rgb(82 82 91/var(--tw-border-opacity))
}

.border-zinc-700 {
    --tw-border-opacity: 1;
    border-color: #3f3f46;
    border-color: rgb(63 63 70/var(--tw-border-opacity))
}

.border-zinc-800 {
    --tw-border-opacity: 1;
    border-color: #27272a;
    border-color: rgb(39 39 42/var(--tw-border-opacity))
}

.border-zinc-900 {
    --tw-border-opacity: 1;
    border-color: #18181b;
    border-color: rgb(24 24 27/var(--tw-border-opacity))
}

.border-opacity-75 {
    --tw-border-opacity: 0.75
}

.bg-\[\#0088cc\] {
    --tw-bg-opacity: 1;
    background-color: #08c;
    background-color: rgb(0 136 204/var(--tw-bg-opacity))
}

.bg-\[\#0A66C2\] {
    --tw-bg-opacity: 1;
    background-color: #0a66c2;
    background-color: rgb(10 102 194/var(--tw-bg-opacity))
}

.bg-\[\#151414\] {
    --tw-bg-opacity: 1;
    background-color: #151414;
    background-color: rgb(21 20 20/var(--tw-bg-opacity))
}

.bg-\[\#171717\] {
    --tw-bg-opacity: 1;
    background-color: #171717;
    background-color: rgb(23 23 23/var(--tw-bg-opacity))
}

.bg-\[\#181818\] {
    --tw-bg-opacity: 1;
    background-color: #181818;
    background-color: rgb(24 24 24/var(--tw-bg-opacity))
}

.bg-\[\#1877F2\] {
    --tw-bg-opacity: 1;
    background-color: #1877f2;
    background-color: rgb(24 119 242/var(--tw-bg-opacity))
}

.bg-\[\#1DA1F2\] {
    --tw-bg-opacity: 1;
    background-color: #1da1f2;
    background-color: rgb(29 161 242/var(--tw-bg-opacity))
}

.bg-\[\#202020\] {
    --tw-bg-opacity: 1;
    background-color: #202020;
    background-color: rgb(32 32 32/var(--tw-bg-opacity))
}

.bg-\[\#222222\] {
    --tw-bg-opacity: 1;
    background-color: #222;
    background-color: rgb(34 34 34/var(--tw-bg-opacity))
}

.bg-\[\#424040\] {
    --tw-bg-opacity: 1;
    background-color: #424040;
    background-color: rgb(66 64 64/var(--tw-bg-opacity))
}

.bg-\[\#A3765D\] {
    --tw-bg-opacity: 1;
    background-color: #a3765d;
    background-color: rgb(163 118 93/var(--tw-bg-opacity))
}

.bg-\[\#c58560\] {
    --tw-bg-opacity: 1;
    background-color: #c58560;
    background-color: rgb(197 133 96/var(--tw-bg-opacity))
}

.bg-\[\#d9534f\] {
    --tw-bg-opacity: 1;
    background-color: #d9534f;
    background-color: rgb(217 83 79/var(--tw-bg-opacity))
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: #000;
    background-color: rgb(0 0 0/var(--tw-bg-opacity))
}

.bg-black\/90 {
    background-color: rgba(0,0,0,.9)
}

.bg-blue-800 {
    --tw-bg-opacity: 1;
    background-color: #1e40af;
    background-color: rgb(30 64 175/var(--tw-bg-opacity))
}

.bg-gray-50 {
    --tw-bg-opacity: 1;
    background-color: #f9fafb;
    background-color: rgb(249 250 251/var(--tw-bg-opacity))
}

.bg-neutral-600 {
    --tw-bg-opacity: 1;
    background-color: #525252;
    background-color: rgb(82 82 82/var(--tw-bg-opacity))
}

.bg-neutral-700 {
    --tw-bg-opacity: 1;
    background-color: #404040;
    background-color: rgb(64 64 64/var(--tw-bg-opacity))
}

.bg-neutral-800 {
    --tw-bg-opacity: 1;
    background-color: #262626;
    background-color: rgb(38 38 38/var(--tw-bg-opacity))
}

.bg-red-800 {
    --tw-bg-opacity: 1;
    background-color: #991b1b;
    background-color: rgb(153 27 27/var(--tw-bg-opacity))
}

.bg-transparent {
    background-color: transparent
}

.bg-white {
    --tw-bg-opacity: 1;
    background-color: #fff;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.bg-zinc-600 {
    --tw-bg-opacity: 1;
    background-color: #52525b;
    background-color: rgb(82 82 91/var(--tw-bg-opacity))
}

.bg-zinc-700 {
    --tw-bg-opacity: 1;
    background-color: #3f3f46;
    background-color: rgb(63 63 70/var(--tw-bg-opacity))
}

.bg-zinc-800 {
    --tw-bg-opacity: 1;
    background-color: #27272a;
    background-color: rgb(39 39 42/var(--tw-bg-opacity))
}

.bg-zinc-900 {
    --tw-bg-opacity: 1;
    background-color: #18181b;
    background-color: rgb(24 24 27/var(--tw-bg-opacity))
}

.bg-zinc-950 {
    --tw-bg-opacity: 1;
    background-color: #09090b;
    background-color: rgb(9 9 11/var(--tw-bg-opacity))
}

.bg-opacity-75 {
    --tw-bg-opacity: 0.75
}

.bg-gradient-to-b {
    background-image: linear-gradient(to bottom,var(--tw-gradient-stops))
}

.from-transparent {
    --tw-gradient-from: transparent var(--tw-gradient-from-position);
    --tw-gradient-to: transparent var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to)
}

.to-black {
    --tw-gradient-to: #000 var(--tw-gradient-to-position)
}

.fill-zinc-300 {
    fill: #d4d4d8
}

.object-contain {
    -o-object-fit: contain;
    object-fit: contain
}

.object-cover {
    -o-object-fit: cover;
    object-fit: cover
}

.object-center {
    -o-object-position: center;
    object-position: center
}

.p-1 {
    padding: .25rem
}

.p-1\.5 {
    padding: .375rem
}

.p-10 {
    padding: 2.5rem
}

.p-2 {
    padding: .5rem
}

.p-2\.5 {
    padding: .625rem
}

.p-3 {
    padding: .75rem
}

.p-4 {
    padding: 1rem
}

.p-6 {
    padding: 1.5rem
}

.px-0 {
    padding-left: 0;
    padding-right: 0
}

.px-1 {
    padding-left: .25rem;
    padding-right: .25rem
}

.px-1\.5 {
    padding-left: .375rem;
    padding-right: .375rem
}

.px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem
}

.px-2 {
    padding-left: .5rem;
    padding-right: .5rem
}

.px-2\.5 {
    padding-left: .625rem;
    padding-right: .625rem
}

.px-3 {
    padding-left: .75rem;
    padding-right: .75rem
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem
}

.px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.py-0 {
    padding-bottom: 0;
    padding-top: 0
}

.py-1 {
    padding-bottom: .25rem;
    padding-top: .25rem
}

.py-1\.5 {
    padding-bottom: .375rem;
    padding-top: .375rem
}

.py-10 {
    padding-bottom: 2.5rem;
    padding-top: 2.5rem
}

.py-2 {
    padding-bottom: .5rem;
    padding-top: .5rem
}

.py-2\.5 {
    padding-bottom: .625rem;
    padding-top: .625rem
}

.py-3 {
    padding-bottom: .75rem;
    padding-top: .75rem
}

.py-4 {
    padding-bottom: 1rem;
    padding-top: 1rem
}

.py-5 {
    padding-bottom: 1.25rem;
    padding-top: 1.25rem
}

.py-6 {
    padding-bottom: 1.5rem;
    padding-top: 1.5rem
}

.py-\[3px\] {
    padding-bottom: 3px;
    padding-top: 3px
}

.py-\[4px\] {
    padding-bottom: 4px;
    padding-top: 4px
}

.py-\[8px\] {
    padding-bottom: 8px;
    padding-top: 8px
}

.pb-1 {
    padding-bottom: .25rem
}

.pb-10 {
    padding-bottom: 2.5rem
}

.pb-2 {
    padding-bottom: .5rem
}

.pb-3 {
    padding-bottom: .75rem
}

.pb-4 {
    padding-bottom: 1rem
}

.pb-8 {
    padding-bottom: 2rem
}

.pl-1 {
    padding-left: .25rem
}

.pl-2 {
    padding-left: .5rem
}

.pl-3 {
    padding-left: .75rem
}

.pl-4 {
    padding-left: 1rem
}

.pr-10 {
    padding-right: 2.5rem
}

.pr-2 {
    padding-right: .5rem
}

.pr-4 {
    padding-right: 1rem
}

.pt-1 {
    padding-top: .25rem
}

.pt-2 {
    padding-top: .5rem
}

.pt-3 {
    padding-top: .75rem
}

.pt-4 {
    padding-top: 1rem
}

.pt-5 {
    padding-top: 1.25rem
}

.pt-6 {
    padding-top: 1.5rem
}

.pt-\[2px\] {
    padding-top: 2px
}

.pt-\[4px\] {
    padding-top: 4px
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.text-justify {
    text-align: justify
}

.align-middle {
    vertical-align: middle
}

.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem
}

.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem
}

.text-\[13px\] {
    font-size: 13px
}

.text-\[14px\] {
    font-size: 14px
}

.text-\[15px\] {
    font-size: 15px
}

.text-base {
    font-size: 1rem;
    line-height: 1.5rem
}

.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem
}

.text-sm {
    font-size: .875rem;
    line-height: 1.25rem
}

.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem
}

.text-xs {
    font-size: .75rem;
    line-height: 1rem
}

.font-bold {
    font-weight: 700
}

.font-light {
    font-weight: 300
}

.font-medium {
    font-weight: 500
}

.font-normal {
    font-weight: 400
}

.font-semibold {
    font-weight: 600
}

.uppercase {
    text-transform: uppercase
}

.capitalize {
    text-transform: capitalize
}

.italic {
    font-style: italic
}

.leading-6 {
    line-height: 1.5rem
}

.leading-7 {
    line-height: 1.75rem
}

.leading-normal {
    line-height: 1.5
}

.leading-relaxed {
    line-height: 1.625
}

.leading-tight {
    line-height: 1.25
}

.tracking-tight {
    letter-spacing: -.025em
}

.tracking-wide {
    letter-spacing: .025em
}

.tracking-wider {
    letter-spacing: .05em
}

.text-\[\#d98a5e\] {
    --tw-text-opacity: 1;
    color: #d98a5e;
    color: rgb(217 138 94/var(--tw-text-opacity))
}

.text-blue-500 {
    --tw-text-opacity: 1;
    color: #3b82f6;
    color: rgb(59 130 246/var(--tw-text-opacity))
}

.text-blue-600 {
    --tw-text-opacity: 1;
    color: #2563eb;
    color: rgb(37 99 235/var(--tw-text-opacity))
}

.text-gray-100 {
    --tw-text-opacity: 1;
    color: #f3f4f6;
    color: rgb(243 244 246/var(--tw-text-opacity))
}

.text-gray-200 {
    --tw-text-opacity: 1;
    color: #e5e7eb;
    color: rgb(229 231 235/var(--tw-text-opacity))
}

.text-gray-300 {
    --tw-text-opacity: 1;
    color: #d1d5db;
    color: rgb(209 213 219/var(--tw-text-opacity))
}

.text-gray-400 {
    --tw-text-opacity: 1;
    color: #9ca3af;
    color: rgb(156 163 175/var(--tw-text-opacity))
}

.text-gray-50 {
    --tw-text-opacity: 1;
    color: #f9fafb;
    color: rgb(249 250 251/var(--tw-text-opacity))
}

.text-gray-500 {
    --tw-text-opacity: 1;
    color: #6b7280;
    color: rgb(107 114 128/var(--tw-text-opacity))
}

.text-gray-600 {
    --tw-text-opacity: 1;
    color: #4b5563;
    color: rgb(75 85 99/var(--tw-text-opacity))
}

.text-gray-700 {
    --tw-text-opacity: 1;
    color: #374151;
    color: rgb(55 65 81/var(--tw-text-opacity))
}

.text-gray-900 {
    --tw-text-opacity: 1;
    color: #111827;
    color: rgb(17 24 39/var(--tw-text-opacity))
}

.text-green-600 {
    --tw-text-opacity: 1;
    color: #16a34a;
    color: rgb(22 163 74/var(--tw-text-opacity))
}

.text-red-600 {
    --tw-text-opacity: 1;
    color: #dc2626;
    color: rgb(220 38 38/var(--tw-text-opacity))
}

.text-white {
    --tw-text-opacity: 1;
    color: #fff;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.text-yellow-500 {
    --tw-text-opacity: 1;
    color: #eab308;
    color: rgb(234 179 8/var(--tw-text-opacity))
}

.text-yellow-600 {
    --tw-text-opacity: 1;
    color: #ca8a04;
    color: rgb(202 138 4/var(--tw-text-opacity))
}

.text-zinc-200 {
    --tw-text-opacity: 1;
    color: #e4e4e7;
    color: rgb(228 228 231/var(--tw-text-opacity))
}

.text-zinc-300 {
    --tw-text-opacity: 1;
    color: #d4d4d8;
    color: rgb(212 212 216/var(--tw-text-opacity))
}

.text-zinc-400 {
    --tw-text-opacity: 1;
    color: #a1a1aa;
    color: rgb(161 161 170/var(--tw-text-opacity))
}

.text-zinc-500 {
    --tw-text-opacity: 1;
    color: #71717a;
    color: rgb(113 113 122/var(--tw-text-opacity))
}

.text-zinc-700 {
    --tw-text-opacity: 1;
    color: #3f3f46;
    color: rgb(63 63 70/var(--tw-text-opacity))
}

.antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.placeholder-zinc-400::-moz-placeholder {
    --tw-placeholder-opacity: 1;
    color: #a1a1aa;
    color: rgb(161 161 170/var(--tw-placeholder-opacity))
}

.placeholder-zinc-400::placeholder {
    --tw-placeholder-opacity: 1;
    color: #a1a1aa;
    color: rgb(161 161 170/var(--tw-placeholder-opacity))
}

.opacity-0 {
    opacity: 0
}

.opacity-100 {
    opacity: 1
}

.opacity-25 {
    opacity: .25
}

.opacity-75 {
    opacity: .75
}

.shadow {
    --tw-shadow: 0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: 0 0 #0000,0 0 #0000,0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.shadow-lg {
    --tw-shadow: 0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: 0 0 #0000,0 0 #0000,0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.shadow-md {
    --tw-shadow: 0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: 0 0 #0000,0 0 #0000,0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.shadow-sm {
    --tw-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: 0 0 #0000,0 0 #0000,0 1px 2px 0 rgba(0,0,0,.05);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.shadow-xl {
    --tw-shadow: 0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: 0 0 #0000,0 0 #0000,0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.shadow-black\/20 {
    --tw-shadow-color: rgba(0,0,0,.2);
    --tw-shadow: var(--tw-shadow-colored)
}

.shadow-red-900\/20 {
    --tw-shadow-color: rgba(127,29,29,.2);
    --tw-shadow: var(--tw-shadow-colored)
}

.ring-1 {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color),var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color),0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)
}

.ring-black {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(0 0 0/var(--tw-ring-opacity))
}

.ring-opacity-5 {
    --tw-ring-opacity: 0.05
}

.filter {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.transition {
    transition-duration: .15s;
    transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;
    transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;
    transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(.4,0,.2,1)
}

.transition-all {
    transition-duration: .15s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1)
}

.transition-opacity {
    transition-duration: .15s;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.4,0,.2,1)
}

.duration-100 {
    transition-duration: .1s
}

.duration-200 {
    transition-duration: .2s
}

.duration-300 {
    transition-duration: .3s
}

.ease-in {
    transition-timing-function: cubic-bezier(.4,0,1,1)
}

.ease-in-out {
    transition-timing-function: cubic-bezier(.4,0,.2,1)
}

.ease-linear {
    transition-timing-function: linear
}

.ease-out {
    transition-timing-function: cubic-bezier(0,0,.2,1)
}

.last\:mr-0:last-child {
    margin-right: 0
}

.visited\:bg-zinc-800:visited {
    background-color: #27272a
}

.read-only\:border-zinc-700:-moz-read-only {
    --tw-border-opacity: 1;
    border-color: #3f3f46;
    border-color: rgb(63 63 70/var(--tw-border-opacity))
}

.read-only\:border-zinc-700:read-only {
    --tw-border-opacity: 1;
    border-color: #3f3f46;
    border-color: rgb(63 63 70/var(--tw-border-opacity))
}

.read-only\:bg-zinc-400:-moz-read-only {
    --tw-bg-opacity: 1;
    background-color: #a1a1aa;
    background-color: rgb(161 161 170/var(--tw-bg-opacity))
}

.read-only\:bg-zinc-400:read-only {
    --tw-bg-opacity: 1;
    background-color: #a1a1aa;
    background-color: rgb(161 161 170/var(--tw-bg-opacity))
}

.hover\:scale-105:hover {
    --tw-scale-x: 1.05;
    --tw-scale-y: 1.05;
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(1.05) scaleY(1.05);
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.hover\:bg-\[\#050708\]\/90:hover {
    background-color: rgba(5,7,8,.9)
}

.hover\:bg-neutral-600:hover {
    --tw-bg-opacity: 1;
    background-color: #525252;
    background-color: rgb(82 82 82/var(--tw-bg-opacity))
}

.hover\:bg-neutral-700:hover {
    --tw-bg-opacity: 1;
    background-color: #404040;
    background-color: rgb(64 64 64/var(--tw-bg-opacity))
}

.hover\:bg-zinc-200:hover {
    --tw-bg-opacity: 1;
    background-color: #e4e4e7;
    background-color: rgb(228 228 231/var(--tw-bg-opacity))
}

.hover\:bg-zinc-600:hover {
    --tw-bg-opacity: 1;
    background-color: #52525b;
    background-color: rgb(82 82 91/var(--tw-bg-opacity))
}

.hover\:bg-zinc-700:hover {
    --tw-bg-opacity: 1;
    background-color: #3f3f46;
    background-color: rgb(63 63 70/var(--tw-bg-opacity))
}

.hover\:bg-zinc-800:hover {
    --tw-bg-opacity: 1;
    background-color: #27272a;
    background-color: rgb(39 39 42/var(--tw-bg-opacity))
}

.hover\:bg-zinc-900:hover {
    --tw-bg-opacity: 1;
    background-color: #18181b;
    background-color: rgb(24 24 27/var(--tw-bg-opacity))
}

.hover\:text-\[\#d98a5e\]:hover {
    --tw-text-opacity: 1;
    color: #d98a5e;
    color: rgb(217 138 94/var(--tw-text-opacity))
}

.hover\:text-\[\#e57131\]:hover {
    --tw-text-opacity: 1;
    color: #e57131;
    color: rgb(229 113 49/var(--tw-text-opacity))
}

.hover\:text-blue-200:hover {
    --tw-text-opacity: 1;
    color: #bfdbfe;
    color: rgb(191 219 254/var(--tw-text-opacity))
}

.hover\:text-blue-600:hover {
    --tw-text-opacity: 1;
    color: #2563eb;
    color: rgb(37 99 235/var(--tw-text-opacity))
}

.hover\:text-blue-700:hover {
    --tw-text-opacity: 1;
    color: #1d4ed8;
    color: rgb(29 78 216/var(--tw-text-opacity))
}

.hover\:text-white:hover {
    --tw-text-opacity: 1;
    color: #fff;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.hover\:text-zinc-400:hover {
    --tw-text-opacity: 1;
    color: #a1a1aa;
    color: rgb(161 161 170/var(--tw-text-opacity))
}

.hover\:underline:hover {
    text-decoration-line: underline
}

.hover\:opacity-80:hover {
    opacity: .8
}

.hover\:opacity-90:hover {
    opacity: .9
}

.hover\:shadow-lg:hover {
    --tw-shadow: 0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: 0 0 #0000,0 0 #0000,0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.focus\:border-zinc-800:focus {
    --tw-border-opacity: 1;
    border-color: #27272a;
    border-color: rgb(39 39 42/var(--tw-border-opacity))
}

.focus\:bg-zinc-800:focus {
    --tw-bg-opacity: 1;
    background-color: #27272a;
    background-color: rgb(39 39 42/var(--tw-bg-opacity))
}

.focus\:outline-none:focus {
    outline: 2px solid transparent;
    outline-offset: 2px
}

.focus\:ring-0:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color),var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color),0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)
}

.focus\:ring-4:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color),var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color),0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)
}

.focus\:ring-\[\#050708\]\/50:focus {
    --tw-ring-color: rgba(5,7,8,.5)
}

.focus-visible\:ring-opacity-75:focus-visible {
    --tw-ring-opacity: 0.75
}

.focus-visible\:ring-offset-orange-300:focus-visible {
    --tw-ring-offset-color: #fdba74
}

.group:hover .group-hover\:scale-110 {
    --tw-scale-x: 1.1;
    --tw-scale-y: 1.1;
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(1.1) scaleY(1.1);
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.group:hover .group-hover\:text-blue-600 {
    --tw-text-opacity: 1;
    color: #2563eb;
    color: rgb(37 99 235/var(--tw-text-opacity))
}

:is([dir=rtl] .rtl\:space-x-reverse)>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 1
}

@media (prefers-color-scheme: dark) {
    .dark\:border-gray-600 {
        --tw-border-opacity:1;
        border-color: #4b5563;
        border-color: rgb(75 85 99/var(--tw-border-opacity))
    }

    .dark\:bg-gray-800 {
        --tw-bg-opacity: 1;
        background-color: #1f2937;
        background-color: rgb(31 41 55/var(--tw-bg-opacity))
    }

    .dark\:text-gray-100 {
        --tw-text-opacity: 1;
        color: #f3f4f6;
        color: rgb(243 244 246/var(--tw-text-opacity))
    }

    .dark\:text-gray-300 {
        --tw-text-opacity: 1;
        color: #d1d5db;
        color: rgb(209 213 219/var(--tw-text-opacity))
    }

    .dark\:text-gray-400 {
        --tw-text-opacity: 1;
        color: #9ca3af;
        color: rgb(156 163 175/var(--tw-text-opacity))
    }

    .dark\:text-white {
        --tw-text-opacity: 1;
        color: #fff;
        color: rgb(255 255 255/var(--tw-text-opacity))
    }
}

@media (min-width: 640px) {
    .sm\:col-span-2 {
        grid-column:span 2/span 2
    }

    .sm\:col-span-3 {
        grid-column: span 3/span 3
    }

    .sm\:col-span-9 {
        grid-column: span 9/span 9
    }

    .sm\:my-8 {
        margin-bottom: 2rem;
        margin-top: 2rem
    }

    .sm\:mb-5 {
        margin-bottom: 1.25rem
    }

    .sm\:ml-3 {
        margin-left: .75rem
    }

    .sm\:ml-4 {
        margin-left: 1rem
    }

    .sm\:mt-0 {
        margin-top: 0
    }

    .sm\:block {
        display: block
    }

    .sm\:flex {
        display: flex
    }

    .sm\:h-9 {
        height: 2.25rem
    }

    .sm\:w-1\/4 {
        width: 25%
    }

    .sm\:w-48 {
        width: 12rem
    }

    .sm\:w-64 {
        width: 16rem
    }

    .sm\:w-72 {
        width: 18rem
    }

    .sm\:w-auto {
        width: auto
    }

    .sm\:w-full {
        width: 100%
    }

    .sm\:max-w-lg {
        max-width: 32rem
    }

    .sm\:max-w-md {
        max-width: 28rem
    }

    .sm\:translate-y-0 {
        --tw-translate-y: 0px;
        transform: translate(var(--tw-translate-x)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    .sm\:scale-100 {
        --tw-scale-x: 1;
        --tw-scale-y: 1;
        transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(1) scaleY(1);
        transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    .sm\:scale-95 {
        --tw-scale-x: .95;
        --tw-scale-y: .95;
        transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(.95) scaleY(.95);
        transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    .sm\:grid-cols-2 {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }

    .sm\:flex-row-reverse {
        flex-direction: row-reverse
    }

    .sm\:items-center {
        align-items: center
    }

    .sm\:gap-10 {
        gap: 2.5rem
    }

    .sm\:gap-6 {
        gap: 1.5rem
    }

    .sm\:gap-x-10 {
        -moz-column-gap: 2.5rem;
        column-gap: 2.5rem
    }

    .sm\:gap-x-4 {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .sm\:rounded-md {
        border-radius: .375rem
    }

    .sm\:p-0 {
        padding: 0
    }

    .sm\:p-10 {
        padding: 2.5rem
    }

    .sm\:p-4 {
        padding: 1rem
    }

    .sm\:p-8 {
        padding: 2rem
    }

    .sm\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem
    }

    .sm\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }

    .sm\:py-6 {
        padding-bottom: 1.5rem;
        padding-top: 1.5rem
    }

    .sm\:pb-4 {
        padding-bottom: 1rem
    }

    .sm\:text-left {
        text-align: left
    }

    .sm\:text-sm {
        font-size: .875rem;
        line-height: 1.25rem
    }

    @media (min-width: 768px) {
        .sm\:md\:grid-cols-3 {
            grid-template-columns:repeat(3,minmax(0,1fr))
        }
    }
}

@media (min-width: 768px) {
    .md\:inset-0 {
        inset:0
    }

    .md\:order-2 {
        order: 2
    }

    .md\:me-0 {
        margin-inline-end:0}

    .md\:mt-0 {
        margin-top: 0
    }

    .md\:block {
        display: block
    }

    .md\:flex {
        display: flex
    }

    .md\:hidden {
        display: none
    }

    .md\:h-5 {
        height: 1.25rem
    }

    .md\:h-80 {
        height: 20rem
    }

    .md\:w-1\/5 {
        width: 20%
    }

    .md\:w-4\/12 {
        width: 33.333333%
    }

    .md\:w-5 {
        width: 1.25rem
    }

    .md\:w-8\/12 {
        width: 66.666667%
    }

    .md\:w-full {
        width: 100%
    }

    .md\:basis-full {
        flex-basis: 100%
    }

    .md\:grid-cols-2 {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }

    .md\:grid-cols-3 {
        grid-template-columns: repeat(3,minmax(0,1fr))
    }

    .md\:grid-cols-4 {
        grid-template-columns: repeat(4,minmax(0,1fr))
    }

    .md\:grid-cols-5 {
        grid-template-columns: repeat(5,minmax(0,1fr))
    }

    .md\:gap-2 {
        gap: .5rem
    }

    .md\:gap-x-4 {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .md\:gap-x-8 {
        -moz-column-gap: 2rem;
        column-gap: 2rem
    }

    .md\:space-x-0>:not([hidden])~:not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-left: 0;
        margin-left: calc(0px*(1 - var(--tw-space-x-reverse)));
        margin-right: 0;
        margin-right: calc(0px*var(--tw-space-x-reverse))
    }

    .md\:space-x-3>:not([hidden])~:not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-left: .75rem;
        margin-left: calc(.75rem*(1 - var(--tw-space-x-reverse)));
        margin-right: 0;
        margin-right: calc(.75rem*var(--tw-space-x-reverse))
    }

    .md\:space-y-6>:not([hidden])~:not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-bottom: 0;
        margin-bottom: calc(1.5rem*var(--tw-space-y-reverse));
        margin-top: 1.5rem;
        margin-top: calc(1.5rem*(1 - var(--tw-space-y-reverse)))
    }

    .md\:rounded-lg {
        border-radius: .5rem
    }

    .md\:p-2 {
        padding: .5rem
    }

    .md\:p-5 {
        padding: 1.25rem
    }

    .md\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }

    .md\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem
    }

    .md\:pt-0 {
        padding-top: 0
    }

    .md\:pt-6 {
        padding-top: 1.5rem
    }

    .md\:text-xl {
        font-size: 1.25rem;
        line-height: 1.75rem
    }
}

@media (min-width: 1024px) {
    .lg\:col-span-3 {
        grid-column:span 3/span 3
    }

    .lg\:col-span-9 {
        grid-column: span 9/span 9
    }

    .lg\:ml-14 {
        margin-left: 3.5rem
    }

    .lg\:block {
        display: block
    }

    .lg\:flex {
        display: flex
    }

    .lg\:w-1\/3 {
        width: 33.333333%
    }

    .lg\:w-2\/3 {
        width: 66.666667%
    }

    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4,minmax(0,1fr))
    }

    .lg\:flex-row {
        flex-direction: row;
        padding: 0 130px;
        margin-top: 50px;
    }

    .lg\:justify-start {
        justify-content: flex-start
    }

    .lg\:space-x-4>:not([hidden])~:not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-left: 1rem;
        margin-left: calc(1rem*(1 - var(--tw-space-x-reverse)));
        margin-right: 0;
        margin-right: calc(1rem*var(--tw-space-x-reverse))
    }

    .lg\:space-y-0>:not([hidden])~:not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-bottom: 0;
        margin-bottom: calc(0px*var(--tw-space-y-reverse));
        margin-top: 0;
        margin-top: calc(0px*(1 - var(--tw-space-y-reverse)))
    }

    .lg\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }

    .lg\:py-0 {
        padding-bottom: 0;
        padding-top: 0
    }
}

@media (min-width: 1280px) {
    .xl\:w-1\/5 {
        width:20%
    }

    .xl\:grid-cols-4 {
        grid-template-columns: repeat(4,minmax(0,1fr))
    }

    .xl\:space-x-8>:not([hidden])~:not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-left: 2rem;
        margin-left: calc(2rem*(1 - var(--tw-space-x-reverse)));
        margin-right: 0;
        margin-right: calc(2rem*var(--tw-space-x-reverse))
    }

    .xl\:p-0 {
        padding: 0
    }

    .xl\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }
}
/*End Taiwind css*/