body { background-color: #FFEED4; font-family: 'Tac1', sans-serif; } .container { background-color: white; max-width: 960px; margin: 0 auto; padding: 20px; } .section { background-color: rgba(247, 171, 39, 0.266); /* Полупрозрачный цвет F7AA27 */ padding: 20px; margin-bottom: 20px; border-radius: 10px; } .section h2 { color: #F7AA27; font-size: 2em; font-weight: bold; margin-bottom: 10px; } .program { margin-bottom: 10px; } .program h3 { color: #F7AA27; font-weight: bold; margin-bottom: 5px; } .buy-button { background-color: #F7AA27; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; } .buy-button1 { background-color: #F7AA27; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; } .buy-form { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; padding: 20px; border-radius: 10px; z-index: 100; opacity: 0.9; /* Полупрозрачность формы */ } .buy-form input { width: 100%; padding: 10px; margin-bottom: 10px; border: 1px solid #ccc; border-radius: 5px; } .buy-form button { background-color: #F7AA27; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; } .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; /* Отступ справа от иконок */ } .close-button { position: absolute; top: 10px; right: 10px; cursor: pointer; } .close-button::before, .close-button::after { content: ''; position: absolute; width: 18px; height: 2px; background-color: black; top: 50%; transform: translateY(-50%); } .close-button::before { transform: translateY(-50%) rotate(45deg); } .close-button::after { transform: translateY(-50%) rotate(-45deg); } .buy-form button { display: block; /* Кнопка занимает всю ширину формы */ margin: 20px auto; /* Выравнивание по центру */ } .feedback-form { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(255, 255, 255, 0.8); padding: 20px; border-radius: 10px; display: none; /* Сначала скрываем форму */ z-index: 100; /* Чтобы форма была поверх всего */ } .feedback-form input, .feedback-form textarea { width: 100%; padding: 10px; margin-bottom: 10px; border: 1px solid #ccc; border-radius: 5px; } .feedback-form textarea { height: 100px; } .feedback-form button { background-color: #F7AA27; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; font-size: 1em; display: block; /* Кнопка занимает всю ширину */ margin: 20px auto; /* Кнопка по центру */ width: fit-content; /* Кнопка не растягивается на всю ширину */ } .close-form { position: absolute; top: 10px; right: 10px; cursor: pointer; } .close-form img { width: 20px; height: 20px; } .LoginBut { position: relative; margin-right: 100px; font-size: 1.2em; left: 150px; } .LoginBut button { background-color: transparent; border: none; padding: 10px 15px; color: white; font-size: 1em; cursor: pointer; } .header { background-color: #F7AA27; color: white; padding: 15px 0; display: flex; justify-content: space-between; align-items: center; } .header-logo { margin-left: 20px; } .header-logo img { width: 100px; height: auto; } .header-info { display: flex; align-items: center; } .header-tech { font-size: 2em; margin-right: 10px; /* Минимальный отступ */ } .header-center { font-family: 'Tac1', sans-serif; font-size: 1.2em; margin-right: 180px; /* Большой отступ */ } .header-location, .header-phone { font-size: 1.2em; /* Увеличенный шрифт */ margin-right: 20px; /* Отступ для телефона */ } .header-nav { position: relative; margin-right: 100px; font-size: 1.2em } .header-nav button { background-color: transparent; border: none; padding: 10px 15px; color: white; font-size: 1em; cursor: pointer; } .header-nav ul { list-style: none; margin: 0; padding: 0; position: absolute; top: 100%; right: 0; background-color: rgba(255, 255, 255, 0.8); /* Прозрачный белый цвет */ border-radius: 5px; display: none; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); padding: 10px; border: 1px solid #F7AA27; } .header-nav li { padding: 10px; border-bottom: 1px solid #F7AA27; /* Цвет разделителя */ transition: background-color 0.3s ease; /* Добавляем плавный переход */ } .header-nav li:last-child { border-bottom: none; } .header-nav li a { text-decoration: none; color: #F7AA27; /* Цвет текста */ } .header-nav li:hover { background-color: rgba(247, 170, 39, 0.5); /* Прозрачно-рыжий цвет */ } .header-nav li a:hover { color: white; /* Цвет текста при наведении */ } .header-nav:hover ul { display: block; } .footer { background-color: #DBAD63; color: white; padding: 15px 0; text-align: center; margin-top: 20px; } .LoginBut { position: relative; margin-right: 100px; font-size: 1.2em; left: 150px; } .LoginBut button { background-color: transparent; border: none; padding: 10px 15px; color: white; font-size: 1em; cursor: pointer; }