@import "/images/css/fonts.css";

.mceContentBody { padding: 10px; }

*, html, body { margin: 0px; padding: 0px; }
html { margin: 0px; padding: 0px; }

body { background-color: #ffffff; color: #361E29; font-family: 'Circe-Regular'; font-weight: normal; font-size: 16px; letter-spacing: 0px; line-height: 1.1; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-font-feature-settings: "liga" on;  -webkit-touch-callout: none; overflow-x: hidden; overflow-y: scroll; }
.noscroll_body { overflow: hidden; }

img { border: 0px; line-height: 0; height: auto; }
div { position: relative; }

p { line-height: 1.4; margin-top: 15px; margin-bottom: 15px; }
p.ligher { font-family: 'Circe-Bold'; }
p.small { font-family: 'Circe-Bold'; font-size: 14px; }
li { line-height: 1.4; margin-left: 25px; padding-left: 5px; }
h1 { font-size: 38px;
    line-height: 42px;
    margin-bottom: 12px;
    letter-spacing: -1px; color: #313131;
    font-family: 'Circe-Bold';
    font-weight: bold; }
h2 { font-size: 20px; font-family: 'Circe-Bold';
    font-weight: bold;}
h3 { font-size: 16px; font-family: 'Circe-Bold';
    font-weight: bold;}
h4 { font-size: 14px; font-family: 'Circe-Bold';
    font-weight: bold;}

/* П1: заголовки первого экрана и секций стали h1/h2 вместо div — разметка
   главной лежит в базе, поменять её можно только постфильтром. Правила
   .tt/.tit/.tttile ниже по файлу задают размер и начертание сами; здесь
   снимается всё, что правила h1/h2 выше и браузер по умолчанию добавляют
   сверх этого. Специфичность у правил ниже выше (.tt внутри div.fs и т.д.),
   поэтому они этот сброс перебивают, а h1/h2 — уже нет. */
h1.tt, h2.tit, h2.tttile {
    /* div выше по файлу объявлен position: relative, а h1/h2 — нет.
       У «Нашей миссии» внутри лежит абсолютный div.nr с фоном, и без этой
       строки он позиционируется не от заголовка, а от div.all_lines. */
    position: relative;
    margin: 0; padding: 0;
    font-size: inherit; line-height: inherit;
    font-family: inherit; font-weight: inherit;
    letter-spacing: normal; color: inherit;
}
strong { color: inherit; font-family: 'Circe-Bold';
    font-weight: bold;}
b { color: inherit; font-family: 'Circe-Bold';
    font-weight: bold;}

.upper { text-transform: uppercase !important; }

.invisible { display: none !important; }
.pointer { cursor: pointer; }
.hidden { opacity: 0; }
.needtoprocessmargin { opacity: 0; }
.needtoprocessmargin_done { opacity: 1; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transform: translateZ(0); }

.absolute { position: absolute; }
.relative { position: relative; }

.left { float: left; }
.right { float: right; }

.clear { clear: both; }

.align_center { text-align: center !important; }
.align_left { text-align: left !important; }
.align_right { text-align: right !important; }

div.h { display: inline-block; height: 100%; vertical-align: middle; }

.white { color: #fff; }
.reg { color: #ff0000; }
.black { color: #000 !important; }

a { text-decoration: underline; color: #361E29; }
a:hover { text-decoration: none; }

div.all_lines { max-width: 1150px; margin: 0px auto; box-sizing: border-box; }

.flow { -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; -webkit-transform: translateZ(0); }
.flow_slow { -webkit-transition: all 1.0s ease-in-out; -moz-transition: all 1.0s ease-in-out; -ms-transition: all 1.0s ease-in-out; -o-transition: all 1.0s ease-in-out; transition: all 1.0s ease-in-out; -webkit-transform: translateZ(0); }

header { position: fixed; top: 0px; left: 0px; right: 0px; height: 57px; background: #361E29; box-sizing: border-box; z-index: 20; }
header div.menu { height: 57px; vertical-align: middle; }
header div.menu a.menuitem { display: inline-block; margin-left: 55px; margin-right: 55px; vertical-align: middle; font-size: 16px; line-height: 18px; color: #fff; text-decoration: none; }
header div.menu a.menuitem span { position: relative;z-index:1;color:#361E29; }
header div.menu a.menuitem_first { margin-left: 0px; }
header div.menu a.menuitem:last-child { margin-right: 0px; }
header div.menu a.menuitem.withback div.bb { position: absolute;z-index:0;left:0;right:0;top:0;bottom:0;background-color:#ffffff;border-radius:15px;margin:-6px -35px -4px -35px; }
header div.menu a:hover { text-decoration: underline; }
header div.mswitcher { display: none; }
header div.social { display: none; }

footer { position: relative; box-sizing: border-box; background: #361E29; z-index: 20; padding-top: 60px; padding-bottom: 60px; }
footer div.l { display: inline-block; width: 30%; vertical-align: top; }
footer div.l img { width: 263px; }
footer div.tdata { display: inline-block; width: 70%; vertical-align: top; font-size: 18px; line-height: 27px; color: #FFFFFF; }
footer a { color: #fff; }
/* Ни height, ни min-height. Жёсткие 50px тут стояли с рождения, а блок
   .copy их всегда перерастал (шесть строк — 126px): лишнее вылезало
   за нижнюю кромку подвала, где текст цвета rgba(255,255,255,0.5)
   ложится светлым по светлому фону страницы и не читается. Замерено
   на 1440 до правки: подвал кончался на 828, .copy — на 843,9.
   Высота здесь обязана считаться по содержимому. */
footer div.tdata div.elems { vertical-align: middle; margin-top: 15px; }
/* .elems на планшете и мобильном — прозрачная подложка во всю ширину
   .tdata (position: absolute, см. nnn_mobile.css), и она перехватывала
   клики по ссылкам абзаца, лежащего под ней: телефон и почта в тексте
   «отправив данные по телефону …» не нажимались ни на 390, ни на 768.
   Предсуществующий дефект, проверен на исходном CSS. Подложка кликов
   не ждёт — их ждут её дети. */
footer div.tdata div.elems { pointer-events: none; }
footer div.tdata div.elems > div { pointer-events: auto; }
footer div.tdata div.elems div.elem { display: inline-block; vertical-align: middle; margin-left: 30px; }
footer div.tdata div.elems div.elem:first-child { margin-left: 0px; }
footer div.tdata div.elems div.elem img { margin-left: 8px; width: 41px; height: auto; cursor: pointer; line-height: 0; }
footer div.tdata div.elems div.copy { color: rgba(255,255,255,0.5); font-size: 14px; line-height: 18px; }
footer div.tdata div.elems div.social { height: 39px; }
div.elem.social a { display: inline-block; }

section { margin-top: 57px; }

div.fs { background-image: url(/files/fsback.png); background-repeat: no-repeat; background-position: bottom center; background-size: cover; height: 1144px; }
div.fs div.all_lines { height: 100%; }
div.circle { position: absolute; right: -100px; top: -50px; width: 849px; height: 849px; background-image: url(/files/circle.png); background-repeat: no-repeat; background-position: center center; background-size: cover; }
/* Анимация hero: класс circle_anim вешает site_public.js — без JS остаётся
   исходная статичная circle.png, поэтому первый экран не может оказаться
   пустым. Четыре слоя (1000x1000, контент отцентрован): два розовых кольца
   дышат в противофазе, зелёные круги статичны, хоровод вращается. */
div.circle_anim { background-image: none; }
div.circle_anim::before, div.circle_anim::after,
div.circle_anim div.lay {
	content: ''; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
	background-repeat: no-repeat; background-position: center center; background-size: contain;
	pointer-events: none;
}
div.circle_anim::before { z-index: 0; background-image: url(/files/hero/circle-out.png); animation: km_ring_pulse 9s ease-in-out infinite; }
div.circle_anim::after { z-index: 0; background-image: url(/files/hero/circle-in.png); animation: km_ring_pulse 9s ease-in-out infinite; animation-delay: -4.5s; }
div.circle_anim div.lay_green { z-index: 1; background-image: url(/files/hero/green-clean.png); }
/* transform-origin — измеренный центр хоровода (503.5, 499.5 из 1000), а не
   середина элемента: иначе круг при вращении заметно ведёт. */
div.circle_anim div.lay_people { z-index: 2; background-image: url(/files/hero/people-cut.png); transform-origin: 50.35% 49.95%; animation: km_circle_spin 90s linear infinite; will-change: transform; }
div.circle_anim div.play { z-index: 3; }
@keyframes km_circle_spin { from { transform: rotate( 0deg ); } to { transform: rotate( 360deg ); } }
@keyframes km_ring_pulse { 0%, 100% { transform: scale( 1 ); opacity: 0.9; } 50% { transform: scale( 1.045 ); opacity: 1; } }
div.circle div.play { position: absolute; right: 135px; bottom: 180px; width: 148px; height: 148px; background-repeat: no-repeat; background-position: top left; background-size: cover; cursor: pointer; border: 4px solid #fff; border-radius: 153px; box-sizing: border-box; }
div.circle div.play div { position: absolute; width: 41px; height: 41px; left: 50%; top: 50%; margin-left: -20.5px; margin-top: -20.5px; background-image: url(/files/play_1.png); background-repeat: no-repeat; background-position: top left; background-size: cover; } 
div.circle div.play:hover div { background-image: url(/files/play_2.png); }

div.circle div.play.el_1 { right: 115px; bottom: 542px; }
div.circle div.play.el_2 { right: 80px; bottom: 386px; }
div.circle div.play.el_3 { right: 115px; bottom: 230px; }

div.fs .tt { padding-top: 28px; max-width: 392px; font-weight: 400; font-size: 20px; line-height: 22px; opacity: 0.6; }
div.fs div.log { margin-top: 200px; }
div.fs div.ttt { margin-top: 22px; max-width: 547px; font-weight: 400; font-size: 22px; line-height: 32px; }
div.fs div.bt { position: absolute; left: 0px; bottom: 270px; right: 0px; font-weight: 400; font-size: 48px; line-height: 50px; color: #fff; }
div.fs div.bt div.pod { text-align: right; font-size: 18px; line-height: 18px; }

div.russia { padding-bottom: 120px; }
div.russia div.img { text-align: center; }
div.russia div.img img { max-width: 100%; }
/* Ширина как у картинки, которую видео заменяет: у <img> она бралась из
   натуральных 913px, у <video> натурального размера нет — растянулось бы
   на всю колонку 1150px. */
div.russia div.img video.doves_video { display: inline-block; width: 913px; max-width: 100%; height: auto; vertical-align: top; }
div.russia div.tt { display: inline-block; width: 50%; box-sizing: border-box; font-weight: 400; font-size: 18px; line-height: 27px; vertical-align: top; }
div.russia div:last-child { padding-left: 34px; }

div.russia div.help_button { position: absolute; left: 50%; margin-left: -150px; width: 300px; bottom: 30px; height: 44px; vertical-align: middle; background-color:#361E29; border-radius:20px; text-align: center; z-index: 10; cursor: pointer; }
div.russia div.help_button span { display: inline; vertical-align: middle; font-size: 16px; color: #fff; }


div.mission { background: rgba(209, 241, 255, 0.9); padding-top: 120px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transform: translateZ(0); }
div.mission_bottomdown { padding-bottom: 242px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transform: translateZ(0); }
div.mission div.cloudtop { position: absolute; top: -62px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudtop.png); background-repeat: no-repeat; background-position: bottom center; background-size: cover; }
div.mission div.cloudbottom { position: absolute; bottom: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudbottom.png); background-repeat: no-repeat; background-position: top center; background-size: cover; z-index: 19; }
div.mission .tttile { margin-top: 56px; font-weight: 400; font-size: 60px; line-height: 66px; }
div.mission div.tt { padding-top: 43px; max-width: 547px; font-weight: 400; font-size: 18px; line-height: 27px; }
div.mission .tttile div.nr { position: absolute; right: 0px; width: 510px; height: 510px; top: 0px; background-image: url(/files/nr.png); background-repeat: no-repeat; background-position: center center; background-size: cover; }
div.mission div.mphoto { display: none; }
div.mission div.strangeback { margin-top: 31px; height: 147px; background-image: url(/files/strangeback.png); background-repeat: no-repeat; background-position: top left; }
div.mission div.strangeback div.name { padding-top: 45px; margin-left: 38px; font-weight: 400; font-size: 30px; line-height: 18px; }
div.mission div.strangeback div.subname { margin-left: 38px; padding-top: 20px; font-weight: 400; font-size: 14px; line-height: 21px; max-width: 481px; }
div.mission div.hiddentext { margin-top: 124px; font-size: 18px; line-height: 27px;  }
div.mission div.hiddenlink { position: absolute; left: 0px; right: 0px; bottom: 10px; text-align: center; }
div.mission div.hiddenlink a { font-size: 18px; line-height: 27px; text-decoration: underline; color: #361E29; }
div.mission div.hiddenlink a:hover { text-decoration: none; }
div.mission div.hiddenlinkOpened { }
div.mission div.strangeback div.ee { display: none; }

div.members { margin-top: 100px; padding-bottom: 50px; }
div.members .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: center; }
div.members div.mem_circle { margin-top: 10px; height: 580px; }
div.members div.mem_circle div.ar_left { position: absolute; left: 0px; top: 50%; width: 44px; height: 44px; cursor: pointer; background-image: url(/images/fgalleft.png); cursor: pointer; }
div.members div.mem_circle div.ar_left:hover { background-image: url(/images/fgalleft_h.png); }
div.members div.mem_circle div.ar_right { position: absolute; right: 0px; top: 50%; width: 44px; height: 44px; cursor: pointer; background-image: url(/images/fgalright.png); cursor: pointer; }
div.members div.mem_circle div.ar_right:hover { background-image: url(/images/fgalright_h.png); }
div.members div.mem_circle div.main { position: absolute; left: 50%; margin-left: -270px; top: 0px; width: 539px; height: 539px; background-image: url(/files/mem_circle.png); background-repeat: no-repeat; background-position: center center; background-size: cover; }

div.members div.mem_circle div.main div.cur { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background-image: none !important; }
div.members div.mem_circle div.main div.cur div.ph { position: absolute; left: 50%; top: 50%; width: 326px; height: 326px;  margin-left: -163px;  margin-top: -163px; background-repeat: no-repeat; background-position: center center; background-size: cover; border-radius: 400px; }
div.members div.mem_circle div.main div.cur div.name { position: absolute; left: 0px; right: 0px; bottom: 60px; font-size: 30px; line-height: 18px; text-align: center; }
div.members div.mem_circle div.main div.cur div.dolg { position: absolute; left: 70px; right: 70px; bottom: 0px; font-size: 14px; line-height: 21px; text-align: center; color: rgba(54, 30, 41, 0.6); }

div.members div.mem_circle div.main div.low { z-index: -1000; }
div.members div.mem_circle div.main div.low div { display: none; }
div.members div.mem_circle div.main div.pre { z-index: 10; position: absolute; top: 45%; left: -100px; background-repeat: no-repeat; background-position: center center; background-size: cover; width: 173px; height: 173px; border-radius: 400px; opacity: 0.4; }
div.members div.mem_circle div.main div.prepre { z-index: 10; position: absolute; top: 60%; left: -220px; background-repeat: no-repeat; background-position: center center; background-size: cover; width: 107px; height: 107px; border-radius: 400px;opacity: 0.3;  }
div.members div.mem_circle div.main div.next { z-index: 10; position: absolute; top: 45%; right: -100px; background-repeat: no-repeat; background-position: center center; background-size: cover; width: 173px; height: 173px; border-radius: 400px;opacity: 0.4; }
div.members div.mem_circle div.main div.nextnext { z-index: 10; position: absolute; top: 60%; right: -220px; background-repeat: no-repeat; background-position: center center; background-size: cover; width: 107px; height: 107px; border-radius: 400px;opacity: 0.3;  }

div.members div.text { margin-left: 140px; margin-right: 140px; margin-top: 10px; font-weight: 400; font-size: 18px; line-height: 27px; text-align: center; }



div.objectives { background: rgba(237, 210, 243,0.9); padding-top: 242px; padding-bottom: 242px; }
div.objectives div.cloudtop { position: absolute; top: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudtop.png); background-repeat: no-repeat; background-position: bottom center; background-size: cover; }
div.objectives div.cloudbottom { position: absolute; bottom: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudbottom.png); background-repeat: no-repeat; background-position: top center; background-size: cover; z-index: 19; }
div.objectives .tttile { margin-top: 10px; font-weight: 400; font-size: 60px; line-height: 66px; }

div.objectives div.sb { margin-top: 50px; vertical-align: top; }
div.objectives div.sb div.wc { display: inline-block; background-color: #fff; border-radius: 20px; width: 50%; height: 293px; vertical-align: top; }
div.objectives div.sb div.wc div.img { margin-top: 46px; margin-left: 42px; width: 65px; display: inline-block;  vertical-align: top; }
div.objectives div.sb div.wc div.img img { width: 100%; }
div.objectives div.sb div.wc div.tt { margin-top: 46px; margin-left: 32px; max-width: 70%; display: inline-block; vertical-align: top; font-weight: 400; font-size: 20px; line-height: 29px; }
div.objectives div.sb div.rr { display: inline-block; width: 50%; vertical-align: top; }
div.objectives div.sb div.rr div.elem { height: 80px; vertical-align: middle; box-sizing: border-box; padding-left: 45px; margin-top: 25px; }
div.objectives div.sb div.rr div.elem:first-child { margin-top: 0px; }
div.objectives div.sb div.rr div.elem div.krug { display: inline-block; width: 76px; height: 76px; background-color: #fff; border-radius: 76px; line-height: 76px; text-align: center; font-size: 30px; vertical-align: middle; }
div.objectives div.sb div.rr div.elem div.td { display: inline-block; width: 80%; font-size: 18px; line-height: 27px; text-align: left; vertical-align: middle; box-sizing: border-box; padding-left: 23px; }


div.tasks { background-image: url(/images/krem.png); background-repeat: no-repeat; background-position: bottom center; background-size: cover; height: 649px; }
div.tasks .tit { font-weight: 400; font-size: 60px; line-height: 66px; padding-top: 67px; }
div.tasks div.datas { vertical-align: top; }
div.tasks div.datas div.elem { display: inline-block; width: 33.33%; vertical-align: top; margin-top: 36px; background-image: url(/files/purplecircle.png); background-repeat: no-repeat; background-position: top left; padding-top: 55px; }
div.tasks div.datas div.elem div.tl { font-size: 18px; line-height: 27px; max-width: 95%; }



div.doings { padding-bottom: 30px; }
div.doings .tit { font-weight: 400; font-size: 60px; line-height: 66px; }
div.doings div.rest { margin-top: 40px; }
div.doings div.rest div.in { display: inline-block; padding-top: 93px; padding-left: 61px; padding-bottom: 77px; background-color: rgba(245, 235, 210, 0.6); border-radius: 20px; }
div.doings div.rest div.in div.text { margin-right: 183px; font-size: 18px; line-height: 27px; max-width: 516px; }
div.doings div.rest div.gal { position: absolute; right: 0px; top: 50%; margin-top: -213px; height: 426px; width: 528px; z-index: 10; border-radius: 20px; }
div.doings div.rest div.gal div.all { position: absolute; width: 100%; height: 100%; border-radius: 20px; background-size: cover; background-position: center center; background-repeat: no-repeat; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transform: translateZ(0); z-index: 19; opacity: 0; }
div.doings div.rest div.gal div.cur { z-index: 21; opacity: 1; }
div.doings div.rest div.gal div.arl { position: absolute; right: 61px; width: 44px; height: 44px; bottom: -67px; cursor: pointer; background-image: url(/images/fgalleft.png); }
div.doings div.rest div.gal div.arl:hover { background-image: url(/images/fgalleft_h.png); }
div.doings div.rest div.gal div.arr { position: absolute; right: 0px; width: 44px; height: 44px; bottom: -67px; cursor: pointer; background-image: url(/images/fgalright.png); }
div.doings div.rest div.gal div.arr:hover { background-image: url(/images/fgalright_h.png); }



div.narodis { margin-top: 100px; padding-bottom: 30px; }
div.narodis .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: center; }
div.narodis div.tt { margin-top: 60px; display: inline-block; width: 50%; box-sizing: border-box; font-weight: 400; font-size: 18px; line-height: 27px; vertical-align: top; }
div.narodis div.tt:last-child { padding-left: 42px; }
div.narodis div.galss { height: 359px; overflow-y: auto; }
div.narodis div.tt p { font-weight: 400; font-size: 18px; line-height: 27px; margin-top: 20px; margin-bottom: 30px; }
div.narodis div.tt div.img { margin-bottom: 20px; display: inline-block; }
div.narodis div.tt div.img:last-child { margin-bottom: 0px; }
div.narodis div.tt div.img img { width: 100%; border-radius: 20px; }



div.sisters { margin-top: 97px; padding-bottom: 30px; }
div.sisters .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: center; }
div.sisters div.tt { margin-top: 60px; display: inline-block; width: 50%; box-sizing: border-box; font-weight: 400; font-size: 18px; line-height: 27px; vertical-align: top; }
div.sisters div.tt:last-child { padding-left: 42px; }
div.sisters div.tt p { font-weight: 400; font-size: 18px; line-height: 27px; margin-top: 0px; margin-bottom: 30px; }
div.sisters div.pics { margin-top: 55px; }
div.sisters div.pics div.el { display: inline-block; height: 388px; }
div.sisters div.pics div.el div.in { position: absolute; top:0px;bottom:0px;left:0px;right:0px; border-radius: 20px; background-repeat: no-repeat; background-position: center center; background-size: cover; }
div.sisters div.pics div.el div.in div { position: absolute; width: 41px; height: 41px; left: 50%; top: 50%; margin-left: -20.5px; margin-top: -20.5px; background-image: url(/files/play_1.png); background-repeat: no-repeat; background-position: top left; background-size: cover; cursor: pointer; } 
div.sisters div.pics div.el div.in div:hover { background-image: url(/files/play_2.png); }
div.sisters div.pics div.el:first-child { width: 33.33%; }
div.sisters div.pics div.el:first-child div.in { right: 15px; }
div.sisters div.pics div.el:last-child { width: 66.66%; }
div.sisters div.pics div.el:last-child div.in { left: 15px; }
div.sisters div.texts { margin-top: 50px; background: #D1F1FF; border-radius: 20px; box-sizing: border-box; padding: 40px; text-align: center; font-size: 18px; line-height: 27px; }
div.sisters div.texts div.ee { position: absolute; z-index: 0; background: #D1F1FF; border-radius: 20px; width: 60px; height: 60px; transform: rotate(45deg); top: -20px; left: 15%; }

div.sisters div.butblock { text-align: center; margin-top: 45px; }
div.sisters div.butblock div.button { display: inline-block; height: 44px; width: 291px; vertical-align: middle; background-color: #361E29; border-radius:20px; text-align: center; cursor: pointer; margin: 0 10px 0 10px; }
div.sisters div.butblock div.button span { display: inline; vertical-align: middle; font-size: 16px; color: #fff; }


div.events_gallery { padding-top: 0px; padding-bottom: 0px; }
#eventss { background: rgba(244, 221, 210,0.9); padding-top: 202px; padding-bottom: 180px; }
#eventss div.cloudtop { position: absolute; top: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudtop.png); background-repeat: no-repeat; background-position: bottom center; background-size: cover; }
#eventss div.cloudbottom { position: absolute; bottom: 0px; left: 0px; right: 0px; height: 180px; background-image: url(/files/cloudbottom.png); background-repeat: no-repeat; background-position: top center; background-size: cover; z-index: 19; }
div.events_gallery .tttile { margin-top: 77px; font-weight: 400; font-size: 60px; line-height: 66px; }
div.events_gallery div.videos { display: flex; justify-content: space-between; margin-top: 50px; }
div.events_gallery div.videos div.el { height: 230px; width: 368px; border-radius: 20px; background-repeat: no-repeat; background-position: center center; background-size: cover; }
div.events_gallery div.videos div.el div { position: absolute; width: 41px; height: 41px; left: 50%; top: 50%; margin-left: -20.5px; margin-top: -20.5px; background-image: url(/files/play_1.png); background-repeat: no-repeat; background-position: top left; background-size: cover; cursor: pointer; } 
div.events_gallery div.videos div.el div:hover { background-image: url(/files/play_2.png); }

div.events_gallery div.elems { margin-top: 10px; display: flex; justify-content: space-evenly; flex-wrap: wrap; }
div.events_gallery div.elems div.el { height: 556px; width: 368px; border-radius: 20px; background-color: #fff; box-sizing: border-box; padding: 21px; margin-top: 35px; overflow: hidden; }
div.events_gallery div.elems div.el div.in { position: absolute; top: 26px; bottom: 31px; left: 21px; right: 21px; }
div.events_gallery div.elems div.el div.in div.img { height: 204px; background-position: 50% 50%; background-size: cover; border-radius: 20px; }
div.events_gallery div.elems div.el div.in div.date { margin-top: 24px; font-size: 14px; }
div.events_gallery div.elems div.el div.in div.title { margin-top: 8px; font-size: 18px; font-weight: 700; line-height: 1.5; max-height: 60px; overflow-y: hidden; }
div.events_gallery div.elems div.el div.in div.anons { margin-top: 12px; font-size: 14px; line-height: 1.55; max-height: 105px; overflow-y: hidden; color: #828282; }
div.events_gallery div.elems div.el div.in div.anons p { margin: 0px; font-size: 14px; line-height: 1.55; }
div.events_gallery div.elems div.el div.in div.but { position: absolute; bottom: 0px; left: 0px; border-radius: 44px; padding: 56px; padding-top: 16px; padding-bottom: 17px; border: 1px solid #361E29; cursor: pointer; }
div.events_gallery div.elems div.el div.in div.but label { font-size: 14px; line-height: 12.393px; cursor: pointer; }
div.events_gallery div.elems div.el div.in div.but i { margin-left: 5px; font-size: 10px; cursor: pointer; }

div.events_gallery div.elems div.el.new div.but { display: none; }

div.events_gallery div.elemslink { margin-top: 50px; text-align: center; }
div.events_gallery div.elemslink a { font-size: 20px; line-height: 30px; text-decoration: underline; color: #361E29; }
div.events_gallery div.elemslink a:hover { text-decoration: none; }



div.addkurs { background-color: #E7F0D2; padding-top: 242px; padding-bottom: 242px; }
div.addkurs div.cloudtop { position: absolute; top: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudtop.png); background-repeat: no-repeat; background-position: bottom center; background-size: cover; }
div.addkurs div.cloudbottom { position: absolute; bottom: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudbottom.png); background-repeat: no-repeat; background-position: top center; background-size: cover; z-index: 19; }
div.addkurs .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: left; }
div.addkurs div.inner_data { box-sizing: border-box; vertical-align: top; margin-top: 40px; }
div.addkurs div.inner_data div.part_data { display: inline-block; width: 50%; vertical-align: top; box-sizing: border-box; }
div.addkurs div.inner_data div.part_data:first-child { padding-right: 15px; }
div.addkurs div.inner_data div.part_data:last-child { padding-left: 15px; }
div.addkurs div.inner_data div.part_data ol { list-style-type: none; counter-reset: num; margin: 0 0 0 95px; padding: 15px 0 5px 0; font-weight: 400; font-size: 18px; line-height: 27px; }
div.addkurs div.inner_data div.part_data ol li { position: relative; margin: 0 0 0 0; padding: 0 0 50px 0; }
div.addkurs div.inner_data div.part_data ol li:before {	content: counter(num); 	counter-increment: num;	display: inline-block;	position: absolute; top: 0; left: -98px; width: 76px; height: 76px; background: #fff; color: #361E29; text-align: center; line-height: 76px; font-size: 30px; border-radius: 76px; }
div.addkurs div.inner_data div.part_data div.video_block { height: 530px; border-radius: 20px; background-colors: #d9d9d9; margin-top: 15px; vertical-align: top; }
div.addkurs div.inner_data div.part_data div.video_block img { border-radius: 20px; width: 100%; }
div.addkurs div.inner_data div.part_data div.butblock { text-align: center; margin-top: 45px; }
div.addkurs div.inner_data div.part_data div.butblock div.help_button { display: inline-block; height: 44px; width: 291px; vertical-align: middle; background-color: #361E29; border-radius:20px; text-align: center; cursor: pointer; }
div.addkurs div.inner_data div.part_data div.butblock div.help_button span { display: inline; vertical-align: middle; font-size: 16px; color: #fff; }

div.reabil { background-color: #fff; padding-top: 10px; padding-bottom: 10px; }
div.reabil .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: left; }
div.reabil div.coms { margin-top: 40px; font-weight: 400; font-size: 18px; line-height: 27px; }
div.reabil div.reabsm { display: flex; justify-content: space-between; margin-top: 60px; align-items: stretch; flex-wrap: wrap; }
div.reabil div.reabsm div.el { width: 47%; margin-bottom: 30px; padding-top: 140px; opacity: 0; }
div.reabil div.reabsm div.el div.img { position: absolute; top: 0; left: 0; right: 0; height: 190px; background-repeat: no-repeat; background-position: bottom center; background-size: contain; z-index: 1; }
div.reabil div.reabsm div.el div.next { position: absolute; bottom: 10px; right: 20px; z-index: 21; }
div.reabil div.reabsm div.el div.next a { text-decoration: underline; font-weight: 400; font-size: 18px; line-height: 27px; }
div.reabil div.reabsm div.el div.anons { background-color: #FBF1F3; border-radius: 20px; font-family: 'Circe-Regular'; font-weight: normal; font-size: 18px; text-align: left; line-height: 1.4; padding: 60px 50px 60px 50px; }
div.reabil div.reabsm div.el div.anons p { margin: 0; vertical-align: middle; display: inline-block; }

div.milosist { background: rgba(209, 241, 255, 1); padding-top: 242px; padding-bottom: 242px; }
div.milosist div.cloudtop { position: absolute; top: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudtop.png); background-repeat: no-repeat; background-position: bottom center; background-size: cover; }
div.milosist div.cloudbottom { position: absolute; bottom: 0px; left: 0px; right: 0px; height: 242px; background-image: url(/files/cloudbottom.png); background-repeat: no-repeat; background-position: top center; background-size: cover; z-index: 19; }
div.milosist .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: center; }
div.milosist div.sistersm { display: flex; justify-content: space-between; margin-top: 35px; align-items: stretch; flex-wrap: wrap; overflow-y: hidden; }
div.milosist div.sistersm div.el { width: 31%; margin-bottom: 50px; cursor: pointer; }
div.milosist div.sistersm div.el div.img { height: 233px; border-radius: 20px; background-repeat: no-repeat; background-position: center center; background-size: cover; }
div.milosist div.sistersm div.el div.name { margin-top: 15px; font-family: 'Circe-Bold'; font-weight: normal; font-size: 18px; text-transform: uppercase; text-align: center; }
div.milosist div.sistersm div.el div.anons { margin-top: 10px; font-family: 'Circe-Regular'; font-weight: normal; font-size: 18px; text-align: center; line-height: 1.4; }
div.milosist div.elemslink { margin-top: 20px; text-align: center; }
div.milosist div.elemslink a { font-size: 20px; line-height: 30px; text-decoration: underline; color: #361E29; }
div.milosist div.elemslink a:hover { text-decoration: none; }

div.popechsovet { margin-top: 10px; padding-bottom: 30px; }
div.popechsovet .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: center; }
div.popechsovet div.elems { margin-top: 10px; display: flex; justify-content: space-between; vertical-align: top; }
div.popechsovet div.elems div.el { width: 368px; box-sizing: border-box; margin-top: 30px; vertical-align: top; }
div.popechsovet div.elems div.el div.photo { width: 100%; height: 368px; background-image: url(/files/popechfon.png); background-repeat: no-repeat; background-position: center center; background-size: cover; }
div.popechsovet div.elems div.el div.photo img.ph { border: 10px solid #fff; border-radius: 400px; width: 240px; position: absolute; left: 50%; top: 50%; margin-left: -138px; margin-top: -135px; }
div.popechsovet div.elems div.el div.texts { margin-top: 10px; background: #F4DDD2; border-radius: 20px; box-sizing: border-box; padding: 35px; text-align: left; font-size: 14px; line-height: 20px; }
div.popechsovet div.elems div.el div.texts div.tti { font-size: 30px; line-height: 18px; margin-bottom: 20px; }
div.popechsovet div.elems div.el div.texts div.ee { position: absolute; z-index: 0; background: #F4DDD2; border-radius: 20px; width: 60px; height: 60px; transform: rotate(45deg); top: -20px; left: 50%; margin-left: -30px; }
div.popechsovet div.elemslink { margin-top: 50px; text-align: center; }
div.popechsovet div.elemslink a { font-size: 20px; line-height: 30px; text-decoration: underline; color: #361E29; }
div.popechsovet div.elemslink a:hover { text-decoration: none; }


div.all_elemslink { margin-top: 50px; text-align: center; }
div.all_elemslink a { font-size: 20px; line-height: 30px; text-decoration: underline; color: #361E29; }
div.all_elemslink a:hover { text-decoration: none; }

div.otdelblag { margin-top: 50px; padding-bottom: 30px; }
div.otdelblag .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: center; }
div.otdelblag div.text { font-weight: 400; font-size: 18px; line-height: 26px; text-align: center; margin-top: 30px;  margin-bottom: 30px; padding-left: 100px; padding-right: 100px; }
div.otdelblag div.elems { margin-top: 30px; vertical-align: top; }
div.otdelblag div.elems div.el { width: 33.33%; display: inline-block; box-sizing: border-box; margin-top: 30px; vertical-align: top; text-align: center; font-size: 24px; line-height: 18px; }



div.donate { margin-top: 70px; padding-bottom: 80px; }
div.donate .tit { font-weight: 400; font-size: 60px; line-height: 66px; text-align: left; }
div.donate div.main { margin-top: 40px; }
div.donate div.main div.col { display: inline-block; width: 50%; box-sizing: border-box; vertical-align: top; }
div.donate div.main div.col:first-child { padding-right: 40px; }
div.donate div.main div.col:last-child { padding-left: 40px; }
div.donate div.main div.col_full { width: 100%; margin-bottom: 80px; }
div.donate div.main div.col_full:first-child { padding-right: 0px; }
div.donate div.main div.col_full:last-child { padding-left: 0px; }
div.donate div.main div.col_full div.in { margin-left: 110px; margin-right: 110px; margin-top: 20px; margin-bottom: 20px; }
div.donate div.main div.col_full div.in div.t { font-size: 19px; font-weight: 700; margin-bottom: 10px; }
div.donate div.main div.col_full div.in div.buttons { vertical-align: middle; display: flex; justify-content: space-between; margin-bottom: 36px; }
div.donate div.main div.col_full div.in div.buttons:last-child { margin-bottom: 0px; }
div.donate div.main div.col_full div.in div.buttons div.but { display: inline-block; vertical-align: middle; height: 50px; box-sizing: border-box; background-color: #fff; border: 1.5px solid #CBCBCB; text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transform: translateZ(0); cursor: pointer; user-select: none; }
div.donate div.main div.col_full div.in div.buttons div.but span { display: inline-block; vertical-align: middle; text-transform: uppercase; font-size: 18px; color: #555555; line-height: 1; }
div.donate div.main div.col_full div.in div.buttons div.but span.l { text-transform: none; }
div.donate div.main div.col_full div.in div.buttons div.but_selected { border: 1.5px solid #361E29; }
div.donate div.main div.col_full div.in div.buttons div.but_selected span { font-weight: 700; color: #361E29; }
div.donate div.main div.col_full div.in div.buttons div.but_50 { width: 49%; }
div.donate div.main div.col_full div.in div.buttons div.but_100 { width: 100%; background-color: #361E29; border: 1px solid #361E29; }
div.donate div.main div.col_full div.in div.buttons div.but_100 span { color: #fff; }
div.donate div.main div.col_full div.in div.buttons div.but_20 { width: 19%; }

div.donate div.main div.ttit { font-weight: 400; font-size: 30px; line-height: 18px; text-align: left; margin-top: 40px; }
div.donate div.main p { font-weight: 400; font-size: 18px; line-height: 27px; margin-top: 30px; margin-bottom: 0px; }

div.donate div.main div.buts { margin-top: 30px; }
div.donate div.main div.buts div.button { display: inline-block; height: 56px; background-color: #ffffff; border: 1px solid #361E29; border-radius: 100px; box-sizing: border-box; vertical-align: middle; font-size: 16px; cursor: pointer; margin-right: 12px; padding-left: 32px; padding-right: 32px; }
div.donate div.main div.buts div.button:hover { background-color: #361E29; color: #fff; }
div.donate div.main div.buts div.button img { line-height: 0px; margin-right: 5px; position: relative; top: 8px; }
div.donate div.main div.buts div.button label { display: inline-block; vertical-align: middle; color: inherit; cursor: pointer; }
div.donate div.main div.buts div.button span { font-size: 12px; line-height: 14px; cursor: pointer; color: #8C8C8C; font-weight: 600; }
div.donate div.main div.buts div.button a { font-size: 16px; color: inherit; text-decoration: none; }
div.donate div.main div.buts div.button:hover a { color: #fff; text-decoration: none; }

div.donate div.main div.plate { border-radius: 20px; background-color: rgba(245, 235, 210, 0.6); box-sizing: border-box; padding: 40px; margin-bottom: 12px; }
div.donate div.main div.plate p { margin-top: 0px; margin-bottom: 20px; }
div.donate div.main div.plate div.comment { font-size: 18px; line-height: 27px; padding-left: 80px; }
div.donate div.main div.plate div.comment img { position: absolute; left: 0px; top: 50%; margin-top: -25px; }
/* Ссылка в плашке — номер телефона (href в базе ведёт на телеграм, не tel:), рвать его посередине нельзя. */
div.donate div.main div.plate div.comment a { white-space: nowrap; }

.reviews_teaser { padding-bottom: 60px; }
.reviews_page { padding-top: 40px; padding-bottom: 90px; }
.reviews_teaser .tit, .reviews_page .tit { margin: 0px; font-weight: 400; font-size: 60px; line-height: 66px; text-align: center; }
/* Фиксированная basis + justify-content: center, а не растягивание по всей
   полосе: один отзыв не превращается в ленту на 1150px, а неполный последний
   ряд стоит по центру, как и заголовок с формой. */
.reviews_teaser .cards, .reviews_page .cards { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 40px; }
.review_card { flex: 0 1 350px; box-sizing: border-box; display: flex; flex-direction: column; padding: 28px 30px; border-radius: 20px; background-color: rgba(245, 235, 210, 0.6); }
.review_card .name { font-weight: 600; }
.review_card .date { font-size: 14px; opacity: 0.6; margin: 2px 0px 10px; }
/* Обрезка по строкам, а не по символам: длинный отзыв не растягивает весь ряд,
   а «Читать полностью» открывает его целиком в попапе. Полный текст остаётся
   в разметке — попап берёт его оттуда, и поисковик видит отзыв целиком. */
.review_card .text { line-height: 26px; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.review_card .readmore { margin-top: auto; padding-top: 14px; }
.review_card .readmore.rm_hidden { display: none; }
.review_card .readmore a { font-size: 16px; text-decoration: underline; color: #361E29; }
.review_card .readmore a:hover { text-decoration: none; }
div.overWindow div.in div.review_full { padding: 36px; }
div.overWindow div.in div.review_full .name { font-weight: 600; font-size: 22px; line-height: 28px; }
div.overWindow div.in div.review_full .date { font-size: 14px; opacity: 0.6; margin: 4px 0px 18px; }
div.overWindow div.in div.review_full .text { font-size: 16px; line-height: 26px; }
.reviews_teaser .more { margin-top: 40px; text-align: center; }
.reviews_teaser .more a { font-size: 18px; text-decoration: underline; color: #361E29; }
.reviews_teaser .more a:hover { text-decoration: none; }
.review_form { margin: 70px auto 0px; max-width: 560px; }
.review_form .tit2 { font-weight: 400; font-size: 30px; line-height: 36px; text-align: center; margin-bottom: 10px; }
.review_form input[type=text], .review_form textarea { display: block; width: 100%; box-sizing: border-box; margin-top: 12px; padding: 14px 18px; border: 1px solid #CBCBCB; border-radius: 12px; background-color: #fff; font-family: inherit; font-size: 16px; color: inherit; }
.review_form textarea { min-height: 140px; resize: vertical; }
.review_form .but { display: block; margin-top: 20px; padding: 14px 30px; border-radius: 44px; background-color: #361E29; color: #fff; text-align: center; cursor: pointer; }
.review_form #rv_result { margin-top: 12px; text-align: center; }
.reviews_page .elemslink { margin-top: 40px; text-align: center; }
.reviews_page .elemslink a { font-size: 18px; text-decoration: underline; color: #361E29; }
.reviews_page .elemslink a:hover { text-decoration: none; }
.hp_field { position: absolute; left: -9999px; top: -9999px; }
.reviews_page .empty { opacity: 0.6; margin-top: 40px; text-align: center; }





div.overWindow { position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px;  background-color: rgba(0,0,0,0.8); z-index: -10000; opacity: 0; }
div.overWindow.showed { z-index: 100; opacity: 1; }
div.overWindow div.in { position: absolute; top: 50%; margin-top: -250px; left: 50%; margin-left: -400px; width: 800px; height: 500px; background-color: rgba(0,0,0,0); } 
div.overWindow div.in h2 { position: absolute; top: -20px;left:0px;right:0px;font-size:22px;color:#fff;margin: 0px;padding:0px;text-align: center; }
div.overWindow div.in iframe { border: 0px; width: 100%; height: 100%; }
div.overWindow div.in video { border: 0px; width: 100%; height: 100%; }
div.overWindow img.xxx { position: absolute; top: 20px; right: 20px; cursor: pointer; width: 25px; }

div.overWindow_event div.in { border-radius: 20px; top: 100px; margin-top: auto; left: 50%; margin-left: -380px; width: 760px; height: auto; bottom: 100px; overflow-y: auto; background-color: #fff; }

div.overWindow div.in div.eventitem { padding: 36px; }
div.overWindow div.in div.eventitem div.img { height: 434px; background-position: 50% 50%; background-size: cover; border-radius: 20px; }
div.overWindow div.in div.eventitem div.date { margin-left: 38px; margin-right: 38px; margin-top: 24px; font-size: 14px; }
div.overWindow div.in div.eventitem div.title { margin-left: 38px; margin-right: 38px; margin-top: 8px; font-size: 18px; font-weight: 700; line-height: 1.5; max-height: 60px; overflow-y: hidden; }
div.overWindow div.in div.eventitem div.anons { margin-top: 12px; font-size: 14px; line-height: 1.55; color: #828282; margin-left: 38px; margin-right: 38px; }
div.overWindow div.in div.eventitem div.anons p { margin: 0px; font-size: 14px; line-height: 1.55; }
div.overWindow div.in div.eventitem video { width: 100%; height: auto; margin-top: 20px; margin-bottom: 20px; }

div.overWindow div.in div.eventitem div.eventgallery { margin-top: 12px; margin-left: 38px; margin-right: 38px; }
div.overWindow div.in div.eventitem div.eventgallery img { margin-right: 15px; width: auto; height: 70px; vertical-align: baseline; }



div.tags { margin-top: 20px; }
div.tag { cursor: pointer; display: inline-block; margin-right: 10px; padding: 12px; padding-left: 15px; padding-right: 15px; margin-top: 2px; margin-bottom: 2px; border: 1px solid #361E29;border-radius: 60px; }
div.tag span { color: #361E29; font-size: 11px; line-height: 11px; }
div.tag:hover { background-color: #361E29; }
div.tag:hover span { color: #fff; }
div.tag_selected { background-color: #361E29; }
div.tag_selected span { color: #fff; }

div.tagclose { display: inline-block; padding: 12px; padding-left: 0px; padding-right: 0px; margin-top: 2px; margin-bottom: 2px; border: 1px solid rgba(0,0,0,0); vertical-align: middle; }
div.tagclose span { display: inline-block; color: #361E29; font-size: 11px; line-height: 13px; vertical-align: middle; cursor: pointer; }
div.tagclose img { display: inline-block; vertical-align: middle; cursor: pointer; }



#onlinepay { cursor: pointer; }
#onlinepay:hover { text-decoration: underline; }



div.sistbigwindow { position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; background-color: rgba(54,30,41,0.7); display: none; z-index: 1000; }
div.sistbigwindow div.insist { position: absolute; left: 50%; top: 50px; bottom: 50px; width: 1054px; margin-left: -527px; border-radius: 20px; background-color: #fff; }
div.sistbigwindow div.insist img.closed { position: absolute; top: 0px; left: 100%; cursor: pointer; }
div.sistbigwindow div.insist div.in { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; padding: 50px 35px 50px 35px; box-sizing: border-box; overflow-y: hidden; }
div.sistbigwindow div.insist div.in div.photos { display: inline-block; width: 35%; vertical-align: top; overflow-y: auto; max-height: 100%; box-sizing: border-box; }
div.sistbigwindow div.insist div.in div.photos img { width: 100%; margin-top: 22px; }
div.sistbigwindow div.insist div.in div.photos img:first-child { margin-top: 0px; }
div.sistbigwindow div.insist div.in div.photos img.withbradius { border-radius: 20px; }
div.sistbigwindow div.insist div.in div.datas { display: inline-block; width: 65%; vertical-align: top; box-sizing: border-box; padding-left: 30px; overflow-y: auto; max-height: 100%; }
div.sistbigwindow div.insist div.in div.datas div.sistintitle { font-size: 26px; font-family: 'Circe-Bold'; font-weight: bold; color: #000; margin-bottom: 25px; }
div.sistbigwindow div.insist div.in div.datas div.sistintext { font-size: 18px; font-family: 'Circe-Regular'; line-height: 1.5; color: #000; }
div.sistbigwindow div.insist div.in div.datas div.sistintext p { margin: 0px; }

div.sistbigwindow div.insist div.arleft { position: absolute; top: 50%; left: -75px; margin-top: -22px; border-radius: 44px; height: 44px; width: 44px; border: 1.5px solid #fff; box-sizing: border-box; cursor: pointer; }
div.sistbigwindow div.insist div.arleft img { position: absolute; left: 50%; top: 50%; margin-left: -5px; margin-top: -5px; width: 10px; height: 10px; }
div.sistbigwindow div.insist div.arright { position: absolute; top: 50%; right: -75px; margin-top: -22px; border-radius: 44px; height: 44px; width: 44px; border: 1.5px solid #fff; box-sizing: border-box; cursor: pointer; }
div.sistbigwindow div.insist div.arright img { position: absolute; left: 50%; top: 50%; margin-left: -5px; margin-top: -5px; transform: rotate(180deg); width: 10px; height: 10px; }
div.sistbigwindow div.insist div.arleft:hover { background-color: rgba(255,255,255,0.2); }
div.sistbigwindow div.insist div.arright:hover { background-color: rgba(255,255,255,0.2); }

/* С5: font-awesome подключался целиком (CSS 31 КБ + шрифт 77-165 КБ)
   ради двух иконок. Обе рисуются встроенным SVG в data-URI: внешних
   запросов ноль, вес — сотни байт. Классы в разметке не менялись. */
.fa-angle-right:before,
.fa-arrow-right:before {
	content: '';
	display: inline-block;
	width: 1em;
	height: 1em;
	vertical-align: -0.125em;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.fa-angle-right:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath fill='currentColor' d='M64 448c-8 0-16-3-22-9-12-12-12-33 0-45l146-146L42 102c-12-12-12-33 0-45s33-12 45 0l169 169c12 12 12 33 0 45L87 439c-6 6-14 9-23 9z'/%3E%3C/svg%3E");
}
.fa-arrow-right:before {
	/* цвет #361e29 задан явно: currentColor внутри data-URI не наследует
	   цвет текста, а на живой разметке стрелка рисовалась именно этим
	   цветом (проверено getComputedStyle до правки) */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23361e29' d='M218 41l22-22c9-9 25-9 34 0l176 175c9 9 9 25 0 34L274 403c-9 9-25 9-34 0l-22-22c-9-9-9-25 0-34l109-104H24c-13 0-24-11-24-24v-32c0-13 11-24 24-24h303L218 75c-10-9-10-25 0-34z'/%3E%3C/svg%3E");
}

/* Задача 6: страница сплошного текста (политика обработки ПДн).
   Своего оформления у таких страниц на сайте не было — весь контент
   до сих пор жил на главной, свёрстанной блоками.
   Фикс-раунд 1: разметка несёт оба класса, class="all_lines textpage",
   а div.all_lines (выше по файлу) уже задаёт max-width:1150px с
   специфичностью (0,1,1) — у голого .textpage (0,1,0) она ниже, и
   1150px побеждал молча, без ошибки браузера. .all_lines.textpage
   даёт (0,2,0) — выше при любом порядке правил в файле, а не за счёт
   более позднего объявления. */
/* Фикс-раунд финального ревью: padding задаётся ТОЛЬКО по вертикали,
   отдельными свойствами. Сокращённая форма (padding: 60px 0 80px) при
   специфичности (0,2,0) обнуляла горизонтальные отступы div.all_lines
   из nnn_mobile.css (45px и 10px, специфичность (0,1,1)), и на 390
   текст упирался в оба края экрана. */
.all_lines.textpage { padding-top: 60px; padding-bottom: 80px; max-width: 860px; }
.textpage h1 { margin-bottom: 32px; }
.textpage h2 { margin-top: 32px; margin-bottom: 12px; font-size: 22px; }
.textpage p { margin-bottom: 14px; font-size: 16px; line-height: 26px; }
.textpage ul { margin-bottom: 14px; }
.textpage li { font-size: 16px; line-height: 26px; margin-bottom: 8px; }
.textpage a { text-decoration: underline; }
.textpage code { font-family: monospace; font-size: 15px; }

/* Задача 7: уведомление об использовании cookie и Метрики. */
/* position: sticky, а не fixed. Фиксированная полоса накрывала нижние
   строки подвала, в том числе ссылку на политику, на которую сама же
   и ссылается: на 390 перекрывались все пять строк блока .elem.copy
   (у «Политики» — 6,8 px по высоте, elementFromPoint отдавал .cookienote),
   на 1440 — четыре из пяти. Sticky ведёт себя так же, пока полоса
   висит над содержимым, но в самом низу страницы встаёт в поток и
   занимает своё место, поэтому подвал больше ничем не накрыт.
   Полосу выводит templates.php последним элементом <body>, ширину
   даёт сам блок, поэтому left/right больше не нужны. */
.cookienote { position: sticky; bottom: 0; z-index: 9000;
    display: flex; align-items: center; gap: 20px;
    padding: 16px 24px; box-sizing: border-box;
    background: #252525; color: #fff; font-size: 14px; line-height: 20px; }
.cookienote .in { flex: 1; }
.cookienote a { color: #fff; text-decoration: underline; }
.cookienote .ok { flex: none; cursor: pointer; border: 0; border-radius: 6px;
    padding: 10px 24px; font-size: 14px; font-family: inherit;
    background: #fff; color: #252525; }
@media (max-width: 760px) {
    .cookienote { flex-direction: column; align-items: stretch; gap: 12px; padding: 14px 16px; }
    .cookienote .ok { width: 100%; }
}

/* Этап 7: появление при прокрутке. Только transform/opacity (spec:
   "Правило: анимируются только transform и opacity"), IntersectionObserver
   в site_public.js добавляет .reveal_in при пересечении вьюпорта. */
.reveal_on_scroll.reveal { opacity: 0; transform: translateY(24px); }
.reveal_on_scroll.reveal_in { opacity: 1; transform: translateY(0); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }

/* А2: карточки events/sistmilost, добавленные докруткой "Показать ещё" —
   раньше .animate({height:'+=514px'}), теперь transform: scaleY() с
   transform-origin: top, визуально тот же "разворот сверху вниз", но
   не трогает layout на каждом кадре. */
.el.new { transform: scaleY(0); transform-origin: top; opacity: 0; }
.el.new.reveal_in { transform: scaleY(1); opacity: 1; transition: transform 0.3s ease-out, opacity 0.3s ease-out; }

/* А3: микровзаимодействия — подъём и тень на hover, вдавливание на active,
   видимое кольцо на :focus-visible (клавиатурная навигация; :focus-visible
   в файле нигде раньше не встречался — чистое добавление, конфликтов нет). */
.but, .menuitem, .tag, a.showreab, .review_form .but {
	transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}
.but:hover, .tag:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 14px rgba(0,0,0,0.12);
}
.but:active, .tag:active {
	transform: translateY(0) scale(0.97);
	box-shadow: none;
}
a:focus-visible, button:focus-visible, .but:focus-visible, .menuitem:focus-visible,
input:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
	outline: 2px solid #e8b64a;
	outline-offset: 2px;
}

/* Плавная прокрутка к анкорям меню (movetoBlock() в site_public.js уже
   использует window.scrollTo({behavior:'smooth'}) напрямую и не зависит
   от этого правила — оно нужно для обычных переходов браузера по #hash,
   которые не идут через JS, например Ctrl+клик/открытие в новой вкладке
   с якорем в адресной строке). */
html { scroll-behavior: smooth; }