В ближайшее время менеджер Центра свяжется с вами для уточнения деталей и оплаты заказа.
На ваш e-mail xxx@mail.ru мы отправили письмо с информацией о заказе.
Описание курса
Обучение проходит на React 19
ReactJS — популярная JavaScript-библиотека с открытым исходным кодом. Разработана для построения пользовательских интерфейсов (UI, User Interfaces) на основе компонентного подхода. Характеризуется декларативным подходом к описанию, компоненто-ориентированностью и простотой использования. Особенности ReactJS: однонаправленный поток данных, виртуальный DOM, JSX.
В настоящий момент библиотека поддерживается известными соцсетями и сообществом индивидуальных разработчиков.
Курс познакомит вас с базовыми особенностями популярной библиотеки, даст практические навыки создания компонентов на ReactJS и его расширении JavaScript - JSX.
- акцент на функциональные компоненты
- использование базовых хуков useState, useEffect
- тестирование и сборка проекта
- работа с контекстом
Курс будет полезен для выпускников курсов направления JavaScript, а также для слушателей, ориентированных на работу с клиентской стороной.
Узнать больше
Вы научитесь
- cоздавать компоненты на основе React.js;
- создавать состояние компонентов;
- использовать условную отрисовку;
- тестировать и собирать приложение на React.js
Специалисты, обладающие этими знаниями и навыками, в настоящее
время крайне востребованы.
Обучение по мировым стандартам позволяет нашим выпускникам работать
в ведущих компаниях России и других стран. Они делают успешную карьеру и пользуются уважением работодателей.
Узнать больше
Предварительная подготовка
Узнать больше
Тестирование по курсу
Программа курса
Модуль 1. Введение в React и JSX
(4 ак. ч.)
Модуль 2. Компоненты React
(8 ак. ч.)
Модуль 3. События и состояние в React
(4 ак. ч.)
Модуль 4. Хуки и их применение
(4 ак. ч.)
Модуль 5. Практическая работа
(4 ак. ч.)
Модуль 6. Обзор сторонних инструментов
(4 ак. ч.)
Модуль 7. Дополнительные материалы
(4 ак. ч.)
Аудиторная нагрузка в классе с преподавателем 32 ак. ч.
+ 32 ак. ч. бесплатно*
* Для слушателей курса предусмотрено время для самостоятельной практической отработки и проработки материала в компьютерных классах Центра.
Вы можете использовать его для закрепления знаний, выполнения домашних заданий и консультаций со специалистами.
Время предоставляется бесплатно по предварительному согласованию с администратором комплекса:
-
для занятий с 10:00 до 17:10: дополнительное время с 9:00 до 10:00.
-
для занятий с 14:00 до 17:10: дополнительное время с 13:15 до 14:00.
-
для занятий с 18:30 до 21:30: дополнительное время с 17:10 до 17:55.
По завершении обучения проводится итоговая аттестация. Она может проходить в виде теста на последнем занятии или основываться на результатах выполнения практических заданий в ходе курса.
Узнать больше
Данный курс вы можете пройти как в очном формате, так и дистанционно в режиме
онлайн
. Чтобы записаться на онлайн-обучение, в корзине измените тип обучения на "онлайн" и выберите удобную для вас группу.
Чем онлайн-обучение отличается от других видов обучения?
Слушатели групп, которые проходят только онлайн, могут подключиться к занятиям из аудитории УЦ Специалист.
Чтобы забронировать место, свяжитесь с менеджером заранее. Не позднее чем за 3 дня до начала занятий.
Сортировать:
* Данная скидка действительна при заказе и оплате обучения только сегодня. Запишитесь прямо сейчас со скидкой!
Стоимость не облагается НДС
Стоимость обучения
Частным лицам
Свободное обучение
35 240 ₽
Обучение в кредит
От 2 508 руб./месяц
Организациям
Свободное обучение
40 490 ₽
Документы об окончании
В зависимости от программы обучения выдаются следующие документы:
Свидетельство выпускника
Cертификат международного образца
Удостоверение о повышении квалификации
* Для получения удостоверения вам необходимо предоставить копию диплома о высшем или среднем профессиональном образовании.
Сертификаты международного образца выводятся после окончания курса в личном кабинете слушателя.
Больше знаний - меньше стоимость!
Этот курс обойдётся до 30% дешевле, если изучать его в составе дипломных программ. Пройдя обучение, Вы получите современную профессию и диплом о переподготовке.
Посмотреть программы со скидкой
Данное предложение действует только для частных лиц.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name='description' content='Курс «JavaScript. Уровень 6. Библиотека React.js»: онлайн и очное офлайн обучение в Москве в Бауманском учебном центре «Специалист». Стоимость обучения. Программа курса. Отзывы. Расписание групп обучения ☎ +7 (495) 232-32-16'/>
<meta property='og:description' content='Курс «JavaScript. Уровень 6. Библиотека React.js»: онлайн и очное офлайн обучение в Москве в Бауманском учебном центре «Специалист». Стоимость обучения. Программа курса. Отзывы. Расписание групп обучения ☎ +7 (495) 232-32-16'/>
<meta property='og:image' content='//cdn1.specialist.ru/Content/Image/Course/react.jpg'/>
<meta name='title' content='Курс «JavaScript. Уровень 6. Библиотека React.js» обучение онлайн и очно в Москве, цены и программа курса'/>
<link rel='canonical' href='https://www.specialist.ru/course/react'/>
<meta property="og:url" content="https://www.specialist.ru/course/react"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<!--meta name="theme-color" content="#004677" /-->
<meta name="yandex-verification" content="5ce3c2adbabf18a4" />
<meta name="yandex-verification" content="7b036195913425ea" />
<meta name="mailru-verification" content="301e51764b9b6604" />
<meta name="google-site-verification" content="y2LRLH9Gm-w95ef-B6Ro5zAzduXbbjZCSioPpfDsusE" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name='og:title' content='JavaScript. Уровень 6. React.js - библиотека для UI'/>
<title>JavaScript. Уровень 6. React.js - библиотека для UI</title>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCUSOE_kayCPUChUArhF5eIVl0KH5PrFlQ"></script>
<script type="text/javascript">
(function (d, w, t, u, o, s, v) {
w[o] = w[o] || function () {
(w[o].q = w[o].q || []).push(arguments)
}; s = d.createElement("script"); s.async = 1;
s.src = u; v = d.getElementsByTagName(t)[0]; v.parentNode.insertBefore(s, v);
})(document, window, "script", "//image.sendsay.ru/js/target/tracking_v2.min.js", "sndsy");
sndsy("init", { fid: "specialist", v: "1.0" });
sndsy("send", {});
</script>
<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700&display=swap&subset=cyrillic" rel="stylesheet"/>
<link rel="stylesheet" type="text/css" href="https://cdn.specialist.ru/Content/File/Site_rework/index-2/slick/slick.css" />
<!--link href="https://cdn.specialist.ru/content/file/site_rework/index-2/css/footer-style.css" rel="stylesheet" type="text/css" /-->
<link href="https://cdn.specialist.ru/Content/File/Site_rework/index-2/css/style.css" rel="stylesheet" type="text/css" />
<link rel="icon" href="/favicon.svg" type="image/svg+xml"/>
<script src="https://code.jquery.com/jquery-2.2.0.min.js" type="text/javascript"></script>
<script src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/js/jquery-ui.min.js"></script>
<script src="/scripts/localization-ru.js"></script>
<script type="application/ld+json">
[{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Главная",
"item": "https://www.specialist.ru/"
},
{
"@type": "ListItem",
"position": 2,
"name": "Курсы",
"item": "https://www.specialist.ru/courses"
},
{
"@type": "ListItem",
"position": 3,
"name": "Курсы веб-программирования: JavaScript, PHP, MySQL и др.",
"item": "https://www.specialist.ru/section/web-programming"
},
{
"@type": "ListItem",
"position": 4,
"name": "Основы WEB – разработки",
"item": "https://www.specialist.ru/section/web-development-bases"
},
{
"@type": "ListItem",
"position": 5,
"name": "Курсы по разработке веб-приложений",
"item": "https://www.specialist.ru/section/web-developers"
},
{
"@type": "ListItem",
"position": 6,
"name": "Интернет-технологии",
"item": "https://www.specialist.ru/section/web"
}
]
}]
</script>
<script>
var TeachersNewModalLoaded = false;
</script>
</head>
<body>
<style>
.techwork {background: #FF5722; display: none;}
</style>
<div class="techwork">
<div class="wrapper" style="background: #FF5722; padding: 10px 15px; color: white; font-family: 'Montserrat'; font-weight: 700; font-size: 15px; line-height: 20px; text-align: center;">Уважаемые слушатели! Обращаем ваше внимание, что 01.05.2024 и 09.05.2024 у нас выходные дни. Вы можете оставить сообщение в чате, мы обязательно ответим!</div>
</div>
<div class="techwork js-techwork" style="display: none;">
<div class="wrapper" style="background: #FF5722; padding: 10px 15px; color: white; font-family: 'Montserrat'; font-weight: 700; font-size: 15px; line-height: 20px; text-align: center;">
Уважаемые слушатели! Теперь для вас работает номер технической поддержки <a style="color:white; text-decoration:underline;white-space:nowrap;" href="tel:+78004442835">8 (800) 444-28-35</a> с 9:00 до 21:00
</div>
</div>
<script>
/*$(document).ready(
function(){
var time = new Date().getTime();
//нумерация месяцев начинается с 0;
var startTime = new Date(Date.UTC(2024, 09, 14, 6, 0, 0,0));
var finishTime = new Date(Date.UTC(2025, 11, 26, 20, 0, 0, 0));
if(time >= startTime && time< finishTime ){
$(".js-techwork").show();
}
})*/
</script>
<link rel="stylesheet" href="/content/header2025.css?v=20260212">
<link rel="stylesheet" href="/content/header-mobile2025.css?v=20260212">
<header class="header ">
<section class="header-top-mobile">
<div class="wrapper">
<a class="logo-link" href="/">
<svg xmlns="http://www.w3.org/2000/svg" width="41" height="41" viewBox="0 0 41 41" fill="none">
<g clip-path="url(#clip0_1707_373)">
<path d="M29.9296 36.1901C24.8406 36.1901 21.8507 32.9415 21.8507 27.8077C21.8507 23.9053 23.4816 21.3977 25.9528 20.1977C27.1654 19.67 28.4715 19.4029 29.7895 19.4131C31.5072 19.4131 34.2437 20.0628 35.3906 20.5178V15.7096C34.7092 15.3622 33.4196 14.989 31.7313 14.7779C31.7313 14.7779 30.7604 14.6553 30.1749 14.6417C29.4388 14.6199 28.8227 14.6417 28.4613 14.6703C28.0212 14.6975 27.5878 14.7479 27.161 14.8065C20.7464 15.7695 15.9375 20.4715 15.9375 28.1959C15.9375 35.4723 20.3904 40.9997 29.1054 40.9997C32.1593 40.9997 34.5131 40.4154 35.5307 39.895V35.0868C34.3824 35.5404 31.6472 36.1901 29.9296 36.1901Z" fill="#004777"/>
<path d="M37.3109 16.0499L36.9281 15.6562L36.9441 22.7991L34.1929 22.0282C32.8267 21.6359 31.4139 21.4393 29.9948 21.4438C26.114 21.4438 23.8242 23.9119 23.8242 28.0064C23.8242 30.9949 24.9684 33.0094 27.1955 33.8539L40.9996 19.8243L37.3109 16.0499Z" fill="#2782C5"/>
<path d="M29.6765 12.8038H30.3126C33.3438 12.9195 35.0215 13.7341 35.0215 13.7341L21.4709 0L1.95772 19.8649V32.1238C1.79058 32.1987 1.63757 32.3029 1.50563 32.4316L1.28025 32.892C1.26724 33.077 1.29269 33.2627 1.35493 33.4369C1.41126 33.5957 1.51717 33.7311 1.65632 33.8223L0 40.2773H4.51688L2.86056 33.8183C2.99971 33.727 3.10562 33.5916 3.16195 33.4328C3.22991 33.2601 3.25555 33.0731 3.23663 32.8879C3.23663 32.6577 3.16195 32.5801 3.01125 32.4276C2.93657 32.2736 2.78588 32.196 2.55917 32.1197V20.5119L14.4095 32.5542C14.1355 31.1851 13.9864 29.793 13.9641 28.3957C13.9641 19.2329 20.3893 12.8038 29.6765 12.8038Z" fill="#2782C5"/>
</g>
<defs>
<clipPath id="clip0_1707_373">
<rect width="41" height="41" fill="white"/>
</clipPath>
</defs>
</svg>
</a>
<div class="header-mobile-right">
<div class="cart-header-block">
<a class="header-bottom-button header-cart-button js-cart-header" href="/cart/details" title="Корзина">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
<path d="M4.69231 7.30184C4.69231 7.30184 4.67126 4.48647 5.51282 3.08524C7.18225 0.3056 10.4067 0.304238 12.0769 3.08524C12.9185 4.48647 12.8974 7.30184 12.8974 7.30184M12.8974 7.30184H15.661C16.3293 7.30184 16.8096 7.9449 16.6198 8.58577L14.3402 16.2839C14.2145 16.7086 13.8243 17 13.3814 17H4.6186C4.17567 17 3.78552 16.7086 3.65975 16.2839L1.38019 8.58577C1.19042 7.9449 1.67066 7.30184 2.33904 7.30184H12.8974Z" stroke="#012063" stroke-width="2"/>
</svg>
Корзина
<span class="cart-counter js-cart-counter"></span>
</a>
</div>
<div class="login-header-block js-logout-header-block">
<a class="header-bottom-button header-login-button" href="/account/logon">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
<path d="M15 16V14.3333C15 13.4493 14.6313 12.6014 13.9749 11.9763C13.3185 11.3512 12.4283 11 11.5 11H4.5C3.57174 11 2.6815 11.3512 2.02513 11.9763C1.36875 12.6014 1 13.4493 1 14.3333V16" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 7.66667C9.933 7.66667 11.5 6.17428 11.5 4.33333C11.5 2.49238 9.933 1 8 1C6.067 1 4.5 2.49238 4.5 4.33333C4.5 6.17428 6.067 7.66667 8 7.66667Z" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span>Вход</span>
</a>
</div>
<div class="login-header-block js-login-header-block">
<a href="/profile" class="header-bottom-button header-login-button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
<path d="M15 16V14.3333C15 13.4493 14.6313 12.6014 13.9749 11.9763C13.3185 11.3512 12.4283 11 11.5 11H4.5C3.57174 11 2.6815 11.3512 2.02513 11.9763C1.36875 12.6014 1 13.4493 1 14.3333V16" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 7.66667C9.933 7.66667 11.5 6.17428 11.5 4.33333C11.5 2.49238 9.933 1 8 1C6.067 1 4.5 2.49238 4.5 4.33333C4.5 6.17428 6.067 7.66667 8 7.66667Z" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span class="header-username js-header-mobile-username"></span>
</a>
<a href="/account/logoff" class="header-bottom-button header-logout-button">
<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17" fill="none">
<path d="M5.99962 16H2.66654C2.22455 16 1.80065 15.8244 1.48812 15.5118C1.17558 15.1993 1 14.7754 1 14.3333V2.66667C1 2.22464 1.17558 1.80072 1.48812 1.48816C1.80065 1.17559 2.22455 1 2.66654 1H5.99962" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M11.832 12.6654L15.9984 8.4987L11.832 4.33203" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M16.0031 8.5H6.00391" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Выйти
</a>
</div>
<div>
<button class="header-bottom-button header-menu-button js-menu-header" title="Открыть меню">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="14" viewBox="0 0 16 14" fill="none">
<path d="M1 1H15" stroke="#012063" stroke-width="2" stroke-linecap="round"/>
<path d="M1 7H15" stroke="#012063" stroke-width="2" stroke-linecap="round"/>
<path d="M1 13H15" stroke="#012063" stroke-width="2" stroke-linecap="round"/>
</svg>
Открыть меню
</button>
</div>
</div>
</div>
</section>
<div class="mob-menu-block" id="js-mobile-menu">
<section class="mob-menu-block-top">
<a class="logo-link" href="/">
<svg xmlns="http://www.w3.org/2000/svg" width="41" height="41" viewBox="0 0 41 41" fill="none">
<g clip-path="url(#clip0_1707_373)">
<path d="M29.9296 36.1901C24.8406 36.1901 21.8507 32.9415 21.8507 27.8077C21.8507 23.9053 23.4816 21.3977 25.9528 20.1977C27.1654 19.67 28.4715 19.4029 29.7895 19.4131C31.5072 19.4131 34.2437 20.0628 35.3906 20.5178V15.7096C34.7092 15.3622 33.4196 14.989 31.7313 14.7779C31.7313 14.7779 30.7604 14.6553 30.1749 14.6417C29.4388 14.6199 28.8227 14.6417 28.4613 14.6703C28.0212 14.6975 27.5878 14.7479 27.161 14.8065C20.7464 15.7695 15.9375 20.4715 15.9375 28.1959C15.9375 35.4723 20.3904 40.9997 29.1054 40.9997C32.1593 40.9997 34.5131 40.4154 35.5307 39.895V35.0868C34.3824 35.5404 31.6472 36.1901 29.9296 36.1901Z" fill="#004777"/>
<path d="M37.3109 16.0499L36.9281 15.6562L36.9441 22.7991L34.1929 22.0282C32.8267 21.6359 31.4139 21.4393 29.9948 21.4438C26.114 21.4438 23.8242 23.9119 23.8242 28.0064C23.8242 30.9949 24.9684 33.0094 27.1955 33.8539L40.9996 19.8243L37.3109 16.0499Z" fill="#2782C5"/>
<path d="M29.6765 12.8038H30.3126C33.3438 12.9195 35.0215 13.7341 35.0215 13.7341L21.4709 0L1.95772 19.8649V32.1238C1.79058 32.1987 1.63757 32.3029 1.50563 32.4316L1.28025 32.892C1.26724 33.077 1.29269 33.2627 1.35493 33.4369C1.41126 33.5957 1.51717 33.7311 1.65632 33.8223L0 40.2773H4.51688L2.86056 33.8183C2.99971 33.727 3.10562 33.5916 3.16195 33.4328C3.22991 33.2601 3.25555 33.0731 3.23663 32.8879C3.23663 32.6577 3.16195 32.5801 3.01125 32.4276C2.93657 32.2736 2.78588 32.196 2.55917 32.1197V20.5119L14.4095 32.5542C14.1355 31.1851 13.9864 29.793 13.9641 28.3957C13.9641 19.2329 20.3893 12.8038 29.6765 12.8038Z" fill="#2782C5"/>
</g>
<defs>
<clipPath id="clip0_1707_373">
<rect width="41" height="41" fill="white"/>
</clipPath>
</defs>
</svg>
</a>
<button class="mob-menu-close js-mob-menu-close">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none">
<path d="M14 1L1 14" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M1 1L14 14" stroke="#012063" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Закрыть меню
</button>
</section>
<section class="header-top">
<div class="wrapper">
<div class="header-row">
<a class="logo-link" href="/">
<img src="//cdn.specialist.ru/content/file/layouts/header2025/img/logo.svg" alt="" />
</a>
<div class="header-row-right">
<ul class="header-phones-block">
<li class="header-phones-item">
<h3>Частным лицам</h3>
<a class="phone-num-link" href="tel:+74952323216">+7 (495) 232-32-16</a>
</li>
<li class="header-phones-item">
<h3>
<a href="/center/corpeducation/corporate?srs_shapka=1">
От организации
</a>
</h3>
<a class="phone-num-link" href="tel:+74957804844">+7 (495) 780-48-44</a>
</li>
<li class="header-phones-item">
<h3>Тех. поддержка</h3>
<a class="phone-num-link phone-support-list" href="tel:+78004442835">+7 (800) 444-28-35</a>
</li>
</ul>
<div class="header-row-right-inner">
<ul>
<!--li class="header-phones-item whatsapp-item">
<h3 class="visually-hidden">+7 (495) 780-48-49</h3>
<a target="_blank"
title="Whatsapp"
href="https://api.whatsapp.com/send?phone=74957804849&text=%D0%97%D0%B4%D1%80%D0%B0%D0%B2%D1%81%D1%82%D0%B2%D1%83%D0%B9%D1%82%D0%B5!%20%D0%9F%D0%BE%D0%BC%D0%BE%D0%B3%D0%B8%D1%82%D0%B5%20%D0%B2%D1%8B%D0%B1%D1%80%D0%B0%D1%82%D1%8C%20%D0%BA%D1%83%D1%80%D1%81%2C%20%D0%BC%D0%B5%D0%BD%D1%8F%20%D0%B8%D0%BD%D1%82%D0%B5%D1%80%D0%B5%D1%81%D1%83%D0%B5%D1%82%20%D0%BD%D0%B0%D0%BF%D1%80%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5%20..">
<svg xmlns="http://www.w3.org/2000/svg" width="29" height="30" viewBox="0 0 29 30" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.5179 6.83358e-08C11.9641 -0.000250093 9.4572 0.686342 7.25989 1.98784C5.06257 3.28934 3.25573 5.15784 2.02866 7.39757C0.801587 9.6373 0.19946 12.1658 0.285364 14.7182C0.371268 17.2706 1.14204 19.7529 2.51693 21.9051L0.09663 27.5053C0.00804967 27.7103 -0.0204327 27.9362 0.0145061 28.1567C0.0494449 28.3772 0.146364 28.5832 0.293957 28.7507C0.441549 28.9182 0.63373 29.0403 0.848077 29.1027C1.06242 29.1651 1.2901 29.1653 1.50454 29.1032L8.40286 27.102C10.332 28.018 12.4425 28.4884 14.578 28.4783C16.7136 28.4682 18.8195 27.9779 20.7399 27.0437C22.6603 26.1094 24.3459 24.7552 25.6721 23.0813C26.9982 21.4073 27.9308 19.4565 28.4008 17.3733C28.8709 15.2901 28.8663 13.1278 28.3875 11.0466C27.9086 8.96541 26.9678 7.01856 25.6347 5.35021C24.3015 3.68187 22.6101 2.33476 20.6858 1.40863C18.7615 0.482505 16.6535 0.00107851 14.5179 6.83358e-08ZM16.6714 18.5603C16.0875 18.9056 14.8083 19.0108 12.377 16.5795C9.94576 14.1482 10.0509 12.8706 10.3962 12.2851C11.2752 12.1956 12.1181 11.6071 12.8997 10.8254C13.4789 10.2462 13.0096 8.84145 11.8544 7.68624C10.6976 6.52946 9.29281 6.06172 8.7152 6.63933C4.99216 10.3608 6.85682 15.2438 10.2848 18.6733C13.7598 22.1484 18.5063 24.0538 22.3188 20.2429C22.8964 19.6637 22.4286 18.2589 21.2719 17.1037C20.1151 15.9469 18.7103 15.4792 18.1327 16.0568C17.3495 16.8385 16.7609 17.6813 16.673 18.5603" fill="#1A9D37"/>
</svg>
Написать нам в whatsapp
</a>
</li-->
<li class="header-phones-item max-item">
<h3 class="visually-hidden">+7 (495) 780-48-49</h3>
<a target="_blank" title="Max" href="https://max.ru/id7736604420_bot">
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 1000 1000">
<defs>
<linearGradient id="b">
<stop offset="0" stop-color="#00f"/>
<stop offset="1" stop-opacity="0"/>
<stop offset="1" stop-opacity="0"/>
</linearGradient>
<linearGradient id="a">
<stop offset="0" stop-color="#4cf"/>
<stop offset=".662" stop-color="#53e"/>
<stop offset="1" stop-color="#93d"/>
</linearGradient>
<linearGradient id="c" x1="117.847" x2="1000" y1="760.536" y2="500" gradientUnits="userSpaceOnUse" href="#a"/>
<radialGradient id="d" cx="-87.392" cy="1166.116" r="500" fx="-87.392" fy="1166.116" gradientTransform="rotate(51.356 1551.478 559.3)scale(2.42703433 1)" gradientUnits="userSpaceOnUse" href="#b"/>
</defs>
<rect width="1000" height="1000" fill="url(#c)" ry="249.681"/>
<rect width="1000" height="1000" fill="url(#d)" ry="249.681"/>
<path fill="#fff" fill-rule="evenodd" d="M508.211 878.328c-75.007 0-109.864-10.95-170.453-54.75-38.325 49.275-159.686 87.783-164.979 21.9 0-49.456-10.95-91.248-23.36-136.873-14.782-56.21-31.572-118.807-31.572-209.508 0-216.626 177.754-379.597 388.357-379.597 210.785 0 375.947 171.001 375.947 381.604.707 207.346-166.595 376.118-373.94 377.224m3.103-571.585c-102.564-5.292-182.499 65.7-200.201 177.024-14.6 92.162 11.315 204.398 33.397 210.238 10.585 2.555 37.23-18.98 53.837-35.587a189.8 189.8 0 0 0 92.71 33.032c106.273 5.112 197.08-75.794 204.215-181.95 4.154-106.382-77.67-196.486-183.958-202.574Z" clip-rule="evenodd"/>
</svg>
<span>Написать нам в Max</span>
</a>
</li>
</ul>
<button type="button" class="order-callback js-order-callback">Заказать звонок</button>
</div>
</div>
</div>
</div>
</section>
<section class="header-bottom">
<div class="wrapper">
<div class="header-bottom-row">
<nav class="header-menu">
<ul class="header-menu-list js-header-menu-list">
<li class="header-menu-item">
<a href="#" class="top-level-menu js-menu-item">Курсы</a>
<ul class="header-submenu">
<li><a href="/courses">Каталог курсов</a></li>
<li><a href="/center/educationtypes/refresher_course">Повышение квалификации</a></li>
<li><a href="/center/educationtypes/diplomn_progr">Профессиональная переподготовка</a></li>
<li><a href="/about-testingcenter">Экзамены вендоров</a></li>
<li><a href="/special-offers/real-specialist">Программа лояльности</a></li>
<li><a href="/center/educationtypes/edu-sertificate">Подарить сертификат на обучение</a></li>
</ul>
</li>
<li class="header-menu-item">
<a href="/learning-formats" class="top-level-menu">Форматы обучения</a>
</li>
<li class="header-menu-item">
<a href="#" class="top-level-menu js-menu-item">Карьера</a>
<ul class="header-submenu">
<li><a href="/career-guidance">Профориентация</a></li>
<li><a href="/courses#professii">Популярные профессии</a></li>
<li><a href="/job">Трудоустройство</a></li>
<li><a href="/job/career">Работа в Центре</a></li>
</ul>
</li>
<li class="header-menu-item">
<a href="/center/corpeducation/corporate" class="top-level-menu">Компаниям</a>
</li>
<li class="header-menu-item">
<a href="/special-offers/activities" class="top-level-menu">Акции</a>
</li>
<li class="header-menu-item">
<a href="#" class="top-level-menu js-menu-item">О центре</a>
<ul class="header-submenu">
<li><a href="/contacts">Контакты</a></li>
<li><a href="/center/news/main/1">Новости</a></li>
<li><a href="/center">О центре</a></li>
<li><a href="/center/comand/trainers">Преподаватели</a></li>
<li><a href="/job/career">Вакансии</a></li>
</ul>
</li>
</ul>
</nav>
<div class="header-bottom-rigth">
<div class="header-menu-search">
<button type="button" class="header-bottom-button header-search-button js-header-search-button" title="Поиск">
<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17" fill="none">
<path d="M7.66656 14.3331C11.3484 14.3331 14.3331 11.3484 14.3331 7.66656C14.3331 3.98472 11.3484 1 7.66656 1C3.98472 1 1 3.98472 1 7.66656C1 11.3484 3.98472 14.3331 7.66656 14.3331Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15.9999 15.9999L12.375 12.375" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Поиск
</button>
<div class="header-menu-search-block js-menu-search-input">
<div class="search-shadow js-search-shadow"></div>
<div class="header-menu-search-body">
<form action="/page/search" method="POST">
<input name="text" type="text" placeholder="Поиск по сайту" />
<button>Найти</button>
</form>
</div>
</div>
</div>
<div class="cart-header-block">
<a class="header-bottom-button header-cart-button js-cart-header" href="/cart/details" title="Корзина">
<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17" fill="none">
<path d="M4.46154 6.7482C4.46154 6.7482 4.44181 4.18017 5.23077 2.90205C6.79586 0.366605 9.81876 0.365362 11.3846 2.90205C12.1736 4.18017 12.1538 6.7482 12.1538 6.7482M12.1538 6.7482H14.6504C15.3219 6.7482 15.8026 7.39693 15.607 8.03937L13.5234 14.8855C13.3953 15.3066 13.0069 15.5944 12.5668 15.5944H4.43325C3.99311 15.5944 3.60472 15.3066 3.47657 14.8855L1.39296 8.03936C1.19744 7.39693 1.67811 6.7482 2.34964 6.7482H12.1538Z" stroke="white" stroke-width="2"/>
</svg>
Корзина
<span class="cart-counter js-cart-counter"></span>
</a>
</div>
<div class="login-header-block js-logout-header-block">
<a class="header-bottom-button header-login-button" href="/account/logon">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
<path d="M15 16V14.3333C15 13.4493 14.6313 12.6014 13.9749 11.9763C13.3185 11.3512 12.4283 11 11.5 11H4.5C3.57174 11 2.6815 11.3512 2.02513 11.9763C1.36875 12.6014 1 13.4493 1 14.3333V16" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 7.66667C9.933 7.66667 11.5 6.17428 11.5 4.33333C11.5 2.49238 9.933 1 8 1C6.067 1 4.5 2.49238 4.5 4.33333C4.5 6.17428 6.067 7.66667 8 7.66667Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span>Вход</span>
</a>
</div>
<div class="login-header-block js-login-header-block">
<a href="/profile" class="header-bottom-button header-login-button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
<path d="M15 16V14.3333C15 13.4493 14.6313 12.6014 13.9749 11.9763C13.3185 11.3512 12.4283 11 11.5 11H4.5C3.57174 11 2.6815 11.3512 2.02513 11.9763C1.36875 12.6014 1 13.4493 1 14.3333V16" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 7.66667C9.933 7.66667 11.5 6.17428 11.5 4.33333C11.5 2.49238 9.933 1 8 1C6.067 1 4.5 2.49238 4.5 4.33333C4.5 6.17428 6.067 7.66667 8 7.66667Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span class="header-username js-header-username"></span>
</a>
<ul class="header-submenu">
<li>
<a href="/profile">Личный кабинет</a>
</li>
<li>
<a href="/account/logoff">Выйти</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
</div>
<!--лид-магнит-->
<span class="visually-hidden enter js-lead-enter" aria-hidden="true">
<a href="/profile"></a>
</span>
</header>
<script src="https://www.google.com/recaptcha/api.js?render=6LfcR_UrAAAAAGwysdwCgeHi8EAoV2ow_QPKVAhv"></script>
<script>
function AddTokenToForm(form, callback) {
grecaptcha.execute('6LfcR_UrAAAAAGwysdwCgeHi8EAoV2ow_QPKVAhv', { action: 'submit' }).then(function (token) {
$(form).find('input[name="g-recaptcha-response"]').remove();
$(form).append('<input type="hidden" name="g-recaptcha-response" value="' + token + '">');
callback(null, token);
});
}
$(document).ready(function () {
$('form[action="/page/sendformto"]').on('submit', function (e) {
debugger;
e.preventDefault();
var $form = $(this);
var $tokenInput = $('input[name="token"]', $form);
if ($tokenInput.length === 0) {
$tokenInput = $('<input type="hidden" name="token" value="">');
$form.append($tokenInput);
}
$.post('/actionform/gettoken')
.done(function (response) {
$tokenInput.val(response);
$form.off('submit');
$form.submit();
})
.fail(function (xhr, status, error) {
console.error('AJAX Error: ' + status + error);
alert('Ошибка получения токена безопасности. Пожалуйста, попробуйте еще раз.');
});
});
});
</script>
<style>
.left2{
padding-top:10px;
}
/* слой затемнения */
.dm-overlay {
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.65);
overflow: auto;
width: 100%;
height: 100%;
z-index: 9998;
}
</style>
<div class="setpassword_header" id="setPassword"></div>
<div class="dm-overlay" id ="dmOverlay" style="display:none"></div>
<script>
var enterPassword = get_cookie("EnterPassword");
if (enterPassword != null) {
$.get("Profile/SetPassword", function (data) {
$("#setPassword").html(data);
$("#dmOverlay").show();
});
}
function get_cookie(cookie_name) {
var results = document.cookie.match('(^|;) ?' + cookie_name + '=([^;]*)(;|$)');
if (results)
return (unescape(results[2]));
else
return null;
}
</script>
<p class="breadcrumbs">
<a href="/">Главная</a> > <a href="/courses">Курсы</a> > <a href="/section/web-programming">Курсы веб-программирования: JavaScript, PHP, MySQL и др.</a> | <a href="/section/web-development-bases">Основы WEB – разработки</a> | <a href="/section/web-developers">Курсы по разработке веб-приложений</a> | <a href="/section/web">Интернет-технологии</a>
</p>
<style>
p.breadcrumbs {
max-width: 1240px;
margin: 0 auto;
margin-top: 20px;
padding-left: 20px; }
p.breadcrumbs a {
color: black;
}
</style>
<link href="/content/modal2024.css?v3" rel="stylesheet" />
<script>
//одноразовый - удалить со страницы
document.addEventListener("click", (e) => {
if (!e.target.classList.contains("js-common-popup-close")) return;
//e.target.closest(".js-common-popup").style.display = "none";
e.target.closest(".js-common-popup").remove();
})
//многоразовый - скрыть со страницы
document.addEventListener("click", (e) => {
if (!e.target.classList.contains("js-common-popup-close-no-remove")) return;
e.target.closest(".js-common-popup").style.display = "none";
})
</script>
<script type="text/javascript" src="/scripts/updateHeaderState.js"></script>
<link href="/libs/vanilla-calendar-pro/styles/index.css" rel="stylesheet">
<link href="/libs/vanilla-calendar-pro/styles/themes/custom.css" rel="stylesheet">
<script src="/libs/vanilla-calendar-pro/index.js" defer></script>
<link rel="stylesheet" href="/content/fancybox/jquery.fancybox.css" />
<script src="/content/fancybox/jquery.fancybox.pack.js"></script>
<script src="/Scripts/jquery.cookie.js" type="text/javascript"></script>
<style>
.sidebar-spec{
background: #eef3f6;
border-left: 5px solid #2580C3;
}
.sidebar-spec.only-mobile{
display: none;
}
@media(max-width: 1023px){
.sidebar-spec.only-mobile{
display: block;
}
}
.free-lanch{
display: none!important;
}
.show-calendar{
position: relative;
cursor: pointer;
}
.calendar-container{
box-sizing: border-box;
visibility: hidden;
position: absolute;
background: #fff;
border: 1px solid #ddd;
top: 100%;
left: 0;
width: 0;
height: 0;
overflow: hidden;
transition: 0.3s;
border-radius: 8px;
cursor: default;
}
.show-calendar:hover .calendar-container{
width: auto;
height: auto;
overflow: visible;
visibility: visible;
transition: 0.3s;
z-index: 10;
}
.calendar-legend{
padding: 0.5rem 1rem;
border-top: 1px solid #ddd;
}
.calendar-legend p, .page .calendar-legend p{
margin: 0 0 6px 0;
font-size: 12px;
font-weight: 500;
}
.calendar-legend p:last-child, .page .calendar-legend p:last-child{
margin-bottom: 0;
}
.legend-label{
align-items: center;
border-radius: .5rem;
cursor: pointer;
display: inline-flex;
font-size: .75rem;
font-weight: 400;
justify-content: center;
line-height: 1rem;
min-height: 1.875rem;
min-width: 1.875rem;
padding: 0;
margin-right: 0.6rem;
}
.tooltip-nds-block{
position: relative;
display: flex;
align-items: center;
}
</style>
<link rel='stylesheet' href='https://cdn.specialist.ru/Content/File/fontAwesome/fontawesome-free-6.1.1-web/css/all.min.css'/>
<link href="/content/modal2024.css?v1" rel="stylesheet" />
<div id="nh-cart-dialog" class="modal modal2024">
<div class="modal-shadow js-cart-addcartstay"></div>
<div class="modal-shadow js-cart-go-to-cart"></div>
<div class="modal-body">
<button id="addcartstay" class="modal-close js-cart-addcartstay" type="button" aria-label="Закрыть окно">×</button>
<div class="modal-text">
<p>Заказ добавлен в Корзину.</p>
<p>Для завершения оформления, пожалуйста,<br> перейдите в Корзину!</p>
</div>
<div class="loader-wrapper close-loader-wrapper js-close-loader">
<div class='loader'>Подождите...</div>
</div>
<div class="loader-wrapper js-loader">
<div class='loader'>Подождите...</div>
</div>
<div class="modal-buttons-wrapper">
<button id="addcartgo" class="modal-button" type="button">Перейти в корзину</button>
</div>
</div>
</div>
<script>
//вызовы функций - во внешних компонентах
function onAddToCart(el) {
$(".js-cart-go-to-cart").show();//более понятное поведение - нажал на кнопку Перейти в корзину, жди, не закрывая модальное окно
el.hide();
$(".js-loader").show();
$("#addcartstay").hide();
}
function onCloseModalCart() {
$("#nh-cart-dialog").hide();
$("#addcartstay").show();
$(".loader-wrapper").hide();
}
</script>
<div id="nh-korp-dialog" class="modal modal2024 corp-modal">
<div class="modal-shadow corp-modal-shadow js-corp-addcartstay"></div>
<div class="modal-body corp-modal-body">
<button class="modal-close corp-modal-close js-corp-addcartstay" aria-label="Закрыть окно" type="button">×</button>
<div class="modal-text corp-modal-text">
<p>От какого лица вы будете оплачивать обучение?</p>
</div>
<div class="modal-buttons-wrapper corp-buttons-wrapper">
<button id="im-fiz-btn" class="modal-button corp-button" type="button">Физическое лицо</button>
<button id="im-korp-btn" class="modal-button corp-button corp-button-org" type="button">Юридическое лицо</button>
</div>
</div>
</div>
<script>
$(".js-corp-addcartstay").on("click", function (e) {
$("#nh-korp-dialog").hide();
});
$("#im-korp-btn").click(function (e) {
debugger;
$.cookie('KorpCartKey', '1', { expires: 1, path: '/' });
$("#nh-korp-dialog").hide();
$("#nh-cart-dialog").show();
//$("#cart-dialog2").show();
});
+
$("#im-fiz-btn").click(function (e) {
debugger;
$.cookie('KorpCartKey', '0', { expires: 1, path: '/' });
$("#nh-korp-dialog").hide();
$("#nh-cart-dialog").show();
//$("#cart-dialog2").show();
});
</script>
<main class="page">
<style>
.one-click-modal-body{
max-width: 685px;
}
.page .modal-header.one-click-modal-header{
font-weight: 400;
font-size: 34px;
line-height: 1.2;
text-align: center;
color: #1A1A1A;
margin-top: 0;
margin-bottom: 24px;
}
.one-click-input-wrapper{
margin-bottom: 24px;
}
.one-click-input-wrapper input{
display: block;
width: 100%;
background: #F8F8F8;
border: 1px solid #E3E7ED;
border-radius: 4px;
font-weight: 400;
font-size: 18px;
height: 52px;
padding: 6px 6px 6px 12px;
}
.one-click-input-wrapper input:focus{
outline: 1px solid #0F5BA8;
}
.one-click-input-wrapper input::placeholder{
color: #1a1a1a;
}
.order-form-block{
margin-bottom: 24px;
}
.page .order-form-block-header{
font-weight: 500;
font-size: 18px;
line-height: 1.2;
color: #1A1A1A;
margin: 0 0 20px 0;
}
.order-form-block .checkboxes-box{
display: flex;
flex-wrap: wrap;
gap: 18px 36px;
}
.order-form-block .checkbox-wrapper{
display: flex;
gap: 16px;
align-items:center;
}
.order-form-block .checkbox-wrapper input{
height: 22px;
width: 22px;
}
.order-form-block .checkbox-wrapper label{
font-weight: 400;
font-size: 15px;
color: #33393E;
}
.one-click-checkbox-wrapper{
display: flex;
}
.checkbox-label{
font-weight: 300;
font-size: 12px;
line-height: 14px;
color: #000000;
}
.one-click-checkbox-wrapper input{
width: 26px;
height: 26px;
margin-right: 14px;
flex-shrink: 0;
border: 1px solid #E3E7ED;
}
.one-click-send{
display: flex;
align-items: center;
justify-content: center;
width: 100%;
background: #FF6500;
border-radius: 5px;
font-weight: 600;
font-size: 16px;
text-align: center;
color: #FFFFFF;
cursor: pointer;
border: none;
padding: 12px;
}
.one-click-send:hover{
background: #cc5000;
}
.one-click-modal-text p{
text-align: left;
line-height: 1.3;
}
.one-click-modal-body a{
text-decoration: underline;
}
.js-after-send{
display: none;
}
.one-click-input-wrapper .loader{
height: 45px;
width: 45px;
position: relative;
display: none;
}
@keyframes loader{
from{
transform: translateX(-50%) rotate(0deg);
}
to{
transform: translateX(-50%) rotate(360deg);
}
}
</style>
<div class="modal modal2024 one-click-modal js-one-click-modal">
<div class="modal-shadow one-click-modal-shadow js-one-click-close"></div>
<div class="modal-body one-click-modal-body">
<button type="button" class="modal-close js-one-click-close" aria-label="Закрыть окно">×</button>
<div class="js-before-send">
<h2 class="modal-header one-click-modal-header">Укажите ваши данные</h2>
<form id="one-click-order-form" action="/ProfileU/OneClickOrder" method="post">
<input type="hidden" name="code" value="РЕАКТ-Б" />
<input type="hidden" name="code_tc" value="РЕАКТ-Б" />
<input type="hidden" name="courseName" value="JavaScript. Уровень 6. Библиотека React.js" />
<div class="one-click-input-wrapper">
<input type="text" name="firstName" value="" placeholder="Ваше имя" required/>
</div>
<div class="one-click-input-wrapper">
<input type="text" name="lastName" value="" placeholder="Ваша фамилия" required/>
</div>
<div class="one-click-input-wrapper">
<input type="text" name="phone" value="" placeholder="Номер телефона" required/>
</div>
<div class="one-click-input-wrapper">
<input type="email" name="email" value="" placeholder="E-mail" required/>
</div>
<div class="input-wrapper order-form-block">
<p class="order-form-block-header">От какого лица вы будете оплачивать обучение?</p>
<div class="checkboxes-box">
<div class="checkbox-wrapper">
<input type="radio" name="UserType" checked value="Физическое лицо" id="one-click-fiz" required />
<label for="one-click-fiz">Физическое лицо</label>
</div>
<div class="checkbox-wrapper">
<input type="radio" name="UserType" value="Юридическое лицо" id="one-click-org" required/>
<label for="one-click-org">Юридическое лицо</label>
</div>
</div>
</div>
<div class="one-click-input-wrapper" style="position: relative; min-height:44px;">
<button class="one-click-send js-one-click-send" type="submit">Отправить</button>
<div class="loader js-loader">
</div>
</div>
<div class="one-click-checkbox-wrapper">
<input type="checkbox" id="agree" name="agree" required>
<label class="checkbox-label" for="agree">Я принимаю условия <a href="/confidential-info">Политики конфиденциальности</a>
и даю согласие на обработку персональных данных
в соответствии с законодательством России
</label>
</div>
</form>
</div>
<div class="js-after-send">
<h2 class="modal-header one-click-modal-header">Ваша заявка на курс принята</h2>
<div class="modal-text one-click-modal-text">
<p>В ближайшее время менеджер Центра свяжется с вами для уточнения деталей и оплаты заказа.</p>
<p>На ваш e-mail <a id="a_email" href="mailto:xxx@mail.ru">xxx@mail.ru</a> мы отправили письмо с информацией о заказе.</p>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$(".js-one-click").on("click", function (e) {
$(".js-one-click-modal").show();
});
$(".js-one-click-close").on("click", function (e) {
$(".js-before-send").show();
$(".js-after-send").hide();
$(this).closest(".js-one-click-modal").hide();
});
});
$("#one-click-order-form").on("submit", function (e) {
e.preventDefault();
$('.js-one-click-send').hide();
$('.js-one-click-send + .js-loader').show();
var data =
[
{
"transaction_id": "21.02.2026",
"transaction_status": "1",
"transaction_dt": "2026-02-21 08:43:29",
"transaction_sum": "46 990",
"items": [
{
"id": "РЕАКТ-Б",
"qnt": "1",
"price": "46 990"
}
]
}
];
var OneClickOrderEmail = $("input[name=email]").val();
try {
let wrapArr = [];
wrapArr.push(data);
(window['sndsyApiOnReady'] = window['sndsyApiOnReady'] || []).push(function () {
sndsyApi.ssecEvent(
"ORDER",
wrapArr,
{ email: OneClickOrderEmail }
);
});
if (typeof sndsyApi != 'undefined') {
sndsyApi.runQueue();
}
else {
debugger;
}
}
catch (e) {
debugger;
}
$("input[name=code]").val(OneClickOrderEmail + "+");
var form = document.getElementById("one-click-order-form");
var data = new FormData(form);
var post_url = form.getAttribute("action");
$.ajax({
url: post_url,
type: "post",
processData: false,
contentType: false,
data: data,
error: function (jqXHR, exception) {
alert(jqXHR.status + ": " + exception)
},
success: function (response) {
if (response == true) {
//в колбэк после отправки
$("#a_email").attr("href", "mailto:" + OneClickOrderEmail);
$("#a_email").text(OneClickOrderEmail);
$('.js-one-click-send').show();
$('.js-one-click-send + .js-loader').hide();
$(".js-before-send").hide();
$(".js-after-send").show();
$(".one-click-button").hide();
} else {
alert("Ошибка отправки данных. Обратитесь с поддержку.");
$('.js-one-click-send').show();
$('.js-one-click-send + .js-loader').hide();
}
}
});
});
</script>
<style>
.banner-cert-block{
align-self: flex-start;
padding-top: 35px;
margin-left: 20px;
width: 150px;
flex-shrink: 0;
}
.banner-cert-block img{
display: block;
margin: 0 auto;
}
.cert-name{
text-align:center;
color: white;
font-weight: 600;
}
@media (max-width: 770px){
.banner-cert-block {
margin-left: 0;
padding-top: 0;
padding-bottom: 10px;
}
}
</style>
<section class="banner">
<div class="banner-wrap">
<div class="banner-wrap__bg banner-blue ">
<div class="wrapper banner-wrapper">
<!--
<div class="banner-wrap-props">
<div class="banner-wrap-props__bg">
<p>Microsoft Office Specialist Authorized Testing Center</p>
</div>
<div class="banner-wrap-props__shadow"></div>
</div>
-->
<div class="banner-wrap__img">
<img src="i/banner-img_1.png" alt="" />
</div>
<div class="banner-wrap-content">
<div class="banner-wrap-content__title ">
<h1>JavaScript. Уровень 6. Библиотека React.js</h1>
<p class="banner-wrap-content-title_eng">JavaScript. Level 6. React and JSX</p>
<p class="banner-wrap-content-title_code">Код курса: РЕАКТ-Б</p>
<div class="banner-wrap-content__txt">
<p>
ReactJS — популярная JavaScript-библиотека с открытым исходным кодом. Разработана для построения пользовательских интерфейсов (UI, User Interfaces) на основе компонентного подхода. Курс познакомит вас с базовыми особенностями популярной библиотеки, даст практические навыки создания компонентов на ReactJS и его расширении JavaScript - JSX.
</p>
<!--<p style="color: white; font-weight: bold;">
*курс реализуется в сотрудничестве с Учебным центром "Лайн-Практик"
</p>-->
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="courses">
<div class="wrapper courses-wrapper">
<nav class="sidebar sidebar-left">
<link href="/content/nearest-group.css?v2" rel="stylesheet" />
<section class="cp-closest-group">
<h2 class="cp-closest-group-header">Ближайшая группа</h2>
<div class="cp-closest-group-aditional-data">
<div class="cp-closest-group-col cp-closest-group-left">
<dl class="cp-closest-start show-calendar js-show-calendar" tabindex="0">
<dt class="grey-text" >
Дата начала
</dt>
<dd>
02.03.2026
<div class="calendar-container js-calendar-container"
data-start="2026-03-02"
data-end="2026-03-05"
data-lectures="2026-03-02,2026-03-03,2026-03-04,2026-03-05">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</dd>
</dl>
<dl>
<dt class="grey-text">
Преподаватель
</dt>
<dd>
<a style="display: block;" href="/trainer/ТРАС">
<img class="cp-closest-teacher-img" src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов" />
<p class="teacher-name">Тарасов Алексей Владимирович</p>
</a>
</dd>
</dl>
</div>
<div class="cp-closest-group-col cp-closest-group-right">
<dl>
<dt class="grey-text">
Формат обучения
</dt>
<a href="/center/educationtypes/open-classes" style="font-size:smaller">Открытое обучение</a>
<p></p>
<dt class="grey-text">
Режим обучения
</dt>
<dd>
<div>
ежедневно:
</div>
<div class="time">10:00 — 17:10</div>
<div class="weekdays" style="padding-top:10px">
<!--нужны сокращенные обозначения-->
<div class="cp-closest-group-format">
<div class="sidebar-format"><span class="clickable" show="#ochnoL">Очно</span>, <span class="clickable" show="#onlineL">онлайн</span></div>
</div>
</div>
</dd>
</dl>
<dl>
<dd style="margin-bottom: 10px;">
<div class="sidebar-format clickable" show="#freeL">Свободное обучение</div>
<div>По вашему графику</div>
</dd>
<dt>
Любой день
</dt>
</dl>
<dl>
<dt class="grey-text">
Длительность:
</dt>
<dd>
32 ак. ч. + 32 ак. ч. самостоятельно
</dd>
</dl>
</div>
</div>
<div class="cp-closest-group-price">
<div class="grey-text tooltip-nds-block" >
<span>Стоимость</span>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<div class="cp-closest-group-price-wrapper">
<div class="cp-closest-group-price-column">
<h3 class="cp-closest-group-price-header">
Для физ.лиц
</h3>
<form>
<ul id="individual" class="cp-closest-group-price-list">
<li class="cp-closest-group-price-item">
<input form="baseForm" id="offline-ind" type="radio" value="chlv" checked class="price-radio" name="gType">
<label for="offline-ind" class="content-block-sh-price__with_sale">
<span class="price-format">Очно</span>
<span class="price-number">42 250 ₽
<span class="price-discount">(-10%)</span>
</span>
</label>
</li>
<li class="cp-closest-group-price-item">
<input form="baseForm" id="online-ind" type="radio" value="webchl" class="price-radio" name="gType">
<label for="online-ind" class="content-block-sh-price__with_sale">
<span class="price-format">Онлайн</span>
<span class="price-number">42 250 ₽
<span class="price-discount"> (-10%)</span>
</span>
</label>
</li>
<!--Свободное обучение-->
<li class="cp-closest-group-price-item free">
<input form="baseForm" id="free" type="radio" value="free" class="price-radio" name="gType">
<label for="free" class="content-block-sh-price__with_sale">
<span class="price-format">
<a href="/free-learning-new" target="_blank">
Свободное <br> обучение
</a>
</span>
<span class="price-number">35 240 ₽
<span class="price-discount"> (-25%)</span>
</span>
</label>
</li>
<!--Конец свободного обучения-->
</ul>
</form>
</div>
<div class="cp-closest-group-price-column">
<h3 class="cp-closest-group-price-header">Для организаций*</h3>
<ul id="org" class="cp-closest-group-price-list">
<li class="cp-closest-group-price-item content-block-sh-price__with_sale">
<div>
<span class="price-format">Очно</span>
<span class="price-number">48 590 ₽
<span class="price-discount">(-10%)</span>
</span>
</div>
</li>
<li class="cp-closest-group-price-item content-block-sh-price__with_sale">
<div>
<span class="price-format">Онлайн</span>
<span class="price-number">48 590 ₽
<span class="price-discount">(-10%)</span>
</span>
</div>
</li>
<!--Свободное обучение-->
<li class="cp-closest-group-price-item content-block-sh-price__with_sale free">
<div>
<span class="price-format">
<a href="/free-learning-new" target="_blank" title="Что такое Свободное обучение?">
Свободное <br> обучение
</a>
</span>
<span class="price-number">40 490 ₽
<span class="price-discount"> (-25%)</span>
</span>
</div>
</li>
<!--Конец свободного обучения-->
</ul>
</div>
</div>
<div class="cp-closest-group-price-note">
<p>
* Для оформления заказа от организации
обращайтесь по тел. <a href="tel:+74956404844">+7 (495) 780-48-44</a>
</p>
</div>
<form class="submitedForm" action="/Cart/AddGroup" method="post" id="baseForm">
<input name="groupID" value="693631" type="hidden">
<button type="submit" class="cp-button-red nh-add-to-cart">Записаться</button>
</form>
<style>
.one-click-button{
background: #2580c3;
}
</style>
<button type="button" class="cp-button-red one-click-button js-one-click">Записаться в 1 клик</button>
<a class="all-closest-group" href="#all_courses">Посмотреть все группы</a>
</div>
</section>
<div class="sidebar-block sidebar-teachers">
<h6>Преподаватели</h6>
<div class="sidebar-block-wrap slick-course-sidebar">
<div class="sidebar-block-wrap__item">
<a class="teacher-photo-link" href="/trainer/ТРАС">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович" />
</a>
<p class="sidebar-block-wrap__title">
<strong>Тарасов</strong> Алексей Владимирович
</p>
</div>
</div>
<p class="sidebar-more a-center">
<a href="/center/coursetrainers/react"><strong>Все преподаватели по курсу</strong></a>
</p>
</div>
<div class="sidebar-block sidebar-maps">
<h6>Путеводители</h6>
<div class="sidebar-block-wrap slick-course-sidebar">
<div class="sidebar-block-wrap__item">
<a href ="/course/guide/90" target="_blank" title="Веб-дизайн">
<img src="//cdn2.specialist.ru/Content/Image/Guide/Small/webdesign-s.jpg" alt="" />
</a>
<p class="sidebar-block-wrap__title">
Веб-дизайн
</p>
</div>
<div class="sidebar-block-wrap__item">
<a href ="/course/guide/112" target="_blank" title="JavaScript-разработка">
<img src="//cdn2.specialist.ru/Content/Image/Guide/Small/javascript.jpg" alt="" />
</a>
<p class="sidebar-block-wrap__title">
JavaScript-разработка
</p>
</div>
</div>
</div>
<div class="sidebar-block sidebar-resp">
<h6>Отзывы выпускников</h6>
<div class="sidebar-block-wrap slick-course-sidebar">
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Жикина Светлана Владимировна</strong></p>
</div>
<p>
Курс просто пушка! Качество подачи как всегда на высоте, отличный видеоматериал, для стартового погружения в React - то, что нужно. Очень порадовало, что в итоге получаем проект, который можно как
<a href="/center/responsebyid/81773" class="not-link" target="_blank">далее</a>
</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Фирсов Иван Владимирович</strong></p>
</div>
<p>Курс очень понравился, потому что является практико ориентированным</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Ковалев Евгений Александрович</strong></p>
</div>
<p>Понравился раздаточный материал с отдельно вынесенными лаб.работами.</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Павлов Егор Андреевич</strong></p>
</div>
<p>Отлично сделан материал. Идеально подходит для того, чтобы понять основы React и получить представление о том, куда двигаться дальше.</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Пономарев Виталий Викторович</strong></p>
</div>
<p>Очень хороший курс, узнал много нового, закрепил свои знания по JS.</p>
</div>
</div>
<p class="sidebar-more a-center">
<a href="/center/courseresponses/react/1"><strong> Все отзывы </strong></a>
</p>
<script>
$("a.show-on-click").click(function () {
$(this).remove();
$(".show-on-click-" + $(this).attr('rel')).show();
return false;
});
</script>
</div>
<div class="sidebar-block sidebar-rec">
<h6>Рекомендуемые курсы по специальности</h6>
<div class="sidebar-block-wrap">
<div class="sidebar-block-wrap__item">
<p>
Чтобы стать профессионалом, мы рекомендуем Вам вместе с этим курсом изучить:
</p>
<ul>
<li>
<a href="/course/node?srs_rek_course=node">JavaScript. Уровень 5. Серверное программирование на Node.js</a>
</li>
<li>
<a href="/course/prakfront?srs_rek_course=prakfront">Практика создания веб-приложения (фронтенд)</a>
</li>
<li>
<a href="/course/react2?srs_rek_course=react2">JavaScript. Уровень 7. Redux Toolkit и React Router</a>
</li>
<li>
<a href="/course/time1?srs_rek_course=time1">Тайм-менеджмент — организация времени</a>
</li>
<li>
<a href="/course/proman?srs_rek_course=proman">Противодействие манипуляциям</a>
</li>
</ul>
</div>
</div>
</div>
<div class="sidebar-block sidebar-spec">
<h6>Cпециальность</h6>
<p class="profession-register-type"><span>09.02.07</span> Информационные системы и программирование</p>
</div>
</nav>
<section class="content">
<div class="sidebar sidebar-content">
<style>
.free-learning-block p{
margin: 0;
}
.mobile-formats-block{
margin-top: 5px;
}
.sidebar-more a{
margin-top: 0;
}
.sidebar-next .cp-button-red{
margin-top: 0;
}
</style>
<div class="sidebar-next">
<h2 class="cp-closest-group-header">Ближайшая группа</h2>
<div class="cp-closest-group-aditional-data">
<div class="cp-closest-group-col cp-closest-group-left">
<dl class="cp-closest-start show-calendar js-show-calendar" tabindex="0">
<dt class="grey-text">
Дата начала
</dt>
<dd>
02.03.2026
<div class="calendar-container js-calendar-container"
data-start="2026-03-02"
data-end="2026-03-05"
data-lectures="2026-03-02,2026-03-03,2026-03-04,2026-03-05">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</dd>
</dl>
<dl>
<dt class="grey-text">
Преподаватель
</dt>
<dd>
<a style="display: block;" href="/trainer/ТРАС">
<img class="cp-closest-teacher-img" src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов" />
<p class="teacher-name">Тарасов Алексей Владимирович</p>
</a>
</dd>
</dl>
</div>
<div class="cp-closest-group-col cp-closest-group-right">
<dl>
<dt class="grey-text">
Формат обучения
</dt>
<dd>
<div class="weekdays">
<!--нужны сокращенные обозначения-->
<div class="cp-closest-group-format">
<div class="sidebar-format"><span class="clickable" show="#ochnoL">Очно</span>, <span class="clickable" show="#onlineL">онлайн</span></div>
</div>
</div>
<div>
ежедневно:
</div>
<div class="time">10:00 — 17:10</div>
</dd>
</dl>
<dl>
<dd style="margin-bottom: 10px;">
<div class="sidebar-format clickable" show="#freeL">Свободное обучение</div>
<div>По вашему графику</div>
</dd>
<dt>
Любой день
</dt>
</dl>
<dl>
<dt class="grey-text">
Длительность:
</dt>
<dd>
32 ак. ч.
</dd>
</dl>
</div>
</div>
<div class="cp-closest-group-price">
<div class="grey-text tooltip-nds-block">
<span>Стоимость</span>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<div class="cp-closest-group-price-wrapper">
<div class="cp-closest-group-price-column">
<h3 class="cp-closest-group-price-header">
Для физ.лиц
</h3>
<form>
<ul id="individual" class="cp-closest-group-price-list">
<li class="cp-closest-group-price-item">
<input form="baseForm-mob" id="offline-ind-mob" type="radio" value="chlv" checked class="price-radio" name="gType">
<label for="offline-ind-mob" class="content-block-sh-price__with_sale">
<span class="price-format">Очно</span>
<span class="price-number">42 250 ₽
<span class="price-discount">(-10%)</span>
</span>
</label>
</li>
<li class="cp-closest-group-price-item">
<input form="baseForm-mob" id="online-ind-mob" type="radio" value="webchl" class="price-radio" name="gType">
<label for="online-ind-mob" class="content-block-sh-price__with_sale">
<span class="price-format">Онлайн</span>
<span class="price-number">42 250 ₽
<span class="price-discount"> (-10%)</span>
</span>
</label>
</li>
<!--Свободное обучение-->
<li class="cp-closest-group-price-item free">
<input form="baseForm-mob" id="free-mob" type="radio" value="free" class="price-radio" name="gType">
<label for="free-mob" class="content-block-sh-price__with_sale">
<span class="price-format">
<a href="/free-learning-new" target="_blank">
Свободное <br> обучение
</a>
</span>
<span class="price-number">35 240 ₽
<span class="price-discount"> (-25%)</span>
</span>
</label>
</li>
<!--Конец свободного обучения-->
</ul>
</form>
</div>
<div class="cp-closest-group-price-column">
<h3 class="cp-closest-group-price-header">Для организаций*</h3>
<ul id="org" class="cp-closest-group-price-list">
<li class="cp-closest-group-price-item content-block-sh-price__with_sale">
<div>
<span class="price-format">Очно</span>
<span class="price-number">48 590 ₽
<span class="price-discount">(-10%)</span>
</span>
</div>
</li>
<li class="cp-closest-group-price-item content-block-sh-price__with_sale">
<div>
<span class="price-format">Онлайн</span>
<span class="price-number">48 590 ₽
<span class="price-discount">(-10%)</span>
</span>
</div>
</li>
<!--Свободное обучение-->
<li class="cp-closest-group-price-item content-block-sh-price__with_sale free">
<div>
<span class="price-format">
<a href="/free-learning-new" target="_blank" title="Что такое Свободное обучение?">
Свободное <br> обучение
</a>
</span>
<span class="price-number">40 490 ₽
<span class="price-discount"> (-25%)</span>
</span>
</div>
</li>
<!--Конец свободного обучения-->
</ul>
</div>
</div>
<div class="cp-closest-group-price-note">
<p>
* Для оформления заказа от организации
обращайтесь по тел. <a href="tel:+74956404844">+7 (495) 780-48-44</a>
</p>
</div>
<form class="submitedForm" action="/Cart/AddGroup" method="post" id="baseForm-mob">
<input name="groupID" value="693631" type="hidden">
<button type="submit" class="cp-button-red nh-add-to-cart">Записаться</button>
</form>
<style>
.one-click-button{
background: #2580c3;
}
</style>
<button type="button" class="cp-button-red one-click-button js-one-click">Записаться в 1 клик</button>
<a class="all-closest-group" href="#all_courses">Посмотреть все группы</a>
</div>
</div>
<div class="sidebar-top">
<div class="sidebar-block sidebar-teachers">
<h6>Преподаватели</h6>
<div class="slick-course-sidebar">
<div class="sidebar-block-wrap__item" style="width: 100%; display: inline-block;">
<a class="teacher-photo-link" href="/trainer/ТРАС">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="">
</a>
<p class="sidebar-block-wrap__title">
<strong>Тарасов</strong> Алексей Владимирович
</p>
</div>
</div>
<p class="sidebar-more a-center">
<a href="/center/coursetrainers/react">Все преподаватели по курсу</a>
</p>
</div>
</div>
</div>
<div class="content-block content-block-desc">
<h2>Описание курса</h2>
<div class="content-block-hidden">
<p style="font-weight: 700;">
Обучение проходит на React 19
</p>
<p><strong>ReactJS</strong> — популярная JavaScript-библиотека с открытым исходным кодом. Разработана для построения пользовательских интерфейсов (UI, User Interfaces) на основе компонентного подхода. Характеризуется декларативным подходом к описанию, компоненто-ориентированностью и простотой использования. Особенности ReactJS: однонаправленный поток данных, виртуальный DOM, JSX. </p>
<p>В настоящий момент библиотека поддерживается известными соцсетями и сообществом индивидуальных разработчиков.</p>
<p>Курс познакомит вас с базовыми особенностями популярной библиотеки, даст практические навыки создания компонентов на ReactJS и его расширении JavaScript - JSX.</p>
<ul>
<li>акцент на функциональные компоненты</li>
<li>использование базовых хуков useState, useEffect</li>
<li>тестирование и сборка проекта</li>
<li>работа с контекстом</li>
</ul>
<p>Курс будет полезен для выпускников курсов направления JavaScript, а также для слушателей, ориентированных на работу с клиентской стороной.</p>
</div>
<p class="content-more content-more-show action-content-more">
<a href="#">Узнать больше</a>
</p>
</div>
<div class="content-block content-block__skills">
<div class="content-block-hidden">
<div class="content-block-column">
<div class="content-block-column__item">
<h2>Вы научитесь</h2>
<div class="content-props">
<ul>
<li>cоздавать компоненты на основе React.js;</li>
<li>создавать состояние компонентов;</li>
<li>использовать условную отрисовку;</li>
<li>тестировать и собирать приложение на React.js</li>
</ul>
</div>
</div>
</div>
<p>
Специалисты, обладающие этими знаниями и навыками, в настоящее
время крайне востребованы.
</p>
<p>
Обучение по мировым стандартам позволяет нашим выпускникам работать
в ведущих компаниях России и других стран. Они делают успешную карьеру и пользуются уважением работодателей.
</p>
</div>
<p class="content-more content-more-show action-content-more">
<a href="#">Узнать больше</a>
</p>
</div>
<style>
.content-block-column{
display:flex;
}
</style>
<div class="content-block">
<h2>Предварительная подготовка</h2>
<div class="content-block-hidden">
<p>
<strong>Требуемая подготовка:</strong> <br />
Успешное окончание курса <a href="/course/dzhsk-b">JavaScript. Уровень 2. Расширенные возможности</a>, или эквивалентная подготовка.<br />
</p>
<p>
</p>
</div>
<p class="content-more content-more-show action-content-more">
<a href="#">Узнать больше</a>
</p>
</div>
<h2>Тестирование по курсу</h2>
<div style="padding-top: 20px;padding-bottom: 15px;"><ul>
<li>
<a href="/test/1108">JavaScript. Библиотека React.js</a>
</li>
</ul></div>
<div class="content-block content-block-programm">
<div class="content-block-programm__title">
<h2>Программа курса</h2>
<div class="content-block-programm__print">
<a href="/course/print/react">
<img src="i/icon_print.png" alt="" />
<span>для печати</span></a>
</div>
</div>
<div class="content-block-programm-module">
<div class="content-block-programm-module__title js-action-programm">
<strong>Модуль 1. Введение в React и JSX
 (4 ак. ч.)
</strong>
<a href="#" class="arrow-up action-programm"></a>
</div>
<div class="content-block-programm-module-desc-wrapper" style="display: none;">
<ul>
<li>Что такое React?.</li>
<li>Установка React.</li>
<li>React Developer Tools.</li>
<li><b>Лабораторная работа:</b> установка шаблона приложения.</li>
<li><b>Лабораторная работа:</b> настройка VSCode и браузера.</li>
</ul>
</div>
</div>
<div class="content-block-programm-module">
<div class="content-block-programm-module__title js-action-programm">
<strong>Модуль 2. Компоненты React
 (8 ак. ч.)
</strong>
<a href="#" class="arrow-up action-programm"></a>
</div>
<div class="content-block-programm-module-desc-wrapper" style="display: none;">
<ul>
<li>Компоненты React.</li>
<li>Импорт и экспорт компонентов.</li>
<li>Работа с JSX.</li>
<li>Свойства компонентов (props).</li>
<li>Условная отрисовка.</li>
<li>Отрисовка массива.</li>
<li>Дочерние компоненты.</li>
<li>props.children</li>
<li>Чистота компонентов.</li>
<li>Файловая структура.</li>
<li><b>Лабораторная работа:</b> создание React-компонентов.</li>
</ul>
</div>
</div>
<div class="content-block-programm-module">
<div class="content-block-programm-module__title js-action-programm">
<strong>Модуль 3. События и состояние в React
 (4 ак. ч.)
</strong>
<a href="#" class="arrow-up action-programm"></a>
</div>
<div class="content-block-programm-module-desc-wrapper" style="display: none;">
<ul>
<li>Обзор встроенных компонентов.</li>
<li>Обработчики событий.</li>
<li>Состояние и useState.</li>
<li>Обновление объектов состояния.</li>
<li>Обработка ввода в <input />.</li>
<li>Распределение состояния между компонентами.</li>
<li>Поднятие состояния.</li>
<li>Хук useEffect.</li>
<li><b>Лабораторная работа:</b> работа с состоянием и поднятие состояния.</li>
</ul>
</div>
</div>
<div class="content-block-programm-module">
<div class="content-block-programm-module__title js-action-programm">
<strong>Модуль 4. Хуки и их применение
 (4 ак. ч.)
</strong>
<a href="#" class="arrow-up action-programm"></a>
</div>
<div class="content-block-programm-module-desc-wrapper" style="display: none;">
<ul>
<li>Работа с Refs и DOM.</li>
<li>Порталы.</li>
<li>Синхронизация с эффектами.</li>
<li>Fetch-запросы и состояние.</li>
<li>Контекст и useContext.</li>
<li>Маршрутизация.</li>
<li>Реализация модального окна.</li>
<li>Отображение товаров в каталоге.</li>
<li>Логика состояния в useReducer.</li>
</ul>
</div>
</div>
<div class="content-block-programm-module">
<div class="content-block-programm-module__title js-action-programm">
<strong>Модуль 5. Практическая работа
 (4 ак. ч.)
</strong>
<a href="#" class="arrow-up action-programm"></a>
</div>
<div class="content-block-programm-module-desc-wrapper" style="display: none;">
<ul>
<li>Создание одностраничного приложения.</li>
</ul>
</div>
</div>
<div class="content-block-programm-module">
<div class="content-block-programm-module__title js-action-programm">
<strong>Модуль 6. Обзор сторонних инструментов
 (4 ак. ч.)
</strong>
<a href="#" class="arrow-up action-programm"></a>
</div>
<div class="content-block-programm-module-desc-wrapper" style="display: none;">
<ul>
<li>Библиотеки React-компонентов.</li>
<li>Управление состоянием.</li>
<li>Маршрутизаторы.</li>
<li>Работа с формами.</li>
<li>Работа с таблицами.</li>
<li>Анимация.</li>
<li>Фреймворки.</li>
<li>Типизация и валидация.</li>
<li><b>Лабораторная работа:</b> использование инструментов.</li>
</ul>
</div>
</div>
<div class="content-block-programm-module">
<div class="content-block-programm-module__title js-action-programm">
<strong>Модуль 7. Дополнительные материалы
 (4 ак. ч.)
</strong>
<a href="#" class="arrow-up action-programm"></a>
</div>
<div class="content-block-programm-module-desc-wrapper" style="display: none;">
<ul>
<li>Тестирование и сборка.</li>
<li>Вопросы на собеседовании.</li>
<li>Подведение итогов.</li>
<li>Дорожная карта.</li>
</ul>
</div>
</div>
<div class="content-block-programm-text">
<div class="content-block-hidden">
<p class="content-block-programm-text__hours">
Аудиторная нагрузка в классе с преподавателем <strong>32 ак. ч.</strong>
<strong>+ 32 ак. ч. бесплатно*</strong>
</p>
<div>
<p style="margin:0;">* Для слушателей курса предусмотрено <strong>время для самостоятельной практической отработки и проработки материала</strong> в компьютерных классах Центра.</p>
<p style="margin:0;">Вы можете использовать его для закрепления знаний, выполнения домашних заданий и консультаций со специалистами.</p>
<p style="margin:0;">Время предоставляется <strong>бесплатно</strong> по предварительному согласованию с администратором комплекса:</p>
<ul>
<li>
для занятий <strong>с 10:00 до 17:10:</strong> дополнительное время <strong>с 9:00 до 10:00.</strong>
</li>
<li>
для занятий <strong>с 14:00 до 17:10:</strong> дополнительное время <strong>с 13:15 до 14:00.</strong>
</li>
<li>
для занятий <strong>с 18:30 до 21:30:</strong> дополнительное время <strong>с 17:10 до 17:55.</strong>
</li>
</ul>
</div>
<p class="content-block-programm-text__info">
По завершении обучения проводится <strong>итоговая аттестация.</strong> Она может проходить в виде теста на последнем занятии или основываться на результатах выполнения практических заданий в ходе курса.
</p>
</div>
<p class="content-more content-more-show v500 action-content-more">
<a href="#">Узнать больше</a>
</p>
</div>
</div>
<div class="content-block content-resp-and-teachers">
<div class="sidebar-content content-teacher">
<div>
<div class="sidebar-block">
<h6>Преподаватели</h6>
<div class ="slick-course-sidebar">
<div class="sidebar-block-wrap teachers-slider-item">
<a class="teacher-photo-link" href="/trainer/ТРАС">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="">
</a>
<p class="sidebar-block-wrap__title">
<strong>Тарасов</strong> Алексей Владимирович
</p>
</div>
</div>
<p class="sidebar-more a-center">
<a href="/center/coursetrainers/react">Все преподаватели по курсу</a>
</p>
</div>
</div>
</div>
<div class="sidebar sidebar-content">
<div class="sidebar-block sidebar-resp">
<h6>Отзывы выпускников</h6>
<div class ="slick-course-sidebar">
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Жикина Светлана Владимировна</strong></p>
</div>
<p>
Курс просто пушка! Качество подачи как всегда на высоте, отличный видеоматериал, для стартового погружения в React - то, что нужно. Очень порадовало, что в итоге получаем проект, который можно как угодно потом расширять и прикручивать бэкенд. И конечно, прикладывать к портфолио. Спасибо огромное за новые знания! Practice and more practice! :)
</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Фирсов Иван Владимирович</strong></p>
</div>
<p>
Курс очень понравился, потому что является практико ориентированным
</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Ковалев Евгений Александрович</strong></p>
</div>
<p>
Понравился раздаточный материал с отдельно вынесенными лаб.работами.
</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Павлов Егор Андреевич</strong></p>
</div>
<p>
Отлично сделан материал. Идеально подходит для того, чтобы понять основы React и получить представление о том, куда двигаться дальше.
</p>
</div>
<div class="sidebar-block-wrap__rew">
<div class="sidebar-resp-title">
<p><span>Слушатель:</span></p>
<p><strong>Пономарев Виталий Викторович</strong></p>
</div>
<p>
Очень хороший курс, узнал много нового, закрепил свои знания по JS.
</p>
</div>
</div>
<p class="sidebar-more a-center">
<a href="/center/courseresponses/react/1">Все отзывы</a>
</p>
</div>
</div>
</div>
<div class="content-block content-videos-block-mobile">
<div class="sidebar sidebar-content">
</div>
</div>
<link href="/content/course-card1125.css?v=202512082" rel="stylesheet" />
<div class="content-block content-block-sh">
<h2>Расписание групп по курсу «JavaScript. Уровень 6. Библиотека React.js»</h2>
<p>
Данный курс вы можете пройти как в очном формате, так и дистанционно в режиме
<a href="/center/educationtypes/webinar">онлайн</a>
. Чтобы записаться на онлайн-обучение, в корзине измените тип обучения на "онлайн" и выберите удобную для вас группу.
</p>
<p><a href="/chem-otlichaetsya-obuchenie">Чем онлайн-обучение отличается от других видов обучения?</a></p>
<p>
Слушатели групп, которые проходят только онлайн, могут подключиться к занятиям из аудитории УЦ Специалист.
Чтобы забронировать место, свяжитесь с менеджером заранее. Не позднее чем за 3 дня до начала занятий.
</p>
<a name="all_courses"></a>
<p class="pt-20"><strong>Сортировать:</strong></p>
<div class="content-block-sh-filter">
<div class="content-block-sh-filter__item">
<p>Режим обучения</p>
<p>
<select name="" class="SelectFilters" id="ModeFilter">
<option value="">Все</option>
<option value="УД">утро-день [10:00-17:10]</option>
<option value="В">вечер [18:00-21:30]</option>
<option value="У">утро [10:00-13:10]</option>
<option value="Д">день [14:00-17:10]</option>
<option value="ВЫХ">Выходные дни</option>
<option value="ОНЛ">Онлайн-обучение</option>
</select>
</p>
</div>
<div class="content-block-sh-filter__item">
<p>Преподаватель</p>
<p>
<select name="" class="SelectFilters" id="TeacherFilter">
<option value="">Все</option>
<option value="ТРАС">Тарасов Алексей Владимирович</option>
</select>
</p>
</div>
<div class="content-block-sh-filter__item">
<p>Место обучения</p>
<p>
<select name="" class="SelectFilters" id="ComplexFilter">
<option value="">Все</option>
<option value="Р">Радио</option>
</select>
</p>
</div>
</div>
<div class="content-block-sh-filter__sub">
<a style="cursor:pointer;" class="filter-sub__cancel">Сбросить</a>
</div>
<div class="schedule-block js-schedule-block">
<article class="schedule-item no-course notFree content-block-sh-item__oo" Webinar ="1" Holiday="" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
02.03.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
05.03.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-03-02"
data-end="2026-03-05"
data-lectures="2026-03-02,2026-03-03,2026-03-04,2026-03-05">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">46 990 ₽</div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">42 250 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">53 990 ₽</div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">48 590 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="693631" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">46 990 ₽ </div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">42 250 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">53 990 ₽ </div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">48 590 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="693631" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" Webinar ="1" Holiday="" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
03.03.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
06.03.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-03-03"
data-end="2026-03-06"
data-lectures="2026-03-03,2026-03-04,2026-03-05,2026-03-06">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">46 990 ₽</div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">42 250 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">53 990 ₽</div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">48 590 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="693632" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">46 990 ₽ </div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">42 250 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">53 990 ₽ </div>
<div class="price-discount">
-10%
</div>
</div>
<div class="final-price final-price-discount">48 590 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="693632" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" Webinar ="1" Holiday="1" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
28.03.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
18.04.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-03-28"
data-end="2026-04-18"
data-lectures="2026-03-28,2026-04-04,2026-04-11,2026-04-18">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
суббота
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674759" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674759" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" Webinar ="1" Holiday="" ModeFilter="В" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
30.03.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
08.04.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-03-30"
data-end="2026-04-08"
data-lectures="2026-03-30,2026-03-31,2026-04-01,2026-04-02,2026-04-03,2026-04-06,2026-04-07,2026-04-08">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
18:30-21:30
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674967" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674967" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" Webinar ="1" Holiday="" ModeFilter="В" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
01.04.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
10.04.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-04-01"
data-end="2026-04-10"
data-lectures="2026-04-01,2026-04-02,2026-04-03,2026-04-06,2026-04-07,2026-04-08,2026-04-09,2026-04-10">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
18:30-21:30
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674968" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674968" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="1" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
04.04.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
25.04.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-04-04"
data-end="2026-04-25"
data-lectures="2026-04-04,2026-04-11,2026-04-18,2026-04-25">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
суббота
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674760" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674760" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
01.06.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
04.06.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-06-01"
data-end="2026-06-04"
data-lectures="2026-06-01,2026-06-02,2026-06-03,2026-06-04">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674663" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674663" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
02.06.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
05.06.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-06-02"
data-end="2026-06-05"
data-lectures="2026-06-02,2026-06-03,2026-06-04,2026-06-05">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674664" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674664" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="В" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
29.06.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
08.07.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-06-29"
data-end="2026-07-08"
data-lectures="2026-06-29,2026-06-30,2026-07-01,2026-07-02,2026-07-03,2026-07-06,2026-07-07,2026-07-08">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
18:30-21:30
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674869" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674869" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="В" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
01.07.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
10.07.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-07-01"
data-end="2026-07-10"
data-lectures="2026-07-01,2026-07-02,2026-07-03,2026-07-06,2026-07-07,2026-07-08,2026-07-09,2026-07-10">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
18:30-21:30
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674870" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674870" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="1" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
03.10.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
24.10.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-10-03"
data-end="2026-10-24"
data-lectures="2026-10-03,2026-10-10,2026-10-17,2026-10-24">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
суббота
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674810" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674810" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="В" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
05.10.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
14.10.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-10-05"
data-end="2026-10-14"
data-lectures="2026-10-05,2026-10-06,2026-10-07,2026-10-08,2026-10-09,2026-10-12,2026-10-13,2026-10-14">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
18:30-21:30
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674915" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674915" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="В" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
07.10.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
16.10.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-10-07"
data-end="2026-10-16"
data-lectures="2026-10-07,2026-10-08,2026-10-09,2026-10-12,2026-10-13,2026-10-14,2026-10-15,2026-10-16">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
18:30-21:30
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674916" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674916" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="1" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
10.10.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
31.10.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-10-10"
data-end="2026-10-31"
data-lectures="2026-10-10,2026-10-17,2026-10-24,2026-10-31">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
суббота
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674811" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674811" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
07.12.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
10.12.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-12-07"
data-end="2026-12-10"
data-lectures="2026-12-07,2026-12-08,2026-12-09,2026-12-10">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674710" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674710" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<article class="schedule-item no-course notFree content-block-sh-item__oo" style='display: none;' Webinar ="1" Holiday="" ModeFilter="УД" TeacherFilter="ТРАС" ComplexFilter="Р">
<section class="schedule-date-block">
<div class="schedule-date-flex show-calendar js-show-calendar" tabindex="0"">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
08.12.2026
</dd>
</dl>
<dl>
<dt class="dt-text">Окончание</dt>
<dd class="date date-end">
11.12.2026
</dd>
</dl>
<div class="calendar-container js-calendar-container"
data-start="2026-12-08"
data-end="2026-12-11"
data-lectures="">
<div class="js-calendar"></div>
<div class="calendar-legend">
<p>
<span class="legend-label vc-date__btn">XX</span> день занятий
</p>
</div>
</div>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Время</dt>
<dd class="date date-time">
10:00-17:10
</dd>
</dl>
<dl>
<dt class="dt-text">День недели</dt>
<dd class="date date-week">
ежедневно
</dd>
</dl>
</div>
<div class="formats-notes-block">
<p class="schedule-format blue-text">
<a href="/center/educationtypes/open-classes">Открытое обучение</a>
</p>
<p class="schedule-format color-green">Очно и онлайн</p>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">Преподаватель</dt>
<dd class="teacher-flex">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name" title="Тарасов Алексей Владимирович">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd>
<a class="complex-link" href="/locations/complex/radio">
Радио
</a>
</dd>
</dl>
<ul class="metro-list">
<li>
Бауманская
</li>
<li>
Авиамоторная
</li>
</ul>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="js-price-tab active" href="#ofline">Очно</a>
</li>
<li class="price-tab">
<a class="js-price-tab " href="#online">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<!--Очно-->
<div class="price-tab-content js-price-tab-content ofline active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674711" type="hidden" />
<input name="gType" value="chlv" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
<!--Онлайн-->
<div class="price-tab-content js-price-tab-content online ">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="final-price">46 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="final-price">53 990 ₽ </div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<form action="/Cart/AddGroup" method="post">
<input name="groupID" value="674711" type="hidden" />
<input name="gType" value="webchl" type="hidden" />
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</form>
</div>
</div>
</section>
</article>
<link href="/content/select-teacher-modal.css" rel="stylesheet" />
<!--Карточка для свободного обучения-->
<article class="schedule-item no-course free-learning">
<section class="schedule-date-block">
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Начало</dt>
<dd class="date date-start">
В любое время
</dd>
</dl>
</div>
<div class="schedule-date-flex">
<dl>
<dt class="dt-text">Режим обучения</dt>
<dd class="date date-time">
Свободное обучение
</dd>
</dl>
</div>
</section>
<section class="schedule-teacher-block">
<dl>
<dt class="dt-text">
Преподаватель
</dt>
<dd class="teacher-flex js-teacher-block">
<a href="/trainer/ТРАС" class="dp-teacher-photo-wrapper">
<picture class="dp-teacher-photo">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</picture>
</a>
<div class="dp-teacher-about">
<a href="/trainer/ТРАС" class="dp-teacher-name js-teacher-name">
<div class="dp-teacher-last-name">Тарасов</div>
<div>Алексей</div>
<div>Владимирович</div>
</a>
</div>
</dd>
</dl>
<div class="modal modal2024 teacher-select-modal select-teacher-modal-shadow">
<div class="modal-shadow corp-modal-shadow js-close"></div>
<div class="modal-body select-teacher-modal">
<button class="select-teacher-popup-close js-close" type="button">
<svg class="js-close" width="36" height="36" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
<path class="js-close" d="M8.90625 9.4834L26.5839 27.1611" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
<path class="js-close" d="M8.90625 27.1611L26.5839 9.48346" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</button>
<h3 class="select-teacher-header">Выбор преподавателя</h3>
<ul class="select-teachers-list">
<li class='select-teachers-item'>
<label>
<input form='freeLearningForm' class="select-teacher-input js-teacher-radio" type="radio" name="Teacher_TC" value="ТРАС" checked />
<div class="select-photo-wrapper">
<img src="//cdn.specialist.ru/Content/Image/Employee/ТРАС.jpg" alt="Тарасов Алексей Владимирович">
</div>
<div class="teacher-name-wrapper">
<div class="teacher-name">
<a href="/trainer/ТРАС">
Тарасов
</a>
<br>
Алексей
<br>
Владимирович
</div>
</div>
</label>
</li>
</ul>
<button class="select-teacher-button js-teacher-button">Выбрать</button>
</div>
</div>
</section>
<section class="schedule-complex-block">
<dl class="complex-top">
<dt class="dt-text">Место</dt>
<dd class="free-card-place">
Онлайн
</dd>
</dl>
</section>
<section class="schedule-price-block">
<div class="schedule-price-header-block">
<p class="dt-text ">
Стоимость
</p>
<style>
.tooltip-control {
display: flex;
width: 12px;
height: 12px;
flex-shrink: 0;
justify-content: center;
align-items: center;
font-size: 8px;
margin-left: 8px;
cursor: pointer;
transition: 0.3s;
position: relative;
}
.tooltip-control svg{
display: block;
}
.tooltip-control svg *{
fill:#777777;
}
.tooltip-control:hover svg * {
transition: 0.3s;
fill: #346CE4;
}
.price-tooltip {
position: absolute;
top: 120%;
left: 0;
border-radius: 5px;
background: #fff;
padding: 6px 8px;
box-shadow: -2px -2px 5px 0 rgba(0, 0, 0, 0.05), 2px 2px 5px 0 rgba(0, 0, 0, 0.05);
color: #777;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
height: 0;
opacity: 0;
overflow: hidden;
transition: 0.2s;
max-width: 100%;
}
.tooltip-control:before {
display: none;
content: "";
width: 14px;
height: 9px;
background-position: center center;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="8" viewBox="0 0 15 8" fill="none"><path d="M6.3588 1.03037C7.15951 0.000879883 8.71549 0.000881314 9.5162 1.03037L14.9375 8.00061L0.9375 8.00061L6.3588 1.03037Z" fill="white"/></svg>');
position: absolute;
top: 10px;
left: -10px;
z-index:6;
transition: 0.3s;
}
.tooltip-control:hover:before{
display: block;
transition: 0.3s;
}
.tooltip-control:hover + .price-tooltip {
height: auto;
opacity: 1;
transition: 0.3s;
overflow: visible;
z-index: 5;
}
</style>
<span class="tooltip-control" tabindex="0">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.26562 6.87288L5.02344 3H6.47656L6.23438 6.87288H5.26562ZM5.75 9C5.53125 9 5.35156 8.92373 5.21094 8.77119C5.07031 8.61864 5 8.43785 5 8.22881C5 8.01412 5.07031 7.83616 5.21094 7.69492C5.35156 7.54802 5.53125 7.47458 5.75 7.47458C5.97396 7.47458 6.15365 7.54802 6.28906 7.69492C6.42969 7.83616 6.5 8.01412 6.5 8.22881C6.5 8.43785 6.42969 8.61864 6.28906 8.77119C6.15365 8.92373 5.97396 9 5.75 9Z" />
<path d="M10.5 6C10.5 3.19804 8.33367 1 5.75 1C3.16633 1 1 3.19804 1 6C1 8.80196 3.16633 11 5.75 11V12C2.57436 12 0 9.31371 0 6C0 2.68629 2.57436 0 5.75 0C8.92564 0 11.5 2.68629 11.5 6C11.5 9.31371 8.92564 12 5.75 12V11C8.33367 11 10.5 8.80196 10.5 6Z" />
</svg>
</span>
<div class="price-tooltip">
Стоимость не облагается НДС
</div>
</div>
<ul class="prices-tabs-list js-prices-tabs-list">
<li class="price-tab">
<a class="active">Онлайн</a>
</li>
</ul>
<div class="prices-tab-content js-prices-content">
<form id="freeLearningForm" action="/Cart/AddGroup" method="post">
<input name="gType" value="free" type="hidden">
<input name="groupID" value="686952" type="hidden" />
<div class="price-tab-content js-price-tab-content active">
<div class="price-tab-content-flex">
<!--Физики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">
46 990 ₽
</div>
<div class="price-discount">
-25%
</div>
</div>
<div class="final-price final-price-discount">35 240 ₽</div>
<h3 class="dp-grey dp-price-header">Физ.лицам</h3>
</div>
<!--Юрики-->
<div class="schedule-price-column">
<div class="price-flex">
<div class="full-price">
53 990 ₽
</div>
<div class="price-discount">
-25%
</div>
</div>
<div class="final-price final-price-discount">40 490 ₽</div>
<h3 class="dp-grey dp-price-header">Организациям</h3>
</div>
</div>
<button class="red-button price-button nh-add-to-cart">Записаться</button>
</div>
</form>
</div>
</section>
</article>
<!--Конец карточки для свободного обучения-->
<script>
document.addEventListener("click", function (e) {
var modalActive = document.querySelector(".select-teacher-modal-shadow.active");
if ((e.target).classList.contains("js-close")) {
modalActive.classList.remove("active");
}
if ((e.target.classList.contains("js-show-select"))) {
e.preventDefault();
var modal = $(e.target).closest(".free-learning").find(".select-teacher-modal-shadow");
modal.addClass("active");
}
$(".js-teacher-button").on("click", function (e) {
e.preventDefault();
const checkedInput = $(this).closest(".select-teacher-modal").find("input:checked");
const teacherName = checkedInput.val();
const teacherFullName = checkedInput.closest("label").find("img").attr("alt");
const imgPath = "//cdn.specialist.ru/Content/Image/Employee/"
const imgExt = ".jpg";
const teacherNameArray = teacherFullName.split(" ");
const teacher = {
lastName: teacherNameArray[0] || "",
firstName: teacherNameArray[1] || "",
middleName: teacherNameArray[2] || "",
imgExtSrc: `${imgPath}${teacherName}${imgExt}`
}
$(this).closest(".free-learning").find(".js-teacher-block a").attr("href", "/trainer/" + teacherName);
$(this).closest(".free-learning").find(".js-teacher-block img").attr("src", teacher.imgExtSrc).attr("alt", teacherFullName);
$(this).closest(".free-learning").find(".js-teacher-block .js-teacher-name").html(`
<div class="dp-teacher-last-name">${teacher.lastName}</div>
<div>${teacher.firstName}</div>
<div>${teacher.middleName}</div>
`);
$(this).closest(".select-teacher-modal-shadow").removeClass("active");
})
});
</script>
</div>
<p>
<span class="color-orange">*</span> Данная скидка действительна при заказе и оплате обучения только сегодня. Запишитесь прямо сейчас со скидкой!
</p>
<p class="price-note-nds">
Стоимость не облагается НДС
</p>
<div class="content-block-sh-more-groups">
<p class="content-more next5courses">
<a class="" style="cursor:pointer;">Показать еще</a>
</p>
<p class="a-center">
<a href="/Group/List?CourseTC=РЕАКТ-Б&StudyTypeId=0&pageIndex=1">Полное расписание курса</a>
</p>
</div>
</div>
<script>
//работа переключателей в карточке цен
const tabsPriceInit = () => {
const scheduleContainer = document.querySelector(".js-schedule-block");
if (!scheduleContainer) return;
scheduleContainer.addEventListener("click", (e) => {
if (!e.target.classList.contains("js-price-tab")) return;
e.preventDefault();
const tabsContainer = e.target.closest(".js-prices-tabs-list");
const tabsContentContainer = tabsContainer.nextElementSibling//(".js-prices-content");
const tabs = tabsContainer.querySelectorAll(".js-price-tab");
const tabsContent = tabsContentContainer.querySelectorAll(".js-price-tab-content");
tabs.forEach(tab => tab.classList.remove("active"));
tabsContent.forEach(tc => tc.classList.remove("active"));
const tabActiveId = e.target.getAttribute("href").replace("#", ".");
tabsContentContainer.querySelector(tabActiveId).classList.add("active");
e.target.classList.add("active");
})
}
$(document).ready(() => {
tabsPriceInit()
})
</script>
<script>
var rowsN = 0;
$(document).ready(function () {
rowsN = $(".content-block-sh__item").length;
});
var display = 5;
$(".SelectFilters").change(function () {
debugger;
display = 5;
UpdateFilsers();
});
$(".filter-sub__cancel").click(function () {
display = 5;
$(".SelectFilters").val("").change();
});
$(".next5courses").click(function () {
display += 5;
UpdateFilsers();
});
function UpdateFilsers() {
var show = 0;
var ModeFilter = $("#ModeFilter").val();
var TeacherFilter = $("#TeacherFilter").val();
var ComplexFilter = $("#ComplexFilter").val();
var tFilter = ModeFilter;
$(".next5courses").hide();
$(".schedule-item.notFree").each(function () {
$(this).hide();
var hol = true;
if (ModeFilter == "ВЫХ") {
tFilter = "";
hol = false;
if ($(this).attr("Holiday") == "1") hol = true;
}
var webinar = true;
if (ModeFilter == "ОНЛ") {
tFilter = "";
webinar = false;
if ($(this).attr("Webinar") == "1") webinar = true;
}
if (
(webinar) &&
(hol) &&
(($(this).attr("ModeFilter") == tFilter) || tFilter == "") &&
(($(this).attr("TeacherFilter") == TeacherFilter) || TeacherFilter == "") &&
(($(this).attr("ComplexFilter") == ComplexFilter) || ComplexFilter == "")
) {
show++;
if (show <= display) $(this).show();
}
});
if (show > display) $(".next5courses").show();
}
</script>
<style>
.page .content-block-price__row{
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
}
@media (max-width: 700px){
.page .content-block-price__row {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 400px){
.page .content-block-price__row {
grid-template-columns: repeat(1, 1fr);
}
}
</style>
<div class="content-block content-block-price">
<h2>Стоимость обучения</h2>
<div class="content-block-price__item" style="margin-bottom: 20px;">
<div class="content-block-price__personal">
<h6>Частным лицам</h6>
<div class="content-block-price__row">
<div class="content-block-price__col">
<p>Очно</p>
<p><strong>46 990 ₽</strong></p>
</div>
<div class="content-block-price__col">
<p>Онлайн</p>
<p><strong>46 990 ₽ </strong></p>
</div>
<div class="content-block-price__col">
<p>Свободное обучение</p>
<p style="color: gray"><strong>35 240 ₽</strong></p>
</div>
<div class="content-block-price__col">
<p>Обучение в кредит</p>
<p><strong>От 2 508 руб./месяц</strong></p>
</div>
</div>
</div>
</div>
<div class="content-block-price__item">
<div class="content-block-price__personal">
<h6>Организациям</h6>
<div class="content-block-price__row">
<div class="content-block-price__col">
<p>Очно</p>
<p><strong>53 990 ₽</strong></p>
</div>
<div class="content-block-price__col">
<p>Онлайн</p>
<p><strong>53 990 ₽</strong></p>
</div>
<div class="content-block-price__col">
<p>Свободное обучение</p>
<p style="color: gray"><strong>40 490 ₽</strong></p>
</div>
<div class="content-block-price__col">
</div>
</div>
</div>
</div>
</div>
<div class="content-block content-block-docs">
<h2>Документы об окончании</h2>
<p>
В зависимости от программы обучения выдаются следующие документы:
</p>
<div class="content-block-docs-images">
<div class="docs-slider">
<div class="content-block-docs-images__item">
<img width="200px" src="//cdn1.specialist.ru/Content/Image/CertType/Small/Cert_Common.jpg" alt="" />
<p><strong>Свидетельство выпускника</strong>
</p>
</div>
<div class="content-block-docs-images__item">
<img width="200px" src="//cdn1.specialist.ru/Content/Image/CertType/Small/Cert_Inter.jpg" alt="" />
<p><strong>Cертификат международного образца</strong>
</p>
</div>
<div class="content-block-docs-images__item">
<img width="200px" src="//cdn1.specialist.ru/Content/Image/CertType/Small/БУХ.jpg" alt="" />
<p><strong>Удостоверение о повышении квалификации</strong>
</p>
</div>
</div>
</div>
<p>
<span>*</span> Для получения удостоверения вам необходимо предоставить копию диплома о высшем или среднем профессиональном образовании.
</p>
<p>
Сертификаты международного образца выводятся после окончания курса в личном кабинете слушателя.
</p>
</div>
<div class="content-block-dp">
<h6>Больше знаний - меньше стоимость!</h6>
<div class="content-block-dp-wrap">
<div class="content-block-dp-wrap__item">
Этот курс обойдётся до 30% дешевле, если изучать его в составе дипломных программ. Пройдя обучение, Вы получите современную профессию и диплом о переподготовке.
</div>
</div>
<div class="content-block-dp-order">
<a href="/track/list/РЕАКТ-Б" class="button-default button-orange add-to-card">
Посмотреть программы со скидкой
</a>
<div class="content-block-dp-order__text">
<p>
Данное предложение действует только для частных лиц.
</p>
</div>
</div>
</div>
<div class="sidebar-block sidebar-spec only-mobile">
<h6>Cпециальность</h6>
<p class="profession-register-type"><span>09.02.07</span> Информационные системы и программирование</p>
</div>
</section>
</div>
</section>
</main>
<script src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/js/page.js"></script>
<script>
//$.cookie('KorpCartKey', '1', { expires: -1, path: '/' });
$(".nh-add-to-cart").click(function (e) {
e.preventDefault();
//debugger;
currentCartButton = $(this);
var KorpCartKey = $.cookie('KorpCartKey');
if (KorpCartKey == null) {
$("#nh-korp-dialog").show();
} else {
$("#nh-cart-dialog").show();
};
});
$(".js-cart-addcartstay").on("click", function (e) {
e.preventDefault();
onCloseModalCart();
submitCart(true);
});
$("#addcartgo").click(function (e) {
e.preventDefault();
onAddToCart($(this));
submitCart(false);
});
function submitCart(isStay) {
form = currentCartButton.parents('form');
var post_url = form.attr("action");
var request_method = form.attr("method");
var formData = new FormData(form[0]);
formData.append("ajax", "1");
$.ajax({
url: post_url,
type: request_method,
processData: false,
contentType: false,
data: formData,
error: function (jqXHR, exception) {
alert(jqXHR.status + ": " + exception)
},
success: function (response) {
if (isStay) {
UpdateHeaderState();
} else {
window.location.href = '/Cart/Details';
}
}
});
}
</script>
<script>
//календарь
document.addEventListener('DOMContentLoaded', () => {
function areDatesInSameMonth(date1, date2) {
const d1 = new Date(date1);
const d2 = new Date(date2);
return d1.getFullYear() === d2.getFullYear() && d1.getMonth() === d2.getMonth();
}
const calendarTriggers = document.querySelectorAll(".js-show-calendar");
if (!calendarTriggers) return;
calendarTriggers.forEach(el => {
// Деструктуризация конструктора Calendar
const { Calendar } = window.VanillaCalendarPro;
// Создайте экземпляр календаря и инициализируйте его.
const calendarContainer = el.querySelector(".js-calendar-container");
if (calendarContainer) {
const dateStart = calendarContainer.getAttribute("data-start");
const dateEnd = calendarContainer.getAttribute("data-end");
const dateLectures = calendarContainer.getAttribute("data-lectures").split(",") || [];
const calendarType = areDatesInSameMonth(dateStart, dateEnd) ? "default" : "multiple";
const options = {
type: calendarType,
locale: 'ru-RU',
selectionDatesMode: false,
/*selectionMonthsMode: false,
selectionYearsMode: false,*/
selectedDates: dateLectures,
selectedMonth: (new Date(dateStart)).getMonth(),
selectedYear: (new Date(dateStart)).getFullYear(),
displayMonthsCount: calendarType === "default" ? 1 : 2,
selectedTheme: 'light',
};
const calendarBlock = el.querySelector(".js-calendar");
const calendar = new Calendar(calendarBlock, options);
calendar.init();
}
})
});
</script>
<style>
.clickable{
cursor:pointer;
}
.infoL{
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom:20px;
}
.infoL h3{
margin: 0;
font-weight: 600;
color: #004677;
display: flex;
align-items: center;
text-transform: uppercase;
font-size: 14px;
}
.infoL h3:before {
display: flex;
content: 'i';
margin-right: 10px;
width: 18px;
height: 18px;
line-height: 1;
border: 2px solid #004677;
border-radius: 50%;
justify-content: center;
align-items: center;
font-weight: 800;
color: #004677;
padding-top: 1px;
text-transform: none;
font-size: 14px;
flex-shrink: 0;
}
.infoL-text{
text-align: left;
line-height: 1.4;
margin-bottom: 36px;
}
.infoL input{
background-image: url("https://cdn.specialist.ru/content/file/Site_rework/index-2/i/poll-close-btn.png");
background-repeat: no-repeat;
background-position: center center;
font-size: 0;
background-color: transparent;
border: none;
width: 20px;
height: 20px;
display: block;
}
.modal-links-block{
position: relative;
}
.modal .modal-link{
font-size: 16px;
font-weight: 500;
color: #004677;
}
.modal .modal-link:hover{
text-decoration: underline;
}
.modal .modal-link-loader{
display: none;
left: 140px;
height: 20px;
width: 20px;
transform: translateY(-50%);
}
</style>
<div id="ochnoL" class="modal modal2024 infoL-modal">
<div class="modal-shadow js-modal-format-close"></div>
<div class="modal-body">
<button class="modal-close js-modal-format-close" type="button">×</button>
<div class="infoL">
<h3>Форматы обучения</h3>
</div>
<div class="infoL-text">
<strong>Очно</strong> - классическое обучение с преподавателем в классе в составе группы.
</div>
<div class="modal-links-block">
<a class="modal-link js-modal-format-link" href="/center/educationtypes/fulltime">Подробнее</a>
<div class="loader modal-link-loader js-format-loader">Подождите...</div>
</div>
</div>
</div>
<div id="onlineL" class="modal modal2024 infoL-modal">
<div class="modal-shadow js-modal-format-close"></div>
<div class="modal-body">
<button class="modal-close js-modal-format-close" type="button">×</button>
<div class="infoL">
<h3>Форматы обучения</h3>
</div>
<div class="infoL-text">
<strong>Онлайн</strong> - классическое обучение с преподавателем онлайн в составе группы.
</div>
<div class="modal-links-block">
<a class="modal-link js-modal-format-link" href="/center/educationtypes/webinar">Подробнее</a>
<div class="loader modal-link-loader js-format-loader">Подождите...</div>
</div>
</div>
</div>
<div id="freeL" class="modal modal2024 infoL-modal">
<div class="modal-shadow js-modal-format-close"></div>
<div class="modal-body">
<button class="modal-close js-modal-format-close" type="button">×</button>
<div class="infoL">
<h3>Форматы обучения</h3>
</div>
<div class="infoL-text">
<strong>Свободное обучение</strong> - самостоятельное обучение по записям с возможностью задавать вопросы преподавателю через личный кабинет.
</div>
<div class="modal-links-block">
<a class="modal-link js-modal-format-link" href="/free-learning-new">Подробнее</a>
<div class="loader modal-link-loader js-format-loader">Подождите...</div>
</div>
</div>
</div>
<script>
$(".clickable").click(function () {
var show = $(this).attr("show");
$(show).show();
var hide = $(this).attr("hide");
$(hide).hide();
});
$(".js-modal-format-close").on("click", function(){
$(this).closest(".modal").hide();
})
$(".js-modal-format-link").on("click", function(){
$(this).closest(".modal").find(".js-format-loader").show();
})
</script>
<script type="text/javascript">
$(document).ready(function () {
$(".fancy-box").fancybox();
});
</script>
<!-- BEGIN JIVOSITE CODE {literal} -->
<script type='text/javascript' src="//code.jivosite.com/widget/Cd2oVmvYAr" async>
function jivo_onLoadCallback() {
}
</script>
<!-- Roistat Counter Start -->
<script>
(function(w, d, s, h, id) {
w.roistatProjectId = id; w.roistatHost = h;
var p = d.location.protocol == "https:" ? "https://" : "http://";
var u = /^.*roistat_visit=[^;]+(.*)?$/.test(d.cookie) ? "/dist/module.js" : "/api/site/1.0/"+id+"/init?referrer="+encodeURIComponent(d.location.href);
var js = d.createElement(s); js.charset="UTF-8"; js.async = 1; js.src = p+h+u; var js2 = d.getElementsByTagName(s)[0]; js2.parentNode.insertBefore(js, js2);
})(window, document, 'script', 'cloud.roistat.com', '54c2e1993e8103fc0d984b2f6995e2e5');
</script>
<!-- Roistat Counter End -->
<!-- BEGIN JIVOSITE INTEGRATION WITH ROISTAT -->
<script type='text/javascript'>
var getCookie = window.getCookie = function (name) {
var matches = document.cookie.match(new RegExp("(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"));
return matches ? decodeURIComponent(matches[1]) : 'nocookie';
};
function jivo_onLoadCallback() {
var visit = getCookie('roistat_visit');
if (visit === 'nocookie') {
window.onRoistatAllModulesLoaded = function () {
window.roistat.registerOnVisitProcessedCallback(function () {
jivo_api.setUserToken(window.roistat.getVisit());
});
};
} else {
jivo_api.setUserToken(visit);
}
}
</script>
<!-- END JIVOSITE INTEGRATION WITH ROISTAT -->
<!-- BEGIN WHATSAPP INTEGRATION WITH ROISTAT -->
<div class="js-whatsapp-message-container" style="display:none;">Обязательно отправьте это сообщение в первую очередь и дождитесь ответа. Ваш номер: {roistat_visit}</div>
<script>
(function () {
if (window.roistat !== undefined) {
handler();
} else {
var pastCallback = typeof window.onRoistatAllModulesLoaded === "function" ? window.onRoistatAllModulesLoaded : null;
window.onRoistatAllModulesLoaded = function () {
if (pastCallback !== null) {
pastCallback();
}
handler();
};
}
function handler() {
function init() {
appendMessageToLinks();
var delays = [1000, 5000, 15000];
setTimeout(function func(i) {
if (i === undefined) {
i = 0;
}
appendMessageToLinks();
i++;
if (typeof delays[i] !== 'undefined') {
setTimeout(func, delays[i], i);
}
}, delays[0]);
}
function replaceQueryParam(url, param, value) {
var explodedUrl = url.split('?');
var baseUrl = explodedUrl[0] || '';
var query = '?' + (explodedUrl[1] || '');
var regex = new RegExp("([?;&])" + param + "[^&;]*[;&]?");
var queryWithoutParameter = query.replace(regex, "$1").replace(/&$/, '');
return baseUrl + (queryWithoutParameter.length > 2 ? queryWithoutParameter + '&' : '?') + (value ? param + "=" + value : '');
}
function appendMessageToLinks() {
var message = document.querySelector('.js-whatsapp-message-container').textContent;
var text = message.replace(/{roistat_visit}/g, window.roistatGetCookie('roistat_visit'));
text = encodeURI(text);
var linkElements = document.querySelectorAll('[href*="//wa.me"], [href*="//api.whatsapp.com/send"], [href*="//web.whatsapp.com/send"], [href^="whatsapp://send"]');
for (var elementKey in linkElements) {
if (linkElements.hasOwnProperty(elementKey)) {
var element = linkElements[elementKey];
//только на ссылки, которые вызывают сообщения на номер Специалиста
if (element.href.indexOf("phone=74957804849") > -1) {
element.href = replaceQueryParam(element.href, 'text', text);
}
}
}
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', init);
} else {
init();
}
};
})();
</script>
<!-- END WHATSAPP INTEGRATION WITH ROISTAT -->
<style>
.content-partners {
display: flex;
justify-content: space-around;
align-items: center;
margin: 0 auto;
max-width: 1240px;
margin-bottom: 15px;
flex-wrap: wrap;
}
.content-partners a{
display: block;
margin-right: 10px;
margin-bottom: 10px;
}
.content-partners-link {
padding: 0 10px;
margin-bottom: 10px;
}
.content-partners-title {
margin: 35px auto 20px;
padding: 0px 10px;
font-weight: 600;
font-size: 24px;
line-height: 1.3;
color: #212121;
max-width: 1240px;
}
.content-partners a{
gap: 24px;
margin: 0;
flex: 1 1 200px;
}
.content-partners a img {
width: 200px;
}
</style>
<section class="bottom-vendors-section">
<h4 class="content-partners-title">Авторизации</h4>
<div class="content-partners">
<a href="/vendor/1c">
<img style="width:150px;" src="//cdn.specialist.ru/Content/File/Site_rework/index-2/i/vendor/1c-1.png" alt="1С">
</a>
<a href="/vendor/kaspersky">
<img src="//cdn.specialist.ru/Content/File/Site_rework/index-2/i/vendor/kaspersky.png" alt="Касперский" />
</a>
<a href="/vendor/astra-linux">
<img src="//cdn.specialist.ru/Content/File/Site_rework/index-2/i/vendor/astra.png" alt="Астра Линукс" />
</a>
<a href="/vendor/bazalt">
<img src="//cdn.specialist.ru/Content/File/Site_rework/index-2/i/vendor/basalt.png" alt="Базальт" />
</a>
<a href="/vendor/postgres">
<img src="//cdn.specialist.ru/Content/File/Site_rework/index-2/i/vendor/postgres.png" alt="Постгрес" />
</a>
<!--<a href="/vendor/microsoft"><img src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/i/index-2/p-ms.png" alt="Microsoft"></a>
<a href="/vendor/cisco"><img src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/i/index-2/p-cisco.png" alt="Cisco"></a>
<a href="/vendor/autodesk"><img src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/i/index-2/p-a.png" alt="Autodesk"></a>
<img src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/i/index-2/p-adobe.png" alt="" />
<a href="/vendor/corel"><img src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/i/index-2/p-corel.png" alt="Corel"></a>-->
</div>
</section>
<link rel="stylesheet" href="/content/footer2025.css">
<link rel="stylesheet" href="/content/footer-mobile2025.css?v="20260213">
<footer class="footer">
<div class="wrapper">
<div class="footer-row footer-row-logo">
<a class="footer-logo-link" href="/">
<img src="//cdn.specialist.ru/content/file/layouts/footer2025/img/logo.svg" alt="На главную" />
</a>
</div>
<div class="footer-row footer-second-row">
<section class="footer-second-row-left">
<h2 class="footer_column_item_title">
<a href="#" class="js-footer-top-menu">Учебные комплексы</a>
</h2>
<ul class="footer_column_item_content footer-complexes-list js-footer-submenu">
<li class="footer_complex">
<h3 class="footer_complex_name metro-circle__green">
<a class="footer_complex_name_link" href="/locations/complex/belorussko-savelovskii">
Белорусско-Савеловский
</a>
</h3>
<p class="footer_complex_adress">
3-я ул. Ямского Поля, д. 32, 1-й подъезд, 5-й этаж
</p>
</li>
<li class="footer_complex">
<h3 class="footer_complex_name metro-circle__yellow">
<a class="footer_complex_name_link" href="/locations/complex/radio">
Радио
</a>
</h3>
<p class="footer_complex_adress">
ул. Радио, д.24, корпус 1, 2-й подъезд, 2-й этаж
</p>
</li>
<li class="footer_complex">
<h3 class="footer_complex_name metro-circle__violet">
<a class="footer_complex_name_link" href="/locations/complex/taganskii">
Таганский
</a>
</h3>
<p class="footer_complex_adress">
ул. Воронцовская, д. 35Б, корп.2, 5-й этаж
</p>
</li>
<li class="footer_complex">
<h3 class="footer_complex_name metro-circle__dark-blue">
<a class="footer_complex_name_link" href="/locations/complex/baumanskiy">
Бауманский
</a>
</h3>
<p class="footer_complex_adress">
ул. Бауманская, д. 6, стр. 2, бизнес-центр «Виктория Плаза», 4-й этаж
</p>
</li>
</ul>
</section>
<div class="footer-second-row-right">
<div class="footer-menu-block">
<section class="footer-menu">
<h2 class="footer_column_item_title">
<a href="#" class="js-footer-top-menu">Слушателям</a>
</h2>
<ul class="footer_column_item_content js-footer-submenu">
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/special-offers">Акции</a>
</li>
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/course/seminars">Мастер-классы и вебинары</a>
</li>
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/online-testing">Онлайн-тестирование</a>
</li>
</ul>
</section>
<section class="footer-menu">
<h2 class="footer_column_item_title">
<a href="#" class="js-footer-top-menu">Корпоративным клиентам</a>
</h2>
<ul class="footer_column_item_content js-footer-submenu">
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/center/corpeducation/corporate">
Корпоративным заказчикам
</a>
</li>
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/center/references/corporate-clients/responses/1">
Отзывы компаний
</a>
</li>
</ul>
</section>
<section class="footer-menu">
<h2 class="footer_column_item_title">
<a href="#" class="js-footer-top-menu">Наш центр</a>
</h2>
<ul class="footer_column_item_content js-footer-submenu">
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/center">
Информация о центре
</a>
</li>
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/client/privateperson/responses/1">
Отзывы слушателей
</a>
</li>
<li class="footer_column_item_content_link-block">
<a class="footer_column_item_content_link-block-item" href="/center/comand/trainers">
Наши преподаватели
</a>
</li>
</ul>
</section>
</div>
<ul class="footer-socials-list">
<li>
<a class="social-links-item" href="https://vk.com/specialist_ru" target="_blank" title="Вконтакте">
<svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
<path d="M7.455 7.455C5.25 9.681 5.25 13.2405 5.25 20.37V21.63C5.25 28.749 5.25 32.3085 7.455 34.545C9.681 36.75 13.2405 36.75 20.37 36.75H21.63C28.749 36.75 32.3085 36.75 34.545 34.545C36.75 32.319 36.75 28.7595 36.75 21.63V20.37C36.75 13.251 36.75 9.6915 34.545 7.455C32.319 5.25 28.7595 5.25 21.63 5.25H20.37C13.251 5.25 9.6915 5.25 7.455 7.455ZM10.563 14.8365H14.175C14.2905 20.8425 16.9365 23.3835 19.0365 23.9085V14.8365H22.428V20.013C24.4965 19.7925 26.6805 17.43 27.4155 14.826H30.7965C30.5206 16.1739 29.9699 17.4504 29.1786 18.5759C28.3873 19.7014 27.3725 20.6517 26.1975 21.3675C27.509 22.02 28.6672 22.9433 29.5957 24.0763C30.5242 25.2093 31.2019 26.5263 31.584 27.9405H27.8565C27.0585 25.452 25.0635 23.52 22.428 23.2575V27.9405H22.008C14.826 27.9405 10.731 23.0265 10.563 14.8365Z" fill="white"/>
</svg>
Вконтакте
</a>
</li>
<li>
<a class="social-links-item" href="https://t.me/specialist_alumni" target="_blank" title="Telegram">
<svg xmlns="http://www.w3.org/2000/svg" width="43" height="42" viewBox="0 0 43 42" fill="none">
<path d="M21.5026 3.5C11.6126 3.5 3.58594 11.34 3.58594 21C3.58594 30.66 11.6126 38.5 21.5026 38.5C31.3926 38.5 39.4193 30.66 39.4193 21C39.4193 11.34 31.3926 3.5 21.5026 3.5ZM29.8159 15.4C29.5472 18.165 28.3826 24.885 27.7914 27.9825C27.5405 29.295 27.0389 29.7325 26.573 29.785C25.5339 29.8725 24.7455 29.12 23.7422 28.4725C22.1655 27.4575 21.2697 26.8275 19.7468 25.8475C17.973 24.71 19.1197 24.08 20.1409 23.065C20.4097 22.8025 24.9964 18.725 25.0859 18.3575C25.0984 18.3018 25.0967 18.2441 25.0811 18.1892C25.0655 18.1343 25.0364 18.0839 24.9964 18.0425C24.8889 17.955 24.7455 17.99 24.6201 18.0075C24.4589 18.0425 21.9505 19.67 17.0593 22.89C16.3426 23.3625 15.6976 23.6075 15.1243 23.59C14.4793 23.5725 13.2609 23.24 12.3472 22.9425C11.2184 22.5925 10.3405 22.4 10.4122 21.7875C10.448 21.4725 10.8959 21.1575 11.738 20.825C16.9697 18.6025 20.4455 17.1325 22.1834 16.4325C27.1643 14.4025 28.1855 14.0525 28.8664 14.0525C29.0097 14.0525 29.3501 14.0875 29.5651 14.2625C29.7443 14.4025 29.798 14.595 29.8159 14.735C29.798 14.84 29.8339 15.155 29.8159 15.4Z" fill="white"/>
</svg>
Telegram
</a>
</li>
<li>
<a target="_blank" title="Max" href="https://max.ru/id7736604420_bot">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1521.32 1516.58">
<path fill="white" d="M772.44 1295.02c-107.13,0 -156.91,-15.6 -243.19,-77.99 -54.92,70.2 -227.77,124.81 -235.38,31.2 0,-70.14 -15.84,-129.23 -33.31,-194.26 -21.38,-79.69 -45.16,-168.33 -45.16,-297.16 0,-307.17 253.55,-538.24 554.22,-538.24 300.58,0 536.3,242.3 536.3,541.23 0,298.89 -243.23,535.23 -533.49,535.23l0.01 -0.01zm4.34 -810.86c-146.28,-7.62 -260.42,93.24 -285.6,251.11 -20.87,130.76 16.11,290.06 47.72,298.07 14.92,3.78 53.1,-26.92 76.62,-50.31 38.73,24.94 83.14,44.28 132.52,46.82 150.2,7.82 283.26,-108.97 291.15,-258.22 7.88,-149.25 -112.21,-279.65 -262.39,-287.47l-0.02 0z"/>
</svg>
Max
</a>
</li>
</ul>
</div>
</div>
<div class="footer-third-row">
<section class="footer-contacts-section">
<h2 class="footer_column_item_title tablet-only">
Контакты
</h2>
<div class="footer-third-left">
<ul class="footer-contacts-list">
<li class="footer-contact-item">
<a href="tel:+74952323216">
+7 (495) 232-32-16
</a>
<p>
Для частных лиц
</p>
</li>
<li class="footer-contact-item">
<a href="tel:+74957804844">
+7 (495) 780-48-44
</a>
<p>
Для слушателей от организаций
</p>
</li>
<li class="footer-contact-item">
<a href="tel:+78004442835">
+7 (800) 444-28-35
</a>
<p>
Тех. поддержка
</p>
</li>
</ul>
<ul class="footer-contacts-list">
<li class="footer-contact-item">
<a href="mailto:info@specialist.ru">
info@specialist.ru
</a>
<p>
E-mail для направления вопросов
</p>
</li>
</ul>
</div>
</section>
<div class="footer-third-right">
<ul class="footer-socials-list">
<li>
<a class="social-links-item" href="https://vk.com/specialist_ru" target="_blank" title="Вконтакте">
<svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
<path d="M7.455 7.455C5.25 9.681 5.25 13.2405 5.25 20.37V21.63C5.25 28.749 5.25 32.3085 7.455 34.545C9.681 36.75 13.2405 36.75 20.37 36.75H21.63C28.749 36.75 32.3085 36.75 34.545 34.545C36.75 32.319 36.75 28.7595 36.75 21.63V20.37C36.75 13.251 36.75 9.6915 34.545 7.455C32.319 5.25 28.7595 5.25 21.63 5.25H20.37C13.251 5.25 9.6915 5.25 7.455 7.455ZM10.563 14.8365H14.175C14.2905 20.8425 16.9365 23.3835 19.0365 23.9085V14.8365H22.428V20.013C24.4965 19.7925 26.6805 17.43 27.4155 14.826H30.7965C30.5206 16.1739 29.9699 17.4504 29.1786 18.5759C28.3873 19.7014 27.3725 20.6517 26.1975 21.3675C27.509 22.02 28.6672 22.9433 29.5957 24.0763C30.5242 25.2093 31.2019 26.5263 31.584 27.9405H27.8565C27.0585 25.452 25.0635 23.52 22.428 23.2575V27.9405H22.008C14.826 27.9405 10.731 23.0265 10.563 14.8365Z" fill="white"/>
</svg>
Вконтакте
</a>
</li>
<li>
<a class="social-links-item" href="https://t.me/specialist_alumni" target="_blank" title="Telegram">
<svg xmlns="http://www.w3.org/2000/svg" width="43" height="42" viewBox="0 0 43 42" fill="none">
<path d="M21.5026 3.5C11.6126 3.5 3.58594 11.34 3.58594 21C3.58594 30.66 11.6126 38.5 21.5026 38.5C31.3926 38.5 39.4193 30.66 39.4193 21C39.4193 11.34 31.3926 3.5 21.5026 3.5ZM29.8159 15.4C29.5472 18.165 28.3826 24.885 27.7914 27.9825C27.5405 29.295 27.0389 29.7325 26.573 29.785C25.5339 29.8725 24.7455 29.12 23.7422 28.4725C22.1655 27.4575 21.2697 26.8275 19.7468 25.8475C17.973 24.71 19.1197 24.08 20.1409 23.065C20.4097 22.8025 24.9964 18.725 25.0859 18.3575C25.0984 18.3018 25.0967 18.2441 25.0811 18.1892C25.0655 18.1343 25.0364 18.0839 24.9964 18.0425C24.8889 17.955 24.7455 17.99 24.6201 18.0075C24.4589 18.0425 21.9505 19.67 17.0593 22.89C16.3426 23.3625 15.6976 23.6075 15.1243 23.59C14.4793 23.5725 13.2609 23.24 12.3472 22.9425C11.2184 22.5925 10.3405 22.4 10.4122 21.7875C10.448 21.4725 10.8959 21.1575 11.738 20.825C16.9697 18.6025 20.4455 17.1325 22.1834 16.4325C27.1643 14.4025 28.1855 14.0525 28.8664 14.0525C29.0097 14.0525 29.3501 14.0875 29.5651 14.2625C29.7443 14.4025 29.798 14.595 29.8159 14.735C29.798 14.84 29.8339 15.155 29.8159 15.4Z" fill="white"/>
</svg>
Telegram
</a>
</li>
<li>
<a target="_blank" title="Max" href="https://max.ru/id7736604420_bot">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1521.32 1516.58">
<path fill="white" d="M772.44 1295.02c-107.13,0 -156.91,-15.6 -243.19,-77.99 -54.92,70.2 -227.77,124.81 -235.38,31.2 0,-70.14 -15.84,-129.23 -33.31,-194.26 -21.38,-79.69 -45.16,-168.33 -45.16,-297.16 0,-307.17 253.55,-538.24 554.22,-538.24 300.58,0 536.3,242.3 536.3,541.23 0,298.89 -243.23,535.23 -533.49,535.23l0.01 -0.01zm4.34 -810.86c-146.28,-7.62 -260.42,93.24 -285.6,251.11 -20.87,130.76 16.11,290.06 47.72,298.07 14.92,3.78 53.1,-26.92 76.62,-50.31 38.73,24.94 83.14,44.28 132.52,46.82 150.2,7.82 283.26,-108.97 291.15,-258.22 7.88,-149.25 -112.21,-279.65 -262.39,-287.47l-0.02 0z"/>
</svg>
Max
</a>
</li>
</ul>
<ul class="footer-third-right-menu">
<li>
<a href="/svedenia-ob-organizacii">
Сведения об образовательных организациях
</a>
</li>
<li>
<a href="/start-to-be-teacher">
Вакансии для преподавателей
</a>
</li>
<li>
<a href="/rules-rec-tech">
На информационном ресурсе применяются рекомендательные технологии
</a>
</li>
</ul>
</div>
</div>
<div class="footer-latest-row">
<p class="footer-copyright">
© 1991–2026 Бауманский учебный центр «Специалист»
</p>
<ul class="payment-systems-list">
<li title="Сбербанк">
<svg xmlns="http://www.w3.org/2000/svg" width="68" height="30" viewBox="0 0 68 30" fill="none">
<path d="M44.8672 18.3906V28.2808H47.0218V24.2398H51.6167V28.2808H53.7713V18.3906H51.6167V22.4455H47.0218V18.3906H44.8672Z" fill="white"/>
<path d="M58.625 24.292H59.9654L63.2734 28.2808H66.0595L61.6499 23.1662L65.503 18.3906H63.0256L59.8147 22.6298H58.625V18.3906H56.4688V28.2808H58.625V24.292Z" fill="white"/>
<path d="M41.1581 28.2808H43.4288L39.2176 18.3906H37.0202L32.7109 28.2808H34.8944L35.7646 26.2885H40.3447L41.1581 28.2808ZM36.4068 24.6352L38.0773 20.6651L39.6465 24.6352H36.4068Z" fill="white"/>
<path d="M28.2074 22.2458H25.5851V20.0374H31.2223L31.2273 18.3906H23.4297V28.2808H27.9299C30.4542 28.2808 31.9016 27.1485 31.9016 25.1741C31.9016 23.286 30.59 22.2458 28.2074 22.2458ZM27.8328 26.6341H25.5851V23.8925H27.8328C29.2003 23.8925 29.8375 24.3515 29.8375 25.2637C29.8375 26.1955 29.1632 26.6341 27.8328 26.6341Z" fill="white"/>
<path d="M49.6159 7.04908L51.8726 5.40234H44.3203V15.2934H51.8726V13.6466H46.4749V11.1146H51.0789V9.46702H46.4749V7.04908H49.6159Z" fill="white"/>
<path d="M38.6214 9.25832H35.9992V7.04908H40.1857L42.4424 5.40234H33.8438V15.2934H38.344C40.8683 15.2934 42.3156 14.161 42.3156 12.1866C42.3156 10.2977 41.0041 9.25832 38.6214 9.25832ZM38.2435 13.6466H35.9959V10.9051H38.2435C39.6111 10.9051 40.2483 11.3632 40.2483 12.2754C40.2483 13.2072 39.574 13.6466 38.2435 13.6466Z" fill="white"/>
<path d="M57.9916 5.40234H53.875V15.2934H56.0304V12.4915H57.9874C60.6113 12.4915 62.2415 11.1252 62.2415 8.94202C62.2415 6.75887 60.6113 5.40234 57.9874 5.40234M57.9413 10.8447H56.0304V7.04908H57.9413C59.322 7.04908 60.082 7.72327 60.082 8.94691C60.082 10.1706 59.3212 10.8447 57.9413 10.8447Z" fill="white"/>
<path d="M30.143 13.1515C29.5714 13.4584 28.9309 13.6174 28.2807 13.6138C26.3377 13.6138 24.9273 12.2401 24.9273 10.348C24.9273 8.45588 26.3377 7.08713 28.2807 7.08713C28.9828 7.07712 29.6698 7.28995 30.241 7.69447L31.7872 6.5662L31.6851 6.47734C30.7794 5.69229 29.5766 5.27734 28.1975 5.27734C26.7016 5.27734 25.3439 5.77626 24.3749 6.68359C23.4058 7.59093 22.8633 8.87979 22.8633 10.2975C22.8633 11.7151 23.3984 13.0252 24.3691 13.9659C25.3398 14.9067 26.6983 15.4284 28.1835 15.4284C29.7371 15.4284 31.0939 14.892 32.0136 13.9162L30.6189 12.898L30.143 13.1515Z" fill="white"/>
<path d="M17.7383 10.3005C17.7385 9.81063 17.6944 9.32172 17.6065 8.83963L15.8339 10.1326C15.8339 10.1888 15.8339 10.2443 15.8339 10.3005C15.8354 11.703 15.3625 13.0656 14.4906 14.1709C13.6187 15.2763 12.398 16.0606 11.0234 16.3989C9.64878 16.7371 8.19933 16.6098 6.9063 16.0372C5.61327 15.4646 4.55116 14.4798 3.88938 13.2398C3.22761 11.9997 3.0043 10.576 3.25508 9.1956C3.50587 7.81524 4.2163 6.55781 5.27305 5.62389C6.32979 4.68997 7.67197 4.13338 9.08546 4.0429C10.499 3.95242 11.9023 4.33327 13.0717 5.12469L14.6731 3.95648C13.22 2.79541 11.4115 2.15789 9.5443 2.14854C7.67713 2.13919 5.8622 2.75856 4.39733 3.90502C2.93247 5.05148 1.90468 6.65693 1.48262 8.45791C1.06057 10.2589 1.26931 12.1485 2.0746 13.8165C2.87989 15.4846 4.2339 16.832 5.91443 17.6378C7.59496 18.4436 9.5022 18.6598 11.3232 18.251C13.1442 17.8422 14.7707 16.8326 15.9359 15.3879C17.1011 13.9433 17.7358 12.1493 17.7358 10.3005H17.7383Z" fill="white"/>
<path d="M16.0195 5.31641C16.4112 5.81682 16.7428 6.3607 17.0075 6.93706L9.50545 12.4121L6.37109 10.4661V8.12564L9.50545 10.0716L16.0195 5.31641Z" fill="white"/>
</svg>
</li>
<li title="Visa">
<svg xmlns="http://www.w3.org/2000/svg" width="71" height="24" viewBox="0 0 71 24" fill="none">
<path d="M65.7323 23.168L65.0666 19.8336H57.6294L56.4461 23.1443L50.485 23.1562C54.3171 13.9305 57.161 7.09669 59.0169 2.65477C59.502 1.49291 60.3629 0.90013 61.632 0.909022C62.6024 0.916926 64.186 0.917912 66.3831 0.911984L70.9922 23.1592L65.7323 23.168ZM59.3009 15.2662H64.0963L62.3065 6.90799L59.3009 15.2662ZM20.8839 0.906057L26.8775 0.911984L17.612 23.171L11.5445 23.1651C10.0187 17.2856 8.51193 11.4012 7.02415 5.51198C6.72831 4.33827 6.14256 3.51727 5.01544 3.129C4.00763 2.7832 2.33322 2.24871 -0.0078125 1.52551V0.911984H9.56831C11.225 0.911984 12.1924 1.71521 12.503 3.36315C12.8166 5.01504 13.6055 9.21787 14.8696 15.9717L20.8839 0.906057ZM35.1135 0.911984L30.3772 23.168L24.6706 23.1592L29.398 0.906057L35.1135 0.911984ZM46.6806 0.5C48.3876 0.5 50.5383 1.0335 51.7749 1.52551L50.7749 6.13737C49.6567 5.68686 47.8166 5.07925 46.2694 5.1C44.0211 5.13853 42.6306 6.08402 42.6306 6.99098C42.6306 8.46701 45.0446 9.21095 47.5296 10.8233C50.3637 12.661 50.7394 14.3119 50.7039 16.108C50.6655 19.8277 47.5296 23.5 40.9148 23.5C37.8973 23.4555 36.8086 23.2036 34.3473 22.3263L35.3886 17.5129C37.8944 18.5621 38.9564 18.897 41.0982 18.897C43.0596 18.897 44.7429 18.1027 44.7577 16.7186C44.7695 15.7345 44.166 15.2455 41.965 14.0303C39.764 12.8151 36.6755 11.1286 36.7169 7.74085C36.7672 3.4076 40.8645 0.5 46.6806 0.5Z" fill="white"/>
</svg>
</li>
<li title="Mastercard">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="30" viewBox="0 0 40 30" fill="none">
<g clip-path="url(#clip0_1052_3220)">
<path d="M7.31223 29.8524V27.8668C7.31223 27.1055 6.84393 26.6092 6.04123 26.6092C5.63996 26.6092 5.20517 26.7416 4.90414 27.1718C4.67014 26.8078 4.33574 26.6092 3.83407 26.6092C3.49953 26.6092 3.16529 26.7084 2.89762 27.0725V26.6754H2.19531V29.8524H2.89762V28.0984C2.89762 27.5359 3.19865 27.271 3.66695 27.271C4.13495 27.271 4.36926 27.5689 4.36926 28.0984V29.8524H5.07156V28.0984C5.07156 27.5359 5.4058 27.271 5.84059 27.271C6.3089 27.271 6.5429 27.5689 6.5429 28.0984V29.8524H7.31223ZM17.7129 26.6754H16.576V25.7157H15.8736V26.6754H15.2382V27.304H15.8735V28.7603C15.8735 29.4885 16.1745 29.9186 16.9772 29.9186C17.2783 29.9186 17.6125 29.8194 17.8468 29.687L17.646 29.0912C17.4454 29.2236 17.2114 29.2568 17.0441 29.2568C16.7097 29.2568 16.576 29.0582 16.576 28.7272V27.304H17.7129V26.6754ZM23.6659 26.6091C23.2646 26.6091 22.9971 26.8078 22.8298 27.0725V26.6754H22.1275V29.8524H22.8298V28.0654C22.8298 27.5359 23.0638 27.238 23.4986 27.238C23.6324 27.238 23.7996 27.2712 23.9334 27.3042L24.134 26.6424C24.0003 26.6092 23.7996 26.6092 23.6659 26.6092M14.6697 26.9403C14.3351 26.7086 13.867 26.6094 13.3653 26.6094C12.5628 26.6094 12.0277 27.0065 12.0277 27.6353C12.0277 28.1649 12.429 28.4626 13.1313 28.5619L13.4657 28.5951C13.8336 28.6611 14.0343 28.7605 14.0343 28.926C14.0343 29.1576 13.7667 29.3231 13.2984 29.3231C12.8301 29.3231 12.4624 29.1576 12.2282 28.9922L11.8938 29.5216C12.2617 29.7864 12.7634 29.9187 13.2649 29.9187C14.2014 29.9187 14.7366 29.4886 14.7366 28.8928C14.7366 28.3302 14.3018 28.0323 13.6328 27.9331L13.2984 27.9C12.9974 27.8668 12.7634 27.8008 12.7634 27.6022C12.7634 27.3705 12.9974 27.2382 13.3653 27.2382C13.7667 27.2382 14.168 27.4035 14.3686 27.5029L14.6697 26.9403ZM33.331 26.6094C32.9296 26.6094 32.6621 26.8079 32.4948 27.0726V26.6756H31.7925V29.8525H32.4948V28.0655C32.4948 27.5361 32.729 27.2382 33.1636 27.2382C33.2975 27.2382 33.4648 27.2713 33.5985 27.3044L33.7992 26.6425C33.6654 26.6094 33.4648 26.6094 33.331 26.6094ZM24.3682 28.2641C24.3682 29.2237 25.037 29.9187 26.0738 29.9187C26.542 29.9187 26.8764 29.8195 27.2108 29.5548L26.8764 28.9922C26.6089 29.1907 26.3413 29.2899 26.0403 29.2899C25.4718 29.2899 25.0705 28.8928 25.0705 28.2641C25.0705 27.6684 25.4718 27.2712 26.0403 27.2382C26.3413 27.2382 26.6089 27.3374 26.8764 27.5361L27.2108 26.9734C26.8764 26.7086 26.542 26.6094 26.0738 26.6094C25.037 26.6094 24.3682 27.3044 24.3682 28.2641ZM30.8562 28.2641V26.6756H30.1539V27.0726C29.9197 26.7749 29.5854 26.6094 29.1506 26.6094C28.2476 26.6094 27.5453 27.3044 27.5453 28.2641C27.5453 29.2237 28.2476 29.9187 29.1506 29.9187C29.6187 29.9187 29.9533 29.7533 30.1539 29.4555V29.8525H30.8562V28.2641ZM28.281 28.2641C28.281 27.7014 28.6489 27.2382 29.2508 27.2382C29.8193 27.2382 30.2208 27.6684 30.2208 28.2641C30.2208 28.8267 29.8193 29.2899 29.2508 29.2899C28.6489 29.2568 28.281 28.8267 28.281 28.2641ZM19.8868 26.6094C18.9504 26.6094 18.2814 27.2712 18.2814 28.2641C18.2814 29.2569 18.9502 29.9187 19.9202 29.9187C20.3884 29.9187 20.8567 29.7864 21.2246 29.4886L20.89 28.9922C20.6225 29.1907 20.2881 29.3231 19.9537 29.3231C19.5189 29.3231 19.0841 29.1246 18.9837 28.5618H21.3583V28.2972C21.3918 27.2712 20.7899 26.6094 19.8868 26.6094ZM19.8867 27.205C20.3213 27.205 20.6225 27.4699 20.6892 27.9663H19.0171C19.084 27.5361 19.385 27.205 19.8867 27.205ZM37.3105 28.2641V25.418H36.6082V27.0726C36.3741 26.7749 36.0397 26.6094 35.6049 26.6094C34.702 26.6094 33.9997 27.3044 33.9997 28.2641C33.9997 29.2237 34.702 29.9187 35.6049 29.9187C36.0732 29.9187 36.4076 29.7533 36.6082 29.4555V29.8525H37.3105V28.2641ZM34.7355 28.2641C34.7355 27.7014 35.1032 27.2382 35.7053 27.2382C36.2738 27.2382 36.6751 27.6684 36.6751 28.2641C36.6751 28.8267 36.2738 29.2899 35.7053 29.2899C35.1032 29.2568 34.7355 28.8267 34.7355 28.2641ZM11.2582 28.2641V26.6756H10.5559V27.0726C10.3218 26.7749 9.98739 26.6094 9.5526 26.6094C8.64966 26.6094 7.94736 27.3044 7.94736 28.2641C7.94736 29.2237 8.64966 29.9187 9.5526 29.9187C10.0209 29.9187 10.3553 29.7533 10.5559 29.4555V29.8525H11.2582V28.2641ZM8.64966 28.2641C8.64966 27.7014 9.01757 27.2382 9.61948 27.2382C10.188 27.2382 10.5895 27.6684 10.5895 28.2641C10.5895 28.8267 10.188 29.2899 9.61948 29.2899C9.01757 29.2568 8.64966 28.8267 8.64966 28.2641Z" fill="white"/>
<path d="M14.4375 2.54688H24.9721V21.2782H14.4375V2.54688Z" fill="white" fill-opacity="0.8"/>
<path d="M15.105 11.9139C15.105 8.10814 16.9108 4.73246 19.6866 2.54819C17.6467 0.959698 15.0716 0 12.2624 0C5.60694 0 0.222656 5.32809 0.222656 11.9139C0.222656 18.4997 5.60694 23.8278 12.2622 23.8278C15.0715 23.8278 17.6465 22.8681 19.6866 21.2795C16.9108 19.1284 15.105 15.7197 15.105 11.9139Z" fill="white"/>
<path d="M39.1826 11.9139C39.1826 18.4996 33.7984 23.8278 27.1431 23.8278C24.3339 23.8278 21.7588 22.8681 19.7188 21.2795C22.528 19.0954 24.3005 15.7197 24.3005 11.9139C24.3005 8.10814 22.4945 4.73246 19.7188 2.54819C21.7586 0.959698 24.3339 0 27.1431 0C33.7984 0 39.1826 5.36126 39.1826 11.9139Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_1052_3220">
<rect width="39" height="30" fill="white" transform="translate(0.222656)"/>
</clipPath>
</defs>
</svg>
</li>
<li title="Мир">
<svg xmlns="http://www.w3.org/2000/svg" width="82" height="24" viewBox="0 0 82 24" fill="none">
<g clip-path="url(#clip0_1052_3225)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M22.4271 0.5V0.510044C22.417 0.510044 19.2418 0.5 18.3951 3.52314C17.619 6.2952 15.4317 13.9485 15.3712 14.1594H14.7664C14.7664 14.1594 12.5287 6.33537 11.7425 3.5131C10.8958 0.489957 7.71057 0.5 7.71057 0.5H0.453125V23.5H7.71057V9.84061H8.01296H8.31536L12.5489 23.5H17.5888L21.8223 9.85066H22.4271V23.5H29.6845V0.5H22.4271Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M48.9362 0.5C48.9362 0.5 46.8094 0.69083 45.8115 2.91048L40.6708 14.1594H40.066V0.5H32.8086V23.5H39.6628C39.6628 23.5 41.8905 23.2991 42.8884 21.0895L47.9283 9.84061H48.5331V23.5H55.7905V0.5H48.9362Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M59.0156 10.9453V23.4999H66.2731V16.168H74.1353C77.5624 16.168 80.4654 13.9885 81.5439 10.9453H59.0156Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M74.1377 0.5H58C58.8064 4.87904 62.1025 8.39432 66.3662 9.5393C67.3339 9.80044 68.3519 9.94105 69.4002 9.94105H81.8387C81.9496 9.41878 82 8.88646 82 8.33406C82 4.00524 78.4821 0.5 74.1377 0.5Z" fill="white" fill-opacity="0.8"/>
</g>
<defs>
<clipPath id="clip0_1052_3225">
<rect width="81.5455" height="23" fill="white" transform="translate(0.453125 0.5)"/>
</clipPath>
</defs>
</svg>
</li>
</ul>
</div>
</div>
</footer>
<script>
$(".js-footer-top-menu").on("click", function (e) {
e.preventDefault();
$(this).closest("h2").siblings(".js-footer-submenu").toggleClass("active");
})
</script>
<script src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/slick/slick.js" type="text/javascript" charset="utf-8"></script>
<script src="https://cdn.specialist.ru/Content/File/Site_rework/index-2/js/app-for-prod.js"></script>
<script type="text/javascript" src="/scripts/header.js?v=20250929"></script>
<div id="cookiePolice"></div>
<script>
var cookiePolice = get_cookie("CookiePolice");
if (cookiePolice == null) {
$.get("/home/CookiePoliceBlock", function (data) {
$("#cookiePolice").html(data);
});
}
function get_cookie(cookie_name) {
var results = document.cookie.match('(^|;) ?' + cookie_name + '=([^;]*)(;|$)');
if (results)
return (unescape(results[2]));
else
return null;
}
</script>
<style>
.callback-popup {
position: absolute;
top: -10000px;
width: 1px;
height: 1px;
overflow: hidden;
/*не display: none; иначе не применится маска на телефон*/
}
.callback-popup.active{
position: fixed;
top: 0;
left: 0;
bottom:0;
right: 0;
z-index: 1012;
width: auto;
height: auto;
overflow: visible;
}
.callback-popup.active .callback-popup-shadow{
position: fixed;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0 , .5);
}
.callback-popup-body{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 98%;
max-width: 500px;
padding: 50px;
background: #fff;
border-radius: 20px;
}
.callback-text-block{
margin-bottom: 30px;
}
.callback-popup-body .input-wrapper{
margin-bottom: 24px;
position: relative;
}
.callback-popup-body .input-wrapper input[type="text"]{
display: block;
width: 100%;
border: 1px solid #EFF2F7;
height: 62px;
font-weight: 500;
font-size: 16px;
padding-left: 20px;
color: #1A1A1A;
border-radius: 15px;
background: #EFF2F7;
}
.callback-popup-body .send-form-button {
display: block;
margin: 0 auto;
padding: 15px 20px;
font-weight: 600;
font-size: 18px;
color: #FFFFFF;
text-align: center;
background: #FF6505;
border: 1px solid #FF6505;
border-radius: 15px;
cursor: pointer;
width: 100%;
}
.callback-popup-body .send-form-button:hover {
background: #FF8031;
}
.callback-popup-close{
position: absolute;
top: 10px;
right: 20px;
border: none;
background: transparent;
cursor: pointer;
font-size: 40px;
padding: 0;
line-height: 1;
}
.callback-popup-body h2{
color: #2E2E2E;
font-size: 40px;
font-weight: 600;
line-height: 1.2;
margin-bottom: 15px;
text-align: center;
}
.callback-popup-body p {
color: rgba(46, 46, 46, 0.70);
text-align: center;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
}
.callback-popup-body label{
display: block;
flex: 1;
font-weight: 500;
border-radius: 15px;
background: #EFF2F7;
padding: 20px;
font-size: 16px;
cursor: pointer;
text-align: center;
}
.callback-popup-body label:has(:checked) {
background: #002062;
color:#fff
}
.callback-loader {
display: none;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(255, 255, 255, .4);
z-index: 1013;
}
.callback-loader.active {
display: block;
}
.flex-input-wrapper{
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.callback-note{
padding-top: 10px;
color: rgba(46, 46, 46, 0.70);
text-align: center;
font-size: 14px;
font-weight: 500;
line-height: 1.4;
}
.after-send-text{
font-size: 20px;
}
@media (max-width: 500px){
.callback-popup-body {
padding: 40px 20px;
}
.callback-popup-body h2{
font-size: 32px;
}
.callback-popup-body p {
font-size: 14px;
}
.callback-note{
font-size: 12px;
}
.callback-popup-body .send-form-button {
font-size: 16px;
}
}
</style>
<script src="https://www.google.com/recaptcha/api.js" async></script>
<div class="callback-popup" id="callback-popup">
<div class="callback-popup-shadow js-callback-popup-close"></div>
<div class="callback-popup-body">
<button type="button" class="callback-popup-close js-callback-popup-close">×</button>
<div class="callback-text-block">
<h2 class="callback-popup-header">
Обратный звонок
</h2>
<p>
Оставьте свои данные ниже и наш менеджер свяжется с вами в рабочее время!
</p>
</div>
<form action="/profileu/backall" method="post" id="callback-form">
<div class="input-wrapper">
<input type="text" name="fio" placeholder="ФИО" required/>
</div>
<div class="input-wrapper js-phone-mask">
<input type="text" name="phone" placeholder="Телефон" required/>
</div>
<div class="input-wrapper">
<div class="flex-input-wrapper">
<label>
<input class="visually-hidden" type="radio" name="type" value="fiz" id="callFiz" checked/>
Физ.лицо
</label>
<label>
<input class="visually-hidden" type="radio" name="type" value="org" id="callOrg"/>
Юр.лицо
</label>
</div>
</div>
<div class="send-form-button-wrapper">
<button class="send-form-button js-send-button">Отправить</button>
</div>
</form>
<p class="callback-note">
Нажимая на кнопку, вы соглашаетесь с политикой конфиденциальности
</p>
</div>
</div>
<div class="callback-popup" id="callback-after-send-popup">
<div class="callback-popup-shadow js-callback-after-send-popup-close"></div>
<div class="callback-popup-body">
<button type="button" class="callback-popup-close js-callback-after-send-popup-close">×</button>
<h2 class="after-send-text">Спасибо за обращение! Ваш менеджер свяжется с вами в рабочее время.</h2>
</div>
</div>
<div class="callback-loader"></div>
<script>
$(document).ready(function () {
grecaptcha.ready(function () {
$('#callback-form').on('submit', function (e) {
debugger;
e.preventDefault();
var form = this;
grecaptcha.execute('6LfcR_UrAAAAAGwysdwCgeHi8EAoV2ow_QPKVAhv', { action: 'callback' })
.then(function (token) {
$('#callback-form').append(
$('<input>').attr({
type: 'hidden',
name: 'g-recaptcha-response',
value: token
})
);
$.ajax({
url: '/profileu/backall',
type: 'POST',
data: $(form).serialize(),
success: function (response) {
if (response == 'ok') {
form.reset();
$(form).find(".js-send-button").show();
/*не hide() иначе не применится маска на телефон*/
$("#callback-popup").removeClass("active");
$(".callback-loader").removeClass("active");
$("#callback-after-send-popup").addClass("active");
}
else {
$(form).find(".js-send-button").show();
$(".callback-loader").removeClass("active");
alert(response);
}
}
});
})
.catch(function (error) {
console.error('reCAPTCHA error:', error);
alert('Ошибка проверки безопасности.');
});
});
});
});
$(".js-callback-popup-close").on("click", () => {
/*не hide() иначе не применится маска на телефон*/
$("#callback-popup").removeClass("active");
$("#callback-form")[0].reset();
})
$(".js-callback-after-send-popup-close").on("click", () => {
$("#callback-after-send-popup").removeClass("active");
})
</script>
<!-- Google Tag Manager (noscript) -->
<script src="/Scripts/Views/external.services.js"></script>
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-SWMG"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<script type="text/javascript">var __cs = __cs || []; __cs.push(["setCsAccount", "7UvyNuZHKRP6euYflWDUko5c5I5FVYp2"]);</script>
<script type="application/ld+json">
{
"@@context" : "http://schema.org",
"@@type" : "Organization",
"name" : "Specialist",
"url" : "https://www.specialist.ru/",
"logo" : "https://cdn.specialist.ru/Content/Image/Main/logo.gif",
"sameAs" : [
"https://vk.com/specialist_ru",
"https://www.facebook.com/specialist.ru",
"https://www.instagram.com/specialist_baumanka/",
"https://twitter.com/Specialist_RU",
"https://www.youtube.com/user/SpecialistTV"
]
}
</script>
</body>
</html>