/* Datalife Engine template 
by: redissx (E-mail: redissx@gmail.com, Website: webrambo.ru ),
name: Simple Blog v2,
creation date: 11 september 2019, 
version dle: 12-13
*/

/* SET BASE
----------------------------------------------- */
* {background: transparent; margin: 0; padding: 0; outline: none; border: 0; box-sizing: border-box;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
table {border-collapse: collapse; border-spacing: 0;}
input, select {vertical-align: middle;}
article, aside, figure, figure img, hgroup, footer, header, nav, section, main {display: block;}
img {max-width: 100%; object-position: center;}
.clr {clear: both;}
.clearfix:after {content: ""; display: table; clear: both;}

body {font: 14px Tahoma, Geneva, sans-serif; line-height: normal; padding: 0; margin: 0;        
color: #333333; background: #ffffff; min-height: 100%; width: 100%; font-weight: 400;}
a {color: #222222; text-decoration: none;}
a:hover, a:focus {color: #ff4500; text-decoration: none;}
h1, h2, h3, h4, h5 {font-weight: 800; font-size: 20px; color: #222222;}

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

.button, .btn, .pagi-load a, .up-second li a, .usp-edit a, .qq-upload-button, button:not(.color-btn):not([class*=fr]):not(.li4-btn), 
html input[type="button"], input[type="reset"], input[type="submit"], .meta-fav a, .usp-btn a {
display: inline-block; text-align: center; padding: 0 25px; height: 40px; line-height: 40px;
border-radius: 4px; cursor: pointer; color: #ffffff; background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4); font-size: 14px;}
.button:hover, .btn:hover, .up-second li a:hover, .usp-edit a:hover, .qq-upload-button:hover, 
.pagi-load a:hover, .usp-btn a:hover,
button:not(.color-btn):hover, html input[type="button"]:hover, input[type="reset"]:hover, 
input[type="submit"]:hover, .meta-fav a:hover 
{background: linear-gradient(90deg, #ff69b4, #ff4500, #0066cc); color: #fff; box-shadow: 0 10px 20px 0 rgba(0,0,0,0.1);}
button:active, input[type="button"]:active, input[type="submit"]:active {box-shadow: inset 0 1px 4px 0 rgba(0,0,0,0.2);}

input[type="text"], input[type="password"] {height: 40px; line-height: 40px;
border-radius: 4px; border: 0; padding: 0 15px;}
select {height: 40px; border: 0; padding: 0 15px;}
textarea {padding: 15px; overflow: auto; vertical-align: top; resize: vertical;}
input[type="text"], input[type="password"], select, textarea {width: 100%; background-color: #f5f5f5; color: #333333; 
box-shadow: inset 0 0 0 1px #d0d0d0, inset 1px 2px 5px rgba(0,0,0,0.1);}
select {width: auto;}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus 
{box-shadow: inset 0 0 0 1px #0066cc, inset 1px 2px 5px rgba(0,0,0,0.1);}
input::placeholder, textarea::placeholder {color: #888888; opacity: 0.7; font-size: 14px;} 
input:focus::placeholder, textarea:focus::placeholder {color: transparent}

.img-box, .img-wide, .img-resp, .img-resp-vert, .img-fit {overflow: hidden; position: relative;}
.img-resp {padding-top: 70%;}
.img-resp-vert {padding-top: 140%;}
.img-box img, .img-resp img, .img-resp-vert img {width: 100%; min-height: 100%; display: block;}
.img-resp img, .img-resp-vert img {position: absolute; left: 0; top: 0;}
.img-wide img {width: 100%; display: block;}
.img-fit img {width: 100%; height: %; object-fit: scale-down; object-position: center;}
.nowrap {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.img-wide, .img-responsive, .img-fit-cover {position: relative; overflow: hidden;}
.img-responsive {padding-top: 60%;}
.img-responsive > img, .img-fit-cover img {width: 100%;}
.img-responsive > img {position: absolute; left: 0; top: 0;}
.img-wide img, .img-wide > a, .expand-link {width: 100%; display: block;}
.fx-row, #dle-content {display:-ms-flexbox;display:-webkit-flex;display:flex;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;
-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}
.fx-col {display:-ms-flexbox;display:-webkit-flex;display:flex; 
-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}
.fx-center {-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center}
.fx-middle {-ms-flex-align:center;-webkit-align-items:center;align-items:center}
.fx-start {-webkit-justify-content:flex-start;justify-content:flex-start;}
.fx-first {-ms-flex-order: -1;-webkit-order: -1;order: -1;}
.fx-last {-ms-flex-order: 10;-webkit-order: 10;order: 10;}
.fx-1 {-ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; 
    max-width: 100%; min-width: 50px;}
.fx-between {-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}

b, strong, .fw700 {font-weight: 700;}
.icon-left [class*="fa-"], .icon-left .icon {margin-right: 10px;}
.icon-right [class*="fa-"], .icon-right .icon {margin-left: 10px;}
.hidden, #dofullsearch {display: none;}
.mtitle, .sub-title h1, .form-wrap h1 {margin-bottom: 30px; font-size: 28px !important; font-weight: 800 !important;}
#dle-content > *:not(.short-item) {width: 100%;}
.title, .mtitle, h1, h2, h3, h4, h5 {font-family: 'Montserrat'; font-weight: 600; line-height: 1.3; color: #222222; text-shadow: none;}

/* BASIC GRID
----------------------------------------------- */
.wrap {min-width:320px; position: relative; padding-top: 0px;}
.wrap-center {max-width:1380px; margin:0 auto; position:relative; z-index:20; background-color: #ffffff;}
.header {background-color: #f8f8f8; box-shadow: 0 0 15px 0 rgba(0,0,0,0.1); 
    position: relative; z-index: 990; padding: 15px 30px;}
.content {padding: 30px;}
.col-left, .col-right {width: 280px;}
.col-main {padding: 0 30px; width: calc(100% - 560px); width: -webkit-calc(100% - 560px);}
.footer {background-color: #f0f0f0; color: #666666; line-height: 1.5; padding: 25px 30px;}

#gotop{position:fixed; width:40px; height:40px; line-height:40px; right:10px; bottom:10px;
z-index:990; display:none; background-color:#0066cc; color:#ffffff; cursor:pointer; font-size:18px; 
border-radius:4px; text-align:center; box-shadow: 0 0 15px 0 rgba(0,0,0,0.2);}

/* HEADER
----------------------------------------------- */
.logo {display: block; width: 280px; height: 60px;}
.header-btn:hover, .header-menu > li > a:hover, .header-menu > li:hover > a {color: #ff4500;}
.search-btn {width: 18px; height: 19px; margin-right: 30px; font-size: 18px; cursor: pointer;}
.search-wrap {width: 100%; max-width: 800px; padding: 30px; color: #333333; position: fixed; z-index: 999; 
    top: 0; left: 50%; transform: translateX(-50%); background-color: #f8f8f8;}
.search-title {font-size: 28px; font-weight: 800; color: #222222;} 
.search-close {font-size: 24px; cursor: pointer; color: #666666;}
.search-box {position:relative; margin-top: 30px;}
.search-box input, .search-box input:focus {padding: 0 50px 0 15px; border-radius: 0; box-shadow: none; background-color: #ffffff;}
.search-box button {position:absolute; right:5px; top:0px; z-index:10; width: 30px;
background-color:transparent !important; color:#666666 !important; font-size: 16px !important; padding: 0 !important;}
.header-menu > li {margin-left: 30px; position: relative;}
.header-menu > li > a {display: block; height: 36px; line-height: 36px; font-size: 13px; color: #333333;}
.submenu > a:after {content:"\f107"; font-weight: 400; font-family:'Font Awesome 5 Pro'; margin-left:7px; 
transition: all .2s; display: inline-block;}
.hidden-menu {background-color: #ffffff; box-shadow: 0 10px 30px rgba(0,0,0,0.2); z-index: 100;
position: absolute; left: -10%; top: 100%; width: 240px; pointer-events: none; opacity: 0; transform: translateY(30px);}
.hidden-menu li a {display: block; padding: 15px 30px; border-bottom: 1px solid rgba(0,0,0,0.05); color: #333333;}
.header-menu > li:hover .hidden-menu {pointer-events: auto; opacity: 1; transform: translateY(0px);}
.header-menu > li.submenu:hover > a:after {transform: rotate(-180deg) !important}

/* SECTION, SIDE
----------------------------------------------- */
.sect {margin-bottom: 30px;}
.sect-header {margin-bottom: 30px;}
.sect-title {font-size: 28px; font-weight: 800; color: #222222;}
.sect-title-small {font-size: 20px; color: #222222;}

.side-box {background-color: #ffffff; margin-bottom: 30px; box-shadow: 0 0 15px 0 rgba(0,0,0,0.1); padding: 30px;}
.side-bt {font-size: 20px; margin-bottom: 30px; font-weight: 800; color: #222222;}
.side-bc-friends a {display: block; color: #333333;}
.no-bg {background-color: transparent; padding: 0; box-shadow: none;}
.mb-remove-30 {margin-bottom: -30px;}
.side-menu li {margin: 0;}
.side-menu {margin: -15px 0;}
.side-menu > li > a {height: 40px; line-height: 40px; position: relative; color: #333333;}
.side-menu .submenu > a:after {position: absolute; right: 0; top: 0;}
.side-menu > li.submenu:hover > a:after {transform: rotate(-90deg) !important}
.side-menu .hidden-menu {top: 0; left: 90%; background-color: #f8f8f8;}
.side-block__title {font-weight: 700; text-transform: uppercase; letter-spacing: 1px; 
    margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid rgba(0,0,0,0.1); color: #222222;}
.side-block__content {display: grid; gap: 15px; grid-template-columns: repeat(auto-fill,minmax(240px,1fr));}
.top-item {margin-bottom: 30px;}
.top-item-img {width: 60px; height: 60px; margin-right: 15px;}
.top-item-text {line-height: 20px; max-height: 60px; overflow: hidden; color: #333333;}
.lcomm + .lcomm {margin-top: 15px; padding-top: 15px; border-top: 1px solid #d0d0d0;}
.ltitle {display: block; color: #222222;}
.ltext {line-height: 1.5; color: #333333; font-weight: 300; word-wrap: break-word;}
.lmeta {font-size: 12px; margin: 5px 0; color: #666666; text-shadow: none;}
.ldate, .lav, .lname {display: inline-block; vertical-align: middle; margin-right: 7px;}
.lav {width: 26px; height: 26px; border-radius: 50%;}
.lcomm .comm-letter {line-height: 26px; font-size: 12px;}
.thumb-item {display: block; margin-bottom: 30px;}
.thumb-item-img {margin-bottom: 15px;}
.popular {background-color: #f8f8f8; border-radius: 6px; overflow: hidden; position: relative;}
.popular__desc {padding: 16px 20px; padding-top: 14px;}
.popular__title {font-weight: 700; color: #222222;}
.popular__text {font-size: 13px; color: #666666; margin-top: 6px; -webkit-line-clamp: 4;}

/* КРАТКИЙ ЭЛЕМЕНТ
----------------------------------------------- */
#dle-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 15px;
}

.short-item {
    margin-bottom: 15px;
    width: calc(33.33% - 10px);
    position: relative;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
    padding: 15px;
    padding-bottom: 85px;
    border: 1px solid #d0d0d0;
    background-color: #ffffff;
}

.short-item a {
    display: block;
    color: #222222;
}

.short-img {
    margin-bottom: 15px;
}

.short-img:after {
    content: '';
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30%;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
}

.short-category {
    position: absolute;
    z-index: 5;
    left: 15px;
    bottom: 15px;
    color: #333333;
    font-size: 12px;
}

.short-title {
    padding: 10px;
    background: #f8f8f8;
}

.short-meta {
    font-size: 12px;
    color: #888888;
    margin-bottom: 15px;
}

.short-meta-item {
    margin-left: 10px;
}

.short-meta-item.fx-1 {
    margin-left: 0;
}

.short-text {
    color: #333333;
    line-height: 1.5;
    font-weight: 300;
}

.short-bottom {
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: 15px;
}

.short-rating .rating {
    position: relative;
    top: 3px;
}

/* Адаптивные корректировки для трехколоночного макета */
@media screen and (max-width: 950px) {
    .short-item {
        width: calc(50% - 10px);
    }
}

@media screen and (max-width: 590px) {
    .short-item {
        width: 100%;
    }
}

/* SEO DESCRIPTION
----------------------------------------------- */
.site-desc {line-height: 1.5; padding: 30px;
    font-weight: 300; border-top: 1px solid #d0d0d0; color: #666666;}
.site-desc h1, .site-desc h2 {font-size: 20px; font-weight: 800; margin-bottom: 10px; color: #222222;}
.site-desc li {list-style-type: disc; margin-left: 40px;}
.site-desc p {margin-bottom: 10px;}
.site-desc > *:last-child {margin-bottom: 0;}
.site-desc a {color: #0066cc; text-decoration: underline;}
.site-desc img {float: left; max-width: 200px; margin: 0 10px 10px 0;}

/* BOTTOM NAVIGATION
----------------------------------------------- */
.navigation {text-align:center; font-size: 16px; padding-top: 30px;}
.navigation a, .navigation span, .pnext a, .pprev a, .pprev > span, .pnext > span {display:inline-block; padding:0 15px; 
margin:10px 4px 0 4px; line-height: 40px; min-width: 40px; border-radius: 4px;
background-color: #f8f8f8; box-shadow: 0 0 15px rgba(0,0,0,0.1); color: #333333;}
.navigation span:not(.nav_ext), .pagi-nav a:hover {background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4); color: #fff;}

/* FULL
----------------------------------------------- */
.fmain h1 {margin-bottom: 15px; color: #222222;}
.fmain h1 a {margin-left: 10px; font-size: 18px; font-weight: 400; color: #666666;}
.fmain .short-meta {margin-bottom: 30px;}
.fmain .short-rating {margin-left: 10px;}
.fbtm-one {border-top: 1px solid #d0d0d0; padding-top: 30px; margin-top: 30px;}
.ferror {color: #333333; font-size: 14px; line-height: 1.3;}
.ferror-btns {margin-right: 9px;}
.ferror-btns div, .faddcomms {margin-right: 8px; margin-bottom: 8px; background-color: #f8f8f8; border: 1px solid #d0d0d0;
    padding: 8px 15px; border-radius: 3px; font-weight: 500; color: #333333;}
.ferror-text div, .ferror-text span {font-weight: 500;}
.ferror-text div span {color: #ff6666;}
.ffav a {padding-left: 50px; position: relative; display: block; font-size: 14px; color: #888888;}
.ffav .far {margin: 0; position: absolute; left: 0; top: -5px; width: 40px; height: 40px; line-height: 40px; 
text-align: center; border-radius: 50%; border: 1px solid #d0d0d0; color: #333333;}
.frels .thumb-item {width: 31%;}
.ftags {margin-top: 20px;}
.ftags span {margin-top: 10px; margin-right: 2px; display: inline-block; vertical-align: top; line-height: 26px; color: #333333;}
.ftags .far {margin-top: 10px; margin-right: 10px;}
.ftags a {display: inline-block; border-radius: 13px; padding: 0 15px; 
background-color: #f8f8f8; font-size: 12px; color: #666666;}
.ftags a:hover {background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4); color: #fff;}
.btn-dl {background: linear-gradient(to bottom, #32cd32 0%, #2ecc71 100%); color: #fff; 
border-radius: 4px; overflow: hidden;}
.btn-dl:hover {background: linear-gradient(to top, #32cd32 0%, #2ecc71 100%); color: #fff;}
.btn-dl-title {padding: 15px; font-size: 16px;}
.btn-dl-icon, .btn-dl-size {padding: 15px; font-size: 24px; background-color: rgba(0,0,0,0.2);}
.btn-dl-title > div {font-size: 12px; opacity: 0.8; margin-top: 5px;}
.btn-dl-title > div > span {margin-right: 10px;}
.btn-dl-size {font-size: 16px;}
.page__prev-next {margin: 40px 0 0 0; padding-top: 20px; border-top: 1px solid #d0d0d0; gap: 10px;}
.page__prev-next-link {line-height: 1.3; display: block; color: #333333;}
.page__prev-next-link + .page__prev-next-link {text-align: right;}
.page__prev-next-link div:first-child {font-size: 12px; text-transform: uppercase; color: #888888; margin-bottom: 6px;}
.sect--related {margin-top: 40px;}
.line-clamp {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}

/* FULL STORY STATIC
----------------------------------------------- */
.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame 
{max-width:100% !important; display:block; width:100%; height:400px;}
.mejs-container {max-width:100% !important;}
.full-text {line-height: 1.5; font-weight: 400; font-size: 16px; color: #333333; text-align: center !important; text-shadow: none;}
.full-text img:not(.emoji) {max-width:100%; margin-top: 10px; margin-bottom: 10px;}
.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 a {text-decoration:underline; color:#0066cc; word-break:break-all;}
.full-text a:hover {text-decoration:none;}
.full-text h2, .full-text h3, .full-text h4, .full-text h5 {margin:10px 0; color: #222222;}
.full-text p {margin-bottom:10px;}
.full-text > ul, .full-text > ol {margin:0;}
.full-text > ul li {list-style:disc; margin-left:40px;}
.full-text > ol li {list-style:decimal; margin-left:40px;}

/* COMMENTS
----------------------------------------------- */
.add-comms {}
.ac-inputs input {width: 48.5%; margin-bottom: 15px;}
.ac-textarea textarea {height: 100px; margin-bottom: 15px;}
.ac-protect, .ac-textarea .bb-editor + br {display: none;}
.comments_subscribe input {margin-right: 10px;}
.comments_subscribe {display: block; color: #333333;}
.mass_comments_action {display: none;}
.last-comm-link {display: inline-block; padding-bottom: 20px; color: #333333; font-size: 18px; font-weight: 600;}

.comm-avatar {position: absolute; left: 0; top: 0; width: 40px; height: 40px; border-radius: 50%;}
.comm-letter {position: absolute; left: 0; top: 0; width: 100%; height: 100%; line-height: 40px; text-align: center; 
background-color: #d0d0d0; color: #333333; font-size: 18px; text-transform: uppercase;}
.comm-item {margin-top: 30px; font-size: 14px; padding-left: 50px; position: relative; min-height: 40px;}
.comm-two {margin: 10px 0;}
.comm-one > span {margin-right: 15px; color: #888888;}
.comm-one > span.comm-author, .comm-one > span.comm-author a {font-weight: 500; color: #333333; opacity: 1;}
.comm-three-left > a, .comm-three-right li a {opacity: 0.6;}
.comm-three-right li {display: inline-block; margin-left: 15px;}
.comm-rate3 {white-space:nowrap; font-size:14px; margin-right: 15px; height: 20px; line-height: 20px; 
    display: inline-block; vertical-align: top; position: relative; top: -3px;}
.comm-rate3 a {display: inline-block; vertical-align: middle; position: relative; opacity: 0.4; color: #333333;}
.comm-rate3 a:last-child {}
.comm-rate3 > span {margin: 0 5px;}
.comm-rate3 > span > span.ratingtypeplus {color: #06b601;}
.comm-rate3 > span > span.ratingplus {color: #95c613;}
.comm-rate3 > span > span.ratingminus {color: #ff0e0e;}
.comm-three a:hover {border-bottom-color: transparent;}
.comm-three-left > a {opacity: 1; color: #0066cc; border-bottom: 1px dotted #0066cc;}

/* LOGIN
----------------------------------------------- */
.overlay-box {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; 
opacity: 0.8; background-color: #000; cursor: pointer;}
.login-box {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); 
background-color: #ffffff; padding: 30px 60px 40px 60px; border-top: 5px solid #0066cc; width: 400px; 
box-shadow: 0 20px 60px rgba(0,0,0,0.3);}
.login-close {width: 26px; height: 26px; line-height: 26px; text-align: center; font-size: 24px; 
    cursor: pointer; position: absolute; top: -30px; right: -30px; color: #fff;}
.login-title {font-size: 20px; font-weight: 800; margin-bottom: 15px; text-align: center; color: #222222;}
.login-avatar {width: 60px; height: 60px; border-radius: 50%; margin: 0 auto 15px auto; 
text-align: center; line-height: 60px; font-size: 24px; background-color: #f0f0f0; color: #666666;}
.login-input {margin-bottom: 15px;}
.login-btn button {width: 100%; margin: 15px 0;}
.login-btm a {border-bottom: 1px dotted #0066cc; color: #0066cc; font-size: 14px;}
.login-check {position: relative; font-size: 14px;}
.login-check input {opacity: 0; position: absolute; cursor: pointer;}
.login-check span {display: block; padding-left: 36px; height: 30px; line-height: 30px; color: #666666;}
.login-check span:before, .login-check span:after{content: '';position: absolute;top: 50%;transition: .3s;}
.login-check span:before{left: 0; height: 10px; margin-top: -5px; width: 26px; border-radius: 5px; 
    background: #d0d0d0; box-shadow: inset 0 1px 4px rgba(0,0,0,0.3);}
.login-check span:after{left: 1px; height: 12px; width: 12px; margin-top: -6px; background: #2ecc71;
    border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,0.2);}
.login-check input:checked + span:before {background-color: #d0d0d0;}
.login-check input:checked + span:after {left: 13px; background-color: #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.3);}
.login-menu {border-top: 1px solid #d0d0d0; border-left: 1px solid #d0d0d0;}
.login-menu li {text-align: center; border-right: 1px solid #d0d0d0; border-bottom: 1px solid #d0d0d0; width: 50%;}
.login-menu a {display: block; padding: 10px 5px; font-size: 12px; color: #333333;}
.login-menu li .fa {display: none; height: 28px; font-size: 22px; color: #0066cc;}
.login-admin {text-align: center; margin: -10px 0 25px 0;}
.login-soc-title {display: flex; align-items: center; margin: 30px 0 15px 0;}
.login-soc-title:before, .login-soc-title:after {content: ''; height: 1px; background-color: #d0d0d0; flex: 1;}
.login-soc-title:before {margin-right: 15px;}
.login-soc-title:after {margin-left: 15px;}
.login-soc-btns {text-align: center;}
.login-soc-btns a {display:inline-block; margin: 0 3px; vertical-align:top;}
.login-soc-btns img {display:block; width:30px; height: 30px; border-radius: 50%;}

/* ADAPTIVE
----------------------------------------------- */
.btn-menu {display: none;}
.side-panel {width:280px; height:100%; overflow-x:hidden; overflow-y:auto; background-color:#ffffff;
padding:15px; z-index:9999; position:fixed; left:-320px; top:0; transition:left .4s;}
.side-panel.active {left:0;}
.close-overlay {width:100%; height:100%; background-color:rgba(0,0,0,0.7); 
position:fixed; left:0; top:0; z-index:9998; display:none;}
.btn-close {cursor:pointer; display:block; left: 280px; top: -40px; position: fixed; z-index: 9999;
width:40px; height:40px; line-height:40px; text-align:center; font-size:18px; 
background-color: #ff4500; color: #fff; transition:top .4s; -webkit-transition:top .4s;}
.btn-close.active {top:0px;}
body.opened-menu {overflow: hidden; width: 100%; height: 100%;}
.side-panel .header-menu {display: block;}
.side-panel .header-menu > li {margin: 0;}
.side-panel .header-menu > li > a {height: 40px; line-height: 40px; color: #333333;}
.side-panel .hidden-menu {background-color: #f8f8f8; box-shadow: none; position: static; width: calc(100% + 30px);
pointer-events: auto; opacity: 1; transform: translateY(0); margin: 15px -15px;}
.side-panel .hidden-menu li a {padding: 10px 15px; font-size: 16px; color: #333333;}
.side-panel .side-box {padding: 0; background-color: transparent; box-shadow: none; margin: 30px 0 0 0;}

@media screen and (max-width: 1220px) {
.wrap-center {max-width:1000px;}
.header .header-menu, .col-left, .col-right, #gotop {display: none !important;}
.logo {-ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; 
    max-width: 100%; min-width: 50px; margin: 0 30px 0 0; position: relative;}
.btn-menu {display: block; font-size: 18px; background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4); color: #fff; margin-left: 30px;
height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 4px; cursor: pointer;}
.btn-login {background-color: transparent !important; color: #333333 !important; 
    padding: 0; font-size: 0; margin-left: -15px;}
.btn-login .far {font-size: 18px; margin: 0; line-height: 40px;}
.col-main {padding: 0; width: 100%;}

.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:400px;}
}

@media screen and (max-width: 950px) {
.wrap-center {max-width:768px;}
}

@media screen and (max-width: 760px) {
.wrap-center {max-width:640px;}
.not-logged .login-avatar {display: none;}
.login-close {top: -5px;}
.login-title {font-size: 18px;}
.login-box {max-width: calc(100% - 60px); padding: 15px;}

.ferror {display: none;}
.frels .thumb-item {width: 48%;}
.dcont button {font-size:12px; padding:0 15px !important;}
.comments-tree-list .comments-tree-list {padding-left:0px !important;}
.comments-tree-list .comments-tree-list:before {display:none;}
.mass_comments_action {display:none;}
}

@media screen and (max-width: 590px) {
.wrap {overflow: hidden;}
.wrap-center {max-width:480px;}
.short-item {width: 100%;}

.fmain h1, .sect-title {font-size: 20px;}
.frels .thumb-item {width: 100%;}
.ac-inputs input {width: 100%;}
.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:300px;}

.ui-dialog {width:100% !important;}
.upop-left, .upop-right {float:none !important; width:100% !important; margin:0; padding:0 20px;}
.upop-left {margin-bottom:10px; text-align:center;}
.ui-dialog-buttonset button {display:block; margin:0 0 5px 0; width:100%;}
#dofullsearch, #searchsuggestions span.seperator {display:none !important;}
.attach .download-link {margin:0 -15px 0 0; float:none; display:block; padding:0 10px;}
.attach-info {float:none;}
}

@media screen and (max-width: 470px) {
.wrap-center22 {max-width:360px;}
.logo img {width: 100%; max-width: 200px; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.header, .footer, .content, .col-main .side-box {padding-left: 15px; padding-right: 15px;}
.fmain .short-meta-item:not(.fx-1):not(:last-child) {display: none;}
}

@media screen and (max-width: 350px) {
.wrap-center22 {max-width:320px;}

.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:250px;}
}

/* Добавленный медиа-запрос для больших экранов */
@media screen and (min-width: 1380px) {
    .wrap-center {
        max-width: 90%;
    }
    .col-main {
        max-width: 1400px;
        margin: 0 auto;
    }
}

.short-item-wide {width: 100% !important;}
@media screen and (min-width: 560px) {
.short-item-wide .short-img {padding-top: 30%;}
.short-item-wide .short-title {font-size: 24px;}
}

.downloads-header {padding: 10px 20px; margin-top: 20px; border: 1px solid #d0d0d0; font-weight: 700; color: #222222;}
.downloads-block {display: flex; align-content: center; flex-wrap: wrap; justify-content: flex-start; align-items: center; margin-bottom: 10px; padding: 20px; border: 1px solid #d0d0d0; background: #f8f8f8;}
.download-links {display: block; margin-top: 10px; margin-right: 10px; padding: 10px; background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4); text-transform: uppercase; text-decoration: none; color: #fff; transition: background 0.2s ease-in, color 0.2s ease-in;}
.hot4share-link {background: #ffd409; color: #010101;}
.onedlnet-link {background: #153fa6;}
.nitroflare-link {background: #1c3145;}
.uploadcloud-link {background: #0097A7;}
.rapidgator-link {background: #ff801a;}
.download-links:hover {background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4); color: #fff;}

.side-menu > li > a > svg {width: 10px;height: 10px;fill: #ff4500;margin-right: 5px;}

.fullstory-placeholder {padding: 10px 0}

/* Фиксируем позицию body, которую меняет панель гугла*/
.page_fix {top: 0 !important;position: static !important;}

/* Прячем панель гугла */
.skiptranslate {display: none !important;}

/* Выбор языка */
.select-header{
    display: flex;
    align-items: center;
}

.select-wrap{
  position: relative;
  user-select: none;
}

.select-wrap .default-option{
  width: 32px;
  margin-right: 20px;
  border-radius: 5px;
  position: relative;
  cursor: pointer;
  transition: transform 0.1s;
}
.select-wrap .default-option:active{
    transform:translateY(3px);
}
.select-wrap .default-option .icon{
  margin-right: 0!important;
}

.select-wrap .default-option li{
    padding: 0;
}
.select-wrap .select-ul{
  width: 170px;
  max-height: 210px;
  position: absolute;
  top: 55px;
  left: -135px;
  background: #f8f8f8;
  border-radius: 5px;
  display: none;
  overflow: auto;
  box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
}

.select-wrap .select-ul li{
  padding: 5px 5px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  color: #333333;
}

.select-wrap .select-ul li:first-child{
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

.select-wrap .select-ul li:last-child{
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.select-wrap .select-ul li:hover{
    background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4);
    color: #fff;
}

.select-wrap .option{
  display: flex;
  align-items: center;
}

.select-wrap .option .icon{
  background: url('../images/lang/en.svg') no-repeat;
  background-size: contain;
    width: 32px;
    height: 32px;
  margin-right: 15px;
}

.select-wrap .option.lang-en .icon{
    background: url('../images/lang/en.svg') no-repeat;
   background-size: contain;
}

.select-wrap .option.lang-de .icon{
  background: url('../images/lang/de.svg') no-repeat;
  background-size: contain;
}

.select-wrap .option.lang-pt .icon{
  background: url('../images/lang/pt.svg') no-repeat;
  background-size: contain;
}

.select-wrap .option.lang-tr .icon{
  background: url('../images/lang/tr.svg') no-repeat;
  background-size: contain;
}

.select-wrap .option.lang-ja .icon{
    background: url('../images/lang/ja.svg') no-repeat;
    background-size: contain;
}

.select-wrap .option.lang-es .icon{
    background: url('../images/lang/es.svg') no-repeat;
    background-size: contain;
}

.select-wrap .option.lang-hi .icon{
    background: url('../images/lang/hi.svg') no-repeat;
    background-size: contain;
}

.select-wrap .option.lang-it .icon{
    background: url('../images/lang/it.svg') no-repeat;
    background-size: contain;
}

.select-wrap .option.lang-zh-CN .icon{
    background: url('../images/lang/zh-CN.svg') no-repeat;
    background-size: contain;
}

.select-wrap .option.lang-ar .icon{
    background: url('../images/lang/ar.svg') no-repeat;
    background-size: contain;
}

.select-wrap .option.lang-vi .icon{
    background: url('../images/lang/vi.svg') no-repeat;
    background-size: contain;
}

.select-wrap .option.lang-ko .icon{
    background: url('../images/lang/ko.svg') no-repeat;
    background-size: contain;
}

.select-wrap.active .select-ul{
  display: block;
}

.bottom-nav {clear: both; padding-top: 60px;}
.nav-load {text-align: center;}
.nav-load a {padding: 0 60px; display: inline-block; height: 60px; line-height: 60px; border-radius: 30px;
font-weight: 700; font-size: 18px; background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4); color: #ffffff;}
.nav-load a:hover {background: linear-gradient(90deg, #ff69b4, #ff4500, #0066cc); color: #ffffff;}
.nav-load span {display: none;}

.menu ul {
margin: 0;
list-style: none;
padding-left: 20px;
display: none;
}

.menu .title {
font-size: 18px;
cursor: pointer;
color: #333333;
}

.menu .title::before {
content: '▶ ';
font-size: 80%;
color: #ff4500;
}

.menu.open .title::before {
content: '▼ ';
}

.menu.open ul {
display: block;
}

figure {
    margin: 0;
}

figure.align-left {
    float: left;
}

figure.align-right {
    float: right;
}

figure.image.align-center {
    display: table;
    margin-left: auto;
    margin-right: auto;
}

figure.image figcaption {
    padding: 1rem;
    background-color: #f8f8f8;
    font-size: .8rem;
    caption-side: bottom;
    word-break: break-word;
    text-align: center;
    color: #333333;
}

figure.image.align-center figcaption {
    display: table-caption;
}

.comments-image-gallery {
  margin: 0;
  padding: 0;  
  list-style: none;
  clear: both;
}

.comments-image-gallery li{
    list-style: none;
    margin: 0;
    padding: 0;  
}

.comments-image-gallery li img{
  float: left;
  margin-right: 5px;
  border: 5px solid #f8f8f8;
  width: 100px;
  height: 100px;
  transition: box-shadow 0.5s ease;
}

.comments-image-gallery li img:hover {
  box-shadow: 0px 0px 7px rgba(0,0,0,0.2);
}

.mce-toc {
  border: 1px solid #d0d0d0;
  margin: 0 0 .7rem 0;
}

.mce-toc h2 {
  margin: 4px;
  color: #222222;
}

.mce-toc ul {
  padding-left: 20px;
  list-style: none;
  margin-top: 0;
  margin-bottom: 0;
  margin-block-start: 1em;
  margin-block-end: 1em;
  color: #333333;
}

.mce-toc ul ul {
  padding-left: 20px;
  margin-block-start: 0;
  margin-block-end: 0;
}

.mce-toc li {
  list-style-type: none;
}

.image-bordered {
    border: 1px solid #d0d0d0;
}

.image-shadows {
    box-shadow: rgb(0 0 0 / 25%) 0px 4px 8px -2px, rgb(0 0 0 / 8%) 0px 0px 0px 1px;
}

.image-padded {
    padding: 0.5rem;
}

.comments-user-profile {
  font-weight: bold;
  cursor: pointer;
  color: #0066cc;
}

.title_spoiler svg{
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 7px;
    height: 16px;
    width: 16px;
}

/*--- Подсветка исходного кода ---*/
.hljs-comment, .hljs-quote {
  color: #888888;
  font-style: italic;
}

.hljs-doctag, .hljs-keyword, .hljs-formula {
  color: #c678dd;
}

.hljs-section, .hljs-name, .hljs-selector-tag, .hljs-deletion, .hljs-subst {
  color: #e06c75;
}

.hljs-literal {
  color: #56b6c2;
}

.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute, .hljs-meta-string {
  color: #98c379;
}

.hljs-built_in, .hljs-class .hljs-title {
  color: #e6c07b;
}

.hljs-attr, .hljs-variable, .hljs-template-variable, .hljs-type, .hljs-selector-class, .hljs-selector-attr,
.hljs-selector-pseudo, .hljs-number {
  color: #d19a66;
}

.hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title {
  color: #61afef;
}

.hljs-emphasis {
  font-style: italic;
}

.hljs-strong {
  font-weight: bold;
}

.hljs-link {
  text-decoration: underline;
}

/* Основной CSS */
.container {
  display: flex;
}

/* Медиа-запросы для мобильных устройств */
@media (max-width: 768px) {
  .container {
    display: block;
  }
}
@media screen and (min-width: 1380px) {
    .wrap-center {
        max-width: 90%;
    }
}
/* Исправления для CLS в wrap-main wrap-center */
.wrap-main.wrap-center {
  min-height: 90px;
}

.header {
  min-height: 90px;
}

.logo img {
  width: 280px;
  height: 60px;
  display: block;
}

.header-menu {
  min-height: 36px;
}

.header__search {
  min-width: 200px;
}

.select-header {
  min-width: 100px;
}
/* Исправление сетки и стабилизация контента */
.content {
  padding: 30px;
}

#dle-content {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 15px;
}

.short-item {
  margin-bottom: 15px;
  width: calc(33.33% - 10px);
  position: relative;
  box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
  padding: 15px;
  padding-bottom: 85px;
  border: 1px solid #d0d0d0;
  background-color: #ffffff;
  min-height: 300px;
}

.short-img {
  position: relative;
  padding-top: 70%;
  margin-bottom: 15px;
  overflow: hidden;
}

.short-img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top left;
  display: block;
}

.short-bottom {
  position: absolute;
  left: 15px;
  right: 15px;
  bottom: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 40px;
}

.short-btn.btn {
  display: inline-block;
  padding: 0 25px;
  height: 40px;
  line-height: 40px;
}
/* Блок смены темы */
.side-box {
    background-color: #ffffff;
    margin-bottom: 30px;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
    padding: 30px;
}

.side-bt {
    font-size: 20px;
    margin-bottom: 20px;
    font-weight: 800;
    color: #222222;
}

.change-skin {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.change-skin select {
    height: 40px;
    padding: 0 15px;
    border-radius: 4px;
    background-color: #f5f5f5;
    color: #333333;
    box-shadow: inset 0 0 0 1px #d0d0d0, inset 1px 2px 5px rgba(0,0,0,0.1);
    font-size: 14px;
    cursor: pointer;
}

.change-skin select:focus {
    box-shadow: inset 0 0 0 1px #0066cc, inset 1px 2px 5px rgba(0,0,0,0.1);
    outline: none;
}

.skin-colors {
    display: flex;
    gap: 10px;
}

.skin-color {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
    transition: transform 0.2s ease;
}

.skin-color:hover {
    transform: scale(1.2);
}

.skin-1 { background-color: #ffffff; border: 1px solid #d0d0d0; } /* Светлая тема */
.skin-2 { background-color: #1a1a1a; } /* Темная тема */
.skin-3 { background-color: #0066cc; } /* Дополнительная тема (синяя) */
/* Блок ссылки (светлая тема) */
.link-block.light-theme {
    background-color: #ffffff;
    margin-bottom: 20px;
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);
    padding: 20px;
}

.link-block.light-theme .side-bt {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 800;
    color: #222222;
}

.link-block.light-theme .link-container {
    display: flex;
    justify-content: center;
}

.link-block.light-theme .link-btn {
    display: inline-block;
    text-align: center;
    padding: 0 20px;
    height: 36px;
    line-height: 36px;
    border-radius: 4px;
    cursor: pointer;
    color: #ffffff;
    background: linear-gradient(90deg, #0066cc, #ff4500);
    font-size: 14px;
    text-decoration: none;
    transition: background 0.3s ease;
}

.link-block.light-theme .link-btn:hover {
    background: linear-gradient(90deg, #ff4500, #0066cc);
    color: #ffffff;
}
/* Кнопка "Поделиться" */
.share-button {
    margin: 15px 0;
}

.share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4);
    color: #ffffff;
    border: none;
    padding: 0 25px;
    height: 40px;
    line-height: 40px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-family: Tahoma, Geneva, sans-serif;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
    transition: background 0.3s ease;
}

.share-btn:hover {
    background: linear-gradient(90deg, #ff69b4, #ff4500, #0066cc);
    color: #ffffff;
}

.share-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url('path/to/share-icon.png'); /* Замените на иконку "Поделиться" */
}

/* Модальное окно */
.share-modal {
    display: none;
    position: fixed;
    z-index: 998; /* Как в .overlay-box */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000; /* Как в .overlay-box */
    opacity: 0.9; /* Как в .overlay-box */
}

.share-modal-content {
    position: fixed;
    z-index: 999; /* Как в .login-box */
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%); /* Как в .login-box */
    background-color: #ffffff; /* Как в .login-box */
    padding: 30px 60px 40px 60px; /* Как в .login-box */
    border-top: 5px solid #0066cc; /* Как в .login-box */
    width: 400px; /* Как в .login-box */
    box-shadow: 0 20px 60px rgba(0,0,0,0.3); /* Как в .login-box */
}

.share-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px; /* Как в .login-title */
    position: relative;
}

.share-modal-header h3 {
    margin: 0;
    font-size: 20px; /* Как в .login-title */
    font-weight: 800; /* Как в .login-title */
    color: #222222; /* Как в .login-title */
    font-family: 'Montserrat';
    text-align: center; /* Как в .login-title */
    flex: 1;
}

.close-modal {
    width: 26px; /* Как в .login-close */
    height: 26px; /* Как в .login-close */
    line-height: 26px; /* Как в .login-close */
    text-align: center; /* Как в .login-close */
    font-size: 24px; /* Как в .login-close */
    cursor: pointer;
    position: absolute;
    top: -30px; /* Как в .login-close */
    right: -30px; /* Как в .login-close */
    color: #fff; /* Как в .login-close */
    background: none;
    border: none;
}

.share-modal-body h4 {
    margin: 0 0 10px 0;
    font-size: 16px;
    color: #222222;
    font-family: 'Montserrat';
}

.share-options {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
    max-height: 300px;
    overflow-y: auto;
}

.share-option {
    display: flex;
    align-items: center;
    background-color: #f5f5f5; /* Цвет фона полей ввода из вашей темы */
    padding: 10px;
    border-radius: 4px;
    text-decoration: none;
    color: #333333;
    font-size: 14px;
    font-family: Tahoma, Geneva, sans-serif;
    box-shadow: inset 0 0 0 1px #d0d0d0, inset 1px 2px 5px rgba(0,0,0,0.1);
    transition: background 0.3s ease;
}

.share-option:hover {
    background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4);
    color: #ffffff;
}

.share-icon {
    width: 24px;
    height: 24px;
    margin-right: 8px;
    background-size: contain;
    background-repeat: no-repeat;
}

/* Иконки социальных сетей (замените пути на реальные) */
.share-icon.facebook { background-image: url('path/to/facebook-icon.png'); }
.share-icon.twitter { background-image: url('path/to/twitter-icon.png'); }
.share-icon.telegram { background-image: url('path/to/telegram-icon.png'); }
.share-icon.email { background-image: url('path/to/email-icon.png'); }
.share-icon.reddit { background-image: url('path/to/reddit-icon.png'); }
.share-icon.blogger { background-image: url('path/to/blogger-icon.png'); }
.share-icon.odnoklassniki { background-image: url('path/to/odnoklassniki-icon.png'); }
.share-icon.vk { background-image: url('path/to/vk-icon.png'); }
.share-icon.wordpress { background-image: url('path/to/wordpress-icon.png'); }
.share-icon.tumblr { background-image: url('path/to/tumblr-icon.png'); }
.share-icon.gmail { background-image: url('path/to/gmail-icon.png'); }
.share-icon.sina-weibo { background-image: url('path/to/sina-weibo-icon.png'); }
.share-icon.xing { background-image: url('path/to/xing-icon.png'); }
.share-icon.wechat { background-image: url('path/to/wechat-icon.png'); }
.share-icon.mixi { background-image: url('path/to/mixi-icon.png'); }
.share-icon.mix { background-image: url('path/to/mix-icon.png'); }
.share-icon.douban { background-image: url('path/to/douban-icon.png'); }
.share-icon.wykop { background-image: url('path/to/wykop-icon.png'); }
.share-icon.kakao { background-image: url('path/to/kakao-icon.png'); }
.share-icon.diigo { background-image: url('path/to/diigo-icon.png'); }
.share-icon.microblog { background-image: url('path/to/microblog-icon.png'); }
.share-icon.linkedin { background-image: url('path/to/linkedin-icon.png'); }

.copy-link {
    display: flex;
    align-items: center;
    gap: 10px;
}

.copy-link input {
    flex: 1;
    background-color: #f5f5f5;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    color: #333333;
    font-size: 14px;
    font-family: Tahoma, Geneva, sans-serif;
    box-shadow: inset 0 0 0 1px #d0d0d0, inset 1px 2px 5px rgba(0,0,0,0.1);
}

.copy-btn {
    background: linear-gradient(90deg, #0066cc, #ff4500, #ff69b4);
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    font-family: Tahoma, Geneva, sans-serif;
    transition: background 0.3s ease;
}

.copy-btn:hover {
    background: linear-gradient(90deg, #ff69b4, #ff4500, #0066cc);
}

/* Адаптивность, как в .login-box */
@media screen and (max-width: 760px) {
    .share-modal-content {
        max-width: calc(100% - 60px);
        padding: 15px;
    }

    .share-modal-header h3 {
        font-size: 18px;
    }

    .close-modal {
        top: -5px;
    }
}

.download-button {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 12px 28px; /* Увеличены отступы: с 10px 24px до 12px 28px */
    font-family: Arial, sans-serif;
    font-size: 14px; /* Увеличен размер шрифта с 13px до 14px */
    font-weight: bold;
    text-decoration: none;
    color: #ffffff;
    background: linear-gradient(135deg, #007BFF, #00C4FF);
    border: 2px solid #ffffff;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
    text-align: center;
    height: 60px; /* Увеличена высота с 50px до 60px */
    width: 300px; /* Увеличена ширина с 260px до 300px */
    line-height: 1.2;
}

.download-button:hover {
    background: linear-gradient(135deg, #0056b3, #0096cc);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 123, 255, 0.5);
}

.download-button:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(0, 123, 255, 0.2);
}

.download-button .highlight {
    color: #ffffff;
    font-weight: bold;
    font-size: 15px; /* Увеличен размер шрифта для .highlight с 14px до 15px */
}

.download-button-orange {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    color: #ffffff;
    background: linear-gradient(135deg, #FF6200, #FFA500);
    border: 2px solid #ffffff;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(255, 98, 0, 0.3);
    text-align: center;
    height: 60px;
    width: 300px;
    white-space: nowrap; /* Prevents line break */
}

.download-button-orange:hover {
    background: linear-gradient(135deg, #CC4E00, #CC8400);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 98, 0, 0.5);
}

.download-button-orange:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(255, 98, 0, 0.2);
}

.download-button-orange .highlight {
    color: #ffffff;
    font-weight: bold;
    font-size: 15px;
}

.download-button-yellow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    color: #ffffff;
    background: linear-gradient(135deg, #FFC107, #FFEB3B);
    border: 2px solid #ffffff;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3);
    text-align: center;
    height: 60px;
    width: 300px;
    white-space: nowrap;
}

.download-button-yellow:hover {
    background: linear-gradient(135deg, #FFA000, #FBC02D);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 193, 7, 0.5);
}

.download-button-yellow:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(255, 193, 7, 0.2);
}

.download-button-yellow .highlight {
    color: #ffffff;
    font-weight: bold;
    font-size: 15px;
}

.download-button-yellow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    color: #ffffff;
    background: linear-gradient(135deg, #FFC107, #FFEB3B);
    border: 2px solid #ffffff;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3);
    text-align: center;
    height: 60px;
    width: 300px;
    white-space: nowrap;
}

.download-button-yellow:hover {
    background: linear-gradient(135deg, #FFA000, #FBC02D);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 193, 7, 0.5);
}

.download-button-yellow:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(255, 193, 7, 0.2);
}

.download-button-yellow .highlight {
    color: #ffffff;
    font-weight: bold;
    font-size: 15px;
}
.thumb-item-img img,
.thumb-item-img picture,
.thumb-item-img source {
    aspect-ratio: attr(width) / attr(height); /* страховка на случай, если DLE вдруг не подставит */
}
/* FootMenu — стиль из .dtree (светлый + градиент), но шрифты и размеры из твоего оригинального footmenu */
#footmenu {
  color: #333333;
  background: #ffffff;
  padding: 30px 20px; /* Как в оригинале */
  text-align: center;
}

#footmenu h3 {
  margin-bottom: 1.2em; /* Как в оригинале */
  font-size: 1.4em; /* Как в оригинале */
  color: #222222;
  text-transform: uppercase;
  letter-spacing: 1px; /* Как в оригинале */
  font-weight: normal; /* Без bold */
}

/* Сетка — сохраняем твою оригинальную адаптивность */
#footmenu ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 12px 20px; /* Как в оригинале */
  max-width: 1200px;
}

#footmenu li {
  background: transparent;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 0 5px rgba(0,0,0,0.1); /* Лёгкая тень как в dtree */
  transition: all 0.3s ease;
}

#footmenu a {
  display: block;
  padding: 14px 12px; /* Как в оригинале */
  color: #222222;
  text-decoration: none;
  font-size: 0.95em; /* Точно как в оригинальном коде */
  background: #f8f8f8; /* Как в dtree */
  border-radius: 6px;
  transition: all 0.3s ease;
}

#footmenu a:hover {
  color: #ffffff;
  background: linear-gradient(90deg, #0066cc, #ff4500); /* Градиент из dtree */
}

/* Активная ссылка (если нужна) */
#footmenu a.active {
  color: #ffffff;
  background: linear-gradient(90deg, #0066cc, #ff4500);
}

/* Оригинальная адаптивность */
@media (min-width: 480px) {
  #footmenu ul {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  #footmenu ul {
    grid-template-columns: repeat(3, 1fr);
    max-width: 1000px;
    margin: 0 auto;
  }
}

@media (min-width: 1024px) {
  #footmenu ul {
    grid-template-columns: repeat(4, 1fr);
  }
}
.col-main {
    min-height: 1000px; /* или 1200px — подберите под вашу главную страницу с 10–20 новостями */
    display: flex;
    flex-direction: column;
}

#dle-content {
    flex: 1 1 0%; /* чтобы контент растягивался, но не сжимал всё вверх */
    
body {
    scrollbar-gutter: stable both-edges; /* Резервирует место под скроллбар с обеих сторон всегда */
    overflow-y: auto; /* На всякий случай */
}
body.fixed-layout {
    overflow-y: auto;
    padding-right: calc(100vw - 100%) !important;
}
/* Полная стабилизация структуры: жёсткий grid для колонок + фикс wrap */
.wrap-center {
    max-width: 1380px !important;
    margin: 0 auto !important;
    padding: 0 30px;  /* Боковые отступы */
    box-sizing: border-box;
    width: 100%;
    overflow: hidden;  /* Нет overflow-shift */
}

.content.fx-row, .content {  /* Переопределяем ваш flex */
    display: grid !important;
    grid-template-columns: 280px 1fr 320px !important;  /* Фикс: левая 280px, центр растёт, правая 320px (подберите правую точно в DevTools) */
    gap: 30px !important;
    align-items: start !important;
}

/* Явно назначаем колонки (порядок в HTML: left, main, right) */
.col-left   { grid-column: 1 / 2; min-width: 280px !important; }
.col-main   { grid-column: 2 / 3; min-width: 0; }
.col-right  { grid-column: 3 / 4; min-width: 320px !important; }

/* Фикс скроллбара (чтобы не дёргало при длинных страницах) */
body {
    scrollbar-gutter: stable both-edges !important;
}

/* На мобильных (где сайдбары скрыты) */
@media (max-width: 1220px) {
    .content, .content.fx-row {
        grid-template-columns: 1fr !important;
    }
    .col-left, .col-right {
        display: none !important;
    }
}
    
html, body {
    overflow-y: scroll !important;
}