:root{
--body-bg:#FAFAF8;
--header-bg:#F7F5F0;
--content-bg:#FFFFFF;
--footer-bg:#F2EFE8;
--text:#2D302F;
--muted:#6D706B;
--border:#D8D2C6;
--title:#7A7266;
--menu:#7A7266;
--hover:#3f3527;
--accent:#648bab;
}

/* Базовый каркас сайта поверх технических стилей SVG-карт. */
*{box-sizing:border-box;margin:0;padding:0;}
html{overflow-y:scroll;}
html,body{min-height:100%;}
body{background:var(--body-bg);font-family:Arial,Helvetica,sans-serif;color:var(--text);}

.page{width:clamp(1000px,calc(100vw - 60px),1150px);min-height:100vh;margin:0 auto;display:flex;flex-direction:column;background:var(--content-bg);box-shadow:0 0 0 1px rgba(0,0,0,.05),0 4px 18px rgba(0,0,0,.07);}
.main{position:relative;flex:1;display:flex;background:#fff;}

.main--with-sidebar{flex-wrap:nowrap;align-content:stretch;align-items:stretch;}
.panel{align-self:auto;flex:0 0 21%;min-width:0;min-height:0;padding:20px 2px 20px 8px;border-right:1px solid var(--border);background:#fdfcfb;display:flex;flex-direction:column;}
.content{position:relative;flex:1;padding:20px 10px 5px 10px;}
.content-map{position:relative;flex:0 0 100%;min-width:0;margin:0;padding:20px 10px 5px 10px;}

/* Шапка сайта. */
header{position:relative;width:100%;height:200px;padding:0 10px;display:flex;align-items:center;border-bottom:1px solid var(--border);background:var(--header-bg);gap:30px;}
.logo{flex-shrink:0;display:flex;position:relative;top:-10px;content:url('images/logo.png');}
.header-main{flex:1;height:195px;display:flex;flex-direction:column;justify-content:space-between;padding-left:100px;}
.title{color:var(--title);}
.name1{font-size:clamp(30px, calc(5.333vw - 7.6px), 50px);padding:15px 0;text-shadow:.5px .5px 0 #291f03;letter-spacing:2px;}
.name2{font-size:clamp(20px, calc(5.333vw - 7.6px), 45px);letter-spacing:1px;}
.header-home{position:absolute;left:0;bottom:0;z-index:5;display:block;width:32px;height:32px;background:url('images/home.svg') 0 0 no-repeat;}

/* Верхнее меню, выпадающие списки и выбор области. */
.top-menu{position:relative;left:0;right:0;bottom:auto;width:auto;height:auto;margin:0;padding:0;display:flex;justify-content:flex-end;align-items:center;gap:20px;z-index:20;}

.top-menu a,.menu-button{display:block;padding:0 0 5px;border:0;background:transparent;color:var(--menu) !important;font:inherit;font-size:18px;line-height:1.35;text-align:left;text-decoration:none;cursor:pointer;white-space:nowrap;}
.top-menu a:hover,.top-menu a:focus,.menu-button:hover,.menu-button:focus{color:var(--hover);outline:none;}
.menu-item{position:relative;}
.submenu{position:absolute;//right:0;top:100%;z-index:30;display:none;min-width:220px;padding:5px;border:1px solid var(--border);border-left:4px solid var(--border);border-bottom:4px solid var(--border);background:#fff;box-shadow:2px 2px 5px rgba(0,0,0,.12);}
.menu-item:hover>.submenu,.menu-item:focus-within>.submenu,.menu-item.is-open>.submenu{display:block;}
.submenu a{display:block;padding:4px 7px;font-size:16px;line-height:1.25;white-space:normal;}
.portal-submenu{width:340px;}
.region-menu{position:relative;float:right;margin:-40px 0 0 10px;z-index:5;}
.region-menu>.menu-button{padding:3px 8px;font-size:16px;}
.region-submenu{right:0;left:auto;width:448px;grid-template-columns:1fr 1fr;gap:0;text-align:left;}
.region-menu:hover>.region-submenu,.region-menu:focus-within>.region-submenu,.region-menu.is-open>.region-submenu{display:grid;}
.region-submenu__column{min-width:0;}
.region-submenu p{margin:0;text-align:left;}
.region-submenu a{padding:2px 6px 4px;font-size:15px;white-space:normal;color:var(--menu) !important;}

/* Единый вид тематических меню, перенесенных в шапку. */
.context-submenu{right:auto;left:0;width:320px;max-height:70vh;overflow:auto;}
.context-submenu.mob-panel{margin:0;padding:7px;background:#fff;}
.context-submenu .vmenublock,.context-submenu .vcontent{min-height:0;margin:0;padding:0;}
.context-submenu .vmenu{position:static;width:100%;margin:0;padding:0;float:none;border:0;list-style:none;}
.context-submenu li{display:block;padding:0;}
.context-submenu a{display:block;padding:1px 7px 3px 7px;color:var(--menu);font-size:16px;line-height:1.25;text-shadow:none;white-space:normal;}
.context-submenu a:hover{color:var(--hover);}
.context-submenu .vmenu ul{margin:0;padding:0 0 0 10px;list-style:none;}
.context-submenu .vmenu ul a{font-size:14px;}

/* Тематические меню имеют разный состав, но один внешний вид. */
.main>.mob-panel{display:none;width:auto;margin:12px 0 10px 10px;padding:0;border:0;background:transparent;}
.main>.mob-panel+.mob-button,.main>.mob-panel+.mob-button-map{margin-left:8px;}

/* Мобильные кнопки скрыты до включения адаптивного режима. */
.mob-button,.mob-button-map{display:none;}

/* Левая панель есть только на индексе и главных страницах разделов. */
.panel>.mob-panel{display:block;flex:0 0 auto;min-height:455px;margin:0;padding:0;border:0;background:transparent;}
.panel .vmenublock,.panel .vcontent{display:contents;}
.panel .vmenu{position:static;width:100%;margin:0;padding:0;float:none;border:0;list-style:none;}
.panel .vmenu li{padding:0 0 5px;}
.panel .vmenu a{display:block;padding:0;color:var(--menu);font-size:16px;line-height:1.25;text-shadow:none;text-align:left;}
.panel .vmenu ul{margin:0;padding:0 0 0 10px;list-style:none;}
.panel .vmenu ul li{padding:0 0 5px;}
.panel .vmenu ul a{font-size:14px;}
.panel .vmenu a:hover,.panel .vmenu a.active{color:var(--hover);}
.panel>.block{flex:1 1 auto;min-height:0;margin-top:0;padding-top:15px;border-top:1px solid var(--border);background:none;display:flex;flex-direction:column;}
.panel>.block>.author{margin-top:auto;padding:20px 0;color:var(--menu);}
.author a,.block a{color:var(--menu) !important;font-size:14px;}
.blockheader{margin:0 0 10px;padding-left:30px;color:var(--title);font-size:16px;background:url('images/a-5.svg') 0 0 no-repeat;}

/* Типографика, таблицы, формы и материалы обычных страниц. */
h1,h2,h3,h4,h5,h6,p,a,ul,ol,li,th,td,label{color:var(--text);font-weight:normal;text-align:justify;font-style:normal;text-indent:0;line-height:1.35;}
a,a:link,a:visited{color:#336995;text-decoration:none;}
a:hover{color:var(--hover);}
h1{margin:0 0 15px 0;color:#565048;font-size:20px;text-align:left;text-shadow:1px 1px 0 #efebde;}
h2{margin:0 0 10px;font-size:18px;text-align:left;}
p{font-size:14px;margin:0 0 5px 0;line-height:135%;}
.content ul{margin:0 0 10px 24px;list-style:disc;}
.content li{padding:2px 0;font-size:14px;}
.content li::before{content:none;}

table{border-collapse:collapse;width:100%;margin:0 0 15px 0;}
th,td{border:none;vertical-align:top;text-align:left;}
th{font-size:14px;padding:5px 5px 2px 0;}
td{font-size:13px;padding:2px 5px 2px 0;}
th>img{padding:2px 5px 0 0;}

label{display:block;font-size:16px;padding-left:20px;margin:10px 0px 0 0;cursor:pointer;line-height:115%;text-align:left;color:#106475;}
input{width:50%;border-radius:3px;border:1px solid #5A905A;margin:10px 10px 0 0;padding:5px;font-size:14px;}
input[type="checkbox"],input[type="radio"]{display:none;}
input[type="radio"] + label{background: url('images/14radio-0001.png') 0 1px no-repeat;}
input[type="radio"]:checked + label{background: url('images/14radio-ch-0001.png') 0 1px no-repeat;}
input[type="checkbox"] + label{background:url('images/14check-1.png') 0 0px no-repeat;}
input[type="checkbox"]:checked + label{background:url('images/14check-ch-1.png') 0 0px no-repeat;color:#106475;}
.button{width:auto;background:linear-gradient(#ecf6e8,#c2e1b4,#ecf6e8);padding:5px 20px;font-size:16px;color:#336995;cursor:pointer;}
.button:hover{color:#001000;}

.topic{margin:5px 25px 25px 0;float:left;}
.mini{margin:0 0 20px 0;width:31%;}
.map-ind{display:flex;flex-wrap: wrap;gap:5px;margin:5px 0 0 0;}
.minimap{flex-basis:15%;padding:0 5px;border:solid 1px var(--border);}
.minimap a{font-size:14px;color:#336995;}
.minimap img{padding:5px 0 0 0;}

.topic-txt{display:flex;flex-wrap:wrap;gap:0 25px;align-items:flex-start;}
.col{flex:1;}
.full-row{width:100%;}

/* Общие стили встроенных SVG-карт. */
.ua{fill:none;stroke:#555;stroke-width:15;stroke-linecap:round;stroke-linejoin:round;}
.obl{fill:none;stroke:#555;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;}
.city{fill:#828282;fill-opacity:0.2;stroke:#555;stroke-width:3;}
.sea{fill:#3abffb;stroke:none;}
.water{fill:#3abffb;stroke:#3abffb;stroke-width:1.5;}
.water1{fill:#3abffb;stroke:#5fcdff;stroke-width:1;}
.riv{fill:none;stroke:#3abffb;stroke-width:10;}

/* SVG-карта выбора областей. */
.obl-m{fill:#4682B4;fill-opacity:0.0;stroke:#4682B4;stroke-width:5;cursor:pointer;}
.obl-m:hover{fill:#4682B4;fill-opacity:0.3;}

/* Главная страница. */
.ind-txt h2{margin:10px 0 3px 0;font-size:16px;}
.ind-txt p,.fs16{font-size:16px !important;}
.ind-txt a{font-size:16px;color:#336995;}
.ind-txt a:hover{color:#001000;}
.ind-txt ul{margin:0 0 5px 25px;list-style:none;}
.ind-txt li{padding:2px 0;font-size:16px;}
.ind-txt li:before{position:relative;bottom:2px;content:url('images/8.png');margin:0 0 0 -15px;padding:0 8px 0 0;}
.ris-1{float:left;margin:5px 25px 10px 0;}

/* Блок заказа карт. */
.zakaz{position:relative;top:15px;left:0px;cursor:pointer;color:var(--menu);}
.zak-txt{position:absolute;width:400px;bottom:18px;left:90px;padding:10px;border:1px solid #b3c9ce;border-radius:4px;background:#fff;box-shadow:3px 3px 3px rgba(0, 0, 0, .3);transition:opacity 0.3s;z-index:20;cursor:auto;display:none;}
.zakaz:hover .zak-txt{display:block;}

/* Модальное окно источников информации. */
.modal{display:block;position:fixed;visibility:hidden;width:min(800px,calc(100vw - 40px));max-height:calc(100vh - 40px);margin:0 auto;padding:0 0 10px 0;top:20px;right:0;left:0;border:1px solid var(--border);background:#fff;box-shadow:0 0 2px 2px rgba(65, 50, 8, .3);opacity:0;z-index:500;}
.modal-fon:target+.modal{top:20px;visibility:visible;opacity:1;}
.modal-fon{position:fixed;visibility:hidden;top:0;right:0;bottom:0;left:0;background-color:rgba(250, 250, 250, 0.5);opacity:0;z-index:10;}
.modal-fon:target{visibility:visible;opacity:1;}
.modal-hed{padding:5px 15px;font-size:18px;color:var(--menu);background:#f7f5f0;border-bottom:1px solid var(--border);}
.modal-close{position:absolute;width:20px;height:20px;top:5px;right:5px;background:#E5E5E5 url('images/1-cl.png') no-repeat;}
.modal-close:hover{background:#D1D1D1 url('images/1-cl.png') no-repeat;}
.modal-content{max-height:calc(90vh - 95px);padding:20px;margin:10px 0 0 0;overflow-y:auto;}
.modal-content ul{margin:0 0 14px 22px;list-style:disc;}
.modal-content li{padding:3px 0 5px 0;font-size:14px;line-height:1.35;}
.modal-content li::before{content:none;}
.modal-content p{font-size:16px;}
.modal-content a{color:#336995;}

/* Всплывающие информационные блоки на картах. */
.info{position:relative;float:right;width:25px;margin:-40px 20px 0 0;padding:0 0 0 15px;cursor:pointer;z-index:15;}
.infotext{position:absolute;top:0;right:15px;display:none;width:min(800px,calc(100vw - 80px));max-height:min(80vh,800px);overflow:auto;padding:10px;border:1px solid var(--border);border-radius:4px;background:#fff;box-shadow:2px 2px 8px rgba(0,0,0,.18);cursor:auto;}
.info:hover .infotext,.info:focus-within .infotext{display:block;}
.infotext1{width:min(550px,calc(100vw - 80px));}
.infotext2{width:min(700px,calc(100vw - 80px));}
.infotext3{width:min(450px,calc(100vw - 80px));}
.infotext4{width:min(1000px,calc(100vw - 80px));}
.infotext5{width:min(750px,calc(100vw - 80px));}
.infotext.w950{width:min(950px,calc(100vw - 80px));}
.info th,.info td{border:1px solid var(--border);padding:2px 5px;vertical-align:middle;}
.infotext ul{margin:0 0 0 25px;list-style:none;}
.infotext li{padding:3px 0;font-size:14px;}
.infotext li:before{position:relative;bottom:2px;content:url('images/8.png');margin:0 0 0 -15px;padding:0 8px 0 0;}
.infotext2 td{border:none;}

/* Служебные классы ширины, отступов и выравнивания. */
hr{border:none;margin:35px 0 10px 0;background:#5A905A;height:1px;width:550px;}

.w5{width:5%;}
.w8{width:8%;}
.w10{width:10%;}
.w15{width:15%;}
.w20{width:20%;}
.w25{width:25%;}
.w30{width:30%;}
.w35{width:35%;}
.w40{width:40%;}
.w55{width:55%;}
.w950{width:950px;}
.mt5{margin-top:5px;}
.mt15{margin-top:15px;}
.mb5{margin-bottom:5px;}
.ml10{margin-left:10px;}
.mr15{margin-right:15px;}
.bb{border-bottom:solid 1px black;}
.bt{border-top:solid 1px black;line-height:135%;}
.fl{float:left;}
.fr{float:right;}
.tar{text-align:right;}
.tac{text-align:center;}
.vac{vertical-align:middle;}
.fs14{font-size:14px;}
.f1{top:-2px;border-bottom:solid 1px black;}
.f5{top:15px;}
.ok-mob,.no{display:none;}

/* Подвал сайта. */
.footer{width:100%;height:20px;margin-top:auto;padding:4px 5px;display:flex;align-items:center;border-top:1px solid var(--border);background:var(--footer-bg);}
.footer p{flex:1;margin:0;color:var(--muted);font-size:10px;}
.footer p:last-child{text-align:right;}

/* Планшетная адаптация: каркас занимает всю ширину окна. */
@media (max-width:1024px){
.page{width:100%;box-shadow:none;}
header{padding:10px 20px;}
.header-main{height:190px;padding-left:0;flex-direction: row;}
.top-menu a,
.menu-button{font-size:16px;}
.top-menu{gap:15px;}
.top-menu{position:static;right:auto;bottom:auto;width:auto;height:auto;margin:20px 0 0 0;padding:0;display:flex;flex-direction: column-reverse;align-items:flex-end;gap:5px;}
.submenu{right:0;}
.context-submenu{right:0;left:-180px;}
.content{padding:25px 15px;}
}

/* Мобильная адаптация: шапка, меню, панели и карта переходят в одну колонку. */
@media (max-width:760px){
/* Общие мобильные переключатели. */
.no-mob,.layer3,.custom-controls{display:none !important;}
.ok-mob{display:block;}
body{background:#fff;}
.page{width:100%;min-width:0;}

/* Шапка и верхнее меню становятся компактной сеткой в две колонки. */
.site-header{height:auto;padding:14px 18px;display:block;}
.header-main{height:auto;padding:0;align-items:flex-start;flex-direction: column;}
.title{width:100%;padding-bottom:10px;border-bottom:1px solid var(--border);}
.name1{font-size:7.0vw;padding:0 0 5px 0;}
.name2{font-size:6.5vw;}
.top-menu{position:relative;width:100%;margin-top:10px;display:grid !important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"sections portal" "project author" "topic topic";column-gap:16px;row-gap:4px;align-items:start;}
.top-menu a,.menu-button{padding:4px 0;font-size:16px;}
.submenu{position:absolute;top:100%;right:auto;left:0;width:min(340px,calc(100vw - 36px));}
.menu-item:not(.is-open):hover>.submenu,.menu-item:not(.is-open):focus-within>.submenu{display:none;}
.top-menu__author{grid-area:author;}
.top-menu__project{grid-area:project;}
.portal-menu{grid-area:portal;justify-self:start;}
.context-menu--sections{grid-area:sections;justify-self:start;}
.context-menu--topic{grid-area:topic;justify-self:start;}
/* Кнопка тематического меню на мобильных стоит в шапке отдельной строкой. */
.top-menu>.mob-button-map--header{grid-area:topic;display:block;width:100%;height:auto;margin:5px 0 0;padding:5px 10px;border:1px solid var(--border);border-radius:4px;background:#fff;color:var(--menu);font-size:16px;line-height:1.25;text-align:center;cursor:pointer;}
.portal-menu,.context-menu--sections{position:static;}
.portal-menu>.submenu,.context-menu--sections>.submenu{left:0;right:auto;width:100%;}
.region-menu{float:none;margin:0 0 10px 0;}
.region-menu>.region-submenu{right:auto;left:0;width:min(448px,calc(100vw - 36px));}
.region-submenu a{font-size:14px;}
.header-home{top:0;right:0;left:auto;}

/* Основной каркас и левая панель раскрываются только по кнопке меню. */
.main,.main--with-sidebar{display:block;min-height:0;}
.panel{width:100%;min-height:0;padding:5px 10px;border-right:0;border-bottom:1px solid var(--border);}
.content{width:100%;padding:22px 16px 32px;}
.panel>.block,.panel>.author{display:none;}
.panel .mob-button,.panel .mob-button-map{position:static;display:inline-block;width:auto;height:auto;padding:0;}
.panel .mob-button img{display:block;width:28px;height:28px;}
.panel .mob-button-map,.main>.mob-button-map{padding:5px 10px;border:1px solid var(--border);border-radius:4px;background:#fff;color:var(--menu);font-size:16px;cursor:pointer;text-align:center;}
.main>.mob-button-map{position:static;display:inline-block;width:auto;height:auto;margin:8px 0 8px 10px;}
.panel .mob-panel,.main>.mob-panel{display:none;width:100%;margin:0 0 10px;padding:10px;border:1px solid var(--border);background:#fff;}
.main>.mob-panel{width:calc(100% - 20px);margin:0 10px 10px;}
.panel .mob-panel.is-open,.main>.mob-panel.is-open{display:block;min-height:0;}

.content-map{padding:0 5px 10px;}
.portal-menu>.menu-button,.context-menu--sections>.menu-button{padding:4px 0;border:0;border-radius:0;background:transparent;}
.context-menu--topic>.menu-button{padding:5px 9px;border:1px solid var(--border);border-radius:5px;background:#fff;}
.context-submenu{position:absolute;width:min(320px,calc(100vw - 36px));}
.main>.mob-panel .vmenu>li>p{display:none;}
.main>.mob-panel .vmenublock,.main>.mob-panel .vcontent{display:contents;}
.main>.mob-panel .vmenu{position:static;width:100%;margin:0;padding:0;float:none;border:0;list-style:none;}
.main>.mob-panel .vmenu li{padding:0 0 5px;}
.main>.mob-panel .vmenu a{display:block;padding:0;color:var(--menu);font-size:16px;line-height:1.25;text-shadow:none;}
.main>.mob-panel .vmenu ul{margin:0;padding:0 0 0 10px;list-style:none;}
.main>.mob-panel .vmenu ul li{padding:0 0 5px;}
.main>.mob-panel .vmenu ul a{font-size:14px;}
.main>.mob-panel .vmenu a:hover,.main>.mob-panel .vmenu a.active{color:var(--hover);}

/* Главная страница и разделы: картинки и мини-карты не вылезают за экран. */
.topic{float:none;display:block;max-width:100%;height:auto;margin:5px 0 15px;}
.map-ind{flex-wrap:wrap;gap:8px;}
.minimap{flex:1 1 calc(50% - 8px);min-width:130px;}
.minimap img{max-width:100%;height:auto;}
.mini{width:100%;}
}

/* Узкие экраны: уплотняем шапку и сохраняем меню в две колонки. */
@media (max-width:430px){
.site-header{padding:10px;}
.top-menu{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"author project" "portal sections" "topic topic";column-gap:16px;row-gap:4px;}
.top-menu__project{grid-area:project;}
.top-menu__author{grid-area:author;}
.portal-menu{grid-area:portal;align-self:start;justify-self:start;}
.context-menu--topic{grid-area:topic;justify-self:start;}
.context-menu--sections{grid-area:sections;justify-self:start;}
.portal-menu>.menu-button,.context-menu--sections>.menu-button{padding:4px 0;border:0;border-radius:0;background:transparent;}
.portal-submenu{left:0;right:auto;width:100%;}
.content{padding:20px 12px 28px;}
}