Skip to content

Instantly share code, notes, and snippets.

@madeas

madeas/index.html

Created May 17, 2019 10:46
Show Gist options
  • Save madeas/6827378db51dcce5298685428e6ba33a to your computer and use it in GitHub Desktop.
Save madeas/6827378db51dcce5298685428e6ba33a to your computer and use it in GitHub Desktop.
Download ZIP
conf
Raw
index.html
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimal-ui">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:300,400,400italic,700,700italics">
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css' />
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.css' />
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick-theme.min.css' />
<link rel="stylesheet" href="/style/style.css?v1.0.7">
<link rel="dns-prefetch" href="https://fonts.googleapis.com">
<link rel="dns-prefetch" href="https://cdnjs.cloudflare.com">
<title>Экологическая конференция | Экология и бизнес: Законодательство и человеческий взгляд | РПН-Сфера</title>
<meta name="title" content="Экологическая конференция | Экология и бизнес: Законодательство и человеческий взгляд | РПН-Сфера">
<meta name="description" content="Экология и бизнес: Законодательство и человеческий взгляд. Версия 5.0: Выжить при экологической диктатуре.">
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#2d89ef">
<meta name="msapplication-TileImage" content="/mstile-144x144.png">
<meta name="theme-color" content="#ffffff">
<meta property="og:type" content="website">
<meta property="og:url" content="http://conference.rpn-sfera.ru/">
<meta property="og:title" content="Экологическая конференция | Экология и бизнес: Законодательство и человеческий взгляд | РПН-Сфера">
<meta property="og:description" content="Экология и бизнес: Законодательство и человеческий взгляд. Версия 5.0: Выжить при экологической диктатуре.">
<meta property="og:image" content="http://conference.rpn-sfera.ru/src/screen.jpg"> <!-- 1500х780 -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:title" content="Экологическая конференция | Экология и бизнес: Законодательство и человеческий взгляд | РПН-Сфера">
<meta property="twitter:description" content="Экология и бизнес: Законодательство и человеческий взгляд. Версия 5.0: Выжить при экологической диктатуре.">
<meta property="twitter:image" content="http://conference.rpn-sfera.ru/src/screen.jpg"> <!-- 1500х780 -->
</head>
<body>
<header id="header">
<nav class="navbar navbar-expand-lg sticky-top navbar-light bg-light">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#dropdown" aria-controls="dropdown"
aria-expanded="false" aria-label="Toggle navigation">
<svg id="menu" width="30" height="30" viewBox="0 0 30 30" role="img" focusable="false">
<title>Menu</title>
<path id="m_1" d="M4 7h22" />
<path id="m_2" d="M4 15h22" />
<path id="m_3" d="M4 23h22" />
</svg>
</button>
<a class="navbar-brand" href="/">
<img class="logo" src="/src/logo_64.png" alt="РПН-Сфера">
</a>
<div class="collapse navbar-collapse" id="dropdown">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#programma" title="Программа конференции">Программа</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#speaker" title="Докладчики и темы выступлений">Выступления</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#testimonials" title="Отзывы участников">Отзывы</a>
</li>
</ul>
</div>
<div class="info d-flex align-items-center w-100 justify-content-end">
<div class="d-flex flex-column text-right mr-3">
<p class="m-0"><strong><a href="tel:+74995570270">+7 (499) 557-02-70</a></strong></p>
<p class="m-0">(пн.-пт. с 10:00 до 18:00)</p>
</div>
<button type="button" class="btn btn-theme" data-toggle="modal" data-target="#сons">
Консультация
</button>
</div>
</nav>
<div class="masthead jumbotron-fluid bg-global text-light py-5">
<div class="container">
<div class="row">
<div class="col-lg-4">
<form class="m-auto" id="form1" method="POST">
<div class="form-group">
<label for="name">Представьтесь, пожалуйста: </label>
<input type="hidden" name="formData" value="Запись на конференцию. Принять участие">
<input type="text" class="form-control" id="name" name="name" aria-describedby="name" placeholder="Как к вам обращаться?" required>
</div>
<div class="form-group">
<label for="email">Ваш e-mail: </label>
<input type="email" class="form-control" id="email" name="email" placeholder="Укажите ваш e-mail" required>
</div>
<div class="form-group">
<label for="phone">Ваш контактный телефон: </label>
<input type="tel" class="form-control" id="phone" name="phone" placeholder="+7" required>
</div>
<div class="form-group form-check">
<input type="checkbox" class="form-check-input" id="field" checked>
<label class="form-check-label" for="field">
<svg class="checkbox" viewbox="0 0 40 40">
<rect x="2" y="2" width="36" height="36"></rect>
<polyline points="9,22 18,30 33,14"></polyline>
</svg>
<small><a href="#" rel="noopener noreferrer">Политика конфиденциа́льности</a></small>
</label>
</div>
<p class="text-center m-0">
<button type="submit" class="btn btn-theme btn-lg">Принять участие</button>
</p>
</form>
</div>
<div class="col-lg-8">
<div class="d-flex">
<div class="data">
<p class="num">25 — 26</p>
<p>Апреля</p>
</div>
<div class="data">
<p class="num">10:00 — 18:00</p>
<p>ГК "Измайлово"</p>
</div>
</div>
<h1>Экология и бизнес: Законодательство и человеческий взгляд.
<sup><small class="text-warning">Версия 5.0</small></sup>
<span>Выжить при экологической диктатуре</span></h1>
<hr class="bg-light w-50 ml-0">
<p class="lead">С <b>2019</b> года все, что было ранее - осталось в прошлом, и теперь надо начинать с
чистого листа, адаптировать предприятия к новым правилам игры. Меры «стимулирования» стали
поистине драконовскими. <br>Примите участие в конференции и узнайте, как обезопасить свой
бизнес<b>!</b>
</p>
<small class="text-light mb-3 position-relative">
Оставье заявку на участие в конференции уже сегодня.
<svg class="svg_ar" width="64" viewBox="0 0 90 90">
<path d="M 10 10 L 7 30 Q 10 8 30 15 L 10 10 Q 30 60 90 60 " />
</svg>
</small>
<div class="d-flex justify-content-end" id="programma">
<a class="btn btn-outline-warning pdf btn-lg" href="/programma.pdf" target="_blank" rel="noopener noreferrer">
<svg viewBox="0 0 533.333 533.333">
<path d="M438.548,307.021c-7.108-7.003-22.872-10.712-46.86-11.027c-16.238-0.179-35.782,1.251-56.339,4.129
c-9.205-5.311-18.691-11.091-26.139-18.051c-20.033-18.707-36.755-44.673-47.175-73.226c0.679-2.667,1.257-5.011,1.795-7.403
c0,0,11.284-64.093,8.297-85.763c-0.411-2.972-0.664-3.834-1.463-6.144l-0.98-2.518c-3.069-7.079-9.087-14.58-18.522-14.171
l-5.533-0.176l-0.152-0.003c-10.521,0-19.096,5.381-21.347,13.424c-6.842,25.226,0.218,62.964,13.012,111.842l-3.275,7.961
c-9.161,22.332-20.641,44.823-30.77,64.665l-1.317,2.581c-10.656,20.854-20.325,38.557-29.09,53.554l-9.05,4.785
c-0.659,0.348-16.169,8.551-19.807,10.752c-30.862,18.427-51.313,39.346-54.706,55.946c-1.08,5.297-0.276,12.075,5.215,15.214
l8.753,4.405c3.797,1.902,7.801,2.866,11.903,2.866c21.981,0,47.5-27.382,82.654-88.732
c40.588-13.214,86.799-24.197,127.299-30.255c30.864,17.379,68.824,29.449,92.783,29.449c4.254,0,7.921-0.406,10.901-1.194
c4.595-1.217,8.468-3.838,10.829-7.394c4.648-6.995,5.591-16.631,4.329-26.497C443.417,313.113,441.078,309.493,438.548,307.021z
M110.233,423.983c4.008-10.96,19.875-32.627,43.335-51.852c1.475-1.196,5.108-4.601,8.435-7.762
C137.47,403.497,121.041,419.092,110.233,423.983z M249.185,104.003c7.066,0,11.085,17.81,11.419,34.507
c0.333,16.698-3.572,28.417-8.416,37.088c-4.012-12.838-5.951-33.073-5.951-46.304
C246.237,129.294,245.942,104.003,249.185,104.003z M207.735,332.028c4.922-8.811,10.043-18.103,15.276-27.957
c12.756-24.123,20.812-42.999,26.812-58.514c11.933,21.71,26.794,40.167,44.264,54.955c2.179,1.844,4.488,3.698,6.913,5.547
C265.474,313.088,234.769,321.637,207.735,332.028z M431.722,330.027c-2.164,1.353-8.362,2.135-12.349,2.135
c-12.867,0-28.787-5.883-51.105-15.451c8.575-0.635,16.438-0.957,23.489-0.957c12.906,0,16.729-0.056,29.349,3.163
S433.885,328.674,431.722,330.027z M470.538,103.87L396.13,29.463C379.925,13.258,347.917,0,325,0H75
C52.083,0,33.333,18.75,33.333,41.667v450c0,22.916,18.75,41.666,41.667,41.666h383.333c22.916,0,41.666-18.75,41.666-41.666V175
C500,152.083,486.742,120.074,470.538,103.87z M446.968,127.44c1.631,1.631,3.255,3.633,4.833,5.893h-85.134V48.2
c2.261,1.578,4.263,3.203,5.893,4.833L446.968,127.44z M466.667,491.667c0,4.517-3.816,8.333-8.333,8.333H75
c-4.517,0-8.333-3.816-8.333-8.333v-450c0-4.517,3.817-8.333,8.333-8.333h250c2.517,0,5.341,0.318,8.334,0.887v132.446H465.78
c0.569,2.993,0.887,5.816,0.887,8.333V491.667z" />
</svg> Скачать программу
</a>
</div>
</div>
</div>
</div>
</div>
</header>
<main>
<div class="container nums">
<h2>На конференции вы узнаете</h2>
<div class="row">
<div class="col-lg-7">
<ul class="list">
<li>
<div>
<svg viewBox="0 0 50 50">
<path d="M 25 3 C 12.86158 3 3 12.86158 3 25 C 3 37.13842 12.86158 47 25 47 C 37.13842 47 47 37.13842 47 25 C 47 12.86158 37.13842 3 25 3 z M 25 5 C 36.05754 5 45 13.94246 45 25 C 45 36.05754 36.05754 45 25 45 C 13.94246 45 5 36.05754 5 25 C 5 13.94246 13.94246 5 25 5 z M 34.988281 14.988281 A 1.0001 1.0001 0 0 0 34.171875 15.439453 L 23.970703 30.476562 L 16.679688 23.710938 A 1.0001 1.0001 0 1 0 15.320312 25.177734 L 24.316406 33.525391 L 35.828125 16.560547 A 1.0001 1.0001 0 0 0 34.988281 14.988281 z"></path>
</svg>
</div>
<div>
<h4>Риск ориентированный подход</h4>
<p class="lead">Правовое регулирование государственного экологического надзора в
Российской Федерации. Реформа контрольно-надзорной деятельности,
риск-ориентированный подход. Порядок и организация проведения проверок.</p>
</div>
</li>
<li>
<div>
<svg viewBox="0 0 50 50">
<path d="M 25 3 C 12.86158 3 3 12.86158 3 25 C 3 37.13842 12.86158 47 25 47 C 37.13842 47 47 37.13842 47 25 C 47 12.86158 37.13842 3 25 3 z M 25 5 C 36.05754 5 45 13.94246 45 25 C 45 36.05754 36.05754 45 25 45 C 13.94246 45 5 36.05754 5 25 C 5 13.94246 13.94246 5 25 5 z M 34.988281 14.988281 A 1.0001 1.0001 0 0 0 34.171875 15.439453 L 23.970703 30.476562 L 16.679688 23.710938 A 1.0001 1.0001 0 1 0 15.320312 25.177734 L 24.316406 33.525391 L 35.828125 16.560547 A 1.0001 1.0001 0 0 0 34.988281 14.988281 z"></path>
</svg>
</div>
<div>
<h4>Производственный экологический контроль и мониторинг</h4>
<p class="lead">Нюансы разработки и исполнения программ ПЭК и ПЭМ</p>
</div>
</li>
<li>
<div>
<svg viewBox="0 0 50 50">
<path d="M 25 3 C 12.86158 3 3 12.86158 3 25 C 3 37.13842 12.86158 47 25 47 C 37.13842 47 47 37.13842 47 25 C 47 12.86158 37.13842 3 25 3 z M 25 5 C 36.05754 5 45 13.94246 45 25 C 45 36.05754 36.05754 45 25 45 C 13.94246 45 5 36.05754 5 25 C 5 13.94246 13.94246 5 25 5 z M 34.988281 14.988281 A 1.0001 1.0001 0 0 0 34.171875 15.439453 L 23.970703 30.476562 L 16.679688 23.710938 A 1.0001 1.0001 0 1 0 15.320312 25.177734 L 24.316406 33.525391 L 35.828125 16.560547 A 1.0001 1.0001 0 0 0 34.988281 14.988281 z"></path>
</svg>
</div>
<div>
<h4>Что такое НДТ?</h4>
<p class="lead">Наилучшие доступные технологии - как с ними работать?</p>
</div>
</li>
<li>
<div>
<svg viewBox="0 0 50 50">
<path d="M 25 3 C 12.86158 3 3 12.86158 3 25 C 3 37.13842 12.86158 47 25 47 C 37.13842 47 47 37.13842 47 25 C 47 12.86158 37.13842 3 25 3 z M 25 5 C 36.05754 5 45 13.94246 45 25 C 45 36.05754 36.05754 45 25 45 C 13.94246 45 5 36.05754 5 25 C 5 13.94246 13.94246 5 25 5 z M 34.988281 14.988281 A 1.0001 1.0001 0 0 0 34.171875 15.439453 L 23.970703 30.476562 L 16.679688 23.710938 A 1.0001 1.0001 0 1 0 15.320312 25.177734 L 24.316406 33.525391 L 35.828125 16.560547 A 1.0001 1.0001 0 0 0 34.988281 14.988281 z"></path>
</svg>
</div>
<div>
<h4>Меры стимулирования юридических лиц к проведению мероприятий по снижению
негативного воздействия на окружающую среду</h4>
<p class="lead">Расширенная ответственность производителей</p>
</div>
</li>
</ul>
</div>
<div class="col-lg-5">
<img src="/src/sert_no_border.png" alt="">
</div>
</div>
</div>
<div class="container module">
<p class="lead text-center mb-4">Каждый участник получает официальный документ — «Свидетельство о
прохождении повышения квалификации специалиста в области охраны окружающей среды».</p>
<div class="col-md-12">
<form class="m-auto d-flex p-0" id="form2" method="POST">
<div class="form-group">
<input type="hidden" name="formData" value="Запись на конференцию. Хочу получить свидетельство">
<input type="text" class="form-control inp-lg" id="name" name="name" placeholder="Как к вам обращаться?" required>
</div>
<div class="form-group">
<input type="phone" class="form-control inp-lg" id="phone" name="phone" placeholder="Введите ваш номер телефона" required>
</div>
<div class="form-group">
<button type="submit" class="btn btn-outline-warning btn-lg">Получить свидетельство</button>
</div>
</form>
</div>
</div>
<div class="speaker pt-3 pb-5" id="speaker">
<div class="container">
<h2>На конференции вас ждут доклады на темы:</h2>
<div class="row align-items-stretch">
<div class="col col-md-12 col-lg-6">
<div class="theme">
<h3>Практические аспекты прохождения процедуры государственной экологической экспертизы.
Особенности подготовки материалов и оценки воздействия на окружающую среду при
прохождении государственной экологической экспертизы материалов обоснования
комплексного экологического разрешения</h3>
<div class="subd">
<h4>Грошева Светлана Валерьевна</h4>
<p>Начальник отдела координации и контроля проведения государственной экологической
экспертизы Росприроднадзора</p>
</div>
</div>
</div>
<div class="col col-lg-6">
<div class="theme">
<h3>Правовое регулирование государственного экологического надзора в Российской Федерации.
Реформа контрольно-надзорной деятельности, риск-ориентированный подход. Порядок и
организация проведения проверок</h3>
<div class="subd">
<h4>Фирсов Юрий Викторович</h4>
<p>Заместитель директора департамента государственной политики в сфере развития ООПТ и
БПТ Минприроды России</p>
</div>
</div>
</div>
<div class="col col-md-12 col-lg-6">
<div class="theme">
<h3>Новая система обращения с твердыми коммунальными отходами.
Институт региональных операторов</h3>
<div class="subd">
<h4>Толстокорова Оксана Николаевна</h4>
<p>Советник Департамента городской среды Минстроя России</p>
</div>
</div>
</div>
<div class="col col-md-12 col-lg-6">
<div class="theme">
<h3>Расширенная ответственность производителей</h3>
<div class="subd">
<h4>Зверева Елена Сергеевна</h4>
<p>Начальник отдела регулирования и нормирования в области обращения с
отходами Росприроднадзора.</p>
</div>
</div>
</div>
<div class="col col-md-12 col-lg-4">
<div class="theme">
<h3>Производственный экологический контроль и мониторинг. Нюансы разработки и исполнения
программ ПЭК и ПЭМ</h3>
<div class="subd">
<h4>Тихонова Ирина Олеговна</h4>
<p>к.т.н., доцент кафедры промышленной экологии РХТУ им. Д.И. Менделеева; участник
разработки ряда ИТС в области НДТ, отраслевых НПА в области производственного
экологического контроля и мониторинга.</p>
</div>
</div>
</div>
<div class="col col-md-12 col-lg-4">
<div class="theme">
<h3>Санитарный контроль в области обращения с отходами; Проекты обоснования
санитарно-защитные зоны. Порядок разработки и утверждения (ответы на вопросы без
лекции)</h3>
<div class="subd">
<h4>Архипова Наталья Ивановна</h4>
<p>Заведующий отделением гигиены окружающей среды и градостроительства ФБУЗ «Центр
гигиены и эпидемиологии в городе Москве»</p>
</div>
</div>
</div>
<div class="col col-lg-4">
<div class="theme">
<h3>Комплексное экологическое разрешение и декларация о воздействии на окружающую среду.
Порядок оформления и утверждения</h3>
<div class="subd">
<h4>Зрянин Алексей Алексеевич</h4>
<p>Координатор рабочей группы по НДТ «Обезвреживание отходов термическим способом»
(ранее начальник управления экологической экспертизы Ростехнадзора)</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="py-3" id="testimonials">
<div class="container testimonials">
<h2>Отзывы слушателей</h2>
<p>Мы успешно провели уже четыре конференции, затрагивающие различные вопросы экологической тематики.
Наши докладчики расположены к диалогу, с удовольствием отвечают на вопросы и в ходе проведения
занятий помогают в решении
сложных задач. Все слушатели с удовольствием посещают их, а некоторые из
них посетили две и даже три конференции и оставили теплые отзывы о проведенных мероприятиях.
Убедитесь сами.</p>
<div class="row slider autoplay">
<div class="col">
<div class="theme">
<p>Спасибо, что затронули наиболее актуальные темы в области природопользования и охраны
окружающей среды. Что была предоставлена возможность задать наиболее интересующие
вопросы. Спасибо! </p>
<div class="subd">
<h4>Мирович О.В.</h4>
<p>инженер по охране окружающей среды ФГУП «Аналитприбор»</p>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>В целях повышения образованности в области экологического законодательства и грядущих
переменах в области экологии, конференция получилась очень продуктивной и
познавательной для меня, по тем вопросам, которые были не понятны. Большое спасибо
организаторам за приглашение на данную конференцию.</p>
<div class="subd">
<h4>Клишина Е.А.</h4>
<p>инженер ООО «Торговый дом АДЛ»</p>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Конференция очень полезна, много новой информации узнала, уточнила имеющиеся сведения,
систематизировала свои знания.</p>
<div class="subd">
<h4>Хвастина А.С.</h4>
<p>начальник Управления системного анализа и экспертизы, Батолина Т.М., начальник бюро
промэкологии УСАиЭ ЗАО «НПФ «ДИЭМ»</p>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Очень хорошая конференция, понравилось абсолютно все, многое познал, почаще бы
проводились такие конференции! Большое спасибо! </p>
<div class="subd">
<h4>Назаров С.С.</h4>
<p>инженер по охране окружающей среды ООО «Агрисовгаз»</p>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Интересные и актуальные доклады. После прослушивания многое стало ясным. </p>
<div class="subd">
<h4>Суханов С.Б.</h4>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Доклады прошли на высоком уровне, особенно интересно было узнать о новинках
законодательства «из первых рук». </p>
<div class="subd">
<h4>Мышкина В.Т.</h4>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Выступления очень понравились, отдельное спасибо за помощь в содействии в разработке
плана работы экологической службы нашего предприятия на ближайший период.</p>
<div class="subd">
<h4>Якубова В.Ф.</h4>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Информативные выступления научных экспертов и представителей органов государственной
власти. Спасибо организаторам!</p>
<div class="subd">
<h4>Сентябров Д.Н.</h4>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>К сожалению, из-за большого количества участников некоторые вопросы (например, мой) не
удалось задать во время конференции. Тем не менее, мне удалось пообщаться с докладчиком
после выступления. Очень приятно, когда выступающие отвечают на вопросы после окончания
основной части.</p>
<div class="subd">
<h4>Грешнев Р.К.</h4>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Хорошие, интересные и объективные доклады. Несмотря на широкую тематику, мы получили
ответы на наболевшие вопросы. Спасибо! </p>
<div class="subd">
<h4>Никольская П.Е.</h4>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Высокий уровень организации, компетентные докладчики. </p>
<div class="subd">
<h4>Перфильев К.Ф.</h4>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Конференция была информативной. Лекторы были расположены к диалогу, дали ответы на
многие вопросы. </p>
<div class="subd">
<h4>Чернышова А.Ю.</h4>
<p>инженер по ОТ, ГО, ЧС и экологии ООО «Аква Стар»</p>
</div>
</div>
</div>
<div class="col">
<div class="theme">
<p>Специалисты внимательны, оперативны, тактичны, представительны, очень приятны в общении.
Тематика
актуальная, о чем свидетельствует интерес участников, проявлявшийся буквально по
каждому выступлению лекторов. </p>
<div class="subd">
<h4>Онищенко Н.И.</h4>
<p>к.г.н., Заслуженный Эколог РФ, заместитель руководителя подразделения «Сахалин
Энерджи Инвестмент Лтд»</p>
</div>
</div>
</div>
<!-- <div class="col">
<div class="theme">
<p></p>
<div class="subd">
<h4></h4>
<p></p>
</div>
</div>
</div> -->
</div>
</div>
</div>
</div>
<div class="capture">
<div class="container text-white">
<div class="row">
<div class="col-md-12 text-center">
<h3>Запишитесь на конферецию уже сегодня!</h3>
<p>Вы можете забронировать место на участие в конференции прямо сейчас. Просто отправьте заявку
и наши специалисты свяжутся с вами в ближайшее время, а также ответят на все интересующие
вопросы.
Торопитесь, количество мест ограничено.</p>
</div>
<div class="col-md-12">
<form class="m-auto d-flex" id="form3" method="POST">
<div class="form-group">
<input type="hidden" name="formData" value="Запись на конференцию. Записаться на конференцию">
<input type="text" class="form-control inp-lg" id="name" name="name" placeholder="Как к вам обращаться?" required>
</div>
<div class="form-group">
<input type="tel" class="form-control inp-lg" id="phone" name="phone" placeholder="+7" required>
</div>
<div class="form-group">
<button type="submit" class="btn btn-warning btn-lg">Записаться на конференцию</button>
</div>
</form>
</div>
</div>
</div>
</div>
</main>
<footer class="px-5 py-2 border-top position-relative">
<a class="top_scroll" href="#header" title="">
<svg viewBox="0 0 60 60">
<path d="M 5 35 29 5 31 5 55 35" />
</svg>
</a>
<div class="row align-items-center justify-content-center">
<div class="col-12 col-md text-center">
<p class="m-0 text-muted">&copy; 2019 ООО «РПН-Сфера»</p>
</div>
<div class="col-12 col-md text-center pl-5">
<a class="fooimg" href="#" target="_blank" rel="noopener noreferrer"><img src="/src/logo_64.png" alt=""></a>
</div>
<div class="col-12 col-md text-right">
<p class="m-0 text-muted">Made in <a class="text-warning" href="https://madeas.ru" target="_blank" rel="noopener noreferrer"
title="Андрей Шарапов – веб-дизайнер, frontend разработчик, баннермейкер">MADEAS.ru</a></p>
</div>
</div>
<div class="modal fade" id="сons" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Заполните форму и получите бесплатную консультацию по данному мероприятию.</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form class="m-auto" id="form4" method="POST">
<div class="form-group">
<label for="name">Представьтесь, пожалуйста: </label>
<input type="hidden" name="formData" value="Запрос на консультациию. Кнопка в шапке">
<input type="text" class="form-control" id="name" name="name" placeholder="Как к вам обращаться?" required>
</div>
<div class="form-group">
<label for="phone">Ваш контактный телефон: </label>
<input type="tel" class="form-control" id="phone" name="phone" placeholder="+7" required>
</div>
<div class="form-group">
<button type="submit" class="btn btn-theme">Получить консультацию</button>
</div>
</form>
</div>
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js'></script>
<script>
$(".nav .nav-link").on("click", function () {
$(".nav").find(".active").removeClass("active");
$(this).addClass("active");
});
$('.autoplay').on('init', function (slick) {
$('.slick-dots').on('click', function () {
$('.autoplay').slick('slickPause');
});
}).slick({
slidesToShow: 3,
slidesToScroll: 1,
dots: true,
autoplay: true,
autoplaySpeed: 2000,
responsive: [{
breakpoint: 1024,
settings: {
slidesToShow: 2,
slidesToScroll: 2,
infinite: true,
dots: false
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
dots: false
}
}
]
});
$("a").click(function () {
const elementClick = $(this).attr("href");
const destination = $(elementClick).offset().top;
$('html, body').animate({
scrollTop: destination
}, 600);
return false;
});
$(document).ready(function () {
$('form').submit(function () {
var formID = $(this).attr('id');
var formNm = $('#' + formID);
$.ajax({
type: 'POST',
url: 'feedback.php',
data: formNm.serialize(),
success: function (data) {
$(formNm).html(data);
}
});
return false;
});
});
</script>
</footer>
</body>
</html>
Raw
style.css
*,
::before,
::after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-family: sans-serif;
line-height: 1.15;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-webkit-tap-highlight-color: transparent;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
margin: 0;
overflow-x: hidden;
min-height: 100vh;
line-height: 1.5;
font-size: 62.5%;
}
header,
main,
footer {
font-family: 'Lato', sans-serif;
font-size: 1rem;
font-weight: 400;
}
a {
text-decoration: none;
}
h1 {
position: relative;
text-transform: uppercase;
font-size: 1.75rem;
font-weight: 600;
}
h1 span {
margin-bottom: 0.5em;
display: block;
font-size: 3rem;
}
@media (max-width: 768px) {
h1 span {
font-size: 1rem;
}
}
@media (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
}
h2 {
margin: 0;
margin-bottom: 1em;
font-size: 2.5rem;
font-weight: 700;
}
@media (max-width: 768px) {
h2 {
font-size: 1.75rem;
}
}
h4 {
font-size: 1.5rem;
}
@media (max-width: 768px) {
h4 {
font-size: 1.2rem;
}
}
ul {
list-style-type: none;
padding: 0;
margin: 0;
}
.btn {
border-width: 3px;
}
.btn-theme {
color: #ffffff;
border: 3px solid #008fd1;
background-color: #008fd1;
}
.btn-theme:hover {
color: #ffffff;
border: 3px solid #48f;
background-color: #48f;
}
.btn.pdf {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.btn.pdf svg {
margin-right: 7px;
width: 20px;
fill: #ffc107;
}
.btn.pdf:hover svg {
fill: #101a1f;
}
.bg-global {
background-color: #48f;
}
header,
main,
footer {
color: #395d70;
}
.navbar {
padding: 1em 2em;
z-index: 2;
}
.navbar .logo {
width: 150px;
}
.navbar .navbar-nav .nav-item.active .nav-link {
color: #008fd1;
}
.navbar .navbar-nav .nav-link {
margin: auto 1em;
font-weight: 600;
color: #395d70;
}
.navbar .navbar-nav .nav-link:hover {
color: #008fd1;
}
.navbar #menu path {
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
stroke-miterlimit: 10;
-webkit-transition: -webkit-transform .2s linear;
transition: -webkit-transform .2s linear;
transition: transform .2s linear;
transition: transform .2s linear, -webkit-transform .2s linear;
}
.navbar .navbar-toggler {
border-color: transparent;
}
.navbar .navbar-toggler[aria-expanded="true"] #menu #m_1 {
-webkit-transform: translateY(3px);
transform: translateY(3px);
}
.navbar .navbar-toggler[aria-expanded="true"] #menu #m_3 {
-webkit-transform: translateY(-3px);
transform: translateY(-3px);
}
.navbar .navbar-toggler:focus {
outline: none;
}
.modal .close {
font-size: 2rem;
font-weight: 400;
-webkit-transition: -webkit-transform 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);
transition: -webkit-transform 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);
transition: transform 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);
transition: transform 0.2s cubic-bezier(0.39, 0.575, 0.565, 1), -webkit-transform 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);
}
.modal .close:hover {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
.modal .close:focus {
outline: none;
}
.masthead {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
min-height: 90vh;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: url("/src/EVA_7794.jpg");
background-size: cover;
}
.masthead::before {
position: absolute;
content: '';
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 0;
background-image: linear-gradient(45deg, #003591, rgba(0, 21, 31, 0.7));
}
.masthead .svg_ar {
position: absolute;
top: -35px;
left: -100px;
fill: none;
stroke: #ffffff;
stroke-width: 2;
stroke-linecap: round;
stroke-dasharray: 180;
stroke-dashoffset: 180;
-webkit-animation: checked 500ms linear 5s forwards;
animation: checked 500ms linear 5s forwards;
}
@media (max-width: 991px) {
.masthead .svg_ar {
display: none;
}
}
.masthead .container {
position: relative;
z-index: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 100%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.masthead .container .data {
position: relative;
margin: 1em 0;
margin-right: 3em;
padding-bottom: 1em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.masthead .container .data p {
margin: 0;
}
.masthead .container .data p.num {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 1.25rem;
font-weight: 600;
}
@media (max-width: 786px) {
.masthead #programma {
margin-top: 1em;
}
}
.masthead form {
position: relative;
overflow: hidden;
padding: 1em;
border: 1px solid rgba(255, 255, 255, 0.4);
border-radius: 0.35em;
background: inherit;
-webkit-box-shadow: 0px 0px 70px rgba(57, 93, 112, 0.2);
box-shadow: 0px 0px 70px rgba(57, 93, 112, 0.2);
}
.masthead form::before {
position: absolute;
top: -5%;
left: -5%;
z-index: -1;
content: '';
width: 110%;
height: 110%;
background: inherit;
-webkit-box-shadow: inset 0 0 0 200px rgba(255, 255, 255, 0.3);
box-shadow: inset 0 0 0 200px rgba(255, 255, 255, 0.3);
-webkit-filter: blur(30px);
filter: blur(30px);
}
.masthead form a {
color: #ffffff;
text-decoration: none;
}
.masthead form .form-check label {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
cursor: pointer;
}
.masthead form #field {
display: none;
}
.masthead form #field:checked + label .checkbox {
stroke: #ffffff;
}
.masthead form #field:checked + label .checkbox polyline {
stroke-dasharray: 50;
stroke-dashoffset: 50;
-webkit-animation: checked 0.5s ease forwards;
animation: checked 0.5s ease forwards;
}
.masthead form .checkbox {
margin-right: 10px;
width: 20px;
height: 20px;
fill: none;
stroke-width: 3;
}
.masthead form .checkbox rect {
stroke: #b8e8ff;
}
main {
background-color: #f4f4f4;
}
main .container {
padding: 1em;
}
main .container.nums {
position: relative;
margin-top: -2em;
margin-bottom: 3em;
border-radius: 0.35em;
background-color: #ffffff;
-webkit-box-shadow: 0px 5px 30px rgba(57, 93, 112, 0.1);
box-shadow: 0px 5px 30px rgba(57, 93, 112, 0.1);
}
main .container.nums .list li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
margin-bottom: 0.5em;
-webkit-transition: -webkit-transform 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
transition: -webkit-transform 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
transition: transform 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
transition: transform 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-transform 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
will-change: transform;
}
main .container.nums .list li .lead {
font-size: 1rem;
}
main .container.nums .list li svg {
width: 38px;
height: 38px;
fill: none;
stroke: #ffc107;
stroke-width: 2;
margin-right: 15px;
}
main .container.nums .list li:hover {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
main .container.nums .list li:hover svg {
stroke-dasharray: 200;
stroke-dashoffset: 200;
-webkit-animation: checked 0.7s linear forwards;
animation: checked 0.7s linear forwards;
}
main .container.nums img {
max-width: 100%;
}
main .speaker {
position: relative;
min-height: 50vh;
color: #ffffff;
background-color: #48f;
background-image: url("/src/EVA_7897.jpg");
background-attachment: fixed;
background-size: cover;
}
main .speaker::before {
position: absolute;
content: '';
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 0;
background-image: linear-gradient(45deg, #003591, rgba(0, 21, 31, 0.7));
}
main .speaker .container {
position: relative;
z-index: 1;
}
main .speaker .container .col {
padding: 1em;
}
main .speaker .container .col .theme {
padding: 2em 1em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
min-height: 200px;
height: 100%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
border: 1px solid #005075;
border-radius: 0.35em;
background-image: linear-gradient(45deg, transparent, rgba(0, 143, 209, 0.9), rgba(0, 143, 209, 0.9)), url(/src/fav_192.png);
background-position: 115% 15%;
background-repeat: no-repeat;
-webkit-box-shadow: 0px 3px 13px 1px rgba(57, 93, 112, 0.08);
box-shadow: 0px 3px 13px 1px rgba(57, 93, 112, 0.08);
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
}
@media (max-width: 991px) {
main .speaker .container .col .theme {
min-height: auto;
}
}
main .speaker .container .col .theme h3 {
text-transform: uppercase;
font-weight: 600;
font-size: 20px;
}
main .speaker .container .col .theme img {
margin: auto;
margin-bottom: 1em;
width: 256px;
}
main .speaker .container .col .theme .subd h4,
main .speaker .container .col .theme .subd p {
color: #ffc107;
}
main .speaker .container .col .theme:hover {
-webkit-transform: scale(1.03);
transform: scale(1.03);
-webkit-box-shadow: 0px 6px 9px 0px rgba(0, 0, 0, 0.09);
box-shadow: 0px 6px 9px 0px rgba(0, 0, 0, 0.09);
}
.slick-next::before,
.slick-prev::before {
font-size: 2rem;
color: #008fd1;
}
.slick-prev {
left: -55px;
}
.slick-next {
right: -55px;
}
.slick-dots {
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: auto;
}
.slick-dots li {
margin: 0;
height: 7px;
}
.slick-dots li button {
height: inherit;
}
.slick-dots li button::before {
content: '';
height: inherit;
background-color: black;
}
.slick-dots li.slick-active button::before {
background-color: #ffc107;
}
.testimonials .slider {
margin: 2em auto;
}
.testimonials .col .theme {
margin: 1em auto;
padding: 2em 1em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
min-height: 400px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
border-radius: 0.35em;
border: 1px solid #efefef;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0.9))), url(/src/fav_192.png);
background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/src/fav_192.png);
background-position: 115% 55%;
background-repeat: no-repeat;
-webkit-box-shadow: 0px 3px 13px 1px rgba(57, 93, 112, 0.08);
box-shadow: 0px 3px 13px 1px rgba(57, 93, 112, 0.08);
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
}
.testimonials .col .theme .subd h4,
.testimonials .col .theme .subd p {
color: #48f;
}
.testimonials .col .theme:hover {
-webkit-transform: scale(1.03);
transform: scale(1.03);
border-color: #e0e0e0;
-webkit-box-shadow: 0px 6px 9px 0px rgba(0, 0, 0, 0.09);
box-shadow: 0px 6px 9px 0px rgba(0, 0, 0, 0.09);
}
.module form,
.capture form {
position: relative;
padding-top: 2em;
max-width: 90%;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.module form .form-group,
.capture form .form-group {
min-width: 32%;
}
.module form .inp-lg,
.capture form .inp-lg {
padding: .75rem 1rem;
min-height: 52px;
font-size: 1rem;
line-height: 1.5;
background-color: #ffffff;
}
.module form .inp-lg:focus,
.capture form .inp-lg:focus {
border-color: #ffc107;
-webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25);
box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25);
}
.capture {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
min-height: 75vh;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: url("/src/EVA_7887.jpg");
background-size: cover;
}
.capture::before {
position: absolute;
content: '';
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 0;
background-image: linear-gradient(45deg, #003591, rgba(0, 21, 31, 0.7));
}
footer .top_scroll {
position: absolute;
top: -30px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
footer .top_scroll svg {
width: 18px;
fill: none;
stroke: #f4f4f4;
stroke-width: 5;
-webkit-animation: vawe 700ms cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite;
animation: vawe 700ms cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite;
}
footer .top_scroll svg:hover {
-webkit-animation: none;
animation: none;
}
footer .fooimg img {
width: 192px;
}
@media (max-width: 768px) {
footer .fooimg {
display: none;
}
}
@-webkit-keyframes checked {
to {
stroke-dashoffset: 0;
}
}
@keyframes checked {
to {
stroke-dashoffset: 0;
}
}
@-webkit-keyframes vawe {
50% {
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
@keyframes vawe {
50% {
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
@media (max-width: 991px) {
.module form,
.capture form {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.module form .form-group,
.capture form .form-group {
width: 100%;
text-align: center;
}
}
/*# sourceMappingURL=style.css.map */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment