.nav-search-container .container-list-search.show {
    width: 100%;
    height: 450px;
}

body.theme-white.theme-sunset #foot-menu {
    background: #F8F1E4;
}

.foot-menu {
    display: flex;
    justify-content: space-evenly;
    margin: 0 auto;
}

#foot-menu * {
    -webkit-font-smoothing: auto;
}

.foot-menu a {
    display: flex;
    flex-direction: column;
    color: rgba(0, 0, 0, 0.9);
    align-items: center;
}

#foot-menu h3.footer-link {
    font-weight: normal;
}

.foot-menu i {
    font-size: 1.6rem;
}

.foot-menu img {
    max-width: 1.7rem;
}

body.theme-dark .foot-menu img.mode-dark {
    display: block;
}

body.theme-dark .foot-menu img.mode-white {
    display: none;
}

body.theme-white .foot-menu img.mode-dark,
body.theme-sunset .foot-menu img.mode-dark {
    display: none;
}

body.theme-white .foot-menu img.mode-white,
body.theme-sunset .foot-menu img.mode-white {
    display: block;
}

body.theme-dark .contact-link img.mode-dark {
    display: block;
}

body.theme-dark .contact-link img.mode-white {
    display: none;
}

body.theme-white .contact-link img.mode-dark,
body.theme-sunset .contact-link img.mode-dark {
    display: none;
}

body.theme-white .contact-link img.mode-white,
body.theme-sunset .contact-link img.mode-white {
    display: block;
}

.foot-menu span {
    margin-top: .3rem;
    font-size: .9rem;
}

.footer-desc {
    margin-top: 1.5rem;
    border-bottom: 1px solid rgb(204, 204, 204);
    padding: .5rem 0;
}

.footer-desc b {
    color: rgba(0, 0, 0, 0.9);
    font-size: 1rem;
}

.footer-desc p {
    color: rgba(0, 0, 0, .7);
    font-size: .9rem;
    padding: 1rem 0;
    line-height: normal;
}

.footer-link {
    display: flex;
    flex-direction: column;
}

.footer-link a {
    font-size: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid rgb(204, 204, 204);
}

.footer-link span {
    color: rgba(0, 0, 0, .5);
}

.contact-link {
    padding: 1rem 0 2.5rem;
    border-bottom: 1px solid rgb(204, 204, 204);
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact-link img {
    max-width: 2rem;
    margin: 0 1rem;
}

.contact-link i {
    font-size: 1.6rem;
    margin: 0 1rem;
}

.line-container {
    width: 100%;
    height: 1px;
    background-color: #aca4a4;
    margin: 2rem 0;
}

body.theme-dark .line-container {
    background-color: #444444;
}

body.theme-dark .foot-menu a {
    color: #fff;
}

body.theme-dark .footer-desc b {
    color: #fff;
}

body.theme-dark .footer-desc p {
    color: rgba(255, 255, 255, .7);
}

body.theme-dark .footer-link span {
    color: rgba(255, 255, 255, .5);
}

body.theme-dark .footer-link a {
    border-bottom: 1px solid rgb(68, 68, 68);
}

body.theme-dark .footer-desc {
    border-bottom: 1px solid rgb(68, 68, 68);
}

body.theme-dark .contact-link {
    border-bottom: 1px solid rgb(68, 68, 68);
}

@media(max-width: 767px) {
    .footer-desc b {
        font-size: 1.2rem
    }

    .foot-menu img {
        max-width: 1.5rem;
    }

    .footer-desc p {
        padding: .5rem 0;
    }

    .contact-link img {
        max-width: 2.25rem;
    }

    .contact-link i {
        margin: 0 .8rem;
    }
}
        /* xf1106 IOS26适配 start */
        .adspop .popup-container {
            position: fixed;
            top: 50%;
            left: 0;
            right: 0;
            bottom: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 9999;
            transform: translateY(-50%);
        }

        /* xf1106 IOS26适配 end */
        .adspop .popup-container .popup-content {
            max-width: 80vw;
            width: 100%;
            max-height: 80vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center
        }

        .adspop .popup-container .popup-close {
            width: 42px;
            height: 42px;
            margin-bottom: 30px
        }

        .adspop .popup-container .popup-close img {
            width: 100%;
            height: 100%
        }

        .adspop .popup-container .popup-picture {
            width: 100%;
            height: 100%;
            text-align: center
        }

        .adspop .popup-container .popup-picture img {
            max-width: 50vw;
            max-height: 70vh
        }

        @media screen and (max-width:768px) {
            .adspop .popup-container .popup-picture img {
                max-width: 80vw;
                width: 100%
            }
        }

        .application-popup {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0, 0, 0, .6);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 9999
        }

        .application-popup .application-content {
            max-width: 400px;
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center
        }

        .application-popup .application-header img {
            max-width: 510px;
            width: 100%;
            vertical-align: top
        }

        .application-popup .application-list {
            max-width: 510px;
            width: 100%;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-template-rows: repeat(5, 1fr);
            gap: 10px;
            background: linear-gradient(-45deg, #000, #313131);
            padding: 15px 10px;
            border-bottom-left-radius: 35px;
            border-bottom-right-radius: 35px;
            box-sizing: border-box
        }

        .application-popup .application-list a {
            text-decoration: none;
            box-sizing: border-box;
            color: #fff;
            text-align: center
        }

        .application-popup .application-list a img {
            width: 2.8rem;
            height: 2.8rem;
            position: relative;
            border-radius: 9px;
        }

        .application-popup .application-list a img::before {
            content: "";
            display: block
        }

        .application-popup .application-list a img::after {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-size: 100%;
            background-color: #353535
        }

        .application-popup .application-list a p {
            font-size: 12px;
            white-space: nowrap;
            margin-top: 0.3rem;
        }

        @media (max-width:767.98px) {
            .application-popup .application-content {
                max-width: 80vw
            }
        }

        /* Font - Open Sans */
        @font-face {
            font-family: 'Open Sans';
            font-style: normal;
            font-weight: 300;
            font-display: fallback;
            src: local('Open Sans Light'),
                local('OpenSans-Light'),
                url(/usr/themes/Mirages/fonts/OpenSans/300.woff2) format('woff2'),
                url(/usr/themes/Mirages/fonts/OpenSans/300.woff) format('woff');
        }

        @font-face {
            font-family: 'Open Sans';
            font-style: italic;
            font-weight: 300;
            font-display: fallback;
            src: local('Open Sans Light Italic'),
                local('OpenSansLight-Italic'),
                url(/usr/themes/Mirages/fonts/OpenSans/300i.woff2) format('woff2'),
                url(/usr/themes/Mirages/fonts/OpenSans/300i.woff) format('woff');
        }

        @font-face {
            font-family: 'Open Sans';
            font-style: normal;
            font-weight: 400;
            font-display: fallback;
            src: local('Open Sans'),
                local('OpenSans'),
                url(/usr/themes/Mirages/fonts/OpenSans/400.woff2) format('woff2'),
                url(/usr/themes/Mirages/fonts/OpenSans/400.woff) format('woff');
        }

        @font-face {
            font-family: 'Open Sans';
            font-style: italic;
            font-weight: 400;
            font-display: fallback;
            src: local('Open Sans Italic'),
                local('OpenSans-Italic'),
                url(/usr/themes/Mirages/fonts/OpenSans/400i.woff2) format('woff2'),
                url(/usr/themes/Mirages/fonts/OpenSans/400i.woff) format('woff');
        }

        /* Lora */
        @font-face {
            font-family: 'Lora';
            font-style: normal;
            font-weight: 400;
            font-display: fallback;
            src:
                local('Lora Regular'),
                local('Lora-Regular'),
                url(/usr/themes/Mirages/fonts/Lora/400.woff2) format('woff2'),
                url(/usr/themes/Mirages/fonts/Lora/400.woff) format('woff');
            unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
        }

        @font-face {
            font-family: 'Lora';
            font-style: normal;
            font-weight: 700;
            font-display: fallback;
            src:
                local('Lora Bold'),
                local('Lora-Bold'),
                url(/usr/themes/Mirages/fonts/Lora/700.woff2) format('woff2'),
                url(/usr/themes/Mirages/fonts/Lora/700.woff) format('woff');
            unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
        }
                body,
        button,
        input,
        optgroup,
        select,
        textarea {
            font-family: 'Mirages Custom', 'Merriweather', 'Open Sans', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei', 'Segoe UI Emoji', 'Segoe UI Symbol', Helvetica, Arial, sans-serif;
        }

        .github-box,
        .github-box .github-box-title h3 {
            font-family: 'Mirages Custom', 'Merriweather', 'Open Sans', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei', 'Segoe UI Emoji', 'Segoe UI Symbol', Helvetica, Arial, sans-serif !important;
        }

        .aplayer {
            font-family: 'Mirages Custom', 'Myriad Pro', 'Myriad Set Pro', 'Open Sans', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei', Helvetica, arial, sans-serif !important;
        }

        /* Serif */
        body.content-lang-en.content-serif .post-content {
            font-family: 'Lora', 'PT Serif', 'Source Serif Pro', Georgia, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei', serif;
        }

        body.content-lang-en.content-serif.serif-fonts .post-content {
            font-family: 'Lora', 'PT Serif', 'Source Serif Pro', 'Noto Serif CJK SC', 'Noto Serif CJK', 'Noto Serif SC', 'Source Han Serif SC', 'Source Han Serif', 'source-han-serif-sc', 'PT Serif', 'SongTi SC', 'MicroSoft Yahei', serif;
        }

        body.serif-fonts .post-content,
        body.serif-fonts .blog-title {
            font-family: 'Noto Serif CJK SC', 'Noto Serif CJK', 'Noto Serif SC', 'Source Han Serif SC', 'Source Han Serif', 'source-han-serif-sc', 'PT Serif', 'SongTi SC', 'MicroSoft Yahei', Georgia, serif;
        }

        .dark-mode-state-indicator {
            position: absolute;
            top: -999em;
            left: -999em;

            z-index: 1;
        }

        @media (prefers-color-scheme: dark) {
            .dark-mode-state-indicator {
                z-index: 11;
            }
        }
        /** 页面样式调整 */
        .post-buttons a {
            width: -webkit-calc(100% / 2 - .3125rem);
            width: calc(100% / 2 - .3125rem);
        }
        :root {
            --balloon-border-radius: 2px;
            --balloon-color: rgba(16, 16, 16, 0.95);
            --balloon-text-color: #fff;
            --balloon-font-size: 12px;
            --balloon-move: 4px;
        }

        button[aria-label][data-balloon-pos] {
            overflow: visible;
        }

        [aria-label][data-balloon-pos] {
            position: relative;
            cursor: pointer;
        }

        [aria-label][data-balloon-pos]:after {
            opacity: 0;
            pointer-events: none;
            transition: all 0.18s ease-out 0.18s;
            text-indent: 0;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
            font-weight: normal;
            font-style: normal;
            text-shadow: none;
            font-size: 12px;
            font-size: var(--balloon-font-size);
            background: rgba(16, 16, 16, 0.95);
            background: var(--balloon-color);
            border-radius: 2px;
            color: #fff;
            color: var(--balloon-text-color);
            border-radius: var(--balloon-border-radius);
            content: attr(aria-label);
            padding: .5em 1em;
            position: absolute;
            white-space: nowrap;
            z-index: 10;
        }

        [aria-label][data-balloon-pos]:before {
            width: 0;
            height: 0;
            border: 5px solid transparent;
            border-top-color: rgba(16, 16, 16, 0.95);
            border-top-color: var(--balloon-color);
            opacity: 0;
            pointer-events: none;
            transition: all 0.18s ease-out 0.18s;
            content: "";
            position: absolute;
            z-index: 10;
        }

        [aria-label][data-balloon-pos]:hover:before,
        [aria-label][data-balloon-pos]:hover:after,
        [aria-label][data-balloon-pos][data-balloon-visible]:before,
        [aria-label][data-balloon-pos][data-balloon-visible]:after,
        [aria-label][data-balloon-pos]:not([data-balloon-nofocus]):focus:before,
        [aria-label][data-balloon-pos]:not([data-balloon-nofocus]):focus:after {
            opacity: 1;
            pointer-events: none;
        }

        [aria-label][data-balloon-pos].font-awesome:after {
            font-family: FontAwesome, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
        }

        [aria-label][data-balloon-pos][data-balloon-break]:after {
            white-space: pre;
        }

        [aria-label][data-balloon-pos][data-balloon-break][data-balloon-length]:after {
            white-space: pre-line;
            word-break: break-word;
        }

        [aria-label][data-balloon-pos][data-balloon-blunt]:before,
        [aria-label][data-balloon-pos][data-balloon-blunt]:after {
            transition: none;
        }

        [aria-label][data-balloon-pos][data-balloon-pos="up"]:hover:after,
        [aria-label][data-balloon-pos][data-balloon-pos="up"][data-balloon-visible]:after,
        [aria-label][data-balloon-pos][data-balloon-pos="down"]:hover:after,
        [aria-label][data-balloon-pos][data-balloon-pos="down"][data-balloon-visible]:after {
            transform: translate(-50%, 0);
        }

        [aria-label][data-balloon-pos][data-balloon-pos="up"]:hover:before,
        [aria-label][data-balloon-pos][data-balloon-pos="up"][data-balloon-visible]:before,
        [aria-label][data-balloon-pos][data-balloon-pos="down"]:hover:before,
        [aria-label][data-balloon-pos][data-balloon-pos="down"][data-balloon-visible]:before {
            transform: translate(-50%, 0);
        }

        [aria-label][data-balloon-pos][data-balloon-pos*="-left"]:after {
            left: 0;
        }

        [aria-label][data-balloon-pos][data-balloon-pos*="-left"]:before {
            left: 5px;
        }

        [aria-label][data-balloon-pos][data-balloon-pos*="-right"]:after {
            right: 0;
        }

        [aria-label][data-balloon-pos][data-balloon-pos*="-right"]:before {
            right: 5px;
        }

        [aria-label][data-balloon-pos][data-balloon-po*="-left"]:hover:after,
        [aria-label][data-balloon-pos][data-balloon-po*="-left"][data-balloon-visible]:after,
        [aria-label][data-balloon-pos][data-balloon-pos*="-right"]:hover:after,
        [aria-label][data-balloon-pos][data-balloon-pos*="-right"][data-balloon-visible]:after {
            transform: translate(0, 0);
        }

        [aria-label][data-balloon-pos][data-balloon-po*="-left"]:hover:before,
        [aria-label][data-balloon-pos][data-balloon-po*="-left"][data-balloon-visible]:before,
        [aria-label][data-balloon-pos][data-balloon-pos*="-right"]:hover:before,
        [aria-label][data-balloon-pos][data-balloon-pos*="-right"][data-balloon-visible]:before {
            transform: translate(0, 0);
        }

        [aria-label][data-balloon-pos][data-balloon-pos^="up"]:before,
        [aria-label][data-balloon-pos][data-balloon-pos^="up"]:after {
            bottom: 100%;
            transform-origin: top;
            transform: translate(0, 4px);
            transform: translate(0, var(--balloon-move));
        }

        [aria-label][data-balloon-pos][data-balloon-pos^="up"]:after {
            margin-bottom: 10px;
        }

        [aria-label][data-balloon-pos][data-balloon-pos="up"]:before,
        [aria-label][data-balloon-pos][data-balloon-pos="up"]:after {
            left: 50%;
            transform: translate(-50%, 4px);
            transform: translate(-50%, var(--balloon-move));
        }

        [aria-label][data-balloon-pos][data-balloon-pos^="down"]:before,
        [aria-label][data-balloon-pos][data-balloon-pos^="down"]:after {
            top: 100%;
            transform: translate(0, calc(4px * -1));
            transform: translate(0, calc(var(--balloon-move) * -1));
        }

        [aria-label][data-balloon-pos][data-balloon-pos^="down"]:after {
            margin-top: 10px;
        }

        [aria-label][data-balloon-pos][data-balloon-pos^="down"]:before {
            width: 0;
            height: 0;
            border: 5px solid transparent;
            border-bottom-color: rgba(16, 16, 16, 0.95);
            border-bottom-color: var(--balloon-color);
        }

        [aria-label][data-balloon-pos][data-balloon-pos="down"]:after,
        [aria-label][data-balloon-pos][data-balloon-pos="down"]:before {
            left: 50%;
            transform: translate(-50%, calc(4px * -1));
            transform: translate(-50%, calc(var(--balloon-move) * -1));
        }

        [aria-label][data-balloon-pos][data-balloon-pos="left"]:hover:after,
        [aria-label][data-balloon-pos][data-balloon-pos="left"][data-balloon-visible]:after,
        [aria-label][data-balloon-pos][data-balloon-pos="right"]:hover:after,
        [aria-label][data-balloon-pos][data-balloon-pos="right"][data-balloon-visible]:after {
            transform: translate(0, -50%);
        }

        [aria-label][data-balloon-pos][data-balloon-pos="left"]:hover:before,
        [aria-label][data-balloon-pos][data-balloon-pos="left"][data-balloon-visible]:before,
        [aria-label][data-balloon-pos][data-balloon-pos="right"]:hover:before,
        [aria-label][data-balloon-pos][data-balloon-pos="right"][data-balloon-visible]:before {
            transform: translate(0, -50%);
        }

        [aria-label][data-balloon-pos][data-balloon-pos="left"]:after,
        [aria-label][data-balloon-pos][data-balloon-pos="left"]:before {
            right: 100%;
            top: 50%;
            transform: translate(4px, -50%);
            transform: translate(var(--balloon-move), -50%);
        }

        [aria-label][data-balloon-pos][data-balloon-pos="left"]:after {
            margin-right: 10px;
        }

        [aria-label][data-balloon-pos][data-balloon-pos="left"]:before {
            width: 0;
            height: 0;
            border: 5px solid transparent;
            border-left-color: rgba(16, 16, 16, 0.95);
            border-left-color: var(--balloon-color);
        }

        [aria-label][data-balloon-pos][data-balloon-pos="right"]:after,
        [aria-label][data-balloon-pos][data-balloon-pos="right"]:before {
            left: 100%;
            top: 50%;
            transform: translate(calc(4px * -1), -50%);
            transform: translate(calc(var(--balloon-move) * -1), -50%);
        }

        [aria-label][data-balloon-pos][data-balloon-pos="right"]:after {
            margin-left: 10px;
        }

        [aria-label][data-balloon-pos][data-balloon-pos="right"]:before {
            width: 0;
            height: 0;
            border: 5px solid transparent;
            border-right-color: rgba(16, 16, 16, 0.95);
            border-right-color: var(--balloon-color);
        }

        [aria-label][data-balloon-pos][data-balloon-length]:after {
            white-space: normal;
        }

        [aria-label][data-balloon-pos][data-balloon-length="small"]:after {
            width: 80px;
        }

        [aria-label][data-balloon-pos][data-balloon-length="medium"]:after {
            width: 150px;
        }

        [aria-label][data-balloon-pos][data-balloon-length="large"]:after {
            width: 260px;
        }

        [aria-label][data-balloon-pos][data-balloon-length="xlarge"]:after {
            width: 380px;
        }

        @media screen and (max-width: 768px) {
            [aria-label][data-balloon-pos][data-balloon-length="xlarge"]:after {
                width: 90vw;
            }
        }

        [aria-label][data-balloon-pos][data-balloon-length="fit"]:after {
            width: 100%;
        }

        @keyframes my-face {
            2% {
                transform: translate(0, 1.5px) rotate(1.5deg);
            }

            4% {
                transform: translate(0, -1.5px) rotate(-0.5deg);
            }

            6% {
                transform: translate(0, 1.5px) rotate(-1.5deg);
            }

            8% {
                transform: translate(0, -1.5px) rotate(-1.5deg);
            }

            10% {
                transform: translate(0, 2.5px) rotate(1.5deg);
            }

            12% {
                transform: translate(0, -0.5px) rotate(1.5deg);
            }

            14% {
                transform: translate(0, -1.5px) rotate(1.5deg);
            }

            16% {
                transform: translate(0, -0.5px) rotate(-1.5deg);
            }

            18% {
                transform: translate(0, 0.5px) rotate(-1.5deg);
            }

            20% {
                transform: translate(0, -1.5px) rotate(2.5deg);
            }

            22% {
                transform: translate(0, 0.5px) rotate(-1.5deg);
            }

            24% {
                transform: translate(0, 1.5px) rotate(1.5deg);
            }

            26% {
                transform: translate(0, 0.5px) rotate(0.5deg);
            }

            28% {
                transform: translate(0, 0.5px) rotate(1.5deg);
            }

            30% {
                transform: translate(0, -0.5px) rotate(2.5deg);
            }

            32% {
                transform: translate(0, 1.5px) rotate(-0.5deg);
            }

            34% {
                transform: translate(0, 1.5px) rotate(-0.5deg);
            }

            36% {
                transform: translate(0, -1.5px) rotate(2.5deg);
            }

            38% {
                transform: translate(0, 1.5px) rotate(-1.5deg);
            }

            40% {
                transform: translate(0, -0.5px) rotate(2.5deg);
            }

            42% {
                transform: translate(0, 2.5px) rotate(-1.5deg);
            }

            44% {
                transform: translate(0, 1.5px) rotate(0.5deg);
            }

            46% {
                transform: translate(0, -1.5px) rotate(2.5deg);
            }

            48% {
                transform: translate(0, -0.5px) rotate(0.5deg);
            }

            50% {
                transform: translate(0, 0.5px) rotate(0.5deg);
            }

            52% {
                transform: translate(0, 2.5px) rotate(2.5deg);
            }

            54% {
                transform: translate(0, -1.5px) rotate(1.5deg);
            }

            56% {
                transform: translate(0, 2.5px) rotate(2.5deg);
            }

            58% {
                transform: translate(0, 0.5px) rotate(2.5deg);
            }

            60% {
                transform: translate(0, 2.5px) rotate(2.5deg);
            }

            62% {
                transform: translate(0, -0.5px) rotate(2.5deg);
            }

            64% {
                transform: translate(0, -0.5px) rotate(1.5deg);
            }

            66% {
                transform: translate(0, 1.5px) rotate(-0.5deg);
            }

            68% {
                transform: translate(0, -1.5px) rotate(-0.5deg);
            }

            70% {
                transform: translate(0, 1.5px) rotate(0.5deg);
            }

            72% {
                transform: translate(0, 2.5px) rotate(1.5deg);
            }

            74% {
                transform: translate(0, -0.5px) rotate(0.5deg);
            }

            76% {
                transform: translate(0, -0.5px) rotate(2.5deg);
            }

            78% {
                transform: translate(0, -0.5px) rotate(1.5deg);
            }

            80% {
                transform: translate(0, 1.5px) rotate(1.5deg);
            }

            82% {
                transform: translate(0, -0.5px) rotate(0.5deg);
            }

            84% {
                transform: translate(0, 1.5px) rotate(2.5deg);
            }

            86% {
                transform: translate(0, -1.5px) rotate(-1.5deg);
            }

            88% {
                transform: translate(0, -0.5px) rotate(2.5deg);
            }

            90% {
                transform: translate(0, 2.5px) rotate(-0.5deg);
            }

            92% {
                transform: translate(0, 0.5px) rotate(-0.5deg);
            }

            94% {
                transform: translate(0, 2.5px) rotate(0.5deg);
            }

            96% {
                transform: translate(0, -0.5px) rotate(1.5deg);
            }

            98% {
                transform: translate(0, -1.5px) rotate(-0.5deg);
            }

            0%,
            100% {
                transform: translate(0, 0) rotate(0deg);
            }
        }

        .dplayer {
            position: relative;
            overflow: hidden;
            -webkit-user-select: none;
            -moz-user-select: none;
            user-select: none;
            line-height: 1;
        }

        .dplayer * {
            box-sizing: content-box;
        }

        .dplayer svg {
            width: 100%;
            height: 100%;
        }

        .dplayer svg path,
        .dplayer svg circle {
            fill: #fff;
        }

        .dplayer:-webkit-full-screen {
            width: 100%;
            height: 100%;
            background: #000;
            position: fixed;
            z-index: 100000;
            left: 0;
            top: 0;
            margin: 0;
            padding: 0;
            transform: translate(0, 0);
        }

        .dplayer.dplayer-no-danmaku .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box .dplayer-setting-showdan,
        .dplayer.dplayer-no-danmaku .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box .dplayer-setting-danmaku,
        .dplayer.dplayer-no-danmaku .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box .dplayer-setting-danunlimit {
            display: none;
        }

        .dplayer.dplayer-no-danmaku .dplayer-controller .dplayer-icons .dplayer-comment {
            display: none;
        }

        .dplayer.dplayer-no-danmaku .dplayer-danmaku {
            display: none;
        }

        .dplayer.dplayer-live .dplayer-time {
            display: none;
        }

        .dplayer.dplayer-live .dplayer-bar-wrap {
            display: none;
        }

        .dplayer.dplayer-live .dplayer-setting-speed {
            display: none;
        }

        .dplayer.dplayer-live .dplayer-setting-loop {
            display: none;
        }

        .dplayer.dplayer-live.dplayer-no-danmaku .dplayer-setting {
            display: none;
        }

        .dplayer.dplayer-arrow .dplayer-danmaku {
            font-size: 18px;
        }

        .dplayer.dplayer-arrow .dplayer-icon {
            margin: 0 -3px;
        }

        .dplayer.dplayer-playing .dplayer-danmaku .dplayer-danmaku-move {
            animation-play-state: running;
        }

        @media (min-width: 900px) {
            .dplayer.dplayer-playing .dplayer-controller-mask {
                opacity: 0;
            }

            .dplayer.dplayer-playing .dplayer-controller {
                opacity: 0;
            }

            .dplayer.dplayer-playing:hover .dplayer-controller-mask {
                opacity: 1;
            }

            .dplayer.dplayer-playing:hover .dplayer-controller {
                opacity: 1;
            }
        }

        .dplayer.dplayer-loading .dplayer-bezel .diplayer-loading-icon {
            display: block;
        }

        .dplayer.dplayer-loading .dplayer-danmaku,
        .dplayer.dplayer-paused .dplayer-danmaku,
        .dplayer.dplayer-loading .dplayer-danmaku-move,
        .dplayer.dplayer-paused .dplayer-danmaku-move {
            animation-play-state: paused;
        }

        .dplayer.dplayer-hide-controller {
            cursor: none;
        }

        .dplayer.dplayer-hide-controller .dplayer-controller-mask {
            opacity: 0;
            transform: translateY(100%);
        }

        .dplayer.dplayer-hide-controller .dplayer-controller {
            opacity: 0;
            transform: translateY(100%);
        }

        .dplayer.dplayer-show-controller .dplayer-controller-mask {
            opacity: 1;
        }

        .dplayer.dplayer-show-controller .dplayer-controller {
            opacity: 1;
        }

        .dplayer.dplayer-fulled {
            width: 100% !important;
            height: 100% !important;
        }

        .dplayer.dplayer-fulled {
            position: fixed;
            z-index: 100000;
            left: 0;
            top: 0;
        }

        .dplayer.dplayer-mobile .dplayer-controller .dplayer-icons .dplayer-volume,
        .dplayer.dplayer-mobile .dplayer-controller .dplayer-icons .dplayer-camera-icon,
        .dplayer.dplayer-mobile .dplayer-controller .dplayer-icons .dplayer-airplay-icon,
        .dplayer.dplayer-mobile .dplayer-controller .dplayer-icons .dplayer-chromecast-icon,
        .dplayer.dplayer-mobile .dplayer-controller .dplayer-icons .dplayer-play-icon {
            display: none;
        }

        .dplayer.dplayer-mobile .dplayer-controller .dplayer-icons .dplayer-full .dplayer-full-in-icon {
            position: static;
            display: inline-block;
        }

        .dplayer.dplayer-mobile .dplayer-bar-time {
            display: none;
        }

        .dplayer.dplayer-mobile.dplayer-hide-controller .dplayer-mobile-play {
            display: none;
        }

        .dplayer.dplayer-mobile .dplayer-mobile-play {
            display: block;
        }

        .dplayer-web-fullscreen-fix {
            position: fixed;
            top: 0;
            left: 0;
            margin: 0;
            padding: 0;
        }

        [data-balloon]:before {
            display: none;
        }

        [data-balloon]:after {
            padding: 0.3em 0.7em;
            background: rgba(17, 17, 17, 0.7);
        }

        [data-balloon][data-balloon-pos="up"]:after {
            margin-bottom: 0;
        }

        .dplayer-bezel {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            font-size: 22px;
            color: #fff;
            pointer-events: none;
        }

        .dplayer-bezel .dplayer-bezel-icon {
            position: absolute;
            top: 50%;
            left: 50%;
            margin: -26px 0 0 -26px;
            height: 52px;
            width: 52px;
            padding: 12px;
            box-sizing: border-box;
            background: rgba(0, 0, 0, 0.5);
            border-radius: 50%;
            opacity: 0;
            pointer-events: none;
        }

        .dplayer-bezel .dplayer-bezel-icon.dplayer-bezel-transition {
            animation: bezel-hide 0.5s linear;
        }

        @keyframes bezel-hide {
            from {
                opacity: 1;
                transform: scale(1);
            }

            to {
                opacity: 0;
                transform: scale(2);
            }
        }

        .dplayer-bezel .dplayer-danloading {
            position: absolute;
            top: 50%;
            margin-top: -7px;
            width: 100%;
            text-align: center;
            font-size: 14px;
            line-height: 14px;
            animation: my-face 5s infinite ease-in-out;
        }

        .dplayer-bezel .diplayer-loading-icon {
            display: none;
            position: absolute;
            top: 50%;
            left: 50%;
            margin: -18px 0 0 -18px;
            height: 36px;
            width: 36px;
            pointer-events: none;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-hide {
            display: none;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot {
            animation: diplayer-loading-dot-fade 0.8s ease infinite;
            opacity: 0;
            transform-origin: 4px 4px;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot.diplayer-loading-dot-1 {
            animation-delay: 0.1s;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot.diplayer-loading-dot-2 {
            animation-delay: 0.2s;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot.diplayer-loading-dot-3 {
            animation-delay: 0.3s;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot.diplayer-loading-dot-4 {
            animation-delay: 0.4s;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot.diplayer-loading-dot-5 {
            animation-delay: 0.5s;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot.diplayer-loading-dot-6 {
            animation-delay: 0.6s;
        }

        .dplayer-bezel .diplayer-loading-icon .diplayer-loading-dot.diplayer-loading-dot-7 {
            animation-delay: 0.7s;
        }

        @keyframes diplayer-loading-dot-fade {
            0% {
                opacity: 0.7;
                transform: scale(1.2, 1.2);
            }

            50% {
                opacity: 0.25;
                transform: scale(0.9, 0.9);
            }

            to {
                opacity: 0.25;
                transform: scale(0.85, 0.85);
            }
        }

        .dplayer-controller-mask {
            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==) repeat-x bottom;
            height: 98px;
            width: 100%;
            position: absolute;
            bottom: 0;
            transition: all 0.3s ease;
        }

        .dplayer-controller {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 41px;
            padding: 0 20px;
            -webkit-user-select: none;
            -moz-user-select: none;
            user-select: none;
            transition: all 0.3s ease;
        }

        .dplayer-controller.dplayer-controller-comment .dplayer-icons {
            display: none;
        }

        .dplayer-controller.dplayer-controller-comment .dplayer-icons.dplayer-comment-box {
            display: block;
        }

        .dplayer-controller .dplayer-bar-wrap {
            padding: 5px 0;
            cursor: pointer;
            position: absolute;
            bottom: 33px;
            width: calc(100% - 40px);
            height: 3px;
        }

        .dplayer-controller .dplayer-bar-wrap:hover .dplayer-bar .dplayer-played .dplayer-thumb {
            transform: scale(1);
        }

        .dplayer-controller .dplayer-bar-wrap:hover .dplayer-highlight {
            display: block;
            width: 8px;
            transform: translateX(-4px);
            top: 4px;
            height: 40%;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-highlight {
            z-index: 12;
            position: absolute;
            top: 5px;
            width: 6px;
            height: 20%;
            border-radius: 6px;
            background-color: #fff;
            text-align: center;
            transform: translateX(-3px);
            transition: all 0.2s ease-in-out;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-highlight:hover .dplayer-highlight-text {
            display: block;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-highlight:hover~.dplayer-bar-preview {
            opacity: 0;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-highlight:hover~.dplayer-bar-time {
            opacity: 0;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-highlight .dplayer-highlight-text {
            display: none;
            position: absolute;
            left: 50%;
            top: -24px;
            padding: 5px 8px;
            background-color: rgba(0, 0, 0, 0.62);
            color: #fff;
            border-radius: 4px;
            font-size: 12px;
            white-space: nowrap;
            transform: translateX(-50%);
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar-preview {
            position: absolute;
            background: #fff;
            pointer-events: none;
            display: none;
            background-size: 16000px 100%;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar-preview-canvas {
            position: absolute;
            width: 100%;
            height: 100%;
            z-index: 1;
            pointer-events: none;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar-time {
            position: absolute;
            left: 0px;
            top: -20px;
            border-radius: 4px;
            padding: 5px 7px;
            background-color: rgba(0, 0, 0, 0.62);
            color: #fff;
            font-size: 12px;
            text-align: center;
            opacity: 1;
            transition: opacity 0.1s ease-in-out;
            word-wrap: normal;
            word-break: normal;
            z-index: 2;
            pointer-events: none;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar-time.hidden {
            opacity: 0;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar {
            position: relative;
            height: 3px;
            width: 100%;
            background: rgba(255, 255, 255, 0.2);
            cursor: pointer;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar .dplayer-loaded {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            background: rgba(255, 255, 255, 0.4);
            height: 3px;
            transition: all 0.5s ease;
            will-change: width;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar .dplayer-played {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            height: 3px;
            will-change: width;
        }

        .dplayer-controller .dplayer-bar-wrap .dplayer-bar .dplayer-played .dplayer-thumb {
            position: absolute;
            top: 0;
            right: 5px;
            margin-top: -4px;
            margin-right: -10px;
            height: 11px;
            width: 11px;
            border-radius: 50%;
            cursor: pointer;
            transition: all 0.3s ease-in-out;
            transform: scale(0);
        }

        .dplayer-controller .dplayer-icons {
            height: 38px;
            position: absolute;
            bottom: 0;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box {
            display: none;
            position: absolute;
            transition: all 0.3s ease-in-out;
            z-index: 2;
            height: 38px;
            bottom: 0;
            left: 20px;
            right: 20px;
            color: #fff;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-icon {
            padding: 7px;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-icon {
            position: absolute;
            left: 0;
            top: 0;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-send-icon {
            position: absolute;
            right: 0;
            top: 0;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box {
            position: absolute;
            background: rgba(28, 28, 28, 0.9);
            bottom: 41px;
            left: 0;
            box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
            border-radius: 4px;
            padding: 10px 10px 16px;
            font-size: 14px;
            width: 204px;
            transition: all 0.3s ease-in-out;
            transform: scale(0);
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box.dplayer-comment-setting-open {
            transform: scale(1);
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box input[type=radio] {
            display: none;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box label {
            cursor: pointer;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-title {
            font-size: 13px;
            color: #fff;
            line-height: 30px;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-type {
            font-size: 0;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-type .dplayer-comment-setting-title {
            margin-bottom: 6px;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-type label:nth-child(2) span {
            border-radius: 4px 0 0 4px;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-type label:nth-child(4) span {
            border-radius: 0 4px 4px 0;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-type span {
            width: 33%;
            padding: 4px 6px;
            line-height: 16px;
            display: inline-block;
            font-size: 12px;
            color: #fff;
            border: 1px solid #fff;
            margin-right: -1px;
            box-sizing: border-box;
            text-align: center;
            cursor: pointer;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-type input:checked+span {
            background: #E4E4E6;
            color: #1c1c1c;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-color {
            font-size: 0;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-color label {
            font-size: 0;
            padding: 6px;
            display: inline-block;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-color span {
            width: 22px;
            height: 22px;
            display: inline-block;
            border-radius: 50%;
            box-sizing: border-box;
            cursor: pointer;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-setting-box .dplayer-comment-setting-color span:hover {
            animation: my-face 5s infinite ease-in-out;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-input {
            outline: none;
            border: none;
            padding: 8px 31px;
            font-size: 14px;
            line-height: 18px;
            text-align: center;
            border-radius: 4px;
            background: none;
            margin: 0;
            height: 100%;
            box-sizing: border-box;
            width: 100%;
            color: #fff;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-input::-moz-placeholder {
            color: #fff;
            opacity: 0.8;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-input::placeholder {
            color: #fff;
            opacity: 0.8;
        }

        .dplayer-controller .dplayer-icons.dplayer-comment-box .dplayer-comment-input::-ms-clear {
            display: none;
        }

        .dplayer-controller .dplayer-icons.dplayer-icons-left .dplayer-icon {
            padding: 7px;
        }

        .dplayer-controller .dplayer-icons.dplayer-icons-right {
            right: 20px;
        }

        .dplayer-controller .dplayer-icons.dplayer-icons-right .dplayer-icon {
            padding: 8px;
        }

        .dplayer-controller .dplayer-icons .dplayer-time,
        .dplayer-controller .dplayer-icons .dplayer-live-badge {
            line-height: 38px;
            color: #eee;
            text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
            vertical-align: middle;
            font-size: 13px;
            cursor: default;
        }

        .dplayer-controller .dplayer-icons .dplayer-live-dot {
            display: inline-block;
            width: 6px;
            height: 6px;
            vertical-align: 4%;
            margin-right: 5px;
            content: '';
            border-radius: 6px;
        }

        .dplayer-controller .dplayer-icons .dplayer-icon {
            width: 40px;
            height: 100%;
            border: none;
            background-color: transparent;
            outline: none;
            cursor: pointer;
            vertical-align: middle;
            box-sizing: border-box;
            display: inline-block;
        }

        .dplayer-controller .dplayer-icons .dplayer-icon .dplayer-icon-content {
            transition: all 0.2s ease-in-out;
            opacity: 0.8;
        }

        .dplayer-controller .dplayer-icons .dplayer-icon:hover .dplayer-icon-content {
            opacity: 1;
        }

        .dplayer-controller .dplayer-icons .dplayer-icon.dplayer-quality-icon {
            color: #fff;
            width: auto;
            line-height: 22px;
            font-size: 14px;
        }

        .dplayer-controller .dplayer-icons .dplayer-icon.dplayer-comment-icon {
            padding: 10px 9px 9px;
        }

        .dplayer-controller .dplayer-icons .dplayer-icon.dplayer-setting-icon {
            padding-top: 8.5px;
        }

        .dplayer-controller .dplayer-icons .dplayer-icon.dplayer-volume-icon {
            width: 43px;
        }

        .dplayer-controller .dplayer-icons .dplayer-volume {
            position: relative;
            display: inline-block;
            cursor: pointer;
            height: 100%;
        }

        .dplayer-controller .dplayer-icons .dplayer-volume:hover .dplayer-volume-bar-wrap .dplayer-volume-bar {
            width: 45px;
        }

        .dplayer-controller .dplayer-icons .dplayer-volume:hover .dplayer-volume-bar-wrap .dplayer-volume-bar .dplayer-volume-bar-inner .dplayer-thumb {
            transform: scale(1);
        }

        .dplayer-controller .dplayer-icons .dplayer-volume.dplayer-volume-active .dplayer-volume-bar-wrap .dplayer-volume-bar {
            width: 45px;
        }

        .dplayer-controller .dplayer-icons .dplayer-volume.dplayer-volume-active .dplayer-volume-bar-wrap .dplayer-volume-bar .dplayer-volume-bar-inner .dplayer-thumb {
            transform: scale(1);
        }

        .dplayer-controller .dplayer-icons .dplayer-volume .dplayer-volume-bar-wrap {
            display: inline-block;
            margin: 0 10px 0 -5px;
            vertical-align: middle;
            height: 100%;
        }

        .dplayer-controller .dplayer-icons .dplayer-volume .dplayer-volume-bar-wrap .dplayer-volume-bar {
            position: relative;
            top: 17px;
            width: 0;
            height: 3px;
            background: #aaa;
            transition: all 0.3s ease-in-out;
        }

        .dplayer-controller .dplayer-icons .dplayer-volume .dplayer-volume-bar-wrap .dplayer-volume-bar .dplayer-volume-bar-inner {
            position: absolute;
            bottom: 0;
            left: 0;
            height: 100%;
            transition: all 0.1s ease;
            will-change: width;
        }

        .dplayer-controller .dplayer-icons .dplayer-volume .dplayer-volume-bar-wrap .dplayer-volume-bar .dplayer-volume-bar-inner .dplayer-thumb {
            position: absolute;
            top: 0;
            right: 5px;
            margin-top: -4px;
            margin-right: -10px;
            height: 11px;
            width: 11px;
            border-radius: 50%;
            cursor: pointer;
            transition: all 0.3s ease-in-out;
            transform: scale(0);
        }

        .dplayer-controller .dplayer-icons .dplayer-subtitle-btn {
            display: inline-block;
            height: 100%;
        }

        .dplayer-controller .dplayer-icons .dplayer-subtitles {
            display: inline-block;
            height: 100%;
        }

        .dplayer-controller .dplayer-icons .dplayer-subtitles .dplayer-subtitles-box {
            position: absolute;
            right: 0;
            bottom: 50px;
            transform: scale(0);
            width: -moz-fit-content;
            width: fit-content;
            max-width: 240px;
            min-width: 120px;
            border-radius: 2px;
            background: rgba(28, 28, 28, 0.9);
            padding: 7px 0;
            transition: all 0.3s ease-in-out;
            overflow: auto;
            z-index: 2;
        }

        .dplayer-controller .dplayer-icons .dplayer-subtitles .dplayer-subtitles-box.dplayer-subtitles-panel {
            display: block;
        }

        .dplayer-controller .dplayer-icons .dplayer-subtitles .dplayer-subtitles-box.dplayer-subtitles-box-open {
            transform: scale(1);
        }

        .dplayer-controller .dplayer-icons .dplayer-subtitles .dplayer-subtitles-item {
            height: 30px;
            padding: 5px 10px;
            box-sizing: border-box;
            cursor: pointer;
            position: relative;
        }

        .dplayer-controller .dplayer-icons .dplayer-subtitles .dplayer-subtitles-item:hover {
            background-color: rgba(255, 255, 255, 0.1);
        }

        .dplayer-controller .dplayer-icons .dplayer-setting {
            display: inline-block;
            height: 100%;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box {
            position: absolute;
            right: 0;
            bottom: 50px;
            transform: scale(0);
            width: 150px;
            border-radius: 2px;
            background: rgba(28, 28, 28, 0.9);
            padding: 7px 0;
            transition: all 0.3s ease-in-out;
            overflow: hidden;
            z-index: 2;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box>div {
            display: none;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box>div.dplayer-setting-origin-panel {
            display: block;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box.dplayer-setting-box-open {
            transform: scale(1);
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box.dplayer-setting-box-narrow {
            width: 70px;
            text-align: center;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box.dplayer-setting-box-speed .dplayer-setting-origin-panel {
            display: none;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-box.dplayer-setting-box-speed .dplayer-setting-speed-panel {
            display: block;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-item,
        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-speed-item {
            height: 30px;
            padding: 5px 10px;
            box-sizing: border-box;
            cursor: pointer;
            position: relative;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-item:hover,
        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-speed-item:hover {
            background-color: rgba(255, 255, 255, 0.1);
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku {
            padding: 5px 0;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku .dplayer-label {
            padding: 0 10px;
            display: inline;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku:hover .dplayer-label {
            display: none;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku:hover .dplayer-danmaku-bar-wrap {
            display: inline-block;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku.dplayer-setting-danmaku-active .dplayer-label {
            display: none;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku.dplayer-setting-danmaku-active .dplayer-danmaku-bar-wrap {
            display: inline-block;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku .dplayer-danmaku-bar-wrap {
            padding: 0 10px;
            box-sizing: border-box;
            display: none;
            vertical-align: middle;
            height: 100%;
            width: 100%;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku .dplayer-danmaku-bar-wrap .dplayer-danmaku-bar {
            position: relative;
            top: 8.5px;
            width: 100%;
            height: 3px;
            background: #fff;
            transition: all 0.3s ease-in-out;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku .dplayer-danmaku-bar-wrap .dplayer-danmaku-bar .dplayer-danmaku-bar-inner {
            position: absolute;
            bottom: 0;
            left: 0;
            height: 100%;
            transition: all 0.1s ease;
            background: #aaa;
            will-change: width;
        }

        .dplayer-controller .dplayer-icons .dplayer-setting .dplayer-setting-danmaku .dplayer-danmaku-bar-wrap .dplayer-danmaku-bar .dplayer-danmaku-bar-inner .dplayer-thumb {
            position: absolute;
            top: 0;
            right: 5px;
            margin-top: -4px;
            margin-right: -10px;
            height: 11px;
            width: 11px;
            border-radius: 50%;
            cursor: pointer;
            transition: all 0.3s ease-in-out;
            background: #aaa;
        }

        .dplayer-controller .dplayer-icons .dplayer-full {
            display: inline-block;
            height: 100%;
            position: relative;
        }

        .dplayer-controller .dplayer-icons .dplayer-full:hover .dplayer-full-in-icon {
            display: block;
        }

        .dplayer-controller .dplayer-icons .dplayer-full .dplayer-full-in-icon {
            position: absolute;
            top: -30px;
            z-index: 1;
            display: none;
        }

        .dplayer-controller .dplayer-icons .dplayer-quality {
            position: relative;
            display: inline-block;
            height: 100%;
            z-index: 2;
        }

        .dplayer-controller .dplayer-icons .dplayer-quality:hover .dplayer-quality-list {
            display: block;
        }

        .dplayer-controller .dplayer-icons .dplayer-quality:hover .dplayer-quality-mask {
            display: block;
        }

        .dplayer-controller .dplayer-icons .dplayer-quality .dplayer-quality-mask {
            display: none;
            position: absolute;
            bottom: 38px;
            left: -18px;
            width: 80px;
            padding-bottom: 12px;
        }

        .dplayer-controller .dplayer-icons .dplayer-quality .dplayer-quality-list {
            display: none;
            font-size: 12px;
            width: 80px;
            border-radius: 2px;
            background: rgba(28, 28, 28, 0.9);
            padding: 5px 0;
            transition: all 0.3s ease-in-out;
            overflow: hidden;
            color: #fff;
            text-align: center;
        }

        .dplayer-controller .dplayer-icons .dplayer-quality .dplayer-quality-item {
            height: 25px;
            box-sizing: border-box;
            cursor: pointer;
            line-height: 25px;
        }

        .dplayer-controller .dplayer-icons .dplayer-quality .dplayer-quality-item:hover {
            background-color: rgba(255, 255, 255, 0.1);
        }

        .dplayer-controller .dplayer-icons .dplayer-comment {
            display: inline-block;
            height: 100%;
        }

        .dplayer-controller .dplayer-icons .dplayer-label {
            color: #eee;
            font-size: 13px;
            display: inline-block;
            vertical-align: middle;
            white-space: nowrap;
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle {
            width: 32px;
            height: 20px;
            text-align: center;
            font-size: 0;
            vertical-align: middle;
            position: absolute;
            top: 5px;
            right: 10px;
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle input {
            max-height: 0;
            max-width: 0;
            display: none;
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle input+label {
            display: inline-block;
            position: relative;
            box-shadow: #dfdfdf 0 0 0 0 inset;
            border: 1px solid #dfdfdf;
            height: 20px;
            width: 32px;
            border-radius: 10px;
            box-sizing: border-box;
            cursor: pointer;
            transition: 0.2s ease-in-out;
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle input+label:before {
            content: "";
            position: absolute;
            display: block;
            height: 18px;
            width: 18px;
            top: 0;
            left: 0;
            border-radius: 15px;
            transition: 0.2s ease-in-out;
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle input+label:after {
            content: "";
            position: absolute;
            display: block;
            left: 0;
            top: 0;
            border-radius: 15px;
            background: #fff;
            transition: 0.2s ease-in-out;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
            height: 18px;
            width: 18px;
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle input:checked+label {
            border-color: rgba(255, 255, 255, 0.5);
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle input:checked+label:before {
            width: 30px;
            background: rgba(255, 255, 255, 0.5);
        }

        .dplayer-controller .dplayer-icons .dplayer-toggle input:checked+label:after {
            left: 12px;
        }

        .dplayer-mobile-play {
            display: none;
            width: 50px;
            height: 50px;
            border: none;
            background-color: transparent;
            outline: none;
            cursor: pointer;
            box-sizing: border-box;
            bottom: 0;
            opacity: 0.8;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
        }

        .dplayer-danmaku {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            font-size: 22px;
            color: #fff;
        }

        .dplayer-danmaku .dplayer-danmaku-item {
            display: inline-block;
            pointer-events: none;
            -webkit-user-select: none;
            -moz-user-select: none;
            user-select: none;
            cursor: default;
            white-space: nowrap;
            text-shadow: 0.5px 0.5px 0.5px rgba(0, 0, 0, 0.5);
        }

        .dplayer-danmaku .dplayer-danmaku-item--demo {
            position: absolute;
            visibility: hidden;
        }

        .dplayer-danmaku .dplayer-danmaku-right {
            position: absolute;
            right: 0;
            transform: translateX(100%);
        }

        .dplayer-danmaku .dplayer-danmaku-right.dplayer-danmaku-move {
            will-change: transform;
            animation-name: 'danmaku';
            animation-timing-function: linear;
            animation-play-state: paused;
        }

        @keyframes danmaku {
            from {
                transform: translateX(100%);
            }
        }

        .dplayer-danmaku .dplayer-danmaku-top,
        .dplayer-danmaku .dplayer-danmaku-bottom {
            position: absolute;
            width: 100%;
            text-align: center;
            visibility: hidden;
        }

        .dplayer-danmaku .dplayer-danmaku-top.dplayer-danmaku-move,
        .dplayer-danmaku .dplayer-danmaku-bottom.dplayer-danmaku-move {
            will-change: visibility;
            animation-name: 'danmaku-center';
            animation-timing-function: linear;
            animation-play-state: paused;
        }

        @keyframes danmaku-center {
            from {
                visibility: visible;
            }

            to {
                visibility: visible;
            }
        }

        .dplayer-logo {
            pointer-events: none;
            position: absolute;
            left: 20px;
            top: 20px;
            max-width: 50px;
            max-height: 50px;
        }

        .dplayer-logo img {
            max-width: 100%;
            max-height: 100%;
            background: none;
        }

        .dplayer-menu {
            position: absolute;
            width: 170px;
            border-radius: 2px;
            background: rgba(28, 28, 28, 0.85);
            padding: 5px 0;
            overflow: hidden;
            z-index: 3;
            display: none;
        }

        .dplayer-menu.dplayer-menu-show {
            display: block;
        }

        .dplayer-menu .dplayer-menu-item {
            height: 30px;
            box-sizing: border-box;
            cursor: pointer;
        }

        .dplayer-menu .dplayer-menu-item:hover {
            background-color: rgba(255, 255, 255, 0.1);
        }

        .dplayer-menu .dplayer-menu-item a {
            padding: 0 10px;
            line-height: 30px;
            color: #eee;
            font-size: 13px;
            display: inline-block;
            vertical-align: middle;
            width: 100%;
            box-sizing: border-box;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        .dplayer-menu .dplayer-menu-item a:hover {
            text-decoration: none;
        }

        .dplayer-notice-list {
            position: absolute;
            bottom: 60px;
            left: 20px;
        }

        .dplayer-notice-list .dplayer-notice {
            border-radius: 2px;
            background: rgba(28, 28, 28, 0.9);
            transition: all 0.3s ease-in-out;
            overflow: hidden;
            color: #fff;
            display: table;
            pointer-events: none;
            animation: showNotice 0.3s ease 1 forwards;
        }

        .dplayer-notice-list .remove-notice {
            animation: removeNotice 0.3s ease 1 forwards;
        }

        @keyframes showNotice {
            from {
                padding: 0;
                font-size: 0;
                margin-top: 0;
            }

            to {
                padding: 7px 20px;
                font-size: 14px;
                margin-top: 5px;
            }
        }

        @keyframes removeNotice {
            0% {
                padding: 7px 20px;
                font-size: 14px;
                margin-top: 5px;
            }

            20% {
                font-size: 12px;
            }

            21% {
                font-size: 0;
                padding: 7px 10px;
            }

            100% {
                padding: 0;
                margin-top: 0;
                font-size: 0;
            }
        }

        .dplayer-subtitle {
            position: absolute;
            bottom: 40px;
            width: 90%;
            left: 5%;
            text-align: center;
            color: #fff;
            text-shadow: 0.5px 0.5px 0.5px rgba(0, 0, 0, 0.5);
            font-size: 20px;
        }

        .dplayer-subtitle.dplayer-subtitle-hide {
            display: none;
        }

        .dplayer-mask {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 1;
            display: none;
        }

        .dplayer-mask.dplayer-mask-show {
            display: block;
        }

        .dplayer-video-wrap {
            position: relative;
            background: #000;
            font-size: 0;
            width: 100%;
            height: 100%;
        }

        .dplayer-video-wrap .dplayer-video {
            width: 100%;
            height: 100%;
            display: none;
        }

        .dplayer-video-wrap .dplayer-video-current {
            display: block;
        }

        .dplayer-video-wrap .dplayer-video-prepare {
            display: none;
        }

        .dplayer-info-panel {
            position: absolute;
            top: 10px;
            left: 10px;
            width: 400px;
            background: rgba(28, 28, 28, 0.8);
            padding: 10px;
            color: #fff;
            font-size: 12px;
            border-radius: 2px;
        }

        .dplayer-info-panel-hide {
            display: none;
        }

        .dplayer-info-panel .dplayer-info-panel-close {
            cursor: pointer;
            position: absolute;
            right: 10px;
            top: 10px;
        }

        .dplayer-info-panel .dplayer-info-panel-item>span {
            display: inline-block;
            vertical-align: middle;
            line-height: 15px;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        .dplayer-info-panel .dplayer-info-panel-item-title {
            width: 100px;
            text-align: right;
            margin-right: 10px;
        }

        .dplayer-info-panel .dplayer-info-panel-item-data {
            width: 260px;
        }
                .post-content .content-file .content-file-icon {
            display: none !important;
        }

        @media(min-width: 767px) {
            .post-content .content-file {
                font-size: 1rem !important;
            }
        }

        @media(max-width: 767px) {
            #nav .menu {
                margin-top: 1.25rem
            }

            .navbar-nav .category-list .category-list {
                background-color: transparent;
            }

            .navbar-nav .category-list ul.list {
                display: block !important;
            }

            #nav .menu .category-list ul.list li {
                font-weight: 400;
                padding: 0;
                display: block;
                width: auto;
            }

            #nav .menu .category-list ul.list li:nth-child(even),
            #nav .menu .category-list ul.list li:nth-child(odd) {
                padding-right: unset;
                padding-left: unset;
            }

            #nav .menu .category-list ul.list li>a {
                background-color: transparent;
                border-radius: unset;
                padding: 0.375rem 1.75rem;
                position: relative;
                line-height: 2.25rem;
                display: block;
                font-size: 1.25rem;
                text-align: center;
                font-weight: 400;
            }

            body #nav .menu .category-list ul.list li>a {
                background: transparent;
            }

            body #nav .menu .category-list {
                background: transparent;
            }

            body.theme-white #nav .menu li a {
                color: #333 !important;
                font-weight: 400 !important;
            }

            #nav .author {
                padding-top: 1.25rem;
                padding-bottom: 1.25rem;
            }

            #comment-form .comment-input[name=url],
            #comment-form .comment-input[name=mail] {
                display: none !important;
            }
        }