Skip to content

V
volga
Commit 3d0dfc5a authored by dagalkova's avatar dagalkova
Browse files
Options

update

parent 3173cc5f
Show whitespace changes
Inline Side-by-side
Showing with 1743 additions and 160 deletions
.DS_Store
View file @ 3d0dfc5a
No preview for this file type
career.html 0 → 100644
View file @ 3d0dfc5a
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Карьера</title>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/normalize.css">
</head>
<body class="body-subpage">
<div class="menu-hidden">
<div class="menu-hidden-main">
<div class="menu-hidden-mob">
<span class="menu-hidden-mob__title">Меню</span>
<img class="menu-hidden-mob__close" src="img/close_mob.svg" alt="close button">
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title">
<img class="menu-hidden-main-block__more menu-hidden-main-block__more--active" src="img/+.svg" alt="more">
Компания
</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">История предприятия</a>
<a class="menu-hidden-main-block__subtitle">Руководство</a>
<a class="menu-hidden-main-block__subtitle">Производство</a>
<a class="menu-hidden-main-block__subtitle">Стратегия развития</a>
<a class="menu-hidden-main-block__subtitle">Корпоративная политика</a>
</div>
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title">
<img class="menu-hidden-main-block__more" src="img/+.svg" alt="more">
Продукция</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">Газетная бумага</a>
<a class="menu-hidden-main-block__subtitle">Бумага для гофрирования</a>
<a class="menu-hidden-main-block__subtitle">Пухлая бумага для печатных книг</a>
<a class="menu-hidden-main-block__subtitle">Упаковочная бумага</a>
</div>
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title">
<img class="menu-hidden-main-block__more" src="img/+.svg" alt="more">
Раскрытие информации</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">Положения и сведения об обществе</a>
<a class="menu-hidden-main-block__subtitle">Годовой отчет</a>
<a class="menu-hidden-main-block__subtitle">Акционерам</a>
<a class="menu-hidden-main-block__subtitle">Производство, передача и сбыт тепловой энергии, воды</a>
<a class="menu-hidden-main-block__subtitle">Специальная оценка условий труда</a>
</div>
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title">
<img class="menu-hidden-main-block__more" src="img/+.svg" alt="more">
Устойчивое развитие</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">Безопасность и охрана</a>
<a class="menu-hidden-main-block__subtitle">Экология</a>
<a class="menu-hidden-main-block__subtitle">Ответственное лесопользование</a>
<a class="menu-hidden-main-block__subtitle">Социальная политика</a>
<a class="menu-hidden-main-block__subtitle">Рейтинг и оценка</a>
</div>
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title"><img class="menu-hidden-main-block__more" src="img/+.svg" alt="more">
Карьера</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">Вакансии</a>
</div>
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title"><img class="menu-hidden-main-block__more" src="img/+.svg" alt="more">
Закупки</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">Лесосырьевое обеспечение</a>
<a class="menu-hidden-main-block__subtitle">Обращение к поставщикам и подрядчикам</a>
<a class="menu-hidden-main-block__subtitle">Закупочные процедуры</a>
<a class="menu-hidden-main-block__subtitle">Реализация невостребованного имущества и товаров</a>
<a class="menu-hidden-main-block__subtitle">Регистрация поставщиков</a>
<a class="menu-hidden-main-block__subtitle">Контакты по закупкам</a>
</div>
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title">
<img class="menu-hidden-main-block__more" src="img/+.svg" alt="more">
Пресс-центр</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">Новости</a>
<a class="menu-hidden-main-block__subtitle">Фотогалерея</a>
<a class="menu-hidden-main-block__subtitle">Видеогалерея</a>
<a class="menu-hidden-main-block__subtitle">Корпоративная газета «Балахнинский бумажник»</a>
</div>
</div>
<div class="menu-hidden-main-block">
<a class="menu-hidden-main-block__title"><img class="menu-hidden-main-block__more" src="img/+.svg" alt="more">
Контакты</a>
<div class="menu-hidden-main-block__wrapper">
<a class="menu-hidden-main-block__subtitle">Московский филиал</a>
<a class="menu-hidden-main-block__subtitle">Нижегородский филиал</a>
</div>
</div>
</div>
<div class="menu-hidden-form">
<img class="menu-hidden-form__close" src="img/close.svg" alt="close button">
<form action="" class="form-ui">
<div class="form-ui-inner">
<div class="form-ui-inner-heading">
<span class="form-ui-inner-heading__title">Обратная связь</span>
</div>
<div class="form-ui-inner-content">
<input class="form-ui-inner-content__input" type="text" placeholder="Ваше имя">
<input class="form-ui-inner-content__input" type="tel" placeholder="Телефон">
<input class="form-ui-inner-content__input" type="email" placeholder="E-mail">
<input class="form-ui-inner-content__input" type="text" placeholder="Сообщение">
<div class="form-ui-inner-checkbox">
<input class="form-ui-inner-checkbox__input" type="checkbox" id="checkbox2" checked>
<label for="checkbox2" class="form-ui-inner-checkbox__text">Согласен на обработку персональных данных</label>
</div>
<input class="form-ui-inner-content__button" type="submit" value="ОТПРАВИТЬ">
</div>
</div>
</form>
<a class="menu-hidden-form__button" href="#">ОБРАТНАЯ СВЯЗЬ</a>
<div class="menu-hidden-form-contact">
<div class="menu-hidden-form-contact-item">
<img class="menu-hidden-form-contact-item__icon" src="img/mail.svg" alt="mail icon">
<a class="menu-hidden-form-contact-item__link" href="mailto:info@volga-paper.ru">info@volga-paper.ru</a>
</div>
<div class="menu-hidden-form-contact-item">
<img class="menu-hidden-form-contact-item__icon" src="img/phone.svg" alt="phone icon">
<a class="menu-hidden-form-contact-item__link" href="tel:+78314493316">+7 (83144) 9-33-16</a>
</div>
</div>
<div class="menu-hidden-form-social">
<a href="#" class="menu-hidden-form-social__link">
<svg class="menu-hidden-form-social__social" width="20" height="13">
<use xlink:href="img/social.svg#vk"></use>
</svg>
</a>
<a href="#" class="menu-hidden-form-social__link">
<svg class="menu-hidden-form-social__social" width="17" height="17">
<use xlink:href="img/social.svg#fb"></use>
</svg>
</a>
<a href="#" class="menu-hidden-form-social__link">
<svg class="menu-hidden-form-social__social" width="20" height="18">
<use xlink:href="img/social.svg#yt"></use>
</svg>
</a>
<a href="#" class="menu-hidden-form-social__link">
<svg class="menu-hidden-form-social__social" width="19" height="19">
<use xlink:href="img/social.svg#inst"></use>
</svg>
</a>
</div>
</div>
</div>
<header class="header header-subpage">
<nav class="navbar">
<a class="navbar-logo" href="#">
<img src="img/logo.svg" alt="logo: volga">
</a>
<a class="navbar-burger" href="#">
<svg width="20" height="13" class="navbar-burger__icon">
<use xlink:href="img/burger.svg#burger"></use>
</svg>
<span class="navbar-burger__title">Меню</span>
</a>
<ul class="menu">
<li class="menu-item">
<a class="menu-item__link" href="#">Компания</a>
<div class="submenu">
<a class="submenu-item">История предприятия</a>
<a class="submenu-item">Руководство</a>
<a class="submenu-item">Производство</a>
<a class="submenu-item">Стратегия развития</a>
<a class="submenu-item">Корпоративная политика</a>
</div>
</li>
<li class="menu-item">
<a class="menu-item__link" href="#">Продукция</a>
<div class="submenu">
<a class="submenu-item">Газетная бумага</a>
<a class="submenu-item">Бумага для перфорирования</a>
<a class="submenu-item">Пухлая бумага для печатных книг</a>
<a class="submenu-item">Упаковочная бумага</a>
</div>
</li>
<li class="menu-item">
<a class="menu-item__link" href="#">Раскрытие информации</a>
<div class="submenu">
<a class="submenu-item">Положение и сведения об обществе</a>
<a class="submenu-item">Годовой отчёт</a>
<a class="submenu-item">Акционерам</a>
<a class="submenu-item">Производство, передача и сбыт тепловой энергии, воды</a>
<a class="submenu-item">Специальная оценка условий труда</a>
</div>
</li>
<li class="menu-item">
<a class="menu-item__link" href="#">Устойчивое развитие</a>
<div class="submenu">
<a class="submenu-item">Безопасность и охрана</a>
<a class="submenu-item">Экология</a>
<a class="submenu-item">Ответственное леспользование</a>
<a class="submenu-item">Социальная политика</a>
<a class="submenu-item">Рейтинг и оценка</a>
</div>
</li>
<li class="menu-item">
<a class="menu-item__link" href="#">Карьера</a>
<div class="submenu">
<a class="submenu-item">Вакансии</a>
</div>
</li>
<li class="menu-item">
<a class="menu-item__link" href="#">Закупки</a>
<div class="submenu">
<a class="submenu-item">Лесосырьевое обеспечение</a>
<a class="submenu-item">Обращение к поставщикам и подрядчикам</a>
<a class="submenu-item">Закупочные процедуры</a>
<a class="submenu-item">Реализация невостребованного имущества и товаров</a>
<a class="submenu-item">Регистрация поставщиков</a>
<a class="submenu-item">Контакты по закупкам</a>
</div>
</li>
<li class="menu-item">
<a class="menu-item__link" href="#">Пресс-центр</a>
<div class="submenu">
<a class="submenu-item">Новости</a>
<a class="submenu-item">Фотогалерея</a>
<a class="submenu-item">Видеогалерея</a>
<a class="submenu-item">Корпоративная газета «Балахнинский бумажник»</a>
</div>
</li>
<li class="menu-item">
<a class="menu-item__link" href="#">Контакты</a>
<div class="submenu">
<a class="submenu-item">Московский офис</a>
<a class="submenu-item">Нижегородский офис</a>
</div>
</li>
</ul>
<ul class="second-menu">
<li class="second-menu-item search-link">
<a class="second-menu-item__link" href="#">
<svg class="second-menu-item__link__icon" width="20" height="20" viewBox="0 0 20 20">
<use xlink:href="img/second_menu.svg#search"></use>
</svg>
</a>
</li>
<li class="second-menu-item">
<a class="second-menu-item__link" href="#">
<div class="second-menu-item__link__login">
<svg class="second-menu-item__link__icon" width="20" height="20" viewBox="0 0 20 20">
<use xlink:href="img/second_menu.svg#login"></use>
</svg>
<span>Войти</span>
</div>
</a>
<div class="submenu second-submenu">
<a class="submenu-item">Поставщикам</a>
<a class="submenu-item">Покупателям</a>
</div>
</li>
<li class="second-menu-item">
<a class="second-menu-item__link" href="#">
<div class="second-menu-item__link__lang">
<span>EN</span>
<svg class="second-menu-item__link__icon" width="8" height="6" viewBox="0 0 8 6">
<use xlink:href="img/second_menu.svg#down"></use>
</svg>
</div>
</a>
<div class="submenu second-submenu">
<a class="submenu-item">RU</a>
<a class="submenu-item">EN</a>
</div>
</li>
</ul>
</nav>
<div class="search">
<a class="search-close" href="#">
Закрыть<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a>
<input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ">
</div>
<div class="separator"></div>
<ul class="second-mob">
<li class="second-mob-item">
<a class="second-mob-item__link" href="#">
<svg class="second-mob-item__link__icon" width="20" height="20" viewBox="0 0 20 20">
<use xlink:href="img/second_menu.svg#search"></use>
</svg>
<span>Поиск</span>
</a>
</li>
<li class="second-mob-item">
<a class="second-mob-item__link" href="#">
<div class="second-mob-item__link__login">
<svg class="second-mob-item__link__icon" width="20" height="20" viewBox="0 0 20 20">
<use xlink:href="img/second_menu.svg#login"></use>
</svg>
<span>Войти</span>
</div>
</a>
</li>
</ul>
<div class="heading-other">
<div class="heading-other-nav">
<a href="#" class="heading-other-nav__page">Главная</a>
<img class="heading-other-nav__icon" src="img/heading_nav.svg" alt="nav icon">
<a href="#" class="heading-other-nav__page heading-other-nav__page--current">Карьера</a>
</div>
<h1 class="heading-other__title">Карьера</h1>
</div>
</header>
<section class="corp">
<div class="corp-wrapper">
<a class="corp-wrapper__btn" href="#programs">Программы для сотрудников</a>
<a class="corp-wrapper__btn" href="#educ">Обучение и развитие</a>
<a class="corp-wrapper__btn" href="#stud">Студентам и выпускникам</a>
<a class="corp-wrapper__btn" href="#vac">Вакансии</a>
<a class="corp-wrapper__btn" href="#cont">Контакты</a>
</div>
<div class="corp-content">
<div id="programs" class="corp-content-wrapper">
<img class="corp-content__photo" src="img/career_photo.jpg" alt="career photo">
</div>
<div class="corp-content-wrapper">
<h2 class="corp-content__title">Развитие персонала</h2>
<p class="corp-content-wrapper__text">Постоянное совершенствование уже использующихся, внедрение вновь разработанных технологий в производство, изменения в документальной, нормативно-правовой базе, устаревание имеющихся знаний и умений и другие причины влекут необходимость постоянного развития персонала предприятия.</p>
<p class="corp-content-wrapper__bold">Развитие персонала АО «Волга» проводится по трем направлениям:</p>
<ul class="corp-content-wrapper-list">
<li class="corp-content-wrapper-list__item">профессиональное обучение;</li>
<li class="corp-content-wrapper-list__item">наставничество (коучинг) в период адаптации работников;</li>
<li class="corp-content-wrapper-list__item">повышение профессионального мастерства и квалификации сотрудников.</li>
</ul>
<p class="corp-content-wrapper__text">Программа профессионального обучения реализуется согласно полученной Лицензии на осуществление образовательной деятельности с целью приобретения обучающимися знаний, умений, навыков, формирования компетенций, необходимых для выполнения определенных трудовых, служебных функций. Обучение проходит в специально оборудованном учебном классе на территории предприятия. Практические занятия проводятся непосредственно на рабочем месте обучающихся. Образовательные программы разрабатываются ведущими специалистами АО «Волга».</p>
</div>
<div id="vac" class="corp-content-wrapper">
<h2 class="corp-content__title">Вакансии</h2>
<div class="vac-all">
<div class="vac-all-item">
<div class="vac-all-item-heading">
<svg class="vac__icon vac__plus">
<use xlink:href="img/vac+.svg#vac+"></use>
</svg>
<svg class="vac__icon vac__minus">
<use xlink:href="img/vac-.svg#vac-"></use>
</svg>
<h4 class="vac__title">Контролер КП</h4>
<p class="vac__salary">30 000 руб.</p>
</div>
<div class="vac-all-item-inner">
<div class="vac-wrapper">
<p class="vac__bold">Требуемый опыт работы: <span class="vac__text">1—3 года</span></p>
<p class="vac__bold">Полная занятость, сменный график</p>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Обязанности:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Контроль за соблюдением режима</li>
<li class="vac-list__item">Обеспечение безопасности на территории поста</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Требования:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Добросовестность, ответственность.</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Условия:</p>
<p class="vac__text">График: сутки через трое</p>
<p class="vac__text">Работа по адресу: г.Воронеж, ул. Б.Хмельницкого, д,51 а</p>
<p class="vac__text">Оформление согласно ТК РФ.</p>
</div>
<div class="vac-buttons">
<a class="vac__button" href="#">ОТКЛИКНУТЬСЯ</a>
<a class="vac__call" href="#">
<svg class="vac__call__icon">
<use xlink:href="img/vac_call.svg#vac_call"></use>
</svg>
ПОЗВОНИТЬ</a>
</div>
</div>
</div>
<div class="vac-all-item">
<div class="vac-all-item-heading">
<svg class="vac__icon vac__plus">
<use xlink:href="img/vac+.svg#vac+"></use>
</svg>
<svg class="vac__icon vac__minus">
<use xlink:href="img/vac-.svg#vac-"></use>
</svg>
<h4 class="vac__title">Электромонтер диспетчерского оборудования и телеавтоматики</h4>
<p class="vac__salary">30 000 руб.</p>
</div>
<div class="vac-all-item-inner">
<div class="vac-wrapper">
<p class="vac__bold">Требуемый опыт работы: <span class="vac__text">1—3 года</span></p>
<p class="vac__bold">Полная занятость, сменный график</p>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Обязанности:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Контроль за соблюдением режима</li>
<li class="vac-list__item">Обеспечение безопасности на территории поста</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Требования:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Добросовестность, ответственность.</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Условия:</p>
<p class="vac__text">График: сутки через трое</p>
<p class="vac__text">Работа по адресу: г.Воронеж, ул. Б.Хмельницкого, д,51 а</p>
<p class="vac__text">Оформление согласно ТК РФ.</p>
</div>
<div class="vac-buttons">
<a class="vac__button" href="#">ОТКЛИКНУТЬСЯ</a>
<a class="vac__call" href="#">
<svg class="vac__call__icon">
<use xlink:href="img/vac_call.svg#vac_call"></use>
</svg>
ПОЗВОНИТЬ</a>
</div>
</div>
</div>
<div class="vac-all-item">
<div class="vac-all-item-heading">
<svg class="vac__icon vac__plus">
<use xlink:href="img/vac+.svg#vac+"></use>
</svg>
<svg class="vac__icon vac__minus">
<use xlink:href="img/vac-.svg#vac-"></use>
</svg>
<h4 class="vac__title">Машинист БДМ</h4>
<p class="vac__salary">30 000 руб.</p>
</div>
<div class="vac-all-item-inner">
<div class="vac-wrapper">
<p class="vac__bold">Требуемый опыт работы: <span class="vac__text">1—3 года</span></p>
<p class="vac__bold">Полная занятость, сменный график</p>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Обязанности:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Контроль за соблюдением режима</li>
<li class="vac-list__item">Обеспечение безопасности на территории поста</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Требования:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Добросовестность, ответственность.</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Условия:</p>
<p class="vac__text">График: сутки через трое</p>
<p class="vac__text">Работа по адресу: г.Воронеж, ул. Б.Хмельницкого, д,51 а</p>
<p class="vac__text">Оформление согласно ТК РФ.</p>
</div>
<div class="vac-buttons">
<a class="vac__button" href="#">ОТКЛИКНУТЬСЯ</a>
<a class="vac__call" href="#">
<svg class="vac__call__icon">
<use xlink:href="img/vac_call.svg#vac_call"></use>
</svg>
ПОЗВОНИТЬ</a>
</div>
</div>
</div>
<div class="vac-all-item">
<div class="vac-all-item-heading">
<svg class="vac__icon vac__plus">
<use xlink:href="img/vac+.svg#vac+"></use>
</svg>
<svg class="vac__icon vac__minus">
<use xlink:href="img/vac-.svg#vac-"></use>
</svg>
<h4 class="vac__title">Слесарь по ремонту и обслуживанию перегрузочных машин</h4>
<p class="vac__salary">30 000 руб.</p>
</div>
<div class="vac-all-item-inner">
<div class="vac-wrapper">
<p class="vac__bold">Требуемый опыт работы: <span class="vac__text">1—3 года</span></p>
<p class="vac__bold">Полная занятость, сменный график</p>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Обязанности:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Контроль за соблюдением режима</li>
<li class="vac-list__item">Обеспечение безопасности на территории поста</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Требования:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Добросовестность, ответственность.</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Условия:</p>
<p class="vac__text">График: сутки через трое</p>
<p class="vac__text">Работа по адресу: г.Воронеж, ул. Б.Хмельницкого, д,51 а</p>
<p class="vac__text">Оформление согласно ТК РФ.</p>
</div>
<div class="vac-buttons">
<a class="vac__button" href="#">ОТКЛИКНУТЬСЯ</a>
<a class="vac__call" href="#">
<svg class="vac__call__icon">
<use xlink:href="img/vac_call.svg#vac_call"></use>
</svg>
ПОЗВОНИТЬ</a>
</div>
</div>
</div>
<div class="vac-all-item">
<div class="vac-all-item-heading">
<svg class="vac__icon vac__plus">
<use xlink:href="img/vac+.svg#vac+"></use>
</svg>
<svg class="vac__icon vac__minus">
<use xlink:href="img/vac-.svg#vac-"></use>
</svg>
<h4 class="vac__title">Контролер КП</h4>
<p class="vac__salary">30 000 руб.</p>
</div>
<div class="vac-all-item-inner">
<div class="vac-wrapper">
<p class="vac__bold">Требуемый опыт работы: <span class="vac__text">1—3 года</span></p>
<p class="vac__bold">Полная занятость, сменный график</p>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Обязанности:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Контроль за соблюдением режима</li>
<li class="vac-list__item">Обеспечение безопасности на территории поста</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Требования:</p>
</div>
<div class="vac-wrapper">
<ul class="vac-list">
<li class="vac-list__item">Добросовестность, ответственность.</li>
</ul>
</div>
<div class="vac-wrapper">
<p class="vac__bold">Условия:</p>
<p class="vac__text">График: сутки через трое</p>
<p class="vac__text">Работа по адресу: г.Воронеж, ул. Б.Хмельницкого, д,51 а</p>
<p class="vac__text">Оформление согласно ТК РФ.</p>
</div>
<div class="vac-buttons">
<a class="vac__button" href="#">ОТКЛИКНУТЬСЯ</a>
<a class="vac__call" href="#">
<svg class="vac__call__icon">
<use xlink:href="img/vac_call.svg#vac_call"></use>
</svg>
ПОЗВОНИТЬ</a>
</div>
</div>
</div>
</div>
</div>
<div id="stud" class="corp-content-wrapper">
<img class="corp-content__photo" src="img/career_photo2.jpg" alt="career photo2">
</div>
<div class="corp-content-wrapper">
<h2 id="quote" class="corp-content__title">Студентам и выпускникам</h2>
<p class="corp-content-wrapper__text">Акционерное общество «Волга» заинтересовано в активных молодых специалистах, прилагающих усилия для саморазвития и самореализации.</p>
<p class="corp-content-wrapper__bold">Приглашаем студентов на производственную и преддипломную практику и предлагаем:</p>
<ul class="corp-content-wrapper-list">
<li class="corp-content-wrapper-list__item">реальный производственный опыт: работа в цехе с опытным наставником;</li>
<li class="corp-content-wrapper-list__item">профессиональное развитие: обучение выбранной профессии и личной эффективности;</li>
<li class="corp-content-wrapper-list__item">возможность начать свою карьеру еще во время учебы: лучшие студенты по итогам практики получают предложение по трудоустройству.</li>
</ul>
<p class="corp-content-wrapper__text">Программа профессионального обучения реализуется согласно полученной Лицензии на осуществление образовательной деятельности с целью приобретения обучающимися знаний, умений, навыков, формирования компетенций, необходимых для выполнения определенных трудовых, служебных функций. Обучение проходит в специально оборудованном учебном классе на территории предприятия. Практические занятия проводятся непосредственно на рабочем месте обучающихся. Образовательные программы разрабатываются ведущими специалистами АО «Волга».</p>
</div>
</div>
</section>
<section class="form form-subpage section-subpage">
<form action="" class="form-ui">
<div class="form-ui-inner">
<div class="form-ui-inner-heading">
<span class="form-ui-inner-heading__title">Обратная связь</span>
<span class="form-ui-inner-heading__text">Оставьте свои контакты и мы свяжемся с Вами!</span>
</div>
<div class="form-ui-inner-content">
<input class="form-ui-inner-content__input" type="text" placeholder="Ваше имя">
<input class="form-ui-inner-content__input" type="tel" placeholder="Телефон">
<input class="form-ui-inner-content__input" type="email" placeholder="E-mail">
<input class="form-ui-inner-content__input" type="text" placeholder="Сообщение">
<input class="form-ui-inner-content__button" type="submit" value="ОТПРАВИТЬ">
</div>
<div class="form-ui-inner-checkbox">
<input class="form-ui-inner-checkbox__input" type="checkbox" id="checkbox1" checked>
<label for="checkbox1" class="form-ui-inner-checkbox__text">Нажимая на кнопку «Отправить», вы соглашаетесь на обработку персональных данных</label>
</div>
</div>
</form>
</section>
<footer class="footer">
<nav class="footer-navbar">
<a class="footer-navbar-logo" href="#">
<img src="img/logo.svg" alt="logo: volga">
</a>
<ul class="footer-menu">
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Компания</a></li>
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Продукция</a></li>
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Пресс-центр</a></li>
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Устойчивое развитие</a></li>
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Поставщикам</a></li>
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Раскрытие информации</a></li>
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Карьера</a></li>
<li class="footer-menu-item"><a class="footer-menu-item__link" href="#">Контакты</a></li>
</ul>
</nav>
<div class="footer-info">
<div class="footer-info-social">
<a href="#" class="footer-info-social__link">
<svg class="footer-info-social__icon" width="20" height="13">
<use xlink:href="img/social.svg#vk"></use>
</svg>
</a>
<a href="#" class="footer-info-social__link">
<svg class="footer-info-social__icon" width="17" height="17">
<use xlink:href="img/social.svg#fb"></use>
</svg>
</a>
<a href="#" class="footer-info-social__link">
<svg class="footer-info-social__icon" width="20" height="18">
<use xlink:href="img/social.svg#yt"></use>
</svg>
</a>
<a href="#" class="footer-info-social__link">
<svg class="footer-info-social__icon" width="19" height="19">
<use xlink:href="img/social.svg#inst"></use>
</svg>
</a>
</div>
<span class="footer-info__copy">© 2021 АО «Волга»</span>
<div class="footer-info-dev">
<span class="footer-info-dev__text">Разработка сайта</span>
<img src="img/logo_r52.svg" alt="logo r52">
</div>
</div>
</footer>
<script defer src="js/index.js"></script>
<script defer src="js/menu_subpage.js"></script>
<script defer src="js/smothScroll.js"></script>
<script defer src="js/vac.js"></script>
</body>
</html>
\ No newline at end of file
company.html
View file @ 3d0dfc5a
...@@ -284,7 +284,10 @@ ...@@ -284,7 +284,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
...@@ -358,10 +361,14 @@ ...@@ -358,10 +361,14 @@
</div> </div>
<div class="company-video company-video-subpage"> <div class="company-video company-video-subpage">
</div> </div>
<a class="company-button company-button-subpage" href="#"> <div class="company-button company-button-subpage">
<img class="company-button__icon" src="img/video_button.png" alt="wacth video icon"> <a class="company-button-link" href="#">
<img class="company-button__icon company-button__icon--normal" src="img/video_button.svg" alt="wacth video">
<img class="company-button__icon company-button__icon--hover" src="img/video_button_hover.svg" alt="wacth video">
<img class="company-button__icon company-button__icon--active" src="img/video_button_active.svg" alt="wacth video">
<img class="company-button__text" src="img/video_button_text.png" alt="wacth video text"> <img class="company-button__text" src="img/video_button_text.png" alt="wacth video text">
</a> </a>
</div>
<div class="company-top"> <div class="company-top">
<div class="company-top-item"> <div class="company-top-item">
<span class="company-top-item__num">Топ-100</span> <span class="company-top-item__num">Топ-100</span>
......
corp_politica.html
View file @ 3d0dfc5a
...@@ -284,7 +284,10 @@ ...@@ -284,7 +284,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
......
head.html
View file @ 3d0dfc5a
...@@ -284,7 +284,10 @@ ...@@ -284,7 +284,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
......
history.html
View file @ 3d0dfc5a
...@@ -284,7 +284,10 @@ ...@@ -284,7 +284,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
...@@ -476,20 +479,20 @@ ...@@ -476,20 +479,20 @@
</div> </div>
</div> </div>
</div> </div>
<a href="#0" class="timeline-content-line-wrapper-events__prev"> <a href="#" class="timeline-content-line-wrapper-events__prev"></a>
<img src="img/prev.png" alt="prev"> <a href="#" class="timeline-content-line-wrapper-events__next"></a>
</a>
<a href="#0" class="timeline-content-line-wrapper-events__next">
<img src="img/next.png" alt="next">
</a>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<section class="history-video"> <section class="history-video">
<div class="history-video-button"> <div class="history-video-button">
<img class="history-video-button__icon" src="img/video_button.png" alt="watch video icon"> <a class="company-button-link" href="#">
<img class="history-video-button__text" src="img/video_button_text_white.png" alt="watch video text"> <img class="history-video-button__icon company-button__icon company-button__icon--normal" src="img/video_button.svg" alt="wacth video">
<img class="history-video-button__icon company-button__icon company-button__icon--hover" src="img/video_button_hover.svg" alt="wacth video">
<img class="history-video-button__icon company-button__icon company-button__icon--active" src="img/video_button_active.svg" alt="wacth video">
<img class="history-video-button__text company-button__text" src="img/video_button_text_white.png" alt="watch video text">
</a>
</div> </div>
<div class="history-video-about"> <div class="history-video-about">
<p class="history-video-about__title">Предприятие сегодня</p> <p class="history-video-about__title">Предприятие сегодня</p>
......
img/next.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect opacity="0.2" y="0.729736" width="40" height="40" fill="#029745"/>
<path d="M20 10.7297L18.6 12.1297L26.2 19.7297H10V21.7297H26.2L18.6 29.3297L20 30.7297C23.7 27.0297 26.5 24.2297 30 20.7297C26 16.7297 28.8 19.5297 20 10.7297Z" fill="white"/>
</svg>
img/next_hover.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect opacity="1" y="0.729736" width="40" height="40" fill="#029745"/>
<path d="M20 10.7297L18.6 12.1297L26.2 19.7297H10V21.7297H26.2L18.6 29.3297L20 30.7297C23.7 27.0297 26.5 24.2297 30 20.7297C26 16.7297 28.8 19.5297 20 10.7297Z" fill="white"/>
</svg>
img/prev.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect opacity="0.2" width="40" height="40" transform="matrix(-1 0 0 1 40 0.729736)" fill="#029745"/>
<path d="M20 10.7297L21.4 12.1297L13.8 19.7297H30V21.7297H13.8L21.4 29.3297L20 30.7297C16.3 27.0297 13.5 24.2297 10 20.7297C14 16.7297 11.2 19.5297 20 10.7297Z" fill="white"/>
</svg>
img/prev_hover.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect opacity="1" width="40" height="40" transform="matrix(-1 0 0 1 40 0.729736)" fill="#029745"/>
<path d="M20 10.7297L21.4 12.1297L13.8 19.7297H30V21.7297H13.8L21.4 29.3297L20 30.7297C16.3 27.0297 13.5 24.2297 10 20.7297C14 16.7297 11.2 19.5297 20 10.7297Z" fill="white"/>
</svg>
img/product1.png
View replaced file @ 3173cc5f View file @ 3d0dfc5a
img/product1.png

59.7 KB | W: | H:

img/product1.png

58.6 KB | W: | H:

img/product1.png
img/product1.png
img/product1.png
img/product1.png
  • 2-up
  • Swipe
  • Onion skin
img/product2.png
View replaced file @ 3173cc5f View file @ 3d0dfc5a
img/product2.png

116 KB | W: | H:

img/product2.png

115 KB | W: | H:

img/product2.png
img/product2.png
img/product2.png
img/product2.png
  • 2-up
  • Swipe
  • Onion skin
img/product3.png
View replaced file @ 3173cc5f View file @ 3d0dfc5a
img/product3.png

86.4 KB | W: | H:

img/product3.png

85.1 KB | W: | H:

img/product3.png
img/product3.png
img/product3.png
img/product3.png
  • 2-up
  • Swipe
  • Onion skin
img/search_close.svg
View file @ 3d0dfc5a
<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="0" height="0" class="hidden">
<rect x="14.3652" y="0.721802" width="2" height="20" transform="rotate(45 14.3652 0.721802)" fill="#16291F"/> <symbol xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 17" id="search_close">
<rect width="2" height="20" transform="matrix(-0.707107 0.707107 0.707107 0.707107 1.41406 0.721802)" fill="#16291F"/> <path d="M14.365.722l1.414 1.414L1.637 16.278.223 14.864z"></path>
<path d="M1.414.722L0 2.136l14.142 14.142 1.414-1.414z"></path>
</symbol>
</svg> </svg>
\ No newline at end of file
img/vac+.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="0" height="0" class="hidden">
<symbol xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 35" id="vac+">
<path d="M17 1.73v32m16-16H1" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
</symbol>
</svg>
img/vac-.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="0" height="0" class="hidden">
<symbol xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 3" id="vac-">
<path d="M33 1.23H1" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
</symbol>
</svg>
\ No newline at end of file
img/vac_call.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="0" height="0" class="hidden">
<symbol xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 13" id="vac_call">
<path d="M11.974 10.027c-.034-.102-.25-.253-.648-.451a19.927 19.927 0 00-.46-.256 23.334 23.334 0 01-.997-.562 11.22 11.22 0 00-.213-.15 2.395 2.395 0 00-.303-.183.558.558 0 00-.243-.06c-.113 0-.255.081-.426.243a4.15 4.15 0 00-.468.529 5.18 5.18 0 01-.452.528c-.159.162-.29.243-.392.243a.58.58 0 01-.192-.042 1.99 1.99 0 01-.175-.073c-.04-.02-.107-.06-.204-.12a5.25 5.25 0 00-.162-.097 8.956 8.956 0 01-2.003-1.483A8.951 8.951 0 013.153 6.09a4.92 4.92 0 00-.098-.162 3.08 3.08 0 01-.12-.205 1.845 1.845 0 01-.071-.174.577.577 0 01-.043-.192c0-.102.08-.233.243-.392.162-.16.338-.31.528-.452.19-.142.367-.298.529-.468.162-.17.242-.313.242-.426 0-.08-.02-.16-.06-.243a2.247 2.247 0 00-.182-.303c-.083-.12-.133-.19-.15-.213a18.751 18.751 0 01-.264-.456 43.06 43.06 0 01-.298-.541 20.245 20.245 0 00-.256-.46c-.198-.398-.349-.614-.451-.648a.477.477 0 00-.18-.026c-.153 0-.353.029-.6.086a3.375 3.375 0 00-.584.179c-.284.119-.585.466-.903 1.04C.145 2.566 0 3.095 0 3.617a3.291 3.291 0 00.136.938c.052.182.093.317.124.405.031.088.09.245.175.473.085.227.136.366.153.417a7.72 7.72 0 00.707 1.492c.449.727 1.061 1.479 1.837 2.254.775.776 1.527 1.388 2.254 1.837.437.272.935.508 1.492.707.05.017.19.068.417.154.227.085.385.143.473.174.088.032.223.073.405.124a3.268 3.268 0 00.937.137c.523 0 1.052-.145 1.585-.435.574-.318.92-.62 1.04-.904a3.35 3.35 0 00.179-.584 2.8 2.8 0 00.085-.6c0-.08-.008-.14-.025-.18z"></path>
</symbol>
</svg>
img/valid.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="20" height="19" viewBox="0 0 20 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.5954 0.956947C19.1954 0.656947 18.4954 0.656947 18.1954 1.05695L6.39536 15.7569L2.19536 11.5569C1.79536 11.1569 1.19536 11.1569 0.795361 11.5569C0.395361 11.9569 0.395361 12.5569 0.795361 12.9569L5.79536 17.9569C5.99536 18.1569 6.19536 18.2569 6.49536 18.2569C6.79536 18.2569 7.09536 18.1569 7.29536 17.8569L19.7954 2.35695C20.0954 1.95695 20.0954 1.35695 19.5954 0.956947Z" fill="white"/>
</svg>
img/video_button.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="154" height="154" viewBox="0 0 154 154" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="77" y="34.5735" width="60" height="60" transform="rotate(45 77 34.5735)" fill="#029745"/>
<rect x="77" y="25.8751" width="72.3014" height="72.3014" transform="rotate(45 77 25.8751)" stroke="#029745"/>
<rect y="-0.707107" width="88.6148" height="88.6148" transform="matrix(0.707107 -0.707107 -0.707107 -0.707107 76.5 139.16)" stroke="#029745" stroke-opacity="0.7"/>
<rect y="-0.707107" width="107.894" height="107.894" transform="matrix(0.707107 -0.707107 -0.707107 -0.707107 76.5 152.793)" stroke="#029745" stroke-opacity="0.3"/>
<path d="M88 77.0735L72 86.5735L72 67.5735L88 77.0735Z" fill="white"/>
</svg>
img/video_button_active.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="154" height="154" viewBox="0 0 154 154" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="77" y="34.5735" width="60" height="60" transform="rotate(45 77 34.5735)" fill="#077F3D"/>
<rect x="77" y="25.8751" width="72.3014" height="72.3014" transform="rotate(45 77 25.8751)" stroke="#077F3D"/>
<rect y="-0.707107" width="88.6148" height="88.6148" transform="matrix(0.707107 -0.707107 -0.707107 -0.707107 76.5 139.16)" stroke="#077F3D" stroke-opacity="0.7"/>
<rect y="-0.707107" width="107.894" height="107.894" transform="matrix(0.707107 -0.707107 -0.707107 -0.707107 76.5 152.793)" stroke="#077F3D" stroke-opacity="0.3"/>
<path d="M88 77.0735L72 86.5735L72 67.5735L88 77.0735Z" fill="white"/>
</svg>
\ No newline at end of file
img/video_button_hover.svg 0 → 100644
View file @ 3d0dfc5a
<svg width="154" height="154" viewBox="0 0 154 154" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="77" y="34.5735" width="60" height="60" transform="rotate(45 77 34.5735)" fill="#28be4a"/>
<rect x="77" y="25.8751" width="72.3014" height="72.3014" transform="rotate(45 77 25.8751)" stroke="#28be4a"/>
<rect y="-0.707107" width="88.6148" height="88.6148" transform="matrix(0.707107 -0.707107 -0.707107 -0.707107 76.5 139.16)" stroke="#28be4a" stroke-opacity="0.7"/>
<rect y="-0.707107" width="107.894" height="107.894" transform="matrix(0.707107 -0.707107 -0.707107 -0.707107 76.5 152.793)" stroke="#28be4a" stroke-opacity="0.3"/>
<path d="M88 77.0735L72 86.5735L72 67.5735L88 77.0735Z" fill="white"/>
</svg>
\ No newline at end of file
index.html
View file @ 3d0dfc5a
...@@ -285,7 +285,10 @@ ...@@ -285,7 +285,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
...@@ -379,8 +382,7 @@ ...@@ -379,8 +382,7 @@
<a class="production__link" href="#">Перейти в каталог</a> <a class="production__link" href="#">Перейти в каталог</a>
</div> </div>
<div class="production-list"> <div class="production-list">
<div class="production-list-item"> <div class="production-list-item" style="background-image: url(img/product1.png);">
<img class="production-list-item__image" src="img/product1.png" alt="product image">
<svg class="production-list-item__arrow"> <svg class="production-list-item__arrow">
<use xlink:href="img/production_arrow.svg#production_arrow"></use> <use xlink:href="img/production_arrow.svg#production_arrow"></use>
</svg> </svg>
...@@ -403,8 +405,7 @@ ...@@ -403,8 +405,7 @@
</a> </a>
</ul> </ul>
</div> </div>
<div class="production-list-item"> <div class="production-list-item" style="background-image: url(img/product2.png);">
<img class="production-list-item__image" src="img/product2.png" alt="product image">
<svg class="production-list-item__arrow"> <svg class="production-list-item__arrow">
<use xlink:href="img/production_arrow.svg#production_arrow"></use> <use xlink:href="img/production_arrow.svg#production_arrow"></use>
</svg> </svg>
...@@ -421,8 +422,7 @@ ...@@ -421,8 +422,7 @@
</a> </a>
</ul> </ul>
</div> </div>
<div class="production-list-item"> <div class="production-list-item" style="background-image: url(img/product3.png);">
<img class="production-list-item__image" src="img/product3.png" alt="product image">
<svg class="production-list-item__arrow"> <svg class="production-list-item__arrow">
<use xlink:href="img/production_arrow.svg#production_arrow"></use> <use xlink:href="img/production_arrow.svg#production_arrow"></use>
</svg> </svg>
...@@ -472,10 +472,14 @@ ...@@ -472,10 +472,14 @@
</div> </div>
<div class="company-video"> <div class="company-video">
</div> </div>
<a class="company-button" href="#"> <div class="company-button">
<img class="company-button__icon" src="img/video_button.png" alt="wacth video icon"> <a class="company-button-link" href="#">
<img class="company-button__icon company-button__icon--normal" src="img/video_button.svg" alt="wacth video">
<img class="company-button__icon company-button__icon--hover" src="img/video_button_hover.svg" alt="wacth video">
<img class="company-button__icon company-button__icon--active" src="img/video_button_active.svg" alt="wacth video">
<img class="company-button__text" src="img/video_button_text.png" alt="wacth video text"> <img class="company-button__text" src="img/video_button_text.png" alt="wacth video text">
</a> </a>
</div>
<div class="company-tour"> <div class="company-tour">
<p class="company-tour__text"> <p class="company-tour__text">
АО «Волга» входит в рейтинги «Топ-200 крупнейших АО «Волга» входит в рейтинги «Топ-200 крупнейших
...@@ -556,15 +560,11 @@ ...@@ -556,15 +560,11 @@
</div> </div>
<div class="press-content-main"> <div class="press-content-main">
<div class="press-wrapper"> <div class="press-wrapper">
<a href="#"> <div class="press-wrapper__button" data-tabs-handler="1">ПРЕСС-РЕЛИЗЫ</div>
<div class="press-wrapper__button">ПРЕСС-РЕЛИЗЫ</div> <div class="press-wrapper__button press-wrapper__button--disabled" data-tabs-handler="2">КОРПОРАТИВНЫЕ СМИ</div>
</a>
<a href="#">
<div class="press-wrapper__button press-wrapper__button--disabled">КОРПОРАТИВНЫЕ СМИ</div>
</a>
<a class="press-wrapper__link" href="#">Перейти в раздел</a> <a class="press-wrapper__link" href="#">Перейти в раздел</a>
</div> </div>
<div class="press-content-news"> <div class="press-content-news" data-tabs-field="1">
<a href="#" class="press-content-news-item"> <a href="#" class="press-content-news-item">
<div class="press-content-news-item__text"> <div class="press-content-news-item__text">
<img class="press-content-news-item__icon" src="img/news_list.svg" alt="list icon"> <img class="press-content-news-item__icon" src="img/news_list.svg" alt="list icon">
...@@ -599,6 +599,41 @@ ...@@ -599,6 +599,41 @@
</div> </div>
</a> </a>
</div> </div>
<div class="press-content-news press-content-news--hidden" data-tabs-field="2">
<a href="#" class="press-content-news-item">
<div class="press-content-news-item__text">
<img class="press-content-news-item__icon" src="img/news_list.svg" alt="list icon">
Три вида продукции АО «Волга» вошли в список «100 лучших товаров России» в 2020 году
</div>
<span class="press-content-news-item__date">04.12.2020</span>
<div class="press-content-news-item-img">
<img class="press-content-news-item-img__photo" src="img/news2.png" alt="news1 photo">
<img class="press-content-news-item-img__arrow" src="img/news_arrow.svg" alt="news arrow">
</div>
</a>
<a href="#" class="press-content-news-item">
<div class="press-content-news-item__text">
<img class="press-content-news-item__icon" src="img/news_list.svg" alt="list icon">
Три вида продукции АО «Волга» вошли в список «100 лучших товаров России» в 2020 году
</div>
<span class="press-content-news-item__date">04.12.2020</span>
<div class="press-content-news-item-img">
<img class="press-content-news-item-img__photo" src="img/news3.png" alt="news2 photo">
<img class="press-content-news-item-img__arrow" src="img/news_arrow.svg" alt="news arrow">
</div>
</a>
<a href="#" class="press-content-news-item">
<div class="press-content-news-item__text">
<img class="press-content-news-item__icon" src="img/news_list.svg" alt="list icon">
Три вида продукции АО «Волга» вошли в список «100 лучших товаров России» в 2020 году
</div>
<span class="press-content-news-item__date">04.12.2020</span>
<div class="press-content-news-item-img">
<img class="press-content-news-item-img__photo" src="img/news1.png" alt="news3 photo">
<img class="press-content-news-item-img__arrow" src="img/news_arrow.svg" alt="news arrow">
</div>
</a>
</div>
</div> </div>
<a class="press__moblink" href="#">Перейти в раздел</a> <a class="press__moblink" href="#">Перейти в раздел</a>
</div> </div>
...@@ -641,9 +676,7 @@ ...@@ -641,9 +676,7 @@
</div> </div>
</section> </section>
<section class="contacts"> <section class="contacts">
<div class="contacts-map" id="map"> <div class="contacts-map" id="map"></div>
</div>
<div class="contacts-info"> <div class="contacts-info">
<div class="contacts-info-item"> <div class="contacts-info-item">
<span class="contacts-info-item__title">Нижегородский офис АО «Волга»</span> <span class="contacts-info-item__title">Нижегородский офис АО «Волга»</span>
...@@ -667,9 +700,9 @@ ...@@ -667,9 +700,9 @@
<span class="form-ui-inner-heading__text">Оставьте свои контакты и мы свяжемся с Вами!</span> <span class="form-ui-inner-heading__text">Оставьте свои контакты и мы свяжемся с Вами!</span>
</div> </div>
<div class="form-ui-inner-content"> <div class="form-ui-inner-content">
<input class="form-ui-inner-content__input" type="text" placeholder="Ваше имя"> <input class="form-ui-inner-content__input" type="text" placeholder="Ваше имя" required>
<input class="form-ui-inner-content__input" type="tel" placeholder="Телефон"> <input class="form-ui-inner-content__input" type="tel" placeholder="Телефон" pattern="(\+?\d[- .]*){7,13}" required>
<input class="form-ui-inner-content__input" type="email" placeholder="E-mail"> <input class="form-ui-inner-content__input" type="email" placeholder="E-mail" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}" required>
<input class="form-ui-inner-content__input" type="text" placeholder="Сообщение"> <input class="form-ui-inner-content__input" type="text" placeholder="Сообщение">
<input class="form-ui-inner-content__button" type="submit" value="ОТПРАВИТЬ"> <input class="form-ui-inner-content__button" type="submit" value="ОТПРАВИТЬ">
</div> </div>
...@@ -728,7 +761,8 @@ ...@@ -728,7 +761,8 @@
</footer> </footer>
<script defer src="js/index.js"></script> <script defer src="js/index.js"></script>
<script defer src="js/menu.js"></script> <script defer src="js/menu.js"></script>
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&amp;apikey=<6d05ea4e-5eb3-4409-88a3-d4f809c991d9>" type="text/javascript"></script> <script defer src="js/tabs.js"></script>
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&amp;apikey=6d05ea4e-5eb3-4409-88a3-d4f809c991d9" type="text/javascript"></script>
<script defer src="js/map_icon.js"></script> <script defer src="js/map_icon.js"></script>
</body> </body>
</html> </html>
\ No newline at end of file
js/index.js
View file @ 3d0dfc5a
document.querySelector('.navbar-burger').addEventListener('click', () => { document.querySelector('.navbar-burger').addEventListener('click', () => {
document.querySelector('.menu-hidden').classList.add('menu-hidden--active'); document.querySelector('.menu-hidden').classList.add('menu-hidden--active');
document.querySelector('html').style.overflow = 'hidden'; document.querySelector('html').style.overflow = 'hidden';
...@@ -12,6 +11,7 @@ document.querySelector('.menu-hidden-mob__close').addEventListener('click', () = ...@@ -12,6 +11,7 @@ document.querySelector('.menu-hidden-mob__close').addEventListener('click', () =
document.querySelector('html').style.overflowY = 'visible'; document.querySelector('html').style.overflowY = 'visible';
}); });
//+/- menu
let titles = document.querySelectorAll('.menu-hidden-main-block__title'); let titles = document.querySelectorAll('.menu-hidden-main-block__title');
let mores = document.querySelectorAll('.menu-hidden-main-block__more'); let mores = document.querySelectorAll('.menu-hidden-main-block__more');
let wrappers = document.querySelectorAll('.menu-hidden-main-block__wrapper'); let wrappers = document.querySelectorAll('.menu-hidden-main-block__wrapper');
...@@ -32,23 +32,74 @@ let menuItems = document.querySelectorAll('.menu-item'); ...@@ -32,23 +32,74 @@ let menuItems = document.querySelectorAll('.menu-item');
let secondMenuItems = document.querySelectorAll('.second-menu-item'); let secondMenuItems = document.querySelectorAll('.second-menu-item');
let submenus = document.querySelectorAll('.submenu'); let submenus = document.querySelectorAll('.submenu');
let secondSubmenus = document.querySelectorAll('.second-submenu'); let secondSubmenus = document.querySelectorAll('.second-submenu');
for (let i = 0; i < menuItems.length; i++) { for (let i = 0; i < menuItems.length; i++) {
menuItems[i].addEventListener('mouseenter', () => { menuItems[i].addEventListener('mouseenter', () => {
if (search.style.opacity !== '1') {
if (window.innerWidth > 1670) {
if (pageYOffset < 680) {
document.querySelector('.header').style.opacity = 1;
}
}
else {
if (pageYOffset < 540) {
document.querySelector('.header').style.opacity = 1;
}
}
submenus[i].classList.add('submenu--active'); submenus[i].classList.add('submenu--active');
}); }
})
menuItems[i].addEventListener('mouseleave', () => { menuItems[i].addEventListener('mouseleave', () => {
if (search.style.opacity !== '1') {
if (window.innerWidth > 1670) {
if (pageYOffset < 680) {
document.querySelector('.header').style.opacity = 0.99;
}
}
else {
if (pageYOffset < 540) {
document.querySelector('.header').style.opacity = 0.99;
}
}
submenus[i].classList.remove('submenu--active'); submenus[i].classList.remove('submenu--active');
}); }
})
} }
for (let i = 0; i < secondMenuItems.length; i++) { for (let i = 0; i < secondMenuItems.length; i++) {
secondMenuItems[i].addEventListener('mouseenter', () => { secondMenuItems[i].addEventListener('mouseenter', () => {
if (search.style.opacity !== '1') {
secondSubmenus[i - 1].classList.add('submenu--active'); secondSubmenus[i - 1].classList.add('submenu--active');
}); if (window.innerWidth > 1670) {
if (pageYOffset < 680) {
document.querySelector('.header').style.opacity = 1;
}
}
else {
if (pageYOffset < 540) {
document.querySelector('.header').style.opacity = 1;
}
}
}
})
secondMenuItems[i].addEventListener('mouseleave', () => { secondMenuItems[i].addEventListener('mouseleave', () => {
if (search.style.opacity !== '1') {
secondSubmenus[i - 1].classList.remove('submenu--active'); secondSubmenus[i - 1].classList.remove('submenu--active');
}); if (window.innerWidth > 1670) {
if (pageYOffset < 680) {
document.querySelector('.header').style.opacity = 0.99;
}
}
else {
if (pageYOffset < 540) {
document.querySelector('.header').style.opacity = 0.99;
}
}
}
})
} }
//search
let search = document.querySelector('.search'); let search = document.querySelector('.search');
let searchClose = document.querySelector('.search-close'); let searchClose = document.querySelector('.search-close');
let searchLink = document.querySelector('.search-link'); let searchLink = document.querySelector('.search-link');
...@@ -57,10 +108,57 @@ searchClose.addEventListener('click', (e) => { ...@@ -57,10 +108,57 @@ searchClose.addEventListener('click', (e) => {
e.preventDefault(); e.preventDefault();
search.style.opacity = '0'; search.style.opacity = '0';
search.style.visibility = 'hidden'; search.style.visibility = 'hidden';
document.querySelector('.header').style.opacity = 0.99;
for (let point of points) {
point.style.display = 'flex';
}
}); });
searchLink.addEventListener('click', (e) => { searchLink.addEventListener('click', (e) => {
e.preventDefault(); e.preventDefault();
if (search.style.opacity == '1') {
search.style.opacity = '0';
search.style.visibility = 'hidden';
document.querySelector('.header').style.opacity = 0.99;
for (let point of points) {
point.style.display = 'flex';
}
}
else {
search.style.opacity = '1'; search.style.opacity = '1';
search.style.visibility = 'visible'; search.style.visibility = 'visible';
if (pageYOffset > 400) {
document.querySelector('.header').style.opacity = 1;
for (let point of points) {
point.style.display = 'none';
}
}
}
});
//videobutton
let videoButton = document.querySelector('.company-button-link');
let videoButtonNormal = document.querySelector('.company-button__icon--normal');
let videoButtonHover = document.querySelector('.company-button__icon--hover');
let videoButtonActive = document.querySelector('.company-button__icon--active');
videoButton.addEventListener('mouseenter', () => {
videoButtonHover.style.opacity = '1';
videoButtonHover.style.visibility = 'visible';
});
videoButton.addEventListener('mouseleave', () => {
videoButtonHover.style.opacity = '0';
videoButtonHover.style.visibility = 'hidden';
});
videoButton.addEventListener('mousedown', () => {
videoButtonActive.style.opacity = '1';
videoButtonActive.style.visibility = 'visible';
});
videoButton.addEventListener('mouseup', () => {
videoButtonActive.style.opacity = '0';
videoButtonActive.style.visibility = 'hidden';
}); });
\ No newline at end of file
js/map_icon.js
View file @ 3d0dfc5a
...@@ -8,14 +8,14 @@ ymaps.ready(function () { ...@@ -8,14 +8,14 @@ ymaps.ready(function () {
myPlacemark = new ymaps.Placemark([55.763001, 37.619737], { myPlacemark = new ymaps.Placemark([55.763001, 37.619737], {
}, { }, {
iconLayout: 'default#image', iconLayout: 'default#image',
iconImageHref: '../img/map_icon.png', iconImageHref: 'img/map_icon.png',
iconImageSize: [50, 70], iconImageSize: [50, 70],
iconImageOffset: [-25, -65] iconImageOffset: [-25, -65]
}), }),
myPlacemark2 = new ymaps.Placemark([56.529327, 43.560287], { myPlacemark2 = new ymaps.Placemark([56.529327, 43.560287], {
}, { }, {
iconLayout: 'default#image', iconLayout: 'default#image',
iconImageHref: '../img/map_icon.png', iconImageHref: 'img/map_icon.png',
iconImageSize: [50, 70], iconImageSize: [50, 70],
iconImageOffset: [-25, -65] iconImageOffset: [-25, -65]
}); });
...@@ -23,4 +23,5 @@ ymaps.ready(function () { ...@@ -23,4 +23,5 @@ ymaps.ready(function () {
myMap.geoObjects myMap.geoObjects
.add(myPlacemark) .add(myPlacemark)
.add(myPlacemark2); .add(myPlacemark2);
}); });
js/menu.js
View file @ 3d0dfc5a
...@@ -6,6 +6,7 @@ let navbarBurgerTitle = document.querySelector('.navbar-burger__title'); ...@@ -6,6 +6,7 @@ let navbarBurgerTitle = document.querySelector('.navbar-burger__title');
let menuItemLink = document.querySelectorAll('.menu-item__link'); let menuItemLink = document.querySelectorAll('.menu-item__link');
let secondMenuItemLink = document.querySelectorAll('.second-menu-item__link'); let secondMenuItemLink = document.querySelectorAll('.second-menu-item__link');
let secondMenuItemLinkIcon = document.querySelectorAll('.second-menu-item__link__icon'); let secondMenuItemLinkIcon = document.querySelectorAll('.second-menu-item__link__icon');
let points = document.querySelectorAll('.point-item-wrapper');
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
let y = pageYOffset; let y = pageYOffset;
...@@ -39,9 +40,61 @@ window.addEventListener('scroll', () => { ...@@ -39,9 +40,61 @@ window.addEventListener('scroll', () => {
item.classList.remove('second-menu-scroll-item__link__icon'); item.classList.remove('second-menu-scroll-item__link__icon');
} }
} }
if (y > 720) {
if (window.innerWidth > 1670) {
if (search.style.opacity == '1') {
if (y > 470) {
document.querySelector('.header').style.opacity = 1;
for (let point of points) {
point.style.display = 'none';
}
} else {
document.querySelector('.header').style.opacity = 0.99;
for (let point of points) {
point.style.display = 'flex';
}
}
}
else {
if (y > 680) {
document.querySelector('.header').style.opacity = 1;
for (let point of points) {
point.style.display = 'none';
}
} else {
document.querySelector('.header').style.opacity = 0.99;
for (let point of points) {
point.style.display = 'flex';
}
}
}
}
else {
if (search.style.opacity == '1') {
if (y > 340) {
document.querySelector('.header').style.opacity = 1; document.querySelector('.header').style.opacity = 1;
for (let point of points) {
point.style.display = 'none';
}
} else { } else {
document.querySelector('.header').style.opacity = 0.99; document.querySelector('.header').style.opacity = 0.99;
for (let point of points) {
point.style.display = 'flex';
}
}
}
else {
if (y > 540) {
document.querySelector('.header').style.opacity = 1;
for (let point of points) {
point.style.display = 'none';
}
} else {
document.querySelector('.header').style.opacity = 0.99;
for (let point of points) {
point.style.display = 'flex';
}
}
}
} }
}); });
\ No newline at end of file
js/menu_subpage.js
View file @ 3d0dfc5a
...@@ -8,6 +8,7 @@ let secondMenuItemLink = document.querySelectorAll('.second-menu-item__link'); ...@@ -8,6 +8,7 @@ let secondMenuItemLink = document.querySelectorAll('.second-menu-item__link');
let secondMenuItemLinkIcon = document.querySelectorAll('.second-menu-item__link__icon'); let secondMenuItemLinkIcon = document.querySelectorAll('.second-menu-item__link__icon');
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
document.querySelector('.header').style.opacity = 1;
let y = pageYOffset; let y = pageYOffset;
if (y > 5) { if (y > 5) {
navbarLogo.setAttribute('src', 'img/logo_scroll.svg'); navbarLogo.setAttribute('src', 'img/logo_scroll.svg');
......
js/smothScroll.js
View file @ 3d0dfc5a
...@@ -3,8 +3,13 @@ const smoothScrollElems = document.querySelectorAll('a[href^="#"]:not(a[href="#" ...@@ -3,8 +3,13 @@ const smoothScrollElems = document.querySelectorAll('a[href^="#"]:not(a[href="#"
smoothScrollElems.forEach(link => { smoothScrollElems.forEach(link => {
link.addEventListener('click', (event) => { link.addEventListener('click', (event) => {
event.preventDefault(); event.preventDefault();
const id = link.getAttribute('href').substring(1); let href = link.getAttribute('href').substring(1);
document.getElementById(id).scrollIntoView({ const scrollTarget = document.getElementById(href);
const topOffset = document.querySelector('.navbar').offsetHeight + 10;
const elementPosition = scrollTarget.getBoundingClientRect().top;
const offsetPosition = elementPosition - topOffset;
window.scrollBy({
top: offsetPosition,
behavior: 'smooth' behavior: 'smooth'
}); });
}) })
......
js/tabs.js 0 → 100644
View file @ 3d0dfc5a
const tabsHandlerElems = document.querySelectorAll('[data-tabs-handler]');
const tabsFieldElems = document.querySelectorAll('[data-tabs-field]');
for (const tab of tabsHandlerElems) {
tab.addEventListener('click', () => {
tabsHandlerElems.forEach(item => {
if (tab === item) {
item.classList.remove('press-wrapper__button--disabled');
} else {
item.classList.add('press-wrapper__button--disabled');
}
})
tabsFieldElems.forEach(item => {
if (item.dataset.tabsField === tab.dataset.tabsHandler) {
item.classList.remove('press-content-news--hidden');
} else {
item.classList.add('press-content-news--hidden');
}
})
})
}
\ No newline at end of file
js/vac.js 0 → 100644
View file @ 3d0dfc5a
let plus = document.querySelectorAll('.vac__plus');
let minus = document.querySelectorAll('.vac__minus');
let inner = document.querySelectorAll('.vac-all-item-inner');
for (let i = 0; i < plus.length; i++) {
plus[i].addEventListener('click', () => {
plus[i].style.display = 'none';
minus[i].style.display = 'block';
inner[i].classList.add('vac-all-item-inner--active');
});
}
for (let i = 0; i < minus.length; i++) {
minus[i].addEventListener('click', () => {
minus[i].style.display = 'none';
plus[i].style.display = 'block';
inner[i].classList.remove('vac-all-item-inner--active');
});
}
\ No newline at end of file
production.html
View file @ 3d0dfc5a
...@@ -284,7 +284,10 @@ ...@@ -284,7 +284,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
......
strategy.html
View file @ 3d0dfc5a
...@@ -284,7 +284,10 @@ ...@@ -284,7 +284,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
......
styles/style.css
View file @ 3d0dfc5a
...@@ -573,16 +573,32 @@ body { ...@@ -573,16 +573,32 @@ body {
position: absolute; position: absolute;
top: 27px; top: 27px;
right: 100px; right: 100px;
-webkit-transition: 0.4s;
transition: 0.4s;
} }
.search-close__icon { .search-close__icon {
margin-left: 8px; margin-left: 8px;
width: 16px;
height: 17px;
fill: #16291f;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.search-close:hover {
color: #029745;
}
.search-close:hover .search-close__icon {
fill: #029745;
} }
.search__field { .search__field {
height: 60px; height: 60px;
width: 1080px; max-width: 1080px;
font-weight: 300; font-weight: 300;
width: 60%;
font-size: 18px; font-size: 18px;
line-height: 130%; line-height: 130%;
color: #16291f; color: #16291f;
...@@ -946,7 +962,9 @@ body { ...@@ -946,7 +962,9 @@ body {
.production-list-item { .production-list-item {
position: relative; position: relative;
width: 533px; width: 533px;
background: #ffffff; background-color: #ffffff;
background-repeat: no-repeat;
background-position: top right;
padding: 50px 50px 22px; padding: 50px 50px 22px;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
...@@ -971,13 +989,6 @@ body { ...@@ -971,13 +989,6 @@ body {
fill: #029745; fill: #029745;
} }
.production-list-item__image {
position: absolute;
top: 0;
right: 0;
z-index: 0;
}
.production-list-item__title { .production-list-item__title {
font-weight: bold; font-weight: bold;
font-size: 20px; font-size: 20px;
...@@ -1155,22 +1166,35 @@ body { ...@@ -1155,22 +1166,35 @@ body {
.company-button { .company-button {
display: inline-block; display: inline-block;
position: absolute; position: absolute;
left: 46%; width: 100vw;
height: 201px;
bottom: 310px; bottom: 310px;
-webkit-transform: translate(-50%, 50%); -webkit-transition: 0.4s;
transform: translate(-50%, 50%); transition: 0.4s;
} }
.company-button__icon { .company-button__icon {
position: absolute; position: absolute;
left: 46%; left: calc(50% - 57px);
bottom: 0; top: calc(50% - 77px);
-webkit-transition: 0.4s;
transition: 0.4s;
}
.company-button__icon--hover {
opacity: 0;
visibility: hidden;
}
.company-button__icon--active {
opacity: 0;
visibility: hidden;
} }
.company-button__text { .company-button__text {
position: absolute; position: absolute;
left: 46%; left: calc(50% - 76.5px);
bottom: 0; top: calc(50% - 100px);
-webkit-animation: 10s linear 0s normal none infinite running company-button; -webkit-animation: 10s linear 0s normal none infinite running company-button;
animation: 10s linear 0s normal none infinite running company-button; animation: 10s linear 0s normal none infinite running company-button;
} }
...@@ -1530,6 +1554,10 @@ body { ...@@ -1530,6 +1554,10 @@ body {
width: 100%; width: 100%;
} }
.press-content-news--hidden {
display: none;
}
.press-content-news-item { .press-content-news-item {
width: 33%; width: 33%;
display: -webkit-box; display: -webkit-box;
...@@ -1944,6 +1972,18 @@ body { ...@@ -1944,6 +1972,18 @@ body {
border-bottom: 1px solid #67e39f; border-bottom: 1px solid #67e39f;
} }
.form-ui-inner-content__input:required:valid {
outline: none;
border-bottom: 1px solid #fff;
background: url("../img/valid.svg") no-repeat right;
}
.form-ui-inner-content__input:not(:empty):invalid {
outline: none;
border-bottom: 1px solid #eb5757;
color: #eb5757;
}
.form-ui-inner-content__button { .form-ui-inner-content__button {
background: #ffffff url("../img/form_button.png") no-repeat; background: #ffffff url("../img/form_button.png") no-repeat;
background-size: contain; background-size: contain;
...@@ -2378,12 +2418,30 @@ body { ...@@ -2378,12 +2418,30 @@ body {
position: absolute; position: absolute;
top: 89px; top: 89px;
left: 140px; left: 140px;
height: 40px;
width: 40px;
background: url("../img/prev.svg") no-repeat;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.timeline-content-line-wrapper-events__prev:hover {
background-image: url("../img/prev_hover.svg");
} }
.timeline-content-line-wrapper-events__next { .timeline-content-line-wrapper-events__next {
position: absolute; position: absolute;
top: 89px; top: 89px;
right: 140px; right: 140px;
height: 40px;
width: 40px;
background: url("../img/next.svg") no-repeat;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.timeline-content-line-wrapper-events__next:hover {
background-image: url("../img/next_hover.svg");
} }
.timeline-content-line-wrapper-events__item { .timeline-content-line-wrapper-events__item {
...@@ -2393,6 +2451,7 @@ body { ...@@ -2393,6 +2451,7 @@ body {
transition: 0.4s; transition: 0.4s;
height: 75px; height: 75px;
width: 347px; width: 347px;
cursor: pointer;
} }
.timeline-content-line-wrapper-events__item__line { .timeline-content-line-wrapper-events__item__line {
...@@ -2402,6 +2461,8 @@ body { ...@@ -2402,6 +2461,8 @@ body {
width: 2px; width: 2px;
height: 37px; height: 37px;
background: #c7c9cf; background: #c7c9cf;
-webkit-transition: 0.4s;
transition: 0.4s;
} }
.timeline-content-line-wrapper-events__item__year { .timeline-content-line-wrapper-events__item__year {
...@@ -2415,6 +2476,8 @@ body { ...@@ -2415,6 +2476,8 @@ body {
bottom: 0; bottom: 0;
-webkit-transform: translateX(-50%); -webkit-transform: translateX(-50%);
transform: translateX(-50%); transform: translateX(-50%);
-webkit-transition: 0.4s;
transition: 0.4s;
} }
.timeline-content-line-wrapper-events__item:first-child { .timeline-content-line-wrapper-events__item:first-child {
...@@ -2444,6 +2507,14 @@ body { ...@@ -2444,6 +2507,14 @@ body {
padding: 8px 16px; padding: 8px 16px;
} }
.timeline-content-line-wrapper-events__item:hover:not(.timeline-content-line-wrapper-events__item--selected) > .timeline-content-line-wrapper-events__item__line {
background: #029745;
}
.timeline-content-line-wrapper-events__item:hover:not(.timeline-content-line-wrapper-events__item--selected) > .timeline-content-line-wrapper-events__item__year {
color: #029745;
}
.history-video { .history-video {
background: url(../img/history_video.jpg) no-repeat; background: url(../img/history_video.jpg) no-repeat;
background-size: cover; background-size: cover;
...@@ -2909,6 +2980,226 @@ body { ...@@ -2909,6 +2980,226 @@ body {
margin-bottom: 0; margin-bottom: 0;
} }
.corp-content-wrapper {
margin-bottom: 64px;
}
.corp-content-wrapper__text {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
padding-left: 40px;
margin-bottom: 32px;
max-width: 809px;
}
.corp-content-wrapper__text:last-child {
margin-bottom: 0;
}
.corp-content-wrapper__bold {
font-weight: 700;
font-size: 18px;
line-height: 130%;
color: #16291f;
padding-left: 40px;
margin-bottom: 32px;
}
.corp-content-wrapper-list {
margin-bottom: 32px;
margin-left: 67px;
list-style: url("../img/points_style.svg");
}
.corp-content-wrapper-list__item {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
margin-bottom: 16px;
padding-left: 23px;
max-width: 809px;
}
.corp-content-wrapper-list__item:last-child {
margin-bottom: 0;
}
.vac-all {
background-color: #fff;
}
.vac-all-item {
border-bottom: 1px solid #e6e9f0;
padding: 41px 40px;
}
.vac-all-item-heading {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.vac-all-item-inner {
margin-top: 32px;
margin-left: 64px;
display: none;
}
.vac-all-item-inner--active {
display: block;
}
.vac-all-item:last-child {
border-width: 0;
}
.vac__title {
font-weight: bold;
font-size: 24px;
line-height: 130%;
color: #16291f;
}
.vac__text {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
}
.vac__bold {
font-weight: 700;
font-size: 18px;
line-height: 130%;
color: #16291f;
}
.vac__salary {
font-weight: bold;
font-size: 24px;
line-height: 130%;
color: #029745;
margin-left: auto;
}
.vac__icon {
margin-right: 32px;
stroke: #c7c9cf;
width: 34px;
height: 34px;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.vac__icon:hover {
stroke: #029745;
}
.vac__minus {
display: none;
}
.vac-wrapper {
margin-bottom: 32px;
}
.vac-list {
margin-left: 27px;
list-style: url("../img/points_style.svg");
}
.vac-list__item {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
padding-left: 23px;
margin-bottom: 16px;
}
.vac-list__item:last-child {
margin-bottom: 0;
}
.vac__button {
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
height: 60px;
font-weight: bold;
font-size: 15px;
line-height: 120%;
letter-spacing: 0.15em;
color: #ffffff;
padding: 21px 52px 21px 55px;
background: #029745 url(../img/button_mask.svg) no-repeat;
margin-right: 56px;
-webkit-transition: 0.4s;
transition: 0.4s;
margin-right: 16px;
}
.vac__button:hover {
background-color: #28be4a;
}
.vac__button:active {
background-color: #07803d;
}
.vac-buttons {
height: 60px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.vac__call {
border: 1px solid #029745;
padding: 21px 31px;
font-weight: bold;
font-size: 15px;
line-height: 120%;
letter-spacing: 0.15em;
color: #029745;
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
height: 60px;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.vac__call__icon {
margin-right: 8px;
width: 12px;
height: 12px;
fill: #029745;
}
.vac__call:hover {
background: #28be4a;
color: #fff;
border-color: #28be4a;
}
.vac__call:hover .vac__call__icon,
.vac__call:active .vac__call__icon {
fill: #fff;
}
.vac__call:active {
background: #077f3d;
color: #fff;
border-color: #077f3d;
}
@media (max-width: 1800px) { @media (max-width: 1800px) {
.navbar { .navbar {
padding: 0 100px; padding: 0 100px;
...@@ -3027,6 +3318,10 @@ body { ...@@ -3027,6 +3318,10 @@ body {
padding-left: 35px; padding-left: 35px;
padding-bottom: 20px; padding-bottom: 20px;
} }
.point-item:hover {
-webkit-transform: translateY(-51%);
transform: translateY(-51%);
}
.production { .production {
padding: 62px 0 0 0; padding: 62px 0 0 0;
margin-left: 100px; margin-left: 100px;
...@@ -3048,6 +3343,7 @@ body { ...@@ -3048,6 +3343,7 @@ body {
.production-list-item { .production-list-item {
padding: 50px 52px; padding: 50px 52px;
min-height: 315px; min-height: 315px;
background-size: 180px 180px;
} }
.production-list-item__image { .production-list-item__image {
width: 185px; width: 185px;
...@@ -3088,11 +3384,18 @@ body { ...@@ -3088,11 +3384,18 @@ body {
font-size: 14px; font-size: 14px;
} }
.company-button { .company-button {
bottom: 255px; bottom: 257px;
left: 46.3%; height: 154px;
}
.company-button__icon {
height: 118px;
left: calc(50% - 39px);
top: calc(50% - 59px);
} }
.company-button img { .company-button__text {
height: 154px; height: 154px;
left: calc(50% - 57px);
top: calc(50% - 77px);
} }
.company-tour { .company-tour {
padding: 0 100px 0 80px; padding: 0 100px 0 80px;
...@@ -3371,6 +3674,16 @@ body { ...@@ -3371,6 +3674,16 @@ body {
.history-video-about__text { .history-video-about__text {
font-size: 14px; font-size: 14px;
} }
.history-video-button__icon {
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.history-video-button__text {
top: calc(50% - 77px);
left: calc(50% - 77px);
}
.prod-about__photo { .prod-about__photo {
margin-bottom: 37px; margin-bottom: 37px;
width: 80%; width: 80%;
...@@ -3462,9 +3775,6 @@ body { ...@@ -3462,9 +3775,6 @@ body {
.point { .point {
display: none; display: none;
} }
.company-button {
left: 45.5%;
}
} }
@media (max-width: 1100px) { @media (max-width: 1100px) {
...@@ -3508,9 +3818,6 @@ body { ...@@ -3508,9 +3818,6 @@ body {
.ecology-text { .ecology-text {
width: calc(100% - 550px); width: calc(100% - 550px);
} }
.company-button {
left: 45%;
}
.timeline-about { .timeline-about {
padding: 40px 16px; padding: 40px 16px;
} }
...@@ -3550,9 +3857,6 @@ body { ...@@ -3550,9 +3857,6 @@ body {
.press-content-media-wrapper__link { .press-content-media-wrapper__link {
margin-right: 15px; margin-right: 15px;
} }
.company-button {
left: 44.5%;
}
.footer { .footer {
padding: 24px 16px; padding: 24px 16px;
height: 105px; height: 105px;
...@@ -3924,6 +4228,7 @@ body { ...@@ -3924,6 +4228,7 @@ body {
-webkit-box-direction: normal; -webkit-box-direction: normal;
-ms-flex-direction: column; -ms-flex-direction: column;
flex-direction: column; flex-direction: column;
background-size: 152px 152px;
width: 288px; width: 288px;
min-height: 210px; min-height: 210px;
padding: 22px 32px; padding: 22px 32px;
...@@ -3999,10 +4304,17 @@ body { ...@@ -3999,10 +4304,17 @@ body {
} }
.company-button { .company-button {
bottom: 980px; bottom: 980px;
left: 41%; height: 128px;
}
.company-button__icon {
height: 98px;
left: calc(50% - 49px);
top: calc(50% - 49px);
} }
.company-button img { .company-button__text {
height: 128px; height: 128px;
left: calc(50% - 64px);
top: calc(50% - 64px);
} }
.company-tour { .company-tour {
width: 100%; width: 100%;
...@@ -4351,7 +4663,7 @@ body { ...@@ -4351,7 +4663,7 @@ body {
width: 100%; width: 100%;
} }
.company-button-subpage { .company-button-subpage {
bottom: 780px; bottom: 770px;
} }
.timeline-about { .timeline-about {
background: none; background: none;
...@@ -4396,10 +4708,10 @@ body { ...@@ -4396,10 +4708,10 @@ body {
left: 16px; left: 16px;
top: 55px; top: 55px;
} }
.timeline-content-line-wrapper-events__prev img, .timeline-content-line-wrapper-events__prev, .timeline-content-line-wrapper-events__next {
.timeline-content-line-wrapper-events__next img {
width: 30px; width: 30px;
height: 30px; height: 30px;
background-size: 30px 30px;
} }
.timeline-content-line-wrapper-events__next { .timeline-content-line-wrapper-events__next {
right: 16px; right: 16px;
...@@ -4434,6 +4746,16 @@ body { ...@@ -4434,6 +4746,16 @@ body {
width: 100%; width: 100%;
height: 380px; height: 380px;
} }
.history-video-button__icon {
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.history-video-button__text {
top: calc(50% - 64px);
left: calc(50% - 64px);
}
.history-video-about { .history-video-about {
width: 100%; width: 100%;
padding: 52px 16px; padding: 52px 16px;
...@@ -4570,25 +4892,27 @@ body { ...@@ -4570,25 +4892,27 @@ body {
} }
} }
@media (max-width: 700px) {
.company-button-subpage {
bottom: 750px;
}
}
@media (max-width: 600px) { @media (max-width: 600px) {
.company-button { .company-button {
bottom: 960px; bottom: 960px;
left: 38%;
} }
.company-button-subpage { .company-button-subpage {
bottom: 730px; bottom: 720px;
left: 39%;
} }
} }
@media (max-width: 450px) { @media (max-width: 480px) {
.company-button { .company-button {
bottom: 940px; bottom: 940px;
left: 31%;
} }
.company-button-subpage { .company-button-subpage {
bottom: 680px; bottom: 680px;
left: 34%;
} }
.footer-info-dev { .footer-info-dev {
margin: 0; margin: 0;
...@@ -4600,7 +4924,6 @@ body { ...@@ -4600,7 +4924,6 @@ body {
@media (max-width: 380px) { @media (max-width: 380px) {
.company-button-subpage { .company-button-subpage {
bottom: 650px; bottom: 650px;
left: 31%;
} }
} }
......
styles/style.css.map
View file @ 3d0dfc5a
This source diff could not be displayed because it is too large. You can view the blob instead.
styles/style.scss
View file @ 3d0dfc5a
...@@ -438,14 +438,26 @@ body { ...@@ -438,14 +438,26 @@ body {
position: absolute; position: absolute;
top: 27px; top: 27px;
right: 100px; right: 100px;
transition: 0.4s;
&__icon { &__icon {
margin-left: 8px; margin-left: 8px;
width: 16px;
height: 17px;
fill: #16291f;
transition: 0.4s;
} }
} }
&-close:hover {
color: #029745;
}
&-close:hover &-close__icon {
fill: #029745;
}
&__field { &__field {
height: 60px; height: 60px;
width: 1080px; max-width: 1080px;
font-weight: 300; font-weight: 300;
width: 60%;
font-size: 18px; font-size: 18px;
line-height: 130%; line-height: 130%;
color: #16291f; color: #16291f;
...@@ -718,7 +730,9 @@ body { ...@@ -718,7 +730,9 @@ body {
&-item { &-item {
position: relative; position: relative;
width: 533px; width: 533px;
background: #ffffff; background-color: #ffffff;
background-repeat: no-repeat;
background-position: top right;
padding: 50px 50px 22px; padding: 50px 50px 22px;
box-sizing: border-box; box-sizing: border-box;
margin-right: 20px; margin-right: 20px;
...@@ -736,12 +750,6 @@ body { ...@@ -736,12 +750,6 @@ body {
stroke: #fff; stroke: #fff;
fill: #029745; fill: #029745;
} }
&__image {
position: absolute;
top: 0;
right: 0;
z-index: 0;
}
&__title { &__title {
font-weight: bold; font-weight: bold;
font-size: 20px; font-size: 20px;
...@@ -874,19 +882,28 @@ body { ...@@ -874,19 +882,28 @@ body {
&-button { &-button {
display: inline-block; display: inline-block;
position: absolute; position: absolute;
left: 46%; width: 100vw;
height: 201px;
bottom: 310px; bottom: 310px;
transform: translate(-50%, 50%); transition: 0.4s;
&__icon { &__icon {
position: absolute; position: absolute;
left: 46%; left: calc(50% - 57px);
bottom: 0; top: calc(50% - 77px);
transition: 0.4s;
&--hover {
opacity: 0;
visibility: hidden;
}
&--active {
opacity: 0;
visibility: hidden;
}
} }
&__text { &__text {
position: absolute; position: absolute;
left: 46%; left: calc(50% - 76.5px);
bottom: 0; top: calc(50% - 100px);
animation: 10s linear 0s normal none infinite running company-button; animation: 10s linear 0s normal none infinite running company-button;
} }
} }
...@@ -1139,6 +1156,9 @@ body { ...@@ -1139,6 +1156,9 @@ body {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto; flex: 0 0 auto;
width: 100%; width: 100%;
&--hidden {
display: none;
}
&-item { &-item {
width: 33%; width: 33%;
display: flex; display: flex;
...@@ -1437,6 +1457,16 @@ body { ...@@ -1437,6 +1457,16 @@ body {
outline: none; outline: none;
border-bottom: 1px solid #67e39f; border-bottom: 1px solid #67e39f;
} }
&__input:required:valid {
outline: none;
border-bottom: 1px solid #fff;
background: url('../img/valid.svg') no-repeat right;
}
&__input:not(:empty):invalid {
outline: none;
border-bottom: 1px solid #eb5757;
color: #eb5757;
}
&__button { &__button {
background: #ffffff url('../img/form_button.png') no-repeat; background: #ffffff url('../img/form_button.png') no-repeat;
background-size: contain; background-size: contain;
...@@ -1755,11 +1785,25 @@ body { ...@@ -1755,11 +1785,25 @@ body {
position: absolute; position: absolute;
top: 89px; top: 89px;
left: 140px; left: 140px;
height: 40px;
width: 40px;
background: url('../img/prev.svg') no-repeat;
transition: 0.4s;
}
&__prev:hover {
background-image: url('../img/prev_hover.svg');
} }
&__next { &__next {
position: absolute; position: absolute;
top: 89px; top: 89px;
right: 140px; right: 140px;
height: 40px;
width: 40px;
background: url('../img/next.svg') no-repeat;
transition: 0.4s;
}
&__next:hover {
background-image: url('../img/next_hover.svg');
} }
&__item { &__item {
display: inline-block; display: inline-block;
...@@ -1767,6 +1811,7 @@ body { ...@@ -1767,6 +1811,7 @@ body {
transition: 0.4s; transition: 0.4s;
height: 75px; height: 75px;
width: 347px; width: 347px;
cursor: pointer;
&__line { &__line {
position: absolute; position: absolute;
left: 50%; left: 50%;
...@@ -1774,6 +1819,7 @@ body { ...@@ -1774,6 +1819,7 @@ body {
width: 2px; width: 2px;
height: 37px; height: 37px;
background: #c7c9cf; background: #c7c9cf;
transition: 0.4s;
} }
&__year { &__year {
font-weight: normal; font-weight: normal;
...@@ -1785,6 +1831,7 @@ body { ...@@ -1785,6 +1831,7 @@ body {
left: 50%; left: 50%;
bottom: 0; bottom: 0;
transform: translateX(-50%); transform: translateX(-50%);
transition: 0.4s;
} }
} }
&__item:first-child { &__item:first-child {
...@@ -1810,6 +1857,14 @@ body { ...@@ -1810,6 +1857,14 @@ body {
background-color: #029745; background-color: #029745;
padding: 8px 16px; padding: 8px 16px;
} }
&__item:hover:not(.timeline-content-line-wrapper-events__item--selected)
> &__item__line {
background: #029745;
}
&__item:hover:not(.timeline-content-line-wrapper-events__item--selected)
> &__item__year {
color: #029745;
}
} }
} }
} }
...@@ -2181,6 +2236,185 @@ body { ...@@ -2181,6 +2236,185 @@ body {
&__photo:last-of-type { &__photo:last-of-type {
margin-bottom: 0; margin-bottom: 0;
} }
&-wrapper {
margin-bottom: 64px;
&__text {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
padding-left: 40px;
margin-bottom: 32px;
max-width: 809px;
}
&__text:last-child {
margin-bottom: 0;
}
&__bold {
font-weight: 700;
font-size: 18px;
line-height: 130%;
color: #16291f;
padding-left: 40px;
margin-bottom: 32px;
}
&-list {
margin-bottom: 32px;
margin-left: 67px;
list-style: url('../img/points_style.svg');
&__item {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
margin-bottom: 16px;
padding-left: 23px;
max-width: 809px;
}
&__item:last-child {
margin-bottom: 0;
}
}
}
}
}
.vac {
&-all {
background-color: #fff;
&-item {
border-bottom: 1px solid #e6e9f0;
padding: 41px 40px;
&-heading {
display: flex;
align-items: center;
}
&-inner {
margin-top: 32px;
margin-left: 64px;
display: none;
&--active {
display: block;
}
}
}
&-item:last-child {
border-width: 0;
}
}
&__title {
font-weight: bold;
font-size: 24px;
line-height: 130%;
color: #16291f;
}
&__text {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
}
&__bold {
font-weight: 700;
font-size: 18px;
line-height: 130%;
color: #16291f;
}
&__salary {
font-weight: bold;
font-size: 24px;
line-height: 130%;
color: #029745;
margin-left: auto;
}
&__icon {
margin-right: 32px;
stroke: #c7c9cf;
width: 34px;
height: 34px;
transition: 0.4s;
}
&__icon:hover {
stroke: #029745;
}
&__minus {
display: none;
}
&-wrapper {
margin-bottom: 32px;
}
&-list {
margin-left: 27px;
list-style: url('../img/points_style.svg');
&__item {
font-weight: 300;
font-size: 18px;
line-height: 130%;
color: #16291f;
padding-left: 23px;
margin-bottom: 16px;
}
&__item:last-child {
margin-bottom: 0;
}
}
&__button {
display: block;
box-sizing: border-box;
height: 60px;
font-weight: bold;
font-size: 15px;
line-height: 120%;
letter-spacing: 0.15em;
color: #ffffff;
padding: 21px 52px 21px 55px;
background: #029745 url(../img/button_mask.svg) no-repeat;
margin-right: 56px;
transition: 0.4s;
margin-right: 16px;
}
&__button:hover {
background-color: #28be4a;
}
&__button:active {
background-color: #07803d;
}
&-buttons {
height: 60px;
display: flex;
}
&__call {
border: 1px solid #029745;
padding: 21px 31px;
font-weight: bold;
font-size: 15px;
line-height: 120%;
letter-spacing: 0.15em;
color: #029745;
display: block;
box-sizing: border-box;
height: 60px;
transition: 0.4s;
&__icon {
margin-right: 8px;
width: 12px;
height: 12px;
fill: #029745;
}
}
&__call:hover {
background: #28be4a;
color: #fff;
border-color: #28be4a;
}
&__call:hover &__call__icon,
&__call:active &__call__icon {
fill: #fff;
}
&__call:active {
background: #077f3d;
color: #fff;
border-color: #077f3d;
} }
} }
...@@ -2319,6 +2553,9 @@ body { ...@@ -2319,6 +2553,9 @@ body {
} }
} }
} }
&-item:hover {
transform: translateY(-51%);
}
} }
.production { .production {
padding: 62px 0 0 0; padding: 62px 0 0 0;
...@@ -2341,6 +2578,7 @@ body { ...@@ -2341,6 +2578,7 @@ body {
&-item { &-item {
padding: 50px 52px; padding: 50px 52px;
min-height: 315px; min-height: 315px;
background-size: 180px 180px;
&__image { &__image {
width: 185px; width: 185px;
} }
...@@ -2386,11 +2624,18 @@ body { ...@@ -2386,11 +2624,18 @@ body {
} }
} }
&-button { &-button {
bottom: 255px; bottom: 257px;
left: 46.3%; height: 154px;
&__icon {
height: 118px;
left: calc(50% - 39px);
top: calc(50% - 59px);
} }
&-button img { &__text {
height: 154px; height: 154px;
left: calc(50% - 57px);
top: calc(50% - 77px);
}
} }
&-tour { &-tour {
padding: 0 100px 0 80px; padding: 0 100px 0 80px;
...@@ -2711,6 +2956,17 @@ body { ...@@ -2711,6 +2956,17 @@ body {
font-size: 14px; font-size: 14px;
} }
} }
&-button {
&__icon {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
&__text {
top: calc(50% - 77px);
left: calc(50% - 77px);
}
}
} }
//production //production
.prod { .prod {
...@@ -2816,9 +3072,6 @@ body { ...@@ -2816,9 +3072,6 @@ body {
.point { .point {
display: none; display: none;
} }
.company-button {
left: 45.5%;
}
} }
@media (max-width: 1100px) { @media (max-width: 1100px) {
...@@ -2855,9 +3108,6 @@ body { ...@@ -2855,9 +3108,6 @@ body {
.ecology-text { .ecology-text {
width: calc(100% - 550px); width: calc(100% - 550px);
} }
.company-button {
left: 45%;
}
.timeline { .timeline {
&-about { &-about {
padding: 40px 16px; padding: 40px 16px;
...@@ -2895,9 +3145,6 @@ body { ...@@ -2895,9 +3145,6 @@ body {
.press-content-media-wrapper__link { .press-content-media-wrapper__link {
margin-right: 15px; margin-right: 15px;
} }
.company-button {
left: 44.5%;
}
.footer { .footer {
padding: 24px 16px; padding: 24px 16px;
height: 105px; height: 105px;
...@@ -3200,6 +3447,7 @@ body { ...@@ -3200,6 +3447,7 @@ body {
flex-direction: column; flex-direction: column;
&-item { &-item {
flex-direction: column; flex-direction: column;
background-size: 152px 152px;
width: 288px; width: 288px;
min-height: 210px; min-height: 210px;
padding: 22px 32px; padding: 22px 32px;
...@@ -3273,10 +3521,17 @@ body { ...@@ -3273,10 +3521,17 @@ body {
} }
&-button { &-button {
bottom: 980px; bottom: 980px;
left: 41%; height: 128px;
&__icon {
height: 98px;
left: calc(50% - 49px);
top: calc(50% - 49px);
} }
&-button img { &__text {
height: 128px; height: 128px;
left: calc(50% - 64px);
top: calc(50% - 64px);
}
} }
&-tour { &-tour {
width: 100%; width: 100%;
...@@ -3598,7 +3853,7 @@ body { ...@@ -3598,7 +3853,7 @@ body {
width: 100%; width: 100%;
} }
&-button-subpage { &-button-subpage {
bottom: 780px; bottom: 770px;
} }
} }
//history //history
...@@ -3642,10 +3897,11 @@ body { ...@@ -3642,10 +3897,11 @@ body {
left: 16px; left: 16px;
top: 55px; top: 55px;
} }
&__prev img, &__prev,
&__next img { &__next {
width: 30px; width: 30px;
height: 30px; height: 30px;
background-size: 30px 30px;
} }
&__next { &__next {
right: 16px; right: 16px;
...@@ -3661,8 +3917,6 @@ body { ...@@ -3661,8 +3917,6 @@ body {
width: 1.75px; width: 1.75px;
} }
} }
&__item:first-child {
}
&__item--selected > &__item__line { &__item--selected > &__item__line {
width: 60px; width: 60px;
height: 120px; height: 120px;
...@@ -3684,6 +3938,15 @@ body { ...@@ -3684,6 +3938,15 @@ body {
&-button { &-button {
width: 100%; width: 100%;
height: 380px; height: 380px;
&__icon {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
&__text {
top: calc(50% - 64px);
left: calc(50% - 64px);
}
} }
&-about { &-about {
width: 100%; width: 100%;
...@@ -3814,24 +4077,25 @@ body { ...@@ -3814,24 +4077,25 @@ body {
} }
} }
} }
@media (max-width: 700px) {
.company-button-subpage {
bottom: 750px;
}
}
@media (max-width: 600px) { @media (max-width: 600px) {
.company-button { .company-button {
bottom: 960px; bottom: 960px;
left: 38%;
&-subpage {
bottom: 730px;
left: 39%;
} }
.company-button-subpage {
bottom: 720px;
} }
} }
@media (max-width: 450px) { @media (max-width: 480px) {
.company-button { .company-button {
bottom: 940px; bottom: 940px;
left: 31%;
&-subpage { &-subpage {
bottom: 680px; bottom: 680px;
left: 34%;
} }
} }
.footer { .footer {
...@@ -3849,7 +4113,6 @@ body { ...@@ -3849,7 +4113,6 @@ body {
.company-button { .company-button {
&-subpage { &-subpage {
bottom: 650px; bottom: 650px;
left: 31%;
} }
} }
} }
......
technology.html
View file @ 3d0dfc5a
...@@ -284,7 +284,10 @@ ...@@ -284,7 +284,10 @@
</nav> </nav>
<div class="search"> <div class="search">
<a class="search-close" href="#"> <a class="search-close" href="#">
Закрыть<img class="search-close__icon" src="img/search_close.svg" alt="close"> Закрыть
<svg class="search-close__icon">
<use xlink:href="img/search_close.svg#search_close"></use>
</svg>
</a> </a>
<input class="search__field" type="search" placeholder="Поиск по сайту"> <input class="search__field" type="search" placeholder="Поиск по сайту">
<input class="search__button" type="submit" value="НАЙТИ"> <input class="search__button" type="submit" value="НАЙТИ">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment