body {
    font-family: 'Montserrat', sans-serif;
    margin: 0; /* Убираем отступы вокруг страницы */
    padding: 0; /* Убираем padding для body */
    background-color: white;
    display: flex;
    flex-direction: column; /* Шапка и меню в колонку */
    min-height: 100vh; /* Минимальная высота 100% экрана */
}

.container {
    width: 100%;
    margin: 0;
}
				
p {
    text-align: justify;
		} 
		
		       @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(20px); 
            }
            to {
                opacity: 1; 
                transform: translateY(0);
            }
        }

        .fade-in {
            opacity: 0; 
            animation: fadeIn 1.5s ease-out forwards;
        }
		
        .fade-in-logo {
            animation-delay: 0s;
        }

        .fade-in-text {
            animation-delay: 0s;
        }
		
		.fade-in-text1 {
			animation-delay: 1s;
		}
		
header {
    background: #001f3f;
    color: white;
    padding: 10px 20px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.3);
    position: relative;
	z-index: 9;
}

.header-main {
    display: flex;
    align-items: center;
    justify-content: space-between; /* Равномерно распределяет элементы в шапке */
}

.logo-text {
    display: flex;
    align-items: center;
}

.logo {
    height: 80px;
    margin-right: 20px;
}

.header-text {
    text-align: left;
}

.header-text h1 {
    margin: 0;
    font-size: 1.8em;
    color: white;
}
		
.header-text h2 {
    margin: 0;
    font-size: 1.5em;
    color: white;
}

.header-text p {
    margin: 0px 0 0 0;
    font-size: 1em;
    color: white;
}
		
.language-switcher {
    position: absolute; /* Абсолютное позиционирование */
    bottom: 10px; /* Расстояние от нижнего края шапки */
    right: 20px; /* Расстояние от правого края шапки */
    display: flex; /* Горизонтальное расположение значков */
    gap: 10px; /* Расстояние между значками */
}

.language-switcher a {
    text-decoration: none;
    color: white;
    padding: 5px 10px;
	border-radius: 5px;
    transition: background 0.3s, color 0.3s;
}

.language-switcher a:hover {
    background: white;
    color: #001f3f;
}


.main-container {
    position: relative;
    background-image: url('/picture_library/IMG_1498a.JPG'); /* Замените на ссылку на ваше фоновое изображение */
    background-size: cover; /* изображение будет обрезаться */
    background-repeat: no-repeat; /* чтобы изображение не повторялось */
	background-position: center;
	width: 100%;
    height: 850px;
    display: flex;
    justify-content: center;
    align-items: center; /* Центрирование содержимого */
	z-index: 1;
}

.parent-container {
	position: relative; /* Родительский контейнер с position: relative */
    width: 100%; /* Задаем ширину родительского контейнера */
    height: 100vh; /* Задаем высоту на весь экран (или любую другую) */
		}
		
.menu {
    background-color: rgba(0, 0, 0, 0.7); /* Полупрозрачный фон */
    color: white;
    display: flex;
	top: 0;
    justify-content: center;
	align-items: center;
    gap: 40px;
	padding: 15px 0;
    width: 100%;
    z-index: 9; 
	position: absolute;
}

.text-overlay1 {
	position: absolute;
    left: 5%;
	top: 15%;
	width: 50%;
	transform: translateY(0); 
    color: white; 
    font-size: 17px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
    text-align: left;
	z-index: 1;
}
		
.text-overlay {
    position: absolute;      /* или relative, если нужно внутри потока */
    top: 60%;                /* центр по вертикали относительно родителя */
    left: 50%;               /* центр по горизонтали относительно родителя */
	width: 100%;
    transform: translate(-50%, -50%); /* сдвиг, чтобы центрировать блок */
    color: white;
    font-size: 17px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
    text-align: center;      /* центр текста внутри блока */
    z-index: 1;
}
		
.menu a {
    text-decoration: none;
    color: white;
    font-size: 1em;
    padding: 10px 20px;
    border-radius: 5px;
}

.menu a:hover {
    background-color: #0056b3;
}

.content {
    flex-grow: 1;
    padding: 0; 
    background-color: #ffffff;
    border-radius: 0; 
    margin: 0; 
}
		

         .modal {
            display: none;
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            z-index: 1000;
            background: white;
            padding: 10px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
        }

        .modal img {
            max-width: 100%;
            height: auto;
        }

        .modal-close {
            position: absolute;
            top: 10px;
            right: 10px;
            cursor: pointer;
            font-size: 20px;
            color: #333;
        }

        .overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 999;
        }
		
.image {
    width: 80%;
    height: auto;
    border-radius: 10px;
    margin-bottom: 20px;
}

.text {
    font-size: 1.2em;
    line-height: 1.6;
    margin: 20px 0;
    color: #fff;
}

		
.image-container {
     position: absolute; /* Позволяет позиционировать текст относительно контейнера */
     width: 100%;
     max-width: none;
     margin: 0 auto;
	 z-index: 0;
}

.image-container img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
        }

.white-block {
    background-color: white;       
    width: 100%;                    
    padding: 100px 0;                
    display: flex;
    justify-content: center;        
}

.white-block-content-90 {
    width: 90%;                      /* Ширина блока с текстом */
    text-align: center;              /* Текст по центру */
}
		
.white-block-content { 
    width: 85%;    /* ширина блока 80% экрана */
}

.horizontal-line {
    width: 60%;        /* линия по ширине блока */
    height: 5px;
    background-color: #00366D;
    margin-bottom: 50px;  /* от линии до текста + фото */
	 margin-left: auto;
} 

.text-photo-row {
    display: flex;
    align-items: center;   /* теперь текст центрируется по вертикали относительно фото */
    gap: 100px;             /* расстояние между текстом и фото */
}

.text-photo-row.mirrored {
    flex-direction: row;   /* обычный порядок: фото слева, текст справа */
	 gap: 100px; 
}

.text-container {
    width: 50%;
    padding-left: 50px;   /* Отступ слева для линии */
    padding-right: 0px;  /* Отступ справа для текста */
    position: relative;    /* Чтобы вертикальная линия позиционировалась относительно блока */
    display: flex;
    flex-direction: column;
    justify-content: center; /* Вертикальное центрирование текста */
}

.text-container2 {
    width: 50%;
    padding-left: 50px;   /* Отступ слева для линии */
    padding-right: 50px;  /* Отступ справа для текста */
    position: relative;    /* Чтобы вертикальная линия позиционировалась относительно блока */
    display: flex;
    flex-direction: column;
    justify-content: center; /* Вертикальное центрирование текста */
}

		
.text-container-right {
     width: 50%;
    padding-left: 0px;   /* Отступ слева для линии */
    padding-right: 50px;  /* Отступ справа для текста */
    position: relative;    /* Чтобы вертикальная линия позиционировалась относительно блока */
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.vertical-line {
    position: absolute;
    left: 0;              /* Выравниваем по левому краю текстового блока */
    top: 0;
    width: 5px;
    height: 100%;         /* Линия по высоте текстового блока */
    background-color: #00366D;
}

.vertical-line-right {
    position: absolute;
    right: 0;              /* Выравниваем по левому краю текстового блока */
    top: 0;
    width: 5px;
    height: 100%;         /* Линия по высоте текстового блока */
    background-color: #00366D;
}
		
.text-container p {
    margin: 0;
}
		
.photo-container {
    width: auto;              
    max-width: 50%; 
}

.photo-container img {
    width: 100%;             
    height: auto;
    display: block;
}

.poster-list {
	position: relative;
    display: flex;
    flex-direction: column; /* Строки друг под другом */
    align-items: flex-start; /* Выровнять по правому краю */
}
		
.poster-item {
    position: relative;
    font-size: 0.8em;
    color: #333;
    padding: 12px 25px;
    margin-bottom: 20px;
    border-radius: 25px;
    cursor: pointer;
    text-align: left;
    background-color: rgba(244, 244, 244);
    transition: background-color 0.3s, color 0.3s;
    width: 400px;
}

.poster-item::before {
    content: "→"; /* Стрелка вправо */
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px; 
    transition: transform 0.3s, color 0.3s;
}


.poster-item:hover {
    background-color: #0056b3; /* Подсветка фона */
    color: white; /* Подсветка текста */
}

.poster-item:hover::before {
    transform: translateY(-50%) translateX(5px); /* Стрелка движется вправо */
    color: white; /* Стрелка меняет цвет */
}
		
.poster-item a {
    text-decoration: none; /* Убирает подчеркивание */
    color: inherit; /* Наследует цвет родительского элемента */
}

.poster-item a {
    color: #000; /* Устанавливаем черный цвет */
	  text-shadow: none !important;
}

.poster-item a:hover {
    color: #000; /* Например, черный цвет на hover */
    text-decoration: none; /* Убираем подчеркивание на hover */
}
	
.fullscreen-block {
    position: relative;       
    width: 100%;
    background-image: url('/picture_library/ASSY.jpeg'); 
    background-size: cover;   
    background-position: center; 
    display: flex;            
    justify-content: center;  
    align-items: center;      
}

.fullscreen-block .overlay-text {
    display: flex;            /* делаем текст в виде горизонтального ряда колонок */
    gap: 100px;                /* расстояние между колонками */
    max-width: 80%;           
    color: white;             
    font-size: 1.2em;           
    text-align: justify;      
    text-shadow: 2px 2px 6px rgba(0,0,0,0.7);
	margin: 100px;
	 justify-content: center;
}

.fullscreen-block .overlay-text .column-left {
    width: 60%;
}

.fullscreen-block .overlay-text .column-right {
    width: 40%;
}

.split-container {
  display: flex;
  width: 100%;
  height: 500px; /* высота блока */
}

.left-text {
  font-size: 1.1em;
  width: 40%;
  padding-left: 7%;
  padding-right: 0px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;      /* вертикальное центрирование */
  text-align: right;
		}

.right-slideshow {
  width: 60%;
  position: relative;
  overflow: hidden;
}

.right-slideshow .slides {
  width: 100%;
  height: 100%;
  position: relative;
}

.right-slideshow .slide {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.right-slideshow .slide.active {
  opacity: 1;
}

.right-slideshow button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0,0,0,0.5);
  color: white;
  border: none;
  font-size: 2em;
  padding: 0 10px;
  cursor: pointer;
  z-index: 2;
}

.right-slideshow .prev { left: 10px; }
.right-slideshow .next { right: 10px; }
		
.contact-block {
    background-color: #001f3f;  /* цвет блока */
    color: white;               /* цвет текста */
    width: 100%;
    padding: 40px 0;            /* вертикальные отступы */
    display: flex;
    justify-content: center;    /* центрирование содержимого по горизонтали */
}

.contact-content {
    width: 80%;                 /* ширина содержимого внутри блока */
    max-width: 1200px;
    text-align: center;          /* текст по центру */
    font-family: 'Montserrat', sans-serif;
}

.contact-content h2 {
    margin-bottom: 20px;
	text-align: center;
}

.contact-content p {
    margin: 5px 0;
	text-align: center;
}