@charset "UTF-8";.toast-center-center {
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

.toast-top-center {
    top: 0;
    right: 0;
    width: 100%
}

.toast-bottom-center {
    bottom: 0;
    right: 0;
    width: 100%
}

.toast-top-full-width {
    top: 0;
    right: 0;
    width: 100%
}

.toast-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%
}

.toast-top-left {
    top: 12px;
    left: 12px
}

.toast-top-right {
    top: 12px;
    right: 12px
}

.toast-bottom-right {
    right: 12px;
    bottom: 12px
}

.toast-bottom-left {
    bottom: 12px;
    left: 12px
}

.toast-title {
    font-weight: 700
}

.toast-message {
    word-wrap: break-word
}

.toast-message a,.toast-message label {
    color: #fff
}

.toast-message a:hover {
    color: #ccc;
    text-decoration: none
}

.toast-close-button {
    position: relative;
    right: -.3em;
    top: -.3em;
    float: right;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 1px 0 #fff
}

.toast-close-button:focus,.toast-close-button:hover {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: .4
}

button.toast-close-button {
    padding: 0;
    cursor: pointer;
    background: #0000;
    border: 0
}

.toast-container {
    pointer-events: none;
    position: fixed;
    z-index: 999999
}

.toast-container * {
    box-sizing: border-box
}

.toast-container .ngx-toastr {
    position: relative;
    overflow: hidden;
    margin: 0 0 6px;
    padding: 15px 15px 15px 50px;
    width: 300px;
    border-radius: 3px 3px 3px 3px;
    background-position: 15px;
    background-repeat: no-repeat;
    background-size: 24px;
    box-shadow: 0 0 12px #999;
    color: #fff
}

.toast-container .ngx-toastr:hover {
    box-shadow: 0 0 12px #000;
    opacity: 1;
    cursor: pointer
}

.toast-info {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOS4wNDMgOCA4IDExOS4wODMgOCAyNTZjMCAxMzYuOTk3IDExMS4wNDMgMjQ4IDI0OCAyNDhzMjQ4LTExMS4wMDMgMjQ4LTI0OEM1MDQgMTE5LjA4MyAzOTIuOTU3IDggMjU2IDh6bTAgMTEwYzIzLjE5NiAwIDQyIDE4LjgwNCA0MiA0MnMtMTguODA0IDQyLTQyIDQyLTQyLTE4LjgwNC00Mi00MiAxOC44MDQtNDIgNDItNDJ6bTU2IDI1NGMwIDYuNjI3LTUuMzczIDEyLTEyIDEyaC04OGMtNi42MjcgMC0xMi01LjM3My0xMi0xMnYtMjRjMC02LjYyNyA1LjM3My0xMiAxMi0xMmgxMnYtNjRoLTEyYy02LjYyNyAwLTEyLTUuMzczLTEyLTEydi0yNGMwLTYuNjI3IDUuMzczLTEyIDEyLTEyaDY0YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MTAwaDEyYzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MjR6Jy8+PC9zdmc+)
}

.toast-error {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOSA4IDggMTE5IDggMjU2czExMSAyNDggMjQ4IDI0OCAyNDgtMTExIDI0OC0yNDhTMzkzIDggMjU2IDh6bTEyMS42IDMxMy4xYzQuNyA0LjcgNC43IDEyLjMgMCAxN0wzMzggMzc3LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwyNTYgMzEybC02NS4xIDY1LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwxMzQuNCAzMzhjLTQuNy00LjctNC43LTEyLjMgMC0xN2w2NS42LTY1LTY1LjYtNjUuMWMtNC43LTQuNy00LjctMTIuMyAwLTE3bDM5LjYtMzkuNmM0LjctNC43IDEyLjMtNC43IDE3IDBsNjUgNjUuNyA2NS4xLTY1LjZjNC43LTQuNyAxMi4zLTQuNyAxNyAwbDM5LjYgMzkuNmM0LjcgNC43IDQuNyAxMi4zIDAgMTdMMzEyIDI1Nmw2NS42IDY1LjF6Jy8+PC9zdmc+)
}

.toast-success {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTE3My44OTggNDM5LjQwNGwtMTY2LjQtMTY2LjRjLTkuOTk3LTkuOTk3LTkuOTk3LTI2LjIwNiAwLTM2LjIwNGwzNi4yMDMtMzYuMjA0YzkuOTk3LTkuOTk4IDI2LjIwNy05Ljk5OCAzNi4yMDQgMEwxOTIgMzEyLjY5IDQzMi4wOTUgNzIuNTk2YzkuOTk3LTkuOTk3IDI2LjIwNy05Ljk5NyAzNi4yMDQgMGwzNi4yMDMgMzYuMjA0YzkuOTk3IDkuOTk3IDkuOTk3IDI2LjIwNiAwIDM2LjIwNGwtMjk0LjQgMjk0LjQwMWMtOS45OTggOS45OTctMjYuMjA3IDkuOTk3LTM2LjIwNC0uMDAxeicvPjwvc3ZnPg==)
}

.toast-warning {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1NzYgNTEyJyB3aWR0aD0nNTc2JyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTU2OS41MTcgNDQwLjAxM0M1ODcuOTc1IDQ3Mi4wMDcgNTY0LjgwNiA1MTIgNTI3Ljk0IDUxMkg0OC4wNTRjLTM2LjkzNyAwLTU5Ljk5OS00MC4wNTUtNDEuNTc3LTcxLjk4N0wyNDYuNDIzIDIzLjk4NWMxOC40NjctMzIuMDA5IDY0LjcyLTMxLjk1MSA4My4xNTQgMGwyMzkuOTQgNDE2LjAyOHpNMjg4IDM1NGMtMjUuNDA1IDAtNDYgMjAuNTk1LTQ2IDQ2czIwLjU5NSA0NiA0NiA0NiA0Ni0yMC41OTUgNDYtNDYtMjAuNTk1LTQ2LTQ2LTQ2em0tNDMuNjczLTE2NS4zNDZsNy40MTggMTM2Yy4zNDcgNi4zNjQgNS42MDkgMTEuMzQ2IDExLjk4MiAxMS4zNDZoNDguNTQ2YzYuMzczIDAgMTEuNjM1LTQuOTgyIDExLjk4Mi0xMS4zNDZsNy40MTgtMTM2Yy4zNzUtNi44NzQtNS4wOTgtMTIuNjU0LTExLjk4Mi0xMi42NTRoLTYzLjM4M2MtNi44ODQgMC0xMi4zNTYgNS43OC0xMS45ODEgMTIuNjU0eicvPjwvc3ZnPg==)
}

.toast-container.toast-bottom-center .ngx-toastr,.toast-container.toast-top-center .ngx-toastr {
    width: 300px;
    margin-left: auto;
    margin-right: auto
}

.toast-container.toast-bottom-full-width .ngx-toastr,.toast-container.toast-top-full-width .ngx-toastr {
    width: 96%;
    margin-left: auto;
    margin-right: auto
}

.ngx-toastr {
    background-color: #030303;
    pointer-events: auto
}

.toast-success {
    background-color: #51a351
}

.toast-error {
    background-color: #bd362f
}

.toast-info {
    background-color: #2f96b4
}

.toast-warning {
    background-color: #f89406
}

.toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    background-color: #000;
    opacity: .4
}

@media(max-width: 240px) {
    .toast-container .ngx-toastr.div {
        padding:8px 8px 8px 50px;
        width: 11em
    }

    .toast-container .toast-close-button {
        right: -.2em;
        top: -.2em
    }
}

@media(min-width: 241px) and (max-width:480px) {
    .toast-container .ngx-toastr.div {
        padding:8px 8px 8px 50px;
        width: 18em
    }

    .toast-container .toast-close-button {
        right: -.2em;
        top: -.2em
    }
}

@media(min-width: 481px) and (max-width:768px) {
    .toast-container .ngx-toastr.div {
        padding:15px 15px 15px 50px;
        width: 25em
    }
}

*,:after,:before {
    box-sizing: border-box
}

body {
    font-family: -apple-system,system-ui,BlinkMacSystemFont,arial,Segoe UI,Roboto,Hiragino Sans GB,STHeiti,Microsoft YaHei,Helvetica Neue,Helvetica,SimSun,Tahoma,sans-serif,Apple Color Emoji;
    margin: 0;
    font-weight: 400;
    line-height: 1.5
}

fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0
}

.text-center {
    text-align: center!important
}

.position-relative {
    position: relative!important
}

.w-100 {
    width: 100%
}

.h-100 {
    height: 100%
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2
}

.invisible {
    visibility: hidden!important
}

.text-right {
    text-align: right!important
}

button {
    border-radius: 0
}

button,input,optgroup,select,textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

button,select {
    text-transform: none
}

button,input {
    overflow: visible
}

[type=button],[type=reset],[type=submit],button {
    -webkit-appearance: button
}

[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled) {
    cursor: pointer
}

.form-control {
    width: 100%;
    padding: .5em;
    border: none
}

.progress {
    display: flex;
    height: 1rem;
    overflow: hidden;
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: .25rem
}

.progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    text-align: center;
    background-color: #007bff;
    transition: width .6s ease
}

/*!* Bootstrap Grid v4.4.1 (https://getbootstrap.com/)
* Copyright 2011-2019 The Bootstrap Authors
* Copyright 2011-2019 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)*/
html {
    box-sizing: border-box;
    -ms-overflow-style: scrollbar
}

*,:after,:before {
    box-sizing: inherit
}

.container {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    margin-right: auto;
    margin-left: auto
}

@media(min-width: 1336px) {
    .container {
        max-width:1270px
    }
}

@media(min-width: 1440px) {
    .container {
        max-width:1275px
    }
}

@media(min-width: 1679px) {
    .container {
        max-width:1542px
    }
}

@media(min-width: 1912px) {
    .container {
        max-width:1770px
    }
}

.container-fluid,.container-lg,.container-md,.container-sm,.container-xl {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    margin-right: auto;
    margin-left: auto
}

@media(min-width: 1336px) {
    .container,.container-sm {
        max-width:1270px
    }
}

@media(min-width: 1440px) {
    .container,.container-md {
        max-width:1275px
    }
}

@media(min-width: 1679px) {
    .container,.container-lg,.container-md,.container-sm {
        max-width:1542px
    }
}

@media(min-width: 1912px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl {
        max-width:1770px
    }
}

.row {
    display: flex;
    flex-wrap: wrap
}

.no-gutters,.row {
    margin-right: 0;
    margin-left: 0
}

.no-gutters>.col,.no-gutters>[class*=col-] {
    padding-right: 0;
    padding-left: 0
}

.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-auto,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-auto,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-auto,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-auto,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-auto {
    position: relative;
    width: 100%;
    padding-right: 0;
    padding-left: 0
}

.col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%
}

.row-cols-1>* {
    flex: 0 0 100%;
    max-width: 100%
}

.row-cols-2>* {
    flex: 0 0 50%;
    max-width: 50%
}

.row-cols-3>* {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%
}

.row-cols-4>* {
    flex: 0 0 25%;
    max-width: 25%
}

.row-cols-5>* {
    flex: 0 0 20%;
    max-width: 20%
}

.row-cols-6>* {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%
}

.col-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%
}

.col-1 {
    flex: 0 0 12.5%;
    max-width: 12.5%
}

.col-2 {
    flex: 0 0 25%;
    max-width: 25%
}

.col-3 {
    flex: 0 0 37.5%;
    max-width: 37.5%
}

.col-4 {
    flex: 0 0 50%;
    max-width: 50%
}

.col-5 {
    flex: 0 0 62.5%;
    max-width: 62.5%
}

.col-6 {
    flex: 0 0 75%;
    max-width: 75%
}

.col-7 {
    flex: 0 0 87.5%;
    max-width: 87.5%
}

.col-8 {
    flex: 0 0 100%;
    max-width: 100%
}

.order-first {
    order: -1
}

.order-last {
    order: 9
}

.order-0 {
    order: 0
}

.order-1 {
    order: 1
}

.order-2 {
    order: 2
}

.order-3 {
    order: 3
}

.order-4 {
    order: 4
}

.order-5 {
    order: 5
}

.order-6 {
    order: 6
}

.order-7 {
    order: 7
}

.order-8 {
    order: 8
}

.offset-1 {
    margin-left: 12.5%
}

.offset-2 {
    margin-left: 25%
}

.offset-3 {
    margin-left: 37.5%
}

.offset-4 {
    margin-left: 50%
}

.offset-5 {
    margin-left: 62.5%
}

.offset-6 {
    margin-left: 75%
}

.offset-7 {
    margin-left: 87.5%
}

@media(min-width: 1336px) {
    .col-sm {
        flex-basis:0;
        flex-grow: 1;
        max-width: 100%
    }

    .row-cols-sm-1>* {
        flex: 0 0 100%;
        max-width: 100%
    }

    .row-cols-sm-2>* {
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-cols-sm-3>* {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .row-cols-sm-4>* {
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-cols-sm-5>* {
        flex: 0 0 20%;
        max-width: 20%
    }

    .row-cols-sm-6>* {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-sm-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%
    }

    .col-sm-1 {
        flex: 0 0 12.5%;
        max-width: 12.5%
    }

    .col-sm-2 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-sm-3 {
        flex: 0 0 37.5%;
        max-width: 37.5%
    }

    .col-sm-4 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-sm-5 {
        flex: 0 0 62.5%;
        max-width: 62.5%
    }

    .col-sm-6 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-sm-7 {
        flex: 0 0 87.5%;
        max-width: 87.5%
    }

    .col-sm-8 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-sm-first {
        order: -1
    }

    .order-sm-last {
        order: 9
    }

    .order-sm-0 {
        order: 0
    }

    .order-sm-1 {
        order: 1
    }

    .order-sm-2 {
        order: 2
    }

    .order-sm-3 {
        order: 3
    }

    .order-sm-4 {
        order: 4
    }

    .order-sm-5 {
        order: 5
    }

    .order-sm-6 {
        order: 6
    }

    .order-sm-7 {
        order: 7
    }

    .order-sm-8 {
        order: 8
    }

    .offset-sm-0 {
        margin-left: 0
    }

    .offset-sm-1 {
        margin-left: 12.5%
    }

    .offset-sm-2 {
        margin-left: 25%
    }

    .offset-sm-3 {
        margin-left: 37.5%
    }

    .offset-sm-4 {
        margin-left: 50%
    }

    .offset-sm-5 {
        margin-left: 62.5%
    }

    .offset-sm-6 {
        margin-left: 75%
    }

    .offset-sm-7 {
        margin-left: 87.5%
    }
}

@media(min-width: 1440px) {
    .col-md {
        flex-basis:0;
        flex-grow: 1;
        max-width: 100%
    }

    .row-cols-md-1>* {
        flex: 0 0 100%;
        max-width: 100%
    }

    .row-cols-md-2>* {
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-cols-md-3>* {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .row-cols-md-4>* {
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-cols-md-5>* {
        flex: 0 0 20%;
        max-width: 20%
    }

    .row-cols-md-6>* {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-md-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%
    }

    .col-md-1 {
        flex: 0 0 12.5%;
        max-width: 12.5%
    }

    .col-md-2 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-md-3 {
        flex: 0 0 37.5%;
        max-width: 37.5%
    }

    .col-md-4 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-md-5 {
        flex: 0 0 62.5%;
        max-width: 62.5%
    }

    .col-md-6 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-md-7 {
        flex: 0 0 87.5%;
        max-width: 87.5%
    }

    .col-md-8 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-md-first {
        order: -1
    }

    .order-md-last {
        order: 9
    }

    .order-md-0 {
        order: 0
    }

    .order-md-1 {
        order: 1
    }

    .order-md-2 {
        order: 2
    }

    .order-md-3 {
        order: 3
    }

    .order-md-4 {
        order: 4
    }

    .order-md-5 {
        order: 5
    }

    .order-md-6 {
        order: 6
    }

    .order-md-7 {
        order: 7
    }

    .order-md-8 {
        order: 8
    }

    .offset-md-0 {
        margin-left: 0
    }

    .offset-md-1 {
        margin-left: 12.5%
    }

    .offset-md-2 {
        margin-left: 25%
    }

    .offset-md-3 {
        margin-left: 37.5%
    }

    .offset-md-4 {
        margin-left: 50%
    }

    .offset-md-5 {
        margin-left: 62.5%
    }

    .offset-md-6 {
        margin-left: 75%
    }

    .offset-md-7 {
        margin-left: 87.5%
    }
}

@media(min-width: 1679px) {
    .col-lg {
        flex-basis:0;
        flex-grow: 1;
        max-width: 100%
    }

    .row-cols-lg-1>* {
        flex: 0 0 100%;
        max-width: 100%
    }

    .row-cols-lg-2>* {
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-cols-lg-3>* {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .row-cols-lg-4>* {
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-cols-lg-5>* {
        flex: 0 0 20%;
        max-width: 20%
    }

    .row-cols-lg-6>* {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-lg-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%
    }

    .col-lg-1 {
        flex: 0 0 12.5%;
        max-width: 12.5%
    }

    .col-lg-2 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-lg-3 {
        flex: 0 0 37.5%;
        max-width: 37.5%
    }

    .col-lg-4 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-lg-5 {
        flex: 0 0 62.5%;
        max-width: 62.5%
    }

    .col-lg-6 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-lg-7 {
        flex: 0 0 87.5%;
        max-width: 87.5%
    }

    .col-lg-8 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-lg-first {
        order: -1
    }

    .order-lg-last {
        order: 9
    }

    .order-lg-0 {
        order: 0
    }

    .order-lg-1 {
        order: 1
    }

    .order-lg-2 {
        order: 2
    }

    .order-lg-3 {
        order: 3
    }

    .order-lg-4 {
        order: 4
    }

    .order-lg-5 {
        order: 5
    }

    .order-lg-6 {
        order: 6
    }

    .order-lg-7 {
        order: 7
    }

    .order-lg-8 {
        order: 8
    }

    .offset-lg-0 {
        margin-left: 0
    }

    .offset-lg-1 {
        margin-left: 12.5%
    }

    .offset-lg-2 {
        margin-left: 25%
    }

    .offset-lg-3 {
        margin-left: 37.5%
    }

    .offset-lg-4 {
        margin-left: 50%
    }

    .offset-lg-5 {
        margin-left: 62.5%
    }

    .offset-lg-6 {
        margin-left: 75%
    }

    .offset-lg-7 {
        margin-left: 87.5%
    }
}

@media(min-width: 1912px) {
    .col-xl {
        flex-basis:0;
        flex-grow: 1;
        max-width: 100%
    }

    .row-cols-xl-1>* {
        flex: 0 0 100%;
        max-width: 100%
    }

    .row-cols-xl-2>* {
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-cols-xl-3>* {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .row-cols-xl-4>* {
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-cols-xl-5>* {
        flex: 0 0 20%;
        max-width: 20%
    }

    .row-cols-xl-6>* {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-xl-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%
    }

    .col-xl-1 {
        flex: 0 0 12.5%;
        max-width: 12.5%
    }

    .col-xl-2 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-xl-3 {
        flex: 0 0 37.5%;
        max-width: 37.5%
    }

    .col-xl-4 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-xl-5 {
        flex: 0 0 62.5%;
        max-width: 62.5%
    }

    .col-xl-6 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-xl-7 {
        flex: 0 0 87.5%;
        max-width: 87.5%
    }

    .col-xl-8 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-xl-first {
        order: -1
    }

    .order-xl-last {
        order: 9
    }

    .order-xl-0 {
        order: 0
    }

    .order-xl-1 {
        order: 1
    }

    .order-xl-2 {
        order: 2
    }

    .order-xl-3 {
        order: 3
    }

    .order-xl-4 {
        order: 4
    }

    .order-xl-5 {
        order: 5
    }

    .order-xl-6 {
        order: 6
    }

    .order-xl-7 {
        order: 7
    }

    .order-xl-8 {
        order: 8
    }

    .offset-xl-0 {
        margin-left: 0
    }

    .offset-xl-1 {
        margin-left: 12.5%
    }

    .offset-xl-2 {
        margin-left: 25%
    }

    .offset-xl-3 {
        margin-left: 37.5%
    }

    .offset-xl-4 {
        margin-left: 50%
    }

    .offset-xl-5 {
        margin-left: 62.5%
    }

    .offset-xl-6 {
        margin-left: 75%
    }

    .offset-xl-7 {
        margin-left: 87.5%
    }
}

.d-none {
    display: none!important
}

.d-inline {
    display: inline!important
}

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

.d-block {
    display: block!important
}

.d-table {
    display: table!important
}

.d-table-row {
    display: table-row!important
}

.d-table-cell {
    display: table-cell!important
}

.d-flex {
    display: flex!important
}

.d-inline-flex {
    display: inline-flex!important
}

@media(min-width: 1336px) {
    .d-sm-none {
        display:none!important
    }

    .d-sm-inline {
        display: inline!important
    }

    .d-sm-inline-block {
        display: inline-block!important
    }

    .d-sm-block {
        display: block!important
    }

    .d-sm-table {
        display: table!important
    }

    .d-sm-table-row {
        display: table-row!important
    }

    .d-sm-table-cell {
        display: table-cell!important
    }

    .d-sm-flex {
        display: flex!important
    }

    .d-sm-inline-flex {
        display: inline-flex!important
    }
}

@media(min-width: 1440px) {
    .d-md-none {
        display:none!important
    }

    .d-md-inline {
        display: inline!important
    }

    .d-md-inline-block {
        display: inline-block!important
    }

    .d-md-block {
        display: block!important
    }

    .d-md-table {
        display: table!important
    }

    .d-md-table-row {
        display: table-row!important
    }

    .d-md-table-cell {
        display: table-cell!important
    }

    .d-md-flex {
        display: flex!important
    }

    .d-md-inline-flex {
        display: inline-flex!important
    }
}

@media(min-width: 1679px) {
    .d-lg-none {
        display:none!important
    }

    .d-lg-inline {
        display: inline!important
    }

    .d-lg-inline-block {
        display: inline-block!important
    }

    .d-lg-block {
        display: block!important
    }

    .d-lg-table {
        display: table!important
    }

    .d-lg-table-row {
        display: table-row!important
    }

    .d-lg-table-cell {
        display: table-cell!important
    }

    .d-lg-flex {
        display: flex!important
    }

    .d-lg-inline-flex {
        display: inline-flex!important
    }
}

@media(min-width: 1912px) {
    .d-xl-none {
        display:none!important
    }

    .d-xl-inline {
        display: inline!important
    }

    .d-xl-inline-block {
        display: inline-block!important
    }

    .d-xl-block {
        display: block!important
    }

    .d-xl-table {
        display: table!important
    }

    .d-xl-table-row {
        display: table-row!important
    }

    .d-xl-table-cell {
        display: table-cell!important
    }

    .d-xl-flex {
        display: flex!important
    }

    .d-xl-inline-flex {
        display: inline-flex!important
    }
}

@media print {
    .d-print-none {
        display: none!important
    }

    .d-print-inline {
        display: inline!important
    }

    .d-print-inline-block {
        display: inline-block!important
    }

    .d-print-block {
        display: block!important
    }

    .d-print-table {
        display: table!important
    }

    .d-print-table-row {
        display: table-row!important
    }

    .d-print-table-cell {
        display: table-cell!important
    }

    .d-print-flex {
        display: flex!important
    }

    .d-print-inline-flex {
        display: inline-flex!important
    }
}

.flex-row {
    flex-direction: row!important
}

.flex-column {
    flex-direction: column!important
}

.flex-row-reverse {
    flex-direction: row-reverse!important
}

.flex-column-reverse {
    flex-direction: column-reverse!important
}

.flex-wrap {
    flex-wrap: wrap!important
}

.flex-nowrap {
    flex-wrap: nowrap!important
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse!important
}

.flex-fill {
    flex: 1 1 auto!important
}

.flex-grow-0 {
    flex-grow: 0!important
}

.flex-grow-1 {
    flex-grow: 1!important
}

.flex-shrink-0 {
    flex-shrink: 0!important
}

.flex-shrink-1 {
    flex-shrink: 1!important
}

.justify-content-start {
    justify-content: flex-start!important
}

.justify-content-end {
    justify-content: flex-end!important
}

.justify-content-center {
    justify-content: center!important
}

.justify-content-between {
    justify-content: space-between!important
}

.justify-content-around {
    justify-content: space-around!important
}

.align-items-start {
    align-items: flex-start!important
}

.align-items-end {
    align-items: flex-end!important
}

.align-items-center {
    align-items: center!important
}

.align-items-baseline {
    align-items: baseline!important
}

.align-items-stretch {
    align-items: stretch!important
}

.align-content-start {
    align-content: flex-start!important
}

.align-content-end {
    align-content: flex-end!important
}

.align-content-center {
    align-content: center!important
}

.align-content-between {
    align-content: space-between!important
}

.align-content-around {
    align-content: space-around!important
}

.align-content-stretch {
    align-content: stretch!important
}

.align-self-auto {
    align-self: auto!important
}

.align-self-start {
    align-self: flex-start!important
}

.align-self-end {
    align-self: flex-end!important
}

.align-self-center {
    align-self: center!important
}

.align-self-baseline {
    align-self: baseline!important
}

.align-self-stretch {
    align-self: stretch!important
}

@media(min-width: 1336px) {
    .flex-sm-row {
        flex-direction:row!important
    }

    .flex-sm-column {
        flex-direction: column!important
    }

    .flex-sm-row-reverse {
        flex-direction: row-reverse!important
    }

    .flex-sm-column-reverse {
        flex-direction: column-reverse!important
    }

    .flex-sm-wrap {
        flex-wrap: wrap!important
    }

    .flex-sm-nowrap {
        flex-wrap: nowrap!important
    }

    .flex-sm-wrap-reverse {
        flex-wrap: wrap-reverse!important
    }

    .flex-sm-fill {
        flex: 1 1 auto!important
    }

    .flex-sm-grow-0 {
        flex-grow: 0!important
    }

    .flex-sm-grow-1 {
        flex-grow: 1!important
    }

    .flex-sm-shrink-0 {
        flex-shrink: 0!important
    }

    .flex-sm-shrink-1 {
        flex-shrink: 1!important
    }

    .justify-content-sm-start {
        justify-content: flex-start!important
    }

    .justify-content-sm-end {
        justify-content: flex-end!important
    }

    .justify-content-sm-center {
        justify-content: center!important
    }

    .justify-content-sm-between {
        justify-content: space-between!important
    }

    .justify-content-sm-around {
        justify-content: space-around!important
    }

    .align-items-sm-start {
        align-items: flex-start!important
    }

    .align-items-sm-end {
        align-items: flex-end!important
    }

    .align-items-sm-center {
        align-items: center!important
    }

    .align-items-sm-baseline {
        align-items: baseline!important
    }

    .align-items-sm-stretch {
        align-items: stretch!important
    }

    .align-content-sm-start {
        align-content: flex-start!important
    }

    .align-content-sm-end {
        align-content: flex-end!important
    }

    .align-content-sm-center {
        align-content: center!important
    }

    .align-content-sm-between {
        align-content: space-between!important
    }

    .align-content-sm-around {
        align-content: space-around!important
    }

    .align-content-sm-stretch {
        align-content: stretch!important
    }

    .align-self-sm-auto {
        align-self: auto!important
    }

    .align-self-sm-start {
        align-self: flex-start!important
    }

    .align-self-sm-end {
        align-self: flex-end!important
    }

    .align-self-sm-center {
        align-self: center!important
    }

    .align-self-sm-baseline {
        align-self: baseline!important
    }

    .align-self-sm-stretch {
        align-self: stretch!important
    }
}

@media(min-width: 1440px) {
    .flex-md-row {
        flex-direction:row!important
    }

    .flex-md-column {
        flex-direction: column!important
    }

    .flex-md-row-reverse {
        flex-direction: row-reverse!important
    }

    .flex-md-column-reverse {
        flex-direction: column-reverse!important
    }

    .flex-md-wrap {
        flex-wrap: wrap!important
    }

    .flex-md-nowrap {
        flex-wrap: nowrap!important
    }

    .flex-md-wrap-reverse {
        flex-wrap: wrap-reverse!important
    }

    .flex-md-fill {
        flex: 1 1 auto!important
    }

    .flex-md-grow-0 {
        flex-grow: 0!important
    }

    .flex-md-grow-1 {
        flex-grow: 1!important
    }

    .flex-md-shrink-0 {
        flex-shrink: 0!important
    }

    .flex-md-shrink-1 {
        flex-shrink: 1!important
    }

    .justify-content-md-start {
        justify-content: flex-start!important
    }

    .justify-content-md-end {
        justify-content: flex-end!important
    }

    .justify-content-md-center {
        justify-content: center!important
    }

    .justify-content-md-between {
        justify-content: space-between!important
    }

    .justify-content-md-around {
        justify-content: space-around!important
    }

    .align-items-md-start {
        align-items: flex-start!important
    }

    .align-items-md-end {
        align-items: flex-end!important
    }

    .align-items-md-center {
        align-items: center!important
    }

    .align-items-md-baseline {
        align-items: baseline!important
    }

    .align-items-md-stretch {
        align-items: stretch!important
    }

    .align-content-md-start {
        align-content: flex-start!important
    }

    .align-content-md-end {
        align-content: flex-end!important
    }

    .align-content-md-center {
        align-content: center!important
    }

    .align-content-md-between {
        align-content: space-between!important
    }

    .align-content-md-around {
        align-content: space-around!important
    }

    .align-content-md-stretch {
        align-content: stretch!important
    }

    .align-self-md-auto {
        align-self: auto!important
    }

    .align-self-md-start {
        align-self: flex-start!important
    }

    .align-self-md-end {
        align-self: flex-end!important
    }

    .align-self-md-center {
        align-self: center!important
    }

    .align-self-md-baseline {
        align-self: baseline!important
    }

    .align-self-md-stretch {
        align-self: stretch!important
    }
}

@media(min-width: 1679px) {
    .flex-lg-row {
        flex-direction:row!important
    }

    .flex-lg-column {
        flex-direction: column!important
    }

    .flex-lg-row-reverse {
        flex-direction: row-reverse!important
    }

    .flex-lg-column-reverse {
        flex-direction: column-reverse!important
    }

    .flex-lg-wrap {
        flex-wrap: wrap!important
    }

    .flex-lg-nowrap {
        flex-wrap: nowrap!important
    }

    .flex-lg-wrap-reverse {
        flex-wrap: wrap-reverse!important
    }

    .flex-lg-fill {
        flex: 1 1 auto!important
    }

    .flex-lg-grow-0 {
        flex-grow: 0!important
    }

    .flex-lg-grow-1 {
        flex-grow: 1!important
    }

    .flex-lg-shrink-0 {
        flex-shrink: 0!important
    }

    .flex-lg-shrink-1 {
        flex-shrink: 1!important
    }

    .justify-content-lg-start {
        justify-content: flex-start!important
    }

    .justify-content-lg-end {
        justify-content: flex-end!important
    }

    .justify-content-lg-center {
        justify-content: center!important
    }

    .justify-content-lg-between {
        justify-content: space-between!important
    }

    .justify-content-lg-around {
        justify-content: space-around!important
    }

    .align-items-lg-start {
        align-items: flex-start!important
    }

    .align-items-lg-end {
        align-items: flex-end!important
    }

    .align-items-lg-center {
        align-items: center!important
    }

    .align-items-lg-baseline {
        align-items: baseline!important
    }

    .align-items-lg-stretch {
        align-items: stretch!important
    }

    .align-content-lg-start {
        align-content: flex-start!important
    }

    .align-content-lg-end {
        align-content: flex-end!important
    }

    .align-content-lg-center {
        align-content: center!important
    }

    .align-content-lg-between {
        align-content: space-between!important
    }

    .align-content-lg-around {
        align-content: space-around!important
    }

    .align-content-lg-stretch {
        align-content: stretch!important
    }

    .align-self-lg-auto {
        align-self: auto!important
    }

    .align-self-lg-start {
        align-self: flex-start!important
    }

    .align-self-lg-end {
        align-self: flex-end!important
    }

    .align-self-lg-center {
        align-self: center!important
    }

    .align-self-lg-baseline {
        align-self: baseline!important
    }

    .align-self-lg-stretch {
        align-self: stretch!important
    }
}

@media(min-width: 1912px) {
    .flex-xl-row {
        flex-direction:row!important
    }

    .flex-xl-column {
        flex-direction: column!important
    }

    .flex-xl-row-reverse {
        flex-direction: row-reverse!important
    }

    .flex-xl-column-reverse {
        flex-direction: column-reverse!important
    }

    .flex-xl-wrap {
        flex-wrap: wrap!important
    }

    .flex-xl-nowrap {
        flex-wrap: nowrap!important
    }

    .flex-xl-wrap-reverse {
        flex-wrap: wrap-reverse!important
    }

    .flex-xl-fill {
        flex: 1 1 auto!important
    }

    .flex-xl-grow-0 {
        flex-grow: 0!important
    }

    .flex-xl-grow-1 {
        flex-grow: 1!important
    }

    .flex-xl-shrink-0 {
        flex-shrink: 0!important
    }

    .flex-xl-shrink-1 {
        flex-shrink: 1!important
    }

    .justify-content-xl-start {
        justify-content: flex-start!important
    }

    .justify-content-xl-end {
        justify-content: flex-end!important
    }

    .justify-content-xl-center {
        justify-content: center!important
    }

    .justify-content-xl-between {
        justify-content: space-between!important
    }

    .justify-content-xl-around {
        justify-content: space-around!important
    }

    .align-items-xl-start {
        align-items: flex-start!important
    }

    .align-items-xl-end {
        align-items: flex-end!important
    }

    .align-items-xl-center {
        align-items: center!important
    }

    .align-items-xl-baseline {
        align-items: baseline!important
    }

    .align-items-xl-stretch {
        align-items: stretch!important
    }

    .align-content-xl-start {
        align-content: flex-start!important
    }

    .align-content-xl-end {
        align-content: flex-end!important
    }

    .align-content-xl-center {
        align-content: center!important
    }

    .align-content-xl-between {
        align-content: space-between!important
    }

    .align-content-xl-around {
        align-content: space-around!important
    }

    .align-content-xl-stretch {
        align-content: stretch!important
    }

    .align-self-xl-auto {
        align-self: auto!important
    }

    .align-self-xl-start {
        align-self: flex-start!important
    }

    .align-self-xl-end {
        align-self: flex-end!important
    }

    .align-self-xl-center {
        align-self: center!important
    }

    .align-self-xl-baseline {
        align-self: baseline!important
    }

    .align-self-xl-stretch {
        align-self: stretch!important
    }
}

.m-0 {
    margin: 0!important
}

.mt-0,.my-0 {
    margin-top: 0!important
}

.mr-0,.mx-0 {
    margin-right: 0!important
}

.mb-0,.my-0 {
    margin-bottom: 0!important
}

.ml-0,.mx-0 {
    margin-left: 0!important
}

.m-1 {
    margin: .25rem!important
}

.mt-1,.my-1 {
    margin-top: .25rem!important
}

.mr-1,.mx-1 {
    margin-right: .25rem!important
}

.mb-1,.my-1 {
    margin-bottom: .25rem!important
}

.ml-1,.mx-1 {
    margin-left: .25rem!important
}

.m-2 {
    margin: .5rem!important
}

.mt-2,.my-2 {
    margin-top: .5rem!important
}

.mr-2,.mx-2 {
    margin-right: .5rem!important
}

.mb-2,.my-2 {
    margin-bottom: .5rem!important
}

.ml-2,.mx-2 {
    margin-left: .5rem!important
}

.m-3 {
    margin: 1rem!important
}

.mt-3,.my-3 {
    margin-top: 1rem!important
}

.mr-3,.mx-3 {
    margin-right: 1rem!important
}

.mb-3,.my-3 {
    margin-bottom: 1rem!important
}

.ml-3,.mx-3 {
    margin-left: 1rem!important
}

.m-4 {
    margin: 1.5rem!important
}

.mt-4,.my-4 {
    margin-top: 1.5rem!important
}

.mr-4,.mx-4 {
    margin-right: 1.5rem!important
}

.mb-4,.my-4 {
    margin-bottom: 1.5rem!important
}

.ml-4,.mx-4 {
    margin-left: 1.5rem!important
}

.m-5 {
    margin: 3rem!important
}

.mt-5,.my-5 {
    margin-top: 3rem!important
}

.mr-5,.mx-5 {
    margin-right: 3rem!important
}

.mb-5,.my-5 {
    margin-bottom: 3rem!important
}

.ml-5,.mx-5 {
    margin-left: 3rem!important
}

.p-0 {
    padding: 0!important
}

.pt-0,.py-0 {
    padding-top: 0!important
}

.pr-0,.px-0 {
    padding-right: 0!important
}

.pb-0,.py-0 {
    padding-bottom: 0!important
}

.pl-0,.px-0 {
    padding-left: 0!important
}

.p-1 {
    padding: .25rem!important
}

.pt-1,.py-1 {
    padding-top: .25rem!important
}

.pr-1,.px-1 {
    padding-right: .25rem!important
}

.pb-1,.py-1 {
    padding-bottom: .25rem!important
}

.pl-1,.px-1 {
    padding-left: .25rem!important
}

.p-2 {
    padding: .5rem!important
}

.pt-2,.py-2 {
    padding-top: .5rem!important
}

.pr-2,.px-2 {
    padding-right: .5rem!important
}

.pb-2,.py-2 {
    padding-bottom: .5rem!important
}

.pl-2,.px-2 {
    padding-left: .5rem!important
}

.p-3 {
    padding: 1rem!important
}

.pt-3,.py-3 {
    padding-top: 1rem!important
}

.pr-3,.px-3 {
    padding-right: 1rem!important
}

.pb-3,.py-3 {
    padding-bottom: 1rem!important
}

.pl-3,.px-3 {
    padding-left: 1rem!important
}

.p-4 {
    padding: 1.5rem!important
}

.pt-4,.py-4 {
    padding-top: 1.5rem!important
}

.pr-4,.px-4 {
    padding-right: 1.5rem!important
}

.pb-4,.py-4 {
    padding-bottom: 1.5rem!important
}

.pl-4,.px-4 {
    padding-left: 1.5rem!important
}

.p-5 {
    padding: 3rem!important
}

.pt-5,.py-5 {
    padding-top: 3rem!important
}

.pr-5,.px-5 {
    padding-right: 3rem!important
}

.pb-5,.py-5 {
    padding-bottom: 3rem!important
}

.pl-5,.px-5 {
    padding-left: 3rem!important
}

.m-n1 {
    margin: -.25rem!important
}

.mt-n1,.my-n1 {
    margin-top: -.25rem!important
}

.mr-n1,.mx-n1 {
    margin-right: -.25rem!important
}

.mb-n1,.my-n1 {
    margin-bottom: -.25rem!important
}

.ml-n1,.mx-n1 {
    margin-left: -.25rem!important
}

.m-n2 {
    margin: -.5rem!important
}

.mt-n2,.my-n2 {
    margin-top: -.5rem!important
}

.mr-n2,.mx-n2 {
    margin-right: -.5rem!important
}

.mb-n2,.my-n2 {
    margin-bottom: -.5rem!important
}

.ml-n2,.mx-n2 {
    margin-left: -.5rem!important
}

.m-n3 {
    margin: -1rem!important
}

.mt-n3,.my-n3 {
    margin-top: -1rem!important
}

.mr-n3,.mx-n3 {
    margin-right: -1rem!important
}

.mb-n3,.my-n3 {
    margin-bottom: -1rem!important
}

.ml-n3,.mx-n3 {
    margin-left: -1rem!important
}

.m-n4 {
    margin: -1.5rem!important
}

.mt-n4,.my-n4 {
    margin-top: -1.5rem!important
}

.mr-n4,.mx-n4 {
    margin-right: -1.5rem!important
}

.mb-n4,.my-n4 {
    margin-bottom: -1.5rem!important
}

.ml-n4,.mx-n4 {
    margin-left: -1.5rem!important
}

.m-n5 {
    margin: -3rem!important
}

.mt-n5,.my-n5 {
    margin-top: -3rem!important
}

.mr-n5,.mx-n5 {
    margin-right: -3rem!important
}

.mb-n5,.my-n5 {
    margin-bottom: -3rem!important
}

.ml-n5,.mx-n5 {
    margin-left: -3rem!important
}

.m-auto {
    margin: auto!important
}

.mt-auto,.my-auto {
    margin-top: auto!important
}

.mr-auto,.mx-auto {
    margin-right: auto!important
}

.mb-auto,.my-auto {
    margin-bottom: auto!important
}

.ml-auto,.mx-auto {
    margin-left: auto!important
}

@media(min-width: 1336px) {
    .m-sm-0 {
        margin:0!important
    }

    .mt-sm-0,.my-sm-0 {
        margin-top: 0!important
    }

    .mr-sm-0,.mx-sm-0 {
        margin-right: 0!important
    }

    .mb-sm-0,.my-sm-0 {
        margin-bottom: 0!important
    }

    .ml-sm-0,.mx-sm-0 {
        margin-left: 0!important
    }

    .m-sm-1 {
        margin: .25rem!important
    }

    .mt-sm-1,.my-sm-1 {
        margin-top: .25rem!important
    }

    .mr-sm-1,.mx-sm-1 {
        margin-right: .25rem!important
    }

    .mb-sm-1,.my-sm-1 {
        margin-bottom: .25rem!important
    }

    .ml-sm-1,.mx-sm-1 {
        margin-left: .25rem!important
    }

    .m-sm-2 {
        margin: .5rem!important
    }

    .mt-sm-2,.my-sm-2 {
        margin-top: .5rem!important
    }

    .mr-sm-2,.mx-sm-2 {
        margin-right: .5rem!important
    }

    .mb-sm-2,.my-sm-2 {
        margin-bottom: .5rem!important
    }

    .ml-sm-2,.mx-sm-2 {
        margin-left: .5rem!important
    }

    .m-sm-3 {
        margin: 1rem!important
    }

    .mt-sm-3,.my-sm-3 {
        margin-top: 1rem!important
    }

    .mr-sm-3,.mx-sm-3 {
        margin-right: 1rem!important
    }

    .mb-sm-3,.my-sm-3 {
        margin-bottom: 1rem!important
    }

    .ml-sm-3,.mx-sm-3 {
        margin-left: 1rem!important
    }

    .m-sm-4 {
        margin: 1.5rem!important
    }

    .mt-sm-4,.my-sm-4 {
        margin-top: 1.5rem!important
    }

    .mr-sm-4,.mx-sm-4 {
        margin-right: 1.5rem!important
    }

    .mb-sm-4,.my-sm-4 {
        margin-bottom: 1.5rem!important
    }

    .ml-sm-4,.mx-sm-4 {
        margin-left: 1.5rem!important
    }

    .m-sm-5 {
        margin: 3rem!important
    }

    .mt-sm-5,.my-sm-5 {
        margin-top: 3rem!important
    }

    .mr-sm-5,.mx-sm-5 {
        margin-right: 3rem!important
    }

    .mb-sm-5,.my-sm-5 {
        margin-bottom: 3rem!important
    }

    .ml-sm-5,.mx-sm-5 {
        margin-left: 3rem!important
    }

    .p-sm-0 {
        padding: 0!important
    }

    .pt-sm-0,.py-sm-0 {
        padding-top: 0!important
    }

    .pr-sm-0,.px-sm-0 {
        padding-right: 0!important
    }

    .pb-sm-0,.py-sm-0 {
        padding-bottom: 0!important
    }

    .pl-sm-0,.px-sm-0 {
        padding-left: 0!important
    }

    .p-sm-1 {
        padding: .25rem!important
    }

    .pt-sm-1,.py-sm-1 {
        padding-top: .25rem!important
    }

    .pr-sm-1,.px-sm-1 {
        padding-right: .25rem!important
    }

    .pb-sm-1,.py-sm-1 {
        padding-bottom: .25rem!important
    }

    .pl-sm-1,.px-sm-1 {
        padding-left: .25rem!important
    }

    .p-sm-2 {
        padding: .5rem!important
    }

    .pt-sm-2,.py-sm-2 {
        padding-top: .5rem!important
    }

    .pr-sm-2,.px-sm-2 {
        padding-right: .5rem!important
    }

    .pb-sm-2,.py-sm-2 {
        padding-bottom: .5rem!important
    }

    .pl-sm-2,.px-sm-2 {
        padding-left: .5rem!important
    }

    .p-sm-3 {
        padding: 1rem!important
    }

    .pt-sm-3,.py-sm-3 {
        padding-top: 1rem!important
    }

    .pr-sm-3,.px-sm-3 {
        padding-right: 1rem!important
    }

    .pb-sm-3,.py-sm-3 {
        padding-bottom: 1rem!important
    }

    .pl-sm-3,.px-sm-3 {
        padding-left: 1rem!important
    }

    .p-sm-4 {
        padding: 1.5rem!important
    }

    .pt-sm-4,.py-sm-4 {
        padding-top: 1.5rem!important
    }

    .pr-sm-4,.px-sm-4 {
        padding-right: 1.5rem!important
    }

    .pb-sm-4,.py-sm-4 {
        padding-bottom: 1.5rem!important
    }

    .pl-sm-4,.px-sm-4 {
        padding-left: 1.5rem!important
    }

    .p-sm-5 {
        padding: 3rem!important
    }

    .pt-sm-5,.py-sm-5 {
        padding-top: 3rem!important
    }

    .pr-sm-5,.px-sm-5 {
        padding-right: 3rem!important
    }

    .pb-sm-5,.py-sm-5 {
        padding-bottom: 3rem!important
    }

    .pl-sm-5,.px-sm-5 {
        padding-left: 3rem!important
    }

    .m-sm-n1 {
        margin: -.25rem!important
    }

    .mt-sm-n1,.my-sm-n1 {
        margin-top: -.25rem!important
    }

    .mr-sm-n1,.mx-sm-n1 {
        margin-right: -.25rem!important
    }

    .mb-sm-n1,.my-sm-n1 {
        margin-bottom: -.25rem!important
    }

    .ml-sm-n1,.mx-sm-n1 {
        margin-left: -.25rem!important
    }

    .m-sm-n2 {
        margin: -.5rem!important
    }

    .mt-sm-n2,.my-sm-n2 {
        margin-top: -.5rem!important
    }

    .mr-sm-n2,.mx-sm-n2 {
        margin-right: -.5rem!important
    }

    .mb-sm-n2,.my-sm-n2 {
        margin-bottom: -.5rem!important
    }

    .ml-sm-n2,.mx-sm-n2 {
        margin-left: -.5rem!important
    }

    .m-sm-n3 {
        margin: -1rem!important
    }

    .mt-sm-n3,.my-sm-n3 {
        margin-top: -1rem!important
    }

    .mr-sm-n3,.mx-sm-n3 {
        margin-right: -1rem!important
    }

    .mb-sm-n3,.my-sm-n3 {
        margin-bottom: -1rem!important
    }

    .ml-sm-n3,.mx-sm-n3 {
        margin-left: -1rem!important
    }

    .m-sm-n4 {
        margin: -1.5rem!important
    }

    .mt-sm-n4,.my-sm-n4 {
        margin-top: -1.5rem!important
    }

    .mr-sm-n4,.mx-sm-n4 {
        margin-right: -1.5rem!important
    }

    .mb-sm-n4,.my-sm-n4 {
        margin-bottom: -1.5rem!important
    }

    .ml-sm-n4,.mx-sm-n4 {
        margin-left: -1.5rem!important
    }

    .m-sm-n5 {
        margin: -3rem!important
    }

    .mt-sm-n5,.my-sm-n5 {
        margin-top: -3rem!important
    }

    .mr-sm-n5,.mx-sm-n5 {
        margin-right: -3rem!important
    }

    .mb-sm-n5,.my-sm-n5 {
        margin-bottom: -3rem!important
    }

    .ml-sm-n5,.mx-sm-n5 {
        margin-left: -3rem!important
    }

    .m-sm-auto {
        margin: auto!important
    }

    .mt-sm-auto,.my-sm-auto {
        margin-top: auto!important
    }

    .mr-sm-auto,.mx-sm-auto {
        margin-right: auto!important
    }

    .mb-sm-auto,.my-sm-auto {
        margin-bottom: auto!important
    }

    .ml-sm-auto,.mx-sm-auto {
        margin-left: auto!important
    }
}

@media(min-width: 1440px) {
    .m-md-0 {
        margin:0!important
    }

    .mt-md-0,.my-md-0 {
        margin-top: 0!important
    }

    .mr-md-0,.mx-md-0 {
        margin-right: 0!important
    }

    .mb-md-0,.my-md-0 {
        margin-bottom: 0!important
    }

    .ml-md-0,.mx-md-0 {
        margin-left: 0!important
    }

    .m-md-1 {
        margin: .25rem!important
    }

    .mt-md-1,.my-md-1 {
        margin-top: .25rem!important
    }

    .mr-md-1,.mx-md-1 {
        margin-right: .25rem!important
    }

    .mb-md-1,.my-md-1 {
        margin-bottom: .25rem!important
    }

    .ml-md-1,.mx-md-1 {
        margin-left: .25rem!important
    }

    .m-md-2 {
        margin: .5rem!important
    }

    .mt-md-2,.my-md-2 {
        margin-top: .5rem!important
    }

    .mr-md-2,.mx-md-2 {
        margin-right: .5rem!important
    }

    .mb-md-2,.my-md-2 {
        margin-bottom: .5rem!important
    }

    .ml-md-2,.mx-md-2 {
        margin-left: .5rem!important
    }

    .m-md-3 {
        margin: 1rem!important
    }

    .mt-md-3,.my-md-3 {
        margin-top: 1rem!important
    }

    .mr-md-3,.mx-md-3 {
        margin-right: 1rem!important
    }

    .mb-md-3,.my-md-3 {
        margin-bottom: 1rem!important
    }

    .ml-md-3,.mx-md-3 {
        margin-left: 1rem!important
    }

    .m-md-4 {
        margin: 1.5rem!important
    }

    .mt-md-4,.my-md-4 {
        margin-top: 1.5rem!important
    }

    .mr-md-4,.mx-md-4 {
        margin-right: 1.5rem!important
    }

    .mb-md-4,.my-md-4 {
        margin-bottom: 1.5rem!important
    }

    .ml-md-4,.mx-md-4 {
        margin-left: 1.5rem!important
    }

    .m-md-5 {
        margin: 3rem!important
    }

    .mt-md-5,.my-md-5 {
        margin-top: 3rem!important
    }

    .mr-md-5,.mx-md-5 {
        margin-right: 3rem!important
    }

    .mb-md-5,.my-md-5 {
        margin-bottom: 3rem!important
    }

    .ml-md-5,.mx-md-5 {
        margin-left: 3rem!important
    }

    .p-md-0 {
        padding: 0!important
    }

    .pt-md-0,.py-md-0 {
        padding-top: 0!important
    }

    .pr-md-0,.px-md-0 {
        padding-right: 0!important
    }

    .pb-md-0,.py-md-0 {
        padding-bottom: 0!important
    }

    .pl-md-0,.px-md-0 {
        padding-left: 0!important
    }

    .p-md-1 {
        padding: .25rem!important
    }

    .pt-md-1,.py-md-1 {
        padding-top: .25rem!important
    }

    .pr-md-1,.px-md-1 {
        padding-right: .25rem!important
    }

    .pb-md-1,.py-md-1 {
        padding-bottom: .25rem!important
    }

    .pl-md-1,.px-md-1 {
        padding-left: .25rem!important
    }

    .p-md-2 {
        padding: .5rem!important
    }

    .pt-md-2,.py-md-2 {
        padding-top: .5rem!important
    }

    .pr-md-2,.px-md-2 {
        padding-right: .5rem!important
    }

    .pb-md-2,.py-md-2 {
        padding-bottom: .5rem!important
    }

    .pl-md-2,.px-md-2 {
        padding-left: .5rem!important
    }

    .p-md-3 {
        padding: 1rem!important
    }

    .pt-md-3,.py-md-3 {
        padding-top: 1rem!important
    }

    .pr-md-3,.px-md-3 {
        padding-right: 1rem!important
    }

    .pb-md-3,.py-md-3 {
        padding-bottom: 1rem!important
    }

    .pl-md-3,.px-md-3 {
        padding-left: 1rem!important
    }

    .p-md-4 {
        padding: 1.5rem!important
    }

    .pt-md-4,.py-md-4 {
        padding-top: 1.5rem!important
    }

    .pr-md-4,.px-md-4 {
        padding-right: 1.5rem!important
    }

    .pb-md-4,.py-md-4 {
        padding-bottom: 1.5rem!important
    }

    .pl-md-4,.px-md-4 {
        padding-left: 1.5rem!important
    }

    .p-md-5 {
        padding: 3rem!important
    }

    .pt-md-5,.py-md-5 {
        padding-top: 3rem!important
    }

    .pr-md-5,.px-md-5 {
        padding-right: 3rem!important
    }

    .pb-md-5,.py-md-5 {
        padding-bottom: 3rem!important
    }

    .pl-md-5,.px-md-5 {
        padding-left: 3rem!important
    }

    .m-md-n1 {
        margin: -.25rem!important
    }

    .mt-md-n1,.my-md-n1 {
        margin-top: -.25rem!important
    }

    .mr-md-n1,.mx-md-n1 {
        margin-right: -.25rem!important
    }

    .mb-md-n1,.my-md-n1 {
        margin-bottom: -.25rem!important
    }

    .ml-md-n1,.mx-md-n1 {
        margin-left: -.25rem!important
    }

    .m-md-n2 {
        margin: -.5rem!important
    }

    .mt-md-n2,.my-md-n2 {
        margin-top: -.5rem!important
    }

    .mr-md-n2,.mx-md-n2 {
        margin-right: -.5rem!important
    }

    .mb-md-n2,.my-md-n2 {
        margin-bottom: -.5rem!important
    }

    .ml-md-n2,.mx-md-n2 {
        margin-left: -.5rem!important
    }

    .m-md-n3 {
        margin: -1rem!important
    }

    .mt-md-n3,.my-md-n3 {
        margin-top: -1rem!important
    }

    .mr-md-n3,.mx-md-n3 {
        margin-right: -1rem!important
    }

    .mb-md-n3,.my-md-n3 {
        margin-bottom: -1rem!important
    }

    .ml-md-n3,.mx-md-n3 {
        margin-left: -1rem!important
    }

    .m-md-n4 {
        margin: -1.5rem!important
    }

    .mt-md-n4,.my-md-n4 {
        margin-top: -1.5rem!important
    }

    .mr-md-n4,.mx-md-n4 {
        margin-right: -1.5rem!important
    }

    .mb-md-n4,.my-md-n4 {
        margin-bottom: -1.5rem!important
    }

    .ml-md-n4,.mx-md-n4 {
        margin-left: -1.5rem!important
    }

    .m-md-n5 {
        margin: -3rem!important
    }

    .mt-md-n5,.my-md-n5 {
        margin-top: -3rem!important
    }

    .mr-md-n5,.mx-md-n5 {
        margin-right: -3rem!important
    }

    .mb-md-n5,.my-md-n5 {
        margin-bottom: -3rem!important
    }

    .ml-md-n5,.mx-md-n5 {
        margin-left: -3rem!important
    }

    .m-md-auto {
        margin: auto!important
    }

    .mt-md-auto,.my-md-auto {
        margin-top: auto!important
    }

    .mr-md-auto,.mx-md-auto {
        margin-right: auto!important
    }

    .mb-md-auto,.my-md-auto {
        margin-bottom: auto!important
    }

    .ml-md-auto,.mx-md-auto {
        margin-left: auto!important
    }
}

@media(min-width: 1679px) {
    .m-lg-0 {
        margin:0!important
    }

    .mt-lg-0,.my-lg-0 {
        margin-top: 0!important
    }

    .mr-lg-0,.mx-lg-0 {
        margin-right: 0!important
    }

    .mb-lg-0,.my-lg-0 {
        margin-bottom: 0!important
    }

    .ml-lg-0,.mx-lg-0 {
        margin-left: 0!important
    }

    .m-lg-1 {
        margin: .25rem!important
    }

    .mt-lg-1,.my-lg-1 {
        margin-top: .25rem!important
    }

    .mr-lg-1,.mx-lg-1 {
        margin-right: .25rem!important
    }

    .mb-lg-1,.my-lg-1 {
        margin-bottom: .25rem!important
    }

    .ml-lg-1,.mx-lg-1 {
        margin-left: .25rem!important
    }

    .m-lg-2 {
        margin: .5rem!important
    }

    .mt-lg-2,.my-lg-2 {
        margin-top: .5rem!important
    }

    .mr-lg-2,.mx-lg-2 {
        margin-right: .5rem!important
    }

    .mb-lg-2,.my-lg-2 {
        margin-bottom: .5rem!important
    }

    .ml-lg-2,.mx-lg-2 {
        margin-left: .5rem!important
    }

    .m-lg-3 {
        margin: 1rem!important
    }

    .mt-lg-3,.my-lg-3 {
        margin-top: 1rem!important
    }

    .mr-lg-3,.mx-lg-3 {
        margin-right: 1rem!important
    }

    .mb-lg-3,.my-lg-3 {
        margin-bottom: 1rem!important
    }

    .ml-lg-3,.mx-lg-3 {
        margin-left: 1rem!important
    }

    .m-lg-4 {
        margin: 1.5rem!important
    }

    .mt-lg-4,.my-lg-4 {
        margin-top: 1.5rem!important
    }

    .mr-lg-4,.mx-lg-4 {
        margin-right: 1.5rem!important
    }

    .mb-lg-4,.my-lg-4 {
        margin-bottom: 1.5rem!important
    }

    .ml-lg-4,.mx-lg-4 {
        margin-left: 1.5rem!important
    }

    .m-lg-5 {
        margin: 3rem!important
    }

    .mt-lg-5,.my-lg-5 {
        margin-top: 3rem!important
    }

    .mr-lg-5,.mx-lg-5 {
        margin-right: 3rem!important
    }

    .mb-lg-5,.my-lg-5 {
        margin-bottom: 3rem!important
    }

    .ml-lg-5,.mx-lg-5 {
        margin-left: 3rem!important
    }

    .p-lg-0 {
        padding: 0!important
    }

    .pt-lg-0,.py-lg-0 {
        padding-top: 0!important
    }

    .pr-lg-0,.px-lg-0 {
        padding-right: 0!important
    }

    .pb-lg-0,.py-lg-0 {
        padding-bottom: 0!important
    }

    .pl-lg-0,.px-lg-0 {
        padding-left: 0!important
    }

    .p-lg-1 {
        padding: .25rem!important
    }

    .pt-lg-1,.py-lg-1 {
        padding-top: .25rem!important
    }

    .pr-lg-1,.px-lg-1 {
        padding-right: .25rem!important
    }

    .pb-lg-1,.py-lg-1 {
        padding-bottom: .25rem!important
    }

    .pl-lg-1,.px-lg-1 {
        padding-left: .25rem!important
    }

    .p-lg-2 {
        padding: .5rem!important
    }

    .pt-lg-2,.py-lg-2 {
        padding-top: .5rem!important
    }

    .pr-lg-2,.px-lg-2 {
        padding-right: .5rem!important
    }

    .pb-lg-2,.py-lg-2 {
        padding-bottom: .5rem!important
    }

    .pl-lg-2,.px-lg-2 {
        padding-left: .5rem!important
    }

    .p-lg-3 {
        padding: 1rem!important
    }

    .pt-lg-3,.py-lg-3 {
        padding-top: 1rem!important
    }

    .pr-lg-3,.px-lg-3 {
        padding-right: 1rem!important
    }

    .pb-lg-3,.py-lg-3 {
        padding-bottom: 1rem!important
    }

    .pl-lg-3,.px-lg-3 {
        padding-left: 1rem!important
    }

    .p-lg-4 {
        padding: 1.5rem!important
    }

    .pt-lg-4,.py-lg-4 {
        padding-top: 1.5rem!important
    }

    .pr-lg-4,.px-lg-4 {
        padding-right: 1.5rem!important
    }

    .pb-lg-4,.py-lg-4 {
        padding-bottom: 1.5rem!important
    }

    .pl-lg-4,.px-lg-4 {
        padding-left: 1.5rem!important
    }

    .p-lg-5 {
        padding: 3rem!important
    }

    .pt-lg-5,.py-lg-5 {
        padding-top: 3rem!important
    }

    .pr-lg-5,.px-lg-5 {
        padding-right: 3rem!important
    }

    .pb-lg-5,.py-lg-5 {
        padding-bottom: 3rem!important
    }

    .pl-lg-5,.px-lg-5 {
        padding-left: 3rem!important
    }

    .m-lg-n1 {
        margin: -.25rem!important
    }

    .mt-lg-n1,.my-lg-n1 {
        margin-top: -.25rem!important
    }

    .mr-lg-n1,.mx-lg-n1 {
        margin-right: -.25rem!important
    }

    .mb-lg-n1,.my-lg-n1 {
        margin-bottom: -.25rem!important
    }

    .ml-lg-n1,.mx-lg-n1 {
        margin-left: -.25rem!important
    }

    .m-lg-n2 {
        margin: -.5rem!important
    }

    .mt-lg-n2,.my-lg-n2 {
        margin-top: -.5rem!important
    }

    .mr-lg-n2,.mx-lg-n2 {
        margin-right: -.5rem!important
    }

    .mb-lg-n2,.my-lg-n2 {
        margin-bottom: -.5rem!important
    }

    .ml-lg-n2,.mx-lg-n2 {
        margin-left: -.5rem!important
    }

    .m-lg-n3 {
        margin: -1rem!important
    }

    .mt-lg-n3,.my-lg-n3 {
        margin-top: -1rem!important
    }

    .mr-lg-n3,.mx-lg-n3 {
        margin-right: -1rem!important
    }

    .mb-lg-n3,.my-lg-n3 {
        margin-bottom: -1rem!important
    }

    .ml-lg-n3,.mx-lg-n3 {
        margin-left: -1rem!important
    }

    .m-lg-n4 {
        margin: -1.5rem!important
    }

    .mt-lg-n4,.my-lg-n4 {
        margin-top: -1.5rem!important
    }

    .mr-lg-n4,.mx-lg-n4 {
        margin-right: -1.5rem!important
    }

    .mb-lg-n4,.my-lg-n4 {
        margin-bottom: -1.5rem!important
    }

    .ml-lg-n4,.mx-lg-n4 {
        margin-left: -1.5rem!important
    }

    .m-lg-n5 {
        margin: -3rem!important
    }

    .mt-lg-n5,.my-lg-n5 {
        margin-top: -3rem!important
    }

    .mr-lg-n5,.mx-lg-n5 {
        margin-right: -3rem!important
    }

    .mb-lg-n5,.my-lg-n5 {
        margin-bottom: -3rem!important
    }

    .ml-lg-n5,.mx-lg-n5 {
        margin-left: -3rem!important
    }

    .m-lg-auto {
        margin: auto!important
    }

    .mt-lg-auto,.my-lg-auto {
        margin-top: auto!important
    }

    .mr-lg-auto,.mx-lg-auto {
        margin-right: auto!important
    }

    .mb-lg-auto,.my-lg-auto {
        margin-bottom: auto!important
    }

    .ml-lg-auto,.mx-lg-auto {
        margin-left: auto!important
    }
}

@media(min-width: 1912px) {
    .m-xl-0 {
        margin:0!important
    }

    .mt-xl-0,.my-xl-0 {
        margin-top: 0!important
    }

    .mr-xl-0,.mx-xl-0 {
        margin-right: 0!important
    }

    .mb-xl-0,.my-xl-0 {
        margin-bottom: 0!important
    }

    .ml-xl-0,.mx-xl-0 {
        margin-left: 0!important
    }

    .m-xl-1 {
        margin: .25rem!important
    }

    .mt-xl-1,.my-xl-1 {
        margin-top: .25rem!important
    }

    .mr-xl-1,.mx-xl-1 {
        margin-right: .25rem!important
    }

    .mb-xl-1,.my-xl-1 {
        margin-bottom: .25rem!important
    }

    .ml-xl-1,.mx-xl-1 {
        margin-left: .25rem!important
    }

    .m-xl-2 {
        margin: .5rem!important
    }

    .mt-xl-2,.my-xl-2 {
        margin-top: .5rem!important
    }

    .mr-xl-2,.mx-xl-2 {
        margin-right: .5rem!important
    }

    .mb-xl-2,.my-xl-2 {
        margin-bottom: .5rem!important
    }

    .ml-xl-2,.mx-xl-2 {
        margin-left: .5rem!important
    }

    .m-xl-3 {
        margin: 1rem!important
    }

    .mt-xl-3,.my-xl-3 {
        margin-top: 1rem!important
    }

    .mr-xl-3,.mx-xl-3 {
        margin-right: 1rem!important
    }

    .mb-xl-3,.my-xl-3 {
        margin-bottom: 1rem!important
    }

    .ml-xl-3,.mx-xl-3 {
        margin-left: 1rem!important
    }

    .m-xl-4 {
        margin: 1.5rem!important
    }

    .mt-xl-4,.my-xl-4 {
        margin-top: 1.5rem!important
    }

    .mr-xl-4,.mx-xl-4 {
        margin-right: 1.5rem!important
    }

    .mb-xl-4,.my-xl-4 {
        margin-bottom: 1.5rem!important
    }

    .ml-xl-4,.mx-xl-4 {
        margin-left: 1.5rem!important
    }

    .m-xl-5 {
        margin: 3rem!important
    }

    .mt-xl-5,.my-xl-5 {
        margin-top: 3rem!important
    }

    .mr-xl-5,.mx-xl-5 {
        margin-right: 3rem!important
    }

    .mb-xl-5,.my-xl-5 {
        margin-bottom: 3rem!important
    }

    .ml-xl-5,.mx-xl-5 {
        margin-left: 3rem!important
    }

    .p-xl-0 {
        padding: 0!important
    }

    .pt-xl-0,.py-xl-0 {
        padding-top: 0!important
    }

    .pr-xl-0,.px-xl-0 {
        padding-right: 0!important
    }

    .pb-xl-0,.py-xl-0 {
        padding-bottom: 0!important
    }

    .pl-xl-0,.px-xl-0 {
        padding-left: 0!important
    }

    .p-xl-1 {
        padding: .25rem!important
    }

    .pt-xl-1,.py-xl-1 {
        padding-top: .25rem!important
    }

    .pr-xl-1,.px-xl-1 {
        padding-right: .25rem!important
    }

    .pb-xl-1,.py-xl-1 {
        padding-bottom: .25rem!important
    }

    .pl-xl-1,.px-xl-1 {
        padding-left: .25rem!important
    }

    .p-xl-2 {
        padding: .5rem!important
    }

    .pt-xl-2,.py-xl-2 {
        padding-top: .5rem!important
    }

    .pr-xl-2,.px-xl-2 {
        padding-right: .5rem!important
    }

    .pb-xl-2,.py-xl-2 {
        padding-bottom: .5rem!important
    }

    .pl-xl-2,.px-xl-2 {
        padding-left: .5rem!important
    }

    .p-xl-3 {
        padding: 1rem!important
    }

    .pt-xl-3,.py-xl-3 {
        padding-top: 1rem!important
    }

    .pr-xl-3,.px-xl-3 {
        padding-right: 1rem!important
    }

    .pb-xl-3,.py-xl-3 {
        padding-bottom: 1rem!important
    }

    .pl-xl-3,.px-xl-3 {
        padding-left: 1rem!important
    }

    .p-xl-4 {
        padding: 1.5rem!important
    }

    .pt-xl-4,.py-xl-4 {
        padding-top: 1.5rem!important
    }

    .pr-xl-4,.px-xl-4 {
        padding-right: 1.5rem!important
    }

    .pb-xl-4,.py-xl-4 {
        padding-bottom: 1.5rem!important
    }

    .pl-xl-4,.px-xl-4 {
        padding-left: 1.5rem!important
    }

    .p-xl-5 {
        padding: 3rem!important
    }

    .pt-xl-5,.py-xl-5 {
        padding-top: 3rem!important
    }

    .pr-xl-5,.px-xl-5 {
        padding-right: 3rem!important
    }

    .pb-xl-5,.py-xl-5 {
        padding-bottom: 3rem!important
    }

    .pl-xl-5,.px-xl-5 {
        padding-left: 3rem!important
    }

    .m-xl-n1 {
        margin: -.25rem!important
    }

    .mt-xl-n1,.my-xl-n1 {
        margin-top: -.25rem!important
    }

    .mr-xl-n1,.mx-xl-n1 {
        margin-right: -.25rem!important
    }

    .mb-xl-n1,.my-xl-n1 {
        margin-bottom: -.25rem!important
    }

    .ml-xl-n1,.mx-xl-n1 {
        margin-left: -.25rem!important
    }

    .m-xl-n2 {
        margin: -.5rem!important
    }

    .mt-xl-n2,.my-xl-n2 {
        margin-top: -.5rem!important
    }

    .mr-xl-n2,.mx-xl-n2 {
        margin-right: -.5rem!important
    }

    .mb-xl-n2,.my-xl-n2 {
        margin-bottom: -.5rem!important
    }

    .ml-xl-n2,.mx-xl-n2 {
        margin-left: -.5rem!important
    }

    .m-xl-n3 {
        margin: -1rem!important
    }

    .mt-xl-n3,.my-xl-n3 {
        margin-top: -1rem!important
    }

    .mr-xl-n3,.mx-xl-n3 {
        margin-right: -1rem!important
    }

    .mb-xl-n3,.my-xl-n3 {
        margin-bottom: -1rem!important
    }

    .ml-xl-n3,.mx-xl-n3 {
        margin-left: -1rem!important
    }

    .m-xl-n4 {
        margin: -1.5rem!important
    }

    .mt-xl-n4,.my-xl-n4 {
        margin-top: -1.5rem!important
    }

    .mr-xl-n4,.mx-xl-n4 {
        margin-right: -1.5rem!important
    }

    .mb-xl-n4,.my-xl-n4 {
        margin-bottom: -1.5rem!important
    }

    .ml-xl-n4,.mx-xl-n4 {
        margin-left: -1.5rem!important
    }

    .m-xl-n5 {
        margin: -3rem!important
    }

    .mt-xl-n5,.my-xl-n5 {
        margin-top: -3rem!important
    }

    .mr-xl-n5,.mx-xl-n5 {
        margin-right: -3rem!important
    }

    .mb-xl-n5,.my-xl-n5 {
        margin-bottom: -3rem!important
    }

    .ml-xl-n5,.mx-xl-n5 {
        margin-left: -3rem!important
    }

    .m-xl-auto {
        margin: auto!important
    }

    .mt-xl-auto,.my-xl-auto {
        margin-top: auto!important
    }

    .mr-xl-auto,.mx-xl-auto {
        margin-right: auto!important
    }

    .mb-xl-auto,.my-xl-auto {
        margin-bottom: auto!important
    }

    .ml-xl-auto,.mx-xl-auto {
        margin-left: auto!important
    }
}

.toast-screen-center {
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%)
}

.v-page {
    display: flex;
    position: relative;
    padding-top: 64px
}

.v-page .page-left,.v-page .page-right {
    position: relative;
    flex: 1;
    overflow: hidden
}

.v-page .page-left {
    padding-right: 25px
}

.u-page {
    background-color: #090b21;
    padding-top: 61px;
    padding-bottom: 30px
}

.light .u-page {
    background-color: #f8f8f8
}

.form-group {
    position: relative;
    display: flex;
    padding-bottom: 1.3rem
}

.form-group label {
    width: 80px
}

.form-group input,.form-group select,.form-group textarea {
    flex: 1;
    border: 1px solid #ddd
}

.form-group input:active,.form-group input:focus,.form-group select:active,.form-group select:focus,.form-group textarea:active,.form-group textarea:focus {
    border-color: #666
}

.form-group input[type=password],.form-group input[type=text],.form-group textarea {
    padding: 6px 8px
}

.form-group .form-error-message {
    position: absolute;
    bottom: -.5rem;
    left: 72px
}

.form-group label {
    position: relative
}

.form-group label .required-mark {
    position: absolute;
    left: 16px;
    top: 5px
}

.form-group.error label {
    color: red
}

.form-group.error input {
    border-color: red
}

select.ng-untouched {
    color: #666
}

.form-button {
    background-color: #f8f8f8!important;
    min-width: 130px;
    border-color: #7a7a7a;
    display: flex;
    text-align: center;
    justify-content: center
}

.form-button.loading.dn-button-plain,.form-button.loading.dn-button-plain:hover {
    color: #fff!important
}

.form-button.dn-button-plain:hover,.form-button:hover {
    color: #000!important
}

.form-button .loader {
    left: 8px;
    top: 6px;
    margin-right: 8px
}

.error input,.error select,.error textarea {
    border-color: red
}

.text-gray {
    color: #f8f8f8!important
}

.text-light {
    color: #fff6!important
}

.light .text-light {
    color: #888!important
}

.text-large {
    font-size: 18px
}

text-medium {
    font-size: 16px
}

.text-small {
    font-size: 13px
}

.dn-button {
    border: none;
    outline: none!important;
    display: block;
    padding: 6px 8px;
    width: auto;
    min-width: 100px;
    margin: 0 .4rem;
    border-radius: 0;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    text-align: center;
    color: #fff!important;
    background-color: #373843
}

.light .dn-button {
    background-color: #777
}

.dn-button:hover {
    background-color: #6663
}

.dn-button-plain {
    -webkit-user-select: none;
    user-select: none;
    border: 1px solid silver;
    color: #000!important;
    background-color: #fff;
    padding: 6px 20px;
    cursor: pointer
}

.dn-button-plain:hover {
    background-color: #cacaca;
    color: #fff!important
}

.dn-button-outline {
    outline: none!important;
    -webkit-user-select: none;
    user-select: none;
    border: 2px solid silver;
    border-radius: 0;
    background-color: #fff;
    padding: 2px 14px;
    cursor: pointer
}

.dn-button-outline:hover {
    background-color: #cacaca;
    color: #fff!important
}

.dn-button-outline.orange {
    color: #f49800;
    border-color: #f49800;
    background-color: #434343
}

.dn-button-outline.orange:hover {
    color: #fe9e00!important;
    border-color: #fe9e00!important;
    background-color: #000
}

.dn-button-blue {
    color: #fff!important;
    background-color: #00a8ec!important
}

.dn-button-blue:hover {
    background-color: #00b6ff!important
}

.dn-button-disable {
    cursor: default;
    color: #fff3!important;
    background-color: #6663!important
}

.light .dn-button-disable {
    color: #a0a0a0!important
}

.dn-button-orange {
    color: #fff!important;
    background-color: #f49800
}

.dn-button-orange:hover {
    background-color: #fe9e00
}

.dn-button-gold {
    color: #fff!important;
    background-color: #f49800!important
}

.dn-button-gold:hover {
    background-color: #fe9e00!important
}

.dn-button-red {
    color: #fff!important
}

.dn-button-red,.dn-button-red:hover {
    background-color: #00c0ff
}

.dn-button-large {
    padding: 10px 18px
}

.dn-play-button {
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    padding: 4px 12px;
    border-radius: 3px;
    font-size: 16px;
    display: inline-block;
    color: #fff!important;
    background-color: #f00000
}

.dn-play-button:hover {
    background-color: #f10000
}

.dn-play-button .btn-icon {
    font-size: 20px;
    vertical-align: middle
}

.dn-play-button .btn-text {
    display: inline-block;
    border-left: 1px solid #fff;
    padding: 3px 8px 3px 10px;
    vertical-align: middle
}

.dn-btn-load-more {
    cursor: pointer;
    padding: 5px 15px
}

.link-blue {
    color: #00a8ec
}

.link-blue:hover {
    color: #434343
}

.red {
    color: #f00000
}

.rose {
    color: #ff01ff
}

.orange {
    color: #fe9e00
}

.dn-col-1 {
    width: 238px
}

.text-white {
    color: #fff!important
}

.text-bold {
    font-size: 15px;
    font-weight: 600
}

.text-red {
    color: #f00000!important
}

.text-green {
    color: #0ec610
}

.text-gold {
    color: #e79505
}

.text-blue {
    color: #0480e2
}

.text-shadow {
    text-shadow: 0 0 3px #000
}

.vl-middle {
    vertical-align: middle
}

.light-sea-green {
    background-color: #20b2aa
}

.dark-orange {
    background-color: #ff8c00
}

.small-circle {
    height: 16px;
    width: 16px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle
}

.user-star {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: 50%;
    background-image: url(/assets/images/star.png);
    background-size: contain
}

.user-star.moon {
    background-image: url(/assets/images/moon.png)
}

.link {
    cursor: pointer
}

.flex-1 {
    flex: 1
}

.rotate-90,.rotate-90:before {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1.5);
    transform: rotate(90deg)
}

.rotate-270,.rotate-270:before {
    transform: rotate(270deg)
}

.fs-12 {
    font-size: 12px!important
}

.fs-14 {
    font-size: 14px!important
}

.fs-16 {
    font-size: 16px!important
}

.fs-18 {
    font-size: 18px!important
}

.fs-20 {
    font-size: 20px!important
}

.fs-24 {
    font-size: 24px!important
}

.fs-32 {
    font-size: 32px!important
}

.fw-600 {
    font-weight: 600!important
}

.opacity-70 {
    opacity: .7!important
}

.gu-mirror {
    position: fixed!important;
    margin: 0!important;
    z-index: 9999!important;
    opacity: .8;
    -ms-filter: "alpha(opacity=80)";
    filter: alpha(opacity=80)
}

.gu-hide {
    display: none!important
}

.gu-unselectable {
    -webkit-user-select: none!important;
    user-select: none!important
}

.gu-transit {
    opacity: .6;
    -ms-filter: "alpha(opacity=20)";
    filter: alpha(opacity=20);
    background-color: #17c100
}

.gu-transit .label {
    color: #fff
}

.gu-mirror {
    margin: 10px;
    padding: 10px;
    background-color: #0003;
    transition: opacity .4s ease-in-out;
    cursor: grabbing;
    cursor: -webkit-grabbing
}

.ex-moved {
    background-color: #e74c3c
}

.container.ex-over {
    background-color: #ffffff4d
}

.handle {
    padding: 0 5px;
    margin-right: 5px;
    background-color: #0006;
    cursor: move
}

.overlay {
    top: 0;
    bottom: 0;
    left: 0;
    background-color: #00000080;
    z-index: 9999;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px)
}

.dialog,.overlay {
    position: fixed;
    right: 0
}

.dialog {
    z-index: 10001;
    left: 50%;
    top: 42%;
    transform: translate(-50%,-50%);
    min-height: 200px;
    width: 90%;
    background-color: #2b2c3a;
    padding: 12px;
    border: none
}

:host-context(.light) .dialog {
    background-color: #fff
}

.dialog.noPadding {
    padding: 0!important
}

.dialog.centerInParent {
    position: absolute
}

.dialog.setBorderRadius-6 {
    border-radius: 6px;
    overflow: hidden
}

.dialog.noBackgroudColor {
    background-color: initial!important
}

.dn-dialog-buttons {
    width: 100%;
    position: absolute;
    display: flex;
    justify-content: center;
    bottom: 0;
    left: 0;
    padding: 15px 0;
    text-align: center;
    border-top: 2px solid #373843
}

.light .dn-dialog-buttons {
    border-top-color: #ddd!important
}

.buttons-gap {
    height: 70px;
    position: absolute;
    top: 0;
    border-right: 2px solid #373843
}

.light .buttons-gap {
    border-right-color: #ddd!important
}

.pulse-loading {
    background-color: #ddd;
    display: inline-block;
    animation: pulse 2s ease-in-out infinite;
    -webkit-animation: pulse 2s ease-in-out infinite
}

@keyframes pulse {
    0% {
        background-color: #a5a5a51a
    }

    50% {
        background-color: #a5a5a54d
    }

    to {
        background-color: #a5a5a51a
    }
}

.menu-pop,.smitem {
    position: absolute;
    background-color: #2b2c3a
}

.light .menu-pop,.light .smitem {
    background-color: #fafafa
}

.menu-item a {
    transition: unset
}

.menu-pop {
    padding: 4px 0;
    top: 57px;
    left: 0;
    z-index: 1000;
    border: 1px solid #0000;
    box-shadow: 2px 2px 1px 0 #00000057
}

.light .menu-pop {
    border-color: #0000;
    box-shadow: 2px 2px 4px 0 #0000003d
}

.smitem {
    min-width: 194px;
    left: 116px;
    z-index: 5;
    padding: 4px 0;
    top: 0;
    border: 1px solid #0000;
    box-shadow: 0 0 4px 1px #00000057
}

.light .smitem {
    border-color: #0000;
    box-shadow: 0 0 4px 1px #0000003d
}

.smitem {
    display: flex;
    flex-wrap: wrap;
    width: 192px
}

.smitem.three-col {
    width: 288px
}

.menu-item,.submenu-item {
    width: 120px;
    text-align: center;
    cursor: pointer;
    border-bottom: 1px solid #0000;
    position: relative
}

.light .menu-item,.light .submenu-item {
    border-color: #0000
}

.menu-item:last-child,.submenu-item:last-child {
    border-bottom: none
}

.light .menu-item:hover,.light .submenu-item:hover {
    background-color: initial
}

.menu-item a,.submenu-item a {
    color: #fff6
}

.light .menu-item a,.light .submenu-item a {
    color: #333
}

.light .menu-item a:hover,.light .submenu-item a:hover,.menu-item a:hover,.submenu-item a:hover {
    color: #00c0ff!important
}

.submenu-item {
    width: 96px
}

.submenu-item.adult {
    width: 64px
}

.active a {
    color: #00c0ff
}

:host-context(.light) .active a {
    color: #00c0ff
}

a.active {
    color: #00c0ff!important
}

:host-context(.light) a.active {
    color: #00c0ff
}

.nav-expander {
    width: 100px
}

.nav-expander>div {
    width: 96px
}

.nav-button {
    padding: 3px;
    border-radius: 2px
}

.nav-button span {
    line-height: 24px
}

.menu-arrow {
    position: absolute;
    right: 5px;
    top: 6px
}

.nav-button {
    border: 1px solid #0000;
    color: #ffffffb3
}

.nav-button.mainColor,.nav-button:hover {
    color: #00c0ff!important
}

.light .nav-button {
    color: #fff;
    border-color: #0000
}

@media(max-width: 1678px) {
    .menu-pop.two-col {
        left:-60px;
        height: 578px;
        width: 244px
    }

    .menu-pop.flexStyle {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column
    }
}

.dn-slider {
    position: relative;
    margin: 0 auto
}

.dn-slider:after {
    content: "";
    width: 400px;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 0;
    position: absolute;
    background: #090b21;
    background: linear-gradient(-90deg,#090b2180,#090b210d 83%,#090b2105 89%,#090b2100 99%);
    pointer-events: none
}

.dn-slider-main-container {
    height: 666px;
    width: 100%
}

.dn-slider-image-placeholder {
    height: 100%;
    width: 100%;
    transition: opacity .2s ease-in-out;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    /* opacity: 0; */
    /* pointer-events: none */
}

.dn-slider-image-placeholder.active {
    opacity: 1;
    pointer-events: auto
}

.slider-trasnparent-cover {
    background-color: initial;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
    height: 80%;
    width: 100%
}

.slider-trasnparent-cover.active {
    opacity: 1;
    z-index: 2
}

.dn-slider-image-thumbnails-container {
    display: flex;
    position: absolute;
    bottom: 0;
    align-items: center;
    justify-content: center;
    left: 50%;
    transform: translate(-50%);
    background-color: #0009;
    border-radius: 60px;
    padding: 44px 55px;
    box-sizing: border-box;
    bottom: 15px;
    width: 1215px;
    height: 114px
}

.dn-slider-image-thumbnail-container {
    width: 158px;
    height: 86px;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    margin: 5px
}

.dn-slider-image-thumbnail-container .dn-slider-image-thumbnail {
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%
}

.dn-slider-image-thumbnail-container .dn-slider-image-thumbnail-overlay {
    position: absolute;
    box-sizing: border-box;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: #00000073;
    transition: background-color .2s ease-in-out
}

.dn-slider-image-thumbnail-container.active .dn-slider-image-thumbnail-overlay {
    border: 3px solid #35c0ecf2;
    background-color: initial
}

.sidenav-outer-container {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    pointer-events: none
}

.dn-slider-sidenav-container {
    height: 420px;
    padding: 10px 0;
    position: absolute;
    top: 70px;
    right: 0;
    border-color: red;
    z-index: 3;
    pointer-events: auto
}

.dn-slider-sidenav-container .nav-link-ctn {
    width: 264px;
    overflow: hidden
}

.dn-slider-sidenav-container .nav-link {
    display: flex;
    align-items: center;
    line-height: 34px;
    height: 50px;
    padding: 0;
    font-size: 15px;
    color: #fff6;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
    justify-content: flex-end;
    margin: 9px 0
}

.dn-slider-sidenav-container .nav-link.active.marquee {
    position: relative;
    top: 0;
    left: 0;
    overflow: visible;
    transition: left 3s linear
}

.dn-slider-sidenav-container .nav-link.active.marquee a.a-link {
    position: absolute;
    top: 0;
    left: 0;
    overflow: visible
}

.dn-slider-sidenav-container .nav-link a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 100%;
    line-height: 50px
}

.light .dn-slider-sidenav-container .nav-link a {
    color: #ffffffb3
}

.dn-slider-sidenav-container .nav-link.active {
    font-size: 22px;
    font-weight: 600;
    color: #fff!important
}

.dn-slider-sidenav-container .nav-link.active a {
    color: #fff!important
}

.light .dn-slider-sidenav-container .nav-link.active a {
    color: #fff
}

.dn-slider-image-indicators-container {
    display: none;
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 2
}

.dn-slider-image-indicators-container .dn-slider-image-indicator {
    width: 10px;
    height: 10px;
    background-color: #fffc;
    border-radius: 50%;
    display: inline-block;
    margin-right: 8px;
    text-align: right;
    cursor: pointer
}

.dn-slider-image-indicators-container .dn-slider-image-indicator:last-child {
    margin-right: 0
}

.dn-slider-image-indicators-container .dn-slider-image-indicator.active {
    background-color: #e88741
}

.dn-slider-title {
    display: none;
    color: #fff!important;
    position: absolute;
    left: 10px;
    bottom: 10px;
    font-size: 16px;
    max-width: 240px;
    overflow: hidden;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    z-index: 2
}

.dn-slider-bottom-shadow {
    display: none;
    position: absolute;
    width: 100%;
    height: 100px;
    bottom: 0;
    z-index: 1;
    background: #020024;
    background: linear-gradient(1turn,#0003,#0000)
}

@media screen and (max-width: 1400px) {
    .dn-slider-main-container {
        height:474px
    }

    .dn-slider-sidenav-container {
        height: 325px;
        top: 60px
    }

    .dn-slider-sidenav-container .nav-link {
        line-height: 34px;
        height: 34px;
        margin: 2px 0
    }

    .dn-slider-sidenav-container .nav-link a {
        line-height: 34px
    }
}

@media screen and (min-width: 1401px) and (max-width:1679px) {
    .dn-slider-main-container {
        height:539px
    }

    .dn-slider-sidenav-container {
        height: 390px;
        top: 60px
    }

    .dn-slider-sidenav-container .nav-link {
        line-height: 44px;
        height: 44px;
        margin: 2px 0
    }

    .dn-slider-sidenav-container .nav-link a {
        line-height: 44px
    }
}

@media screen and (min-width: 2000px) and (max-width:2329px) {
    .dn-slider-main-container {
        height:710px
    }
}

@media screen and (min-width: 2330px) and (max-width:2560px) {
    .dn-slider-main-container {
        height:888px
    }
}

.player-media-list {
    width: 420px;
    height: 100%;
    position: absolute;
    right: -420px;
    z-index: 5002;
    background-color: #0000008f;
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    transition: all .36s ease-in-out
}

.player-media-list.show {
    right: 0!important
}

.player-media-list.no-transition {
    transition: unset!important
}

.player-media-list-inner {
    position: relative;
    width: 420px;
    height: 100%
}

.player-media-list .player-media-list-trigger {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 86px;
    position: absolute;
    top: 50%;
    background-image: url(/assets/images/trapezoid.png);
    transform: translateY(-50%);
    cursor: pointer
}

.player-media-list .player-media-list-trigger:before {
    content: "";
    font-size: 22px;
    display: block;
    color: #ececeeb3!important
}

.player-media-list .player-media-list-trigger:hover:before {
    color: #fff!important
}

.medias-selector-container,.medias-selector-expandable-tabs {
    position: relative;
    margin-bottom: 30px
}

.medias-selector-container .t,.medias-selector-expandable-tabs .t {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.medias-selector-container .expander,.medias-selector-expandable-tabs .expander {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center
}

.medias-selector-container .expander .iconfont,.medias-selector-expandable-tabs .expander .iconfont {
    font-size: 20px
}

.medias-selector-container button,.medias-selector-expandable-tabs button {
    cursor: pointer;
    border: none;
    outline: none;
    min-width: 96px;
    height: 38px;
    font-size: 14px;
    -webkit-user-select: none;
    user-select: none;
    padding: 5px 15px;
    margin: 0;
    background-color: initial;
    color: #fff6
}

.light .medias-selector-container button,.light .medias-selector-expandable-tabs button {
    background-color: initial!important;
    color: #333
}

.medias-selector-container button.active,.medias-selector-container button.active .iconfont,.medias-selector-expandable-tabs button.active,.medias-selector-expandable-tabs button.active .iconfont {
    color: #00c0ff!important
}

.medias-selector-container button.current,.medias-selector-expandable-tabs button.current {
    background-color: red
}

.medias-selector-container button.expanded .iconfont,.medias-selector-container button:hover,.medias-selector-expandable-tabs button.expanded .iconfont,.medias-selector-expandable-tabs button:hover {
    color: #00c0ff
}

.light .medias-selector-container button:hover,.light .medias-selector-expandable-tabs button:hover {
    background-color: #fff;
    color: #00c0ff
}

.medias-selector-container button:hover .iconfont,.medias-selector-expandable-tabs button:hover .iconfont {
    color: #00c0ff
}

.medias-selector-container .panel,.medias-selector-expandable-tabs .panel {
    padding-bottom: 8px
}

.medias-selector-container .panel.float-panel,.medias-selector-expandable-tabs .panel.float-panel {
    position: absolute;
    width: 340px;
    max-height: 270px;
    right: 0;
    top: 48px;
    right: 25px;
    z-index: 10;
    border-radius: 6px;
    background-color: #1c1d2f;
    padding: 16px 8px;
    box-shadow: 7px 3px 12px -1px #0006
}

.light .medias-selector-container .panel.float-panel,.light .medias-selector-expandable-tabs .panel.float-panel {
    background-color: #fff;
    box-shadow: 7px 3px 12px 3px #0006
}

.medias-selector-container .panel.float-panel:after,.medias-selector-expandable-tabs .panel.float-panel:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-color: #0000 #0000 #1c1d2f;
    border-style: solid;
    border-width: 0 6px 8px;
    position: absolute;
    top: -8px;
    right: 12px
}

.light .medias-selector-container .panel.float-panel:after,.light .medias-selector-expandable-tabs .panel.float-panel:after {
    border-bottom-color: #fff
}

.medias-selector-container .panel button,.medias-selector-expandable-tabs .panel button {
    width: 80px;
    min-width: unset;
    padding: 5px 0;
    font-size: 14px
}

.expandable-tabs .panel button {
    margin-bottom: 15px;
    white-space: nowrap
}

.medias-selector-container {
    margin-right: 38px
}

.medias-selector-container button.active {
    color: #00c0ff!important
}

.light .medias-selector-container button.active {
    background-color: #00c0ff!important;
    color: #fff!important
}

.medias-selector-expandable-tabs {
    background-color: #101227;
    border-radius: 2px
}

.light .medias-selector-expandable-tabs {
    background-color: #f8f8f8!important
}

.medias-selector-expandable-tabs .medias-selector-expandable-tabs-inner {
    white-space: nowrap;
    overflow: auto;
    padding-right: 120px
}

.medias-selector-expandable-tabs .medias-selector-expandable-tabs-nav {
    overflow: hidden
}

.medias-selector-expandable-tabs .expandable-tabs {
    display: flex
}

.medias-selector-expandable-tabs .iconfont {
    font-size: 27px;
    line-height: 24px
}

.medias-selector-expandable-tabs .button {
    width: unset
}

.medias-selector-expandable-tabs .iconfont {
    color: #fff6
}

.light .medias-selector-expandable-tabs .iconfont {
    color: #afafaf
}

.n-media {
    width: 100%;
    margin-bottom: 30px
}

.n-media-title {
    padding: 0 30px
}

.n-media .n-media-list {
    display: flex;
    flex-wrap: wrap;
    justify-content:flex-start
}

.n-media .n-media-list .media-btn {
    margin-bottom: 7px!important
}

.n-media .n-media-list .media-button {
    width: 113px;
    padding: 8px 3px!important;
    margin-right: 0!important;
    background-color: #101227!important;
    color: #fff6!important;
    border-color: #0000!important;
    -webkit-user-select: none;
    user-select: none;
    height: 52px
}

.light .n-media .n-media-list .media-button {
    background-color: #f8f8f8!important;
    color: #333!important
}

.n-media .n-media-list .media-button.wide {
    width: 234px
}

.n-media .n-media-list .media-button.placeholder {
    background-color: initial!important;
    height: 0!important;
    padding: 0!important
}

.n-media .n-media-list .media-button:not(.placeholder):not(.active):hover {
    color: #00c0ff!important
}

.light .n-media .n-media-list .media-button:not(.placeholder):not(.active):hover {
    background-color: #f8f8f8!important
}

.n-media .n-media-list .media-button:visited {
    color: #a0a0a0!important
}

.light .n-media .n-media-list .media-button:visited {
    color: #aaa!important
}

.n-media .n-media-list .media-button.active {
    color: #00c0ff!important
}

.light .n-media .n-media-list .media-button.active {
    background-color: #f8f8f8!important;
    color: #00c0ff!important
}

.selector-toggler {
    padding-right: 32px!important
}

.selector-toggler.expandable:after {
    content: "";
    font-family: iconfont!important;
    display: block;
    position: absolute;
    right: 5px;
    top: 4px;
    font-size: 24px;
    line-height: 24px
}

.selector-toggler.expandable.expanded:after {
    transform: rotate(-180deg)
}

.video-container .n-media {
    background-color: unset;
    padding: 0 30px 15px;
    margin-bottom: 0
}

.video-container .n-media>div.n-media-list {
    display: flex!important
}

.video-container .n-media .n-media-list {
    height: auto;
    max-height: 100%;
    overflow: hidden
}

.video-container .n-media .n-media-list .media-button:not(.placeholder) {
    width: 68px;
    min-width: 68px;
    background-color: #00000080!important;
    height: 50px;
    line-height: 42px;
    padding: 3px!important
}

.video-container .n-media .n-media-list .media-button:not(.placeholder).active {
    color: #00c0ff!important
}

.video-container .n-media .n-media-list .media-button:not(.placeholder):hover {
    color: #00c0ff!important;
    background-color: #00000080!important
}

.video-container .n-media .n-media-list .media-button:not(.placeholder).wide {
    width: 100%
}

.video-container .n-media .n-media-list .media-button.placeholder {
    width: 68px;
    height: 0!important
}

.video-container .n-media .iconfont {
    line-height: 32px
}

.video-container .n-media .unlocked-icon {
    top: 24px!important;
    right: 2px!important
}

.video-container .n-media .medias-selector-container {
    padding: 0 12px;
    margin-bottom: 0;
    font-size: 16px
}

.video-container .n-media .medias-selector-container .iconfont {
    font-size: 32px
}

.video-container .n-media .media-btn {
    width: 68px;
    text-align: center;
    margin-bottom: 0!important
}

.video-container .n-media .media-btn.wide {
    width: 176px;
    margin-bottom: 3px!important
}

.video-container .expandable-tabs {
    background-color: #090b21
}

.video-container .medias-selector-container,.video-container .medias-selector-expandable-tabs {
    background-color: #00000080!important
}

.video-container .medias-selector-container .iconjiantou_liebiaozhankai,.video-container .medias-selector-expandable-tabs .iconjiantou_liebiaozhankai {
    position: absolute;
    right: 15px
}

.video-container .medias-selector-container button,.video-container .medias-selector-expandable-tabs button {
    width: 120px!important;
    font-size: 12px;
    background-color: initial!important
}

.video-container .medias-selector-container button.active,.video-container .medias-selector-expandable-tabs button.active {
    color: #00c0ff!important
}

.video-container .medias-selector-container .next,.video-container .medias-selector-container .previous,.video-container .medias-selector-expandable-tabs .next,.video-container .medias-selector-expandable-tabs .previous {
    width: 30px;
    text-align: center
}

.video-container .medias-selector-container .iconfont,.video-container .medias-selector-expandable-tabs .iconfont {
    cursor: pointer;
    color: #fff6
}

.video-container .medias-selector-container .iconfont:hover,.video-container .medias-selector-expandable-tabs .iconfont:hover {
    color: #fff
}

.video-container .medias-selector-container {
    margin-bottom: 35px!important;
    margin-right: 0
}

.video-container .medias-selector-container>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative
}

.video-container .ps__rail-y {
    background-color: initial!important;
    width: 10px!important;
    opacity: .6!important
}

.video-container .ps__thumb-y {
    background-color: #00000080!important;
    width: 8px!important;
    left: 2px!important;
    border-radius: 0!important
}

.video-container .medias-selector-expandable-tabs {
    margin-bottom: 20px
}

.video-container .n-media-title {
    margin-bottom: 18px!important
}

.video-container .medias-selector-expandable-tabs-nav button {
    min-width: unset!important;
    width: 65px!important;
    padding: 5px 0;
    overflow: hidden;
    margin-right: 4px
}

.video-container .medias-selector-expandable-tabs-inner {
    padding-right: 85px;
    padding-left: 10px
}

.video-container button.expander {
    padding: 5px 16px 5px 0;
    min-width: unset!important;
    width: unset!important;
    display: flex;
    align-items: center
}

.video-container button.expander .iconjiantou_liebiaozhankai {
    right: 3px!important;
    top: 4px!important
}

.video-container button.expander .iconjiantou_liebiaozhankai:hover {
    color: #00c0ff
}

.video-container button.expander .iconjiantou_liebiaozhankai.rotate-180 {
    top: 2px!important
}

.video-container .panel-container {
    max-height: 0;
    overflow: hidden;
    transition: all .6s ease-in-out
}

.video-container .expanded .panel-container {
    max-height: 600px
}

@media(min-width: 1679px) and (max-width:1911px) {
    .n-media .n-media-list .media-button {
        width:97px;
        margin-bottom: 0!important
    }

    .n-media .n-media-list .media-button.wide {
        width: 202px
    }

    .n-media .medias-selector-expandable-tabs button {
        min-width: 80px;
        height: 32px
    }

    .video-container .n-media .medias-selector-expandable-tabs {
        margin-bottom: 20px
    }

    .video-container .n-media .media-button {
        width: 66px
    }

    .video-container .n-media .medias-selector-expandable-tabs {
        margin-bottom: 8px
    }

    .video-container .n-media button {
        width: 90px!important
    }

    .video-container .n-media button.expander {
        width: unset!important
    }

    .video-container .n-media .n-media-list .media-button.wide {
        width: 174px
    }
}

@media(max-width: 1439px) {
    .n-media .n-media-list .media-button {
        width:68px;
        min-width: 68px!important;
        margin-bottom: 4px!important
    }

    .n-media .n-media-list .media-button.wide {
        width: 200px
    }

    .n-media .medias-selector-expandable-tabs button {
        height: 40px
    }

    .video-container .player-media-list {
        right: -398px;
        width: 398px
    }

    .video-container .player-media-list .player-media-list-inner {
        width: 398px
    }

    .video-container .n-media {
        padding: 20px 20px 15px
    }

    .video-container .n-media .medias-selector-expandable-tabs {
        margin-bottom: 8px
    }

    .video-container .n-media .n-media-list .media-button {
        min-width: 60px!important;
        width: 60px;
        line-height: 26px
    }

    .video-container .n-media .n-media-list .media-button.wide {
        width: 174px
    }
}

@media(min-width: 1679px) and (max-width:1911px) {
    .video-container .medias-selector-container {
        margin-bottom:25px!important
    }

    .video-container .n-media {
        padding: 0 28px 15px
    }

    .video-container .n-media .media-btn {
        width: 54px
    }

    .video-container .n-media .media-btn.wide {
        width: 142px
    }

    .video-container .n-media .n-media-list .media-button {
        width: 54px!important;
        min-width: 54px!important;
        height: 42px;
        margin-bottom: 1px!important;
        line-height: 34px
    }

    .video-container .n-media .n-media-list .media-button.wide {
        width: 142px!important
    }

    .video-container .n-media .n-media-list .media-button.placeholder {
        width: 50px
    }

    .video-container .playing-icon {
        top: 32px!important;
        left: 1px!important
    }

    .video-container .unlocked-icon {
        top: 18px!important;
        right: 2px!important
    }

    .player-media-list,.player-media-list .player-media-list-inner {
        width: 348px
    }

    .playing-icon {
        top: 34px!important
    }

    .unlocked-icon {
        top: 33px!important;
        right: 2px!important
    }
}

@media(max-width: 1678px) {
    .n-media .n-media-list .media-button {
        width:77px;
        min-width: 77px!important;
        margin-bottom: 0!important
    }

    .n-media .n-media-list .media-button.wide {
        width: 160px
    }

    .n-media .n-media-list .media-btn {
        margin-bottom: 5px!important
    }

    .n-media .medias-selector-expandable-tabs button {
        min-width: 80px;
        height: 32px
    }

    .expander {
        width: unset!important;
        right: 12px
    }

    .video-container .player-media-list {
        right: -288px;
        width: 288px
    }

    .video-container .player-media-list .player-media-list-inner {
        width: 288px
    }

    .video-container .n-media-title {
        margin-top: 8px!important;
        margin-bottom: 8px!important
    }

    .video-container .n-media {
        padding: 0 25px 5px
    }

    .video-container .n-media .medias-selector-expandable-tabs {
        margin-bottom: 8px
    }

    .video-container .n-media button {
        width: 72px!important;
        min-width: 76px!important
    }

    .video-container .n-media button.expander {
        width: unset!important;
        min-width: unset!important
    }

    .video-container .n-media .medias-selector-expandable-tabs-inner .button {
        margin-right: 10px;
        width: 53px!important;
        min-width: 53px!important
    }

    .video-container .n-media .media-btn {
        width: 46px!important;
        margin-bottom: 0!important
    }

    .video-container .n-media .media-btn.wide {
        width: 116px!important
    }

    .video-container .n-media .n-media-list .media-button {
        width: 42px!important;
        min-width: 42px!important;
        height: 38px;
        margin-bottom: 0!important;
        line-height: 31px
    }

    .video-container .n-media .n-media-list .media-button.wide {
        width: 116px!important
    }

    .video-container .n-media .n-media-list .media-button.placeholder {
        width: 46px!important
    }

    .video-container .medias-selector-container {
        margin-bottom: 10px!important;
        padding: 0 6px
    }

    .video-container .medias-selector-container>div {
        height: 28px
    }

    .video-container .playing-icon {
        top: 32px!important;
        left: -1px!important
    }

    .video-container .unlocked-icon {
        top: 16px!important;
        right: 2px!important
    }

    .player-media-list,.player-media-list .player-media-list-inner {
        width: 348px
    }

    .playing-icon {
        top: 34px!important;
        left: 0!important
    }

    .unlocked-icon {
        top: 33px!important;
        right: 2px!important
    }
}

.safari .n-media-list .media-btn {
    margin-bottom: 12px!important
}

.safari .video-container .n-media-list .media-btn {
    margin-bottom: 5px!important
}

.safari .video-container .n-media-list .media-btn.wide {
    margin-bottom: 8px!important
}

@media(max-width: 1678px) {
    .safari .n-media-list .media-btn {
        margin-bottom:8px!important
    }

    .safari .n-media-list .media-btn.wide {
        margin-bottom: 10px!important
    }

    .safari .video-container .n-media-list .media-btn {
        margin-bottom: 5px!important
    }

    .safari .video-container .n-media-list .media-btn.wide {
        margin-bottom: 6px!important
    }
}

app-dropdown-notifications .dropdown {
    left: -212px!important
}

.load-more-items {
    width: 100%;
    margin-top: 15px;
    color: #ffffffb3;
    background-color: #101227!important;
    outline: none!important;
    border: none;
    border-radius: 2px;
    padding: 0
}

.light .load-more-items {
    background-color: #eee!important;
    color: #333!important
}

.load-more-items>div {
    display: inline-flex;
    align-items: center
}

.load-more-items:hover * {
    color: #00c0ff
}

.n-media-list-inner {
    width: 100%
}

@media(min-width: 1679px) and (max-width:1911px) {
    .video-container button.expander .iconjiantou_liebiaozhankai {
        top:0!important;
        right: 1px!important
    }

    .video-container button.expander .iconjiantou_liebiaozhankai.rotate-180 {
        top: -2px!important
    }

    .video-container .n-media-title {
        margin-top: 12px!important;
        margin-bottom: 12px!important
    }
}

@media(max-width: 1678px) {
    .video-container button.expander .iconjiantou_liebiaozhankai {
        top:0!important;
        right: 1px!important
    }

    .video-container button.expander .iconjiantou_liebiaozhankai.rotate-180 {
        top: -2px!important
    }
}

.update-schedule .option {
    background-color: #2a2c39;
    color: #9f9f9d;
    margin-right: 8px!important;
    padding-top: 6px!important;
    padding-bottom: 6px!important
}

.light .update-schedule .option {
    background-color: #eee;
    color: #888
}

.update-schedule .option.active {
    color: #fff
}

.light .you-chat .ps__thumb-y {
    background-color: #6663!important
}

.light .you-chat-settings-item {
    background-color: #6663
}

.you-chat {
    width: 100%;
    height: 572px;
    display: flex;
    flex-direction: row!important;
    position: relative
}

.you-chat.stickyStyle {
    height: 360px
}

.you-chat-sidebar {
    width: 306px;
    height: 100%;
    display: block;
    position: relative
}

.you-chat-sidebar.stickyStyle {
    width: 110px;
    font-size: 12px;
    background-color: #1b1d27!important;
    border-right: 1px solid #ffffff0d
}

.you-chat-sidebar.stickyStyle .you-chat-sidebar-controls {
    height: 32px;
    border-bottom: 1px solid #ffffff0d;
    background-color: #1b1d27;
    color: #ffffffb3
}

.light .you-chat-sidebar.stickyStyle .you-chat-sidebar-controls {
    color: #333
}

.you-chat-container {
    flex: 1;
    position: relative
}

.you-chat .content-editable-container {
    position: relative;
    height: auto;
    overflow: hidden
}

.you-chat .content-editable-container.height-fixed {
    height: 96px!important
}

.you-chat .content-editable-container .content-editable-input {
    word-break: break-word;
    width: 99%;
    min-height: 24px
}

.you-chat .content-editable-container .content-editable-input-placeholder {
    color: #ffffffb3!important;
    position: absolute;
    top: 0
}

.light .you-chat .content-editable-container .content-editable-input-placeholder {
    color: #888!important
}

.you-chat .avatar-container {
    position: relative
}

.you-chat .has-new {
    position: absolute;
    right: -5px;
    top: 0;
    width: 5px;
    height: 5px;
    background-color: red;
    border-radius: 50%
}

.you-chat .has-new.stickyStyle {
    width: 6px;
    height: 6px;
    right: 8px;
    top: 20px
}

.you-chat .loading-messages {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2b2c3a
}

.light .you-chat .loading-messages {
    background-color: #ddd
}

.you-chat .emoji-box {
    background-color: #171928!important;
    bottom: 130px!important;
    left: 11px!important
}

.light .you-chat .emoji-box {
    background-color: #f8f8f8!important;
    box-shadow: 1px 1px 4px 0 #00000024
}

.you-chat .unread-messages {
    position: absolute;
    width: 100%;
    height: 40px;
    background-color: #0006;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.light .you-chat .unread-messages,.you-chat .unread-messages span {
    color: #fff
}

.you-chat .unread-messages:hover {
    background-color: #00000080
}

.you-chat .loading-previous-messages {
    width: 100%;
    height: 60px;
    padding-top: 60px;
    display: flex;
    align-items: center;
    justify-content: center
}

.you-chat-input-containter {
    padding: 15px 20px;
    background-color: initial;
    border-top: 1px solid #373843
}

.light .you-chat-input-containter {
    border-top-color: #ddd
}

.you-chat-input-containter img {
    max-width: 80px;
    max-height: 80px
}

.you-chat-input-containter.stickyStyle {
    padding: 2px 4px;
    border-top: 1px solid #ffffff0d
}

.you-chat-input-containter.stickyStyle .icon-button {
    height: 16px;
    width: 16px
}

.you-chat-input-containter.stickyStyle .iconfont.iconbiaoqing {
    line-height: 16px;
    font-size: 16px!important
}

.you-chat-input-containter.stickyStyle .iconfont.icontupian2 {
    line-height: 12px;
    font-size: 12px!important
}

.you-chat-input-containter.stickyStyle contenteditable {
    font-size: 12px
}

.you-chat-input-containter.stickyStyle contenteditable .content-editable-container {
    padding: 0 2px
}

.you-chat-input-containter.stickyStyle contenteditable .content-editable-container .content-editable-input {
    min-height: 18px!important
}

.you-chat-input-containter.stickyStyle contenteditable .content-editable-container .content-editable-input-placeholder {
    color: #fff6!important
}

.light .you-chat-input-containter.stickyStyle contenteditable .content-editable-container .content-editable-input-placeholder {
    color: #888!important
}

.you-chat-input-containter.stickyStyle .emoji-box {
    bottom: 82px!important;
    left: -230px!important
}

.you-chat-log {
    position: relative;
    height: 389px
}

.you-chat-log img {
    max-width: 80px;
    max-height: 80px
}

.you-chat-log.stickyStyle {
    height: 244px
}

.you-chat-log-containter {
    padding: 15px
}

.you-chat-log-containter.stickyStyle {
    padding: 5px 15px 5px 5px
}

.you-chat-message {
    display: flex;
    align-items: flex-start;
    width: 100%;
    transition: all .5s;
    margin-bottom: 15px
}

.you-chat-message.more-space {
    position: relative;
    padding-bottom: 30px
}

.you-chat-message__avatar-box {
    position: relative
}

.you-chat-message__avatar-vip {
    position: absolute;
    bottom: -5px;
    left: 35px
}

.you-chat-message__avatar-vip img.vip-icon-path {
    width: 20px
}

.you-chat-message__avatar-vip.right {
    left: 51px
}

.you-chat-message__avatar-vip.stickyStyle {
    bottom: -6px;
    left: 10px
}

.you-chat-message__avatar-vip.stickyStyle img.vip-icon-path {
    width: 10px
}

.you-chat-message__avatar-vip.stickyStyle.right {
    display: none
}

.you-chat-message__avatar-frame {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 16px
}

.you-chat-message__avatar-frame .chat-message__avatar {
    width: 50px;
    height: 50px
}

.you-chat-message__avatar-frame.stickyStyle {
    width: 18px;
    height: 18px;
    margin-right: 4px
}

.you-chat-message__avatar-frame.stickyStyle .chat-message__avatar {
    width: 18px;
    height: 18px
}

.you-chat-message__image,.you-chat-message__text {
    display: block;
    max-width: 65%;
    background: #41465c;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 400;
    color: #ffffffb3;
    line-height: 24px;
    position: relative;
    word-break: break-word
}

.light .you-chat-message__image,.light .you-chat-message__text {
    background-color: #ddd;
    color: #333
}

.you-chat-message__image:after,.you-chat-message__text:after {
    content: "";
    position: absolute;
    left: -10px;
    top: 18px;
    width: 0;
    height: 0;
    border-color: #0000 #41465c #0000 #0000;
    border-style: solid;
    border-width: 5px 10px 5px 0
}

.light .you-chat-message__image:after,.light .you-chat-message__text:after {
    border-right-color: #ddd
}

.you-chat-message-right {
    flex-direction: row-reverse
}

.you-chat-message-right .you-chat-message__avatar-frame {
    margin-right: 0;
    margin-left: 16px
}

.you-chat-message-right .you-chat-message__image,.you-chat-message-right .you-chat-message__text {
    background-color: #3e3b74;
    color: #ffffffb3
}

.light .you-chat-message-right .you-chat-message__image,.light .you-chat-message-right .you-chat-message__text {
    background-color: #00c0ff;
    color: #fff
}

.you-chat-message-right .you-chat-message__image:after,.you-chat-message-right .you-chat-message__text:after {
    left: auto;
    right: -10px;
    top: 18px;
    border-width: 5px 0 5px 10px;
    border-color: #0000 #0000 #0000 #3e3b74
}

.light .you-chat-message-right .you-chat-message__image:after,.light .you-chat-message-right .you-chat-message__text:after {
    border-left-color: #00c0ff
}

.you-chat-message__text.stickyStyle {
    padding: 5px;
    font-size: 12px;
    max-width: 70%;
    line-height: 16px;
    background: #25272f
}

.you-chat-message__text.stickyStyle:after {
    top: 0;
    border-width: 0 7px 6px 0;
    left: -4px;
    border-color: #0000 #25272f #0000 #0000
}

.you-chat-message__image.stickyStyle {
    background: #25272f
}

.you-chat-message__image.stickyStyle img {
    max-width: 100%!important;
    max-height: 100%!important
}

.you-chat-message__image.stickyStyle:after {
    top: 0;
    border-width: 0 7px 6px 0;
    left: -4px;
    border-color: #0000 #25272f #0000 #0000
}

.you-chat-message__image {
    padding: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}

.you-chat-message__image img {
    max-width: 212px!important;
    max-height: 212px!important;
    min-width: 30px!important;
    position: relative;
    z-index: 9;
    opacity: 1;
    transition: all .2s ease-out
}

.you-chat-message__image img.not-loaded {
    width: 212px;
    height: 212px;
    opacity: 0
}

.you-chat-message-right .you-chat-message__image.stickyStyle,.you-chat-message-right .you-chat-message__text.stickyStyle {
    background: #00c0ff!important;
    color: #fff
}

.you-chat-message-right .you-chat-message__image.stickyStyle:after,.you-chat-message-right .you-chat-message__text.stickyStyle:after {
    top: auto;
    left: auto;
    border-width: 6px 0 0 7px;
    right: -4px;
    bottom: 0;
    border-color: #0000 #0000 #0000 #00c0ff!important
}

.chat-container {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    height: calc(100% - 38px);
    background: #2b2c3a;
    margin: 0 auto
}

.light .chat-container {
    background: #fff
}

.chat-container.stickyStyle {
    background: #1b1d27
}

.light .chat-container.stickyStyle {
    background: #fff
}

.contact {
    display: flex;
    align-items: center;
    padding: 10px 8px;
    transition: all .2s linear;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    background-color: #383844;
    overflow-x: hidden!important
}

.light .contact {
    background: #fafafa
}

.contact img {
    max-height: 30px
}

.contact img.avatar-sm {
    width: 50px;
    height: 50px;
    max-height: 50px;
    border-radius: 50%
}

.contact img.avatar-sm.stickyStyle {
    width: 20px;
    height: 20px;
    max-height: 20px
}

.contact.active,.light .contact.active {
    background-color: #00c0ff
}

.contact.active .text-secondary,.light .contact.active .contact-name,.light .contact.active .text-secondary {
    color: #fff!important
}

.contact-remove-button {
    width: 42px
}

.contact-remove-button .iconfont {
    transition: all 50ms ease-in-out;
    opacity: 0;
    color: #fff;
    line-height: 38px
}

.contact-remove-button.stickyStyle {
    top: 16px;
    left: -4px;
    position: absolute
}

.contact-remove-button.stickyStyle .iconfont {
    color: #fff6
}

.light .contact-remove-button.stickyStyle .iconfont {
    color: #888
}

.contact-remove-button.stickyStyle:hover .iconfont {
    color: #fff!important
}

.light .contact-remove-button.stickyStyle:hover .iconfont {
    color: #333!important
}

.contact-remove-button.stickyStyle .icon-button {
    height: 14px
}

.contact-remove-button.stickyStyle .iconfont {
    line-height: 14px;
    font-size: 14px!important
}

.contact:hover,.light .contact:hover {
    background-color: #00c0ff
}

.contact:hover .avatar-container.stickyStyle {
    left: 18px
}

.contact:hover .name.stickyStyle {
    position: absolute;
    left: 50px
}

.contact:hover .contact-remove-button .iconfont {
    opacity: 1;
    font-size: 18px
}

.contact:hover .contact-name {
    color: #fff
}

.contact:hover .text-secondary,.light .contact:hover .text-secondary {
    color: #fff!important
}

.contact.stickyStyle {
    background-color: #1b1d27;
    padding: 13px 8px;
    color: #ffffffb3
}

.light .contact.stickyStyle {
    background-color: #fff;
    color: #333
}

.contact.stickyStyle.active {
    background-color: #ffffff0d!important
}

.light .contact.stickyStyle.active .contact-name {
    color: #333!important
}

.contact.stickyStyle:hover {
    background-color: #ffffff0d!important
}

.light .contact.stickyStyle:hover .contact-name {
    color: #333!important
}

.you-chat-input-controls {
    align-items: center;
    padding: 0 30px 20px 10px
}

.you-chat-input-controls app-dn-button button {
    width: 60px!important;
    height: 28px!important;
    min-width: unset!important;
    padding: 3px 8px!important
}

.light .you-chat-input-controls icon-button button.icon-button:hover {
    color: #00c0ff
}

.you-chat-input-controls.stickyStyle {
    padding: 5px 10px
}

.you-chat-input-controls.stickyStyle app-dn-button button {
    width: 40px!important;
    height: 24px!important;
    padding: 3px 4px!important;
    border-radius: 2px!important
}

.iconbiaoqing,.icontupian2 {
    color: #888
}

.iconbiaoqing:hover,.icontupian2:hover {
    color: #00c0ff
}

.iconbiaoqing {
    font-size: 30px!important;
    line-height: 26px
}

.icontupian2 {
    font-size: 23px!important
}

#report-chat {
    color: #fff6
}

.light #report-chat {
    color: #333!important
}

#report-chat .dialog {
    padding: 20px
}

#report-chat textarea {
    height: 100px;
    color: #fff
}

.light #report-chat textarea {
    color: #333!important
}

.contact-name {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

span.flag-icon {
    display: inline-block;
    vertical-align: middle;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    line-height: 1em;
    height: 1em;
    width: 1.4em;
    background-image: url(/assets/flag-icons/svg/missing.svg)
}

span.flag-icon:before {
    content: " "
}

span.flag-icon.flag-icon-ad {
    background-image: url(/assets/flag-icons/svg/ad.svg)
}

span.flag-icon.flag-icon-ae {
    background-image: url(/assets/flag-icons/svg/ae.svg)
}

span.flag-icon.flag-icon-af {
    background-image: url(/assets/flag-icons/svg/af.svg)
}

span.flag-icon.flag-icon-ag {
    background-image: url(/assets/flag-icons/svg/ag.svg)
}

span.flag-icon.flag-icon-ai {
    background-image: url(/assets/flag-icons/svg/ai.svg)
}

span.flag-icon.flag-icon-al {
    background-image: url(/assets/flag-icons/svg/al.svg)
}

span.flag-icon.flag-icon-am {
    background-image: url(/assets/flag-icons/svg/am.svg)
}

span.flag-icon.flag-icon-ao {
    background-image: url(/assets/flag-icons/svg/ao.svg)
}

span.flag-icon.flag-icon-ar {
    background-image: url(/assets/flag-icons/svg/ar.svg)
}

span.flag-icon.flag-icon-as {
    background-image: url(/assets/flag-icons/svg/as.svg)
}

span.flag-icon.flag-icon-at {
    background-image: url(/assets/flag-icons/svg/at.svg)
}

span.flag-icon.flag-icon-au {
    background-image: url(/assets/flag-icons/svg/au.svg)
}

span.flag-icon.flag-icon-aw {
    background-image: url(/assets/flag-icons/svg/aw.svg)
}

span.flag-icon.flag-icon-ax {
    background-image: url(/assets/flag-icons/svg/ax.svg)
}

span.flag-icon.flag-icon-az {
    background-image: url(/assets/flag-icons/svg/az.svg)
}

span.flag-icon.flag-icon-ba {
    background-image: url(/assets/flag-icons/svg/ba.svg)
}

span.flag-icon.flag-icon-bb {
    background-image: url(/assets/flag-icons/svg/bb.svg)
}

span.flag-icon.flag-icon-bd {
    background-image: url(/assets/flag-icons/svg/bd.svg)
}

span.flag-icon.flag-icon-be {
    background-image: url(/assets/flag-icons/svg/be.svg)
}

span.flag-icon.flag-icon-bf {
    background-image: url(/assets/flag-icons/svg/bf.svg)
}

span.flag-icon.flag-icon-bg {
    background-image: url(/assets/flag-icons/svg/bg.svg)
}

span.flag-icon.flag-icon-bh {
    background-image: url(/assets/flag-icons/svg/bh.svg)
}

span.flag-icon.flag-icon-bi {
    background-image: url(/assets/flag-icons/svg/bi.svg)
}

span.flag-icon.flag-icon-bj {
    background-image: url(/assets/flag-icons/svg/bj.svg)
}

span.flag-icon.flag-icon-bl {
    background-image: url(/assets/flag-icons/svg/bl.svg)
}

span.flag-icon.flag-icon-bm {
    background-image: url(/assets/flag-icons/svg/bm.svg)
}

span.flag-icon.flag-icon-bn {
    background-image: url(/assets/flag-icons/svg/bn.svg)
}

span.flag-icon.flag-icon-bo {
    background-image: url(/assets/flag-icons/svg/bo.svg)
}

span.flag-icon.flag-icon-br {
    background-image: url(/assets/flag-icons/svg/br.svg)
}

span.flag-icon.flag-icon-bs {
    background-image: url(/assets/flag-icons/svg/bs.svg)
}

span.flag-icon.flag-icon-bt {
    background-image: url(/assets/flag-icons/svg/bt.svg)
}

span.flag-icon.flag-icon-bv {
    background-image: url(/assets/flag-icons/svg/bv.svg)
}

span.flag-icon.flag-icon-bw {
    background-image: url(/assets/flag-icons/svg/bw.svg)
}

span.flag-icon.flag-icon-by {
    background-image: url(/assets/flag-icons/svg/by.svg)
}

span.flag-icon.flag-icon-bz {
    background-image: url(/assets/flag-icons/svg/bz.svg)
}

span.flag-icon.flag-icon-ca {
    background-image: url(/assets/flag-icons/svg/ca.svg)
}

span.flag-icon.flag-icon-cc {
    background-image: url(/assets/flag-icons/svg/cc.svg)
}

span.flag-icon.flag-icon-cd {
    background-image: url(/assets/flag-icons/svg/cd.svg)
}

span.flag-icon.flag-icon-cf {
    background-image: url(/assets/flag-icons/svg/cf.svg)
}

span.flag-icon.flag-icon-cg {
    background-image: url(/assets/flag-icons/svg/cg.svg)
}

span.flag-icon.flag-icon-ch {
    background-image: url(/assets/flag-icons/svg/ch.svg)
}

span.flag-icon.flag-icon-ci {
    background-image: url(/assets/flag-icons/svg/ci.svg)
}

span.flag-icon.flag-icon-ck {
    background-image: url(/assets/flag-icons/svg/ck.svg)
}

span.flag-icon.flag-icon-cl {
    background-image: url(/assets/flag-icons/svg/cl.svg)
}

span.flag-icon.flag-icon-cm {
    background-image: url(/assets/flag-icons/svg/cm.svg)
}

span.flag-icon.flag-icon-cn {
    background-image: url(/assets/flag-icons/svg/cn.svg)
}

span.flag-icon.flag-icon-co {
    background-image: url(/assets/flag-icons/svg/co.svg)
}

span.flag-icon.flag-icon-cr {
    background-image: url(/assets/flag-icons/svg/cr.svg)
}

span.flag-icon.flag-icon-cu {
    background-image: url(/assets/flag-icons/svg/cu.svg)
}

span.flag-icon.flag-icon-cv {
    background-image: url(/assets/flag-icons/svg/cv.svg)
}

span.flag-icon.flag-icon-cw {
    background-image: url(/assets/flag-icons/svg/cw.svg)
}

span.flag-icon.flag-icon-cx {
    background-image: url(/assets/flag-icons/svg/cx.svg)
}

span.flag-icon.flag-icon-cy {
    background-image: url(/assets/flag-icons/svg/cy.svg)
}

span.flag-icon.flag-icon-cz {
    background-image: url(/assets/flag-icons/svg/cz.svg)
}

span.flag-icon.flag-icon-de {
    background-image: url(/assets/flag-icons/svg/de.svg)
}

span.flag-icon.flag-icon-dj {
    background-image: url(/assets/flag-icons/svg/dj.svg)
}

span.flag-icon.flag-icon-dk {
    background-image: url(/assets/flag-icons/svg/dk.svg)
}

span.flag-icon.flag-icon-dm {
    background-image: url(/assets/flag-icons/svg/dm.svg)
}

span.flag-icon.flag-icon-do {
    background-image: url(/assets/flag-icons/svg/do.svg)
}

span.flag-icon.flag-icon-dz {
    background-image: url(/assets/flag-icons/svg/dz.svg)
}

span.flag-icon.flag-icon-ec {
    background-image: url(/assets/flag-icons/svg/ec.svg)
}

span.flag-icon.flag-icon-ee {
    background-image: url(/assets/flag-icons/svg/ee.svg)
}

span.flag-icon.flag-icon-eg {
    background-image: url(/assets/flag-icons/svg/eg.svg)
}

span.flag-icon.flag-icon-er {
    background-image: url(/assets/flag-icons/svg/er.svg)
}

span.flag-icon.flag-icon-es {
    background-image: url(/assets/flag-icons/svg/es.svg)
}

span.flag-icon.flag-icon-et {
    background-image: url(/assets/flag-icons/svg/et.svg)
}

span.flag-icon.flag-icon-eu {
    background-image: url(/assets/flag-icons/svg/eu.svg)
}

span.flag-icon.flag-icon-fi {
    background-image: url(/assets/flag-icons/svg/fi.svg)
}

span.flag-icon.flag-icon-fj {
    background-image: url(/assets/flag-icons/svg/fj.svg)
}

span.flag-icon.flag-icon-fk {
    background-image: url(/assets/flag-icons/svg/fk.svg)
}

span.flag-icon.flag-icon-fm {
    background-image: url(/assets/flag-icons/svg/fm.svg)
}

span.flag-icon.flag-icon-fo {
    background-image: url(/assets/flag-icons/svg/fo.svg)
}

span.flag-icon.flag-icon-fr {
    background-image: url(/assets/flag-icons/svg/fr.svg)
}

span.flag-icon.flag-icon-fx {
    background-image: url(/assets/flag-icons/svg/fx.svg)
}

span.flag-icon.flag-icon-ga {
    background-image: url(/assets/flag-icons/svg/ga.svg)
}

span.flag-icon.flag-icon-gb-eng {
    background-image: url(/assets/flag-icons/svg/gb-eng.svg)
}

span.flag-icon.flag-icon-gb-nir {
    background-image: url(/assets/flag-icons/svg/gb-nir.svg)
}

span.flag-icon.flag-icon-gb-sct {
    background-image: url(/assets/flag-icons/svg/gb-sct.svg)
}

span.flag-icon.flag-icon-gb-wls {
    background-image: url(/assets/flag-icons/svg/gb-wls.svg)
}

span.flag-icon.flag-icon-gb-zet {
    background-image: url(/assets/flag-icons/svg/gb-zet.svg)
}

span.flag-icon.flag-icon-gb {
    background-image: url(/assets/flag-icons/svg/gb.svg)
}

span.flag-icon.flag-icon-gd {
    background-image: url(/assets/flag-icons/svg/gd.svg)
}

span.flag-icon.flag-icon-ge {
    background-image: url(/assets/flag-icons/svg/ge.svg)
}

span.flag-icon.flag-icon-gf {
    background-image: url(/assets/flag-icons/svg/gf.svg)
}

span.flag-icon.flag-icon-gg {
    background-image: url(/assets/flag-icons/svg/gg.svg)
}

span.flag-icon.flag-icon-gh {
    background-image: url(/assets/flag-icons/svg/gh.svg)
}

span.flag-icon.flag-icon-gi {
    background-image: url(/assets/flag-icons/svg/gi.svg)
}

span.flag-icon.flag-icon-gl {
    background-image: url(/assets/flag-icons/svg/gl.svg)
}

span.flag-icon.flag-icon-gm {
    background-image: url(/assets/flag-icons/svg/gm.svg)
}

span.flag-icon.flag-icon-gn {
    background-image: url(/assets/flag-icons/svg/gn.svg)
}

span.flag-icon.flag-icon-gp {
    background-image: url(/assets/flag-icons/svg/gp.svg)
}

span.flag-icon.flag-icon-gq {
    background-image: url(/assets/flag-icons/svg/gq.svg)
}

span.flag-icon.flag-icon-gr {
    background-image: url(/assets/flag-icons/svg/gr.svg)
}

span.flag-icon.flag-icon-gs {
    background-image: url(/assets/flag-icons/svg/gs.svg)
}

span.flag-icon.flag-icon-gt {
    background-image: url(/assets/flag-icons/svg/gt.svg)
}

span.flag-icon.flag-icon-gu {
    background-image: url(/assets/flag-icons/svg/gu.svg)
}

span.flag-icon.flag-icon-gw {
    background-image: url(/assets/flag-icons/svg/gw.svg)
}

span.flag-icon.flag-icon-gy {
    background-image: url(/assets/flag-icons/svg/gy.svg)
}

span.flag-icon.flag-icon-hk {
    background-image: url(/assets/flag-icons/svg/hk.svg)
}

span.flag-icon.flag-icon-hm {
    background-image: url(/assets/flag-icons/svg/hm.svg)
}

span.flag-icon.flag-icon-hn {
    background-image: url(/assets/flag-icons/svg/hn.svg)
}

span.flag-icon.flag-icon-hr {
    background-image: url(/assets/flag-icons/svg/hr.svg)
}

span.flag-icon.flag-icon-ht {
    background-image: url(/assets/flag-icons/svg/ht.svg)
}

span.flag-icon.flag-icon-hu {
    background-image: url(/assets/flag-icons/svg/hu.svg)
}

span.flag-icon.flag-icon-id {
    background-image: url(/assets/flag-icons/svg/id.svg)
}

span.flag-icon.flag-icon-ie {
    background-image: url(/assets/flag-icons/svg/ie.svg)
}

span.flag-icon.flag-icon-il {
    background-image: url(/assets/flag-icons/svg/il.svg)
}

span.flag-icon.flag-icon-im {
    background-image: url(/assets/flag-icons/svg/im.svg)
}

span.flag-icon.flag-icon-in {
    background-image: url(/assets/flag-icons/svg/in.svg)
}

span.flag-icon.flag-icon-io {
    background-image: url(/assets/flag-icons/svg/io.svg)
}

span.flag-icon.flag-icon-iq {
    background-image: url(/assets/flag-icons/svg/iq.svg)
}

span.flag-icon.flag-icon-ir {
    background-image: url(/assets/flag-icons/svg/ir.svg)
}

span.flag-icon.flag-icon-is {
    background-image: url(/assets/flag-icons/svg/is.svg)
}

span.flag-icon.flag-icon-it {
    background-image: url(/assets/flag-icons/svg/it.svg)
}

span.flag-icon.flag-icon-je {
    background-image: url(/assets/flag-icons/svg/je.svg)
}

span.flag-icon.flag-icon-jm {
    background-image: url(/assets/flag-icons/svg/jm.svg)
}

span.flag-icon.flag-icon-jo {
    background-image: url(/assets/flag-icons/svg/jo.svg)
}

span.flag-icon.flag-icon-jp {
    background-image: url(/assets/flag-icons/svg/jp.svg)
}

span.flag-icon.flag-icon-ke {
    background-image: url(/assets/flag-icons/svg/ke.svg)
}

span.flag-icon.flag-icon-kg {
    background-image: url(/assets/flag-icons/svg/kg.svg)
}

span.flag-icon.flag-icon-kh {
    background-image: url(/assets/flag-icons/svg/kh.svg)
}

span.flag-icon.flag-icon-ki {
    background-image: url(/assets/flag-icons/svg/ki.svg)
}

span.flag-icon.flag-icon-km {
    background-image: url(/assets/flag-icons/svg/km.svg)
}

span.flag-icon.flag-icon-kn {
    background-image: url(/assets/flag-icons/svg/kn.svg)
}

span.flag-icon.flag-icon-kp {
    background-image: url(/assets/flag-icons/svg/kp.svg)
}

span.flag-icon.flag-icon-kr {
    background-image: url(/assets/flag-icons/svg/kr.svg)
}

span.flag-icon.flag-icon-kw {
    background-image: url(/assets/flag-icons/svg/kw.svg)
}

span.flag-icon.flag-icon-ky {
    background-image: url(/assets/flag-icons/svg/ky.svg)
}

span.flag-icon.flag-icon-kz {
    background-image: url(/assets/flag-icons/svg/kz.svg)
}

span.flag-icon.flag-icon-la {
    background-image: url(/assets/flag-icons/svg/la.svg)
}

span.flag-icon.flag-icon-lb {
    background-image: url(/assets/flag-icons/svg/lb.svg)
}

span.flag-icon.flag-icon-lc {
    background-image: url(/assets/flag-icons/svg/lc.svg)
}

span.flag-icon.flag-icon-li {
    background-image: url(/assets/flag-icons/svg/li.svg)
}

span.flag-icon.flag-icon-lk {
    background-image: url(/assets/flag-icons/svg/lk.svg)
}

span.flag-icon.flag-icon-lr {
    background-image: url(/assets/flag-icons/svg/lr.svg)
}

span.flag-icon.flag-icon-ls {
    background-image: url(/assets/flag-icons/svg/ls.svg)
}

span.flag-icon.flag-icon-lt {
    background-image: url(/assets/flag-icons/svg/lt.svg)
}

span.flag-icon.flag-icon-lu {
    background-image: url(/assets/flag-icons/svg/lu.svg)
}

span.flag-icon.flag-icon-lv {
    background-image: url(/assets/flag-icons/svg/lv.svg)
}

span.flag-icon.flag-icon-ly {
    background-image: url(/assets/flag-icons/svg/ly.svg)
}

span.flag-icon.flag-icon-ma {
    background-image: url(/assets/flag-icons/svg/ma.svg)
}

span.flag-icon.flag-icon-mc {
    background-image: url(/assets/flag-icons/svg/mc.svg)
}

span.flag-icon.flag-icon-md {
    background-image: url(/assets/flag-icons/svg/md.svg)
}

span.flag-icon.flag-icon-me {
    background-image: url(/assets/flag-icons/svg/me.svg)
}

span.flag-icon.flag-icon-mf {
    background-image: url(/assets/flag-icons/svg/mf.svg)
}

span.flag-icon.flag-icon-mg {
    background-image: url(/assets/flag-icons/svg/mg.svg)
}

span.flag-icon.flag-icon-mh {
    background-image: url(/assets/flag-icons/svg/mh.svg)
}

span.flag-icon.flag-icon-mk {
    background-image: url(/assets/flag-icons/svg/mk.svg)
}

span.flag-icon.flag-icon-ml {
    background-image: url(/assets/flag-icons/svg/ml.svg)
}

span.flag-icon.flag-icon-mm {
    background-image: url(/assets/flag-icons/svg/mm.svg)
}

span.flag-icon.flag-icon-mn {
    background-image: url(/assets/flag-icons/svg/mn.svg)
}

span.flag-icon.flag-icon-mo {
    background-image: url(/assets/flag-icons/svg/mo.svg)
}

span.flag-icon.flag-icon-mp {
    background-image: url(/assets/flag-icons/svg/mp.svg)
}

span.flag-icon.flag-icon-mq {
    background-image: url(/assets/flag-icons/svg/mq.svg)
}

span.flag-icon.flag-icon-mr {
    background-image: url(/assets/flag-icons/svg/mr.svg)
}

span.flag-icon.flag-icon-ms {
    background-image: url(/assets/flag-icons/svg/ms.svg)
}

span.flag-icon.flag-icon-mt {
    background-image: url(/assets/flag-icons/svg/mt.svg)
}

span.flag-icon.flag-icon-mu {
    background-image: url(/assets/flag-icons/svg/mu.svg)
}

span.flag-icon.flag-icon-mv {
    background-image: url(/assets/flag-icons/svg/mv.svg)
}

span.flag-icon.flag-icon-mw {
    background-image: url(/assets/flag-icons/svg/mw.svg)
}

span.flag-icon.flag-icon-mx {
    background-image: url(/assets/flag-icons/svg/mx.svg)
}

span.flag-icon.flag-icon-my {
    background-image: url(/assets/flag-icons/svg/my.svg)
}

span.flag-icon.flag-icon-mz {
    background-image: url(/assets/flag-icons/svg/mz.svg)
}

span.flag-icon.flag-icon-na {
    background-image: url(/assets/flag-icons/svg/na.svg)
}

span.flag-icon.flag-icon-nc {
    background-image: url(/assets/flag-icons/svg/nc.svg)
}

span.flag-icon.flag-icon-ne {
    background-image: url(/assets/flag-icons/svg/ne.svg)
}

span.flag-icon.flag-icon-nf {
    background-image: url(/assets/flag-icons/svg/nf.svg)
}

span.flag-icon.flag-icon-ng {
    background-image: url(/assets/flag-icons/svg/ng.svg)
}

span.flag-icon.flag-icon-ni {
    background-image: url(/assets/flag-icons/svg/ni.svg)
}

span.flag-icon.flag-icon-nl {
    background-image: url(/assets/flag-icons/svg/nl.svg)
}

span.flag-icon.flag-icon-no {
    background-image: url(/assets/flag-icons/svg/no.svg)
}

span.flag-icon.flag-icon-np {
    background-image: url(/assets/flag-icons/svg/np.svg)
}

span.flag-icon.flag-icon-nr {
    background-image: url(/assets/flag-icons/svg/nr.svg)
}

span.flag-icon.flag-icon-nu {
    background-image: url(/assets/flag-icons/svg/nu.svg)
}

span.flag-icon.flag-icon-nz {
    background-image: url(/assets/flag-icons/svg/nz.svg)
}

span.flag-icon.flag-icon-om {
    background-image: url(/assets/flag-icons/svg/om.svg)
}

span.flag-icon.flag-icon-pa {
    background-image: url(/assets/flag-icons/svg/pa.svg)
}

span.flag-icon.flag-icon-pe {
    background-image: url(/assets/flag-icons/svg/pe.svg)
}

span.flag-icon.flag-icon-pf {
    background-image: url(/assets/flag-icons/svg/pf.svg)
}

span.flag-icon.flag-icon-pg {
    background-image: url(/assets/flag-icons/svg/pg.svg)
}

span.flag-icon.flag-icon-ph {
    background-image: url(/assets/flag-icons/svg/ph.svg)
}

span.flag-icon.flag-icon-pk {
    background-image: url(/assets/flag-icons/svg/pk.svg)
}

span.flag-icon.flag-icon-pl {
    background-image: url(/assets/flag-icons/svg/pl.svg)
}

span.flag-icon.flag-icon-pm {
    background-image: url(/assets/flag-icons/svg/pm.svg)
}

span.flag-icon.flag-icon-pn {
    background-image: url(/assets/flag-icons/svg/pn.svg)
}

span.flag-icon.flag-icon-pr {
    background-image: url(/assets/flag-icons/svg/pr.svg)
}

span.flag-icon.flag-icon-ps {
    background-image: url(/assets/flag-icons/svg/ps.svg)
}

span.flag-icon.flag-icon-pt {
    background-image: url(/assets/flag-icons/svg/pt.svg)
}

span.flag-icon.flag-icon-pw {
    background-image: url(/assets/flag-icons/svg/pw.svg)
}

span.flag-icon.flag-icon-py {
    background-image: url(/assets/flag-icons/svg/py.svg)
}

span.flag-icon.flag-icon-qa {
    background-image: url(/assets/flag-icons/svg/qa.svg)
}

span.flag-icon.flag-icon-re {
    background-image: url(/assets/flag-icons/svg/re.svg)
}

span.flag-icon.flag-icon-ro {
    background-image: url(/assets/flag-icons/svg/ro.svg)
}

span.flag-icon.flag-icon-rs {
    background-image: url(/assets/flag-icons/svg/rs.svg)
}

span.flag-icon.flag-icon-ru {
    background-image: url(/assets/flag-icons/svg/ru.svg)
}

span.flag-icon.flag-icon-rw {
    background-image: url(/assets/flag-icons/svg/rw.svg)
}

span.flag-icon.flag-icon-sa {
    background-image: url(/assets/flag-icons/svg/sa.svg)
}

span.flag-icon.flag-icon-sb {
    background-image: url(/assets/flag-icons/svg/sb.svg)
}

span.flag-icon.flag-icon-sc {
    background-image: url(/assets/flag-icons/svg/sc.svg)
}

span.flag-icon.flag-icon-sd {
    background-image: url(/assets/flag-icons/svg/sd.svg)
}

span.flag-icon.flag-icon-se {
    background-image: url(/assets/flag-icons/svg/se.svg)
}

span.flag-icon.flag-icon-sg {
    background-image: url(/assets/flag-icons/svg/sg.svg)
}

span.flag-icon.flag-icon-sh {
    background-image: url(/assets/flag-icons/svg/sh.svg)
}

span.flag-icon.flag-icon-si {
    background-image: url(/assets/flag-icons/svg/si.svg)
}

span.flag-icon.flag-icon-sj {
    background-image: url(/assets/flag-icons/svg/sj.svg)
}

span.flag-icon.flag-icon-sk {
    background-image: url(/assets/flag-icons/svg/sk.svg)
}

span.flag-icon.flag-icon-sl {
    background-image: url(/assets/flag-icons/svg/sl.svg)
}

span.flag-icon.flag-icon-sm {
    background-image: url(/assets/flag-icons/svg/sm.svg)
}

span.flag-icon.flag-icon-sn {
    background-image: url(/assets/flag-icons/svg/sn.svg)
}

span.flag-icon.flag-icon-so {
    background-image: url(/assets/flag-icons/svg/so.svg)
}

span.flag-icon.flag-icon-sr {
    background-image: url(/assets/flag-icons/svg/sr.svg)
}

span.flag-icon.flag-icon-ss {
    background-image: url(/assets/flag-icons/svg/ss.svg)
}

span.flag-icon.flag-icon-st {
    background-image: url(/assets/flag-icons/svg/st.svg)
}

span.flag-icon.flag-icon-sv {
    background-image: url(/assets/flag-icons/svg/sv.svg)
}

span.flag-icon.flag-icon-sx {
    background-image: url(/assets/flag-icons/svg/sx.svg)
}

span.flag-icon.flag-icon-sy {
    background-image: url(/assets/flag-icons/svg/sy.svg)
}

span.flag-icon.flag-icon-sz {
    background-image: url(/assets/flag-icons/svg/sz.svg)
}

span.flag-icon.flag-icon-tc {
    background-image: url(/assets/flag-icons/svg/tc.svg)
}

span.flag-icon.flag-icon-td {
    background-image: url(/assets/flag-icons/svg/td.svg)
}

span.flag-icon.flag-icon-tf {
    background-image: url(/assets/flag-icons/svg/tf.svg)
}

span.flag-icon.flag-icon-tg {
    background-image: url(/assets/flag-icons/svg/tg.svg)
}

span.flag-icon.flag-icon-th {
    background-image: url(/assets/flag-icons/svg/th.svg)
}

span.flag-icon.flag-icon-tj {
    background-image: url(/assets/flag-icons/svg/tj.svg)
}

span.flag-icon.flag-icon-tk {
    background-image: url(/assets/flag-icons/svg/tk.svg)
}

span.flag-icon.flag-icon-tl {
    background-image: url(/assets/flag-icons/svg/tl.svg)
}

span.flag-icon.flag-icon-tm {
    background-image: url(/assets/flag-icons/svg/tm.svg)
}

span.flag-icon.flag-icon-tn {
    background-image: url(/assets/flag-icons/svg/tn.svg)
}

span.flag-icon.flag-icon-to {
    background-image: url(/assets/flag-icons/svg/to.svg)
}

span.flag-icon.flag-icon-tr {
    background-image: url(/assets/flag-icons/svg/tr.svg)
}

span.flag-icon.flag-icon-tt {
    background-image: url(/assets/flag-icons/svg/tt.svg)
}

span.flag-icon.flag-icon-tv {
    background-image: url(/assets/flag-icons/svg/tv.svg)
}

span.flag-icon.flag-icon-tw {
    background-image: url(/assets/flag-icons/svg/tw.svg)
}

span.flag-icon.flag-icon-tz {
    background-image: url(/assets/flag-icons/svg/tz.svg)
}

span.flag-icon.flag-icon-ua {
    background-image: url(/assets/flag-icons/svg/ua.svg)
}

span.flag-icon.flag-icon-ug {
    background-image: url(/assets/flag-icons/svg/ug.svg)
}

span.flag-icon.flag-icon-um {
    background-image: url(/assets/flag-icons/svg/um.svg)
}

span.flag-icon.flag-icon-uk {
    background-image: url(/assets/flag-icons/svg/uk.svg)
}

span.flag-icon.flag-icon-us-ca {
    background-image: url(/assets/flag-icons/svg/us-ca.svg)
}

span.flag-icon.flag-icon-us {
    background-image: url(/assets/flag-icons/svg/us.svg)
}

span.flag-icon.flag-icon-uy {
    background-image: url(/assets/flag-icons/svg/uy.svg)
}

span.flag-icon.flag-icon-uz {
    background-image: url(/assets/flag-icons/svg/uz.svg)
}

span.flag-icon.flag-icon-va {
    background-image: url(/assets/flag-icons/svg/va.svg)
}

span.flag-icon.flag-icon-vc {
    background-image: url(/assets/flag-icons/svg/vc.svg)
}

span.flag-icon.flag-icon-ve {
    background-image: url(/assets/flag-icons/svg/ve.svg)
}

span.flag-icon.flag-icon-vg {
    background-image: url(/assets/flag-icons/svg/vg.svg)
}

span.flag-icon.flag-icon-vi {
    background-image: url(/assets/flag-icons/svg/vi.svg)
}

span.flag-icon.flag-icon-vn {
    background-image: url(/assets/flag-icons/svg/vn.svg)
}

span.flag-icon.flag-icon-vu {
    background-image: url(/assets/flag-icons/svg/vu.svg)
}

span.flag-icon.flag-icon-wf {
    background-image: url(/assets/flag-icons/svg/wf.svg)
}

span.flag-icon.flag-icon-ws {
    background-image: url(/assets/flag-icons/svg/ws.svg)
}

span.flag-icon.flag-icon-xk {
    background-image: url(/assets/flag-icons/svg/xk.svg)
}

span.flag-icon.flag-icon-ye {
    background-image: url(/assets/flag-icons/svg/ye.svg)
}

span.flag-icon.flag-icon-yt {
    background-image: url(/assets/flag-icons/svg/yt.svg)
}

span.flag-icon.flag-icon-za {
    background-image: url(/assets/flag-icons/svg/za.svg)
}

span.flag-icon.flag-icon-zm {
    background-image: url(/assets/flag-icons/svg/zm.svg)
}

span.flag-icon.flag-icon-zw {
    background-image: url(/assets/flag-icons/svg/zw.svg)
}

:root {
    font-size: 14px
}

body {
    color: #fff;
    /* overflow: overlay; */
    /* overflow-x: auto */
}

body.light {
    color: #333
}

* {
    padding: 0;
    margin: 0;
    outline: none;
    touch-action: manipulation
}

body {
    min-width: 1340px
}

.iconfont {
    font-size: 25px
}

a {
    color: #ffffffb3;
    transition: all .1s ease-out;
    text-decoration: none
}

.light a {
    color: #333
}

a:hover {
    text-decoration: none
}

.light a:hover,a:hover {
    color: #00c0ff
}

ul {
    margin: 0;
    padding: 0
}

li,ol,ul {
    list-style: none
}

input {
    outline: none
}

body {
    background-color: #090b21;
    -webkit-font-smoothing: antialiased;
    font-size: 13px
}

body.light {
    background-color: #fff
}

body h6 {
    font-size: 12px
}

body h5 {
    font-size: 16px
}

body h4 {
    font-size: 18px
}

body h3 {
    font-size: 22px
}

body h1,body h2 {
    font-size: 30px
}

body h1,body h2,body h3,body h4,body h5,body h6 {
    margin: 0
}

@media(max-width: 1335px) {
    body .container {
        width:1270px!important;
        min-width: 1270px!important;
        max-width: 1270px!important
    }
}

body app-top-ranked-videos {
    display: none
}

body .teaser-cover {
    width: 100%;
    height: 100%
}

body .visible-lg,body .visible-xl {
    display: none
}

@media(max-width: 1439px) {
    body .hidden-sm {
        display:none!important
    }
}

@media(min-width: 1440px) and (max-width:1678px) {
    body .hidden-md {
        display:none!important
    }
}

@media(min-width: 1679px) and (max-width:1911px) {
    body .hidden-lg {
        display:none!important
    }
}

@media(min-width: 1912px) {
    body .hidden-xl {
        display:none!important
    }
}

@media(min-width: 1679px) and (max-width:1911px) {
    body .visible-lg {
        display:block!important
    }
}

@media(min-width: 1912px) {
    body .visible-xl {
        display:block!important
    }
}

body .hidden {
    display: none!important
}

body h3 a {
    color: #fff
}

body h3 a.light {
    color: #333
}

body .wrapper {
    width: 100%;
    display: block
}

body .dn-btn {
    width: 90px;
    height: 28px;
    line-height: 28px;
    display: inline-block;
    border: 1px solid red;
    border-radius: 14px;
    font-size: 13px;
    color: red;
    text-align: center
}

body .dn-btn:hover {
    background-color: red;
    color: #fff
}

body .hover-scale {
    display: block;
    transition: all .25s ease-in-out
}

body .hover-scale:hover {
    transform: scale(1.05)
}

body .img-containner {
    overflow: hidden
}

body .title-wrap {
    padding: 8px 0 7px
}

body .form-control {
    border-radius: 0
}

body .form-control:focus {
    box-shadow: none
}

body label {
    min-width: 72px;
    margin: 0;
    padding: .375rem .75rem;
    line-height: 1.5;
    font-size: 1rem;
    border: 1px solid #0000
}

body .table-cell {
    padding: 5px
}

body .top-mask {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #00000080;
    z-index: 9998
}

body .top-box {
    position: fixed;
    left: 50%;
    top: 50%;
    background: #090b21;
    padding: 32px;
    z-index: 9999;
    width: 640px;
    height: 480px;
    transform: translate(-50%,-50%);
    box-shadow: 2px 3px 5px 0 #000000bf
}

:host-context(.light) body .top-box {
    background-color: #fff
}

body .dialog-bottom {
    position: absolute;
    bottom: 30px;
    width: 100%;
    display: flex;
    justify-content: center
}

body .dialog-bottom .dn-button {
    width: 100px;
    margin: 0 10px
}

body .content {
    flex: 1
}

body app-search .content {
    min-height: 300px;
    width: 100%
}

.dropdown-footer {
    margin-top: 1rem;
    padding: 4px 12px;
    border-top: 1px solid #0000;
    height: 12px;
    display: flex;
    align-items: center
}

.light .dropdown-footer {
    border-color: #0000
}

.table-header {
    border-bottom: 3px solid #eee;
    padding-bottom: 10px
}

.light .table-header {
    border-color: #363636!important
}

.user-center-container {
    width: 1770px;
    margin-left: auto;
    margin-right: auto;
    min-height: 100vh;
    border-left: 1px solid #6663;
    border-right: 1px solid #6663;
    background-color: #090b21
}

.light .user-center-container {
    border-color: #1a1a1a;
    background-color: #fff
}

.user-center-container .container-inner {
    padding: 30px 80px 90px
}

.user-center-container .sidebar {
    width: 200px
}

.dropdown {
    cursor: default;
    padding: 12px 0 0;
    position: absolute;
    top: 62px;
    left: 0;
    background-color: #2b2c3a;
    z-index: 9999;
    box-shadow: 2px 2px 1px 0 #00000057;
    min-height: 50px;
    color: #fff
}

.light .dropdown {
    background-color: #fafafa;
    box-shadow: 2px 2px 4px 0 #0000003d
}

.text-dark {
    color: #434343!important
}

.light .text-dark {
    color: #e6e6e6!important
}

.root-container {
    background-color: #090b21
}

.light .root-container {
    background-color: #eee
}

.outer {
    background-color: #090b21
}

.light .outer {
    background-color: #fff
}

@media only screen and (min-width: 1921px) {
    body {
        background-color:#090b21
    }
}

.dn-dialog-buttons .dn-button {
    width: 116px!important;
    height: 40px!important;
    font-size: 15px!important;
    line-height: 29px!important;
    border-radius: 0;
    background-color: unset!important;
    color: #ffffffb3!important;
    margin: 0 auto
}

.light .dn-dialog-buttons .dn-button {
    color: #333!important
}

.dn-dialog-buttons .dn-button:hover {
    color: #fff!important
}

.light .dn-dialog-buttons .dn-button:hover {
    color: #333!important
}

#reportComment .dn-dialog-buttons,#reportDanmu .dn-dialog-buttons {
    padding: 8px 0
}

.amcharts-main-div a {
    display: none!important
}

.amcharts-main-div .amcharts-zoom-out-bg {
    opacity: 0!important
}

.amcharts-main-div .amcharts-zoom-out-label {
    cursor: pointer
}

.amcharts-main-div .amcharts-zoom-out-label tspan {
    fill: #fff
}

.light .amcharts-main-div .amcharts-zoom-out-label tspan {
    fill: #333
}

.amcharts-legend-div {
    margin: 0 auto
}

.amcharts-legend-label tspan {
    font-family: Microsoft YaHei
}

.notifications {
    z-index: 1;
    background-color: red;
    color: #fff;
    padding: 4px 3px;
    position: absolute;
    top: 0;
    right: -22px;
    min-width: 16px;
    text-align: center;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 400;
    height: 17px;
    line-height: 14px
}

.menu-label {
    white-space: nowrap;
    color: #fff
}

app-summary div,app-summary p {
    margin: 0
}

font[color=green] {
    color: #0ec610
}

.dn-icon {
    font-size: 25px
}

.dn-icon-medium {
    font-size: 20px
}

.dn-icon-small {
    font-size: 18px
}

#dn_iframe {
    display: none;
    position: fixed;
    width: 600px;
    height: 400px;
    left: 50%;
    top: 50%;
    opacity: 1;
    transform: translate(50%,50%)
}

.divider {
    border-bottom: 1px solid #ddd;
    height: 1px
}

app-help-center h1 {
    font-size: 20px
}

app-help-center p {
    margin: 0
}

.sidebar {
    width: 375px;
    flex: 0 0 375px;
    margin-left: 30px
}

vg-player :not(input) {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none
}

.timeline {
    padding-top: 2px;
    display: flex;
    align-items: center
}

vg-scrub-bar-current-time .background {
    background-color: #00c0ff!important
}

vg-scrub-bar-current-time .background .dot {
    border-color: #00c0ff!important;
    background-color: #00c0ff!important
}

.publicbox vg-scrub-bar.tiny {
    bottom: -4.5em!important;
    margin: 0!important;
    left: 0;
    opacity: 1;
    width: 100%!important
}

.publicbox vg-scrub-bar.tiny .scrubBar {
    background-color: initial
}

.publicbox vg-scrub-bar.tiny vg-scrub-bar-current-time .background {
    background-color: #ffdf00;
    border-radius: 0
}

.publicbox vg-scrub-bar.tiny vg-scrub-bar-current-time .background:before {
    display: none
}

.publicbox vg-mute {
    margin-top: 0;
    padding: 0!important;
    width: 2em;
    height: 1em
}

.publicbox vg-mute div {
    width: .6em
}

.bottom-scrub-bar vg-scrub-bar-current-time.pure .background .dot {
    border-radius: 0!important;
    width: 10px!important;
    height: 10px!important;
    right: -5px!important;
    margin-top: -4px!important;
    opacity: 0
}

.bottom-scrub-bar vg-scrub-bar:hover vg-scrub-bar-current-time.pure .background .dot {
    width: 14px!important;
    height: 14px!important;
    right: -7px!important;
    margin-top: -5px!important;
    background-color: #00c0ff!important;
    opacity: 1
}

vg-scrub-bar:hover vg-scrub-bar-current-time .background .dot {
    width: 16px;
    height: 16px;
    background-color: #fff!important
}

#__ckplayer__ ._fbox {
    font-size: 25px;
    top: 50%;
    position: absolute;
    margin-top: -1em;
    width: 100%;
    text-align: center
}

#__ckplayer__ ._fbox>.click_here {
    color: #fff
}

.iframe {
    width: 100%;
    height: 100%;
    border: none;
    margin: 0
}

app-confirm-dialog p {
    text-align: left;
    font-size: 16px
}

app-confirm-dialog ul {
    text-align: left;
    font-size: 15px
}

.istouch a {
    transition: none
}

.istouch .video-teaser .poster {
    transition: none!important
}

.text-main {
    color: #00c0ff
}

.ps__rail-y {
    background-color: initial!important;
    width: 10px!important;
    opacity: .6!important
}

.ps__thumb-y {
    background-color: #6666!important;
    width: 8px!important;
    left: 1px!important;
    border-radius: 0!important
}

.scroll-bar::-webkit-scrollbar {
    width: 10px
}

.scroll-bar::-webkit-scrollbar-track {
    background-color: #6663
}

.scroll-bar::-webkit-scrollbar-thumb {
    background: #0db9f0;
    border: 1px solid #0000;
    background-clip: content-box
}

.scroll-bar.transparent::-webkit-scrollbar-track {
    background-color: #6660
}

.scroll-bar.transparent::-webkit-scrollbar-thumb {
    background: #6666;
    border: 1px solid #0000;
    background-clip: content-box
}

hidden * {
    display: none!important
}

vg-volume.vertical .volumeKnob,vg-volume.vertical .volumeValue {
    background-color: #00c0ff!important
}

.light app-emoji-box .d-flex .tab {
    color: #888!important
}

.light app-emoji-box .d-flex .tab:hover {
    background-color: #00c0ff!important;
    color: #fff!important
}

.light app-emoji-box .d-flex .tab.active {
    background-color: #00c0ff!important;
    color: #fff!important
}

.light app-user-center .d-flex .tab {
    color: #ffffffb3!important
}

.light app-user-center .d-flex .tab:hover {
    background-color: initial!important;
    color: #00c0ff!important
}

.light app-user-center .d-flex .tab.active {
    background-color: #00c0ff!important;
    color: #fff!important
}

.light app-user-center app-emoji-box .d-flex .tab {
    color: #888!important
}

app-help-center .d-flex .tab.active {
    color: #fff!important;
    background-color: #1c1d2f!important
}

.light app-help-center .d-flex .tab.active {
    color: #333!important;
    background-color: #fff!important
}

.border-bottom .tab,.d-flex .tab {
    color: #ffffffb3!important
}

.light .border-bottom .tab,.light .d-flex .tab {
    color: #888!important
}

.border-bottom .tab:hover,.d-flex .tab:hover {
    color: #fff!important
}

.light .border-bottom .tab:hover,.light .d-flex .tab:hover {
    color: #888!important;
    background-color: #fff!important
}

.border-bottom .tab.active,.d-flex .tab.active {
    color: #fff!important;
    background-color: #0000004d!important
}

.light .border-bottom .tab.active,.light .d-flex .tab.active {
    color: #333!important;
    background-color: #fff!important
}

app-ad-center .border-bottom .tab.active,app-ad-center .d-flex .tab.active {
    background-color: initial!important
}

.filters .tab:hover {
    color: #00c0ff!important
}

.filters .tab.active {
    background-color: #00c0ff!important;
    color: #fff!important
}

.light .filters .tab.active {
    background-color: #fff!important;
    color: #333!important
}

.top-item {
    height: 100%
}

.iconfont.iconVIP {
    color: #fec1a1;
    background: -webkit-linear-gradient(#fec1a1,#fff);
    overflow: hidden;
    -webkit-background-clip: text;
    -webkit-text-fill-color: #0000
}

.rotate-180 {
    transform: rotate(-180deg);
    display: inline-block
}

.btn-default {
    display: inline-block;
    padding: .3em 1.5em;
    color: #fff;
    background-color: #00c0ff;
    border-radius: 0;
    cursor: pointer
}

.light .btn-default {
    color: #00c0ff!important;
    border: 1px solid #00c0ff;
    background-color: initial!important
}

.btn-default:hover {
    color: #fff!important;
    background-color: #00c0ff
}

.light .btn-default:hover {
    background-color: #00c0ff!important
}

.btn-outline-gold {
    color: #ffb400;
    border-color: #ffb400;
    border-radius: 0;
    outline: none
}

.btn-outline-gold:hover {
    color: #ffbf28;
    border-color: #ffbf28
}

.btn-lg {
    font-size: 18px
}

.pull-right {
    float: right!important
}

.cropper {
    outline: 100vw solid #0000004d!important
}

.btn-default .icon-adult-1 {
    font-size: 14px;
    margin-left: -2px;
    margin-right: 3px
}

.btn-default .icon-adult-1:before {
    margin: 0
}

#custom-iframe-dialog .dialog {
    padding: 0;
    overflow: hidden
}

.transparent .input input {
    background-color: #ffffff59!important;
    color: #fff!important
}

.transparent .input input::-webkit-input-placeholder {
    color: #ffffff8f!important
}

.transparent .text-sample {
    color: #fff!important;
    text-shadow: none!important
}

.tbox {
    position: absolute;
    display: none;
    padding: 14px 17px;
    z-index: 900
}

.tinner {
    padding: 15px;
    border-radius: 5px;
    background: #fff url(/assets/images/preload.gif) no-repeat 50% 50%;
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    box-shadow: 2px 3px 5px 0 #000000bf
}

.tmask {
    display: none;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #000;
    z-index: 800
}

.tclose,.tmask {
    position: absolute
}

.tclose {
    top: 18px;
    right: 22px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    background: url(/assets/images/closeme2.png) no-repeat;
    background-size: 24px;
    display: block
}

.tclose:hover {
    background-position: 0 -24px
}

#error {
    background: #ff6969;
    color: #fff;
    text-shadow: 1px 1px #cf5454;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    padding: 0
}

#error .tcontent {
    padding: 10px 14px 11px;
    border: 1px solid #ffb8b8;
    border-radius: 5px
}

#success {
    background: #2ea125;
    color: #fff;
    text-shadow: 1px 1px #1b6116;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    padding: 10;
    border-radius: 0
}

#bluemask {
    background: #0009
}

#frameless {
    padding: 0
}

.job_detail {
    padding: 15px;
    color: #ffffffb3!important
}

.light .job_detail {
    color: #333!important
}

.job_detail h5 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 1em
}

.job_detail p {
    font-size: 16px
}

.invitaion-box .block-title {
    padding-left: 51px!important
}

.invitaion-box .block-title:after {
    left: 35px!important
}

label span {
    cursor: pointer
}

input[type=radio] {
    cursor: pointer;
    margin-top: -2px;
    vertical-align: middle;
    margin-right: 5px
}

button[type=button]:focus,input[type=button]:focus {
    outline: 0!important;
    outline: none!important;
    box-shadow: none!important
}

.ckb,.rad {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none
}

.ckb>input,.rad>input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0
}

.ckb>i,.rad>i {
    display: inline-block;
    vertical-align: middle;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    transition: .2s;
    box-shadow: inset 0 0 0 8px #fff;
    border: 1px solid gray;
    background: gray;
    margin-top: -2px
}

.ckb>i {
    width: 25px;
    border-radius: 3px
}

.rad:hover>i {
    box-shadow: inset 0 0 0 3px #fff;
    background: gray
}

.rad>input:checked+i {
    box-shadow: inset 0 0 0 3px #fff;
    background: #00c0ff
}

.ckb>input+i:after {
    content: "";
    display: block;
    height: 12px;
    width: 12px;
    margin: 2px;
    border-radius: inherit;
    transition: inherit;
    background: gray
}

.ckb>input:checked+i:after {
    margin-left: 11px;
    background: orange
}

.dropdown.downloadable {
    box-shadow: none
}

.dropdown.downloadable a {
    width: 100%;
    display: block;
    padding-left: 1em
}

.dropdown.downloadable .dropdown-menu {
    min-width: 5rem
}

.light .dropdown-menu {
    background-color: #fff!important
}

.light .dropdown-menu li.disabled a,.light .dropdown-menu li.disabled a:hover {
    color: #333!important
}

.light .dropdown-menu li.divider {
    border-color: #ddd!important
}

.dialog.special {
    background-color: initial!important;
    background-image: url(/assets/images/daily-sign-in/bg-pc.png);
    border: none!important;
    box-shadow: none!important
}

.tab.active,.tab:hover {
    color: #00c0ff!important
}

.ngx-gallery-thumbnail,.ngx-gallery-thumbnail.ngx-gallery-active {
    border: none!important
}

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

.amChartsLegend {
    display: block
}

@media(max-width: 1439px) {
    .statistics {
        width:26em
    }

    .statistics .amChartsLegend {
        display: none
    }

    app-trending-chart .chart-container {
        width: 48em
    }

    app-play-statistics .chart-container {
        width: 49em
    }
}

@media(min-width: 1440px) and (max-width:1678px) {
    .statistics {
        width:26em
    }

    .statistics .amChartsLegend {
        display: none
    }
}

.video-publisher-container {
    background-color: #1c1d2f
}

@media(min-width: 1679px) and (max-width:1911px) {
    .video-publisher-container {
        height:106px!important
    }

    .app-download-block {
        height: 113px!important;
        padding: 9px 16px!important
    }

    .app-download-block .image {
        width: 94px!important;
        height: 94px!important
    }

    .statistics {
        width: 33em
    }

    .statistics .amChartsLegend {
        display: none
    }

    .dn-videoplayer-wrap {
        height: 594px!important
    }
}

.iconjiantou_liebiaozhankai {
    transition: rotate .3s
}

app-play-statistics #chartdiv {
    overflow: visible!important
}

app-play-statistics .amcharts-chart-div {
    width: 420px!important;
    overflow: visible!important;
    left: 0;
    top: 0
}

app-play-statistics .amcharts-chart-div svg {
    left: -175.5px!important;
    top: -71px!important
}

.onfull .input-area {
    margin: 0 auto!important;
    position: absolute!important;
    left: 0;
    right: 0;
    top: 15px;
    z-index: -1
}

.openList {
    position: absolute;
    background-color: #000000b3;
    bottom: 3.5em;
    z-index: 502;
    margin-left: -1em;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height .2s
}

.openList .item {
    cursor: pointer;
    color: #bfbfbf
}

.openList .item:hover {
    color: #fff
}

.openList .item.active {
    color: #00c0ff
}

.openList .item.disabled {
    color: #fff6
}

.openList.opened {
    padding: .5em 1em;
    max-height: 11em;
    opacity: 1
}

.openList.setting {
    height: 0;
    max-height: unset!important;
    opacity: unset!important;
    transition: height .2s;
    z-index: 9999
}

.openList.setting.opened {
    height: 232px
}

.openList.player-speed-menu {
    height: 0;
    max-height: unset!important;
    opacity: unset!important;
    transition: height .2s;
    display: block!important
}

.openList.player-speed-menu.opened {
    height: 264px
}

.openList.noMaxHeight {
    max-height: unset!important;
    opacity: unset!important;
    transition: height .2s
}

.coin-icon,.level-icon {
    background: url(/assets/images/user-levels.png?v=1) no-repeat;
    background-position: 0 -1.5em
}

.level-icon {
    background-position: 0 0
}

.form-control {
    background-clip: unset
}

.icon-size {
    font-size: 20px;
    margin-bottom: 1px
}

.icon-size.iconnanxing {
    color: #00adef
}

.icon-size.iconnvxing {
    color: #ec108f
}

.pull-left {
    float: left!important
}

.text-left {
    text-align: left;
    color: #fff
}

small {
    color: #fff6
}

.open-vip {
    border: none;
    padding: .2em .5em;
    outline: none!important;
    background-color: #fff;
    color: #9a3334;
    font-weight: 700;
    background: linear-gradient(#feecc6,#fec3a3)
}

.clear {
    clear: both
}

.clear:after {
    content: " ";
    clear: both
}

.vip-label {
    background-image: url(/assets/images/vip-label.png);
    background-repeat: no-repeat;
    width: 25px;
    height: 14px;
    display: inline-block;
    position: relative
}

.vip-label-placeholder {
    width: 25px
}

.progress {
    background-color: #fff6
}

.progress .progress-bar {
    background-color: #26b4be
}

.btn-default {
    background-color: #373843;
    color: #ffffffb3
}

.btn-default:hover {
    background-color: #373843;
    color: #fff
}

.animate-spin {
    animation: spin 2s linear infinite;
    display: inline-block
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(359deg)
    }
}

.light .navbg app-dn-search-input .inner #search-input {
    background-color: #eee;
    color: #888
}

.light .navbg app-dn-search-input .inner .search-suggest {
    color: #888
}

.light .navbg app-dn-search-input .inner .iconsousuo {
    color: #aaa;
    opacity: 1
}

.light .navbg app-dn-search-input .inner .iconpaihang2 {
    color: #aaa;
    opacity: 1
}

.light .navbg app-dn-search-input .search-box.focused #search-input {
    color: #333
}

.light .navbg app-dn-menu .nav-button,.light .navbg app-dn-menu .nav-expander.expanded a,.light .navbg app-dn-menu .nav-expander:hover a {
    color: #888!important
}

.light .navbg app-dn-user-menu-item .item div {
    color: #aaa!important
}

.light .navbg app-dn-user-menu-item .item div.jbutton {
    color: #a0a0a0!important
}

.light .navbg app-dn-user-menu-item .item div.favorites-number,.light .navbg app-dn-user-menu-item .item div.messages-number {
    color: #fff!important
}

.light .navbg app-dn-user-menu-item app-dropdown-notifications app-dropdown-notifications-messages a.main-color {
    color: #00c0ff!important
}

.light .navbg .uploader,.light .navbg .user-block .user-status,.light .navbg app-daily-sign-in-button .sign-in-ctn .sign-in,.light .navbg app-daily-sign-in-button .sign-in-ctn:hover .sign-in {
    color: #aaa!important
}

.playPageNavBg app-dn-search-input .inner #search-input {
    background-color: #98989833!important;
    color: #ffffffb3!important
}

.light .top-nav.playPage app-dn-menu .nav-button,.playPageNavBg app-dn-search-input .inner .search-suggest,.playPageNavBg app-dn-search-input .search-box.focused #search-input {
    color: #ffffffb3!important
}

.light .top-nav.playPage app-dn-menu .nav-button:hover {
    color: #fff!important
}

.light .top-nav.playPage app-daily-sign-in-button .sign-in-ctn .sign-in,.light .top-nav.playPage app-daily-sign-in-button .sign-in-ctn:hover .sign-in {
    color: #ffffffb3!important
}

.light .top-nav.playPage app-daily-sign-in-button .sign-in-ctn .sign-in:hover,.light .top-nav.playPage app-daily-sign-in-button .sign-in-ctn:hover .sign-in:hover {
    color: #fff!important
}

.light .top-nav.playPage .uploader {
    color: #ffffffb3!important
}

.light .top-nav.playPage .uploader:hover {
    color: #fff!important
}

.light .top-nav.playPage app-dn-user-menu-item .item div.d-flex.align-items-center.justify-content-center {
    color: #ffffffb3!important
}

.light .top-nav.playPage app-dn-user-menu-item .item div.d-flex.align-items-center.justify-content-center:hover {
    color: #fff!important
}

.light .playPageBottom .comment-box {
    background-color: #eee!important
}

app-index app-danmu-input .tabs .tab,app-watch app-danmu-input .tabs .tab {
    color: #ffffffb3!important;
    background-color: initial!important
}

app-index app-danmu-input .tabs .tab.active,app-watch app-danmu-input .tabs .tab.active {
    color: #fff!important;
    background-color: initial!important
}

.qr-code img {
    width: 105px;
    height: 105px
}

app-recharge-box .label span,app-recharge-container .label span {
    color: #fec1a1!important
}

.light app-index app-danmu-input .config-block-tabs .tab.config:hover,.light app-index app-danmu-input .tabs .tab.active,.light app-index app-danmu-input .tabs .tab:hover,.light app-watch app-danmu-input .config-block-tabs .tab.config:hover,.light app-watch app-danmu-input .tabs .tab.active,.light app-watch app-danmu-input .tabs .tab:hover {
    color: #fff!important
}

.light .iconfont.iconVIP {
    color: #ffa800;
    background: -webkit-linear-gradient(#ffa800,#fdd101);
    overflow: hidden;
    -webkit-background-clip: text;
    -webkit-text-fill-color: #0000
}

.light .comment-box-mask-layer {
    background-color: #ffffffb3!important
}

.light app-address-editor input:focus {
    border: 1px solid #666!important
}

.light app-mycard .user-center {
    border: 1px solid #00c0ff!important
}

.light app-recharge-container .payment-tab.tab-active {
    border-bottom: 3px solid #0000!important
}

.light app-recharge-container .account-input,.light app-recharge-container .coupon-input {
    border: 1px solid #ddd!important
}

.light app-top-ranked-videos .rank {
    margin-bottom: 13px!important
}

.light app-top-ranked-videos .content {
    border: 2px solid!important
}

.light app-app-download .btn_udl {
    border-bottom: 1px solid #e6e6e6!important
}

.light app-qr-box .hoverBox {
    box-shadow: 1px 1px 8px 0 #838383!important
}

.light app-qr-box .triangle {
    border-color: #0000 #0000 #f8f8f8!important
}

.light app-qr-box .app-qr-code {
    box-shadow: 6px 6px 6px 1px!important
}

.light app-user-meta .name-text {
    text-shadow: none!important
}

.light app-dn-comment .floating:hover {
    background-color: #6663!important
}

.light .ss-ctn {
    border: 1px solid #eee
}

.light app-recharge-box .tab-zone .tab-zone-row .tab-item.active,.light app-recharge-container .tab-zone .tab-zone-row .tab-item.active {
    background: linear-gradient(173deg,#63d8ff,#41cefd 30%,#00c0ff 50%,#00c0ff)
}

.light app-recharge-box .tab-zone .tab-zone-row .active-bottom-line,.light app-recharge-container .tab-zone .tab-zone-row .active-bottom-line {
    display: none
}

app-recommended-news .container {
    margin-top: 2px!important
}

app-subindex .subindex-content .header {
    padding: 33px 0
}

app-subindex app-classified-top-videos .header {
    padding: 33px 0!important
}

app-classified-top-videos-news .container.autoHeight {
    height: 245px!important
}

@media(max-width: 1678px) {
    .danmu-input-container {
        min-width:390px!important
    }

    .danmu-input-container .input-area .input input {
        width: 300px!important
    }

    .danmu-input-container .action {
        margin-right: 15px!important
    }

    vg-pause-d .vg-bg {
        top: 40%
    }
}

@media(min-width: 1679px) {
    .danmu-input-container .input-area .input input {
        width:460px!important
    }
}

html app-activity-detail app-dn-comment .avatar {
    width: 40px!important;
    height: 40px!important
}

html app-activity-detail app-dn-comment .vipIcon {
    height: 15px!important;
    margin-top: 12px!important;
    margin-left: 40px!important
}

html app-activity-detail app-dn-comment .vipIcon.new-icon {
    margin-top: 15px!important;
    margin-left: 49px!important
}

html app-activity-detail app-dn-comment .name-card.expanded .vipIcon.new-icon,html app-activity-detail app-dn-comment .name-card:hover .vipIcon.new-icon {
    zoom:1!important;margin-top: 18px!important;
    margin-left: 65px!important
}

html app-dn-comment app-dn-comment .avatar {
    width: 30px!important;
    height: 30px!important
}

html app-dn-comment app-dn-comment .membership.alone {
    height: 13px!important;
    margin-top: 13px!important;
    margin-left: -25px!important
}

html app-dn-comment app-dn-comment .vipIcon {
    height: 13px!important;
    margin-top: 13px!important;
    margin-left: 36px!important
}

html app-dn-comment app-dn-comment .name-card:hover .vipIcon {
    margin-left: 72px!important
}

html app-dn-comment app-dn-comment .comment>.content {
    padding-left: 60px!important
}

html app-activity-detail app-dn-comment app-dn-comment .avatar {
    width: 25px!important;
    height: 25px!important
}

html app-activity-detail app-dn-comment app-dn-comment .vipIcon {
    height: 12px!important;
    margin-top: 0!important;
    margin-left: 28px!important
}

html app-activity-detail app-dn-comment app-dn-comment .vipIcon.new-icon {
    zoom:.5!important;height: auto!important;
    margin-top: 0!important;
    margin-left: 55px!important
}

html app-activity-detail app-dn-comment app-dn-comment .name-card.expanded .vipIcon.new-icon,html app-activity-detail app-dn-comment app-dn-comment .name-card:hover .vipIcon.new-icon {
    zoom:1!important;margin-top: 4px!important;
    margin-left: 65px!important
}

.page-right .top-ranked .header {
    padding-bottom: 28px
}

.page-right .block-title {
    margin: 28px 0!important;
    padding-top: 0!important;
    padding-bottom: 0!important
}

.video-player .n-media .n-media-list .media-button {
    width: 68px
}

.amcharts-value-axis .amcharts-axis-tick {
    display: none
}

.light app-player-media-list app-list .n-media .n-media-list .media-button {
    color: #fff6!important
}

.light app-player-media-list app-list .n-media .n-media-list .media-button.active,.light app-player-media-list app-list .n-media .n-media-list .media-button:not(.placeholder):not(.active):hover {
    background-color: #00000080!important
}

.light app-player-media-list app-list .n-media .n-media-list .media-button.active {
    border: 0 solid!important
}

.light app-player-media-list app-list .n-media app-expandable-tabs .medias-selector-expandable-tabs button {
    color: #fff6
}

.light app-player-media-list app-list .n-media app-expandable-tabs .medias-selector-expandable-tabs button.active,.light app-player-media-list app-list .n-media app-expandable-tabs .medias-selector-expandable-tabs button:hover {
    color: #00c0ff
}

.light app-player-media-list app-list-by-year .n-media .n-media-list .media-button {
    color: #fff6!important
}

.light app-player-media-list app-list-by-year .n-media .n-media-list .media-button.active,.light app-player-media-list app-list-by-year .n-media .n-media-list .media-button:not(.placeholder):not(.active):hover {
    background-color: #00000080!important
}

.light app-player-media-list app-list-by-year .n-media .n-media-list .media-button.active {
    border: 0 solid!important
}

.light app-player-media-list app-list-by-year .n-media app-expandable-tabs .medias-selector-expandable-tabs button {
    color: #fff6
}

.light app-player-media-list app-list-by-year .n-media app-expandable-tabs .medias-selector-expandable-tabs button.active,.light app-player-media-list app-list-by-year .n-media app-expandable-tabs .medias-selector-expandable-tabs button:hover {
    color: #00c0ff
}

.s-page .news-item {
    margin-bottom: 24px
}

.s-page .news-item .title {
    white-space: normal!important;
    display: -webkit-box;
    max-height: 48px;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-line-clamp: 2
}

app-index .config-block .tabs .tab,app-watch .config-block .tabs .tab {
    position: relative
}

app-index .config-block .tabs .tab.active,app-index .config-block .tabs .tab:hover,app-watch .config-block .tabs .tab.active,app-watch .config-block .tabs .tab:hover {
    background-color: initial!important
}

app-index .config-block .tabs .tab.active:after,app-index .config-block .tabs .tab:hover:after,app-watch .config-block .tabs .tab.active:after,app-watch .config-block .tabs .tab:hover:after {
    content: "";
    display: block;
    position: absolute;
    height: 3px;
    width: 60px;
    background-color: #0db9f0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%)
}

.onfull .config-block {
    right: auto!important;
    bottom: 85px!important;
    left: -87px!important
}

.onfull .config-block .tabs:first-child .tab {
    padding: 12px 10px!important
}

.onfull .danmu-input-settings-block {
    bottom: 85px!important
}

.onfull .slider-label span:after {
    top: -5px!important
}

.sub-level .name-card .avatar {
    margin-top: -5px!important
}

.sub-level .author-block.activityLast3Child .name-card .avatar {
    margin-top: -12px!important
}

app-dn-comment button.icon-button:hover {
    background-color: initial!important
}

app-dn-comment .comment.sub-level .body font {
    margin-right: 4px
}

.news-item .shadow-bar {
    height: 37px;
    background-color: red;
    position: absolute;
    bottom: 0;
    width: 100%;
    background: linear-gradient(180deg,#0000,#00000080)
}

.light .new-media {
    height: 5px;
    width: 5px;
    border-radius: 50%;
    background-color: #fa2828
}

#coin-or-upgrade-to-skip-ad .dn-button:last-child {
    color: #fec1a1!important
}

#coin-or-upgrade-to-skip-ad .title {
    margin-top: 35px
}

#coin-or-upgrade-to-skip-ad .message {
    padding: 35px 0 0;
    color: #fec1a1
}

@media(max-width: 1678px) {
    .ps.pccb .bl {
        min-height:252px;
        background-color: #1c1d2f
    }

    .video-publisher-container {
        height: 84px!important
    }

    .app-download-block {
        height: 90px!important;
        padding: 9px 16px!important
    }

    .app-download-block .app-download-block-content {
        height: 80px!important
    }

    .app-download-block .image {
        width: 76px!important;
        height: 76px!important
    }

    .app-download-block .link-button {
        margin: 3px 0!important
    }

    .dn-videoplayer-wrap {
        height: 473px!important
    }
}

@media(min-width: 1679px) {
    .ps.pccb .bl {
        min-height:316px;
        background-color: #1c1d2f
    }
}

@media(min-width: 1912px) {
    .ps.pccb .bl {
        min-height:366px;
        background-color: #1c1d2f
    }
}

.publisher .name-card .avatar {
    left: 0;
    margin-top: 0!important
}

.publisher .name-card .status-label {
    display: none
}

app-dn-comments app-dn-comment .content .body img {
    position: relative;
    margin-right: .2em;
    margin-bottom: .2em;
    max-width: 80px;
    vertical-align: bottom
}

app-dn-comments app-dn-comment .content .body.activityStyle {
    overflow-wrap: anywhere;
    display: block
}

app-comment-box .comment-box .comment-input img {
    position: relative;
    top: -2px;
    max-width: 90px;
    max-height: 90px;
    margin-right: .2em;
    margin-bottom: .2em
}

.no-content {
    color: #ffffffb3
}

:host-context(.light) .no-content {
    color: #888
}

.light app-comment-box .comment-box .comment-input:active,.light app-comment-box .comment-box .comment-input:focus {
    color: #000!important
}

app-message-display .content .body .body.d-inline img,app-message-display .content .replied-body img {
    position: relative;
    top: 12px;
    margin-top: -15px;
    margin-right: .2em;
    margin-bottom: .2em;
    max-width: 80px
}

.emoji-box {
    z-index: 9
}

.emoji-box .ps-content {
    display: flex;
    flex-wrap: wrap
}

.leftUnlocksToday {
    margin-top: 1.5em;
    text-align: center
}

@media(max-width: 1678px) {
    .left-btn.bg-none {
        width:110px!important;
        margin-left: 10px!important
    }
}

@media(any-hover: hover) {
    .list .v-c:hover .teaser-detail {
        bottom:65px!important
    }
}

.light .backToOld a {
    color: #fff
}

.light .backToOld a:hover {
    color: #00c0ff!important
}

.light .navbg .backToOld a {
    color: #888!important
}

.control-item.config .setting-icon.guide {
    position: relative;
    z-index: 5002
}

app-confirm-dialog .otherAvatar {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    overflow: hidden;
    margin: -60px auto 0!important
}

app-confirm-dialog .otherAvatar img {
    width: 100%;
    height: 100%
}

app-confirm-dialog .otherDetail {
    font-size: 14px;
    margin-top: 5px;
    margin-bottom: 20px
}

app-confirm-dialog .otherDetail .otherNickname {
    color: #fff
}

.light app-confirm-dialog .otherDetail .otherNickname {
    color: #333
}

app-confirm-dialog .otherDetail .otherAccount {
    color: #fff6
}

.light app-confirm-dialog .otherDetail .otherAccount {
    color: #888
}

.vertical.selfScroll {
    overflow-x: hidden!important
}

.float-player .dn-videoplayer-wrap .overlay-logo {
    display: none
}

.float-player .dn-videoplayer-wrap vg-play-pause:hover .iconfont {
    color: #fff!important
}

.float-player .dn-videoplayer-wrap .iconfont {
    color: #fff!important;
    text-shadow: 0 0 10px #666666bf
}

.float-player .dn-videoplayer-wrap .iconfont:hover {
    color: #fff!important
}

.float-player .dn-videoplayer-wrap .iconzanting:before {
    font-size: 24px;
    content: ""
}

.float-player .dn-videoplayer-wrap .iconbofang:before {
    font-size: 24px;
    content: ""
}

.float-player .dn-videoplayer-wrap .iconbofang:after,.float-player .dn-videoplayer-wrap .iconguanbi:after,.float-player .dn-videoplayer-wrap .iconzanting:after {
    content: "";
    width: 36px;
    height: 36px;
    display: block;
    position: absolute;
    left: 4px;
    top: 23px;
    border-radius: 50%;
    z-index: -1
}

.float-player .dn-videoplayer-wrap .iconguanbi:after {
    width: 29px;
    height: 29px;
    left: 0;
    top: -2px
}

.float-player .dn-videoplayer-wrap dn-videoplayer {
    width: 500px!important;
    height: 282px!important
}

.float-player .dn-videoplayer-wrap .video-box {
    height: 282px!important
}

.float-player .dn-videoplayer-wrap .publicbox .control-list {
    margin-top: 0!important;
    margin-right: 0!important;
    top: 1em!important;
    left: 50%;
    transform: translate(-50%);
    position: absolute
}

.float-player .dn-videoplayer-wrap .caption.show {
    right: unset!important;
    top: 1em!important;
    left: 50%;
    transform: translate(-50%)
}

.float-player .dn-videoplayer-wrap .control-left .play-next,.float-player .dn-videoplayer-wrap .control-left .timeline,.float-player .dn-videoplayer-wrap .control-left button,.float-player .dn-videoplayer-wrap .control-left vg-airplay,.float-player .dn-videoplayer-wrap .controll-right .control-item.config,.float-player .dn-videoplayer-wrap .controll-right vg-fullscreen,.float-player .dn-videoplayer-wrap .controll-right vg-mute,.float-player .dn-videoplayer-wrap .controll-right vg-playback-button,.float-player .dn-videoplayer-wrap .controll-right vg-quality-selector,.float-player .dn-videoplayer-wrap .vv-state.iconbofang,.float-player .dn-videoplayer-wrap vg-scrub-bar {
    display: none
}

.float-player .dn-videoplayer-wrap vg-pause-d .vg-learn-more {
    zoom:.7}

.floating-player-controls {
    cursor: move
}

.light app-tab .tab.vip-tab,.light app-tab .tab.vip-tab.active,.light app-tab .tab.vip-tab:hover {
    color: #982c18!important
}

.light app-recharge-box .top.disabled:after {
    background-color: #f8f8f8cc
}

.light app-recharge-box .payment-tab.disabled:after,.light app-recharge-box .product.disabled:after,.light app-recharge-container .payment-tab.disabled:after,.light app-recharge-container .product.disabled:after {
    background-color: #fffc
}

image-cropper .overlay {
    display: none
}

.short-video-page .video-box,.short-video-page .video-container {
    height: 100%!important
}

.short-video-page .player-title-bar {
    display: none!important
}

.short-video-page .control-item.config,.short-video-page .timeline,.short-video-page vg-playback-button,.short-video-page vg-player button {
    display: none
}

#confirm-dialog h5 {
    margin-bottom: 15px
}

.text-main-color {
    color: #00c0ff!important
}

.s-m-height video-publisher .publisher {
    height: 72px
}

app-danmu-input app-danmu-filter .tabs .tab {
    color: #fff6!important
}

app-danmu-input app-danmu-filter .tabs .tab.active,app-danmu-input app-danmu-filter .tabs .tab:hover {
    color: #00c0ff!important
}

app-danmu-input .user-filter .iconfont {
    font-size: 22px
}

.keepOneLine {
    white-space: nowrap;
    overflow: hidden
}

@media(any-hover: hover) {
    .v-c:hover.new {
        overflow:unset
    }

    .v-c:hover .teaser-detail {
        bottom: 52px
    }

    .v-c:hover .teaser-detail.new {
        bottom: 0;
        opacity: 1;
        z-index: 110;
        height: 396px;
        width: 270px;
        top: -18px;
        left: -27px
    }

    .v-c:hover .teaser-cover {
        transition: .2s;
        opacity: 1;
        z-index: 0
    }

    .v-c:hover .video-teaser .title-box a {
        color: #fff!important
    }

    .light .v-c:hover .video-teaser .title-box a {
        color: #00c0ff!important
    }
}

@media(max-width: 1439px) and (any-hover:hover) {
    .v-c:hover .teaser-detail.new {
        height:382px;
        width: 261px
    }
}

@media(min-width: 1440px) and (max-width:1678px) and (any-hover:hover) {
    .v-c:hover .teaser-detail.new {
        height:382px;
        width: 261px
    }
}

@media(min-width: 1679px) and (max-width:1911px) and (any-hover:hover) {
    .v-c:hover .teaser-detail.new {
        height:396px;
        width: 270px
    }
}

.amcharts-pie-tick {
    stroke-opacity: .3;
    stroke: #fff
}

.light .amcharts-pie-tick {
    stroke-opacity: .3;
    stroke: #000
}

.light .video-teaser .title-box,.light app-classified-top-videos .title-box {
    background-color: #fff!important
}

.light .s-page app-classified-top-videos .title-box,.light .s-page app-video-teaser .title-box {
    background-color: #f8f8f8!important
}

.light .s-page .news-item .title-box {
    background-color: #fafafa!important
}

.news-item .view-count {
    left: auto!important;
    right: 7px
}

app-message-dialog .dl-tips {
    padding: 0 50px
}

app-message-dialog .dl-tips-title {
    margin-bottom: 15px
}

app-message-dialog .dl-tips-content {
    line-height: 25px
}

app-album .album-container .album-comment-container app-dn-comments app-dn-comment .replyholder app-comment-box .comment-box {
    background-color: #2b2c3a
}

.light app-album .album-container .album-comment-container app-dn-comments app-dn-comment .replyholder app-comment-box .comment-box {
    background-color: #fff
}

.bullet {
    -webkit-user-select: none;
    user-select: none;
    position: absolute;
    white-space: pre;
    pointer-events: auto;
    perspective: 500px;
    will-change: transform;
    display: inline-block;
    align-items: center;
    color: #fff;
    font-weight: 400;
    line-height: 1.125;
    height: 40px;
    line-height: 40px
}

.bullet,.bullet.hovered {
    z-index: 500
}

.bullet.hide {
    opacity: 0
}

.bullet.block {
    display: none!important
}

.bullet .inner {
    position: relative;
    display: flex;
    align-items: center
}

.bullet.transparent {
    opacity: 0!important
}

.bullet.show-menu {
    z-index: 9999
}

.context-menu {
    z-index: 9999999;
    font-family: -apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Arial,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;
    font-size: 14px;
    min-width: 160px;
    position: absolute;
    left: 0;
    color: #fff;
    background-color: #1c1c1ce6;
    text-shadow: 0 0 2px #00000080;
    border-radius: 8px;
    padding: 0 5px;
    height: 42px;
    top: 0;
    font-size: 22px
}

.context-menu .danmu-content {
    padding: 0 5px;
    max-width: 500px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.context-menu .gap-line {
    margin: 0 4px;
    height: 16px;
    border-right: 1px solid;
    border-color: #d0d0d0
}

.context-menu .user {
    padding: 0 5px;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 16px;
    color: #ffffffb3
}

.context-menu .actions {
    min-width: 50px;
    padding: 0 5px;
    white-space: nowrap;
    display: flex;
    align-items: center
}

.context-menu .action-btn {
    display: flex;
    align-items: center;
    font-size: 16px;
    margin-right: 15px;
    cursor: pointer
}

.context-menu .action-btn:last-child {
    margin-right: 0
}

.context-menu .action-btn .iconfont {
    font-size: 26px
}

.context-menu .action-btn .action-text {
    height: 40px;
    line-height: 42px
}

.context-menu .action-btn.active,.context-menu .action-btn:hover {
    color: #00c0ff
}

.context-menu button {
    color: #ddd;
    background-color: #222;
    border-radius: 2px;
    cursor: pointer;
    height: 24px;
    line-height: 23px;
    padding: 0 5px;
    border: 1px solid #ddd;
    font-family: SimHei,Microsoft JhengHei,Arial,Helvetica,sans-serif
}

.context-menu button:hover {
    color: #fff;
    border: 1px solid #fff
}

.light .you-chat-sidebar.stickyStyle {
    border-color: #0000000d!important
}

.light .you-chat-sidebar.stickyStyle .you-chat-sidebar-controls.stickyStyle {
    background-color: #fff!important;
    border-color: #0000000d!important
}

.light .you-chat-content-controls.stickyStyle {
    border-color: #0000000d!important
}

.light .contact.stickyStyle.active,.light .contact.stickyStyle:hover {
    background-color: #0000000d!important
}

.light .you-chat-input-containter.stickyStyle {
    border-color: #0000000d!important
}

.light .you-chat-message__text.stickyStyle {
    background: #f2f2f2
}

.light .you-chat-message__text.stickyStyle:after {
    border-color: #0000 #f2f2f2 #0000 #0000
}

.light .you-chat-message__image.stickyStyle {
    background: #f2f2f2
}

.light .you-chat-message__image.stickyStyle:after {
    border-color: #0000 #f2f2f2 #0000 #0000
}

.logo-icon {
    background: url() no-repeat 50%;
    background-size: contain;
    width: 24px;
    height: 24px;
    margin-right: 1.2em
}

.input-box {
    width: 100%;
    height: 46px;
    border-radius: 2px;
    background-color: #373843;
    margin: 15px 0 10px;
    padding: 10px 14px;
    font-size: 14px;
    color: #fff;
    outline: none!important;
    border: none!important
}

:host-context(.light) .input-box {
    background-color: #eee
}

:host-context(.light) .input-box {
    color: #333
}

.input-box.sm {
    height: 20px;
    width: auto;
    font-size: 12px;
    margin: 0;
    padding: 5px 7px
}

html app-activity-detail app-danmu-input .type-selector-inner .option:nth-child(2) .item-image:after,html app-activity-detail app-danmu-input .type-selector-inner .option:nth-child(3) .item-image:after {
    top: -11px!important
}

html app-activity-detail app-danmu-input .color-selector-inner .color.vip-right:before {
    top: -16px!important
}

html app-activity-detail app-danmu-input .slider-label span:after {
    top: -3px!important
}

.dn-slider {
    min-height: 666px
}

@media(max-width: 1439px) {
    .dn-slider {
        min-height:474px
    }
}

@media(min-width: 1440px) and (max-width:1678px) {
    .dn-slider {
        min-height:539px
    }
}

.studio-page-container {
    display: flex;
    justify-content: center;
    align-items: center
}

.studio-page-container app-svideo,.studio-page-container app-video {
    width: 100%
}

body.bg {
    top: 0!important
}

#google_translate_element {
    overflow: hidden;
    border-width: 1px;
    border-radius: .25rem;
    background: #fff;
    position: fixed;
    z-index: 9999;
    top: 18px;
    left: 50px
}

.goog-te-gadget {
    font-size: 0!important
}

.goog-te-combo {
    margin-top: 0!important;
    padding-top: 0!important;
    font-size: .75rem!important;
    line-height: 1rem!important;
    outline: 2px solid #0000!important;
    outline-offset: 2px!important
}

.goog-logo-link,.goog-te-banner-frame {
    display: none!important
}

.goog-te-banner-frame {
    visibility: hidden!important;
    height: 0!important;
    position: relative!important;
    width: 0!important;
    z-index: -100!important;
    border: none!important;
    box-shadow: none!important
}

.goog-te-gadget .goog-te-combo {
    font-size: .75rem!important;
    line-height: 1rem!important;
    margin: 0!important;
    outline: .125rem solid #0000!important;
    outline-offset: .125rem!important;
    padding: .25rem!important
}

#goog-gt-tt {
    display: none!important;
    visibility: hidden!important;
    z-index: -100!important
}

.goog-text-highlight {
    background-color: initial!important;
    box-shadow: none!important;
    box-sizing: unset!important
}

vg-controls[hidden] {
    visibility: hidden
}

app-qna .qa>.a a {
    cursor: pointer
}

app-qna .qa>.a img {
    width: auto
}

.light app-recommended-news .nav-shadow-cover.last,.light app-recommended-news .nav-shadow-cover.next {
    background: unset
}

.light app-watch app-video-info .video-detail h4.d-inline {
    color: #fff
}

.light app-watch app-video-info .video-detail .intro,.light app-watch app-video-info .video-detail .linear .iconjiantou_liebiaozhankai,.light app-watch app-video-info .video-detail .linear .iconxiangqing,.light app-watch app-video-info .video-detail .linear span {
    color: #ffffffb3!important
}

.light app-watch app-video-info .video-detail .intro .info-label {
    color: #ffffffb3
}

.light app-watch app-sidebar-related-videos app-block-title h3.block-title {
    color: #fff
}

.light app-watch app-sidebar-related-videos app-video-teaser-rec .video-compact .title {
    color: #fff!important
}

.light app-watch app-sidebar-related-videos app-video-teaser-rec .publisher .nickName,.light app-watch app-sidebar-related-videos app-video-teaser-rec .video-compact .published {
    color: #fff6!important
}

.light app-watch #commentsArea .mb-4 h4.comments-title,.light app-watch #commentsArea .mb-4 span {
    color: #fff
}

.light app-watch app-comment-box .comment-box-mask-layer {
    background-color: #090b21b3!important
}

.light app-watch app-comment-box .comment-box-mask-layer .comment-prompt {
    color: #ffffffb3!important
}

.light app-watch app-comment-box .comment-box {
    background-color: #1c1d2f!important;
    color: #ffffffb3!important
}

.light app-watch app-comment-box .comment-box .comment-input,.light app-watch app-comment-box .comment-box [contenteditable=true]:empty:before {
    color: #fff6!important
}

.light app-watch app-comment-box .comment-box .comment-input:active,.light app-watch app-comment-box .comment-box .comment-input:focus {
    color: #fff!important
}

.light app-watch app-comment-box .comment-box .dn-button.dn-button-red {
    background-color: #00c0ff!important
}

.light app-watch app-dn-comments {
    color: #fff
}

.light app-watch app-dn-comment .body,.light app-watch app-dn-comment .icongengduo {
    color: #ffffffb3!important
}

.light app-watch app-dn-comment .shortcut-menu {
    background-color: #090b21!important
}

.light app-watch app-dn-comment .shortcut-menu .hover-red {
    color: #fff!important
}

.light app-watch app-dn-comment .shortcut-menu .hover-red:hover {
    color: #00c0ff!important
}

.light app-watch app-dn-comment .comment:not(.last) {
    border-bottom-color: #4d4d4d33!important
}

image-cropper img.source-image {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
    cursor: grab
}

.disable-hover {
    pointer-events: none
}

.video-module {
    min-height: 1500px
}

app-bargain-event #webmasterSvgaCanvas canvas {
    position: relative;
    top: -27px
}

.new-svideo-container:not(.sp):not(.rl) {
    width: 437px;
    margin-right: 5px
}

.nav-shadow-cover,.new-svideo-container:not(.sp):not(.rl) .poster {
    width: 437px;
    height: 245.8125px
}

.nav-btn {
    height: 245.8125px
}

@media(max-width: 1678px) {
    .new-svideo-container:not(.sp):not(.rl) {
        width:420px
    }

    .nav-shadow-cover,.new-svideo-container:not(.sp):not(.rl) .poster {
        width: 420px;
        height: 236.25px
    }

    .nav-btn {
        height: 236.25px
    }
}

.new-svideo-container.sp {
    width: 437px
}

.new-svideo-container.sp .poster {
    width: 437px;
    height: 245.8125px
}

@media(min-width: 1679px) and (max-width:1911px) {
    .new-svideo-container.sp {
        width:380px
    }

    .new-svideo-container.sp .poster {
        width: 380px;
        height: 213.75px
    }
}

@media(max-width: 1678px) {
    .new-svideo-container.sp {
        width:312px
    }

    .new-svideo-container.sp .poster {
        width: 312px;
        height: 175.5px
    }
}

.new-svideo-container.rl {
    width: 290px
}

.new-svideo-container.rl .poster {
    width: 290px;
    height: 163.125px
}

.flex-place-holder.rl {
    width: 290px
}

@media(min-width: 1679px) and (max-width:1911px) {
    .new-svideo-container.rl {
        width:303px
    }

    .new-svideo-container.rl .poster {
        width: 303px;
        height: 170.4375px
    }

    .flex-place-holder.rl {
        width: 303px
    }
}

@media(max-width: 1678px) {
    .new-svideo-container.rl {
        width:312px
    }

    .new-svideo-container.rl .poster {
        width: 312px;
        height: 175.5px
    }

    .flex-place-holder.rl {
        width: 312px
    }
}

app-live-chat .live-chat-message img {
    vertical-align: middle;
    height: 28px
}

.dammu-bullet .bullet-context img {
    height: 40px
}
.slash {
    padding: 0 7px
}
.slash:last-child {
    display: none
}

@media (min-width: 1902px){
  .d-flex.align-items-start.mb-4.v-place.no-bg{
    width: calc(100% - 300px);
  }
}
body{
  color: white !important;
}