/* BASIC LAYOUT
----------------------------------------------- */
.wrapper {min-width: 320px; position: relative;}
.wrapper-container {max-width: var(--max-width); margin: 0 auto; position: relative; z-index: 20;}
.cols {display: grid; grid-template-columns: 280px minmax(0,1fr); margin: -60px 0; min-height: 80vh;
	background-color: var(--bg); border-radius: 20px; position: relative; z-index: 10;}
.col-main {padding: 40px var(--indent); border-radius: 0 20px 20px 0; background-color: var(--bg-2);}
.header {background: #28a176 url(../images/bg.webp) center center / 100% auto no-repeat; 
	padding-top: 40px; padding-bottom: 100px; gap: 20px;}
.footer {background-color: var(--bg-3); color: rgba(255,255,255,0.8); 
	padding-bottom: 40px; padding-top: 100px; gap: 20px; line-height: 1.6;}
.footer .btn {background: rgba(255,255,255,0.1);}
.bg-block {background-color: var(--bg); border-radius: 20px; padding: 40px;}

#scrolltop {position: fixed; width: 60px; height: 60px; line-height: 60px; right: 10px; bottom: 10px;
	z-index: 990; display: none; background-color: var(--bg); color: var(--tt-lighter); 
	cursor: pointer; font-size: 24px; border-radius: 50%; text-align: center; box-shadow: var(--bsh-accent);}
.rkl {text-align: center;}
.rkl--wide {margin-bottom: 20px;}
.rkl--after-sect {margin-top: -20px;}
.rkl--after-title {margin: 0px; margin-top: 10px;}


/* HEADER, NAV
----------------------------------------------- */
.logo {display: block; height: 40px; line-height: 40px; letter-spacing: 1px;
	background: url(../images/logo.svg) 0 center / 40px no-repeat; padding-left: 50px; text-transform: uppercase; 
	color: #fff !important; font-weight: 700; font-size: 22px; min-width: 240px; margin-right: 20px;}
.logo span:not(.logo__domain) {display: inline-block; border-radius: 4px; padding: 0 6px; margin: 0 2px; 
	line-height: 1.4; background: var(--gradient-accent); box-shadow: var(--bsh-accent);}
.logo__domain {font-weight: 400; font-size: 0.6em;}

.header__menu {background-color: rgba(0,0,0,0.3); border-radius: 10px; overflow: hidden;}
.header__menu a {color: #fff; font-weight: 600; display: flex; align-items: center; height: 40px; 
	padding: 0 20px; gap: 10px; text-transform: uppercase; justify-content: center;}
.header__menu li:last-child a {background: var(--gradient-accent); box-shadow: var(--bsh-accent);}

.header__search-box {position: relative;}
.header__search input, .header__search input:focus {border-radius: 10px; box-shadow: none; 
	background-color: var(--bg); color: var(--tt); font-size: 16px; padding: 0 50px 0 20px;}
.header__search input:not(:focus)::placeholder {color: var(--tt); opacity: 0.6; font-size: 14px;} 
.header__search button {position:absolute; right: 0; top: 0; width: 50px; padding: 0; 
	background: none; color: var(--tt); font-size: 18px; opacity: 0.6;}

.theme-toggle {display: inline-flex; justify-content: space-between; align-items: center; cursor: pointer;
	background-color: rgba(0,0,0,0.3); height: 40px; border-radius: 10px; padding: 5px 0;}
.theme-toggle li {cursor: pointer; width: 30px; height: 30px; line-height: 30px; 
	border-radius: 6px; text-align: center; color: #fff; margin: 0 5px;} 
.dt-is-active .theme-toggle li:last-child, body:not(.dt-is-active) .theme-toggle li:first-child 
{background: var(--gradient-accent); box-shadow: var(--bsh-accent); color: #fff;}
	

/* SECTION
----------------------------------------------- */
.sect:not(:last-child) {margin-bottom: 40px;}
.sect__header {margin-bottom: 20px;}
.sect__title {font-size: 22px; font-weight: 600; gap: 10px; flex-wrap: nowrap;}
.sect__link {height: 30px; border-radius: 10px; padding: 0 10px; font-size: 12px; 
	display: flex; align-items: center; gap: 10px; text-transform: uppercase; font-weight: 600; 
	background: var(--gradient-accent); box-shadow: var(--bsh-accent); margin-left: 10px;}
.sect--bg {background-color: var(--bg-3); padding: 40px var(--indent); 
	margin-left: var(--indent-negative); margin-right: var(--indent-negative);}
body:not(.dt-is-active) .sect--bg {--tt: #fff; --tt-lighter: #bdbfc5;}
.sect--bg .sect__title {color: #fff; margin-bottom: 40px;}
.descr {color: var(--tt-lightest); line-height: 1.6; font-size: 13px; margin-bottom: 5px;}
.descr > * + * {margin-top: 10px;}
.descr h1, .descr h2, .descr h3 {font-size: 17px; font-weight: 400; color: var(--tt); line-height: 1.3;}
.descr a {text-decoration: underline; color: var(--accent);}
.descr ul  {margin-left: 20px; line-height: 1.7;}
.descr ul li {position: relative; padding-left: 25px;}
.descr ul li::before {content:"\f00c"; font-weight: 900; font-family:'Font Awesome 5 Pro'; 
	color: var(--accent); position: absolute; left: 0; top: 0;}
.speedbar {font-size: 12px; color: rgba(255,255,255,0.66); margin: -20px 0 -35px; display: inline-block; max-width: 100%;
	background: var(--gradient-accent); border-radius: 20px 20px 0 0; padding: 7px 20px 40px 20px; font-weight: 700;}
.speedbar a {color: #fff;}


/* SIDEBAR
----------------------------------------------- */
.side-block {margin-bottom: 40px; padding: 0 20px;}
.side-block__title {font-weight: 600; font-size: 17px; margin-bottom: 20px; 
	display: flex; align-items: center; gap: 10px; white-space: nowrap;}
.side-block__title .fas, .sect__title .fas, .fdl-btn__icon {width: 30px; height: 30px; border-radius: 50%; font-size: 14px; 
	color: #fff; background-color: var(--accent); box-shadow: inset 0 .25rem .5rem 0 rgba(0,0,0,0.15);
	display: grid; place-items: center; flex-shrink: 0;}
.yellow-icon .fas {background: linear-gradient(180deg,#FEDE4A 0%,#F8B035 100%);
	box-shadow: 0 .25rem .5rem 0 rgba(251,205,66,.3);}
.violet-icon .fas {background: linear-gradient(180deg,#9B54E8 0%,#7126C1 100%);
	box-shadow: 0 .25rem .5rem 0 rgba(146,72,225,.3);}
.red-icon .fas {background-image: linear-gradient(180deg,#FF715C 0%,#F74A2F 100%);
	box-shadow: 0 .25rem .5rem 0 rgba(255,89,64,.3);}
.blue-icon .fas {background-image: linear-gradient(180deg,#38B9E6 0%,#368BE1 100%);
	box-shadow: 0 .25rem .5rem 0 rgba(55,169,228,.3);}
.side-block--nav {background-color: var(--accent); color: #fff; 
	border-radius: 20px 0 0 20px; overflow: hidden; padding: 0;}
.side-block--nav .side-block__title {height: 60px; padding-left: 20px; 
	background: var(--gradient-accent); margin: 0;}

.side-nav li {position: relative;}
.side-nav span {position: absolute; right: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; 
	background-color: var(--accent-darker); color: rgba(255,255,255,0.8); font-size: 12px; 
	display: inline-block; border-radius: 4px; padding: 3px 6px;}
.side-nav a {display: block; color: #fff; padding: 10px 20px;}
.side-nav li {border-top: 1px solid rgba(0,0,0,0.13); box-shadow: inset 0 1px rgba(255,255,255,0.15);}

.popular-list {display: grid; gap: 20px; grid-template-columns: repeat(auto-fill,minmax(240px,1fr));}
.popular-item__img {margin-right: 10px; width: 50px; height: 50px; border-radius: 10px;}
.popular-item__meta {font-size: 12px; margin-top: 5px; color: var(--tt-lighter);}


/* SHORT ITEM
----------------------------------------------- */
.thumb {position: relative; background-color: var(--bg); border-radius: 20px; 
	overflow: hidden; padding-top: 30px; text-align: center; padding-bottom: 60px;}
.thumb::before {height: 3.75rem; left: .875rem; right: .875rem; top: .875rem; content: ""; pointer-events: none;
	position: absolute; background-size: 1rem 1rem; opacity: .075; background-image: var(--entry-pattern);}
.thumb::after {content: ""; position: absolute; left: 50%; top: 0; pointer-events: none;
	transform: translate(-50%,1rem); width: 12rem; padding-top: 12rem;
	background-image: radial-gradient(closest-side,rgba(23,43,61,0.2) 0,rgba(23,43,61,0) 100%);}
.thumb__img {width: 120px; height: 120px; margin: 0 auto; position: relative; overflow: hidden; z-index: 5;}
.thumb__img img {width: 100%; height: 100%; object-fit: contain;
	position: absolute; left: 0; top: 0; border-radius: 20px;}
.thumb__label {position: absolute; left: 50%; top: 20px; border-radius: 10px; padding: 3px 10px; 
	font-size: 11px; letter-spacing: 1px; font-weight: 600; z-index: 10; transform: translateX(-50%);
	background-color: #0294d9; color: #fff; text-transform: uppercase;}
.thumb__label.mod {background-color: #9338d3;}
.thumb__label.upd {background-color: #438b88;}
.thumb__label.new {background-color: #eb3b3b;}
.thumb__desc {padding: 20px 15px 0 15px;}
.thumb__title a {font-size: 15px; display: block; font-weight: 600; margin-bottom: 15px;}
.thumb__title a::before {content: ''; position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 15;}
.thumb__text {font-size: 13px; color: var(--tt-lighter); margin-bottom: 16px; -webkit-line-clamp: 3;}
.thumb__meta {position: absolute; left: 0; right: 0; bottom: 0; padding: 0 15px; color: var(--tt-lighter);
	border-top: 1px solid var(--bdc); line-height: 48px; font-size: 12px; font-weight: 600;}
.thumb__version {padding-left: 24px; background: url(../images/android.svg) 0 center / auto 18px no-repeat;}
.thumb__rating-like, .thumb__rating-dislike {padding-left: 24px; position: relative; 
	color: #7BA540; font-weight: 400;}
.thumb__rating-dislike {color: #D51E2A; margin-left: 6px; padding-left: 30px;}
.thumb__rating-like::before, .thumb__rating-dislike::before {content: ''; position: absolute; left: 0; top: 0;
	background: url(../images/like.svg) 0 12px / 18px 18px no-repeat; width: 24px; height: 100%;}
.thumb__rating-dislike::before {background-image: url(../images/dislike.svg); 
	transform: rotate(180deg); background-position: 0 11px;}
.thumb--related {padding-bottom: 40px;}
.thumb--related .thumb__version {position: absolute; left: 50%; bottom: 15px; border-radius: 10px; padding: 3px 10px; 
	z-index: 10; transform: translateX(-50%); padding-left: 30px; background-position: 6px center;
	box-shadow: var(--bsh-accent); font-size: 12px; font-weight: 600; color: var(--tt-lighter); background-color: var(--bg);}


/* QUEST ITEM
----------------------------------------------- */
.quest-wrap {margin-bottom: 10px; background-color: var(--bg); box-shadow: var(--bsh-accent); line-height: 1.6;
	border-radius: 10px; padding: 20px; padding-right: 160px; position: relative; color: var(--tt-lightest)}
.quest-head {font-size: 18px; font-weight: 600; margin-bottom: 10px; line-height: 1.4;}
.quest-body a {position: absolute; right: 0; top: 0; height: 100%; width: 140px; border-radius: 0 10px 10px 0; 
	background: var(--gradient-accent); box-shadow: var(--bsh-accent); text-transform: uppercase; font-weight: 600;
	display: flex; align-items: center; justify-content: center; flex-direction: column;
	padding: 10px; color: #fff; letter-spacing: 1px;}
.quest-body .fas {margin-top: 10px; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; 
	background: var(--gradient-accent-reverse); box-shadow: inset 0 .25rem .5rem 0 rgba(0,0,0,0.15);}


/* FOOTER, PAGINATION
----------------------------------------------- */
.pagination {text-align: center; padding-top: 20px;}
.pagination__btn-loader a, .pagination__btn-loader span {display: inline-flex; justify-content: center; align-items: center; 
	height: 50px; padding: 0 50px; background: var(--gradient-accent); color: var(--tt); width: 100%; max-width: 400px;
	font-weight: 600; text-transform: uppercase; letter-spacing: 2px; 
	border-radius: 10px; margin-bottom: 20px; color: #fff;}
.pagination__pages {gap: 10px;}
.pagination__pages a, .pagination__pages span {display: grid; place-items: center; height: 40px;
	padding: 0 10px; min-width: 40px; font-size: 16px; background-color: var(--bg); border-radius: 10px;}
.pagination__pages span:not(.nav_ext) {background: var(--accent); color: #fff;}
.pagination__btn-loader > span {display: none;}

/* INNER PAGE
----------------------------------------------- */
.page__main {background-color: var(--bg); padding: 20px; border-radius: 20px;}
.page__header {display: grid; grid-template-columns: 210px minmax(0,1fr) 210px; gap: 20px 20px; margin-bottom: 40px;
	grid-template-areas: "ptitle ptitle ptitle" "pposter plist pctrl" "pposter prating pctrl"; align-items: start;}
@media screen and (max-width: 740px) {
	.page__header {margin-bottom: 15px;}
    }
.page__header-title {grid-area: ptitle;}
.page__poster {grid-area: pposter;}
.page__list {grid-area: plist; padding-right: 20px;}
.page__rating {grid-area: prating;}
.page__ctrl {grid-area: pctrl;}
.page__poster.thumb {box-shadow: var(--bsh-accent); padding: 30px 0 60px 0 !important;}
.page__poster::after {opacity: 1 !important;}
.page__poster .thumb__version {left: 20px; top: 10px; bottom: auto; transform: none;}

.page__header h1 {font-weight: 700; font-size: 24px; text-transform: uppercase; line-height: 1.3;}
.page__header h1 a {margin-left: 10px; font-size: 15px; color: var(--tt-lighter);}
.page__ctrl .btn {border-radius: 10px; height: 60px; text-transform: uppercase; width: 100%; font-weight: 600;}
.page__ctrl > a:not([class]), .page__back {background-image: linear-gradient(180deg,#38B9E6 0%,#368BE1 100%); color: #fff; 
	height: 60px; padding: 0 20px; border-radius: 10px; margin-top: 20px; font-weight: 600;
	display: flex; align-items: center; justify-content: center; text-transform: uppercase; width: 100%;}

.page__list {display: grid; grid-gap: 10px 20px;;}
.page__list li {display: flex; justify-content: space-between; position: relative;}
.page__list li > span:first-child {color: var(--tt-lighter); display: inline-flex; align-items: center;
	flex: 1 1 0; min-width: 100px; max-width: 100%; margin-right: 10px; white-space: nowrap;}
.page__list li > span:first-child::after {content: ''; border-top: 2px dotted rgba(0,0,0,0.1); 
	flex: 1 1 0; min-width: 10px; max-width: 100%; margin-left: 10px;}
.page__list li a {color: var(--accent); text-decoration: underline;}

.page__rating {position: relative; align-self: end; gap: 10px;}
.page__rating a {background-color: var(--bg-2); color: var(--tt-lightest); display: flex; align-items: center;
	border-radius: 20px; gap: 20px; padding-right: 20px;}
.page__rating a .fas {display: block; width: 40px; height: 40px; border-radius: 50%; text-align: center; 
	line-height: 40px; font-size: 18px; background-color: #91c523; color: #fff;}
.page__rating a + a .fas {background-color: #fb3832; transform: scale(-1,1);}
.page__rating-bar {position: absolute; left: 20px; right: 20px; bottom: 15px; height: 30px; border-radius: 15px; overflow: hidden; 
	background: repeating-linear-gradient(45deg,#e2332d,#e2332d 10px,#fb3832 10px,#fb3832 20px);}
.page__rating-bar-progress {position: absolute; left: 0; top: 0; height: 100%; width: 50%; background: #6ab04c; 
	background: repeating-linear-gradient(45deg,#57913e,#57913e 10px,#6ab04c 10px,#6ab04c 20px);}
.page__rating-likes {position: absolute; z-index: 5; left: 20px; right: 20px; bottom: 15px; line-height: 30px; 
	text-align: center; font-size: 14px; color: #fff; white-space: nowrap;}
.page__rating-likes i {font-style: normal; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;}
.page__rating-likes span, .page__rating-votes {display: none;}

.sect__tabs {gap: 10px;}
.sect__tabs div {height: 34px; line-height: 34px; border-radius: 10px; padding: 0 20px; font-weight: 600;
	background-color: var(--bg-2); cursor: pointer; text-transform: uppercase; text-align: center;}
.sect__tabs div.is-active {background: var(--gradient-accent); box-shadow: var(--bsh-accent); color: #fff;}
.quest-full {margin-bottom: 10px; padding-left: 26px; position: relative; font-size: 16px;}
.quest-full::before {content:"\f059"; font-family:'Font Awesome 5 Pro'; 
	position: absolute; left: 0; top: 2px; color: var(--accent);}
.quest-full a {text-decoration: underline; font-weight: 600; color: var(--accent);}
.page__screens {white-space:nowrap; overflow-y:hidden; overflow-x:auto; min-height: 160px;}
.page__screens a, .page__screens > img {display:inline-block; vertical-align:top; margin-right:10px; overflow:hidden;}
.page__screens img {max-width:290px; max-height:300px;}
.page__screens a img {display:block;}
.page__screens br {display:none;}
.scroller__content {scrollbar-width: thin; scrollbar-color: var(--accent) var(--bg-2); padding-bottom: 10px;}
.scroller__content::-webkit-scrollbar {width: 12px; height: 8px;}
.scroller__content::-webkit-scrollbar-thumb {border-radius: 0; background-color:var(--accent); border: 0;}
.scroller__content::-webkit-scrollbar-track {background-color:var(--bg-2);}

.page__dl {margin: 0 -20px; padding: 20px; color: #fff; border-radius: 0 0 20px 20px; margin-bottom: -20px;}
.page__dl .sect__content > b {margin-bottom: 10px; display: block;}
.page__dl-desc {padding: 15px; margin-bottom: 10px; line-height: 1.6; 
	background-color: #e8eaf6; color: #1A237E;}
.page__dl .sect__title {margin-bottom: 20px;}
.fdl-btn-gp {margin-top: 10px; padding: 10px 15px; font-size: 16px; font-weight: 600; padding-left: 56px;
	background: url(../images/gplay.svg) 15px center / 30px no-repeat; background-color: var(--bg); 
	display: block; color: #444; border-radius: 10px;}
.fdl-btn:not(:last-child) {margin-bottom: 10px;}
.fdl-btn {background: var(--gradient-accent); box-shadow: var(--bsh-accent); color: #fff; 
	border-radius: 10px; padding: 10px 15px; line-height: 1.4; display: block;}
.fdl-btn__header {gap: 10px; font-weight: 600; font-size: 16px;}
.fdl-btn__footer {gap: 20px; font-size: 12px; margin-top: 6px;}
.fdl-old-title {font-weight: 600; margin-bottom: 10px; padding: 10px; 
	border-radius: 10px; background: rgba(255,255,255,0.2);}
.fdl-old-title span {color: #F8B035; cursor: pointer; text-decoration: underline;}
.fdl-old-hidden .fdl-btn {background: rgba(255,255,255,0.2); box-shadow: none;}
.fdl-old-hidden {margin-bottom: 20px;}
.fdl-btn + br, .page__dl b + br {display: none;}

.dl-page__cols .page__header-title {margin-bottom: 20px; width: 100%;}
.dl-page__col-left {width: 240px; margin-right: 40px;}
.dl-page__cols .thumb--dl {padding: 30px 20px !important;}
.page__back {gap: 10px; margin-top: 30px; padding: 0;}
.thumb--dl .thumb__img {width: 160px; height: 160px;}
.thumb--dl::after {top: 50px;}
.dl-page__cols .page__list {align-content: start;}
.dl-page__btns {margin-top: 20px;}
.not-loaded {overflow: hidden; position: relative; text-align: center; border-radius: 10px;}
.not-loaded div {position: relative; z-index: 1; padding: 20px; font-size: 18px; font-weight: 600;}
.not-loaded::before {background: repeating-linear-gradient(45deg,#ccc,#ccc 10px,#eee 10px,#eee 20px); 
	animation: move 10s infinite linear; animation-direction: alternate; content: ''; width: 200%; height: 100%; 
	position: absolute; left: 0; top: 0%; opacity: 0.5;}
@keyframes move {
	from {transform: translateX(-50%);}
	to {transform: translateX(0%);}
}
.dl-page__btn {gap: 20px; padding: 20px; font-size: 18px; font-weight: 600; border-radius: 10px; word-wrap: break-word;
	background: var(--gradient-accent); box-shadow: var(--bsh-accent); color: #fff; align-items: center;}
.dl-page__btn .fdl-btn__icon {width: 40px; height: 40px;}


/* TEXT BLOCK, TYPOGRAPHY, VIDEO BLOCK
----------------------------------------------- */
.full-text {line-height: 1.7; font-size: 15px; word-wrap: break-word;}
.full-text a {text-decoration: underline; color: var(--accent);}
.full-text img:not(.emoji), .full-text p, .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5, 
.full-text > ul, .full-text > ol, .full-text table, .page__title {margin-bottom: 20px;}
.full-text > img[style*="left"], .full-text > .highslide img[style*="left"] {margin:0 10px 10px 0;}
.full-text > img[style*="right"], .full-text > .highslide img[style*="right"] {margin:0 0 10px 10px;}
.full-text > ul li, .full-text > ol 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(0.66,1.5); transform-origin: 0 0;}
.full-text > ul li + li, .full-text > ol li + li {margin-top: 10px;}
.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 h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 19px; font-weight: 600;}
.full-text iframe {width: 100%; height: 400px; margin-bottom: 20px;}


/* COMMENTS
----------------------------------------------- */
.page__comments {margin-top: 40px;}
.add-comments-form.form {padding: 0; margin-bottom: 20px;}
.add-comments-form .form__input, .add-comments-form__input, .add-comments-form .form__textarea-inside123 textarea, 
.mass_comments_action select {box-shadow: inset 0 0 0 1px var(--bdc); border-radius: 10px;}
.add-comments-form__input {margin-left: 20px;}
.add-comments-form .d-none, .comments_subscribe + br, .mass_comments_action {display: none;}

.comment-item__title {font-weight: 600; font-size: 18px; margin-bottom: 20px;}
.comment-item {margin-bottom: 10px; padding: 20px; border-radius: 10px; background-color: var(--bg);}
.comment-item__img {width: 40px; height: 40px; border-radius: 50%; margin-right: 10px;}
.comment-item__letter {width: 100%; height: 100%; text-transform: uppercase; font-weight: 600; 
	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-lighter); margin-top: 4px; font-size: 12px;}
.comment-item__main {margin: 10px 0 0 0; font-size: 15px;}
.comment-item__reply {cursor: pointer;}
.comment-item__reply a {height: 24px; border-radius: 6px; padding: 0 10px; font-size: 10px; 
	display: flex; align-items: center; gap: 5px; text-transform: uppercase; opacity: 0.66;
	background: var(--gradient-accent); color: #fff; box-shadow: var(--bsh-accent); margin-left: 10px;}
.comment-item__rating {white-space: nowrap; font-size: 14px; margin-left: 10px;}
.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;}


/* ADAPTIVE, MOBILE MENU
----------------------------------------------- */
.overlay {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; 
	opacity: 0.6; background-color: #000; cursor: pointer; display: none;}
.mobile-menu {width: 280px; height: 100%; overflow-x: hidden; overflow-y: auto;
	padding: 0; z-index: 999; position: fixed; left: -320px; top: 0; transition: left .4s; 
	background-color: var(--accent); padding-bottom: 20px;}
.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: 0px; opacity: 1;}
body.mobile-menu-is-opened {overflow: hidden; width: 100%; height: 100%;}
.mobile-menu .side-block {margin: 0;}

@media screen and (max-width: 1220px) {
	body {background-image: none;}
	.wrapper {overflow: hidden;}
	.wrapper-container {max-width:1000px;}
	.col-side .js-this-in-mobile-menu {display: none;}
	.header {padding-top: 20px; padding-bottom: 80px;}
	.header__logo {margin: 0; margin-left: var(--indent); flex: 1 1 0; max-width: 100%; min-width: 100px;}
	.header__btn-menu {font-size: 18px; cursor: pointer; display: flex; padding: 0; width: 40px; border-radius: 10px; 
		box-shadow: inset 0 .25rem .5rem 0 rgba(0,0,0,0.15); margin-right: var(--indent);}
	.header__search {min-width: 100%; padding: 0 var(--indent); order: 9;}
	.content, .cols, .col-main, .col-side, .side-block {border-radius: 0;}
	.cols {grid-template-columns: minmax(0,1fr); grid-template-areas: "main" "side";}
	.col-main {grid-area: main;}
	.col-side {grid-area: side; padding-top: 40px;}
	.footer__logo {margin: 0; margin-left: var(--indent);}
	.footer__counter {margin-right: var(--indent);}
	#scrolltop {width: 40px; height: 40px; line-height: 40px; font-size: 18px;}
}

@media screen and (max-width: 950px) {
	.wrapper-container {max-width:768px;}
	.header {gap: 10px;}
	.header__logo {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
	.footer {justify-content: center;}
	.footer__logo {margin: 0;}
	.footer__text {padding: 0 20px; min-width: 100%; text-align: center;}
	.footer__counter {margin: 0; order: 3;}
	.footer .btn {order: 2;}

	.page__header {grid-template-columns: 210px minmax(0,1fr);
		grid-template-areas: "ptitle ptitle" "pposter pctrl" "pposter prating" "plist plist";}
}

@media screen and (max-width: 760px) {
	.wrapper-container {max-width:640px;}
	.header {padding-bottom: 70px; padding-top: 10px;}
	.header__menu {order: 10; flex-grow: 1; margin-left: var(--indent);}
	.header__menu li {flex-grow: 1;}
	.theme-toggle {order: 10; margin-right: var(--indent);}
	#dle-content, .d-grid {grid-gap: 10px 10px;}
	.pagination {padding-top: 30px;}
	.quest-wrap {padding: 20px; padding-bottom: 0;}
	.quest-head {font-size: 16px;}
	.quest-body a {position: static; width: calc(100% + 40px); margin: 20px -20px 0 -20px; 
		border-radius: 0 0 10px 10px; flex-direction: row; height: auto;}
	.quest-body .fas {margin: 0; margin-left: 10px;}

	.page__main {border-radius: 0; margin-left: var(--indent-negative); margin-right: var(--indent-negative);}
	.page__dl {border-radius: 0;}
	.page__rating a {gap: 10px;}
	.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;}

	.dl-page h1 {text-align: center; font-size: 20px;}
	.dl-page__col-right {min-width: 100%; display: block;}
	.dl-page__col-left {margin: 0 auto; margin-bottom: 20px;}
	
	.add-comments-form__input {min-width: 100%; margin: 0 0 10px 0;}
	.add-comments-form__btn {width: 100%; order: 10;}
	.add-comments-form .form__row--protect .form__caption {width: 100%; margin: 0 0 10px 0;}
	.mass_comments_action, .comment-item__controls, .comment-item__rating-caption {display: none;}
}

@media screen and (max-width: 590px) {
	.wrapper-container {max-width:480px;}
	.header {background-image: url(../images/bg-mob.webp);}
	#dle-content, .d-grid {grid-template-columns: repeat(2,minmax(120px,1fr));}	
}

@media screen and (max-width: 470px) {
	.wrapper-container {max-width: 100%; --indent-negative: -10px; --indent: 10px;}
	.header__menu li a {padding: 0; font-size: 12px;}
	.header__menu .fas {display: none;}
	.sect__title {font-size: 18px;}
	#dle-content, .d-grid {grid-template-columns: repeat(auto-fill,minmax(140px,1fr));}
	.thumb__desc, .thumb__meta {padding-left: 10px; padding-right: 10px;}
	.thumb__img {width: 100px; height: 100px;}
	.thumb__rating-dislike {margin-left: 3px;}
	.thumb:not(.thumb--related) .thumb__version {background-image: none; padding: 0; width: 30px; height: 20px; border-radius: 10px; 
		color: #fff; background-color: var(--tt-lighter); text-align: center; line-height: 20px;}
	.bg-block {padding-left: 20px; padding-right: 20px;}

	.page__main, .speedbar {padding-left: 10px; padding-right: 10px;}
	.page__dl {margin-left: -10px; margin-right: -10px; padding-left: 10px; padding-right: 10px;}
	.page__header h1 {font-size: 18px; text-align: center;}
	.page__header {grid-template-columns: 160px minmax(0,1fr); gap: 10px 10px;}
	.page__ctrl > a:not([class]) {margin-top: 10px;}
	.page__rating-likes {font-size: 12px;}
	.page__rating a {padding-right: 0; flex-grow: 1; font-size: 12px;}
	.page__list {padding-top: 10px;}
	.comment-item {padding-left: 10px; padding-right: 10px;}
	.comment-item__reply .fas {display: none;}
	.comment-item__reply a {padding-left: 5px; padding-right: 5px;}
	.comment-item__rating {font-size: 12px; margin-left: 5px;}
	.page__dl-desc {font-size: 12px; line-height: 1.4;}
	.fdl-btn__footer {gap: 10px;}
	.full-text iframe {width: calc(100% + 40px); max-width: calc(100% + 40px); height: 260px; margin-left: -20px; margin-right: -20px;}
}

