PP_Jirafik
/
Metod_centre


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
							<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./styles/style.css">
    <title>Методический центр "Технология"</title>
    <style>
        body {
            background-color: #FFEED4;
            font-family: 'Tac1', sans-serif;
        }

       
        .contacts-container {
            background-color: white;
            padding: 20px;
            margin: 20px auto;
            max-width: 960px;
            border-radius: 10px;
            display: flex;
            flex-direction: column; /* Изменяем направление на столбцовое */
            align-items: center; /* Выравнивание по вертикали и горизонтали */
        }

        .contacts-container h2 {
            color: #F7AA27;
            font-size: 2em;
            margin-bottom: 20px;
            text-align: center; /* Выравниваем заголовок по центру */
        }

        .contact-info {
            display: flex;
            align-items: center;
            margin-bottom: 20px; /* Отступ между секциями */
        }

        .social-icons {
            display: flex;
            align-items: center; /* Выравнивание по вертикали */
            margin-right: 20px; /* Отступ справа от иконок */
        }

       
        .question-container {
            
            margin-bottom: 20px;
            border: 2px dashed #F7AA27;
            padding: 10px;
            border-radius: 10px;
            background-color: rgba(255, 255, 255, 0.8); /* Полупрозрачный фон */
            position: relative; /* Для позиционирования значка + */
        }

        .question-container h3 {
            margin: 0;
        }

        .question-container .plus-icon {
           
            position: absolute;
            top: 50%;
            left: 0; /* Смещаем влево */
            transform: translateY(-50%);
            font-size: 20px;
            color: #F7AA27;
            cursor: pointer;
            font-weight: bold;
            margin-left: -20px; /* Выравниваем с левым краем рамки */
        }

        .answer {
            display: none; /* Скрываем ответ по умолчанию */
            margin-top: 10px;
        }

        .answer.show {
            display: block;
        }
    </style>
</head>
<body>

    <header class="header">
        <div class="header-logo">
            <img src="img/лого.png" alt="Логотип методического центра">
        </div>
        <div class="header-info">
            <h1 class="header-tech">ТЕХНОЛОГИЯ</h1>
            <div class="header-center">
                | Методический центр 
            </div>
            <div class="header-location">
                 г. Нижний Новгород, пр. Кирова, 12
            </div>
            <div class="header-phone">
                | +7 (831) 291-50-25
            </div>
        </div>
        <div class="header-nav">
            <button>Меню</button>
            <ul>
                <li><a href="index.html">Главная</a></li>
                <li><a href="about.html">О нас</a></li>
                <li><a href="videos.html">Видео пособия</a></li>
                <li><a href="obychenie.html">Обучение</a></li>
                <li><a href="contacts.html">Контакты</a></li>
                <li><a href="questions.html">Вопросы</a></li>
            </ul>
        </div>
    </header>
    <main>
        <div class="contacts-container">
            <h2>Часто задаваемые вопросы</h2>
            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3>Какие курсы и тренинги мы предлагаем?</h3>
                <div class="answer">
                    Ответ: Наш методический центр предлагает широкий спектр курсов и тренингов для педагогов, руководителей образовательных учреждений и других специалистов в сфере образования. Наша специализация - робототехника, наставничество. Вы можете ознакомиться с полным списком курсов и тренингов на нашем сайте в разделе “Обучение”.
                </div>
            </div>

            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3> Как стать партнером Методического Центра "Технология"?</h3>
                <div class="answer">
                    Ответ: Обратитесь к нам по телефону или электронной почте, чтобы обсудить возможности сотрудничества.
                </div>
            </div>

            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3>Какова стоимость участия в курсах?</h3>
                <div class="answer">
                    Ответ: Стоимость участия в каждом курсе указана на странице с описанием курса. Также у вас есть возможность приобрести абонемент на несколько курсов.
                </div>
            </div>

            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3>Какие документы необходимы для записи на курс?</h3>
                <div class="answer">
                    Ответ: Для записи на курс вам необходимо заполнить заявку на нашем сайте. После обработки заявки с вами свяжется наш менеджер для подтверждения записи и уточнения деталей.
                </div>
            </div>

            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3>Какие преимущества от обучения в Методическом Центре "Технология"?</h3>
                <div class="answer">
                    Ответ: Обучение в Методическом Центре поможет вам:

                    Повысить свою квалификацию и профессиональный уровень.
                    Ознакомиться с новейшими методиками и технологиями обучения.
                    Наладить контакты с коллегами и обменяться опытом.
                    Получить поддержку и консультацию специалистов.                </div>
            </div>
            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3>Как получить информацию о предстоящих мероприятиях?</h3>
                <div class="answer">
                    Ответ: Следите за новостями на нашем сайте, подписывайтесь на рассылку или вступайте в наши группы в социальных сетях.                </div>
            </div>
            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3>Как получить консультацию специалиста?</h3>
                <div class="answer">
                    Ответ: Вы можете записаться на консультацию через наш сайт, по телефону или электронной почте.   
                </div>
            </div>
            <div class="question-container">
                <div class="plus-icon">+</div>
                <h3>Что такое Методический Центр?</h3>
                <div class="answer">
                    Ответ: Методический Центр - это организация, предоставляющая помощь и поддержку педагогам в улучшении качества образования. Мы предлагаем разнообразные ресурсы, тренинги, консультации, а также организуем мероприятия и проекты для повышения квалификации учителей.   
                </div>
            </div>
        </div>
    </main>

    <footer class="footer">
        <p>© 2023 Методический центр "Технология"</p>
    </footer>


    <script>
        const plusIcons = document.querySelectorAll('.plus-icon');
        const answers = document.querySelectorAll('.answer');

        plusIcons.forEach((icon, index) => {
            icon.addEventListener('click', () => {
                answers[index].classList.toggle('show');
            });
        });
    </script>
</body>
</html>