:root {
    --bg: #131a20;
    --bg-lighter: #212933;
    --bg-lightest: #131a2078;
    --bg-header: #212933;
    --bg-footer: #212933;
    --bg-alphabet: #212933;
    --tt: #a5bbdc;
    --tt-darker: #aaa;
    --gradient-accent: linear-gradient(#9b59b6, #9b59b6);
    --gradient-poster: linear-gradient(180deg,#0000 0,#1c262f 100%);
    --gradient-episode: linear-gradient(to right, #73478a, #73478a82);
    --accent: #74478a;
    --accent-darker: #131a20;
    --accent-lighter: #1d232c;
    --ui-bg: #222;
    --ui-bg-darker: #111;
    --ui-bg-darkest: #000;
    --ui-bg-accent: #111;
    --ui-text-color-on-accent: #fff;
    --ui-bdc: #111;
    --indent-negative: -20px;
    --indent: 20px;
    --max-width: 1210px
}

@media screen and (max-width: 1220px) {
    :root {
        --indent-negative: -20px;
        --indent: 20px
    }
}

* {
    background: 0 0;
    margin: 0;
    padding: 0;
    outline: none;
    border: 0;
    box-sizing: border-box
}

ol,ul {
    list-style: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

img,table,iframe,video,frame,embed,object {
    max-width: 100%
}

body {
    font-family: 'changa';
    /* font-size:12px; */
    line-height: 1.42857143;
    padding: 0;
    margin: 0;
    color: #d9cfcf;
    background-color: var(--bg);
    min-height: 100%;
    width: 100%;
    font-weight: 400;
    overflow-x: hidden
}

a {
    color: var(--tt);
    text-decoration: none
}

a:hover,a:focus {
    color: var(--tt-darker);
    text-decoration: none
}

h1,h2,h3,h4,h5 {
    font-weight: 600;
    font-size: 20px
}

::selection {
}

b,strong,.bolder {
    font-weight: 600
}

button,select,textarea,input[type=text],input[type=password],input[type=button],input[type=submit] {
    appearance: none;
    -webkit-appearance: none;
    font-size: 16px;
    font-family: inherit
}

button,.btn,input[type=button],input[type=reset],input[type=submit],.form__btn,.qq-upload-button,.pm__links a,.usp__btn a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-align: center;
    padding: 0 20px;
    height: 40px;
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    background-color: var(--accent);
    color: #fff;
    box-shadow: none;
    border-radius: 20px
}

button:hover,.btn:hover,input[type=button]:hover,input[type=reset]:hover,input[type=submit]:hover,.form__btn:hover,.qq-upload-button:hover,.pm__links a:hover,.usp__btn a:hover {
    background-color: var(--accent-darker);
    color: #fff;
    border-color: var(--accent-darker)
}

button:active,input[type=button]:active,input[type=submit]:active {
    box-shadow: inset 0 1px 4px 0 rgba(0,0,0,.1)
}

.color-btn,[class*=fr],[class*=plyr],[class*=owl-],[id*=mceu] {
    padding: 0;
    margin: 0;
    line-height: normal;
    border: 0;
    box-shadow: none;
    background: 0 0;
    border-radius: 0
}

input[type=text],input[type=password] {
    height: 42px;
    line-height: 42px;
    border-radius: 0;
    padding: 0 15px
}

select {
    height: 40px;
    padding: 0 15px;
    display: block
}

select:not([multiple]) {
    background-image: url(../dleimages/chevron.svg);
    padding-right: 30px;
    background-repeat: no-repeat;
    background-position: right 15px top 50%;
    background-size: .6em auto
}

select option {
    padding: 6px 10px
}

select[multiple] {
    padding: 0 5px
}

textarea {
    padding: 15px;
    overflow: auto;
    vertical-align: top;
    resize: vertical
}

input[type=text],input[type=password],select,textarea {
    width: 100%;
    background-color: #2c3a46;
    color: #fff;
    box-shadow: inset 0 0 0 1px var(--bdc),inset 0 0 0 1px var(--bdc-lighter)
}

input[type=text]:focus,input[type=password]:focus,textarea:focus {
    box-shadow: inset 0 0 0 1px var(--accent)
}

input::placeholder,textarea::placeholder {
    color: #fff;
    opacity: .6;
    font-size: 14px
}

input:focus::placeholder,textarea:focus::placeholder {
    color: transparent
}

.img-box,.img-wide,.img-responsive,.img-fit-cover {
    overflow: hidden;
    position: relative
}

.img-responsive {
    padding-top: 60%
}

.img-responsive--portrait {
    padding-top: 150%
}

.img-box>img,.img-responsive>img {
    width: 100%;
    min-height: 100%;
    display: block
}

.img-responsive>img {
    position: absolute;
    left: 0;
    top: 0
}

.img-wide img,.img-wide>a {
    width: 100%;
    display: block
}

.img-fit-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.clr {
    clear: both
}

.clearfix::after {
    content: "";
    display: table;
    clear: both
}

.ws-nowrap {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.line-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.vw100 {
    margin: 0 calc((100% - 100vw)/2);
    padding: 0 calc((100vw - 100%)/2)
}

.img-mask::before {
    content: '';
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    height: 60%;
    background: linear-gradient(to top,#000 0%,transparent 100%);
    opacity: .8
}

.d-flex,.fx-row {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row
}

.fd-column,.fx-col {
    flex-direction: column;
    flex-wrap: nowrap
}

.jc-space-between,.fx-row {
    justify-content: space-between
}

.jc-flex-start,.fx-start {
    justify-content: flex-start
}

.jc-center,.fx-center {
    justify-content: center
}

.jc-flex-end {
    justify-content: flex-end
}

.ai-flex-start {
    align-items: flex-start
}

.ai-center,.fx-middle {
    align-items: center
}

.ai-flex-end {
    align-items: flex-end
}

.order-first {
    order: -1
}

.order-last {
    order: 10
}

.flex-grow-1,.fx-1,.stretch-free-width {
    flex: 1 1 0;
    max-width: 100%;
    min-width: 50px
}

.btn-icon,.centered-content {
    display: inline-flex;
    justify-content: center;
    align-items: center
}

.icon-at-left [class*=fa-],.icon-left .icon {
    margin-right: .5em
}

.icon-at-right [class*=fa-],.icon-right .icon {
    margin-left: .5em
}

.hidden,#dofullsearch,.form__header .form__btn,.comment-item__main .quote+br,.d-none {
    display: none
}

.anim,button,.btn,a,a img,.side-block__tabs div {
    transition: all .3s
}

.d-grid,.items-list,#dle-content {
    display: grid;
    gap: 10px 15px;
    grid-template-columns: repeat(auto-fill,minmax(140px,1fr))
}

.ff-arial {
    font-family: arial
}

.items-list>*:not(.grid-item),#dle-content,#dle-content>*:not(.grid-item) {
    grid-column: 1/-1
}

.items-list--category {
    gap: 10px
}

.items-list--category {
    --gradient-poster: linear-gradient(180deg,#0000 0,#212933 100%)
}

@font-face {
    font-family: changa;
    src: url(../webfonts/changa-400.woff2) format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: changa;
    src: url(../webfonts/changa-600.woff2) format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap
}
