body {
    margin: 0;
    font-family: Arial, sans-serif;
    background-color: #3a38380e;
}
/*1блок*/
/*// Стили для контейнера лого и меню \\*/
.header {
    display: flex;
    align-items: center; /* Выравнивание по вертикали */
    justify-content: space-between; /* Распределение элементов по горизонтали */
    padding: 10px; /* Добавим отступы для фона */
    position: fixed; /* Позиционирование фиксированное */
    top: 0; /* Отступ сверху */
    left: 0; /* Выравнивание слева */
    right: 0; /* Выравнивание справа */
    background-color: white; /* Цвет фона */ 
    color: rgb(0, 0, 0); /* Цвет текста в блоке будет белым */
    z-index: 999; /* Позволяет нашему блоку быть "наверху" других элементов */
    transition: height 0.3s ease, padding 0.3s ease; /* Анимация изменения высоты и отступов */
}

.header.small {
    height: 50px; /* Меньшая высота блока при прокрутке */
    padding: 5px; /* Меньшие отступы при прокрутке */
}

/* Стили для логотипа */
.logo img {
    max-width: 200px; /* Максимальная ширина логотипа */
    max-height: 100px; /* Максимальная высота логотипа */
    display: inline-block; /* Делаем логотип блочно-строчным элементом */
    vertical-align: middle; /* Выравнивание по вертикали */
    background: none; /* Убираем фоновый цвет */
}

/* Стили для меню */
.menu ul {
    list-style: none; /* Убираем стилизацию списка */
    margin: 0;
    padding: 0;
    display: flex;
    
}

/* Стили для элементов меню */
.menu li {
    margin-right: 40px;
}

/* Стили для ссылок внутри меню */
.menu li a {
    text-decoration: none; /* Убираем подчеркивание ссылок */
    color: rgb(12, 5, 5); /* Цвет ссылок */
    font-size: 28px; /* Размер шрифта */
}

/* Стили для ссылок при наведении */
.menu li a:hover {
    color: #1c4fac; /* Изменяем цвет ссылок при наведении */
}

.section {
    margin-top: 50px; /* Добавьте отступ, чтобы контент не перекрывался меню */
    /*opacity: 0; /* Начальная прозрачность */
    transition: opacity 0.5s ease-in-out; /* Анимация плавного перехода */
}



.slider-container {
    max-width: 1300px;
    margin: 0 auto;
}

/* Основные стили слайдера */
.swiper-container {
    width: 100%;
    height: 600px; /* Задайте желаемую высоту слайдера */
    overflow: hidden; /* Скрываем содержимое, выходящее за границы контейнера */
    white-space: nowrap; /* Запрещаем перенос строк внутри слайдера */
}

/* Стили для слайдов */
.swiper-slide {
    text-align: center;
}

/* Стили для изображений в слайдере */
.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* Стили для текста на слайде */
.slide-text {
    position: absolute; /* Абсолютное позиционирование текста */
    top: 50%; /* Расположим текст по вертикали по середине слайда */
    left: 50%; /* Расположим текст по горизонтали по середине слайда */
    transform: translate(-50%, -50%); /* Сдвигаем текст на половину своего размера, чтобы выровнять его по центру */
    font-size: 38px;
    color: #fff;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

/*2блок*/
.custom-main-section {
    background-color: #f3f3f3;
    padding: 60px 0;
    text-align: center;
}

.custom-main-heading {
    font-size: 34px;
    font-weight: bold;
    margin-bottom: 40px;
}

.custom-icon-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.custom-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 20px;
    
}

.custom-icon-box {
    position: relative;
}

.custom-icon-img {
    width: 300px;
    height: 300px;
    overflow: hidden;
    margin-bottom: 10px;
    transition: transform 0.3s ease-in-out;
}

.custom-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.custom-icon-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    
    cursor: pointer;
}

.custom-item:hover .custom-icon-img {
    transform: scale(1.05);
}

.custom-item:hover .custom-icon-overlay {
    opacity: 1;
    transform: translateY(0);
}

.custom-icon-text {
    color: #ffffff;
    font-size: 24px;
    text-align: center;
    padding: 10px;
}

/*3блок*/
/*// Стили для текста в картинке 2 блок \\*/
.container {
   /* display: flex;*/
    flex-direction: column;
   /* align-items: center;*/
    margin: 10px;
}
.content {
    display: flex;
    /*flex-direction: row;*/
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 10px;
}
.text {
    width: 100%;
    padding: 150px;
}
.image {
    width: 100%;
    padding: 10px;
    border-radius: 100px;
}
.image:nth-child(odd) {
    float: right;
}
.image:nth-child(even) {
    float: left;
}


/*4блок*/
.containers {
    max-width: 2000px;
    margin: 5px auto;
    padding: 100px;
    background-color: rgba(2,178,222,.13);
}

.main-section {
    padding: 10px 30px;
    border-radius: 10px;
}

.main-heading {
    font-size: 55px; /* Увеличенный размер шрифта */
    font-weight: bold;
    margin-bottom: 125px; /* Уменьшенный отступ снизу */
}

.sub-heading {
    font-size: 43px; /* Увеличенный размер шрифта */
    margin-bottom: 70px; /* Уменьшенный отступ снизу */
}

.description {
    font-size: 26px;
    line-height: 1.5;
    margin-bottom: 70px; /* Уменьшенный отступ снизу */
}

.icon-container {
    display: flex;
    justify-content: center;
    align-items: center;
    /*height: 90vh;*/
}

.feature {
    flex: 1;
    background-color: #0093b8;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    text-align: center;
    margin: 0 15px;
}

.features { 
    display: flex;
    justify-content: space-between;
    margin-top: 80px;
}

.column {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 20px;
}

.item {
    display: flex;
    align-items: center;
    margin: 20px 0;
}

.feature p {
    margin: 0;
    padding: 10px;
    color: white;
    font-size: 20px;
}

.custom-icon {
    font-size: 20px;
    margin-bottom: 30px;
}

.custom-icon img {
    width: 100px;
    
}

.text {
    text-align: center;
}

.custom-icons img {
    width: 30%;
    height: 100%;
    object-fit: cover;
}





  /*// 5 блок \\*/

  .main-sections {
    background-color: #f3f3f3;
    text-align: center;
    padding: 0;
}

.main-headings {
    font-size: 34px;
    font-weight: bold;
    margin-bottom: 40px;
}

.icon-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.item {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 20px;
    position: relative;
}

.icon {
    position: relative;
    overflow: hidden;
}

.icon-img {
    width: 300px;
    height: 300px;
    overflow: hidden;
    margin-bottom: 10px;
    transition: transform 0.3s ease-in-out;
}

.icon img {
    width: 100%;
    height: 100%;
 
}

.icon-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    z-index: 6;
    transform: scale(1.1);
    transform-origin: center;
}

.item:hover .icon-img {
    transform: scale(1.05);
}

.item:hover .icon-overlay {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.icon-text {
    color: #ffffff;
    font-size: 24px;
    text-align: center;
}


/*2блок*/
.custom-main-section {
    background-color: #f3f3f3;
    padding: 60px 0;
    text-align: center;
}

.custom-main-headings {
    font-size: 34px;
    font-weight: bold;
    margin-bottom: 40px;
}

.custom-icon-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.custom-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 20px;
}

.custom-icon {
    position: relative;
    overflow: hidden;
}

.custom-icon-img {
    width: 300px;
    height: 300px;
    overflow: hidden;
    margin-bottom: 10px;
    transition: transform 0.3s ease-in-out;
}

.custom-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.custom-icon-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    z-index: 6;
    transform: scale(1.1);
    transform-origin: center;
}

.custom-item:hover .custom-icon-img {
    transform: scale(1.05);
}

.custom-item:hover .custom-icon-overlay {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.custom-icon-text {
    color: #ffffff;
    font-size: 24px;
    text-align: center;
}


/* 6 блок*/
.main-headings {
    margin-top: 60px; /* Добавляем отступ сверху */
    text-align: center;
}

.icons-containers {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    max-width: 900px; /* Установите желаемую максимальную ширину */
    margin: 0 auto;
    margin-bottom: 30px; /* Отступ снизу между блоками */
}

.icons {
    text-align: center;
    width: calc(33.33% - 10px); /* Равномерное распределение по 3 столбцам с отступами */
    margin-bottom: 20px;
    margin-right: 10px;
}

.icons:last-child {
    margin-right: 0; /* Убираем отступ с последней иконки в ряду */
}

.icons img {
    width: 100px; /* Ширина иконки */
    height: auto;
}

.icons p {
    margin: 40px 0; /* Уменьшаем отступ сверху и снизу для текста */
    font-size: 20px;
}

/*блок нижний строки + лого*/
.logos img {
    max-width: 300px; /* Максимальная ширина логотипа */
    display: inline-block; /* Делаем логотип блочно-строчным элементом */
    vertical-align: middle; /* Выравнивание по вертикали */
    background: none; /* Убираем фоновый цвет */
}

/*7блок*/
footer {
    background-color: white;
    padding: 20px 0;
}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-info {
    text-align: left;
}

.footer-info p {
    margin: 35px 0;
    color: black;
    font-size: 25px;
}

.footer-links {
    display: flex;
}

.footer-links a {
    margin: 0 10px;
    color: #000000;
    text-decoration: none;
    
}