body {
        background-color: #343a40;
        color: white;
    }
    .gallery {
    max-height: 0; /* Начальная высота 0 для скрытия галереи */
    overflow-y: auto; /* Вертикальный скроллинг при переполнении */
    transition: max-height 0.5s ease; /* Плавный переход для высоты */
    display: flex; /* Используем flexbox для расположения изображений */
    flex-wrap: wrap; /* Позволяем изображениям переноситься на новую строку */
    justify-content: center; /* Центрируем изображения */
}

    .gallery img {
        width: calc(33.33% - 10px); /* Устанавливаем ширину изображения */
        margin: 5px; /* Отступ между изображениями */
        height: auto; /* Высота автоматическая для сохранения пропорций */
    }

    .gallery.open {
        max-height: 400px; /* Максимальная высота при открытии */
    }
    .portfolio-item img {
        transition: transform 0.3s ease; /* Плавный переход для увеличения */
    }
    .portfolio-item img:hover {
        transform: scale(1.1); /* Увеличение изображения при наведении */
    }
    .toggle-btn {
        width: 50px;
        height: 50px;
        border-radius: 100%;
        padding: 0;
        background-color: #007bff;
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto; /* Центрируем кнопку */
        transition: transform 0.3s ease; /* Плавный переход для анимации */
        outline: none; /* Убираем обводку */
    }
    .toggle-btn:focus {
        outline: none; /* Убираем обводку при фокусе */
    }
    .toggle-btn i {
        font-size: 1.5em;
        color: white; /* Цвет иконки */
    }

    /* Стиль для увеличенного изображения */
    .fullscreen-image {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.9);
        display: none; /* Скрываем по умолчанию */
        justify-content: center;
        align-items: center;
        z-index: 1000; /* Поверх всех элементов */
    }
    .fullscreen-image img {
        max-width: 90%;
        max-height: 90%;
    }

    .toggle-container {
        position: relative;
        text-align: center; /* Центрируем содержимое */
        margin-top: 20px; /* Отступ сверху */
    }

    .toggle-bar {
        width: 100%; /* Полоса на всю ширину */
        height: 4px; /* Высота полосы */
        background-color: rgba(0, 123, 255, 0.5); /* Полупрозрачный цвет полосы */
        margin-bottom: 10px; /* Отступ между полосой и кнопкой */
    }

    .toggle-btn {
        width: 50px;
        height: 50px;
        border-radius: 100%;
        padding: 0;
        background-color: transparent; /* Прозрачный фон */
        border: none; /* Убираем рамку */
        position: relative; /* Для позиционирования стрелочки */
        animation: pulse 1s infinite; /* Добавляем анимацию пульсации */
    }

    .toggle-btn i {
        font-size: 1.5em;
        color: #007bff; /* Цвет иконки */
    }

    @keyframes pulse {
        0%, 100% {
            transform: scale(1); /* Исходный размер */
        }
        50% {
            transform: scale(1.2); /* Увеличиваем размер */
        }
    }

    /* Новый стиль для изображений без обводки */
    .portfolio-item img {
        border: none; /* Убираем рамку */
        box-shadow: none; /* Убираем тень */
    }

    /* Анимация для стрелки при открытии/закрытии */
    .toggle-btn.animate {
        animation: shake 0.5s infinite alternate; /* Добавляем анимацию */
    }

    @keyframes shake {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(180deg); }
    }