/* Общие стили */
        * {
            margin: 0;
            padding: 0;
			/*width: 100%;*/
            box-sizing: border-box;
			/*overflow-x: hidden;*/
        }
		
		@font-face {
		font-family: WiGuru; /* Имя шрифта */
		src: url(../fonts/wiguru.ttf); /* Путь к файлу со шрифтом */
		}
		
		@font-face {
		font-family: Raleway; /* Имя шрифта */
		src: url(../fonts/Raleway.ttf); /* Путь к файлу со шрифтом */
		}
        
        body {
            font-family: 'Raleway', Arial, sans-serif;
			font-size: 16px;
			font-weight: 400;
			background-color: #59585E;
            color: #FFFFFF;
        }
		
		h2, h2 a{
			font-family: 'WiGuru', Arial, sans-serif;
            font-size: 54px;
            font-weight: 400;
            color: #E2A600;
            text-align: center;
            text-decoration: none;
		}
		
		h3, h3 a{
			font-family: 'WiGuru', Arial, sans-serif;
            font-size: 30px;
            font-weight: 400;
            color: #FFFFFF;
            text-decoration: none;
			margin-bottom: 20px;
			display: block;
		}
		
		h3 a:hover{
			color: #E2A600;
        }
		
		p{
			line-height: 1.6;
        }
		
		p a{
			color: #FFFFFF;
        }
				
		p a:hover{
			color: #E2A600;
        }
		
		/*Заголовки разделов*/
		.site-title {
            font-family: 'Impact', Arial, sans-serif;
            font-size: 80px;
            font-weight: 400;
            color: #FFFFFF;
        }
		
		.container {
			display: flex;
			flex-direction: column;
			min-height: 100vh; /* Вся высота окна */
            max-width: 1920px;
            margin: 0 auto;
        }
		
		/* Шапка сайта */
        .header-menu {
            height: 70px;
            width: 100%;
            background-color: #25242A;
            display: flex;
            justify-content: flex-end;
            align-items: center;
			position: fixed;
			top: 0;
			left: 0;
			z-index: 1000;
			box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
		}
        
        .menu-list {
            display: flex;
            list-style: none;
			gap: 60px;
			margin-right: 40px;
		}
        
        .menu-item a {
            font-family: 'WiGuru', Arial, sans-serif;
            font-size: 28px;
            font-weight: 400;
            color: #E2A600;
            text-decoration: none;
        }
		
		.menu-item a:hover {
            color: #FFFFFF;
        }
		
		/* Кнопка-гамбургер */
		.menu-toggle {
			display: none;
			font-size: 30px;
			color: #E2A600;
			background: none;
			border: none;
			cursor: pointer;
			margin-left: 20px;
		}
        
		.menu-divider {
            width: 100%;
            height: 1px;
            background-color: #FFFFFF;
        }
        
        .header-content {
            height: 180px;
            width: 100%;
            background-color: #25242A;
            display: flex;
			margin-top: 70px;
        }
        
        .header-left {
            width: 70%;
            display: flex;
            align-items: center;
            padding-left: 300px;
            position: relative;
        }
        
        .logo {
            /*width: 120px;*/
            height: 120px;
            margin-right: 44px;
        }
        
		.header-right {
            width: 30%;
            padding: 0px 0px 0 30px;
            position: relative;
            border-left: 1px solid #FFFFFF;
			display: flex;
			flex-direction: column;
			justify-content: center; /* горизонталь */
			/*align-items: center;     /* вертикаль */
        }
		        
        .header-text {
            font-size: 16px;
            /*font-weight: 400;*/
            color: #FFFFFF;
            /*margin-bottom: 15px;*/
        }
		        
        .header-link {
            font-size: 18px;
            font-weight: 400;
            color: #E2A600;
            text-decoration: none;
			margin-top: 15px;
        }
		
		/*Кнопка*/
		.start-button {
			display: inline-block;
			background-color: #E2A600;
			color: #25242A;
			font-family: 'Raleway', sans-serif;
			font-size: 18px;
			font-weight: 400;
			padding: 15px 30px;
			text-decoration: none;
			margin-top: 30px;
			width: 220px;
			height: 60px;
			text-align: center;
			line-height: 30px;
			border-radius: 4px;
		}
		
		
		/* Карта */
		.map-section {
            height: auto; /*1030px;*/
            background-color: #59585E;
            padding-top: 60px;
			margin-bottom: 30px; 
        }
		
		.map-section h2{
            margin-bottom: 50px;
        }
        
        .map-container {
            display: flex;
            justify-content: center;
            gap: 40px;
        }
		
		.map-wrapper {
            max-width: 100%;
            height: auto;
            position: relative;
        }
		
		.map {
            width: 800px;
			height: 800px;
			margin-top: -60px;
        }
		
		g {
			transform: scale(0.8);
		}
        
        .districts-list {
            width: 18%;
            list-style: none;
        }
        
        .district-item {
            margin-bottom: 12px;
        }
        
        .district-item a {
            font-size: 16px;
            font-weight: 400;
            color: #FFFFFF;
            text-decoration: none;
        }
        
        .district-item a {
            text-decoration: none;
            color: #FFFFFF;
            transition: color 0.3s;
        }
        
        .district-item a:hover, 
        .district-item a.highlighted {
            color: #E2A600;
            font-weight: bold;
        }
        
        .part {
            fill: #ffffff;
            stroke: #000000;
            transition: fill 0.3s;
        }
        
        .part:hover, 
        .part.highlighted {
            fill: #ffcccc;
            cursor: pointer;
        }
		
		/* Подсветка для районов на карте */
		.part.highlighted {
			fill: #E2A600 !important;
			/*stroke: #E2A600 !important;*/
			stroke-width: 2px !important;
		}

		/* Подсветка для ссылок в списке */
		.districts-list a.highlighted {
			color: #E2A600; 
			font-weight: bold;
			/*text-decoration: underline;
			background-color: #fff9e6;*/
		}
		
		.map-text {
			width: 75%;
			/*max-width: 1190px;
			/* text-align: center;*/
			margin: 0 auto; /* Центрируем текст */
			margin-top: 30px;
			margin-bottom: 20px;
		}
		
		/* Об изменении структуры... */
		.change-section {
			background-color: #59585E;
			padding: 60px 0;
			height: auto; 
		}
		
		.change-section h2{
            margin-bottom: 50px;
        }
		
		.change-section p{
			max-width: 80%;
			margin: 0 auto;
			margin-bottom: 20px;
		}
		
		.change-container {
			max-width: 80%;
			margin: 0 auto;
			/*display: flex;
			justify-content: space-around;
			align-items: flex-end;*/
			/*min-height: 300px; /* Добавляем минимальную высоту для наглядности */
		}
		
		.change-img-container {
			max-width: 80%;
			margin: 0 auto;
			display: flex;
			justify-content: space-around;
			align-items: flex-end;
			/*min-height: 300px; /* Добавляем минимальную высоту для наглядности */
		}
		
		.change-img-container img{ width: 140px; margin-right: 20px; }
		
		.change-item {
			width: 25%;
			text-align: center;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: flex-end;
		}
		
		/*.change-item img{
			display: flex;
			justify-content: space-around;
			align-items: flex-end;
		}*/
		
		.change-item p {
			max-width: 100%; 
			padding: 0;
			margin: 10px 0 0 0; 
			align-self: stretch;
			/*width: 140px; */
		}
		
		/*Конференции */
		.conferences-section, .conferences-section-inner {
			background-color: #25242A;
			padding: 60px 0;
			height: auto; /*620px;*/
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		
		.conferences-section h2, h2 a{
			margin-bottom: 50px;
		}

		.conferences-container {
			display: flex;
			justify-content: space-around;
			width: 90%;
			max-width: 1400px;
		}

		.conference-item {
			width: 30%;
			text-align: center;
		}

		.conference-item img {
			width: 100%;
			height: auto;
			max-height: 400px;
			object-fit: cover;
		}
		
		/* для страницы Конференции, отступ между строками*/
		.conferences-section-inner {
			background: none;
		}
		
		.conferences-indent {
			margin-bottom: 60px;
		}
		
		.conferences-section-inner h2, h2 a{
			margin-bottom: 50px;
		}
		
		.conferences-contant {
			width: 70%;
		}
		
		.conferences-contant p{
			margin-bottom: 20px;
		}
		
		/*Для внутренней страницы раздела Конференции*/
		.image-container {
			display: flex;
			justify-content: center; /* горизонтальное центрирование */
			align-items: center;     /* вертикальное центрирование */
			flex-wrap: wrap;         /* перенос строк при нехватке места */
			/*height: 300px;           /* границы блока */
		}
		.image-container img {
			max-width: 250px;
			margin: 0 10px 10px 0; /* отступы между картинками */
		}

		/* Параллакс */
		.parallax-section {
			height: 400px;
			overflow: hidden;
			position: relative;
		}

		.parallax-image {
			background-image: url('../img/ermitazh.jpg');
			height: 100vh;
			background-attachment: fixed;
			background-position: top center;
			background-repeat: no-repeat;
			background-size: cover;
		}
		
		.overlay {
		  position: absolute;
		  top: 0; left: 0; right: 0; bottom: 0;
		  background-color: rgba(0, 0, 0, 0.4); /* степень затемнения (0.5 = 50%) */
		  z-index: 1;
		}


		/* Геральдический урок */
		.lesson-section {
			background-color: #59585E;
			padding: 60px 0;
			height: auto; /*780px;*/
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 100%; /* Добавляем ширину */
		}
		
		.lesson-section h2{
			margin-bottom: 50px;
		}

		.lesson-container {
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 100%;
			max-width: 1200px; /* Ограничиваем максимальную ширину */
			margin: 0 auto;
			padding: 0 20px; /* Отступы по бокам */
			box-sizing: border-box;
		}
		
		/*Для страницы Видео*/
		.lesson-item-inner {
			width: 100%;
			max-width: 800px; /* Максимальная ширина элемента */
			margin-bottom: 50px; /* Увеличиваем отступ между элементами */
			text-align: center; /* Центрируем текст */
			}
			
		/*Для страницы Видео*/
		.lesson-item h3 {
			margin-bottom: 20px;
		}	

		.video-wrapper {
			margin-bottom: 15px;
		}
		
		.lesson-text {
			width: 90%;
			max-width: 1200px;
			text-align: center;
			margin: 0 auto; /* Центрируем текст */
		}

		/* Издания Горизонтальный скроллинг*/
		.books-section {
			background-color: #B88349;
			padding: 60px 0;
			height: auto; /*500px;*/
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			}

		.books-container {
			display: flex;
			align-items: center;
			justify-content: center; 
			width: 90%;
			max-width: 1500px;
			position: relative;
		}

		.books-content {
			display: flex;
			overflow-x: auto;
			scroll-behavior: smooth;
			-webkit-overflow-scrolling: touch;
			scrollbar-width: none;
			width: 100%;
			/*white-space: nowrap; /*1*/
			scroll-snap-type: x mandatory; /*1*/			
		}

		.books-content::-webkit-scrollbar {
			display: none;
		}

		.books-item {
			flex: 0 0 auto;
			width: 100%;
			display: flex;
			padding: 0 20px;
			display: inline-flex;  /*1*/
			/*gap: 15px;   /*1*/
		}

		.books-text {
			width: 50%;
			display: flex;
			flex-direction: column;
			justify-content: center;
			text-align: center;
			padding-right: 40px;
			
			scroll-snap-align: start; /*1*/
			min-width: 300px; /* Фиксированная ширина элементов */  /*1*/
			/*height: 200px;  /*1*/
			display: inline-flex;  /*1*/
		}

		.books-text h2 a {
			color: #FFFFFF;
			margin-bottom: 30px;
			text-align: center;
		}

		.books-text p {
			font-size: 30px;
			text-align: center;
		}

		.books-image {
			width: 50%;
		}

		.books-image img {
			width: 100%;
			height: auto;
			max-height: 500px;
			object-fit: cover;
		}

		.books-arrow {
			background: rgba(255, 255, 255, 0);
			border: none;
			color: white;
			/*font-size: 24px;
			padding: 10px 15px;*/
			cursor: pointer;
			border-radius: 50%;
			z-index: 1;
		}

		.books-arrow:hover {
			background: rgba(255, 255, 255, 0);
		}

		.left-arrow {
			margin-right: 20px;
		}

		.right-arrow {
			margin-left: 20px;
		}
		
		/*Издания внутренняя страница*/
		/*.books-section-inner {
			background-color: #59585E;
			padding: 60px 0;
			height: auto;
			display: none;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			gap: 10px;  
			width: 100%;
		}*/
		
		.books-section-inner {
			max-width: 80%;
			height: auto;
			background-color: #59585E;
			padding: 60px 0;
			margin: 0 auto;
			display: none;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			gap: 10px;
		}
		
		.books-section-inner.active {
			display: flex;
		}
		
		.books-section-inner h2{
			margin-bottom: 50px;
		}
		
		/*.books-container-inner {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center; 
			width: 70%;
			max-width: 1400px;
			margin: 0 auto;
		}*/
		
		.books-container-inner {
			max-width: 90%;
			margin: 0 auto;
			display: flex;
			flex-direction: column;
		}
				
		/*.books-item-inner {
			width: 100%;
			height: auto;
			padding: 0 20px;
			margin-bottom: 30px; 
			display: flex;
			justify-content: space-around;
			gap: 20px;
		}*/

		.books-item-inner {
			display: flex;
			justify-content: space-around;
			text-align: center;
			margin-bottom: 40px;
			gap: 20px;
		}
				
		.books-item-inner img{
			margin-right: 20px;
			width: 150px;
			/*align: left;*/
		}
						
		.books-col-img {
			width: 20%;
			margin-right: 20px;
		}
			
		.books-col-text {
			width: 80%;
			text-align: left;
		}
				
		.clear {
			clear: both;
		}

		/* Викторины на главной странице*/
		.quiz-section {
			background-color: #25242A;
			padding: 60px 0;
			height: auto; /*650px;*/
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		
		.quiz-section h2{
			margin-bottom: 50px;
		}
		
		.quiz-container {
			display: flex;
			justify-content: space-around;
			width: 90%;
			max-width: 1400px;
		}
		
		.quiz-block {
			text-align: center;
			width: 50%;
		}
		
		.quiz-block h3 {
			font-size: 40px;
			margin-bottom: 20px;
		}
		
		/* Викторины внутренние страницы*/
		.quiz-str-section {
			background-color: #59585E;
			padding: 60px 0;
			height: 500px;
			display: flex;
			flex-direction: column;
			align-items: center;
			flex: 1; /* Занимает оставшееся пространство */
		}
		
		.quiz-str-section h2{
			margin-bottom: 50px;
		}
		
		.quiz-str-container {
			width: 80%; 
			max-width: 1000px;
		}
		
		.quiz-str-item {
			align-items: left;
		}
		
		#vopr {
			font-size: 32px;
			margin-bottom: 20px;
		}
		
		#venice, #theend, #theend1  {
			font-size: 22px;
			margin-bottom: 20px;
			padding: 0 0 0 60px;
		}
		
		/* Скрываем оригинальную радиокнопку */
		.custom-radio input[type="radio"] {
		  display: none;
		}

		/* Стилизация span, который заменяет радиокнопку */
		.custom-radio span::before {
		  content: "";
		  display: inline-block;
		  vertical-align: middle;
		  width: 18px;
		  height: 18px;
		  margin-right: 10px;
		  border: 2px solid #555;
		  border-radius: 50%;
		  background-color: #fff;
		  box-sizing: border-box;
		  transition: 0.3s;
		}

		/* Когда radio выбран — меняем цвет внутри */
		.custom-radio input[type="radio"]:checked + span::before {
		  background-color: orange;
		  box-shadow: inset 0 0 0 5px white;
		  border-color: orange;
		}
		
		/* Интересные ссылки */
		.links-section {
			background-color: #59585E;
			padding: 60px 0;
			height: auto; /*655px;*/
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		
		.links-section h2{
			margin-bottom: 50px;
		}

		.links-container {
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 90%;
			max-width: 1400px;
		}

		.links-row {
			display: flex;
			justify-content: center;
			margin-bottom: 30px;
			width: 100%;
		}

		.link-banner {
			margin: 0 15px;
		}

		.link-banner img {
			width: 300px;
			height: 100px;
			object-fit: cover;
		}

		/* Подвал */
		.site-footer {
			background-color: #25242A;
			height: 100px;
			display: flex;
			align-items: center;
			padding-left: 50px;
		}

		.site-footer p {
			font-family: 'Raleway', sans-serif;
			font-size: 18px;
			font-weight: 400;
			color: #FFFFFF;
		}

		/* Кнопка "Наверх" */
		.back-to-top {
			position: fixed;
			bottom: 30px;
			right: 30px;
			width: 50px;
			height: 50px;
			background-color: rgba(226, 166, 0, 0.7);
			color: #25242A;
			text-align: center;
			line-height: 50px;
			font-size: 24px;
			text-decoration: none;
			border-radius: 4px;
			display: none;
			z-index: 1000;
		}

		.back-to-top:hover {
			background-color: rgba(226, 166, 0, 0.9);
		}
		
		.raion-section {
			max-width: 80%;
			background-color: #59585E;
			padding: 60px 0;
			height: auto; 
			margin: 0 auto;
		}
	
		.raion-section h2{
            margin-bottom: 50px;
        }
		
		.raion-container {
			max-width: 90%;
			margin: 0 auto;
			display: flex;
			flex-direction: column;
		}
		
		.raion-contant h3{
			margin-bottom: 10px;
		}
		
		.raion-contant h3 а{
			margin-bottom: 10px;
		}
		
		.raion-item {
			text-align: center;
			display: flex;
			justify-content: space-around;
			margin-bottom: 40px;
		}
		
		.raion-col-img {
			width: 20%;
			margin-right: 20px;
		}
			
		.raion-col-text {
			width: 80%;
			text-align: justify;
		}
		
		.raion-contant a{
			text-decoration: none;
		}
		
		.raion-contant a h3:hover{
			color: #E2A600;
        }
		
		.raion-col-text p{
			margin-bottom: 20px;
		}
		
		img.pict_gerb { width: 150px;} /*150px; 8vw;*/
		img.pict_flag { width: 230px;} /*230px; 12vw;*/
		
		.raion-img5 {
			max-width: 100%;
			margin: 0 auto;
			display: flex;
			justify-content: space-around;
			align-items: flex-end;
		}
		
		.raion-img5 img{ height: 180px; margin-right: 20px; }
		
		.raion-img3 {
			max-width: 60%;
			margin: 0 auto;
			display: flex;
			justify-content: space-around;
			align-items: flex-end;
		}
		
		.raion-img3 img{ height: 180px; margin-right: 20px; }
		
		
		/* Адаптивность */
        @media (max-width: 1600px) {
            .header-left {
                padding-left: 150px; /*200*/
            }
            
            .site-title {
                font-size: 75px; 
            }
			
			.map-container {
                gap: 30px;
            }
			
			.change-container {
				max-width: 90%;
			}
			
			.books-section-inner {
				max-width: 90%;
			}
			
			.raion-section {
				max-width: 90%;
			}
			
			img.pict_gerb { width: 150px;} 
			img.pict_flag { width: 180px;}
						
        }
        
        @media (max-width: 1280px) {
            .header-left {
                padding-left: 80px; /*120*/
            }
            
            .site-title {
                font-size: 64px; /*48*/
            }
			
			.menu-list {
				gap: 30px;
				font-size: 22px;
			}
			
			.logo {
				height: 90px;
			}
            
            .map-container {
                gap: 20px;
			}
			
			.map {
				width: 700px;
				height: 700px;
			}
			
			g {
				transform: scale(0.70);
			}
			
			h2, h2 a{
				font-size: 50px; 
			}
			
			h3 a {
				font-size: 26px; 
			}
			
			.change-container {
				max-width: 90%;
			}
			
			.change-container p{
				max-width: 90%;
			}
			
			.change-img-container {
				max-width: 90%;
			}
			
			.header-text {
				font-size: 14px;
			}
			
			.district-item a {
				font-size: 14px;
			}
			
			/*.books-container-inner {
				width: 80%;
			}*/
			
			.books-text p {
				font-size: 28px;
			}
			
			.lesson-text {
				width: 90%;
			}
			
			.link-banner img {
				width: 250px;
				height: 83px;
			}
			
			.books-section-inner {
				max-width: 100%;
			}
			
			.raion-section {
			max-width: 100%;
			}
			
			.raion-img5 img{ height: 130px; margin-right: 20px; }
			
			.raion-img3 img{ height: 130px; margin-right: 20px; }
			
		}
        
        @media (max-width: 1024px) {
            
			.header-left, .header-right {
				width: 100%;
				padding: 20px;
				flex-direction: column;
				border-left: none;
                text-align: center;
                justify-content: center;
			}
			
			.header-left img{
                margin-right: 0;
                margin-bottom: 20px;
            }
			
			.header-content {
				flex-direction: column;
				height: auto;
			}

			.menu-list {
				flex-wrap: wrap;
				gap: 20px;
				justify-content: center;
			}
			
			/*.menu-list {
                gap: 40px;
            }*/
			
			.map-container {
				flex-direction: column;
				align-items: center;
			}

			.map {
				width: 650px;
                height: 650px;
            }
			
			.change-container {
			max-width: 100%;
			}
			
			.change-container p{
			max-width: 100%;
			}
			
			.change-img-container {
			max-width: 100%;
			}

			.districts-list {
                width: 80%;
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                gap: 10px 30px;
                margin-bottom: 30px;
            }
			
            /*.site-title {
                font-size: 48px;
            }*/
            
			.menu-item a {
                font-size: 24px;
            }
			
            /*.map-wrapper {
                max-width: 550px;
				height: auto;
            }*/
            
            .section-title {
                font-size: 48px;
            }
			
			g {
			transform: scale(0.65);
			}
			
			.change-container {
				max-width: 90%;
			}
			
			/*.conferences-section {
				height: auto;
			}*/
			
			.conferences-container {
				flex-direction: column;
				align-items: center;
				width: 100%;
			}
    
			.conference-item {
				width: 80%;
				margin-bottom: 30px;
			}
			
			.lesson-section .section-title,
			.links-section .section-title a,
			.books-text h3 a {
				font-size: 36px;
			}
			
			.books-text p {
				font-size: 28px;
			}
			
			.video-wrapper iframe {
				max-width: 570px;
				height: 320px;
			}
			
			/*.lesson-text {
				width: 700px;
			}*/
			
			.books-item {
				flex-direction: column;
			}
			
			.books-text,
			.books-image {
				width: 100%;
			}
			
			.books-text {
				padding-right: 0;
				margin-bottom: 20px;
			}
			
			/*.books-container-inner {
				width: 90%;
			}*/
			
			.links-row {
				flex-wrap: wrap;
			}
			
			.link-banner {
				margin: 10px;
			}
			
			img.pict_flag { width: 150px;}
        }
        
        @media (max-width: 768px) {
			
			.menu-toggle {
				display: block;
				position: absolute;
				left: 10px;
				top: 20px;
				z-index: 1001;				
			}

			.menu-list {
				display: none;
				flex-direction: column;
				position: absolute;
				top: 70px;
				right: 0;
				background-color: #25242A;
				width: 100%;
				padding: 10px 0;
				z-index: 999;
			}
			
			.top-strip {
				width: 100%;
				height: 70px; /* или нужная высота */
				background-color: #25242A;
				position: fixed;
				top: 0;
				left: 0;
				z-index: 999;
			}

			.menu-list.active {
				display: flex;
			}
			
			.menu-item {
				text-align: center;
				margin: 10px 0;
			}
			
			.site-title {
				font-size: 48px;
			}

			.header-menu {
				height: auto;
				flex-wrap: wrap;
				justify-content: center;
				padding: 10px 0;
			}
			
			/*.menu-list {
				flex-direction: column;
				align-items: center;
				gap: 10px;
			}*/

			.logo {
				height: 70px;
			}
			
			.logo {
                margin-right: 0;
                margin-bottom: 20px;
            }

			.section-title {
				font-size: 40px;
			}
			
			h2, h2 a{
				font-size: 40px; 
			}
			
			h3, h3 a {
				font-size: 20px; 
			}

			.lesson-text {
				width: 90%;
			}
			
					
			.header-content {
                flex-direction: column;
                height: auto;
                padding: 30px 0;
            }
            
            .header-left, .header-right {
                width: 100%;
                padding: 20px;
                border-left: none;
                text-align: center;
                justify-content: center;
				flex-direction: column;
            }
            
            .header-left img{
                margin-right: 0;
                margin-bottom: 20px;
            }
            
           	.districts-list {
                width: 90%;
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                gap: 10px 30px;
                margin-bottom: 30px;
            }
            
            .map-wrapper, .map {
				width: 100%;
                max-width: 100%;
				
            }
			
			.map {
				height: 400px;
				align-items: center;
            }
			
			g {
			transform: scale(0.4);
			}
			
				
			.change-img-container {
				flex-direction: column;
				align-items: center;
			}
			
			.conferences-container,
			.quiz-container {
				flex-direction: column;
				align-items: center;
			}
			
			.conference-item,
			.quiz-block {
				width: 80%;
				margin-bottom: 40px;
			}
			
			.conference-item h3 a {
			font-size: 22px;
			}
			
			.conferences-indent {
				margin-bottom: 0px;
			}
			
			.lesson-section .section-title,
			.links-section .section-title a,
			.books-text h3 a {
				font-size: 30px;
			}
			
			/*.books-container-inner {
				width: 100%;
			}*/
			
			.books-text p {
				font-size: 24px;
			}
			
			.books-arrow img{
				width: 60px;
				height: 60px;
			}
			
			/*.books-item-inner {
				justify-content: center;
				flex-direction: column;
				width: 90%;
				max-width: 100%;
				margin: 0 auto;
				gap: 10px;
			}*/
			
			.books-item-inner {
				margin: 0 auto;
				display: flex;
				flex-direction: column;
				align-items: center;
			}
			
			
			/*.books-col-img {
				display: block;
				text-align: center;
				width: 90%;
				margin: 0 auto;
				max-width: 100%;
			}*/

			.books-col-img {
				width: 100%;
				margin-right: 0px;
				margin-top: 10px;
			}
			
			/*.books-col-text {
				width: 90%;
				margin: 0 auto;
				max-width: 100%;
			}*/
			
			.books-col-text {
				width: 100%;
			}
			
			.video-wrapper iframe {
				max-width: 470px;
				height: 264px;
			}
			
			.quiz-container {
			flex-direction: column;
			align-items: center;
			}
			
			.quiz-block {
				margin-bottom: 40px;
				width: 100%;
			}
						
			.quiz-block h3 {
				font-size: 26px; 
			}
			
			.link-banner img {
				width: 200px;
				height: 67px;
			}
			
			.start-button {
				width: 180px;
				height: 50px;
				font-size: 16px;
				padding: 12px 25px;
			}
			
			.books-item,
			.books-text {
				/*flex: 0 0 100%;*/
				min-width: 100%;
			}
			
			#vopr {
			font-size: 22px;
			margin-bottom: 20px;
			}
			
			#venice, #theend, #theend1  {
				font-size: 16px;
				margin-bottom: 20px;
				padding: 0 0 0 60px;
			}
			
			.raion-item {
				margin: 0 auto;
				display: flex;
				flex-direction: column;
				align-items: center;
			}
			
						
			img.pict_flag { width: 230px;}
			
			.raion-col-text h3 {
				font-size: 26px; 
				margin-top: 10px;
			}
			
			.raion-col-img {
				width: 100%;
				margin-right: 0px;
				margin-top: 10px;
			}
				
			.raion-col-text {
				width: 100%;
				text-align: left;
			}
			
			.raion-img5, .raion-img3 {
				flex-direction: column;
				align-items: center;
			}
			
			.raion-img5 img{ height: 180px; margin-right: 20px; }
			.raion-img3 img{ height: 180px; margin-right: 20px; }
						
        }
        
        @media (max-width: 420px) {
			.site-title {
				font-size: 36px; /*48*/
				text-align: center;
			}
			
			.header-left {
				padding-left: 20px;
			}

			/*.menu-list {
				flex-direction: column;
				align-items: flex-start;
			}*/
			
			.logo {
				height: 50px;
			}

			.header-text {
				font-size: 14px;
			}

			.header-link {
				font-size: 16px;
			}

			.district-item a {
				font-size: 14px;
			}

			.menu-item a {
				font-size: 24px;
			}
			
			.section-title {
				font-size: 28px; /*36*/
			}
			
			.map-wrapper, .map {
				width: 100%;
                max-width: 100%;
				
            }

			.map {
				height: 350px;
				align-items: center;
			}
			
            /*.map-wrapper {
                max-width: 320px;
                height: 300px;
            }*/
			
			g {
			transform: scale(0.35);
			}
			
			         
            /*.districts-list {
                width: 90%;
            }
			
			.conference-item h3 a {
        font-size: 18px;
			}*/
			
			.books-text h2 a {
				font-size: 24px;
			}
			
			.books-text p {
				font-size: 20px;
			}
			
			.video-wrapper iframe {
				max-width: 320px;
				height: 180px;
			}
			
			.books-arrow img{
				width: 40px;
				height: 40px;
			}
			
			/*.lesson-text {
				width: 350px;
			}
			
			.link-banner img {
				width: 150px;
				height: 50px;
			}
			
			.books-arrow {
				padding: 8px 12px;
				font-size: 18px;
			}
			
			.site-footer p {
				font-size: 14px;
			}
			
			.back-to-top {
				width: 40px;
				height: 40px;
				line-height: 40px;
				font-size: 18px;
			}*/
			
					
        }