.wrapper {
    min-width: 320px;
    position: relative
}

.wrapper-container {
    max-width: var(--max-width);
    margin: 0 auto;
    position: relative;
    z-index: 20
}

.wrapper-main {
    padding: 0 var(--indent);
    min-height: 100vh;
    display: flex;
    flex-direction: column
}

.content {
    flex: 1 0 auto;
    padding: 30px 0
}

.header,
.nav {
    background-color: var(--bg-lighter);
    box-shadow: var(--bsh);
    padding-top: 15px;
    padding-bottom: 15px
}

.header {
    gap: 20px 20px
}

.nav {
    border-top: 1px solid var(--bdc);
    position: relative;
    z-index: 60
}

.cols {
    display: grid;
    gap: 30px 30px;
    grid-template-columns: 260px minmax(0, 1fr) 260px
}

.col-side {
    display: grid;
    gap: 30px;
    align-content: start;
    position: relative;
    z-index: 49
}

.footer {
    background-color: var(--bg-darker);
    color: var(--tt-lighter);
    padding-top: 30px;
    padding-bottom: 30px;
    font-size: 14px;
    line-height: 1.6
}

.footer__copyright {
    display: flex;
    align-items: center
}

.content-block--bg {
    background-color: var(--bg-lighter);
    border-radius: 10px;
    padding: 0px
}

#scrolltop {
    position: fixed;
    width: 60px;
    height: 60px;
    line-height: 60px;
    right: 10px;
    bottom: 10px;
    z-index: 990;
    display: none;
    background-color: var(--bg-lighter);
    color: var(--tt-lightest);
    cursor: pointer;
    font-size: 24px;
    border-radius: 50%;
    text-align: center;
    box-shadow: var(--bsh)
}

.logo {
    display: inline-flex;
    align-items: center;
    height: 42px;
    position: relative;
    font-weight: 700;
    font-size: 28px;
    letter-spacing: 1px;
    padding-left: 40px;
    margin-right: 40px;
    background: var(--logo) 0 6px/30px no-repeat;
    color: var(--tt) !important
}

.logo span {
    font-weight: 400;
    font-size: 10px;
    text-transform: uppercase;
    color: var(--tt-lightest);
    position: absolute;
    right: -10px;
    top: 0
}

.search-block form {
    max-width: 400px;
    position: relative
}

.search-block__input[type=text],
.search-block__input[type=text]:focus {
    border-radius: 20px;
    box-shadow: none;
    border: 1px solid var(--bdc);
    background-color: var(--bg-lighter);
    height: 40px;
    line-height: 38px;
    padding: 0 50px 0 20px
}

.search-block__input[type=text]:not(:focus):placeholder {
    color: var(--tt-lightest);
    opacity: 1;
    font-size: 14px
}

.search-block__btn {
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    background: 0 0;
    color: var(--tt);
    border-radius: 20px;
    padding: 0;
    font-size: 16px
}

.nav__list {
    margin: 0 -40px
}

.col-side .side-nav li {
    margin-bottom: 10px;
    border-radius: 10px;
}

#navigation>ul>li {
    background-color: var(--nav);
    margin-bottom: 10px;
    border-radius: 10px;
}

#navigation>ul>li>a {
    padding: 30px 20px !important;
}

.nav__list>li,
.side-nav>li {
    flex-grow: 1;
    font-size: 14px;
    position: relative;
}

.nav__list>li+li {
    border-left: 1px solid var(--bdc)
}

.nav__list>li>a,
.side-nav>li>a {
    height: 40px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px
}

.nav__list-hidden {
    font-size: 16px;
    width: 100%;
    padding: 20px;
    border-radius: 0 0 10px 10px;
    position: absolute;
    margin-left: -10px !important;
    left: 0;
    top: 100%;
    background-color: var(--bg-lighter);
    box-shadow: var(--bsh-2);
    display: grid;
    gap: 10px;
    visibility: hidden;
    opacity: 0;
    transform: translateY(40px);
    z-index: 61
}

.nav-big .nav__list-hidden {
    padding: 40px
}

.submenu>a::after {
    content: "\f107";
    font-weight: 300;
    font-family: 'Font Awesome 5 Pro';
    margin-left: 7px;
    display: inline-block
}

.side-nav {
    border-radius: 6px;
    /* padding: 20px 0;
    background-color: var(--bg-lighter) */
}

.side-nav .nav__list-hidden {
    left: 100%;
    top: -40px;
    border-radius: 10px
}

.side-nav>li>a {
    justify-content: flex-start
}

.top {
    gap: 15px 15px;
    margin-bottom: 30px
}

.top-item {
    flex: 1 1 30%;
    box-shadow: var(--bsh);
    border-radius: 6px;
    padding: 0;
    min-height: 300px;
}

.top-item__desc {
    position: relative;
    z-index: 5;
    min-height: 140px;
    padding: 20px;
    color: #fff;
    gap: 10px;
    max-width: 100%
}

.top-item__title {
    font-weight: 600;
    color: #fff !important;
    font-size: 15px
}

.top-item__date {
    font-size: 12px
}

.top-item::before {
    height: 100%;
    background: var(--gradient);
    opacity: .6
}

@media screen and (max-width:1219px) {
    .top {
        display: grid;
        grid-template-columns: repeat(2, 1fr)
    }

    .top-item {
        min-height: 200px;
    }

    .top-item:nth-child(3),
    .top-item:nth-child(4),
    .top-item:nth-child(5) {
        display: none;
    }

    .top-item {
        grid-column: span 1
    }

    .top-item__desc {
        height: 100%
    }
}

@media screen and (min-width:1220px) {
    .top {
        display: grid;
        grid-template-columns: repeat(5, 1fr)
    }

    .top-item {
        grid-column: span 1
    }

    .top-item__desc {
        height: 100%
    }
}

.sect__header {
    margin-bottom: 35px
}

.sect__sort {
    height: 36px
}

.sect__sort ul {
    height: 36px;
    background-color: var(--bg-lighter);
    border-radius: 6px;
    position: relative;
    z-index: 10;
    cursor: pointer;
    text-align: center
}

.sect__sort ul li {
    height: 36px;
    line-height: 36px;
    visibility: hidden;
    display: none;
    padding: 0 10px;
    font-size: 13px
}

.sect__sort ul li[class],
.sect__sort ul:hover li {
    visibility: visible;
    display: block;
}

.sect__sort ul:hover {
    height: auto;
    box-shadow: var(--bsh)
}

.sect__sort ul li[class]::before {
    content: 'Сортировать по:';
    margin-right: 6px
}

.sect__sort li.asc a::after,
.sect__sort li.desc a::after {
    content: "\f063";
    font-family: "Font Awesome 5 Pro";
    display: inline-block;
    margin-left: 6px;
    font-weight: 300;
    font-size: 10px
}

.sect__sort li.desc a::after {
    content: "\f062"
}

.speedbar {
    margin-bottom: 15px;
    font-size: 13px;
    color: var(--tt-lightest)
}

.descr {
    display: grid;
    grid-gap: 20px;
    line-height: 1.7;
    color: var(--tt-lighter);
    grid-column: 1/-1;
    padding: 20px 0
}

.descr h1,
.descr h2,
.descr h3 {
    font-weight: 400;
    font-size: 18px;
    color: var(--tt);
    line-height: 1.3
}

.descr a {
    text-decoration: underline;
    color: var(--accent)
}

.descr ul li {
    position: relative;
    padding-left: 25px;
    margin-left: 25px
}

.descr ul li::before {
    content: "\f00c";
    font-weight: 300;
    font-family: 'Font Awesome 5 Pro';
    color: var(--accent);
    position: absolute;
    left: 0;
    top: 0
}

.full__poster {
    padding: 30px;
}

.full__poster img {
    border-radius: 10px;
    margin-bottom: 40px;
}

.full-text h2:first-child {
    margin-top: 0px;
}

.full__img-desc {
    text-align: center;
    font-size: 12px;
    padding-top: 5px;
    padding-left: 12px;
    padding-right: 12px;
    color: #b9b9b9;
}

.full__gallery .xfieldimagegallery li:nth-child(1),
.full__gallery .xfieldimagegallery li:nth-child(2),
.full__gallery .xfieldimagegallery li:nth-child(3) {
    opacity: 0.9;
}

.full__gallery .xfieldimagegallery li:nth-child(4) {
    opacity: 0.8;
}

.full__gallery .xfieldimagegallery li:nth-child(5) {
    opacity: 0.7;
}

.full__gallery .xfieldimagegallery li:nth-child(6) {
    opacity: 0.6;
}

.full__gallery .xfieldimagegallery li:nth-child(7) {
    opacity: 0.4;
}

.full__gallery .xfieldimagegallery li:nth-child(8) {
    opacity: 0.2;
}

.full__gallery .xfieldimagegallery li:nth-child(9),
.full__gallery .xfieldimagegallery li:nth-child(10),
.full__gallery .xfieldimagegallery li:nth-child(11),
.full__gallery .xfieldimagegallery li:nth-child(12),
.full__gallery .xfieldimagegallery li:nth-child(13),
.full__gallery .xfieldimagegallery li:nth-child(14),
.full__gallery .xfieldimagegallery li:nth-child(15),
.full__gallery .xfieldimagegallery li:nth-child(16) {
    display: none;
}

.full__gallery .xfieldimagegallery li {
    transition: 0.3s;
}

.full__gallery .xfieldimagegallery li:hover {
    transform: scale(1.1);
    transition: 0.3s;
}

.full__gallery p {
    color: var(--tt-lighter);
}

.full__gallery {
    padding: 30px;
    padding-top: 0px;
    padding-bottom: 0px;
    display: flex;
    flex-direction: row;
}

.full__gallery-left {
    padding-right: 30px;
}

.full__gallery-right {
    max-width: 73%;
}

.full__gallery .xfieldimagegallery {
    margin: 0px;
    flex-direction: column;
}

.full__gallery .xfieldimagegallery li img {
    border-radius: 10px;
    height: auto;
    min-width: 150px;
    width: 150px;
    border: none;
    margin: 0px;
    margin-bottom: 10px;
}

.short__h1 {
    font-size: 24px;
    font-weight: 700;
    text-align: justify;
}

.short {
    background-color: var(--bg-lighter);
    border-radius: 10px;
    overflow: hidden
}

.short__desc,
.short__header {
    padding: 30px;
    padding-top: 0px;
    color: var(--tt-lighter)
}

.short__title {
    font-size: 24px;
    font-weight: 700
}

.short__meta {
    gap: 10px 10px;
    font-size: 12px;
    color: var(--tt-lighter);
}

.short__meta-item a {
    color: var(--accent);
    text-decoration: underline
}

.short__meta .fal {
    margin-right: 6px;
    opacity: .6
}

.short__img {
    max-height: 500px;
    display: block
}

.short__text {
    color: var(--tt-lighter);
    line-height: 1.6;
    margin-bottom: 38px
}

.short.grid-item {
    position: relative;
    padding-bottom: 60px;
}

@media screen and (min-width:1221px) {
    .short.grid-item {
        overflow: visible;
    }
}


.short.grid-item .short__desc,
.short.grid-item .short__header {
    padding: 20px
}

.short.grid-item .short__header {
    padding-bottom: 0
}

.short.grid-item .short__title {
    font-size: 16px;
    text-align: justify;
}

.short.grid-item .short__img {
    height: 0
}

.short.grid-item .short__meta {
    gap: 10px 10px
}

.short.grid-item .short__text {
    -webkit-line-clamp: 8;
    font-size: 14px;
    margin: 0;
    text-align: justify;
}

.short__btn .fal {
    opacity: 1;
    font-size: 18px;
    margin: 0
}

.short__btn {
    padding: 0;
    width: 40px
}

.short__desc .short__meta {
    position: relative;
    left: 0;
    right: 0;
    bottom: 0;
    padding-top: 20px;
}

.side-block__title {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--bdc-darker)
}

.side-block__content {
    display: grid;
    gap: 15px;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr))
}

.side-block--sticky {
    position: sticky;
    left: 0;
    top: 20px
}

.popular {
    background-color: var(--nav);
    border-radius: 6px;
    overflow: hidden;
    position: relative
}

.popular__desc {
    padding: 16px 20px;
    padding-top: 14px
}

.popular__title {
    font-weight: 700
}

.popular__text {
    font-size: 13px;
    color: var(--tt-lighter);
    margin-top: 6px;
    -webkit-line-clamp: 4
}

.attent {
    text-align: center;
    position: relative;
    border-radius: 6px;
    padding: 20px;
    background-color: var(--nav);
}

.attent__title {
    font-weight: 700;
    margin: 20px 0
}

.attent .short__meta {
    margin: 0;
    margin-bottom: 20px
}

.attent__img {
    border-radius: 6px
}

.int {
    position: relative;
    gap: 20px;
    height: 60px
}

.int__img {
    width: 60px;
    height: 60px;
    box-shadow: var(--bsh);
    border-radius: 6px
}

.int__title div {
    -webkit-line-clamp: 3;
    font-size: 14px
}

.footer__text {
    color: var(--tt)
}

.footer__text a {
    margin: 0 20px 0 0;
    color: var(--accent)
}

.pagination {
    text-align: center;
    display: grid;
    gap: 20px;
    padding-top: 15px
}

.pagination__btn-loader a,
.pagination__btn-loader span {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    padding: 0 50px;
    border-radius: 30px;
    background: var(--bg-darker);
    color: var(--tt-lighter);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
    width: 400px;
    max-width: 100%
}

.pagination__pages {
    gap: 10px 10px
}

.pagination__pages a,
.pagination__pages span {
    display: inline-block;
    line-height: 38px;
    padding: 0 10px;
    min-width: 40px;
    font-size: 16px;
    border: 1px solid var(--bdc-darker);
    border-radius: 20px
}

.pagination__pages span:not(.nav_ext) {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent)
}

.page__tags {
    font-size: 0;
    gap: 10px 4px;
    margin-top: 40px
}

.page__tags .fal {
    height: 30px;
    line-height: 30px;
    font-size: 16px;
    margin-right: 6px
}

.page__tags a {
    display: flex;
    align-items: center;
    white-space: nowrap;
    height: 30px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 10px;
    text-transform: uppercase;
    color: var(--tt-lighter);
    border: 1px solid var(--tt-lighter)
}

.page__tags+.page__footer {
    margin-top: -10px
}

.page__footer {
    font-size: 14px;
    border-top: 1px solid var(--bdc);
    padding-top: 20px
}

.page__fav a {
    padding-left: 50px;
    position: relative;
    display: block;
    color: var(--tt-lightest);
    line-height: 1.3;
    font-size: 13px
}

.page__fav .fal {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bdc);
    border-radius: 50%;
    color: var(--accent);
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -20px
}

.page__btn-comments {
    height: 30px;
    padding: 0 10px;
    font-size: 11px;
    text-transform: uppercase;
    margin-left: 20px
}

.page__prev-next {
    background-color: var(--bg-2);
    width: 300px;
    padding: 20px;
    float: left;
    margin: 0 20px 10px 0;
    padding-bottom: 3px
}

.page__prev-next-link {
    line-height: 1.5;
    display: block;
    margin-bottom: 20px;
    font-weight: 300
}

.page__prev-next-link div {
    font-size: 12px;
    color: var(--tt-lightest);
    margin-bottom: 5px
}

.popular-item__img {
    width: 100px;
    height: 60px;
    margin-right: 20px
}

.popular-item__title {
    line-height: 1.4;
    -webkit-line-clamp: 3
}

.page__prev-next-link:hover,
.popular-item:hover {
    text-decoration: underline
}

.full-text {
    line-height: 1.7;
    font-size: 15px;
    word-wrap: break-word
}

.full-text a {
    text-decoration: underline;
    color: var(--accent)
}

.full-text h1,
.full-text h2,
.full-text h3,
.full-text h4,
.full-text h5,
.full-text img:not(.emoji),
.full-text table,
.full-text>ol,
.full-text>ul,
.page__title {
    margin-top: 30px
}

.full-text>.highslide img[style*=left],
.full-text>img[style*=left] {
    margin: 0 10px 10px 0
}

.full-text>.highslide img[style*=right],
.full-text>img[style*=right] {
    margin: 0 0 10px 10px
}

.full-text>ol li,
.full-text>ul li {
    padding-left: 60px;
    position: relative
}

.full-text>ul li:before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 3px solid var(--accent);
    position: absolute;
    top: 5px;
    left: 34px
}

.full-text>ol {
    counter-reset: num
}

.full-text>ol li:before {
    content: counter(num);
    counter-increment: num;
    background-color: var(--accent);
    color: #fff;
    position: absolute;
    top: -2px;
    left: 17px;
    width: 24px;
    height: 30px;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 6px;
    box-sizing: border-box
}

.full-text>ol li:after {
    content: '';
    border: 10px solid transparent;
    border-left-color: var(--accent);
    position: absolute;
    left: 41px;
    top: -2px;
    transform: scale(.66, 1.5);
    transform-origin: 0 0
}

.full-text>ol li+li,
.full-text>ul li+li {
    margin-top: 10px
}

.full-text table,
.video-inside>* {
    width: 100%
}

.full-text table tr td {
    padding: 10px;
    border: 2px solid #fff
}

.full-text table tr:nth-child(2n+1) {
    background-color: #f2f6f9
}

.full-text table tr:nth-child(1) {
    background-color: #cee0ed
}

.full-text table img:not(.emoji) {
    margin: 0;
    max-width: 350px
}

.full-text>:last-child {
    margin-bottom: 0
}

.video-responsive {
    padding-top: 60%;
    position: relative
}

.video-responsive>iframe,
.video-responsive>video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.full-text iframe {
    width: 100%;
    /* height: 400px; */
    margin-bottom: 20px
}

.fdl-btn {
    display: block;
    position: relative;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
    text-decoration: none !important;
    padding: 15px 15px 15px 130px;
    background: linear-gradient(to top, #27ae60, #2ecc71);
    border-radius: 10px;
    color: #fff !important;
    overflow: hidden
}

.fdl-btn-title {
    font-size: 26px;
    font-weight: 500;
    text-transform: uppercase;
    word-wrap: break-word
}

.fdl-btn-size {
    font-size: 14px;
    margin-top: -2px;
    margin-bottom: 6px;
    opacity: .9
}

.fdl-btn-caption {
    opacity: .7;
    font-size: 14px
}

.fdl-btn-dl {
    font-size: 12px;
    text-transform: uppercase;
    margin-left: 15px
}

.fdl-btn>* {
    position: relative;
    z-index: 3
}

.fdl-btn-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-top: -25px;
    font-size: 24px;
    position: absolute;
    left: 40px;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 15px rgba(0, 0, 0, .13), 0 0 0 30px rgba(0, 0, 0, .08), 0 0 0 45px rgba(0, 0, 0, .04)
}

.page__comments {
    margin: 0;
    margin-top: 30px;
    padding: 20px;
    border-radius: 10px;
    background: var(--bg-lighter)
}

.page__comments-title {
    font-size: 21px;
    font-weight: 700;
    margin-bottom: 20px
}

.page__comments-info {
    font-size: 14px;
    margin-bottom: 15px;
    margin-top: -15px;
    color: var(--tt-lighter);
    line-height: 1.5
}

.page__comments-info .fal {
    color: #eb4d4b;
    margin-right: 6px
}

.page__comments-header {
    position: relative;
    padding-right: 130px
}

.page__comments-btn {
    position: absolute;
    right: 0;
    top: 0
}

.ac-form {
    display: grid;
    gap: 20px;
    margin-bottom: 40px
}

.ac-form__bottom {
    gap: 10px 20px
}

.ac-form .message-info {
    margin: 0
}

.ac-form .tox-tinymce {
    height: 160px !important
}

.comments_subscribe+br {
    display: none
}

.mass_comments_action {
    display: flex;
    align-items: center;
    max-width: 800px;
    white-space: nowrap;
    margin-bottom: 20px
}

.mass_comments_action select {
    flex: 1 1 0;
    margin: 0 -8px 0 20px
}

.mass_comments_action .bbcodes {
    border-radius: 0;
    padding: 0 10px
}

.has-comms {
    margin-bottom: -20px
}

.comment-item__title {
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 20px
}

.comment-item {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--bdc)
}

.comment-item__img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-right: 10px
}

.comment-item__letter {
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    font-weight: 700;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
    color: #fff;
    font-size: 18px
}

.comment-item__author {
    font-weight: 600;
    font-size: 14px
}

.comment-item__date {
    color: var(--tt-lightest);
    margin-top: 4px;
    font-size: 12px
}

.comment-item__main {
    margin: 8px 0 6px 0;
    font-size: 15px
}

.comment-item__rating {
    white-space: nowrap;
    font-size: 14px
}

.comment-item__rating a {
    margin-left: 6px
}

.comment-item__rating a>span:first-child {
    color: #6ab04c;
    margin-right: 2px
}

.comment-item__rating a:last-child>span:first-child {
    color: #eb4d4b
}

.comment-item__reply a {
    font-size: 12px;
    margin-right: 20px;
    color: var(--tt-lightest)
}

.comment-item__reply a .fal {
    margin-left: 5px
}

.comment-item__reply+.comment-item__reply a .fal {
    margin-left: 0;
    margin-right: 5px
}

.comment-item__controls {
    text-align: right;
    font-size: 12px;
    margin-right: -15px
}

.comment-item__controls li {
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 10px;
    height: 16px;
    line-height: 16px
}

.comment-item__controls a:not(:hover) {
    color: var(--tt-lightest)
}

.comment-item__footer a:hover {
    text-decoration: underline
}

.comment-item__rating a:hover>span:first-child {
    text-decoration: none
}

.comment-item__controls .checkbox {
    transform: scale(.8, .8);
    margin-left: 5px
}

.login {
    position: fixed;
    z-index: 999;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    overflow: hidden;
    background-color: var(--ui-bg);
    border-radius: 10px;
    width: 400px
}

.login__header {
    padding: 40px 50px 10px 50px;
}

.login__title {
    font-size: 18px;
    font-weight: 600;
    padding: 1px 0;
    text-transform: capitalize
}

.login__close {
    cursor: pointer;
    font-size: 24px;
    opacity: .6;
    margin-left: 20px
}

.login__title a {
    border-bottom: 1px dotted var(--tt-lighter);
    margin-left: 10px;
    font-weight: 400;
    color: var(--tt-lightest)
}

.login__content {
    padding: 20px 40px
}

.login__row {
    margin-bottom: 20px;
    position: relative;
    display: block;
    font-size: 14px;
    color: var(--tt-lightest)
}

.login__caption {
    font-size: 14px;
    color: var(--tt);
    margin-bottom: 10px
}

.login__caption a {
    text-decoration: underline;
    margin-left: 6px;
    color: var(--accent)
}

.login__input input {
    padding-left: 40px
}

.login__row .fal {
    opacity: .5;
    position: absolute;
    left: 0;
    bottom: 0;
    line-height: 40px;
    width: 40px;
    text-align: center
}

.login__row button {
    width: 100%
}

.login__social {
    background-color: var(--ui-bg-darker);
    padding: 20px 40px;
    text-align: center
}

.login__social-caption {
    font-size: 11px;
    text-transform: uppercase;
    margin-bottom: 10px
}

.login__social-btns a {
    display: inline-block;
    margin: 0 3px;
    vertical-align: top
}

.login__social-btns img {
    display: block;
    width: 34px;
    height: 34px
}

.login__avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px
}

.login__menu {
    padding-left: 35px;
    padding-right: 35px;
    margin-bottom: 20px
}

.login__menu li {
    flex: 1 1 0;
    min-width: auto;
    max-width: 100%;
    margin: 0 10px 10px 10px;
}

.login__menu a {
    display: block;
    border-radius: 10px;
    padding: 10px;
    text-align: center;
    white-space: nowrap;
    background-color: var(--ui-bg-darker);
    font-size: 13px
}

.login__menu .fal {
    display: block;
    height: 30px;
    font-size: 24px;
    opacity: .3
}

.overlay {
    position: fixed;
    z-index: 998;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    background-color: #000;
    cursor: pointer;
    display: none
}

.mobile-menu {
    width: 280px;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 10px 20px;
    z-index: 999;
    position: fixed;
    left: -320px;
    top: 0;
    transition: left .4s;
    background-color: var(--bg-lighter);
    color: var(--tt)
}

.mobile-menu.is-active {
    left: 0
}

.mobile-menu-close {
    cursor: pointer;
    display: block;
    left: 280px;
    top: -40px;
    position: fixed;
    z-index: 999;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    opacity: 0;
    background-color: #e84e36;
    color: #fff;
    transition: top .4s, opacity .4s
}

.mobile-menu-close.is-active {
    top: 0;
    opacity: 1
}

body.mobile-menu-is-opened {
    overflow: hidden;
    width: 100%;
    height: 100%
}

.mobile-menu ul {
    margin: 0;
    padding: 0;
    display: block
}

.mobile-menu ul>li {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0
}

.mobile-menu ul>li>a {
    height: 40px;
    line-height: 40px;
    padding: 0;
    display: block
}

.mobile-menu .nav__list-hidden {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    left: 0;
    top: 0;
    width: calc(100% + 40px);
    margin: 15px -20px;
    padding: 10px 20px;
    border-radius: 0 !important;
    opacity: 1;
    visibility: visible;
    transform: none;
    background: var(--bg)
}

@media screen and (max-width:1220px) {
    body {
        background-image: none
    }

    .wrapper {
        padding: 0;
        background-image: none;
        overflow: hidden
    }

    .wrapper-container {
        max-width: 1000px
    }

    #scrolltop {
        width: 40px;
        height: 40px;
        line-height: 40px;
        font-size: 18px
    }

    .col-side .js-this-in-mobile-menu,
    .header__link,
    .hm,
    .nav {
        display: none
    }

    .header__btn-menu {
        display: inline-flex;
        width: 40px;
        padding: 0;
        font-size: 18px
    }

    .cols {
        grid-template-columns: minmax(0, 1fr)
    }

    .col-side {
        order: 10
    }

    .footer {
        display: block;
        text-align: center
    }

    .footer__text {
        margin: 20px 0
    }

    .footer__logo {
        margin: 0
    }

    .side-block--sticky {
        position: static
    }

    .top-item {
        flex: 1 0 30% !important
    }
}

@media screen and (max-width:950px) {
    .wrapper-container {
        max-width: 768px
    }

    .top-item {
        flex: 1 0 200px !important
    }

    .content-block--bg,
    .short__desc,
    .short__header {
        padding: 20px
    }

    .short__text {
        margin-bottom: 20px
    }
}

@media screen and (max-width:760px) {
    .wrapper-container {
        max-width: 640px
    }

    .header {
        gap: 20px 10px
    }

    .header__search {
        min-width: 100%;
        order: 10;
        margin: 0
    }

    .header__search form {
        max-width: 100%
    }

    .header__logo {
        flex: 1 1 0;
        max-width: 100%;
        min-width: 100px;
        margin: 0
    }

    .header__logo span {
        display: none;
    }

    .top {
        gap: 10px 10px
    }

    .sect__title,
    .short__title,
    h1,
    h2,
    h3,
    h4,
    h5 {
        font-size: 18px
    }

    .header__btn-login {
        width: 40px;
        overflow: hidden;
        font-size: 0;
        padding: 0;
        display: block
    }

    .header__btn-login::before {
        display: block;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        font-size: 18px;
        content: "\f007";
        font-weight: 300;
        font-family: 'Font Awesome 5 Pro'
    }

    .header__btn-balance {
        width: 40px;
        overflow: hidden;
        font-size: 0;
        padding: 0;
        display: block
    }

    .header__btn-balance::before {
        display: block;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        font-size: 18px;
        content: "\f158";
        font-weight: 300;
        font-family: 'Font Awesome 5 Pro'
    }

    .content-block--bg,
    .page .short,
    .page__comments {
        margin-left: -20px;
        margin-right: -20px;
        border-radius: 0
    }

    .page__text .quote {
        margin-left: var(--indent-negative);
        margin-right: var(--indent-negative);
        padding-right: var(--indent)
    }

    .full-text h1,
    .full-text h2,
    .full-text h3,
    .full-text h4,
    .full-text h5 {
        font-size: 18px
    }

    .ac-form__bottom>* {
        min-width: 100%
    }

    .ac-form__bottom button {
        width: 100%;
        order: 10
    }

    .comment-item__controls,
    .comment-item__rating-caption,
    .mass_comments_action {
        display: none
    }
}

@media screen and (max-width:590px) {
    .wrapper-container {
        max-width: 480px
    }

    .login {
        max-width: 90%;
        max-height: 90%;
        overflow-x: hidden;
        overflow-y: auto
    }

    .login__content,
    .login__header,
    .login__social,
    .pages-bg {
        padding-left: 20px;
        padding-right: 20px
    }

    .page__share {
        display: flex;
        min-width: 100%;
        margin: 0 0 20px 0
    }

    .page__yadzen {
        width: 100%;
        margin-bottom: 20px
    }

    .page__date,
    .page__meta {
        font-size: 12px
    }

    .page__header h1 {
        line-height: 1.4;
        font-size: 19px
    }

    .page__poster {
        height: 240px
    }

    .page__date {
        position: absolute;
        left: 0;
        top: 30px
    }

    .page__rating {
        top: 20px;
        bottom: auto;
        font-size: 13px
    }

    .page__rating>* {
        width: 40px;
        padding: 5px;
        text-align: center;
        height: 70px
    }

    .page__rating .fal {
        margin: 0;
        margin-bottom: 6px
    }
}

@media screen and (max-width:470px) {
    .wrapper-container22 {
        max-width: 360px
    }

    .header__logo {
        font-size: 22px
    }

    .hm2,
    .page__comments-info {
        display: none
    }

    .short__img {
        height: 160px
    }

    .short__text {
        font-size: 13px;
        display: -webkit-box;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
        overflow: hidden
    }

    .pagination__btn-loader>* {
        width: 100% !important;
        padding: 0 !important
    }

    .hm {
        display: block
    }

    .full-text iframe {
        width: calc(100% + 40px);
        max-width: calc(100% + 40px);
        height: 260px;
        margin-left: -20px;
        margin-right: -20px
    }
}

.downloadBlock {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background-color: var(--download-bg);
    padding: 20px 30px 20px 30px;
    border-radius: 10px
}

.downloadBlockVertical {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    background-color: var(--download-bg);
    padding: 20px 30px 20px 30px;
    border-radius: 10px
}

.downloadTitle {
    color: var(--accent);
    font-weight: 900;
    font-size: 18px
}

.downloadDesc {
    color: var(--accent);
    font-size: 14px;
    padding-right: 10px
}

.downloadButton {
    display: flex;
    flex-direction: column
}

.downloadContainer>br {
    display: none
}

.downloadMainBlock {
    margin-bottom: 1.2rem
}

.mt-1 {
    margin-top: .5rem
}

.mt-2 {
    margin-top: 1rem
}

.mt-3 {
    margin-top: 1.5rem
}

.mt-4 {
    margin-top: 2rem
}

.mt-5 {
    margin-top: 2.5rem
}

.mb-1 {
    margin-bottom: .5rem
}

.mb-2 {
    margin-bottom: 1rem
}

.mb-3 {
    margin-bottom: 1.5rem
}

.mb-4 {
    margin-bottom: 2rem
}

.mb-5 {
    margin-bottom: 2.5rem
}

.mr-1 {
    margin-right: .5rem
}

.mr-2 {
    margin-right: 1rem
}

.mr-3 {
    margin-right: 1.5rem
}

.mr-4 {
    margin-right: 2rem
}

.mr-5 {
    margin-right: 2.5rem
}

.ml-1 {
    margin-left: .5rem
}

.ml-2 {
    margin-left: 1rem
}

.ml-3 {
    margin-left: 1.5rem
}

.ml-4 {
    margin-left: 2rem
}

.ml-5 {
    margin-left: 2.5rem
}

.title_spoiler {
    border-radius: 10px;
    background-color: #e9970f1f;
    padding: 20px;
    border: none
}

.title_spoiler img {
    display: none
}

.title_spoiler a {
    color: #e9970f;
    text-decoration: none
}

.text_spoiler {
    background-color: transparent;
    border: none
}

.xfieldimagegallery {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center
}

.xfieldimagegallery li img {
    border-radius: 10px;
    height: auto;
    width: 208px
}

.profileBtn li {
    margin-top: 10px;
    margin-bottom: 10px
}

.usp {
    border-radius: 10px
}

.usp__columns {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: 0 0;
    background-color: var(--ui-bdc)
}

.usp__columns::before {
    background: 0 0
}

.usp__name {
    color: var(--tt);
    font-size: 24px;
}

.shortMiniBlock {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 1
}

.shortMiniPrice {
    position: relative;
    background-color: #ffffffe6;
    color: #16171b;
    font-weight: 600;
    border-radius: 10px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    float: right;
    height: 29px;
}

.shortMiniVip {
    position: relative;
    background-color: #ffffffe6;
    color: #16171b;
    font-weight: 600;
    border-radius: 10px;
    padding: 4px 8px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    float: left;
    height: 29px;
}

.wc-wrapper.wc-main-index {
    border-bottom: none
}

.btn-list-wrapper>ul>li {
    width: 45% !important
}

.btn-list-wrapper>ul>li>a {
    width: 100% !important
}

.cabinetBalance {
    border: 1px solid var(--accent);
    padding: 10px 20px;
    border-radius: 10px;
    color: var(--accent);
    font-size: 24px
}

.iconLogin {
    display: flex;
    align-items: center;
    justify-content: center
}

.iconLoginIcon {
    display: block;
    height: 30px;
    font-size: 24px;
    opacity: .3
}

#category {
    height: 500px !important
}

.fr-quick-insert {
    display: none !important
}

.fr-dropdown-list li div,
.fr-dropdown-list li h1,
.fr-dropdown-list li h5 {
    display: none
}

.fr-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row
}

#align-1,
#color-1,
#dleaudio-1,
#dlecode-1,
#dlehide-1,
#dlequote-1,
#dletypo-1,
#emoticons-1,
#fontFamily-1,
#fontSize-1,
#html-1,
#indent-1,
#insertHR-1,
#insertImage-1,
#insertLink-1,
#insertTable-1,
#insertVideo-1,
#italic-1,
#outdent-1,
#page_dropdown-1,
#paragraphStyle-1,
#redo-1,
#selectAll-1,
#strikeThrough-1,
#subscript-1,
#superscript-1,
#underline-1,
#undo-1,
.fr-btn-wrap,
.fr-separator,
.fr-separator .fr-vs {
    display: none !important
}

#align-2,
#bold-2,
#clearFormatting-2,
#color-2,
#dleaudio-2,
#dlecode-2,
#dlehide-2,
#dleleech-2,
#dlemedia-2,
#dlequote-2,
#dlespoiler-2,
#dletypo-2,
#emoticons-2,
#fontFamily-2,
#fontSize-2,
#fullscreen-2,
#html-2,
#indent-2,
#insertHR-2,
#insertImage-2,
#insertLink-2,
#insertTable-2,
#insertVideo-2,
#italic-2,
#outdent-2,
#page_dropdown-2,
#paragraphFormat-2,
#paragraphStyle-2,
#redo-2,
#selectAll-2,
#strikeThrough-2,
#subscript-2,
#superscript-2,
#underline-2,
#undo-2,
.fr-btn-wrap,
.fr-separator,
.fr-separator .fr-vs {
    display: none !important
}

.btnSidebar {
    border-radius: 5px
}

.btnSidebar:hover {
    border-radius: 5px
}

.color-blue-bg {
    outline: 2px solid #a4c2ff4a !important
}

.color-blue-btn {
    background-color: #5374b721 !important;
    color: #5374b7 !important
}

.color-blue-text {
    color: #5374b7 !important
}

.color-blue-text a {
    color: #5374b7 !important
}

.int__title {
    color: var(--tt-lighter)
}

.war {
    background: var(--war) no-repeat;
    height: 130px;
    background-position: center
}

@media screen and (max-width:950px) {
    .settings {
        display: none
    }
}

.noads-block {
    display: var(--noadsstyle)
}

[data-tooltip] {
    position: relative;
    z-index: 2;
    cursor: pointer;
    transition: 0.3s;
}

[data-tooltip]:after,
[data-tooltip]:before {
    visibility: hidden;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    pointer-events: none
}

[data-tooltip]:before {
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-bottom: 5px;
    margin-left: -80px;
    padding: 7px;
    width: 160px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    background-color: #000;
    background-color: hsla(0, 0%, 20%, .9);
    color: #fff;
    content: attr(data-tooltip);
    text-align: center;
    font-size: 14px;
    line-height: 1.2;
    transition: 0.3s;
    z-index: 50;
}

[data-tooltip]:after {
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    width: 0;
    border-top: 5px solid #000;
    border-top: 5px solid hsla(0, 0%, 20%, .9);
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    content: " ";
    font-size: 0;
    line-height: 0;
    transition: 0.3s;
    z-index: 50;
}

[data-tooltip]:hover:after,
[data-tooltip]:hover:before {
    visibility: visible;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1
}

.accordion .accordion-item {
    border-bottom: 1px solid var(--bdc)
}

.accordion .accordion-item button[aria-expanded=true] {
    border-bottom: 1px solid var(--bdc-darker)
}

.accordion button {
    position: relative;
    display: block;
    text-align: left;
    width: 100%;
    padding-bottom: 15px;
    margin-top: 20px;
    color: var(--tt-lighter);
    border: none;
    background: 0 0;
    outline: 0;
    border-radius: 0;
    padding-left: 0
}

.accordion button:hover {
    cursor: pointer;
    color: var(--accent)
}

.accordion button:hover::after {
    cursor: pointer;
    color: var(--accent);
    border: 1px solid var(--accent)
}

.accordion button .accordion-title {
    padding: 1em 1.5em 1em 0
}

.accordion button .icon {
    display: inline-block;
    position: absolute;
    top: 2px;
    right: 0;
    width: 22px;
    height: 22px;
    border: 1px solid;
    border-radius: 22px
}

.accordion button .icon::before {
    display: block;
    position: absolute;
    content: '';
    top: 9px;
    left: 5px;
    width: 10px;
    height: 2px;
    background: currentColor
}

.accordion button .icon::after {
    display: block;
    position: absolute;
    content: '';
    top: 5px;
    left: 9px;
    width: 2px;
    height: 10px;
    background: currentColor
}

.accordion button[aria-expanded=true] {
    color: var(--accent)
}

.accordion button[aria-expanded=true] .icon::after {
    width: 0
}

.accordion button[aria-expanded=true]+.accordion-content {
    opacity: 1;
    max-height: 20rem;
    transition: all .2s linear;
    will-change: opacity, max-height
}

.accordion .accordion-content {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity .2s linear, max-height .2s linear;
    will-change: opacity, max-height
}

.accordion .accordion-content p {
    padding: 10px;
    font-weight: 300;
    margin: 2em 0
}

@media screen and (max-width:1220px) {
    .not-mobile {
        display: none !important
    }
}

@media screen and (min-width:1221px) {
    .not-pc {
        display: none !important
    }
}

.warning {
    text-align: center;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 14px;
    border-radius: 10px;
    padding: 10px 10px;
    margin-bottom: 2rem
}

.warning span {
    background-color: var(--bg);
    padding: 4px 15px;
    border-radius: 10px
}

.warning-red {
    color: #eb4d4b;
    background: repeating-linear-gradient(45deg, #eb4d4b, #eb4d4b 10px, var(--bg) 10px, var(--bg) 20px)
}

.warning-orange {
    color: #eb954b;
    background: repeating-linear-gradient(45deg, #eb954b, #eb954b 10px, var(--bg) 10px, var(--bg) 20px)
}

pre {
    max-height: 500px;
    overflow: scroll;
    background-color: var(--bdc);
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}

pre code {
    color: var(--tt);
    white-space: break-spaces;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: var(--bg-lighter)
}

::-webkit-scrollbar-track {
    background: var(--bg-lighter)
}

::-webkit-scrollbar-thumb {
    border-radius: 4px;
    min-height: 50px;
    background-color: var(--accent)
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--accent)
}

.message-info__title {
    font-weight: 900;
    font-size: 16px;
}

.message-info {
    border-radius: 5px !important;
    margin-bottom: 2rem !important;
    color: var(--tt) !important;
    background-color: var(--bg-lighter) !important;
    box-shadow: none !important;
    border: none !important;
}

.message-info::before {
    display: none !important;
}


pre::-webkit-scrollbar {
    background-color: transparent
}

pre::-webkit-scrollbar-track {
    border-radius: 20px;
    background-color: transparent
}

pre::-webkit-scrollbar-thumb {
    border-radius: 20px;
    background-color: var(--accent);
}

pre::-webkit-scrollbar-corner {
    background-color: transparent;
    border-color: transparent
}

.grid-line {
    display: grid;
    grid-gap: 15px 15px;
}

.grid-line article {
    padding-bottom: 0px !important;
}

.short-left {
    min-width: 300px;
    width: 300px;
    padding: 20px 10px 20px 20px;
    color: var(--tt-lighter);
}

.short-left img {
    border-radius: 10px;
}

.category {
    font-size: 14px;
}

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

.category a {
    color: var(--tt);
    background-color: var(--bdc);
    display: inline-grid !important;
    padding: 5px 10px;
    margin-bottom: 5px;
    border-radius: 10px;
    text-align: center;
}

.category a:hover {
    opacity: 0.8;
}

.category-w100 a {
    width: 100%;
}

.shortMiniBlock2 {
    position: absolute;
    top: 25px;
    left: 25px;
    z-index: 1
}

.shortMiniBlock3 {
    position: absolute;
    margin-top: 25px;
    margin-left: 25px;
    z-index: 1;
}

.short-version {
    color: var(--accent);
    font-size: 14px;
    position: absolute;
    top: -10px;
    right: -10px;
    z-index: 50;
    background-color: var(--bg);
    padding: 5px;
    border-radius: 10px;
}

.full-version {
    color: var(--accent);
    font-size: 14px;
    z-index: 50;
    background-color: var(--bg);
    padding: 5px;
    border-radius: 10px;
    float: right;
    margin: -9px -9px;
    font-weight: 700;
}

.col-side .side-nav li>ul>li {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
}

.col-side .side-nav li>ul>li>a {
    width: 100%;
    background-color: var(--nav);
    padding: 10px 20px;
    margin: 2%;
    border-radius: 10px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.col-side .side-nav li>ul {
    width: 400px;
    display: flex;
    flex-wrap: wrap;
    gap: 0px
}

.short__meta-item a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    padding: 0 20px;
    height: 40px;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    background-color: var(--btn-bg);
    color: var(--btn-color);
    border-radius: 10px;
    box-shadow: none;
    text-decoration: none;
}

.short__meta-item a:hover {
    background-color: var(--btn-bg-hover);
    border-color: var(--btn-bg-hover);
}

.favourite {
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 2px;
    margin-right: 5px;
}

.message-info a {
    color: var(--accent);
}

#timer1 {
    text-align: center;
    width: 120px;
    font-size: 14px;
    color: red;
}


select:not([multiple]) {
    border-radius: 10px;
    background-image: var(--chevron);
    background-size: 15px auto;
}

.pm_progress_bar,
input[type="text"],
input[type="password"],
select,
textarea {
    box-shadow: none !important;
}

.table-pm table,
.table-pm td {
    border: none;
}

.table-pm table {
    border-spacing: 0px 10px;
    border-collapse: separate;
}

.table-pm tr:first-child>td {
    display: none;
}

.table-pm tr>td {
    background-color: var(--ui-bg-darkest);
}

.table-pm tr:last-child>td {
    background-color: transparent;
    padding: 0px;
}

.table-pm tr>td:first-child {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.table-pm tr>td:last-child {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.table-pm tr {
    background-color: transparent !important;
}

.pm-unread-image>img,
.pm-read-image>img,
.pm-reply-image>img {
    min-width: 49px;
    width: 48px;
    height: 48px;
}

.pm-item {
    background-color: var(--ui-bg-darkest);
    padding: 20px;
    border-radius: 10px;
}

.pm-item .pm-button a {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    background-color: var(--btn-bg);
    color: var(--btn-color);
    padding: 5px 10px;
    border-radius: 10px;
}

.pm-item .pm-button {
    margin-top: 20px;
}

.pm-item .pm-button>span {
    margin-right: 10px;
}

.pm-item .pm-item__img {
    border-radius: 10px;
}

.pm__status {
    display: none;
}

.form__row--submit,
.pm__links {
    padding-bottom: 20px;
    padding-top: 0px;
}

hr {
    border-bottom: 1px solid var(--bdc-darker);
    margin-top: 40px;
    margin-bottom: 40px;
}

.url-accent a {
    color: var(--accent);
}

.accent-color {
    color: var(--accent);
}

.static p {
    color: var(--tt-lighter);
}

.quote {
    margin: 25px 0;
    padding: 20px 40px 20px 40px;
    background-color: var(--btn-bg);
    font-weight: 600;
    letter-spacing: 0.8px;
    font-size: 14px;
    border-radius: 10px;
    border-left: 2px solid var(--accent);
    color: var(--accent);
}

.quote::before {
    display: none;
}

.quote p {
    color: var(--accent);
}

.user--style1 {
    animation: rainbow 20s infinite alternate;
}

/* Unfortunately, browsers try to take the shortest distance between transition/animation properties, so a simple `0turn` to `1turn` doesn't get the proper effect. */
@keyframes rainbow {
    0% {
        color: IndianRed;
    }

    14% {
        color: orange;
    }

    28% {
        color: yellow;
    }

    42% {
        color: lime;
    }

    66% {
        color: teal;
    }

    80% {
        color: CornflowerBlue;
    }

    100% {
        color: violet;
    }
}

.usp__group {
    color: var(--tt);
    margin-top: 5px;
}

/*
_____________________________Авторизация_____________________________*/


#login-box {
    position: relative;
    margin: auto;
    width: 720px;
    height: 400px;
}

.left {
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    padding: 40px 60px 40px 60px;
    width: 360px;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.right {
    position: absolute;
    top: 0;
    right: 0;
    box-sizing: border-box;
    padding: 40px 60px 40px 60px;
    width: 360px;
    height: 400px;
    border-radius: 0 2px 2px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.right::after {
    content: '';
    background: url(https://img.freepik.com/free-vector/vector-game-room-illustration-modern-esports-concept_33099-1201.jpg?t=st=1657914742~exp=1657915342~hmac=4b55c08…&w=1380);
    background-size: cover;
    background-position: center;
    opacity: 0.05;
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    z-index: 1;
    border-radius: 10px;
}

.right .loginwith {
    display: block;
    margin-bottom: 40px;
    font-size: 28px;
    text-align: center;
    z-index: 3;
}

a.social-signin {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    width: 240px;
    height: 36px;
    border: none;
    border-radius: 2px;
    color: #FFF;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    transition: 0.2s ease;
    cursor: pointer;
    z-index: 3;
}

a.social-signin:hover,
a.social-signin:focus {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    transition: 0.2s ease;
}

a.social-signin:active {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    transition: 0.2s ease;
}

a.social-signin.vk {
    background: #42668e;
}

a.social-signin.yandex {
    background: #e93434;
}

a.social-signin.mailru {
    background: #2c7cff;
}

a.social-signin.google {
    background: #DD4B39;
}

a.social-signin.facebook {
    background: #32508E;
}

.yourAds {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--nav);
    border-radius: 10px;
    padding: 100px 20px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-weight: 800;
}

.nav__list-hidden {
    transform: translateY(0);
}

.message-info__content {
    overflow-wrap: break-word;
}

.grass-bg {
    position: fixed;
    opacity: 0.05;
    left: -800px;
    top: 50px;
}

.jGrowl {
    display: none !important;
}

#loading-layer {
    border-radius: 10px !important;
    opacity: 1 !important;
    border-left: 80px solid var(--accent) !important;
}

.whodownload_wrapper .title_spoiler {
    margin-bottom: 20px !important;
}



.login--2 {
    width: 800px;
    height: 600px;
    border-radius: 20px;
    position: fixed;
    z-index: 999;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    overflow: hidden;
    border-radius: none;
    background-color: transparent;
}

.login--2-avatar {
    width: 150px;
    height: 150px;
    margin-left: auto;
    margin-right: auto;
    transform: translateY(-50%);
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    z-index: 4;
    box-shadow: 0px 5px 50px 0px var(--accent), 0px 0px 0px 7px var(--accent);
}

.login--card {
    background-color: var(--ui-bg);
    border-radius: 20px;
    margin-top: 150px;
}

.login--content--2 {
    margin-top: -35px;
    text-align: center;
    padding: 0 20px;
    padding-bottom: 40px;
    transition: all 0.3s;
}

.login--card__name {
    font-weight: 700;
    font-size: 24px;
    color: var(--accent);
    margin-bottom: 15px;
}

.login--card__txt {
    font-size: 18px;
    font-weight: 500;
    color: var(--tt-);
    margin-bottom: 15px;
}

.login--card-bottom {
    margin-top: -35px;
    text-align: center;
    padding: 0 20px;
    padding-bottom: 40px;
    transition: all 0.3s;
}

@media screen and (max-width:760px) {
    .short__h1 {
        font-size: 18px;
    }

    .full__gallery {
        flex-direction: column;
    }

    .full__gallery .xfieldimagegallery {
        flex-direction: row;
        display: flex;
    }

    .full__gallery .xfieldimagegallery li img {
        margin: 10px;
    }

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

    .full__gallery-right {
        max-width: 100%;
    }

    .full__gallery .xfieldimagegallery li img {
        min-width: 130px;
        width: 130px;
    }

    .full-text h2:first-child {
        margin-top: 30px;
    }

    .full-version {
        margin: -9px 10px;
    }
}

.category__title {
    font-size: 18px;
    font-weight: 600;
    padding-bottom: 10px;
    color: var(--category__desc);
}

.category__desc {
    text-align: justify;
    font-size: 14px;
    margin-top: 15px;
    color: var(--category__desc);
    background-color: var(--bg-lighter);
    border-radius: 10px;
    padding: 20px;
    min-width: 100%;
}

.category__container {
    display: flex;
    align-items: center;
}

.category__icon {
    font-size: 50px;
    overflow: inherit;
    margin-right: 20px;
    min-width: 50px;
}

.full_user {
    height: 130px;
}

.card_avatar {
    display: flex;
    align-items: center;
    border-radius: 10px;
    background-color: var(--bg-lighter);
    box-shadow: var(--shadow);
    padding: 25px 40px;
}

.card_avatar:hover {
    box-shadow: var(--shadow-hover);
}

.card_avatar .avatar {
    width: 80px;
    height: 80px;
    margin-right: 25px;
}

.card_avatar img {
    border-radius: 100%;
}

.card_avatar .username {
    font-size: 22px;
    font-weight: 500;
    color: var(--tt-lighter);
}

.card_avatar .group {
    font-size: 14px;
    font-weight: 600;
}

.card_avatar .online {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--tt-lighter);
    margin-top: 10px;
}

.hl1 {
    height: 1px;
    background-color: var(--tt-lighter);
    border: none;
    text-align: center;
    margin-top: 4rem;
    margin-bottom: 2rem;
}

.hl1::before {
    content: "Автор Статьи";
    position: relative;
    top: -10px;
    background-color: var(--bg-lighter);
    padding: 2px 5px;
    color: var(--tt-lighter);
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 600;
}

.whodownload_wrapper {
    padding: 0 20px 0 20px;
    opacity: 0.8;
}

.iconify-icon svg {
    margin-bottom: -3px;
}