/* ------------------- ШРИФТЫ ------------------- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,400;0,700;1,400&display=swap');

/* ------------------- ПЕРЕМЕННЫЕ ------------------- */
:root {
    --background-darkest-color: #1b1c26;
    --background-dark-color: #21222b;
    --background-main-color: #272936;
    --background-light-color: #323645;
    --main-color: #c0392b;
    --main-hover-color: #9d3025;
    --icon-font-family: 'Line Awesome Free';
    --main-font-family: 'Inter', sans-serif;
    --second-font-family: 'Raleway', sans-serif;
}

/* ------------------- БАЗОВЫЕ СТИЛИ ------------------- */
html {
    overflow-x: hidden;
}

body {
    background-color: var(--background-darkest-color);
    background: url('/public/img/style-images/background-library.jpg') center 0 no-repeat fixed;
    background-size: 100% 100%;
    font: normal 92%/1.7 'system-ui', lucida, 'lucida grande', arial, helvetica, sans-serif;
}

ul, ol {
    padding: 0;
    margin: 0;
}

li {
    list-style: none;
}

#full-forumcard ul, 
#full-forumcard ol {
    margin-top: 10px;
    margin-bottom: 10px;
    padding-left: 1rem;
}

#full-forumcard ul li {
    list-style: circle;
}

#full-forumcard ol li {
    list-style: decimal;
}

#full-forumcard .ck-dropdown ul {
    margin: 0;
    padding: 0;
}

legend,
label {
    display: block;
}

legend,
label:not(#index-sidebar-form label) {
    font-family: var(--second-font-family);
    font-size: 12px;
    color: lightgray;
    margin-bottom: 4px;
    text-transform: uppercase;
}

#forum-link-label {
    display: inline-block;
}

hr {
    opacity: 1;
    color: #8d8d8d;
}

/* ссылки */
a {
    text-decoration: none;
    color: #fff;
    outline: 0;
}

.review-text a,
.comment-text a {
    color: var(--main-color);
}

a:hover {
    color: var(--main-color);
    transition: color 0.1s ease-in-out;
}

/* заголовки */
#full-forumcard h2 {
    font-size: 22px;
}

#full-forumcard h3 {
    font-size: 20px;
}

#full-forumcard h4 {
    font-size: 18px;
}

img {
    width: 100%;
    height: auto;
    display: block;
}

/* .forumcard-description br, */
.comment-text br,
.review-text br {
    display: none;
}

/* цитаты */
blockquote {
    position: relative;
}

blockquote p {
    padding-left: 23px;
}

blockquote:before {
    position: absolute;
    top: 0px;
    font-family: var(--icon-font-family);
    content: "\f10d";
    font-weight: 900;
}

/* формы */
input[type="text"],
input[type="url"],
input[type="email"],
input[type="password"]  {
    min-width: 250px;
}

#search input[type="text"] {
    min-width: 210px;
}

#reg-form input[type="text"],
#reg-form input[type="url"],
#reg-form input[type="email"],
#reg-form input[type="password"]  {
    min-width: 300px;
}

select:not(#index-sidebar-form select) {
    min-width: 138px;
}

/* select:not(#index-sidebar-form select) option:checked {
    color: #fff;
    background: #c0392b;
} */

input[type="text"],
input[type="url"],
input[type="email"],
input[type="password"],
input[name="search_query"],
select:not(#index-sidebar-form select),
textarea {
    color: #fff;
    padding: 4px 10px;
    border: 1px solid var(--background-darkest-color);
    border-radius: 5px;
    background-color: var(--background-darkest-color);
}

textarea {
    padding: 8px 15px;
}

input[type="text"]:focus,
input[type="url"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[name="search_query"]:focus,
select:not(#index-sidebar-form select):focus,
textarea:focus {
    outline: 0;
}

input[name="search_query"] {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

input:-webkit-autofill,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-text-fill-color: #fff !important;
    caret-color: #fff;
    transition: background-color 99999s ease-in-out 0s;
}

#forum-link-label ~ input[type="url"] {
    display: block;
}

select {
    max-height: 105px;
}

select option {
    padding-bottom: 4px;
}

input[type="number"]:focus {
    outline: 0;
}

select:focus {
    border: 1px solid var(--background-darkest-color);
    outline: 0;
}

.form-wrapper .input-wrapper,
.form-wrapper .textarea-wrapper {
    margin-bottom: 15px;
}

/* кнопки */
button,
.button,
input[type="submit"],
input[type="file"]::file-selector-button {
    color: #fff;
    padding: 3px 14px 6px;
    line-height: normal;
    border: 0;
    border-radius: 5px;
    background-color: var(--main-color);
    cursor: pointer;
}

button:hover,
.button:hover,
input[type="submit"]:hover,
input[type="file"]::file-selector-button:hover {
    transition: color 0.2s ease-in-out;
    background-color: var(--main-hover-color);
}

button:disabled,
.button:disabled,
input[type="submit"]:disabled {
    background-color: var(--main-hover-color);
}

/* нотисы, ошибки, ноуконтенты */
.notice {
    text-align: center;
    font-style: italic;
    margin-top: 15px;
}

.error {
    color: var(--main-color);
    margin-bottom: 15px;
}

/* .error:before {
    content: "\f071";
    font-family: var(--icon-font-family);
    font-weight: 900;
    margin-right: 3px;
    font-size: 16px;
    color: var(--main-color);
} */

.no-content {
    margin-bottom: 10px;
}

.info {
    text-align: center;
    color: #fff;
    background-color: var(--background-light-color);
    padding: 15px 25px;
    border-radius: 10px;
    border: 1px solid #22232b;
    margin: 20px;
}

.center {
    text-align: center;
}

/* таблицы */
table {
	width: 100%;
	border: none;
    margin-top: -10px;
    margin-bottom: 10px;
	border-collapse: separate;
}

.table-wrapper {
	margin-bottom: 10px;
}

tbody th {
    font-family: var(--main-font-family);
    font-size: 15px;
}

tbody, td, tfoot, th, thead, tr {
    text-align: center;
    padding: 10px 15px;
}

table tbody td {
	text-align: left;
    font-size: 14px;
	border: none;
	padding: 10px 12px;
	vertical-align: top;
}

tbody tr > th {
    font-size: 13px;
}

table tbody tr:nth-child(even) {
	background: var(--background-dark-color);
}

/* ------------------- КАРКАСНАЯ ВЕРСТКА ------------------- */
/* @media (min-width: 1200px) {
    .container{
        max-width: 1440px;
    }
} */

#index-wrapper,
#profile-wrapper,
#admin-wrapper {
    padding-top: 5px;
    padding-bottom: 10px;
}

#index-wrapper main,
#profile-wrapper main,
#admin-wrapper main {
    border: 1px solid #191616;
    border-radius: 20px;
}

#index-list {
    max-height: 695px;
    overflow: auto;
}

#full-forumcard,
#edit-forumcard-form,
#add-forumcard-form,
#profile-forumcards-list,
#faq,
#vote {
    max-height: 715px;
    overflow: auto;
}

#index-body,
#profile-body,
#admin-body {
    min-height: 780px;
}

/* СКРОЛЛБАРЫ */
/* работает в Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--main-color) var(--background-light-color);
} 
/* работает в Chrome, Edge и Safari */
*::-webkit-scrollbar {
    height: 10px;
    width: 10px;
}

*::-webkit-scrollbar-track {
    border-radius: 20px;
    background: var(--background-light-color);
}

*::-webkit-scrollbar-thumb {
    border: 1px solid var(--background-light-color);
    border-radius: 20px;
    background-color: var(--main-color);
}

/* ------------------- ОБЩАЯ СТИЛИЗАЦИЯ ------------------- */
/* ХЭДЕР */
header {
    display: flex;
    justify-content: space-between;
    position: relative;
    min-height: 45px;
    background-color: var(--background-light-color);
    padding: 8px 20px;
    border-top-right-radius: 20px;
    border-bottom: 1.5px solid var(--background-dark-color);
}

/* Главное меню */
.desktop-menu .main-menu,
.desktop-menu .main-menu li {
    display: inline-block;
}

.desktop-menu .main-menu li {
    padding: 0 6px;
}

.desktop-menu .main-menu li:first-child {
    padding-left: 5px;
}

.desktop-menu {
    display: flex;
    align-items: center;
}

.desktop-menu .main-menu,
.mobile-menu .main-menu {
    font-family: var(--main-font-family);
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
}

.mobile-menu .main-menu {
    border-bottom: 1.5px solid var(--background-dark-color);
    padding-bottom: 7px;
}

.bars-icons {
    display: none;
    font-size: 18px;
    padding: 5px;
    cursor: pointer;
}

.mobile-menu {
    display: none;
    text-align: center;
    padding: 5px 10px 0;
}

.mobile-menu li {
    padding: 4px 0;
}

/* Подменю */
.sub-menu {
    font-family: var(--main-font-family);  
    color: #fff;  
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 10px;
    padding: 5px 8px;
    border-bottom: 1.5px solid var(--background-dark-color);
}

/* Строка выборки */
.search-query,
.type-query,
.author-query,
.category-query {
    padding-left: 5px;
    font-size: 12px;
}

/* Сортировка */
.sort-by-links {
    margin-left: auto;
    display: flex;
}

.sort-by-links li {
    font-size: 12px;
    display: inline-block;
    padding: 0 5px;
}

.sort-by-links li:first-child {
    padding-left: 3px;
}

.sort-by-links li .asc:after {
    content: "\f106";
    font-weight: 900;
    font-family: var(--icon-font-family);
    font-size: 10px;
    padding-left: 3px;
}

.sort-by-links li .desc:after {
    content: "\f107";
    font-weight: 900;
    font-family: var(--icon-font-family);
    font-size: 10px;
    padding-left: 3px;
}

.sort-by-links .sort-link.active {
    color: var(--main-color);
}

/* Поиск */
#search {
    position: absolute;
    top: 7px;
    right: 55px;
}

#search form {
    display: flex;
    height: 30px;
}

#search input[type="text"] {
    user-select: none;
}

#search input[type="submit"] {
    border: 0;
    padding: 2px 9px 4px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.search-icons {
    display: flex;
    color: #fff;
    font-size: 18px;
    line-height: 1;
    padding: 5px;
}

.search-icons i {
    cursor: pointer;
}

/* БАННЕРЫ */
.banners-wrapper {
    overflow: hidden;
    position: relative;
}

#banners {
    display: flex;
    height: 32px;
    overflow: hidden;
    white-space: nowrap;
}

#banners ul {
    margin: 0 3px;
}

#banners li {
    margin: 1px;
    height: 31px;
    display: inline-block;
}

#banners a,
#banners .banner-wrapper {
    display: inline-block;
    background: #dfe1eb;
    width: 88px;
    height: 31px;
}

#banners img {
    position: absolute;
    display: inline-flex;
    width: 88px;
    height: 31px;
}

/* САЙДБАРЫ */
/* общее */
.sidebar {
    position: relative;
    color: #fff;
    background-color: var(--background-dark-color);
    padding: 0;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.sidebar-inner {
    padding: 17px 30px;
}

.sidebar-inner .logo h1 {
    position: relative;
    font-family: var(--main-font-family);
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    display: inline-block;
}

.sidebar-inner .sidebar-menu li {
    font-family: var(--second-font-family);
    margin: 7px 0;
}

.sidebar-inner .logo {
    position: relative;
    display: flex;
    justify-content: center;
    padding-bottom: 2px;
    margin-bottom: 30px;
    border-bottom: 1.5px solid #414141;
}

.sidebar-inner .logo img {
    width: 22px;
    display: inline-flex;
    padding-right: 7px;
    margin-top: -3px;
}

.sidebar-inner h1:hover a {
    color: #fff;
}

.sidebar-inner .logo h1:hover {
    -webkit-filter: invert(40%) grayscale(100%) brightness(20%) sepia(100%) hue-rotate(-50deg) saturate(400%) contrast(6);
    filter: grayscale(200%) brightness(40%) sepia(100%) hue-rotate(-50deg) saturate(999%) contrast(0.7);
}

/* сайдбар на главной */
.sidebar-inner fieldset {
    margin-bottom: 25px;
    border: 1px solid #414141;
    border-radius: 5px;
    padding: 14px 15px 10px;
}

.sidebar-inner fieldset:last-of-type {
    margin-bottom: 17px;
}

.sidebar-inner legend {
    font-family: var(--second-font-family);
    font-size: 12px;
    text-transform: uppercase;
    color: lightgrey;
    margin-top: -24px;
    margin-left: -10px;
    margin-bottom: 4px;
    background-color: #21222b;
    width: fit-content;
    padding-right: 10px;
    padding-left: 10px;
}

.sidebar-inner .slider-legend {
    margin-bottom: 14px;
}

.sidebar-inner input[type=submit] {
    width: 100%;
    text-align: center;
    margin: 8px 0;
}

.index-sidebar-reset {
    font-family: var(--second-font-family);
    font-size: 13px;
}

.sidebar-inner #arrows-icons {
    position: absolute;
    top: 0;
    right: 10px;
    font-size: 16px;
    line-height: 1;
}

.sidebar-inner #arrows-icons i {
    cursor: pointer;
    display: none;
}

/* Чекбоксы */
#index-sidebar-form .checkbox-wrapper label {
    display: inline-block;
    margin-left: 7px;
}

#index-sidebar-form .checkbox-wrapper {
    display: flex;
}

#index-sidebar-form .sidebar-inner .col-wrapper.forum-type,
#index-sidebar-form .sidebar-inner .col-wrapper.forum-category {
    display: flex;
    font-size: 14px;
    overflow: auto;
}

#index-sidebar-form .sidebar-inner .col-wrapper.forum-type .col2 {
    margin-left: 19px;
}

#index-sidebar-form .sidebar-inner .col-wrapper.forum-category .col2 {
    margin-left: 35px;
}

/* Селекты и намберы */
.select-date-wrapper,
.input-number-wrapper {
    font-family: var(--second-font-family);
    display: flex;
    justify-content: space-between;
}

/* ТЕЛО */
/* общее */
#index-body,
#profile-body,
#admin-body {
    color: #fff;
    background-color: var(--background-main-color);
    padding: 0;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

#index-list {
    padding: 12px 20px 8px;
}

#profile-forumcards-list {
    padding: 20px;
}

#full-forumcard {
    scroll-behavior: smooth;
}

/* КАРТОЧКИ ФОРУМОВ */
#index-list .forumcard,
#profile-forumcards-list .forumcard {
    display: flex;
    align-items: center;
    height: 127px;
    padding: 10px 14px;
    margin-bottom: 8px;
    border-radius: 10px;
    border: 1px solid #262626;
    background-color: var(--background-light-color);
}

#index-list .forumcard:last-child,
#profile-forumcards-list .forumcard:last-child {
    margin-bottom: 0;
}

/* Постер карточки */
#index-list .forumcard-image,
#profile-forumcards-list .forumcard-image {
    display: flex;
    align-items: center;
    border: 1px solid #fff;
    background-color: var(--background-dark-color);
    border-radius: 5px;
}

#index-list .forumcard-poster-image img,
#profile-forumcards-list .forumcard-poster-image img,
#index-list .forumcard-screenshot-image img,
#profile-forumcards-list .forumcard-screenshot-image img {
    object-fit: cover;
    width: 100px;
    height: 100px;
    border-radius: 7px;
}

/* Тело форумной карточки */
#index-list .forumcard-body,
#profile-forumcards-list .forumcard-body {
    padding: 0 7px;
    width: 100%;
    height:100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#index-list .forumcard-image-inner ~ .forumcard-body,
#profile-forumcards-list .forumcard-image-inner ~ .forumcard-body {
    padding-left: 17px;
}

/* Хэдер тела форумной карточки */
#index-list .forumcard-metadata-header,
#profile-forumcards-list .forumcard-metadata-header {
    display: flex;
    align-items: center;
}

#index-list .forumcard-metadata-header .forumcard-type,
#index-list .forumcard-metadata-header .forumcard-author,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type,
#profile-forumcards-list .forumcard-metadata-header .forumcard-author {
    font-family: var(--second-font-family);
}

#index-list .forumcard-metadata-header .forumcard-title h4,
#profile-forumcards-list .forumcard-metadata-header .forumcard-title h4 {
    font-family: var(--main-font-family);
    font-size: 19px;
    line-height: 1.4;
    margin: 0;
}

#index-list .forumcard-metadata-header .forumcard-author,
#profile-forumcards-list .forumcard-metadata-header .forumcard-author {
    margin-left: auto;
    font-size: 13px;
}

/* Стилизация типов карточек */
#index-list .forumcard-metadata-header .forumcard-type span,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type span {
    margin: 0px 15px 5px;
    display: block;
}

#index-list .forumcard-metadata-header .forumcard-type span a,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type span a {
    font-size: 10px;
    border: 1px solid;
    border-radius: 5px;
    padding: 1px 7px 2px;
    text-transform: lowercase;
}

#index-list .forumcard-metadata-header .forumcard-type .type-active a,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-active a {
    border-color: #48A43F;
    color: 	#48A43F;
}

#index-list .forumcard-metadata-header .forumcard-type .type-test a,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-test a {
    border-color: #D9C022;
    color: #D9C022;
}

#index-list .forumcard-metadata-header .forumcard-type .type-search-ams a,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-search-ams a {
    border-color: #b958b9;
    color: #b958b9;
}

#index-list .forumcard-metadata-header .forumcard-type .type-archive a,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-archive a {
    border-color: #9a6f5f;
    color: #9a6f5f;
}

#index-list .forumcard-metadata-header .forumcard-type .type-idea a,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-idea a {
    border-color: #aaa9a9;
    color: #aaa9a9;
}

#index-list .forumcard-metadata-header .forumcard-type .type-active a:hover,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-active a:hover {
    background-color: #48A43F;
    color: #fff;
}

#index-list .forumcard-metadata-header .forumcard-type .type-test a:hover,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-test a:hover {
    background-color: #D9C022;
    color: #fff;
}

#index-list .forumcard-metadata-header .forumcard-type .type-search-ams a:hover,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-search-ams a:hover {
    background-color: #b958b9;
    color: #fff;
}

#index-list .forumcard-metadata-header .forumcard-type .type-idea a:hover,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-idea a:hover {
    background-color: #aaa9a9;
    color: #fff;
}

#index-list .forumcard-metadata-header .forumcard-type .type-archive a:hover,
#profile-forumcards-list .forumcard-metadata-header .forumcard-type .type-archive a:hover {
    background-color: #9a6f5f;
    color: #fff;
}

/* Интро тела форумной карточки */
#index-list .forumcard-intro, #profile-forumcards-list .forumcard-intro  {
    display: -webkit-box;
    -webkit-line-clamp: 2; // количество строк
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Футер тела форумной карточки */
#index-list .forumcard-metadata-footer,
#profile-forumcards-list .forumcard-metadata-footer {
    font-family: var(--second-font-family);
    font-size: 12px;
    display: flex;
    justify-content: space-between;
}

#index-list .forumcard-metadata-footer .forumcard-categories,
#profile-forumcards-list .forumcard-metadata-footer .forumcard-categories {
    display: inline-block;
}

#index-list .forumcard-metadata-footer .forumcard-category,
#profile-forumcards-list .forumcard-metadata-footer .forumcard-category {
    margin-right: 11px;
    white-space: nowrap;
}

#index-list .forumcard-metadata-footer .no-category,
#profile-forumcards-list .forumcard-metadata-footer .no-category {
    color: var(--main-color);
}

#index-list .forumcard-metadata-footer .forumcard-quantities,
#profile-forumcards-list .forumcard-metadata-footer .forumcard-quantities {
    display: flex;
}

#index-list .forumcard-metadata-footer .forumcard-quantities i,
#profile-forumcards-list .forumcard-metadata-footer .forumcard-quantities i {
    margin-right: 3px;
}

#index-list .forumcard-metadata-footer .forumcard-quantities span,
#profile-forumcards-list .forumcard-metadata-footer .forumcard-quantities span {
    margin-left: 13px;
}

#index-list .forumcard-metadata-footer .forumcard-categories a,
#index-list .forumcard-metadata-footer .last-online a,
#profile-forumcards-list .forumcard-metadata-footer .forumcard-categories a,
#profile-forumcards-list .forumcard-metadata-footer .last-online a {
    color: var(--main-color);
}

#index-list .forumcard-metadata-footer .forumcard-categories a:hover,
#index-list .forumcard-metadata-footer .last-online a:hover,
#profile-forumcards-list .forumcard-metadata-footer .forumcard-categories a:hover,
#profile-forumcards-list .forumcard-metadata-footer .last-online a:hover {
    color: #fff;
}

#index-list .forumcard-metadata-footer .votes-disabled {
    color: grey;
}

/* ПОЛНАЯ ЗАПИСЬ */
#full-forumcard {
    position: relative;
    padding: 20px;
}

#full-forumcard > .container {
    padding: 0;
}

#full-forumcard .forumcard-header {
    display: flex;
}

#full-forumcard .forumcard-body {
    position: relative;
    margin: 17px 0;
    padding: 10px 17px;
    border-radius: 5px;
    background: #323645;
}

/* Изображения */
#index-list .forumcard-image-inner,
#full-forumcard .forumcard-image-inner,
#profile-forumcards-list .forumcard-image-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

#full-forumcard .forumcard-poster-image,
#full-forumcard .forumcard-screenshot-image,
#full-forumcard .forumcard-placeholder-image {
    width: 100%;
    height: 320px;
    border: 1px solid #fff;
}

#full-forumcard .forumcard-poster-image img,
#full-forumcard .forumcard-screenshot-image img,
#full-forumcard .forumcard-placeholder-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#full-forumcard .forumcard-screenshot-icon-wrapper {
    position: absolute;
    right: 10px;
    bottom: 10px;
}

#index-list .forumcard-screenshot-icon-wrapper,
#profile-forumcards-list .forumcard-screenshot-icon-wrapper {
    position: absolute;
    right: 5px;
    bottom: 5px;
}

#full-forumcard .forumcard-screenshot-icon {
    cursor: pointer;
    font-size: 22px;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    background-color: #fff;
    border-radius: 20px;
    padding: 2px;
}

#index-list .forumcard-screenshot-icon,
#profile-forumcards-list .forumcard-screenshot-icon {
    cursor: pointer;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    background-color: #fff;
    border-radius: 20px;
    padding: 2px;
}

#full-forumcard .forumcard-screenshot-icon.la-camera:before,
#full-forumcard .forumcard-screenshot-icon.la-expand-arrows-alt:before {
    padding: 1px;
}

#index-list .forumcard-screenshot-icon.la-camera:before,
#index-list .forumcard-screenshot-icon.la-expand-arrows-alt:before {
    padding: 0;
}

/* Метаданные */
#full-forumcard .forumcard-metadata {
    display: flex;
    height: fit-content;
}

#full-forumcard .forumcard-metadata .col:first-child {
    padding-right: 15px;
}

#full-forumcard .forumcard-metadata .col {
    position: relative;
    width: 50%;
    word-wrap: break-word;
}

#full-forumcard .forumcard-metadata .metadata-wrapper {
    margin-bottom: 13px;
}

#full-forumcard .forumcard-metadata .metadata-wrapper > div {
    background-color: #323645;
    border-radius: 5px;
    padding: 2px 10px;
    min-height: 29px;
    line-height: 1.7;
}

#full-forumcard .forumcard-metadata .metadata-wrapper:last-child {
    margin-bottom: 0;
}

.forumcard-votes-wrapper .forumcard-votes span,
.forumcard-online-wrapper .forumcard-online span {
    float: right;
    font-size: 13px;
    line-height: 1.8;
}

#full-forumcard .forumcard-title h2 {
    font-size: 15px;
    font-weight: 400;
    line-height: inherit;
    margin: 0;
}

#full-forumcard .forum-link-wrapper i {
    margin-left: 5px;
}

#full-forumcard .forumcard-category {
    white-space: nowrap;
    margin-right: 7px;
}

#full-forumcard .forumcard-category a:after {
    content: ",";
}

#full-forumcard .forumcard-category:last-child a:after {
    content: "";
}

#full-forumcard .edit-forumcard-link i {
    margin-left: 5px;
}

.forum-founded-date,
.forumcard-registrated-date,
.forumcard-online,
.forum-last-online,
.forum-total-users,
.forum-total-topics,
.forum-total-posts,
.forum-users-24h-record,
.forum-users-24h-record-datetime {
    font-size: 14px;
    line-height: 1.75;
}

#full-forumcard .full-forumcard-vote-icon {
    float: none;
    font-size: 12px;
    margin-left: 4px;
}

/* интро */
#full-forumcard .forumcard-intro {
    margin-bottom: 10px;
}

/* ТАБЫ */
#tab-links-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    margin-bottom: 15px;
    padding-top: 10px;
    border-top: 1px solid var(--background-dark-color);
}

#tab-links-wrapper a {
    font-family: var(--main-font-family);
    font-size: 12px;
    text-transform: uppercase;
    padding: 7px;
}

#tab-links-wrapper a.active {
    color: var(--main-color);
}

#tab-links-wrapper a.not-active {
    color: #fff;
}

/* КОММЕНТАРИИ И ОТЗЫВЫ */
#comments #comments-list {
    margin-left: 20px;
}

#comments-list .comment,
#reviews-list .review {
    position: relative;
    padding: 10px 18px;
    margin-bottom: 13px;
    border-radius: 10px;
    background-color: var(--background-light-color);
}

#comments-list .comment-header,
#comments-list .comment-footer,
#reviews-list .review-header,
#reviews-list .review-footer {
    font-family: var(--second-font-family);
    font-size: 12px;
    display: flex;
    align-items: baseline;
}

#comments-list .comment-author,
#reviews-list .review-author {
    font-weight: 600;
}

#comments-list .comment-date,
#reviews-list .review-date {
    font-family: var(--second-font-family);
    font-size: 12px;
}

#comments-list .comment-text,
#reviews-list .review-text {
    margin-top: 10px;
    margin-bottom: 10px;
}

#comments-list .comment-text p,
#reviews-list .review-text p {
    margin-bottom: 7px;
}

#comments-list .comment-author,
#comments-list .comment-edit,
#comments-list .comment-date,
#reviews-list .review-author,
#reviews-list .review-edit,
#reviews-list .review-date {
    margin-right: 10px;
}

#comments-list .comment-edit,
#reviews-list .review-edit {
    margin-left: auto;
}

#comments-list .show-replies-link {
    position: relative;
    font-size: 14px;
    color: lightgrey;
    margin-bottom: 20px;
    padding-top: 8px;
    padding-left: 8px;
    cursor: pointer;
}

#comments-list .show-replies-link span {
    font-size: 13px;
}

#comments-list .comment .hide-replies-button-wrapper {
    position: absolute;
    top: 0;
    height: 100%;
    cursor: pointer;
}

#comments-list .show-replies-link .hide-replies-button-wrapper {
    position: absolute;
    top: 0px;
    height: 25px;
    cursor: pointer;
}

#comments-list .hide-replies-button {
    margin-top: 9px;
    margin-right: 26px;
    height: 26px;
    background: url('/public/img/style-images/dot.png') repeat-x;
}

#comments-list .comment:before,
#comments-list .show-replies-link:before {
    content: "\f111";
    font-family: var(--icon-font-family);
    color: lightgray;
    position: absolute;
    font-size: 11px;
    top: 12px;
    left: -20px;
}

#reviews-list .review-footer {
    display: flex;
    justify-content: flex-end;
    height: 15px;
    align-items: flex-end;
}

#comments-list .comment-moderator {
    color: var(--main-color);
    font-size: 12px;
}

#comments .no-content,
#reviews .no-content {
    text-align: center;
    font-style: italic;
}

/* форма ответа */
#full-forumcard #comment-form,
#full-forumcard #review-form {
    margin-top: 15px;
    margin-bottom: 22px;
}

#full-forumcard input[type="submit"] {
    margin-top: 15px;
}

#full-forumcard #comment-form-cancel,
#full-forumcard #edit-form-cancel {
    font-size: 13px;
    margin-bottom: 10px;
    display: inline-block;
}

/* СТАТИСТИКА ОНЛАЙНА*/
#statistics {
    padding: 20px;
}

#statistics .history-online {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1.5px solid var(--background-dark-color);
}

#statistics .history-online-title h2,
#newest-forums #newest {
    font-family: var(--second-font-family);
    font-size: 13px;
    color: lightgrey;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 15px;
}

#statistics .history-online-links {
    text-align: center;
    margin-top: 5px;
    margin-bottom: -14px;
    min-height: 20px;
}

#statistics .delete-history-online,
#statistics .rollback-history-online,
#statistics .load-online {
    margin-right: 15px;
    font-size: 13px;
}

#statistics .history-online-chart {
    border: 1px solid lightgrey;
    display: flex;
}

#statistics #curve_chart {
    width: 99.9%;
}

/* метаданные страницы статистики онлайна */
#statistics .forum-statistics .col {
    position: relative;
    width: 33%;
    word-wrap: break-word;
    padding: 0 10px;
}

#statistics .forum-statistics .metadata-wrapper {
    margin-bottom: 13px;
}

#statistics .forum-statistics .metadata-wrapper > div {
    background-color: #323645;
    border-radius: 5px;
    padding: 2px 10px;
}


#statistics .forum-statistics .metadata-wrapper:last-child {
    margin-bottom: 0;
}

/* СТАТИСТИКА ГОЛОСОВАНИЯ */
#voters {
    margin: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--background-dark-color)
}

#voters .voters-title h2,
#voters .archive-voters-title h2,
#forumcard-banners .forumcard-banners-title h2 {
    font-family: var(--second-font-family);
    font-size: 13px;
    color: lightgrey;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 20px;
}

#voters .voters-title h2,
.voters-list-wrapper .voters-users-list ~ .voters-guests-list {
    margin-top: 5px;
}

#voters .archive-voters-title h2 {
    margin-top: 30px;
}

#voters .voters-title h2 span,
#voters .archive-voters-title h2 span {
    text-transform: lowercase;
}

#voters .back-to-forumcard-link {
    text-align: center;
    margin-top: 15px;
    padding-top: 8px;
}

#voters .voters-list-wrapper {
    padding: 10px 17px;
    border-radius: 5px;
    background: #323645;
}

/* баннеры */
#forumcard-banners {
    margin: 40px 20px 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--background-dark-color)
}

#forumcard-banners .forumcard-vote-banner,
#forumcard-banners .forumcard-small-banner {
    font-family: monospace;
    color: lightgray;
    white-space: nowrap;
    overflow: auto;
    padding: 7px 13px;
    background: #323645;
    border-radius: 5px;
    margin-bottom: 12px;
}

#forumcard-banners .vote-banner-example,
#forumcard-banners .small-banner-example {
    display: flex;
    align-items: center;
}

#forumcard-banners .vote-banner-example {
    margin-bottom: 50px;
}

#forumcard-banners .vote-banner-example a,
#forumcard-banners .small-banner-example a {
    display: inline-block;
    width: 88px;
    float: left;
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 10px;
    border: 1px solid #363535;
}

#forumcard-banners .small-banner-example a {
    width: 80px;
}

#vote .back-to-forumcard-link {
    margin-top: -10px;
    text-align: center;
}

/* СТРАНИЦА РЕДАКТИРОВАНИЯ И ДОБАВЛЕНИЯ КАРТОЧКИ */
#edit-forumcard-form {
    padding: 20px;
}

#edit-forumcard-form .back-to-forumcard,
#edit-forumcard-form .delete-forumcard,
#add-forumcard-form .back-to-forumcard,
#add-forumcard-form .delete-forumcard {
    float: right;
    margin-left: 20px;
}

#edit-forumcard-form #posterThumb,
#edit-forumcard-form #screenshotThumb,
#add-forumcard-form #posterThumb,
#add-forumcard-form #screenshotThumb,
#add-forumcard-form #posterPrev,
#edit-forumcard-form #posterPrev,
#add-forumcard-form #screenshotPrev,
#edit-forumcard-form #screenshotPrev {
    display: inline-block;
    object-fit: cover;
    border: 1px solid lightgrey;
    width: 75px;
    height: 75px;
    margin-right: 15px;
}

#edit-forumcard-form textarea#intro,
#add-forumcard-form textarea#intro {
    width: 100%;
}

#edit-forumcard-form input[type="file"]::file-selector-button,
#add-forumcard-form input[type="file"]::file-selector-button {
    margin-right: 10px;
}

#edit-forumcard-form .poster-field-inner,
#edit-forumcard-form .screenshot-field-inner,
#add-forumcard-form .poster-field-inner,
#add-forumcard-form .screenshot-field-inner {
    display: flex;
    align-items: center;
    min-height: 80px;
}

#edit-forumcard-form input[type="submit"],
#add-forumcard-form input[type="submit"] {
    margin-top: 0;
}

/* СТРАНИЦА ПРОФИЛЯ */
#profile-user-cabinet,
#add-forumcard-form,
#change-password-form {
    padding: 20px;
}

/* АДМИНКА */
#user-list,
#category-list,
#ban-list,
#online-logs,
#error-logs,
#edit-user-form,
#edit-category-form,
#vote-logs,
#user-online {
    padding: 20px;
    max-height: 690px;
    overflow: auto;
}

#user-list,
#user-online {
    max-height: 730px;
}

#user-list > table,
#category-list > table,
#ban-list > table,
#online-logs > table,
#error-logs > table,
#edit-user-form > table {
    margin-top: -10px;
}

#edit-user-form .form-wrapper .input-wrapper {
    margin-bottom: 15px;
}

#category-list .add-category {
    margin-top: 25px;
}

#online-logs .online-logs-links a,
#error-logs .reset-logs-links a,
#vote-logs .vote-logs-links a {
    margin-right: 15px;
    font-size: 13px;
}

#online-logs table,
#error-logs table {
    margin-bottom: 10px;
}

#category-list .form-wrapper input[type="submit"],
#edit-category-form .form-wrapper input[type="submit"] {
    margin-left: 5px;
}

#edit-category-form .back-link {
    margin-top: 10px;
    margin-left: 5px;
    display: block;
}

/* ПОЛНОЭКРАННЫЕ СТРАНИЦЫ */
#full-display-wrapper,
#error-page,
#dev-page,
#prod-page,
#tech-page {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: var(--background-main-color);
}

#full-display-wrapper .error {
    text-align: center;
    max-width: 340px;
    margin: 0 2px 10px;
}

#login-form,
#pass-rec-form,
#reg-form,
#info-msg {
   margin-top: -50px; 
}

#login-form .navi-links,
#pass-rec-form .navi-links,
#reg-form .navi-links,
#info-msg .navi-links,
#error-page .navi-links,
#vote-form .navi-links {
    margin-bottom: 10px;
    font-size: 14px;
    display: flex;
    justify-content: center;
}

#login-form form,
#pass-rec-form form,
#reg-form form,
#vote-form form {
    background-color: var(--background-light-color);
    padding: 15px 20px 20px;
    border-radius: 10px;
}

#login-form form {
    padding-bottom: 13px;
}

#login-form .label,
#pass-rec-form .label,
#reg-form .label,
#vote-form .label {
    text-align: center;
    margin-bottom: 10px;
}

#login-form .form-wrapper .input-wrapper,
#pass-rec-form .form-wrapper .input-wrapper,
#reg-form .form-wrapper .input-wrapper {
    margin-bottom: 15px;
}

#login-form .form-wrapper .input-wrapper:last-child {
    margin-bottom: 0px;
    font-size: 12px;
}

#vote-form input[type="text"],
#login-form input[type="submit"],
#pass-rec-form input[type="submit"],
#reg-form input[type="submit"],
#vote-form input[type="submit"] {
    width: 100%;
}

#login-form .remember-me-wrapper {
    margin-bottom: 10px !important;
    color: #fff;
    font-size: 14px;
}

#login-form .remember-me-wrapper input[type="checkbox"] {
    margin-right: 6px;
}

#login-form .password-recovery-reg-wrapper {
    display: flex;
    justify-content: center;
    font-size: 14px;
    margin-top: 12px;
}

#login-form .password-recovery-reg-wrapper a,
#pass-rec-form .navi-links a,
#reg-form .navi-links a {
    margin: 0 10px;
}

/* страницы с инфо */
#info-msg .redirect-msg,
#error-page .info h1,
#dev-page .info h1,
#prod-page .info h1,
#tech-page .info h1 {
    border-bottom: 1px solid #272936;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

#error-page .info,
#dev-page .info,
#prod-page .info,
#tech-page .info {
    position: relative;
    font-family: var(--main-font-family);
    text-align: left;
    margin: 20px;
}

#error-page .info h1,
#dev-page .info h1,
#prod-page .info h1,
#tech-page .info h1 {
    font-size: 28px;
    line-height: 1.4;
    margin-bottom: 10px;
    text-align: center;
}

#info-msg .redirect-msg .next-vote-date {
    font-size: 14px;
    font-weight: 600;
    margin-left: 5px;
}

#info-msg .redirect-link {
    margin-bottom: 9px;
    font-size: 13px;
    font-style: italic;
}

#info-msg .redirect-timer {
    font-size: 13px;
}

/* СТАТИЧЕСКИЕ СТРАНИЦЫ */
/* faq */
#faq {
    padding: 20px 25px;
}

#faq .question {
    margin-bottom: 5px;
}

#faq .answer {
    margin-bottom: 20px;
}

#faq .question {
    color: var(--main-color);
}

/* голосование */
#vote-form .vote-msg {
    color: #fff;
    text-align: center;
    margin-bottom: 15px;
}

#vote-form .vote-msg .vote-url {
    margin-top: 5px;
    font-weight: 600;
}

/* новые форумы */
#newest-forums {
    padding: 20px 10px;
}

#newest-forums img {
    display: none;
}

#newest-forums tr td:first-child {
    width: 0px;
    text-align: center;
    padding: 10px 15px;
}

#newest-forums tbody > tr > td:last-child {
    text-align: center;
}

#newest-forums tbody, #newest-forums td, #newest-forums tfoot, #newest-forums th, #newest-forums thead, #newest-forums tr {
    padding: 10px 0;
}

/* онлайн пользователей */
#user-online td {
    text-align: center;
}

#user-online tbody > tr > td {
    width: 34%;
}

#user-online tbody > tr > td:first-of-type {
    width: 26%;
    text-align: left;
}

/* ПАГИНАЦИЯ */
.pagination-wrapper {
    display: flex;
    justify-content: center;
}

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

.pagination {
    display: inline-flex;
    margin-top: 8px;
    border-radius: 5px;
    flex-wrap: wrap;
}

.pagination li:first-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.pagination li:last-child {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.pagination li a {
    display: flex;
    height: 43px;
    align-items: center;
    font-size: 17px;
    padding: 12px 17px;
}

.pagination li i {
    font-size: 13px;
}

.pagination .page-item {
    background-color: var(--background-light-color);
    border-right: 1px solid var(--background-dark-color);
    border-top: 1px solid var(--background-dark-color);
}

.pagination .active.page-item {
    background-color: var(--main-color);
    color: #fff;
}

.pagination .page-item:hover a {
    color: #fff;
}

.pagination .page-item:first-child {
    border-left: 0;
}

/* ФУТЕР */
footer {
    position: absolute;
    bottom: 10px;
    width: 100%;
    font-size: 13px;
    padding: 0 25px;
    text-align: center;
    text-transform: lowercase;
}

/* ------------------- ПОДСКАЗКИ (тултипы) ------------------- */
.question-tooltip {
    display: inline-flex;
    font-size: 17px;
    margin-left: 5px;
}

.history-online .question-tooltip {
    margin-left: 0;
}

[data-title] {
    position: relative
}

[data-title]:before {
	content: attr(data-title);
	opacity: 0;
	visibility: hidden;
	z-index: 1000;
	position: absolute;
	top: 2em;
	left: 0%;
	padding: 2px 8px;
	font-size: 12px;
	font-weight: 300;
	white-space: nowrap;
	color: #fff;
	background-image: -moz-linear-gradient(top, #111, #111);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #111), color-stop(1, #111));
	background-image: -webkit-linear-gradient(top, #111, #111);
	background-image: -o-linear-gradient(top, #111, #111);
	background-image: -ms-linear-gradient(top, #111, #111);
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
	border-radius: 3px;
}

[data-title]:hover:before {
	opacity: 1;
	visibility: visible;
	-moz-transition: all 0.2s ease-out 0.75s;
	-webkit-transition: all 0.2s ease-out 0.75s;
	-o-transition: all 0.2s ease-out 0.75s;
	-ms-transition: all 0.2s ease-out 0.75s;
	transition: all 0.2s ease-out 0.75s;
}

/* ------------------- ПРОКРУТКА КОНТЕЙНЕРА ------------------- */
#scrollTop {
    position: absolute;
    top: 0;
}

.scroll-top,
.scroll-bottom {
    padding: 2px 20px 4px;
    border: 1px solid var(--background-dark-color);
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #323645;
}

.scroll-top:hover,
.scroll-bottom:hover {
    color: #fff;
}

.scroll-top {
    position: fixed;
    z-index: 1;
    transform: translateX(968px);
    bottom: calc(40% + 45px);
}

.scroll-bottom {
    position: fixed;
    z-index: 1;
    transform: translateX(968px);
    bottom: 40%;
}

/* ------------------- СТИЛИ CKEDITOR5 ------------------- */
.ck-editor > br {
    display: none !important;
}

.ck-editor .ck.ck-sticky-panel {
    border-top: 1px solid var(--background-dark-color) !important;
    border-left: 1px solid var(--background-dark-color) !important;
    border-right: 1px solid var(--background-dark-color) !important;
}

.ck-editor .ck-editor__editable_inline>:first-child {
    margin-top: 0 !important;
}

.ck-editor .ck.ck-content.ck-editor__editable,
.ck-editor .ck-source-editing-area textarea {
    color: #fff !important;
    border: 1px solid var(--background-dark-color) !important;
    padding: 10px 17px !important;
    background-color: var(--background-darkest-color) !important;
}

.ck-editor .ck-editor__editable,
.ck-editor .ck-source-editing-area {
    /* editing area */
    min-height: 200px !important;
    border-bottom-left-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
}

.ck-editor .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) {
    box-shadow: none !important;
}

/* ------------------- СТИЛИ СЛАЙДЕРА ------------------- */
.slider-styled,
.slider-styled .noUi-handle {
    box-shadow: none;
}

/* Hide markers on slider handles */
.slider-styled .noUi-handle::before,
.slider-styled .noUi-handle::after {
    display: none;
}

.noUi-pips-horizontal {
    height: 0px !important;
}

#slider-date,
#slider-last-online {
    height: 5px;
    border: 0;
}

#slider-date .noUi-connect,
#slider-last-online .noUi-connect {
    background: var(--main-color);
}

#slider-date .noUi-handle,
#slider-last-online .noUi-handle {
    height: 13px;
    width: 13px;
    top: -4px;
    right: -8px;
    border-radius: 9px;
}

#select-date-start,
#select-date-end {
    padding: 4px 6px;
	margin: 15px 0 5px 0;
}

#select-last-online-start,
#select-last-online-end {
	padding: 2px 6px;
	margin: 15px 0 5px 0;
    width: 70px;
}

.screenshot-image-popup .image-close {
    z-index: 100;
}

/* ------------------- СТИЛИ ЛАЙТБОКСА ------------------- */

/* Trigger the style of the popup image */
#screenshot-icon {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
 
#screenshot-icon:hover {opacity: 0.7;}
 
/* Popup background */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding: 25px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}
 
/* Image */
.modal-content {
    margin: auto;
    display: block;
    width: 100%;
    max-width: 1200px;
    border: 1px solid #373737;
}
 
/* Add animation */
.modal-content { 
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}
 
@-webkit-keyframes zoom {
    from {-webkit-transform:scale(0)} 
    to {-webkit-transform:scale(1)}
}
 
@keyframes zoom {
    from {transform:scale(0)} 
    to {transform:scale(1)}
}
 
/* Close button */
.modal .image-close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}
 
.modal .image-close:hover,
.modal .image-close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}
 
/* The width of the picture on the small screen is 100% */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}

/* лоадер */
.loader-wrapper1,
.loader-wrapper2 {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 300px;
}

.loader-wrapper3 {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 1px solid lightgrey;
    border-bottom: 0;
    height: 400px;
}

.loader {
    color: #FFF;
    display: inline-block;
    position: relative;
    font-size: 14px;
    font-family: var(--second-font-family);
    box-sizing: border-box;
}

.loader::after {
    content: '';
    width: 3px;
    height: 3px;
    background: currentColor;
    position: absolute;
    bottom: 8px;
    right: -10px;
    box-sizing: border-box;
    animation: animloader 0.8s linear infinite;
}
  
@keyframes animloader {
    0% {
        box-shadow: 10px 0 rgba(255, 255, 255, 0), 20px 0 rgba(255, 255, 255, 0);
    }
    50% {
        box-shadow: 10px 0 white, 20px 0 rgba(255, 255, 255, 0);
    }
    100% {
        box-shadow: 10px 0 white, 20px 0 white;
    }
}

/* ------------------- БЕГУЩАЯ СТРОКА ------------------- */

@-webkit-keyframes scroll {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
    100% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}
 
@-moz-keyframes scroll {
    0% {
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
    }
    100% {
        -moz-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}
 
@keyframes scroll {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(-100%, 0)
    }
}
 
.announcements {
    display: block;
    height: 35px;
    line-height: 2.5;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
}
 
.announcements span {
    display: inline-block;
    padding-left: 100%;
    -webkit-animation: scroll 20s infinite linear;
    -moz-animation: scroll 20s infinite linear;
    animation: scroll 20s infinite linear;
}

/* ------------------- СТИЛИ КАПТЧИ ------------------- */

.g-recaptcha {
    margin-top: -25px;
    margin-bottom: 13px;
    display: flex;
    justify-content: center;
}

/* АДАПТИВНОСТЬ */
@media (max-width: 1700px) {
    /* прокрутка */
    .scroll-top,
    .scroll-bottom {
        display: none;
    }
}

@media (max-width: 1200px) {
    /* общее */
    body {
        overflow-x: hidden;
    }
    .sidebar-inner {
        padding: 18px 18px 0px;
    }
    .sidebar-inner .sidebar-menu {
        padding: 0 10px 30px;
    }
    .sidebar-inner .logo h1 {
        margin-bottom: 15px;
    }
    #admin-body .table-wrapper {
        overflow-x: auto;
    }
}

@media (max-width: 992px) {
    /* общее - хэдер */
    header {
        padding: 8px 10px;
    }
    /* общее - сайдбар */
    #index-sidebar-form,
    #profile-sidebar,
    #admin-sidebar {
        border-top-right-radius: 20px;
        border-bottom-left-radius: 0;
    }
    #profile-sidebar,
    #admin-sidebar {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }    
    .sidebar-content,
    footer {
        display: none;
        padding: 10px 0;
    }  
    .sidebar-inner #arrows-icons i.la-angle-down {
        display: block;
    }
    #index-sidebar-form .sidebar-inner .col-wrapper.forum-type .col2 {
        margin-left: 49px;
    }
    #index-sidebar-form .sidebar-inner .col-wrapper.forum-category .col2 {
        margin-left: 65px;
    }
    footer {
        position: unset;
        margin-bottom: 15px;
    }
    /* общее - тело */  
    header {
        border-top-right-radius: 0;
    }
    #index-body,
    #profile-body,
    #admin-body {
        border-top-right-radius: 0;
        border-bottom-left-radius: 20px;
    }
    #index-list {
        margin-bottom: 15px;
        padding: 10px;
        max-height: unset;
    }
    #index-wrapper main, 
    #profile-wrapper main, 
    #admin-wrapper main {
        min-height: auto;
    }
    #full-forumcard,
    #statistics,
    #edit-forumcard-form,
    #profile-user-cabinet,
    #add-forumcard-form,
    #faq,
    #user-list, 
    #category-list, 
    #ban-list, 
    #online-logs, 
    #error-logs, 
    #edit-user-form {
        max-height: unset;
        padding: 20px 15px;
    }
    #user-online {
        max-height: unset;
        padding: 20px 12px;
    }
    #newest-forums {
        padding: 20px 1px;
    }
    /* меню */
    .desktop-menu {
        display: none;
    }
    .bars-icons {
        display: flex;
    }
    /* подменю */
    .sub-menu {
        padding: 7px 0px;
    }
    .category-query,
    .author-query,
    .search-query,
    .type-query {
        border-right: 1px solid lightgray;
        padding-right: 10px;
        margin-right: 10px;
    }
    .sort-by-links {
        margin: auto;
    }
    /* форумные карточки */
    #index-list .forumcard, 
    #profile-forumcards-list .forumcard {
        display: block;
        height: auto;
        padding: 17px;
    }
    #index-list .forumcard .forumcard-image, 
    #profile-forumcards-list .forumcard .forumcard-image {
        margin-bottom: 10px;
        width: -webkit-fill-available;
    }
    #index-list .forumcard-poster-image, 
    #profile-forumcards-list .forumcard-poster-image {
        object-fit: cover;
        width: 100%;
        height: 100%;
    }
    #index-list .forumcard-poster-image img,
    #profile-forumcards-list .forumcard-poster-image img,
    #index-list .forumcard-screenshot-image img,
    #profile-forumcards-list .forumcard-screenshot-image img {
        width: 100%;
        height: calc((100vw/2 + 25px) * 1.34);
    }
    #index-list .forumcard-body, 
    #profile-forumcards-list .forumcard-body {
        padding: 0 !important;
    }
    #index-list .forumcard-metadata-header, 
    #profile-forumcards-list .forumcard-metadata-header {
        flex-direction: column;
    }
    #index-list .forumcard-metadata-header span, 
    #profile-forumcards-list .forumcard-metadata-header span {
        width: 100%;
        text-align: center;
        margin: 0px 0px 3px !important;
    }
    #index-list .forumcard-metadata-footer .forumcard-categories,
    #profile-forumcards-list .forumcard-metadata-footer .forumcard-categories {
        word-break: break-all;
        width: 50%;
        display: flex;
        flex-wrap: wrap;
    }
    #index-list .forumcard-metadata-footer .forumcard-quantities,
    #profile-forumcards-list .forumcard-metadata-footer .forumcard-quantities {
        width: 50%;
        display: flex;
        justify-content: flex-end;
    }
    #index-list .forumcard-intro, 
    #profile-forumcards-list .forumcard-intro {
        margin: 5px 0 10px;
    }
    #index-list .forumcard-screenshot-icon-wrapper, 
    #profile-forumcards-list .forumcard-screenshot-icon-wrapper {
        font-size: 25px;
        right: 10px;
        bottom: 20px;
    }
    /* полная страница */
    #full-forumcard .forumcard-image {
        margin-bottom: 17px;
    }
    #full-forumcard .forumcard-metadata {
        display: block;
    }
    #full-forumcard .forumcard-metadata .col {
        width: 100%;
        margin-top: 13px;
    }
    #full-forumcard .forumcard-metadata .col:first-child {
        padding-right: 0;
    }
    #full-forumcard .forumcard-body {
        padding: 5px 10px;
    }
    .back-to-forumcard-link {
        margin-bottom: 10px;
    }
    #index-list .forumcard-screenshot-image {
        display: contents;
    }
    /* комментарии */
    #comments-list .comment-header, 
    #comments-list .comment-footer, 
    #reviews-list .review-header, 
    #reviews-list .review-footer,
    #comments-list .comment-date, 
    #reviews-list .review-date {
        font-size: 12px;
    }
    #comments-list .comment-edit, 
    #reviews-list .review-edit {
        position: absolute;
        bottom: 7px;
        right: 62px;
    }
    #comments-list .comment-delete,
    #reviews-list .review-delete {
        position: absolute;
        bottom: 7px;
        right: 17px;
    }
    #comments-list .comment, 
    #reviews-list .review {
        padding: 8px 16px;
    }
    #reviews-list .review-footer {
        display: flex;
        justify-content: flex-start;
    }
    #reviews-list .review-footer i {
        line-height: 1.7;
    }
    #add-forumcard-form .buttons-inner,
    #edit-forumcard-form .buttons-inner {
        display: flex;
        min-height: 75px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
    }
    /* страница статистики */
    #statistics .history-online-links {
        display: flex;
    }
    #statistics .forum-statistics .col-sm-6 {
        padding-top: 12px;
    }
    /* поиск */
    #search {
        left: 50px;
        right: 50px
    }
    #search input[type="text"] {
        min-width: 100%;
    }
    #search .button {
        display: none !important;
    }
    /* модальное окно */
    *::-webkit-scrollbar {
        height: 5px;
        width: 5px;
    }
    .modal .image-close {
        right: 15px;
    }
    
    #index-list .forumcard-image-inner,
    #full-forumcard .forumcard-image-inner,
    #profile-forumcards-list .forumcard-image-inner {
        width: 100%;
        object-fit: cover;
    }

}

@media (max-width: 576px) {
    #statistics #curve_chart {
        width: 100%;
    }
}