body {background-color: #ffffff; font-family: 'Fira Sans Extra Condensed', Arial, sans-serif; font-size: 17px; position: relative; z-index: 0; margin: 0px;}

#top {width: 100%; min-height: 70px; overflow: hidden; background-color: #000000;}
#topleft {float: left;}
#topright {float: right;}
#topcenter {width: 1000px; margin-left: auto; margin-right: auto;}

#main {width: 100%; min-height: 600px; overflow: hidden; background-color: #ffffff; padding-bottom: 20px;}
#mainleft {float: left;}
#mainright {float: right;}
#maincenter {width: 1000px; margin-left: auto; margin-right: auto;}

#footer {width: 100%; height: 70px; overflow: hidden; background-color: #000000;}
#footerleft {float: left;}
#footerright {float: right;}
#footercenter {width: 1000px; margin-left: auto; margin-right: auto;}

#footercenter .f1 {width: 600px; padding-left: 20px; height: 70px; float: left; line-height: 70px; color: #ffffff;}
#footercenter .f2 {width: 30px; padding: 20px 10px; height: 30px; float: left;}
#footercenter .f2 img {width: 30px; height: 30px;}
#footercenter .f3 {width: 300px; height: 70px; float: right; line-height: 70px; color: #ffffff; text-align: right;}

#navstr {width: 100%; height: 40px; overflow: hidden; background-color: #ececec;}
#navstrleft {float: left;}
#navstrright {float: right;}
#navstrcenter {width: 1000px; margin-left: auto; margin-right: auto; line-height: 40px;}
#navstrcenter a {color: #337eb7; text-decoration: underline;}
#navstrcenter a:hover {text-decoration: none;}
#navstrcenter span {font-weight: bold; color: #000000;}

.t {width: 600px; overflow: hidden; float: left;}
.t .tlogo {float: left; width: 46px; height: 46px; padding: 12px 2px;}
.t .tlogo img {width: 46px; height: 46px;}
.t .tleft {float: left; padding-left: 10px; height: 70px; line-height: 70px; font-size: 29px; color: #ffffff;}
.tright {float: right; width: 400px; height: 70px; line-height: 70px;}
.tright .menu {overflow: hidden;}
.tright .menu .menuitem {float: left; width: 33%; text-align: center;}
.tright .menu .menuitem a {font-size: 17px; color: #ffffff; text-decoration: underline;}
.tright .menu .menuitem a:hover, .tright .menu .menuitem a.v {color: #337eb7;}
.tright .menu .menuitem a.v:hover {text-decoration: none;}

h1 {color: #000000; font-size: 30px; margin: 10px 0px;}
h2 {color: #337eb7; font-size: 24px;}
h3 {color: #337eb7; font-size: 19px; margin-bottom: 6px;}
a {color: #337eb7;}

.maincnt {padding: 5px; text-align: justify; color: #3c3c3c; line-height: 1.5;}
.maincnt img {max-width: 100%; height: auto; border-radius: 5px;}
.maincnt figure {margin: 15px 0px; text-align: center;}
.maincnt figcaption {font-size: 15px; color: #777777;}

.sform {padding: 5px 10px 10px 10px; background-color: #337eb7; border-radius: 5px; margin-top: 15px;}
.sform .ftext {padding: 10px 0px 5px 0px; color: #ffffff;}
.sform .fs select {width: 100%; height: 40px; background-color: #f8f8f8; border: 0px; font-family: inherit; font-size: 17px; color: #337eb7; border-radius: 5px;}
.sform .fb {padding-top: 10px;}
.sform .fb input[type="submit"] {width: 100%; height: 40px; background-color: #000000; border: 0px; font-family: inherit; font-size: 17px; color: #ffffff; border-radius: 5px; cursor: pointer;}
.sform .fb input[type="submit"]:hover {background-color: #1c1c1c;}

.mainlinks {padding: 5px;}
.mainlinks .lline {overflow: hidden;}
.mainlinks .ltype {margin: 8px 2px 2px; font-weight: bold; color: #555555;}
.mainlinks .lline .litem {width: 188px; height: 42px; padding: 2px; margin: 2px; float: left; text-align: center; background-color: #f8f8f8; border-radius: 5px; line-height: 42px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.mainlinks .lline .litem a {text-decoration: underline;}
.mainlinks .lline .litem a:hover {text-decoration: none;}

.featured {display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 5px 0px;}
.featured h2 {grid-column: 1 / -1; margin-bottom: 5px;}
.featured .fitem {min-height: 260px; padding: 10px; box-sizing: border-box; background-color: #f8f8f8; border-radius: 5px; text-align: center;}
.featured .femblem img {height: 120px; width: auto;}
.featured .fname {font-size: 20px; margin: 8px 0px;}
.featured .fdesc {font-size: 15px; color: #5e5e5e;}

.region {overflow: hidden; padding: 5px; margin-top: 10px;}
.region .remblem {float: left; width: 200px; text-align: center;}
.region .remblem img {width: 180px; height: auto;}
.region .rhead {margin-left: 220px;}
.region .facts {border-collapse: collapse; width: 100%;}
.region .facts td {padding: 6px 10px; border-bottom: 1px solid #ececec;}
.region .facts td:first-child {color: #777777; width: 40%;}

.gallery {overflow: hidden; padding: 5px;}
.gallery .gitem {width: 310px; float: left; margin: 5px; text-align: center;}
.gallery .gitem img {width: 310px; height: 210px; object-fit: cover; border-radius: 5px;}
.gallery .gitem figcaption {font-size: 15px; color: #777777;}

.settlements {padding: 5px;}
.settlements .slist {list-style: none; padding: 0px; margin: 0px; columns: 2;}
.settlements .slist li {padding: 6px 0px; break-inside: avoid;}
.settlements .slist li:target {background-color: #fff6cc; border-radius: 5px;}
.settlements .sname {font-weight: bold;}
.settlements .scapital {font-size: 14px; color: #ffffff; background-color: #337eb7; border-radius: 3px; padding: 1px 6px;}
.settlements .sdetails {color: #777777;}
.settlements .sdesc {font-size: 15px; color: #5e5e5e;}

.settlements .sdistrict {margin: 4px 0px; background-color: #f8f8f8; border-radius: 5px;}
.settlements .sdistrict summary {padding: 8px 12px; cursor: pointer; color: #337eb7;}
.settlements .sdistrict[open] summary {border-bottom: 1px solid #ececec;}
.settlements .sdistrict .slist {padding: 5px 12px;}
.settlements .scount {color: #777777;}

.mainlinks .lline {display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; margin: 2px 0px;}
.mainlinks .lline .litem {float: none; display: block; box-sizing: border-box; width: auto; height: auto; min-height: 46px; margin: 0px; padding: 12px 6px; line-height: 20px; white-space: normal;}

.smap {padding: 5px;}
.smap iframe {border-radius: 5px; display: block;}
.smap .smaplink {text-align: right; padding-top: 5px; font-size: 15px;}
.source {padding: 0px 5px; font-size: 14px; color: #777777;}
.settlements .sname {text-decoration: none;}
.settlements .sname:hover {text-decoration: underline;}

@media (max-width: 1000px){
#top {height: auto;}
#topcenter, #navstrcenter, #maincenter, #footercenter {width: 100%; box-sizing: border-box; padding-left: 5px; padding-right: 5px;}
.t {float: none; width: 100%; text-align: center;}
.t .tlogo, .t .tleft {float: none; display: inline-block; vertical-align: middle;}
.t .tleft {font-size: 22px; height: auto; line-height: normal;}
.tright {float: none; width: 100%;}
#navstr {height: auto;}
.mainlinks .lline {grid-template-columns: repeat(2, 1fr);}
.featured {grid-template-columns: repeat(2, 1fr);}
.gallery .gitem {width: 100%; float: none; margin: 5px 0px;}
.gallery .gitem img {width: 100%;}
.region .remblem {float: none; width: 100%;}
.region .rhead {margin-left: 0px;}
.settlements .slist {columns: 1;}
#footer {height: auto;}
#footercenter .f1, #footercenter .f3 {float: none; width: auto; height: auto; line-height: 30px; padding-left: 5px; text-align: left;}
}
@media (max-width: 600px){
.featured {grid-template-columns: 1fr;}
.featured .fitem {min-height: 0px;}
.mainlinks .lline {grid-template-columns: 1fr;}
}

/* Разделы описания региона */
.rsections .rtoc {list-style: none; padding: 10px 12px; margin: 10px 0px; background-color: #f8f8f8; border-radius: 5px; columns: 2; font-size: 16px;}
.rsections .rtoc li {padding: 3px 0px;}
.rsections .rsection h2 {margin: 25px 0px 10px 0px;}
.rsections .rsection h3 {margin: 15px 0px 5px 0px;}
.rsections table.climate {border-collapse: collapse; width: 100%; margin: 10px 0px; font-size: 15px;}
.rsections table.climate th, .rsections table.climate td {padding: 5px 4px; border-bottom: 1px solid #ececec; text-align: center;}
.rsections table.climate th {color: #777777; font-weight: normal;}
.rsections table.climate td:first-child, .rsections table.climate th:first-child {text-align: left;}
.rsections .tablewrap {overflow-x: auto;}
.rsections ul.facts {padding-left: 20px;}
@media (max-width: 1000px){
.rsections .rtoc {columns: 1;}
}

/* Погода */
.weather {--w-bg: #f4f8fb; --w-line: #e3e9ee; --w-text: #2c2c2c; --w-muted: #777777; --w-accent: #337eb7; --w-btn-text: #ffffff; --w-warm: #e07a1f; --w-cold: #337eb7;}
.weather {padding: 5px; margin-top: 10px;}
.weather h2 {margin: 15px 0px 10px 0px;}
.weather .wplace {margin: 0px 0px 10px 0px; color: var(--w-muted);}
.weather .wcur {display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; padding: 15px; background-color: var(--w-bg); border-radius: 6px;}
.weather .wcur .wpic {width: 110px; height: 110px; flex: none;}
.weather .wimg {width: 100%; height: 100%; display: block;}
.weather .wmain {flex: none; min-width: 150px;}
.weather .wt {font-size: 52px; line-height: 1; font-weight: bold; color: var(--w-text);}
.weather .wd {font-size: 19px; margin-top: 6px; color: var(--w-text);}
.weather .wminmax {font-size: 15px; color: var(--w-muted); margin-top: 4px;}
.weather .wparams {flex: 1 1 300px; border-collapse: collapse; font-size: 16px;}
.weather .wparams td {padding: 4px 8px; border-bottom: 1px solid var(--w-line); color: var(--w-text);}
.weather .wparams td:first-child {color: var(--w-muted); white-space: nowrap; width: 40%;}
.weather .warrow {display: inline-block; font-weight: bold; color: var(--w-accent);}
.weather .wtime, .weather .wsrc {font-size: 14px; color: var(--w-muted); margin-top: 6px;}
.weather .wsrc a {color: var(--w-muted);}
.weather .wstatus {padding: 20px 5px; color: var(--w-muted);}
.weather .wmore {margin: 12px 0px 0px 0px;}
.weather .wmore a {display: inline-block; padding: 9px 16px; border-radius: 5px; background-color: var(--w-accent); color: var(--w-btn-text); text-decoration: none;}
.weather .wmore a:hover {opacity: 0.85;}
.weather .wback {margin-top: 15px;}
.weather .wchart {padding: 10px; background-color: var(--w-bg); border-radius: 6px; margin-bottom: 10px;}
.weather .wchart svg {width: 100%; height: auto; display: block;}
.weather .wchart .wmaxpl, .weather .wchart .wminpl {fill: none; stroke-width: 3;}
.weather .wchart .wmaxpl {stroke: var(--w-warm);}
.weather .wchart .wminpl {stroke: var(--w-cold);}
.weather .wchart .wmaxp {fill: var(--w-warm);}
.weather .wchart .wminp {fill: var(--w-cold);}
.weather .wchart .wlbl {font-size: 15px; text-anchor: middle; fill: var(--w-text);}
.weather .wchart .wzero {stroke: var(--w-line); stroke-width: 1; stroke-dasharray: 4 4;}
.weather .wlegend {font-size: 14px; color: var(--w-muted); text-align: right;}
.weather .wlegend span {margin-left: 15px;}
.weather .wlegend span:before {content: ''; display: inline-block; width: 14px; height: 3px; margin-right: 5px; vertical-align: middle;}
.weather .wlegend .lmax:before {background-color: var(--w-warm);}
.weather .wlegend .lmin:before {background-color: var(--w-cold);}
.weather .wdays {display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px;}
.weather .wday {padding: 10px 8px; background-color: var(--w-bg); border-radius: 6px; text-align: center; color: var(--w-text);}
.weather .wday .wdname {font-weight: bold; font-size: 17px;}
.weather .wweekend .wdname {color: var(--w-warm);}
.weather .wday .wddate {font-size: 14px; color: var(--w-muted);}
.weather .wday .wpic {width: 64px; height: 64px; margin: 6px auto;}
.weather .wday .wdtemp {font-size: 20px;}
.weather .wday .wtmax {font-weight: bold;}
.weather .wday .wtmin {color: var(--w-muted);}
.weather .wday .wddesc {font-size: 15px; min-height: 2.6em; margin: 3px 0px;}
.weather .wday .wdparams {list-style: none; padding: 6px 0px 0px 0px; margin: 0px; border-top: 1px solid var(--w-line); font-size: 13px; color: var(--w-muted); text-align: left;}
.weather .wday .wdparams li {padding: 2px 0px;}
@media (max-width: 1000px){
.weather .wcur .wpic {width: 90px; height: 90px;}
.weather .wt {font-size: 44px;}
.weather .wdays {grid-template-columns: 1fr;}
.weather .wday {display: grid; grid-template-columns: 1fr 56px 1fr; grid-template-areas: "name pic temp" "date pic desc" "params params params"; align-items: center; text-align: left; gap: 0px 10px;}
.weather .wday .wdname {grid-area: name;}
.weather .wday .wddate {grid-area: date;}
.weather .wday .wpic {grid-area: pic; width: 56px; height: 56px; margin: 0px;}
.weather .wday .wdtemp {grid-area: temp; text-align: right;}
.weather .wday .wddesc {grid-area: desc; text-align: right; min-height: 0px;}
.weather .wday .wdparams {grid-area: params; margin-top: 6px;}
}

/* Предприятия */
.entblock, .enterprises {--e-bg: #f4f8fb; --e-line: #e3e9ee; --e-text: #3c3c3c; --e-muted: #777777; --e-accent: #337eb7; --e-btn-text: #ffffff; --e-tag-bg: #dceaf6; --e-tag-text: #1f5a87;}
.entblock {margin: 15px 0px; padding: 12px 16px; background-color: var(--e-bg); border-radius: 6px;}
.entblock .enthead {font-weight: bold; margin-bottom: 6px; color: var(--e-text);}
.entlist {list-style: none; margin: 0px; padding: 0px;}
.entlist li {padding: 6px 0px; border-bottom: 1px solid var(--e-line); color: var(--e-text);}
.entlist li:last-child {border-bottom: 0px;}
.entlist .entmore {color: var(--e-muted);}
.enttag {display: inline-block; font-size: 13px; padding: 1px 8px; border-radius: 4px; background-color: var(--e-tag-bg); color: var(--e-tag-text); white-space: nowrap;}
.entblock .entlink {margin-top: 8px;}
.enterprises .entplace {margin: 0px 0px 10px 0px; color: var(--e-muted);}
.enterprises .entintro {margin-bottom: 12px;}
.enterprises .entfilter {display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0px 15px 0px;}
.enterprises .entfilter button {font-family: inherit; font-size: 15px; padding: 5px 12px; border-radius: 5px; border: 1px solid var(--e-line); background-color: transparent; color: var(--e-text); cursor: pointer;}
.enterprises .entfilter button.v {background-color: var(--e-accent); border-color: var(--e-accent); color: var(--e-btn-text);}
.enterprises .entcard {padding: 14px 18px; margin-bottom: 14px; background-color: var(--e-bg); border-radius: 6px;}
.enterprises .entcard {text-align: left;}
.enterprises .entcard h2 {margin: 0px 0px 6px 0px; overflow-wrap: anywhere; hyphens: auto;}
.enterprises .entcard[hidden] {display: none;}
.enterprises .entmeta {margin-bottom: 8px;}
.enterprises .entyear {font-size: 15px; color: var(--e-muted); margin-left: 6px;}
.enterprises .entsummary {margin: 0px 0px 8px 0px; font-style: italic;}
.enterprises .entfacts {border-collapse: collapse; width: 100%; margin: 6px 0px 10px 0px; font-size: 16px;}
.enterprises .entfacts td {padding: 5px 8px; border-bottom: 1px solid var(--e-line); vertical-align: top; text-align: left;}
.enterprises .entfacts td:first-child {color: var(--e-muted); width: 28%; white-space: nowrap;}
.enterprises .entcard p {margin: 8px 0px;}
.enterprises .entback {margin-top: 15px;}
@media (max-width: 1000px){
.enterprises .entfacts td:first-child {width: 35%; white-space: normal;}
}

/* Карточки «Рекомендуем посетить»: одна ссылка на карточку */
.featured .flink {display: block; text-decoration: none;}
.featured .flink .fname {text-decoration: underline;}
.featured .flink:hover .fname {text-decoration: none;}
.hometext {margin-top: 15px;}
/* Справочники: коды регионов и телефонные коды */
.codes {border-collapse: collapse; margin: 10px 0px;}
.codes th, .codes td {border: 1px solid #9e9e9e; padding: 4px 10px; text-align: left; vertical-align: top;}
.phonecodes {columns: 3 220px; padding-left: 20px;}
.phonecodes li {break-inside: avoid;}
/* Ссылки на справочники: подвал и таблица фактов */
#footer {height: auto; min-height: 70px;}
#footercenter .flinks {padding: 12px 20px 0px 20px; color: #9e9e9e;}
#footercenter .flinks a {color: #ffffff; margin-left: 15px;}
.codeslink {margin-left: 10px; font-size: 14px;}
