@font-face {
    font-family: "Oswald Reg";
    src: url("fonts/Oswald-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

/*region BASE STYLES*/
*,
*:before,
*:after {
    box-sizing: border-box;
}

.clear:before,
.clear:after {
    content: "";
    display: table;
}
.clear:after {
    clear: both;
}

html {
    width: 100%;
    height: 100%;
}

html.no-scroll {
    overflow: hidden;
}
body {
    width: 100%;
    height: 100%;
    padding: 0;
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color:#222;
}

a {
    text-decoration: underline;
}
a:hover {
    text-decoration: none;
}
/*endregion*/

/*region ALIGNING*/
.flex-cont {
    display: flex;
    flex-wrap: wrap;
}
.mt100 {
    margin-top: 100px;
}
.mb-50 {
    margin-bottom: -50px;
}
.pt50 {
    padding-top: 50px;
}
.col50 {
    width: 50%;
}
.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}
.text-center {
    text-align: center;
}
/*endregion*/

.circle-chart canvas {
    width: 100%;
}

/*region BASE SECTIONS & SECTIONS TEXT*/
.section {
    position: relative;
    margin-bottom: 140px;
}
.section .cont {
    max-width: 900px;
    margin: 0 auto;
}
.section .text {
    font-size: 20px;
    text-align: left;
    font-weight: 300;
}
.section-group {
    padding-top: 60px;
}
.section .text.block-text-extended{
    font-size: 22px;
}
/*endregion*/

/*region OS*/
.os {
    opacity: 0;
}
.os.osUp {
    transform: translateY(50px);
}
.os.osDown {
    transform: translateY(-50px);
}
.os.osLeft {
    transform: translateX(50px);
}
.os.osRight {
    transform: translateX(-50px);
}
.os.onScreen {
    opacity: 1;
    transform: translate(0, 0);
    transition: transform .5s, opacity .5s;
}
.os.osDelay-1{
    transition-delay: 0.3s;
}
.os.osDelay-2{
    transition-delay: 0.6s;
}
/*endregion*/

/*region NUMBER*/
.number {
    display: inline-block;
    vertical-align: top;
    line-height: 1;
    white-space: nowrap;
    opacity: 0;
    transition: opacity .5s;
    text-align: center;
}
.number.onScreen {
    opacity: 1;
    transition: opacity .5s;
}
.number div {
    position: relative;
    display: inline-block;
    vertical-align: top;
    overflow: hidden;
    color: transparent;
}
.number div span {
    display: inline-block;
    vertical-align: top;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    line-height: 1;
}
/*endregion*/

/*region SHARED CONTAINER*/
.shared-cont {
    position: fixed;
    top: 100px;
    right: 25px;
    width: 22px;
    height: 200px;
}
.shared-cont .shared-ico {
    width: 22px;
    height: 20px;
}
.shared-cont.white .shared-ico {
    background: url(images/share-line-w.png) center center no-repeat;
}
.shared-cont.white .shared-caption {
    color: #fff;
}
.shared-cont.black .shared-ico {
    background: url(images/share-line-b.png) center center no-repeat;
}
.shared-cont .shared-caption {
    font-size: 14px;
    font-weight: 300;
    vertical-align: super;
    position: absolute;
    transform: rotate(-90deg);
    width: 155px;
    top: 110px;
    left: -65px;
    opacity: 1;
    transition: transform 0.3s 0.3s, opacity 0.3s;
}
.shared-cont.white .shared-caption {
    color: #fff;
}
.shared-cont.black .shared-caption {
    color: #222;
}
.shared-cont.white:hover .shared-ico {
    background: url(images/share-line-wf.png) center center no-repeat;
}
.shared-cont.black:hover .shared-ico {
    background: url(images/share-line-bf.png) center center no-repeat;
}
.shared-ico:hover .icons{
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
    opacity: 1;
    display: block;
}
.shared-ico:hover .shared-caption{
    opacity: 0;
    transform: translateY(320%) rotate(-90deg);
}
.shared-cont .icons {
    transition: opacity 0.3s;
    opacity: 0;
    display: none;
    transform: translateY(-100px);
}
.shared-cont .icons li {
    display: block;
    margin-bottom: 15px;
    line-height: 1;
}

.shared-cont .soc-ico {
    display: block;
    width: 23px;
    height: 23px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.shared-cont.white .fb {
    background-image: url(images/fb-w.png);
}
.shared-cont.white .vk {
    background-image: url(images/vk-w.png);
}
.shared-cont.white .twitter {
    background-image: url(images/twitter-w.png);
}
.shared-cont.white .ok {
    background-image: url(images/ok-w.png);
}
.shared-cont.white .tg {
    background-image: url(images/tg-w.png);
}
.shared-cont.black .fb {
    background-image: url(images/fb-b.png);
}
.shared-cont.black .vk {
    background-image: url(images/vk-b.png);
}
.shared-cont.black .ok {
    background-image: url(images/ok-b.png);
}
.shared-cont.black .tg {
    background-image: url(images/tg-b.png);
}
.shared-cont.black .twitter {
    background-image: url(images/twitter-b.png);
}
/*endregion*/

.cols-cont {
    margin-bottom: 50px;
}
.cols-cont .col50 {
    float: left;
    width: 50%;
}
.canv-line-chart {
    margin-bottom: 130px;
}
.path-cont {
    width: 1px;
    position: absolute;
    left: 50%;
    bottom: -96px;
    height: 195px;
    background-color: #000;
}
.path-cont .start-path {
    background:url(images/arrow-dn.png) no-repeat center;
    display: block;
    width: 20px;
    height: 20px;
    border: 1px solid #000;
    border-radius: 20px;
    position: absolute;
    top: -20px;
    left: -10px;
    cursor: pointer;
}
.path-cont .end-path {
    display: block;
    width: 11px;
    height: 11px;
    background-color: #000;
    border-radius: 10px;
    position: absolute;
    bottom: -10px;
    left: -5px;
}

/*region THEMES*/
/*region CULTURE*/
.culture-theme .path-cont {
    background-color: #e48060;
}
.culture-theme .path-cont .start-path {
    border: 1px solid #e48060;
}
.culture-theme .path-cont .end-path {
    background-color: #e48060;
}
/*endregion*/

/*region DEMOGRAPHY*/
.demography-theme .path-cont {
    background-color: #638ddc;
}
.demography-theme .path-cont .start-path {
    border: 1px solid #638ddc;
}
.demography-theme .path-cont .end-path {
    background-color: #638ddc;
}
/*region DEMOGRAPHY THEME SLIDER CONTAINER*/
.demography-theme .slider-container .slider-box {
    margin: 0 0 40px;
}
.demography-theme .slider-container .slide {
    padding-top: 0;
}
.demography-theme .slider-container .photo-cont {
    width: 370px;
    height: 370px;
}
.demography-theme .section-nav .nav-cont {
    padding-top: 0;
}
/*endregion*/
/*endregion*/

/*region YOUTH*/
.youth-theme .path-cont {
    background-color: #cf497f;
}
.youth-theme .path-cont .start-path {
    border: 1px solid #cf497f;
}
.youth-theme .path-cont .end-path {
    background-color: #cf497f;
}
.youth-theme .section-lmosaic .site {
    color: #cf497f;
    background-image: url(images/site-youth.png);
    border-color:#cf497f;
}
/*endregion*/

/*region ECONOMY*/
.economy-theme .path-cont {
    background-color: #68beaa;
}
.economy-theme .path-cont .start-path {
    border: 1px solid #68beaa;
}
.economy-theme .path-cont .end-path {
    background-color: #68beaa;
}
.economy-theme .section-chart .notice{
    font-size: 13px;
}
.economy-theme .section-doughnut-chart .active i {
    border-color: #68beaa;
}
.economy-theme .section-doughnut-chart .active span {
    color: #68beaa;
}
/*endregion*/

/*region cifrovizaciya*/
.cifrovizaciya-theme .section-chart .slide {
    padding: 50px;
    min-height: fit-content !important;
}
.cifrovizaciya-theme .section-chart .active .num {
    font-size: 80px;
}
.cifrovizaciya-theme .section-chart .active .notice {
    font-size: 30px;
}
.cifrovizaciya-theme {
    --theme-color: #8A63DD;
}
.cifrovizaciya-theme .path-cont {
    background-color: var(--theme-color);
}
.cifrovizaciya-theme .path-cont .start-path {
    border: 1px solid var(--theme-color);
}
.cifrovizaciya-theme .section-chart .num {
    color: var(--theme-color);
}
.cifrovizaciya-theme .section-chart .slider-cont {
    z-index: -1;
}
.cifrovizaciya-theme .timeline-cont .item:before {
    background-color: var(--theme-color);
}
.cifrovizaciya-theme .path-cont .end-path {
    background-color: var(--theme-color);
}
.cifrovizaciya-theme .section-moor__info--title {
    color: var(--theme-color);
}
.cifrovizaciya-theme .section-moor__image--background {
    background-color: var(--theme-color);
}
.cifrovizaciya-theme .text-color {
    color: var(--theme-color);
}
.cifrovizaciya-theme .section-info .bg-title {
    color: var(--theme-color);
}
.cifrovizaciya-theme .section-nav .nav:hover {
    background-color: var(--theme-color);
}
.cifrovizaciya-theme .section-bars .bar {
    background-color: var(--theme-color);
}
.cifrovizaciya-theme .section-timeline .text {
    text-align: right;
}
.cifrovizaciya-theme .timeline-cont .value {
    font-size: 20px;
}
.cifrovizaciya-theme .section-vertical-growth {
    text-align: center;
}
.cifrovizaciya-theme .section-chart-line-second {
    text-align: center;
}
.cifrovizaciya-theme .section-stat .item {
    width: 50%;
}

/*endregion*/

/*region LIVING*/
.living-theme .path-cont {
    background-color: #52ae7f;}
.living-theme .path-cont .start-path {
    border: 1px solid #52ae7f;
}
.living-theme .path-cont .end-path {
    background-color: #52ae7f;
}
/*endregion*/

/*region EDU*/
.edu-theme .path-cont {
    background-color: #7363dd;
}
.edu-theme .path-cont .start-path {
    border: 1px solid #7363dd;
}
.edu-theme .path-cont .end-path {
    background-color: #7363dd;
}
.edu-theme .section-doughnut-chart .active i {
    border-color: #7363dd;
}
.edu-theme .section-doughnut-chart .active span {
    color: #7363dd;
}
.edu-theme .section-lmosaic .site {
    color: #7363dd;
    background-image: url(images/site-edu.png);
    border-color:#7363dd;
}
/*endregion*/

/*region HEALTH*/
.health-theme .path-cont {
    background-color: #00abe4;
}
.health-theme .path-cont .start-path {
    border: 1px solid #00abe4;
}
.health-theme .path-cont .end-path {
    background-color: #00abe4;
}
/*endregion*/

/*region SPORT*/
.sport-theme .path-cont {
    background-color: #ce4558;
}
.sport-theme .path-cont .start-path {
    border: 1px solid #ce4558;
}
.sport-theme .path-cont .end-path {
    background-color: #ce4558;
}
/*endregion*/

/*region TOURISM*/
.tourism-theme .path-cont {
    background-color: #e1c066;
}
.tourism-theme .path-cont .start-path {
    border: 1px solid #e1c066;
}
.tourism-theme .path-cont .end-path {
    background-color: #e1c066;
}
/*endregion*/

/*region SOCIAL*/
.social-theme .path-cont {
    background-color: #c17be1;
}
.social-theme .path-cont .start-path {
    border: 1px solid #c17be1;
}
.social-theme .path-cont .end-path {
    background-color: #c17be1;
}
/*endregion*/

/*region ECOLOGY */
.ecology-theme .path-cont {
    background-color: #31694C;
}
.ecology-theme .path-cont .start-path {
    border: 1px solid #31694C;
}
.ecology-theme .path-cont .end-path {
    background-color: #31694C;
}
/*endregion*/

/*region AGRICULTURE */
.agri-theme .path-cont {
    background-color: #2e61ae;
}
.agri-theme .path-cont .start-path {
    border: 1px solid #2e61ae;
}
.agri-theme .path-cont .end-path {
    background-color: #2e61ae;
}
/*endregion*/
/*region THEMES COLORS*/
.culture-theme .text-color {
    color: #e48060;
}
.demography-theme .text-color {
    color: #638ddc;
}
.youth-theme .text-color {
    color: #cf497f;
}
.economy-theme .text-color {
    color: #68beaa;
}
.living-theme .text-color {
    color: #52ae7f;
}
.edu-theme .text-color {
    color: #7363dd;
}
.health-theme .text-color {
    color: #00abe4;
}
.sport-theme .text-color {
    color: #ce4558;
}
.tourism-theme .text-color {
    color: #e1c066;
}
.social-theme .text-color {
    color: #c17be1;
}
.ecology-theme .text-color{
    color: #31694C;
}
.agri-theme .text-color{
    color: #2e61ae;
}
/*endregion*/

/*region THEMES SECTION BARS*/
.culture-theme .section-bars .bar {
    background-color: #e48060;
}
.health-theme .section-bars .bar {
    background-color: #00abe4;
}
.youth-theme .section-bars .bar {
    background-color: #cf497f;
}
.edu-theme .section-bars .bar {
    background-color: #7363dd;
}
.demography-theme .section-bars .bar {
    background-color: #638ddc;
}
.economy-theme .section-bars .bar {
    background-color: #68beaa;
}
.social-theme .section-bars .bar {
    background-color: #c17be1;
}
.living-theme .section-bars .bar {
    background-color: #52ae7f;
}
.tourism-theme .section-bars .bar{
    background-color: #e1c066;
}
.ecology-theme .section-bars .bar{
    background-color: #31694C;
}
.agri-theme .section-bars .bar{
    background-color: #2e61ae;
}
/*endregion*/

/*region THEMES OWL DOTS*/
.culture-theme .section-chart .owl-dot.active span {
    background-color: #e48060;
}
.demography-theme .section-chart .owl-dot.active span {
    background-color: #638ddc;
}
.economy-theme .section-chart .owl-dot.active span {
    background-color: #68beaa;
}
.living-theme .section-chart .owl-dot.active span {
    background-color: #52ae7f;
}
.edu-theme .section-chart .owl-dot.active span {
    background-color: #7363dd;
}
.health-theme .section-chart .owl-dot.active span {
    background-color: #00abe4;
}
.sport-theme .section-chart .owl-dot.active span {
    background-color: #ce4558;
}
.ecology-theme .section-chart .owl-dot.active span{
    background-color: #31694C;
}
.agri-theme .section-chart .owl-dot.active span{
    background-color: #2e61ae;
}
/*endregion*/

/*region THEMES CHART NUM*/
.culture-theme .section-chart .num {
    color: #e48060;
}
.demography-theme .section-chart .num {
    color: #638ddc;
}
.economy-theme .section-chart .num {
    color: #68beaa;
}
.living-theme .section-chart .num {
    color: #52ae7f;
}
.edu-theme .section-chart .num {
    color: #7363dd;
}
.health-theme .section-chart .num {
    color: #00abe4;
}
.sport-theme .section-chart .num {
    color: #ce4558;
}
.social-theme .section-chart .num {
    color: #c17be1;
}
.ecology-theme .section-chart .num {
    color: #31694C;
}
.agri-theme .section-chart .num{
    color: #2e61ae;
}
/*endregion*/

/*region THEMES CHART CONT*/
.culture-theme .chart-l1-cont {
    background-image: url(images/chart-multy-culture.jpg);
}
.demography-theme .chart-l1-cont {
    background-image: url(images/chart-multy-demography.jpg);
}
.economy-theme .chart-l1-cont {
    background-image: url(images/chart-multy-economy.jpg);
}
.living-theme .chart-l1-cont {
    background-image: url(images/chart-multy-living.jpg);
}
.edu-theme .chart-l1-cont {
    background-image: url(images/chart-multy-edu.jpg);
}
/*endregion*/

/*region THEMES MOSAIC CONT*/
/*region CULTURE MOSAIC CONT*/
.culture-theme .mosaic-cont .theme  .num {
    color:#e48060;
}
.culture-theme .mosaic-cont .theme .num:after {
    background-color: #e48060;
}
.culture-theme .mosaic-cont .theme .number span {
    color:#e48060;
}
/*endregion*/
/*region DEMOGRAPHY MOSAIC CONT*/
.demography-theme .mosaic-cont .theme .num {
    color:#638ddc;
}
.demography-theme .mosaic-cont .theme .num:after {
    background-color: #638ddc;
}
.demography-theme .mosaic-cont .theme .number span {
    color:#638ddc;
}
/*endregion*/
/*region YOUTH MOSAIC CONT*/
.youth-theme .mosaic-cont .theme .num {
    color:#cf497f;
}
.youth-theme .mosaic-cont .theme .num:after {
    background-color: #cf497f;
}
.youth-theme .mosaic-cont .theme .number span {
    color:#cf497f;
}
/*endregion*/
/*region ECONOMY MOSAIC CONT*/
.economy-theme .mosaic-cont .video:after {
    background-image: url(images/economy/play-icon.png);
}
.economy-theme .mosaic-cont .theme .num {
    color:#68beaa;
}
.economy-theme .mosaic-cont .theme .num:after {
    background-color: #68beaa;
}
.economy-theme .mosaic-cont .theme .number span {
    color:#68beaa;
}
/*endregion*/
/*region LIVING MOSAIC CONT*/
.living-theme .mosaic-cont .theme .num {
    color:#52ae7f;
}
.living-theme .mosaic-cont .theme .num:after {
    background-color: #52ae7f;
}
.living-theme .mosaic-cont .theme .number span {
    color:#52ae7f;
}
/*endregion*/
/*region EDU MOSAIC CONT*/
.edu-theme .mosaic-cont .video:after {
    background-image: url(images/edu/play-icon.png);
}
.edu-theme .mosaic-cont .theme .num {
    color:#7363dd;
}
.edu-theme .mosaic-cont .theme .num:after {
    background-color: #7363dd;
}
.edu-theme .mosaic-cont .theme .number span {
    color:#7363dd;
}
/*endregion*/
/*region HEALTH MOSAIC CONT*/
.health-theme .mosaic-cont .video:after {
    background-image: url(images/health/play-icon.png);
}
.health-theme .mosaic-cont .theme .num {
    color:#00abe4;
}
.health-theme .mosaic-cont .theme .num:after {
    background-color: #00abe4;
}
.health-theme .mosaic-cont .theme .number span {
    color:#00abe4;
}
/*endregion*/
/*region SPORT MOSAIC CONT*/
.sport-theme .mosaic-cont .video:after {
    background-image: url(images/sport/play-icon.png);
}
.sport-theme .mosaic-cont .theme .num {
    color:#ce4558;
}
.sport-theme .mosaic-cont .theme .num:after {
    background-color: #ce4558;
}
.sport-theme .mosaic-cont .theme .number span {
    color:#ce4558;
}
/*endregion*/
/*region TOURISM MOSAIC CONT*/
.tourism-theme .mosaic-cont .theme .num {
    color:#e1c066;
}
.tourism-theme .mosaic-cont .theme .num:after {
    background-color: #e1c066;
}
.tourism-theme .mosaic-cont .theme .number span {
    color:#e1c066;
}
/*endregion*/
/*region SOCIAL MOSAIC CONT*/
.social-theme .mosaic-cont .theme .num {
    color:#c17be1;
}
.social-theme .mosaic-cont .theme .num:after {
    background-color: #c17be1;
}
.social-theme .mosaic-cont .theme .number span {
    color:#c17be1;
}
/*endregion*/
/*region ECOLOGY MOSAIC CONT*/
.ecology-theme .mosaic-cont .theme .num {
    color: #31694C;
}
.ecology-theme .mosaic-cont .theme .num:after {
    background-color:  #31694C;
}
.ecology-theme .mosaic-cont .theme .number span {
    color: #31694C;
}
/*endregion*/
/* region AGRICULTURE MOSAIC CONT */
.agri-theme .mosaic-cont .theme .num {
    color: #2e61ae;
}
.agri-theme .mosaic-cont .theme .num:after {
    background-color:  #2e61ae;
}
.agri-theme .mosaic-cont .theme .number span {
    color: #2e61ae;
}
/*endregion*/
/*endregion*/

/*endregion*/

.text-color {
    font-size: 24px;
    line-height: 36px;
}
.text-style-dark {
    color: #222;
    font-size: 24px;
    line-height: 36px;
}
.section-timeline .title-cont {
    color: #222;
    font-size: 24px;
}
.section-mosaic .title-cont,
.section-chart-line .title-cont{
    padding-right: 15px;
}
.text-chartname{
    margin-top: 20px;
}

/*region TIMELINE CONT*/
.timeline-cont {
    font-size: 0;
    display: flex;
    flex-wrap: wrap;
}
.timeline-cont .item {
    display: inline-block;
    padding: 35px 10px 45px 0;
    width: 25%;
    position: relative;
}
.timeline-cont .item:before {
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #d4d4d4;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.timeline-cont .item:after {
    content: "";
    display: block;
    height: 1px;
    width: 100%;
    background: #d4d4d4;
    position: absolute;
    top: 7px;
    left: 15px;
}
.timeline-cont .value {
    font-family: "Oswald Reg";
    font-size: 34px;
    margin-bottom: 10px;
    display: block;
}
.timeline-cont .caption {
    font-size: 16px;
    font-weight: 300;
    display: block;
}
/*region THEMES TIMELINE CONT*/
.demography-theme .timeline-cont .item:last-child:before {
    background: #638ddc;
}
.demography-theme .timeline-cont .item:last-child .value {
    color: #638ddc;
}
.youth-theme .timeline-cont .item:last-child:before {
    background: #cf497f;
}
.youth-theme .timeline-cont .item:last-child .value {
    color: #cf497f;
}
.economy-theme .timeline-cont .item:before {
    background: #68beaa;
}
.economy-theme .timeline-cont .item .value {
    color: #68beaa;
}
.edu-theme{
    --timeline-point-color: #7363DD;
}
.edu-theme .timeline-cont .item:before {
    background: #7363dd;
}
.edu-theme .timeline-cont .item .value {
    color: #7363dd;
}
.living-theme .timeline-cont .item:before {
    background: #52ae7f;
}
.living-theme .timeline-cont .item .value {
    color: #52ae7f;
}
.tourism-theme .timeline-cont .item:before {
    background: #e1c066;
}
.tourism-theme .timeline-cont .item .value {
    color: #e1c066;
}
.health-theme{
    --timeline-point-color: #00abe4;
}
.health-theme .timeline-cont .item:before {
    background: #00abe4;
}
.health-theme .timeline-cont .item .value {
    color: #00abe4;
}
.culture-theme .timeline-cont .item:before {
    background: #e48060;
}
.culture-theme .timeline-cont .item .value {
    color: #e48060;
}
.sport-theme{
    --timeline-point-color: #ce4558;
}
.sport-theme .timeline-cont .item:before {
    background: #ce4558;
}
.sport-theme .timeline-cont .item .value {
    color: #ce4558;
}
.ecology-theme{
    --timeline-point-color: #31694C;
}
.ecology-theme .timeline-cont .item:before {
    background: #31694C;
}
.ecology-theme .timeline-cont .item .value {
    color: #31694C;
}
.agri-theme{
    --timeline-point-color: #2e61ae;
}
.agri-theme .timeline-cont .item:before {
    background: #2e61ae;
}
.agri-theme .timeline-cont .item .value {
    color: #2e61ae;
}
/*endregion*/
/*endregion*/

/*region UPDATED TIMELINE */
.timeline{
    display: flex;
    flex-direction: column;
}
.timeline__items{
    display: flex;
    flex-wrap: wrap;
    gap: 50px 0;
}
.timeline__item-wrapper{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 0 0 33.33%;
    --inner-padding: 10px;
    padding: 0 var(--inner-padding);
    font-family: "Lato";
}
.timeline__items > .timeline__item-wrapper:nth-child(4),
.timeline__items > .timeline__item-wrapper:nth-child(10){
    flex: 0 0 66.66%;
}
.timeline__item--title{
    font-size: 28px;
    padding-bottom: 20px;
}
.timeline__item--link{
    width: 100%;
    height: 15px;
    position: relative;
    overflow: visible;
    display: flex;
    justify-content: start;
    align-items: center;
    padding-bottom: 20px;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
.timeline__item--link-point{
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: var(--timeline-point-color);
}
.timeline__item--link-line{
    width: calc(100% + calc(var(--inner-padding) * 2));
    position: absolute;
    left: calc(var(--inner-padding) * -1);
    height: 1px;
    background-color: #D5D8DE;
}
.timeline__item--numbers{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 15px;
    padding-bottom: 30px;
}
.timeline__item--number{
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.timeline__item--number-value{
    color: var(--timeline-point-color);
    font-size: 28px;
}
.timeline__item--number-desc{
    font-size: 16px;
}
.timeline__item--name{
    font-size: 20px;
    padding-bottom: 10px;
    font-weight: 600;
    max-width: 280px;
}
.timeline__item--place{
    font-size: 16px;
    padding-bottom: 30px;
    color: #747B8A;
}
.timeline__item--image-wrapper{
    width: 100%;
    height: 280px;
}
.timeline__item--image-wrapper img{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

/*endregion*/

/*region SECTION*/
/*region SECTION PRESENT*/
.section-present {
    height: 100%;
    min-height: 800px;
    position: relative;
    color: #fff;
    z-index: 10;
}
.section-present:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: rgba(0, 0, 0, 0.6);
}
.section-present .h1 {
    font-size: 56px;
    margin-bottom: 20px;
    line-height: 100%;
}
.section-present .text {
    padding: 0 30px;
    text-align: center;
    font-size: 20px;
}
.section-present .content {
    text-align: center;
    transform: translateY(-50%);
    position: absolute;
    width: 100%;
    top: 50%;
}
.section-present .logo {
    position: absolute;
    top: 70px;
    left: 25px;
}
.section-present .ham {
    position: absolute;
    left: 30px;
    bottom: 35px;
}
.section-present .parallax-window {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: brightness(0.6);
}
/*endregion*/

/*region SECTION HEADER*/
.section-h2 {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    height: 330px;
    margin-bottom: 175px;
}
.section-h2 .h2.section-h2-smallfont{
    font-size: 30px;
}
.section-h2:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: rgba(0, 0, 0, 0.3);
}
.section-h2 .h2 {
    font-size: 36px;
    color: #fff;
}
.section-h2 .content {
    text-align: center;
    transform: translateY(-50%);
    position: absolute;
    width: 100%;
    top: 50%;
}
/*endregion*/

/*region SECTION CHART*/
.section-chart .title-cont {
    text-align: right;
    color: #222;
    font-size: 22px;
    line-height: 36px;
}
.section-chart .flex-cont {
    margin-bottom: 50px;
}
.section-chart .canvas-cont {
    position: relative;
}
.section-chart canvas {
    width: 100% !important;
    height: auto !important;
}
.section-chart .col {
    align-self: center;
    text-align: center;
}
.section-chart .col-1 {
    width: 27%;
    padding: 0 30px 0 0;
}
.section-chart .col.text-right{
    text-align: right;
}
.section-chart .col-2 {
    width: 48%;
    position: relative;
}
.section-chart .col-3 {
    width: 25%;
    padding: 0 0 0 30px;
}
#circle-chart {
    width: 100%;
    height: auto;
    margin: 0;
    display: block;
}
.section-chart .slider-cont {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
}
.section-chart .v-center {
    align-self: center;
    width: 100%;
    position: relative;
}
.section-chart .v-center:after {
    content: "";
    width: 20px;
    height: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.section-chart .slide {
    align-self: center;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    padding: 0 40px;
}
.section-chart .slide.slide-num-hidden > .num{
    margin-bottom: 35px;
}
.section-chart .num {
    font-family: "Oswald Reg";
    font-size: 34px;
    display: block;
    line-height: 34px;
    transform: translateY(-30px);
    opacity: 0;
    transition: transform  0.5s, opacity 0.3s;
}
.section-chart .active .num {
    transform:translateY(0px);
    opacity: 1;
}
.section-chart .notice {
    font-weight: 300;
    font-size: 14px;
    display: block;
    transform: translateY(30px);
    opacity: 0;
    line-height: 100%;
    transition: transform  0.5s, opacity 0.3s;
}
.section-chart .active .notice {
    transform: translateY(0px);
    opacity: 1;
}
.section-chart .pagination-cont {
    font-size: 0;
    text-align: center;
}
.section-chart .flex-cont.section-chart-nocircle {
    margin-bottom: 120px;
}
.section-chart .flex-cont.section-chart-nocircle .num{
    padding-top: 20px;
}
.section-chart .flex-cont.section-chart-nocircle + .pagination-cont{
    padding-top: 30px;
}
.section-chart .owl-dot {
    display: inline-block;
    width: 90px;
    height: 1px;
    position: relative;
    background-color: #d4d4d4;
    text-align: left;
    font-size: 0;
}
.section-chart .pagination-cont .owl-dot:last-child {
    width: auto;
    background:none;
}

.section-chart .owl-dot:after {}
.section-chart .owl-dot span {
    display: inline-block;
    width: 15px;
    height: 15px;
    cursor: pointer;
    background-color: #d4d4d4;
    border-radius: 15px;
    position: relative;
    top: -7px;
}
.section-chart .line {
    display: inline-block;
    width: 20px;
    margin: 10px 0;
    height: 1px;
    background-color: #e48060;
}
/*endregion*/

/*region SECTION MULTICHART*/
.section-multy-chart .chart-l1-cont {
    width: 420px;
    height: auto;
    margin:0 auto;
    font-size: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    border-radius: 50%;
}
.section-multy-chart .chart {
    width: 100%;
    height: 100%;
}
.section-multy-chart .chart-l2-cont {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
}
.section-multy-chart .chart-l3-cont {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
}
.section-multy-chart .circle-l2-wrp {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.section-multy-chart .circle-l3-wrp {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.section-multy-chart .label {
    font-size: 20px;
    color: #fff;
    font-family: "Oswald Reg";
    position: absolute;
    width: 100%;
    text-align: center;
    line-height: 20px;
}
.section-multy-chart .col {
    width: 50%;
}
.section-multy-chart .col-2 {
    align-self: center;
    padding-left: 75px;
}
.section-multy-chart .title-cont {
    margin-bottom: 20px;
}
.section-multy-chart canvas {
    width: 100% !important;
    height: auto !important;
}
/*endregion*/

/*region SECTION DOUBLECHART*/
.section-double-chart .chart-l2-cont {
    width: 69%;
    height: 69%;
}
.section-double-chart .chart-l2:before {
    content: "";
    display: block;
    width: 62%;
    height: 62%;
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}
.section-double-chart .circle-l2-wrp {
    width: 74%;
    height: 74%;
}
.section-double-chart .label {
    top: 18px;
}
/*endregion*/

/*region SECTION TRIPLECHART*/
.section-triple-chart .chart-l2-cont {
    width: 73%;
    height: 73%;
}
.section-triple-chart .chart-l2 {
    width: 100%;
    height: 100%;
}
.section-triple-chart .circle-l2-wrp {
    width: 78%;
    height: 78%;
}
.section-triple-chart .circle-l3-wrp {
    width: 69%;
    height: 69%;
}
.section-triple-chart .label {
    top: 15px;
}
.section-triple-chart .chart-l3-cont {
    width: 60%;
    height: 60%;
}
.section-triple-chart .chart-l3:before {
    content: "";
    display: block;
    width: 48%;
    height: 48%;
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}
/*endregion*/

/*region MOSAIC CONT*/
.mosaic-cont .cell {
    width: 25%;
    height: 213px;
    float: left;
    position: relative;
}
.mosaic-cont.mosaic-cont-v .cell{
    width: 33.33%;
}
.mosaic-cont .cell-inner {
    width: 100%;
    height: 100%;
    position: relative;
}
.mosaic-cont .slide {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
}
.mosaic-cont .cell.cell-v{
    margin: 0;
}
.mosaic-cont.onScreen .slide {
    transition: transform linear 0.5s 0.5s;
}
.mosaic-cont .descr-cont {
    position: relative;
    text-align: center;
    background-color: #f0f0f0;
    height: 100%;
}
.mosaic-cont .num {
    font-size: 34px;
    font-family: "Oswald Reg";
    margin-bottom: 10px;
    line-height: 34px;
}
.mosaic-cont .num:after {
    content: '';
    display: block;
    width: 20px;
    margin:0 auto;
    height: 1px;
    margin-top: 5px;
}
.mosaic-cont .descr {
    font-size: 15px;
    font-weight: 300;
}
.mosaic-cont .v-center {
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
    padding: 0 10px;
}
.mosaic-cont .photo,
.mosaic-cont .video {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 100%;
    outline: 0;
}
.mosaic-cont .video {
    position: relative;
    text-decoration: none;
    display: block;
}
.mosaic-cont .video:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 44px;
    height: 44px;
    background-position: center;
    background-repeat: no-repeat;
}
.mosaic-cont .video:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: rgba(0, 0, 0, 0.3);
}
.mosaic-cont.os.osUp {
    transition-delay: 0.3s;
}
.mosaic-cont .descr-cont.style-1 {
    background-color: #525966;
    color: #fff;
}
.mosaic-cont .style-1 .num {
    color: #fff;
}
.mosaic-cont .style-1 .num:after {
    background-color: #fff;
}
.mosaic-cont .style-1 .number span {
    color: #fff;
}
/*endregion*/

/*region SECTION MOSAIC*/
.section-mosaic .cols-cont {
    margin-bottom: 70px;
}
.section-mosaic .col50 {
    float: left;
    width: 50%;
}
.section-mosaic-text .col {
    width: 50%;
}
.section-mosaic-text .col-text {
    align-self: center;
}
.section-mosaic-text .col-text-additional{
    width: 100%;
    text-align: center;
    padding-top: 100px;
}
.section-mosaic-text .col-text-additional a{
    color: #638ddc;
}
.section-mosaic-text .title-cont {
    margin-bottom: 20px;
    color: #222;
    font-size: 24px;
}
.section-mosaic-text .col-text-left {
    padding-right: 60px;
}
.section-mosaic-text .col-text-right {
    padding-left: 60px;
}
.section .mosaic-cont .text-downcase{
    text-transform: lowercase;
}
/*endregion*/

/*region SECTION MOOR*/
.culture-theme {
    --moor-color: #e48060;
    --moor-background-color: rgba(228,128,96, 0.3);
}
.living-theme {
    --moor-color: #52ae7f;
    --moor-background-color: rgba(82,174,127,0.3);
}
.sport-theme {
    --moor-color: #ce4558;
    --moor-background-color: rgba(211,88,105, 0.3);
}
.economy-theme{
    --moor-color: #68beaa;
    --moor-background-color: rgba(104,190,170, 0.3);
}
.health-theme{
    --moor-color: #00abe4;
    --moor-background-color: rgba(0, 171, 228, 0.3);
}
.demography-theme{
    --moor-color: #638ddc;
    --moor-background-color: rgba(99, 141, 220, 0.3);
}
.agri-theme{
    --moor-color: #2e61ae;
    --moor-background-color: rgba(67, 113, 183, 0.3);
}
.section-moor{
    display: flex;
    margin-bottom: 150px;
}
.section-moor__info,
.section-moor__image-wrapper{
    flex: 0 0 50%;
}
.section-moor__info{
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: center;
}
.section-moor__info--title{
    font-size: 48px;
    font-weight: 600;
    line-height: 120%;
    margin-bottom: 15px;
    color: var(--moor-color);
}
.section-moor__info--regalia{
    ont-size: 18px;
    line-height: 150%;
    font-style: italic;
    margin-bottom: 25px;
    color: #000;
}
.section-moor__info--text{
    color: #494D57;
    font-size: 20px;
}
.section-moor__image-wrapper{
    position: relative;
    display: flex;
    align-items: end;
    justify-content: center;
    height: 401px;
}
.section-moor__image--background{
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: var(--moor-background-color);
    width: 100%;
    height: 100%;
    max-width: 357px;
    max-height: 357px;
}
.section-moor__image--img{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
}
/*endregion*/

/*region SECTION STAT*/
.section-stat {
    margin-bottom: 90px;
}
.section-stat .cols-cont {
    margin-bottom: 80px;
}
.section-stat .col50 {
    float: left;
    width: 50%;
}
.section-stat .items-cont {
    font-size: 0;
    display: flex;
    flex-wrap: wrap;
}
.section-stat .items-cont.centered-items-cont{
    justify-content: center;
}
.section-stat .item {
    text-align: center;
    display: inline-block;
    padding: 0 30px;
    margin-bottom: 50px;
    vertical-align: top;
}
.section-stat b{
    font-weight: bold;
}
.section-stat-25 .item {
    width: 25%;
}
.section-stat-33 .item {
    width: 33%;
}
.section-stat .item:nth-child(3n+1) {
    transition-delay: 0.6s;
}
.section-stat .item:nth-child(3n+2) {
    transition-delay: 0.9s;
}
.section-stat .item:nth-child(3n+3) {
    transition-delay: 1.2s;
}
.section-stat-25 .item:nth-child(3n+4) {
    transition-delay: 1.5s;
}
.section-stat .icon-cont {
    overflow: hidden;
    margin-bottom: 20px;
    min-height: 100px;
}
.section-stat .descr {
    font-size: 16px;
    font-weight: 300;
}
.section-stat  img {
    max-width: 100%;
}
.section-stat .title-cont {
    color: #222;
    font-size: 24px;
    line-height: 36px;
}
/*endregion*/

/*region SECTION SLIDER*/
.section-slider .title-cont {
    margin-bottom: 30px;
    color: #222;
    font-size: 24px;
}
.section-slider .nav-cont {
    margin-bottom: 30px;
}
.nav-cont-hidden{
    display: none;
}
.section-slider .item {
    float: left;
    margin: 0 10px;
    outline: 0;
}
.section-slider .photo {
    height: 190px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-bottom: 15px;
    display: block;
    outline: 0;
}
.section-slider .title {
    font-size: 16px;
    margin-bottom: 15px;
    display: block;
    text-decoration: none;
    color: #222;
    outline: 0;
}
.section-slider .descr {
    font-size: 13px;
    font-weight: 300;
}
.section-slider .slider-cont {
    width: 100%;
    position: relative;
}
.section-slider .nav {
    display: inline-block;
    width: 12px;
    height: 30px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    outline:0;
}
.section-slider .prev {
    background-image: url(images/arrow-left.png);
}
.section-slider .next {
    background-image: url(images/arrow-right.png);
}
.section-slider .current-num {
    font-size: 34px;
    font-family: "Oswald Reg";
    margin: 0 10px;
    display: inline-block;
}
.section-slider.culture-section-slider .nav-cont{
    margin-bottom: 60px;
}
/*region SECTION SLIDER LOGO*/
.section-slider-logo .title-cont {
    margin-bottom: 30px;
    color: #222;
    font-size: 24px;
}
.section-slider-logo .slider-cont {
    width: 100%;
    position: relative;
}
.section-slider-logo .nav-cont {
    margin-bottom: 30px;
}
.section-slider-logo .nav {
    display: inline-block;
    width: 12px;
    height: 30px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    outline: 0;
}
.section-slider-logo .prev {
    background-image: url(images/arrow-left.png);
}
.section-slider-logo .next {
    background-image: url(images/arrow-right.png);
}
.section-slider-logo .current-num {
    font-size: 34px;
    font-family: "Oswald Reg";
    margin:0 10px;
    display: inline-block;
}
.section-slider-logo .item {
    float: left;
    margin: 0 10px;
    background-repeat: no-repeat;
    background-position: center;
    height: 140px;
    border:1px solid #e1e1e1;
}
/*endregion*/
/*endregion*/

/*region SECTION INFO*/
.section-info {
    text-align: center;
}
.section-info .bg-text-cont {
    position: relative;
}
.section-info .bg-text {
    font-family: "Oswald";
    /* font-size: 300px; */
    /* font-size: 226px; */
    font-size: 190px;
    color: #f0f0f0;
    font-weight: bold;
    line-height: 1;
    text-transform: uppercase;
}
.section-info .bg-title {
    font-family: "Oswald Reg";
    font-size: 50px;
    text-transform: uppercase;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    line-height: 100%;
}
.section-info .text {
    text-align: center;
}
.section-info .number div span {
    color: #f0f0f0;
}
/*region THEMES SECTION INFO*/
.demography-theme .section-info .bg-title {
    color: #638ddc;
}
.economy-theme  .section-info .bg-title {
    color: #68beaa;
}
.living-theme  .section-info .bg-title {
    color: #52ae7f;
}
.edu-theme  .section-info .bg-title {
    color: #7363dd;
}
.health-theme .section-info .bg-title {
    color: #00abe4;
}
.sport-theme .section-info .bg-title {
    color: #ce4558;
}
.tourism-theme .section-info .bg-title {
    color: #e1c066;
}
.social-theme .section-info .bg-title {
    color: #c17be1;
}
.youth-theme .section-info .bg-title {
    color: #cf497f;
}
.ecology-theme .section-info .bg-title{
    color: #31694c;
}
.agri-theme .section-info .bg-title{
    color: #2e61ae;
}
/*endregion*/
/*endregion*/

/*region SECTION NAV*/
.section-nav {
    margin-left: 95px;
}
.section-nav .nav-cont {
    height: 80px;
    display: flex;
    border: 1px solid #d4d4d4;
}
.section-nav .nav {
    width: 50%;
    height: 100%;
    background-repeat: no-repeat;
    text-decoration: none;
    color: #000;
}
.section-nav .prev {
    border-right: 1px solid #d4d4d4;
    display: flex;
    background-image: url(images/arrow-left-b.png);
    background-position: 5% center;
    text-align: left;
    align-items: center;
}
.section-nav .prev:hover {
    background-image: url(images/arrow-left-bh.png);
}
.section-nav .next:hover {
    background-image: url(images/arrow-right-bh.png);
}
.section-nav .next {
    background-image: url(images/arrow-right-b.png);
    display: flex;
    background-position: 95% center;
    text-align: right;
    align-items: center;
    justify-content: flex-end;
}
.section-nav .caption {
    font-size: 24px;
    font-weight: 300;
}
.section-nav .prev .caption {
    margin-left: 10%;
}
.section-nav .next .caption {
    margin-right: 10%;
}
.section-nav .nav:hover .caption {
    color: #fff;
}
/*region THEMES SECTION NAV*/
.culture-theme .section-nav .nav:hover {
    background-color: #e48060;
}
.demography-theme .section-nav .nav:hover {
    background-color: #638ddc;
}
.youth-theme .section-nav .nav:hover {
    background-color: #cf497f;
}
.economy-theme .section-nav .nav:hover {
    background-color: #68beaa;
}
.living-theme  .section-nav .nav:hover {
    background-color: #52ae7f;
}
.edu-theme  .section-nav .nav:hover {
    background-color: #7363dd;
}
.sport-theme  .section-nav .nav:hover {
    background-color: #ce4558;
}
.health-theme  .section-nav .nav:hover {
    background-color: #00abe4;
}
.tourism-theme  .section-nav .nav:hover {
    background-color: #e1c066;
}
.social-theme  .section-nav .nav:hover {
    background-color: #c17be1;
}
.ecology-theme .section-nav .nav:hover{
    background-color: #31694C;
}
.agri-theme .section-nav .nav:hover{
    background-color: #2e61ae;
}
/*endregion*/
/*endregion*/

/*region SECTION NAPRAV*/
section.naprav {
    display: none;
    width: 100%;
    height: 100%;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    overflow-y: auto;
}
section.naprav a {
    display: block;
    width: 100%;
    height: 500px;
    text-align: center;
    color: #fff;
    text-decoration: none;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    font-size: 48px;
    line-height: 52px;
    position: relative;
}
section.naprav a:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: rgba(0, 0, 0, 0.3);
}
section.naprav a > span {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all .2s;
    z-index: 0;
}
section.naprav a > span:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all .2s;
    z-index: 0;
}
section.naprav a:hover > span {
    background: rgba(0, 0, 0, 0.3);
    transition: all .2s;
}
section.naprav a:hover > span:before {
    background: rgba(0, 90, 255, 0.7);
    transition: all .2s;
}
section.naprav a > span > span {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    z-index: 1;
}
section.naprav a > span > span sup {
    font-size: 18px;
    opacity: 0.8;
    padding-right: 30px;
    vertical-align: super;
}
section.naprav a.n1 {
    background-image: url("images/n1_500.webp");
}
section.naprav a.n2 {
    background-image: url("images/n2_500.webp");
}
section.naprav a.n21 {
    background-image: url("images/agriculture.webp");
}
section.naprav a.n3 {
    background-image: url("images/n3_500.webp");
}
section.naprav a.n31 {
    background-image: url("images/ecology.webp");
}
section.naprav a.n4 {
    background-image: url("images/n4_500.jpeg");
}
section.naprav a.n5 {
    background-image: url("images/n4_500.webp");
}
section.naprav a.n6 {
    background-image: url("images/n6_500.jpeg");
}
section.naprav a.n7 {
    background-image: url("images/n6_500.webp");
}
section.naprav a.n8 {
    background-image: url("images/n7_500.webp");
}
section.naprav a.n9 {
    background-image: url("images/n9_500.jpg");
}
section.naprav a.n10 {
    background-image: url("images/n10_500.jpg");
}
section.naprav a.n11 {
    background-image: url("images/cifrovizaciya.jpg");
}
.naprav .close {
    position: fixed;
    cursor: pointer;
    display: block;
    width: 55px;
    height: 55px;
    background: url(images/close.png) no-repeat center;
    top: 50px;
    left: 20px;
    z-index: 10;
}
/*endregion*/

/*region SECTION BARS*/
.section-bars {}
.section-bars .bar-group {
    margin-bottom: 30px;
}
.section-bars .bar-cont {
    height: 15px;
    background-color: #f0f0f0;
    margin-bottom: 20px;
    position: relative;
}
.section-bars .bar-cont:after,
.section-bars .bar-cont:before {
    content: "";
    width: 1px;
    height: 40px;
    background-color: #f0f0f0;
    display: block;
    position: absolute;
    top:-12px;
}
.section-bars .bar-cont:before {
    right: 0;
}
.section-bars .bar {
    width: 0;
    height: 100%;
    transition: 1s;
    position: relative;
}
.section-bars .bar:after {
    content: "";
    width: 1px;
    height: 40px;
    background-color: #f0f0f0;
    display: block;
    position: absolute;
    top:-12px;
    right: 0;
}
.section-bars .legend-cont {}
.section-bars .legend {
    font-size: 16px;
}
.section-bars .value {
    float: right;
    font-size: 24px;
    font-weight: bold;
    font-family: "Oswald Reg";
}
.section-bars .col-right-padding{
    padding-right: 20px;
}
/*endregion*/

/*region SECTION LMOSAIC*/
.section-lmosaic .photo {
    width: 100%;
    height: 100%;
    max-height: 300px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
}
.section-lmosaic .photo img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.section-lmosaic .title {
    font-size: 24px;
}
.section-lmosaic .text {
    font-size: 13px;
    font-weight: 300;
    line-height: 24px;
}
.section-lmosaic .site {
    font-size: 14px;
    background-repeat: no-repeat;
    background-position: 100% 40%;
    padding-right: 20px;
    text-decoration: none;
    border-bottom: 1px solid;
    padding-bottom: 5px;
    text-transform: uppercase;
}

/*region THEMES SECTION LMOSAIC*/
.health-theme .section-lmosaic .site {
    background: url(images/health/arr-site.png) no-repeat center right;
    color: #00abe4;
    border-bottom: 1px solid #00abe4;
}
.tourism-theme .section-lmosaic .site {
    background: url(images/tourism/arr-site.png) no-repeat center right;
    color: #e1c066;
    border-bottom: 1px solid #e1c066;
}
/*endregion*/
/*endregion*/

/*region SECTION DOUGHNUT*/
.section-doughnut-chart {
    text-align: center;
}
.section-doughnut-chart .chart-cont {
    margin-top: 70px;
}
.section-doughnut-chart .canvas-wrp {
    width: 400px;
    margin:0 auto;
}
.section-doughnut-chart canvas {
    width: 100% !important;
    height: auto !important;
}
.section-doughnut-chart .nav-cont {
    display: inline-block;
    font-size: 0;
    margin-bottom: 30px;
}
.section-doughnut-chart .point {
    display: inline-block;
    text-align: center;
    margin-right:140px;
    position: relative;
    cursor: pointer;
}
.section-doughnut-chart i {
    display: inline-block;
    width: 15px;
    height: 15px;
    border: 3px solid #d4d4d4;
    border-radius: 50%;
    position: relative;
}
.section-doughnut-chart i:after {
    content: "";
    display: block;
    height: 3px;
    width: 140px;
    background-color: #d4d4d4;
    position: relative;
    top: 3px;
    right: -12px;
}
.section-doughnut-chart .point:last-child {
    margin-right: 0;
}
.section-doughnut-chart .point:last-child i:after {
    width: 0;
}
.section-doughnut-chart .point span {
    display: block;
    font-size: 16px;
    color: #a9a9a9;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -30px;
}
/*endregion*/
/*endregion*/

/*region FIXED NAV*/
.fixed-nav {
    z-index: 101;
    width: 95px;
    height: 100%;
    position: fixed;
    left: -95px;
    top: 0;
    text-align: center;
    box-shadow: 0 5px 15px rgba(31, 37, 50, 0.2);
    transition: left 1s;
    padding-top: 30px;
}
.fixed-nav.visible {
    left: 0;
}
.fixed-nav .ham {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}
.fixed-nav .pagination-panel {
    transform: rotate(-90deg) translate(-50%,-20%);
    height: 30px;
    position: absolute;
    width: 550px;
    top: 50%;
}
/*endregion*/

/*region PAGINATION PANEL*/
.pagination-panel .item {
    text-decoration: none;
    height: 30px;
    font-size: 0;
}
.pagination-panel {
    transform-origin: 0% 100%;
    display: inline-block;
}
.pagination-panel li {
    display: inline-block;
    font-size: 0;
}
.pagination-panel li > * {
    display: inline-block;
}
.pagination-panel .link {
    display: inline-block;
    height: 30px;
    opacity: 1;
    transition: transform 1s, opacity 1s;
    padding: 0 15px;
}
.pagination-panel .link:after {
    content: "";
    width: 3px;
    background: #c0c0c0;
    display: inline-block;
    height: 100%;
}
.pagination-panel .text {
    float: right;
    max-width: 0;
    overflow-x: hidden;
    opacity: 0;
    transition: opacity 1s;
}
.pagination-panel .text p {
    margin: 0;
    padding: 0;
    padding-left: 20px;
    transform: translateX(-50px);
    font-size: 16px;
    color: #212121;
    text-transform: uppercase;
    letter-spacing: 3px;
}
.pagination-panel .item .line {
    width: 100px;
    height: 3px;
    background-color: #6a6a6a;
    display: none;
    margin:0 0 0 20px;
    vertical-align: text-top;
    position: relative;
    top: -17px;
}
.pagination-panel .active .link {
    transform: translateX(10px);
    opacity: 0;
    padding: 0;
}
.pagination-panel .active .link:after {
    width: 0;
}
.pagination-panel .active .text {
    max-width: 4000px;
    opacity: 1;
}
.pagination-panel .active .text p {
    transform: translateX(0);
    padding-right: 10px;
}
.pagination-panel .active .link,
.pagination-panel .active .text p {
    transition: all 0.5s;
}
.pagination-panel .active .line {
    display: inline-block;
}
/*endregion*/

/*region MEDIA BOTHSIDED*/
/* XS */
@media (max-width: 559px) {
    .section-stat .icon-cont{
        min-height: unset;
    }
    .section {
        margin-bottom: 50px;
    }
    .section .cont {
        margin: 0 5%;
    }
    .section-present {
        height: 570px;
        margin-bottom: 100px;
    }
    .section-present .h1 {
        font-size: 32px;
    }
    .section-present .logo {
        width: 35px;
        height: 35px;
        right: 15px;
        top: 50px;
        left: initial;
    }
    .section-present .ham {
        left: 20px;
        right: initial;
        bottom: 15px;
    }
    .path-cont {
        height: 110px;
        bottom: -55px;
    }
    .section-h2 {
        margin-bottom: 85px;
    }
    .section-h2 .h2 {
        font-size: 22px;
        color: #fff;
    }
    .section-chart .slide{
        gap: 0;
    }
    .section-chart .canvas-cont {
        margin: 0 10%;
    }
    .section-chart .num{
        font-size: 26px;
    }
    .section-chart .notice{
        font-size: 14px;
    }
    .section-chart .flex-cont {
        margin-bottom: 30px;
    }
    .section-chart .col {}
    .section-chart .title-cont {
        text-align: center;
        margin-bottom: 20px;
    }
    .section-chart.slider-align-text .col.text-right{
        text-align: center;
        margin-bottom: 10px;
    }
    .section-chart .text {
        margin-bottom: 20px;
        text-align: center;
    }
    .section-chart .col-1 {
        width: 100%;
        padding: 0 30px;
    }
    .section-chart .col-2 {
        width: 100%;
        order: 3;
    }
    .section-chart .col-3 {
        width: 100%;
        padding: 0 30px;
        order: 2;
    }
    .section-chart .owl-dot {
        width: 45px;
        margin-bottom: 30px;
    }
    .section-chart .chart-nocircle-title{
        padding-bottom: 70px;
    }
    .section-chart-nocircle.flex-cont{
        margin-bottom: 75px;
    }
    .section-mosaic-text .col {
        width: 100%;
    }
    .section-mosaic-text .text-cont {
        margin-bottom: 30px;
    }
    .section-mosaic-text .text {
        margin-bottom: 30px;
    }

    .mosaic-cont .cell {
        height: 270px;
        width: 100%;
        margin-bottom: 270px;
    }
    .mosaic-cont.onScreen .slide {
        transform: translateY(100%);
    }
    .mosaic-cont.mosaic-cont-v .cell{
        width: 100%;
        margin-bottom: 290px;
    }
    .section-stat .cols-cont {
        margin-bottom: 30px;
    }
    .section-stat .col50 {
        float: none;
        width: 100%;
    }
    .section-stat .title-cont {
        margin-bottom: 20px;
        text-align: center;
    }
    .section-stat .text {
        text-align: center;
    }
    .cifrovizaciya-theme .section-stat .item,
    .section-stat .item {
        width: 100%;
        float: none;
    }
    .section-stat .item:nth-child(3n+1) {
        transition-delay: 0s;
    }
    .section-stat .item:nth-child(3n+2) {
        transition-delay: 0s;
    }
    .section-stat .item:nth-child(3n+3) {
        transition-delay: 0s;
    }

    .section-slider {
        margin-bottom: 90px;
    }
    .section-slider .photo {
        height: 265px;
    }

    .section-multy-chart .col {
        width: 100%;
    }
    .section-multy-chart .col-1 {
        order: 1;
    }
    .section-multy-chart .col-2 {
        margin-bottom: 30px;
    }
    .section-multy-chart .title-cont {
        text-align: center;
        margin-bottom: 10px;
    }
    .section-multy-chart .text {
        text-align: center;
        margin-bottom: 30px;
    }
    .section-multy-chart .chart-l1-cont {
        width: 270px;
    }
    .section-multy-chart .col-2 {
        padding-left: 0;
    }
    .section-multy-chart .label {
        top: 9px;
    }
    .section-mosaic-text .col-text-left {
        padding-right: 0;
    }
    .section-mosaic-text .col-text-right {
        padding-left: 0;
    }
    .section-mosaic-text .col-text-additional{
        width: 100%;
        text-align: center;
        padding-top: 50px;
    }
    .section-mosaic-text .col-text-additional > .title-cont{
        width: 100%;
        padding: 0;
        font-size: 20px;
    }
    .section-info .bg-text {
        font-size: 55px;
    }
    .section-info .bg-text.small {
        font-size: 80px;
    }
    .section-info .bg-title {
        font-size: 20px;
    }
    .section-info .text {
        margin-bottom: 20px;
    }

    .section-nav {
        margin-left: 0;
    }
    .canv-line-chart {
        margin-bottom: 80px;
    }

    .timeline-cont {
        margin-left: 30px;
    }
    .timeline-cont .item {
        padding: 0 10px 25px 40px;
        width: 100%;
        max-width: 260px;
    }
    .timeline-cont .item:before {
        top: 20px;
        left: 0;
    }
    .timeline-cont .item:after {
        width: 1px;
        height: 100%;
        top: 35px;
        left: 7px;
    }

    .cols-cont .col50 {
        width: 100%;
        float: none;
    }
    .cols-cont .title-cont {
        margin-bottom: 20px;
    }

    .slider-short-cont .item {
        width: 100%;
        float: none;
        margin-bottom: 30px;
    }

    .section-lmosaic {}
    .section-lmosaic .flex-cont {
        margin-bottom: 60px;
    }
    .section-lmosaic .col {
        width: 100%;
    }
    .section-lmosaic .col-1 {
        order: 1;
    }
    .section-lmosaic .col-2 {
        padding: 0 20px;
        order: 2;
    }
    .section-lmosaic .photo {
        margin-bottom: 25px;
    }
    .section-lmosaic .photo:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 20px;
        border: 13px solid transparent;
        border-bottom: 13px solid #fff;
    }
    .section-lmosaic .title {
        margin-bottom: 10px;
    }
    .section-lmosaic .text {
        font-size: 13px;
        font-weight: 300;
        line-height: 24px;
        margin-bottom: 20px;
    }

    .section-doughnut-chart .canvas-wrp {
        width: 268px;
    }
    .section-doughnut-chart .text {
        text-align: center;
    }

    .section-bars .legend {
        font-size: 12px;
    }
    .section-bars .value {
        font-size: 14px;
    }


    section.naprav a {
        height: 250px;
        font-size: 30px;
    }
    section.naprav a > span > span sup {
        font-size: 16px;
        padding: 0;
        display: block;
    }

    .naprav .close {
        width: 40px;
        height: 40px;
        background-size: cover;
    }

}
@media (max-width: 375px) {
    .section-chart .slide {
        height: 180px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}
/* SM */
@media (min-width: 560px) and (max-width: 729px) {
    .section {
        margin-bottom: 90px;
    }

    .section-present .logo {
        width: 35px;
        height: 35px;
        right: 20px;
        top: 50px;
        left: initial;
    }
    .section-present .ham {
        left: 15px;
        right: initial;
        bottom: 15px;
    }
    .section-present .path-cont {
        height: 130px;
        bottom: -65px;
    }

    .section .cont {
        margin: 0 5%;
    }

    .section-chart .title-cont {
        margin-bottom: 20px;
        text-align: left;
    }
    .section-chart .text {
        margin-bottom: 20px;
    }
    .section-chart .col-1 {
        width: 100%;
        padding: 0 30px;
    }
    .section-chart .col-2 {
        width: 100%;
        order: 3;
    }
    .section-chart .col-3 {
        width: 100%;
        padding: 0 30px;
        order: 2;
    }
    .section-chart .canvas-cont {
        margin: 0 20%;
    }
    .section-chart .num{
        font-size: 26px;
    }
    .section-chart .notice{
        font-size: 12px;
    }
    .section-chart .owl-dot {
        width: 75px;
    }
    .section-chart.slider-align-text .col.text-right,
    .section-chart.slider-align-text .title-cont{
        text-align: center;
        margin-bottom: 10px;
    }
    .section-chart .chart-nocircle-title{
        padding-bottom: 70px;
    }
    .section-chart-nocircle.flex-cont{
        margin-bottom: 75px;
    }
    .section-mosaic-text .text-cont {
        margin-bottom: 30px;
    }
    .section-mosaic-text .text {
        margin-bottom: 30px;
    }
    .section-mosaic-text .col {
        width: 100%;
    }
    .section-mosaic-text .col-text-left {
        padding-right: 0;
    }
    .section-mosaic-text .col-text-right {
        padding-left: 0;
        margin-top: 30px;
    }

    .mosaic-cont .cell {
        width: 50%;
        height: 240px;
    }
    .mosaic-cont .cell:nth-child(2n+1) {
        margin-right: 50%;
    }
    .mosaic-cont.onScreen .cell:nth-child(2n+1) .slide {
        transform: translateX(100%);
    }
    .mosaic-cont .cell:nth-child(2n+2) {
        margin-left: 50%;
    }
    .mosaic-cont.onScreen .cell:nth-child(2n+2) .slide {
        transform: translateX(-100%);
    }
    .mosaic-cont.mosaic-cont-v .cell{
        width: 50%;
    }
    .section-stat .cols-cont {
        margin-bottom: 40px;
    }
    .section-stat .title-cont {
        margin-bottom: 20px;
    }
    .section-stat .col50 {
        float: none;
        width: 100%; }
    .section-stat .item {
        padding: 0 15px;
    }

    .section-nav .prev .caption {
        margin-left: 18%;
    }
    .section-nav .next .caption {
        margin-right: 18%;
    }

    .section-multy-chart .col {
        width: 100%;
    }
    .section-multy-chart .col-1 {
        order: 1;
    }
    .section-multy-chart .col-2 {
        padding-left: 0;
    }
    .section-multy-chart .title-cont {
        margin-bottom: 10px;
    }
    .section-multy-chart .text {
        margin-bottom: 30px;
    }
    .section-multy-chart .chart-l1-cont {
        width: 410px;
    }

    .section-info .bg-text {
        font-size: 110px;
    }
    .section-info .bg-text.small {
        font-size: 126px;
    }
    .section-info .bg-title {
        font-size: 35px;
    }
    .section-info .text {
        margin-bottom: 20px;
        text-align: center;
    }

    .section-nav {
        margin-left: 0;
    }
    .timeline-cont {
        margin-left: 30px;
    }
    .timeline-cont .item {
        padding: 0 10px 25px 40px;
        width: 100%;
        max-width: 280px;
    }
    .timeline-cont .item:before {
        top: 20px;
        left: 0;
    }
    .timeline-cont .item:after {
        width: 1px;
        height: 100%;
        top: 35px;
        left: 7px;
    }

    .cols-cont .col50 {
        width: 100%;
        float: none;
    }
    .cols-cont .title-cont {
        margin-bottom: 20px;
    }

    .section-lmosaic {}
    .section-lmosaic .flex-cont {
        margin-bottom: 60px;
    }
    .section-lmosaic .col {
        width: 100%;
    }
    .section-lmosaic .col-1 {
        order: 1;
    }
    .section-lmosaic .col-2 {
        padding: 0 40px;
        order: 2;
    }
    .section-lmosaic .photo {
        margin-bottom: 25px;
    }
    .section-lmosaic .photo:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 40px;
        border: 15px solid transparent;
        border-bottom: 15px solid #fff;
    }
    .section-lmosaic .title {
        margin-bottom: 10px;
    }
    .section-lmosaic .text {
        font-size: 13px;
        font-weight: 300;
        line-height: 24px;
        margin-bottom: 20px;
    }

    section.naprav a {
        height: 250px;
        font-size: 30px;
    }
    section.naprav a > span > span sup {
        font-size: 16px;
        padding: 0;
        display: block;
    }
    .naprav .close {
        width: 40px;
        height: 40px;
        background-size: cover;
    }

}

@media (min-width: 560px) and (max-width: 989px) {
    .section-chart2 .text {
        text-align: center;
    }
}

/* MD */
@media (min-width: 730px) and (max-width: 989px) {
    .section .cont {
        margin: 0 75px 0 75px;
    }
    .section-present .logo {
        width: 35px;
        height: 35px;
        top: 70px;
        left: 15px;
    }
    .section-present .ham {
        left: 15px;
        bottom: 20px;
    }
    .section-present .path-cont {
        height: 130px;
        bottom: -65px;
    }
    .section-present .text {
        width: 600px;
        display: inline-block;
    }
    .section-h2 {
        margin-bottom: 160px;
    }

    .section-chart .col {
        align-self: flex-start;
    }
    .section-chart .col-1 {
        width: 50%;
        padding: 0 15px;
    }
    .section-chart .col-2 {
        width: 100%;
        order: 3;
        margin-top:20px;
    }
    .section-chart .col-3 {
        width: 50%;
        padding: 0 15px;
        order: 2;
    }
    .section-chart .canvas-cont {
        margin: 0 20%;
    }
    .section-chart .owl-dot {
        width: 80px;
    }
    .section-chart-nocircle.flex-cont{
        margin-bottom: 100px;
    }
    .section-chart .chart-nocircle-title{
        width: 100%;
        padding-bottom: 50px;
    }
    .mosaic-cont .cell {
        width: 50%;
        height: 280px;
    }
    .mosaic-cont .cell:nth-child(2n+1) {
        margin-right: 50%;
    }
    .mosaic-cont.onScreen .cell:nth-child(2n+1) .slide {
        transform: translateX(100%);
    }
    .mosaic-cont .cell:nth-child(2n+2) {
        margin-left: 50%;
    }
    .mosaic-cont.onScreen .cell:nth-child(2n+2) .slide {
        transform: translateX(-100%);
    }
    .mosaic-cont.mosaic-cont-v .cell{
        width: 50%;
    }
    .section-mosaic-text .col {
        width: 100%;
    }
    .section-mosaic-text .title-cont {
        margin-bottom: 10px;
        width: 50%;
        float: left;
        padding-right: 50px;
    }
    .section-mosaic-text .text {
        margin-bottom: 30px;
        width: 50%;
        float: right;
    }
    .section-mosaic-text .col-text {
        margin-bottom: 40px;
    }
    .section-mosaic-text .col-text-left {
        padding-right: 0;
    }
    .section-mosaic-text .col-text-right {
        padding-left: 0;
        margin-top: 30px;
    }

    .section-stat .item {
        padding: 0 15px;
    }

    .section-nav {
        margin-left: 60px;
    }
    .section-nav .prev .caption {
        margin-left: 15%;
    }
    .section-nav .next .caption {
        margin-right: 15%;
    }

    .section-multy-chart .col {
        width: 100%;
    }
    .section-multy-chart .col-1 {
        order: 1;
    }
    .section-multy-chart .col-2 {
        padding-left: 0;
    }
    .section-multy-chart .title-cont {
        width: 50%;
        float: left;
        padding-right: 50px;
    }
    .section-multy-chart .text {
        width: 50%;
        float: right;
    }
    .section-multy-chart .chart-l1-cont {
        width: 410px;
    }
    .section-multy-chart .col-2 {
        margin-bottom: 30px;
    }
    .section-multy-chart .title-cont {
        margin-bottom: 0;
    }

    .section-info {
        margin-bottom: 90px;
    }
    .section-info .bg-text {
        font-size: 130px;
    }
    .section-info .bg-title {
        font-size: 40px;
    }
    .section-info .text {
        margin-bottom: 20px;
        text-align: center;
    }

    .timeline-cont .item {
        padding: 35px 10px 45px 0;
        width: 33%;
    }
    .timeline-cont .item:nth-child(5n+1) {
        margin-left:33%;
    }
    .timeline-cont .item:nth-child(5n+1):after {
        left:-33%;
        width: 133%;
    }

    .fixed-nav {
        width: 60px;
        left: -60px;
    }
    .fixed-nav .logo {
        width: 40px;
        height: 40px;
    }

    .section-lmosaic {}
    .section-lmosaic .flex-cont {
        margin-bottom: 60px;
    }
    .section-lmosaic .col {
        width: 100%;
    }
    .section-lmosaic .col-1 {
        order: 1;
    }
    .section-lmosaic .col-2 {
        padding: 0 40px;
        order: 2;
    }
    .section-lmosaic .photo {
        margin-bottom: 25px;
    }
    .section-lmosaic .photo:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 40px;
        border: 20px solid transparent;
        border-bottom: 20px solid #fff;
    }
    .section-lmosaic .title {
        margin-bottom: 10px;
    }
    .section-lmosaic .text {
        font-size: 13px;
        font-weight: 300;
        line-height: 24px;
        margin-bottom: 20px;
    }
}

/* LG */
@media (min-width: 990px) and (max-width: 1169px) {

    .section-present .text {
        width: 800px;
        display: inline-block;
    }

    .section-chart .col-1 {
        width: 29%;
    }
    .section-chart .col-2 {
        width: 42%;
    }
    .section-chart .col-3 {
        width: 29%;
    }

    .mosaic-cont .cell {
        height: 175px;
    }
    .mosaic-cont .cell:nth-child(4n+1),
    .mosaic-cont .cell:nth-child(4n+2) {
        margin-right: 25%;
    }
    .mosaic-cont.mosaic-cont-v .cell:nth-child(4n+1),
    .mosaic-cont.mosaic-cont-v .cell:nth-child(4n+2) {
        margin-right: 33.33%;
    }
    .mosaic-cont.onScreen .cell:nth-child(4n+1) .slide,
    .mosaic-cont.onScreen .cell:nth-child(4n+2) .slide {
        transform: translateX(100%);
    }

    .mosaic-cont .cell:nth-child(4n+3),
    .mosaic-cont .cell:nth-child(4n+4) {
        margin-left: 25%;
    }
    .mosaic-cont.mosaic-cont-v .cell:nth-child(4n+3),
    .mosaic-cont.mosaic-cont-v .cell:nth-child(4n+4) {
        margin-left: 33.33%;
    }
    .mosaic-cont.onScreen .cell:nth-child(4n+3) .slide,
    .mosaic-cont.onScreen .cell:nth-child(4n+4) .slide {
        transform: translateX(-100%);
    }

    .mosaic-cont.mosaic-cont-v .cell.cell-v:nth-child(4n+2){
        margin-right: 0;
    }
    .mosaic-cont.mosaic-cont-v.onScreen .cell.cell-v:nth-child(4n+2) .slide{
        transform: translateY(100%);
    }
    .section-mosaic-text .mosaic-cont .cell {
        width: 50%;
    }
    .section-mosaic-text .mosaic-cont .slide {
        width: 100%;
    }
    .section-mosaic-text .mosaic-cont .cell:nth-child(2n+1) {
        margin-right: 50%;
    }
    .section-mosaic-text .mosaic-cont.onScreen .cell:nth-child(2n+1) .slide {
        transform: translateX(100%);
    }
    .section-mosaic-text .mosaic-cont .cell:nth-child(2n+2) {
        margin-left: 50%;
    }
    .section-mosaic-text .mosaic-cont.onScreen .cell:nth-child(2n+2) .slide {
        transform: translateX(-100%);
    }

    .section-nav {
        margin-left: 80px;
    }
    .section-nav .prev .caption {
        margin-left: 15%;
    }
    .section-nav .next .caption {
        margin-right: 15%;
    }

    .section-multy-chart {
        margin-bottom: 130px;
    }
    .section-multy-chart .chart-l1-cont {
        width: 340px;
    }
    .section-multy-chart .label {
        top: 13px;
    }

    .section-info {
        margin-bottom: 130px;
    }
    .section-info .bg-text {
        font-size: 180px;
    }
    .section-info .bg-title {
        font-size: 50px;
    }
    .section-info .text {
        margin-bottom: 40px;
        text-align: center;
    }

    .section-slider .title:hover {
        text-decoration: underline;
    }

    .timeline-cont .item:nth-child(6n+1) {
        margin-left:25%;
    }
    .timeline-cont .item:nth-child(6n+1):after {
        left:-25%;
        width: 125%;
    }

    .fixed-nav {width: 80px; left: -80px;}
    .fixed-nav .pagination-panel {
        transform: rotate(-90deg) translate(-50%,-27%);
    }

    .section-lmosaic {}
    .section-lmosaic .flex-cont {
        margin-bottom: 60px;
    }
    .section-lmosaic .col {
        width: 100%;
    }
    .section-lmosaic .col-1 {
        order: 1;
    }
    .section-lmosaic .col-2 {
        padding: 0 60px;
        order: 2;
    }
    .section-lmosaic .photo {
        margin-bottom: 25px;
    }
    .section-lmosaic .photo:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 60px;
        border: 30px solid transparent;
        border-bottom: 30px solid #fff;
    }
    .section-lmosaic .title {
        margin-bottom: 10px;
    }
    .section-lmosaic .text {
        font-size: 13px;
        font-weight: 300;
        line-height: 24px;
        margin-bottom: 30px;
    }
    .section-lmosaic .site:hover {
        border: 0;
    }
    .section .cont{
        margin: 0 75px 0 95px;
    }
}

/* XL */
@media (min-width: 1170px) {
    .section-present .text {
        width: 800px;
        display: inline-block;
    }

    .mosaic-cont .cell:nth-child(4n+1),
    .mosaic-cont .cell:nth-child(4n+2) {
        margin-right: 25%;
    }
    .mosaic-cont.mosaic-cont-v  .cell:nth-child(4n+1){
        margin-right: 33.33%;
    }
    .mosaic-cont.mosaic-cont-v  .cell:nth-child(4n+3){
        margin-left: 33.33%;
    }
    .mosaic-cont.onScreen .cell:nth-child(4n+1) .slide,
    .mosaic-cont.onScreen .cell:nth-child(4n+2) .slide {
        transform: translateX(100%);
    }

    .mosaic-cont .cell:nth-child(4n+3),
    .mosaic-cont .cell:nth-child(4n+4) {
        margin-left: 25%;
    }
    .mosaic-cont.onScreen .cell:nth-child(4n+3) .slide,
    .mosaic-cont.onScreen .cell:nth-child(4n+4) .slide {
        transform: translateX(-100%);
    }
    .mosaic-cont.onScreen .cell.cell-v .slide{
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%);
    }
    .mosaic-cont .cell.cell-v{
        margin: 0;
    }
    .section-mosaic-text .mosaic-cont .cell {
        width: 50%;
    }
    .section-mosaic-text .mosaic-cont .slide {
        width: 100%;
    }
    .section-mosaic-text .mosaic-cont .cell:nth-child(2n+1) {
        margin-right: 50%;
    }
    .section-mosaic-text .mosaic-cont.onScreen .cell:nth-child(2n+1) .slide {
        transform: translateX(100%);
    }
    .section-mosaic-text .mosaic-cont .cell:nth-child(2n+2) {
        margin-left: 50%;
    }
    .section-mosaic-text .mosaic-cont.onScreen .cell:nth-child(2n+2) .slide {
        transform: translateX(-100%);
    }

    .section-slider a.title:hover {
        text-decoration: underline;
    }

    .timeline-cont .item:nth-child(6n+1) {
        margin-left:25%;
    }
    .timeline-cont .item:nth-child(6n+1):after {
        left: -25%;
        width: 125%;
    }

    .section-lmosaic {}
    .section-lmosaic .col {
        width: 50%;
    }
    .section-lmosaic .col-1 {}
    .section-lmosaic .col-2 {
        align-self: center;
    }
    .section-lmosaic .pt .col-2 {
        padding-left: 70px;
    }
    .section-lmosaic .tp .col-2 {
        padding-right: 70px;
    }
    .section-lmosaic .pt .photo:after {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        border: 30px solid transparent;
        border-right: 30px solid #fff;
    }
    .section-lmosaic .tp .photo:after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        border: 30px solid transparent;
        border-left: 30px solid #fff;
    }
    .section-lmosaic .title {
        margin-bottom: 20px;
    }
    .section-lmosaic .text {
        margin-bottom: 30px;
    }
    .section-lmosaic .site:hover {
        border: 0;
    }


    /* menu */
    .header-cont {
        height: 50px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .header-m-main-menu-wrp {
        flex-basis: 10%;
        max-width: 10%;
    }
    .header-main-menu-wrp {
        flex-basis: 80%;
        max-width: 80%;
    }
    .header-m-menu {
        display: none;
    }
    .header-logo {
        margin-top: 12px;
        margin-left: 50px;
    }
    .header-menu-caption {
        /* margin-top:4px;
        line-height: 42px;  */
        display: none;
    }
    .header-container {
        /* width: 1170px; */
    }
    .header-main-menu {
        display: block;
    }
    .header-main-menu-ul {
        text-align: center;
    }
    .header-main-menu > ul > li {
        display: inline-block;
        margin-left:50px;
        line-height: 45px;
    }
    .header-main-menu > ul > li > a {
        font-weight: normal;
        line-height: 50px;
    }
    /* menu end */
}
/*endregion*/

/*region SECTION MAP*/
.map-wrapper{
    position: relative;
    width: 100%;
    height: 450px;
    overflow: hidden;
}
.map-wrapper img{
    position: absolute;
    width: 100%;
    object-fit: contain;
    object-position: center;
}
/*endregion*/

.hide {
    display: none;
}
.show {
    display: block;
}

/*region MOSAIC NEW*/
@media (max-width: 989px) {
    .mosiac-flex .mosaic-header .col,
    .mosiac-flex.section-mosaic-text .mosaic-header .text {
        width: 100%;
    }
}
@media (max-width: 559px) {
    .mosiac-flex .mosaic-cont .cell {
        margin-bottom: 270px;
    }
    .mosaic-cont .descr{
        font-size: 18px;
    }
}
/*endregion*/

.slider-short-cont .item {
    width: 50%;
    float: left;
    margin:0;
    padding: 0 10px;
}
.animated-chart{
    height: 500px;
}
.chart-text-hidden,
.circle-chart-hidden{
    display: none;
}
.section-chart .owl-dot.active span{
    background-color: #c17be1;
}
.youth-theme .section-chart .owl-dot.active span{
    background-color: #cf497f;
}
.mark-important::before{
    content: "*";
    color: red;
}
.text-chartname{
    padding-top: 50px;
    text-align: center;
}
.text-offset-left{
    padding-left: 10px;
}

/*region MEDIA MAXWIDTH*/
@media (max-width: 1024px){
    .mosaic-cont .v-center{
        padding: 0 5px;
    }
    .section-chart .title-no-padding{
        padding: 0;
        text-align: left;
    }
    .title-no-padding .title-cont{
        text-align: left;
    }
    .mosaic-cont .num{
        font-size: 30px;
    }
    .mosaic-cont .descr{
        font-size: 16px;
    }
}
@media (max-width: 1010px) {
    .demography-theme .slider-container .photo-cont {
        margin-bottom: 200px;
    }
}
@media(max-width: 1169px){
    .timeline__item--name,
    .timeline__item--place{
        max-width: 250px;
    }
}
@media(max-width: 989px){
    /*region SECTION MOOR*/
    .section-moor{
        margin-bottom: 100px;
    }
    .section-moor__info--title{
        font-size: 38px;
    }
    .section-moor__info--regalia{
        font-size: 16px;
    }
    .section-moor__info--text{
        font-size: 18px;
    }
    .section-moor__image--background{
        max-width: 300px;
        max-height: 300px;
    }
    .section-moor__image-wrapper{
        max-height: 338px;
    }
    /*endregion*/

    .section-h2 .h2.section-h2-smallfont{
        font-size: 26px;
    }
    .section-mosaic-text .col-text-additional{
        width: 100%;
        text-align: center;
    }
    .section-mosaic-text .col-text-additional > .title-cont{
        width: 100%;
        padding: 0;
    }
    .section .text.block-text-extended{
        font-size: 18px;
    }
    .map-wrapper img{
        width: 120%;
    }
    .section-chart.slider-centered-text .flex-cont{
        justify-content: center;
    }
    .section-chart.slider-centered-text .title-cont{
        text-align: center;
    }
    
    .timeline__items > .timeline__item-wrapper:nth-child(4),
    .timeline__items > .timeline__item-wrapper:nth-child(10),
    .timeline__item-wrapper{
        flex: 0 0 50%;
    }
    .cifrovizaciya-theme .section-chart2 .flex-cont {
        flex-direction: column-reverse;
    }
    .cifrovizaciya-theme .section-chart2 .flex-cont .col-3 {
        margin: auto;
        padding-top: 20px;
    }
}
@media (max-width: 768px){
    .section-stat .col-stat-extended{
        width: 60%;
        margin: auto;
    }
    .section-nav .caption{
        font-size: 20px;
    }
}
@media (max-width: 750px) {
    .demography-theme .slider-container .photo-cont {
        width: 180px;
        height: 180px;
    }
}

@media (max-width: 729px){
    .cifrovizaciya-theme .section-timeline .text {
        text-align: left;
    }
}

@media (min-width: 560px) and (max-width: 729px) {
    .cifrovizaciya-theme .section-stat .cols-cont {
        text-align: center;
    }
}

@media(max-width: 660px){
    .section-moor{
        flex-direction: column-reverse;
        gap: 30px;
    }
    .section-moor__image-wrapper{
        height: 400px;
        flex: unset;
    }
    .section-moor__info{
        flex: unset;
        gap: unset;
    }
    .section-h2 .h2.section-h2-smallfont{
        font-size: 22px;
    }
    .section-stat .descr{
        font-size: 14px;
    }
    .section .text.block-text-extended{
        font-size: 16px;
    }
    .section-nav .caption{
        font-size: 18px;
    }
    .section-nav .prev .caption{
        margin-left: 15%;
    }
    .section-nav .next .caption{
        margin-right: 15%;
    }
    .map-wrapper img{
        width: 150%;
    }
    .section-chart .flex-cont.section-chart-nocircle{
        margin-bottom: 95px;
    }
}
@media(max-width: 655px){
    .timeline__items{
        display: grid;
        grid-template-columns: 1fr;
        --between-blocks: 25px;
        gap: var(--between-blocks) 0;
    }
    .timeline__item-wrapper{
        display: flex;
        flex-direction: column;
        --line-col: 15px;
        --col-gap: 25px;
        --offset: calc(var(--line-col) + var(--col-gap));
        --image-height: 250px;
    }
    .timeline__item{
        display: grid;
        padding-top: 25px;
        grid-template-columns: var(--line-col) 1fr;
        grid-column-gap: var(--col-gap);
        grid-template-areas:
            "a b"
            "a c"
            "a d"
            "a e"
    }
    .timeline__item--numbers{
        min-height: unset;
    }
    .timeline__item--link{
        grid-area: a;
        height: unset;
        align-items: start;
    }
    .timeline__item--link-line{
        width: 1px;
        height: calc(100% + calc(var(--between-blocks) * 2 + var(--image-height)));
        left: 7px;
    }
    .timeline__item--link-point{
        margin-top: 30px;
    }
    .timeline__item--title{
        grid-area: b;
        padding-top: 25px;
    }
    .timeline__item--numbers{
        grid-area: c;
    }
    .timeline__item--name{
        grid-area: d;
    }
    .timeline__item--place{
        grid-area: e;
    }
    .timeline__item--image-wrapper{
        width: calc(100% - var(--offset));
        height: var(--image-height);
        align-self: flex-end;
    }
}
@media(max-width: 559px) {
    .work__results .cols-cont{
        padding-bottom: 30px;
    }
    .slider__fix.section-chart .chart-nocircle-title {
        padding-bottom: 120px;
    }
    .cifrovizaciya-theme .section-chart .active .num {
        font-size: 60px;
    }
}
@media(max-width: 425px){
    .section-chart .slider-fontreduced .slide{
        height: 190px;
    }
    .map-wrapper{
        height: 305px;
    }
    .map-wrapper img{
        width: 155%;
    }
}
@media(max-width: 390px){
    .section-moor{
        margin-bottom: 60px;
    }
    .section-moor__image-wrapper{
        height: 225px;
    }
    .section-moor__image--background{
        max-width: 200px;
        max-height: 200px;
    }
    .text-chartname{
        font-size: 12px;
        padding-top: 30px;
    }
    .section-nav .caption{
        font-size: 12px;
    }
}
@media (max-width: 370px) {
    .demography-theme .slider-container .photo-cont {
        margin-bottom: 250px;
    }
    .work__results .cols-cont{
        padding-bottom: 70px;
    }
    .slider__fix.section-chart .flex-cont.section-chart-nocircle {
        margin-bottom: 160px;
    }
    .slider__fix.section.section-chart .slide {
        height: 260px;
    }
    .map-wrapper img{
        width: 175%;
    }
}
@media (max-width: 320px){
    .culture-theme .slider-container .slide{
        max-height: 750px;
    }
    .section-h2 .h2.section-h2-smallfont{
        font-size: 20px;
    }
    .section-chart .num{
        font-size: 30px;
    }
    .section-chart .slide{
        height: 150px;
    }
}
/*endregion*/