body,html{margin:0;padding:0;scroll-behavior:smooth}
body{height:100%;width:100%;background-color:#CEC495;background-image:url(/static/content_bg.jpg);background-size:100%;background-repeat:repeat-y}
@font-face{font-family:triodpostnajamedium;src:url(/static/TriodPostnaja.woff);font-weight:400;font-style:normal;font-display:swap}
header{text-align:center;border-bottom:1px solid #000;background-size:cover;position:relative;display:inline-block}
header img{text-align:center;max-width:100%}
header h1{position:absolute;left:30%;top:47%;font-size:2.2em}
table{border:5px double #000}
td,th{padding:5px;border:1px solid #fff}
aside{display:flex;flex-wrap:wrap;justify-content:center;min-height:100%;border-bottom:1px solid #000;padding-bottom:2px}
aside a{margin: 0.3rem;text-decoration:none}
footer{width:100%;height:50px;bottom:0;left:0;right:0;color:#000;text-indent:1rem}
a{color:#ff5722}
.recomen_yandex{padding:1%}
.comment{margin:2%;text-indent:1rem;line-height:1.8rem;text-align:justify;font-size:1rem}
.author{width:100%;color:#2f343a}
.date_comment{width:50%;float:right;font-size:1rem;text-align:right;padding:1%}
.comment_text{width:100%;text-indent:1.5rem;font-size:1.2rem}
.ocenka{text-align:right}
textarea{border:1px solid #888;width:95%;font-size:1.2rem}
hr{width:90%;margin:0 5%;border:none;height:3px}
.center-img{display:block;margin:0 auto}
iframe{max-width:100%;height:auto;display:block}
li{padding-left:1%;margin-left:3%}
*{margin:auto;padding:0;outline:0;border:none}
#content{float:left;display:flex;flex-wrap:wrap;justify-content:center;min-height:100%;border-bottom:1px solid #000;padding-bottom:2px}
#content img{max-width:100%;display:block;} 
#content a{margin:1%;text-decoration:none}
#interesitem{font-size:1.3rem;line-height:1.5rem}
.iteminteres{color:#000;width:24%;display:inline-block;box-shadow:1px 1px 2px 1px rgba(0,0,0,.8),0 1px 2px 0 rgba(0,0,0,.12);position:relative;padding:1%}
#pagination{clear:left;width:100%;height:auto;background-color:#000}
.reiting_img aside,footer{float:left}
.itemarticle p,li{text-align:justify}
*,:after,:before{-webkit-box-sizing:border-box}
.button,.button_pading,.asideitem,h1,h2,h3,h4,header{font-family:triodpostnajamedium}
.asideitem,.button,.button_pading,header{font-weight:600}
.clear{clear:both}
.rsa{position:sticky;top:3em;width:100%;float:right}
.youtube{position:relative;padding-bottom:56.25%;padding-top:25px;height:0}
.youtube iframe{position:absolute;top:0;left:0;width:100%;height:100%}
.container,.item img,header{width:100%}
#container{border-top:1px solid #000}
.itemarticle a{color:#ffffff;margin:0}
.asideitem,.asideitem img,.item img{border-top-left-radius:5px;border-top-right-radius:5px}
.asideitem,.asideitem,.item{position:relative;box-shadow:0 0 0 4px #000;border-radius:5px;width:100%}
.vremy{float:right;margin-right:5%}
.item{float:left;padding-bottom:1rem;filter:sepia(150%)}
.item:hover{-webkit-filter:none;-moz-filter:none;-ms-filter:none;-o-filter:none;filter:none;filter:none}
.item_img{position:relative}
.item h2{font-size:1.3rem;line-height:1.5rem}
.item_title{position:absolute;bottom:0;width:100%}
.item_title h2,p{margin:2%}
.itemarticle{width:98%;position:relative;margin:1%;float:left;padding:2%}
.asideitem{margin-top:3%;padding-bottom:1rem;filter:sepia(150%)}
.asideitem:hover{-webkit-filter:none;-moz-filter:none;-ms-filter:none;-o-filter:none;filter:none;filter:none}
.asideitem img{display:block;width:100%}
.asideitem h2{margin:2%;font-size:1rem}
.containermenu{width:100%;margin:0 auto;text-align:center;background-color:#000;font-family:triodpostnajamedium;margin-top:3px;margin-bottom:3px;z-index:2;position:sticky;top:0}
.header-left,.header-right{position:sticky;color:#000;float:left}
.header-left{width:30%;color:#fff}
.button,nav>a{position:relative}
.header-right span:after{top:14px}
.header-right{width:70%;text-align:right}
#open,.btn-menu{display:none}
nav>a{display:inline-block;font-size:.9rem;line-height:40px;padding:0 2em;text-decoration:none}
nav>a:hover{background:#fff;color:#000}
.button{float:right;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;margin:10px;padding:20px;text-align:center;text-transform:uppercase;overflow:hidden;-webkit-transition:.3s;transition:.3s;width:45%}
.button:after{float:right;position:absolute;-webkit-transition:.3s;transition:.3s;content:'';width:0;left:50%;bottom:0;height:3px;background:#000}
.button:hover{cursor:pointer}
.button:hover:after{width:100%;left:0}
.button_pading,nav>a{position:relative;color:#fff}
.button_pading{float:right;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;margin-left:5%;padding:20px;text-align:center;text-transform:uppercase;overflow:hidden;-webkit-transition:.3s;transition:.3s;width:48%}
.button_pading:after{float:right;position:absolute;-webkit-transition:.3s;transition:.3s;content:'';width:0;left:50%;bottom:0;height:3px;background:#fff}
.button_pading:hover{cursor:pointer}
.button_pading:hover:after{width:100%;left:0}
.button_pading{width:41%}
.hidden-menu-ticker{display:none}
.btn-menu{color:#fff;position:fixed;top:20px;right:20px;cursor:pointer;transition:right .23s;z-index:3;width:35px;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden}
.btn-menu span{display:block;height:6px;background-color:#000;margin:6px 0 0;transition:all .1s linear .23s;position:relative}
.btn-menu span.first{margin-top:0}
.hidden-menu-ticker:checked ~ .hidden-menu{right:0}
.hidden-menu-ticker:checked ~ .btn-menu span.first{-webkit-transform:rotate(45deg);top:10px}
.hidden-menu-ticker:checked ~ .btn-menu span.second{opacity:0}
.hidden-menu-ticker:checked ~ .btn-menu span.third{-webkit-transform:rotate(-45deg);top:-13px}
input[type=submit]{padding:0 18px;height:29px;font-size:12px;font-weight:700;color:#527881;text-shadow:0 1px #e3f1f1;background:#cde5ef;border:1px solid;border-color:#b4ccce #b3c0c8 #9eb9c2;border-radius:16px;outline:0;margin:3%;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;background-image:-webkit-linear-gradient(top,#edf5f8,#cde5ef);background-image:-moz-linear-gradient(top,#edf5f8,#cde5ef);background-image:-o-linear-gradient(top,#edf5f8,#cde5ef);background-image:linear-gradient(to bottom,#edf5f8,#cde5ef);-webkit-box-shadow:inset 0 1px white,0 1px 2px rgba(0,0,0,0.15);box-shadow:inset 0 1px white,0 1px 2px rgba(0,0,0,0.15)}
input[type=submit]:active{background:#cde5ef;border-color:#9eb9c2 #b3c0c8 #b4ccce;-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,0.2);box-shadow:inset 0 0 3px rgba(0,0,0,0.2)}
@media screen and (max-width:600px) {
.btn-menu,nav>a{display:block}
aside{width:100%}
#content a{width:98%;margin:2%}
#content{width:100%}
.button{width:43%}
.containermenu{width:100%}
nav{height:0;overflow:hidden}
input[type=checkbox]:checked+nav{height:auto}
nav>a{padding:0 1em;border-bottom:solid 1px rgba(255,255,255,.1)}
h1{padding:.4em 0;line-height:1rem}
.header-left,.header-right{width:100%;text-align:center}
.itemarticle p,li{text-align:justify}
.itemarticle{font-size:1rem;line-height:1.2rem}
.itemarticle p{text-indent:3rem;line-height:1.5rem}
.itemarticle h1{line-height:2rem}
.itemarticle h2,h3,h4{margin:3%;line-height:2rem}
li,ul{line-height:1.5rem}
li{padding-left:1%;margin-left:5%}
header h1{font-size:1.9em}
}
@media (min-width:600px) and (max-width:800px) {
.btn-menu,nav>a{display:block}
aside{width:100%}
#content a{width:48%}
#content{width:100%}
.button{width:45%}
.containermenu{width:100%}
nav{height:0;overflow:hidden}
.toc{height:100}
input[type=checkbox]:checked+nav{height:auto}
nav>a{padding:0 1em;border-bottom:solid 1px rgba(255,255,255,.1)}
h1{padding:.2em 0}
.header-left,.header-right{width:100%;text-align:center}
.itemarticle p,li{text-align:justify}
.itemarticle{font-size:1.2rem;line-height:1.2rem}
.itemarticle p{text-indent:3rem;line-height:1.5rem}
.itemarticle h1{line-height:3rem}
li,ul{line-height:1.5rem}
.itemarticle h2,h3,h4{margin:2%}
li{padding-left:1%;margin-left:5%}
header h1{font-size:3.5em}
}
@media (min-width:800px) and (max-width:1000px) {
.itemarticle p,li{text-align:justify}
aside{width:100%}
aside a{width:31%}
#content a{width:48%}
#content{width:100%}
.itemarticle{font-size:1.2rem;line-height:1.2rem}
.itemarticle p{text-indent:3rem;line-height:1.5rem}
.itemarticle h1{line-height:3rem}
li,ul{line-height:1.5rem}
.itemarticle h2,h3,h4{margin:2%}
li{padding-left:1%;margin-left:5%}
header h1{font-size:4.6em}
}
@media screen and (min-width:1000px) {
.itemarticle p,li{text-align:justify}
aside{width:20%}
aside a{width:95%}
#content{width:80%}
#content a{width:48%}
.itemarticle{font-size:1.3rem;line-height:1.4rem}
.itemarticle p{text-indent:4rem;line-height:1.8rem}
.itemarticle h1{line-height:3.5rem}
li,ul{line-height:1.8rem}
.itemarticle h2,h3,h4{margin:2%}
li{padding-left:1%;margin-left:5%}
.rsa{position:sticky;top:5em;width:20%;float:right}
header h1{font-size:4.6em}
}
@media screen and (min-width:1300px) {
.itemarticle p,li{text-align:justify}
aside{width:20%}
aside a{width:95%}
#content a{width:31%}
#content{width:80%}
.itemarticle{font-size:1.3rem;line-height:1.4rem}
.itemarticle p{text-indent:4rem;line-height:1.8rem}
.itemarticle h1{line-height:3.5rem}
li,ul{line-height:1.8rem}
.itemarticle h2,h3,h4{margin:2%}
li{padding-left:1%;margin-left:5%}
.rsa{position:sticky;top:3em;width:20%;float:right}
h4{font-size:1.3rem}
header h1{left:37%;top:50%;font-size:4.6em}
}
@media screen and (min-width:1400px) {
#content a{width:23%}
aside a{width:44%;margin:3%}
aside{font-size:0.5rem;line-height:0.9rem}
.asideitem p{font-size:1rem;line-height:0.8rem}
}