*{margin: 0; padding: 0;}
html{overflow-x: hidden; overflow-y: scroll;}
body {grid-template-rows: auto 1fr auto; overflow: hidden; min-width: 320px; min-height: 100vh; font-family: 'Inter', sans-serif; background: #efefef;}

#loader {position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000;}

/*------------------- ÃÐÈÄ -------------------*/
.grid{display: grid;}
.ji-s {justify-items: start;}
.ji-e {justify-items: end;}
.ji-c {justify-items: center;}
.ai-c {align-items: center;}
.grm10 {grid-column-gap: 10px; grid-row-gap: 10px;}
.grid_icon, .grid-a1{grid-template-columns: auto 1fr; gap: clamp(5px, 2vw, 10px);}
.grid-1a{grid-template-columns: 1fr auto; gap: clamp(5px, 2vw, 10px);}
.grid-a1a{grid-template-columns: auto 1fr auto; gap: clamp(5px, 2vw, 10px);}

.back-img {background-size: cover !important; background-repeat: no-repeat !important; background-position: center center !important;}

a{display: block; text-decoration: none; color: #000;}
.rotate90{transform: rotate(90deg); transition: transform 0.3s ease;}
.rotate180{transform: rotate(180deg);}

.item-block{box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.11), 0px 0px 4px rgba(0, 0, 0, 0.25); border-radius: 10px; background: #fff;}




/*-------------------- ÑÅÒÊÀ -------------------------*/
.container{width: 100%; max-width: 1440px; margin: 0 auto;}
@media (max-width: 1440px) {
    .container{max-width: 100%;}
}
.otstup{max-width: 1160px; margin: 0 auto;}
@media (max-width: 1200px) {
    .otstup{padding: 0 20px;}
}

/*-------------------- ÒÀÁËÈÖÀ ----------------------*/
table {border-collapse: collapse; border: 1px solid grey; width: 100%; font-size: 14px; margin: 15px 0;}
tr, td, th {border: 1px solid grey;}
th {font-weight: normal;}
td, th {padding: 10px; text-align: center;}
table a {color: #008cf0;}
table img {width: auto; height: auto;}

/*-------------------- ÊÍÎÏÊÈ -------------------------*/
.btn-lime{background: #7cb737; margin-bottom: 8px; text-align: center; color: #fff !important; font-size: 12px; padding: 5px 20px; border-radius: 5px; transition: 0.3s;}
.btn-lime:hover{background: #6fa135;}


/*----------------------------ÕÅÀÄÅÐ-------------------------*/
.header-area{position: fixed; z-index: 1; width: 100%;}
.header-area.sticky {width: 100%; position: fixed; z-index: 999;}

#top-panel{background: #fff; border-bottom: 1px solid #eee; box-shadow: 0px 4px 4px 0px #0000001A; width: 100%; grid-template-columns: 250px 1fr 250px;}

.top-m-l{height: 50px; padding: 0 20px;}
.top-m-l a{font-size: 24px;}
.top-m-c>div{grid-template-columns: repeat(3, minmax(50px, auto)); gap: clamp(50px, 2vw, 60px);}
.top-m-r{padding-right: 30px;}
.top-m-r>div{background: #ddd; width: 36px; height: 36px; border-radius: 5px; cursor: pointer;}

#top-menu{background: #fff; box-shadow: 0px 4px 4px 0px #0000001A; display: none; width: 100%; transition: all 0.3s; position: relative;}
#top-menu .item{height: 30px; font-size: 12px; margin: 0;}
#top-menu nav{--grid-gap:1rem;--grid-margin:1rem; display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow-x:auto;line-height:1;}
#top-menu nav::-webkit-scrollbar{display:none;}
.top-menu {display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;margin:0;padding:0; white-space:nowrap;}
.top-menu li {width: auto; list-style-position: inside; list-style: none; margin-right: 20px;}
.top-menu li:first-child {border: none;}
.top-menu a {white-space: nowrap;}

@media (min-width: 901px) {
    #top-panel{position: fixed; width: 100%;}
}
@media (max-width: 900px) {
    #top-menu{display: block;}
    .top-m-c{display: none;}
    #top-panel{grid-template-columns: 1fr auto;}
    .top-m-r{padding-right: 10px;}
}


/*--------------------------------------- ÃËÀÂÍÀß----------------------------------------*/
/*.grid-centr{grid-template-columns: minmax(250px, auto) auto 650px minmax(250px, auto) 250px; }*/
.grid-centr{grid-template-columns: 250px auto 650px auto 250px; }

#right-block, #left-block{padding: 0;}
#center-block{padding: 50px 0 20px;}
#center-block .item-block{position: relative; padding: 20px; margin-bottom: 20px;}

.scroll {width: 250px; position: fixed; overflow-y: scroll; overflow-x: hidden; height: 100%; -ms-overflow-style: none; scroll-behavior: smooth; scrollbar-width: none;}
.scroll::-webkit-scrollbar {display: none;}
.scroll>div {padding: 70px 0 20px;}


@media (max-width: 1170px) {
    .grid-centr{grid-template-columns: 250px auto 650px;}
    #right-block{display: none;}
    #center-block{padding: 50px 20px 20px 0;}
}
@media (max-width: 900px) {
    .grid-centr{grid-template-columns: 1fr;}
    #left-block{display: none;} 
    #center-block{padding: 80px 20px 20px;}
}

@media (max-width: 450px) {    
    #center-block{padding: 80px 10px 20px;}
}

/*---------------------------------------ÀÐÒÈÊË--------------------------------*/
article>div{padding-top: 20px; font-size: 14px;}
article .item-block h1{padding-bottom: 10px;}
article .item-block h2{padding: 0 0 12px; font-size: 18px;}
article .item-block h2.title{font-size: 20px;}
article .item-block h3{padding: 0 0 10px; font-size: 16px;}

article .item-block img{width: 100%; padding-bottom: 10px;}
article .item-block p{padding-bottom: 20px; color: #333; line-height: 25px;}
article .item-block .secr, article .item-block .targ{padding: 0 0 0 10px; border-left: 4px solid red; margin-bottom: 20px;}
article .item-block a{display: inline-block; color: #0072ff;}
article .item-block a:hover{color: #1165ce}
article .item-block ol, article .item-block ul{padding-left: 30px; padding-bottom: 20px; line-height: 25px; color: #333;}
article .one{margin-bottom: 15px; color: #000; font-size: 22px !important; font-weight: normal; padding-left: 20px;}

#prohod .main-img{border-radius: 10px; padding: 0; margin: 0 0 10px;}
#prohod .btn-search{width: 20px; cursor: pointer;}
.item-block .p-item{color: #aaa; font-size: 14px; margin: 0; padding: 0;}

.auto-columns-2 {column-count: 2; column-gap: 20px;}
@media (max-width: 450px) {
    .auto-columns-2 {column-count: 1;}
}

@media (min-width: 1170px) {
    #soderj{display: none;}
}
@media (min-width: 450px) {
    #prohod article .item-block{padding: 30px 30px 20px;}   
}

/*----------------------------------Ñòðåëêè íàâèãàöèÿ---------------------------------------*/
#prohod .arr-block{padding-right: 20px;}
.arr-block a{padding: 0; display: inline-block;}
.arr-block img{width: 30px; border-radius: 7px; opacity: 0.2;}
.arr-block img.active{opacity: 1; cursor: pointer; transition: 0.3s;}
.arr-block img.active:hover{background: #fff;}

/*----------------------------------Ñîäåðæàíèå---------------------------------------*/
#soderj{padding: 10px 20px;}
#soderj h2{padding: 0;}
#soderj img{width: 26px; padding: 0; margin: 0; opacity: 0.4;}
#soderj ol{padding: 20px 30px 10px; color: #777; font-size: 14px;}
#soderj .close{display: none; transition: 0.3s ease;}
#soderj a{padding-bottom: 2px; color: #000;}
#soderj .open{cursor: pointer;}

/*------------------------------------Ïðîõîæäåíèå ïðàâ ìåíþ----------------------*/
#right-block a.active{background: #fff;}
#right-block .menu-item{border-radius: 5px; padding: 5px;}
#right-block h2{padding: 20px 0 5px; font-size: 20px;}
#right-block ol{padding: 0 10px 0 28px;}



/*------------------------------------Íîâîñòè----------------------*/
 .item-block .an-icons{cursor: pointer; background: #eee; padding: 5px 10px; border-radius: 8px; grid-column-gap: 0;}
 .derpy{color: #555; font-size: 14px; margin: 0; padding-left: 5px;}
 .item-block .an-icons.active .derpy {display: none;}
 .item-block .an-icons .icon-animation{width: 20px; height: 20px;}
 .item-block .an-icons.active {background: #ffedaf;}

/*------------------------------------Êîììåíòàðèè----------------------*/
#comments {scroll-margin-top: 65px;}
.comment-box{grid-template-rows: 1fr auto; border-radius: 10px; border: 1px solid #ddd;}
.comment-input {min-height: 50px; padding: 10px;    border-radius: 10px; background: #fff; font-family: inherit; font-size: 14px; line-height: 1.5; outline: none; white-space: pre-wrap;}
.comment-input:empty::before {content: attr(placeholder); color: #999;}
.comment-box:focus {border: 1px solid #aaa;}
.but-comment{padding: 10px; cursor: pointer; color: #3390ff;}

.comment-block{margin-top: 50px;}
.comment-block img{width: 40px; height: 40px; border-radius: 50%; margin: 0 !important; padding: 0 !important;}
.comment-block .name{font-size: 14px; font-weight: bold;}
.comment-block .time{color: #aaa;}
.comment-block .text{margin: 20px 0; font-size: 16px;}


/*
#ff0078
#3390ff */