Старт

This commit is contained in:
2023-11-07 19:51:49 +06:00
commit 86542a157f
5002 changed files with 199551 additions and 0 deletions

183
site/404.html Normal file
View File

@ -0,0 +1,183 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item active" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">404
<small>Страница ошибок</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">404</li>
</ol>
<div class="jumbotron">
<h1 class="display-1">404</h1>
<p>Страница, которую вы ищете, не может быть найдена. Просмотрите карту сайта и найдите то, что вас интересует:</p>
<ul>
<li>
<a href="index.html">Главная</a>
</li>
<li>
<a href="about.html">О сайте</a>
</li>
<li>
<a href="services.html">Сервис</a>
</li>
<li>
<a href="contact.html">Контакты</a>
</li>
<li>
Портфолио
<ul>
<li>
<a href="portfolio-1-col.html">Порфолио в 1 колонку</a>
</li>
<li>
<a href="portfolio-2-col.html">Порфолио в 2 колонку</a>
</li>
<li>
<a href="portfolio-3-col.html">Порфолио в 3 колонку</a>
</li>
<li>
<a href="portfolio-4-col.html">Порфолио в 4 колонку</a>
</li>
</ul>
</li>
<li>
Блог
<ul>
<li>
<a href="blog-home-1.html">Блог с сайдбаром</a>
</li>
<li>
<a href="blog-home-2.html">Блог без сайдбара</a>
</li>
<li>
<a href="blog-post.html">Отдельная страница</a>
</li>
</ul>
</li>
<li>
Другие страницы
<ul>
<li>
<a href="full-width-page.html">Пустая страница</a>
</li>
<li>
<a href="sidebar.html">Страница с сайдбаром</a>
</li>
<li>
<a href="faq.html">FAQ</a>
</li>
<li>
<a href="404.html">404 страница ошибок</a>
</li>
<li>
<a href="pricing-table.html">Карточки цен</a>
</li>
</ul>
</li>
</ul>
</div>
<!-- /.jumbotron -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

196
site/about_en.html Normal file
View File

@ -0,0 +1,196 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="/site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="/site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">О сайте
<small>описание</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">О сайте</li>
</ol>
<!-- Intro Content -->
<div class="row">
<div class="col-lg-6">
<img class="img-fluid rounded mb-4" src="http://placehold.it/750x450" alt="">
</div>
<div class="col-lg-6">
<h2>Описание проекта</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed voluptate nihil eum consectetur similique? Consectetur, quod, incidunt, harum nisi dolores delectus reprehenderit voluptatem perferendis dicta dolorem non blanditiis ex fugiat.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, magni, aperiam vitae illum voluptatum aut sequi impedit non velit ab ea pariatur sint quidem corporis eveniet. Odit, temporibus reprehenderit dolorum!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Et, consequuntur, modi mollitia corporis ipsa voluptate corrupti eum ratione ex ea praesentium quibusdam? Aut, in eum facere corrupti necessitatibus perspiciatis quis?</p>
</div>
</div>
<!-- /.row -->
<!-- Team Members -->
<h2>Подробности</h2>
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 1</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 2</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 3</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Our Customers -->
<h2>Примеры работ</h2>
<div class="row">
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

196
site/about_ru.html Normal file
View File

@ -0,0 +1,196 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">О сайте
<small>описание</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">О сайте</li>
</ol>
<!-- Intro Content -->
<div class="row">
<div class="col-lg-6">
<img class="img-fluid rounded mb-4" src="http://placehold.it/750x450" alt="">
</div>
<div class="col-lg-6">
<h2>Описание проекта</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed voluptate nihil eum consectetur similique? Consectetur, quod, incidunt, harum nisi dolores delectus reprehenderit voluptatem perferendis dicta dolorem non blanditiis ex fugiat.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, magni, aperiam vitae illum voluptatum aut sequi impedit non velit ab ea pariatur sint quidem corporis eveniet. Odit, temporibus reprehenderit dolorum!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Et, consequuntur, modi mollitia corporis ipsa voluptate corrupti eum ratione ex ea praesentium quibusdam? Aut, in eum facere corrupti necessitatibus perspiciatis quis?</p>
</div>
</div>
<!-- /.row -->
<!-- Team Members -->
<h2>Подробности</h2>
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 1</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 2</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 3</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Our Customers -->
<h2>Примеры работ</h2>
<div class="row">
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

235
site/blog-home-1.html Normal file
View File

@ -0,0 +1,235 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Блок постов с сайдбаром</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item active" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Блог постов
<small>с сайдбаром</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Блог постов с сайдбаром</li>
</ol>
<div class="row">
<!-- Blog Entries Column -->
<div class="col-md-8">
<!-- Blog Post -->
<div class="card mb-4">
<img class="card-img-top" src="http://placehold.it/750x300" alt="Card image cap">
<div class="card-body">
<h2 class="card-title">Пост номер 1</h2>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis aliquid atque, nulla? Quos cum ex quis soluta, a laboriosam. Dicta expedita corporis animi vero voluptate voluptatibus possimus, veniam magni quis!</p>
<a href="#" class="btn btn-primary">Подробно &rarr;</a>
</div>
<div class="card-footer text-muted">
Октябрь, 28, 2019
<a href="#">Раздел</a>
</div>
</div>
<!-- Blog Post -->
<div class="card mb-4">
<img class="card-img-top" src="http://placehold.it/750x300" alt="Card image cap">
<div class="card-body">
<h2 class="card-title">Пост номер 2</h2>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis aliquid atque, nulla? Quos cum ex quis soluta, a laboriosam. Dicta expedita corporis animi vero voluptate voluptatibus possimus, veniam magni quis!</p>
<a href="#" class="btn btn-primary">Подробно &rarr;</a>
</div>
<div class="card-footer text-muted">
Октябрь, 28, 2019
<a href="#">Раздел</a>
</div>
</div>
<!-- Blog Post -->
<div class="card mb-4">
<img class="card-img-top" src="http://placehold.it/750x300" alt="Card image cap">
<div class="card-body">
<h2 class="card-title">Пост номер 3</h2>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis aliquid atque, nulla? Quos cum ex quis soluta, a laboriosam. Dicta expedita corporis animi vero voluptate voluptatibus possimus, veniam magni quis!</p>
<a href="#" class="btn btn-primary">Подробно &rarr;</a>
</div>
<div class="card-footer text-muted">
Октябрь, 28, 2019
<a href="#">Раздел</a>
</div>
</div>
<!-- Pagination -->
<ul class="pagination justify-content-center mb-4">
<li class="page-item">
<a class="page-link" href="#">&larr; назад</a>
</li>
<li class="page-item disabled">
<a class="page-link" href="#">вперёд &rarr;</a>
</li>
</ul>
</div>
<!-- Sidebar Widgets Column -->
<div class="col-md-4">
<!-- Search Widget -->
<div class="card mb-4">
<h5 class="card-header">Поиск</h5>
<div class="card-body">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search for...">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Вперёд!</button>
</span>
</div>
</div>
</div>
<!-- Categories Widget -->
<div class="card my-4">
<h5 class="card-header">Категории</h5>
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<ul class="list-unstyled mb-0">
<li>
<a href="#">Web Design</a>
</li>
<li>
<a href="#">HTML</a>
</li>
<li>
<a href="#">Freebies</a>
</li>
</ul>
</div>
<div class="col-lg-6">
<ul class="list-unstyled mb-0">
<li>
<a href="#">JavaScript</a>
</li>
<li>
<a href="#">CSS</a>
</li>
<li>
<a href="#">Tutorials</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Side Widget -->
<div class="card my-4">
<h5 class="card-header">Отдельно</h5>
<div class="card-body">
You can put anything you want inside of these side widgets. They are easy to use, and feature the new Bootstrap 4 card containers!
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

212
site/blog-home-2.html Normal file
View File

@ -0,0 +1,212 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item active" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Блог постов
<small>Короткие новости</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Короткие новости</li>
</ol>
<!-- Blog Post -->
<div class="card mb-4">
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<a href="#">
<img class="img-fluid rounded" src="http://placehold.it/750x300" alt="">
</a>
</div>
<div class="col-lg-6">
<h2 class="card-title">Название поста 1</h2>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis aliquid atque, nulla? Quos cum ex quis soluta, a laboriosam. Dicta expedita corporis animi vero voluptate voluptatibus possimus, veniam magni quis!</p>
<a href="#" class="btn btn-primary">Подробно &rarr;</a>
</div>
</div>
</div>
<div class="card-footer text-muted">
29 октября 2019
<a href="#">Раздел: </a>
</div>
</div>
<!-- Blog Post -->
<div class="card mb-4">
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<a href="#">
<img class="img-fluid rounded" src="http://placehold.it/750x300" alt="">
</a>
</div>
<div class="col-lg-6">
<h2 class="card-title">Название поста 2</h2>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis aliquid atque, nulla? Quos cum ex quis soluta, a laboriosam. Dicta expedita corporis animi vero voluptate voluptatibus possimus, veniam magni quis!</p>
<a href="#" class="btn btn-primary">Подробно &rarr;</a>
</div>
</div>
</div>
<div class="card-footer text-muted">
29 октября 2019
<a href="#">Раздел: </a>
</div>
</div>
<!-- Blog Post -->
<div class="card mb-4">
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<a href="#">
<img class="img-fluid rounded" src="http://placehold.it/750x300" alt="">
</a>
</div>
<div class="col-lg-6">
<h2 class="card-title">Название поста 3</h2>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis aliquid atque, nulla? Quos cum ex quis soluta, a laboriosam. Dicta expedita corporis animi vero voluptate voluptatibus possimus, veniam magni quis!</p>
<a href="#" class="btn btn-primary">Подробно &rarr;</a>
</div>
</div>
</div>
<div class="card-footer text-muted">
29 октября 2019
<a href="#">Раздел: </a>
</div>
</div>
<!-- Blog Post -->
<div class="card mb-4">
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<a href="#">
<img class="img-fluid rounded" src="http://placehold.it/750x300" alt="">
</a>
</div>
<div class="col-lg-6">
<h2 class="card-title">Название поста 4</h2>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis aliquid atque, nulla? Quos cum ex quis soluta, a laboriosam. Dicta expedita corporis animi vero voluptate voluptatibus possimus, veniam magni quis!</p>
<a href="#" class="btn btn-primary">Подробно &rarr;</a>
</div>
</div>
</div>
<div class="card-footer text-muted">
29 октября 2019
<a href="#">Раздел: </a>
</div>
</div>
<!-- Pagination -->
<ul class="pagination justify-content-center mb-4">
<li class="page-item">
<a class="page-link" href="#">&larr; назад</a>
</li>
<li class="page-item disabled">
<a class="page-link" href="#">вперёд &rarr;</a>
</li>
</ul>
</div>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

263
site/blog-post.html Normal file
View File

@ -0,0 +1,263 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Modern Business - Start Bootstrap Template</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item active" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Страница
<small>отдельного
<a href="#">поста</a>
</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Отдельный пост</li>
</ol>
<div class="row">
<!-- Post Content Column -->
<div class="col-lg-8">
<!-- Preview Image -->
<img class="img-fluid rounded" src="http://placehold.it/900x300" alt="">
<hr>
<!-- Date/Time -->
<p>Пост от 1 ноября 2019 - 12:00 </p>
<hr>
<!-- Post Content -->
<p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus, vero, obcaecati, aut, error quam sapiente nemo saepe quibusdam sit excepturi nam quia corporis eligendi eos magni recusandae laborum minus inventore?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut, tenetur natus doloremque laborum quos iste ipsum rerum obcaecati impedit odit illo dolorum ab tempora nihil dicta earum fugiat. Temporibus, voluptatibus.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos, doloribus, dolorem iusto blanditiis unde eius illum consequuntur neque dicta incidunt ullam ea hic porro optio ratione repellat perspiciatis. Enim, iure!</p>
<blockquote class="blockquote">
<p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<footer class="blockquote-footer">Someone famous in
<cite title="Source Title">Source Title</cite>
</footer>
</blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Error, nostrum, aliquid, animi, ut quas placeat totam sunt tempora commodi nihil ullam alias modi dicta saepe minima ab quo voluptatem obcaecati?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum, dolor quis. Sunt, ut, explicabo, aliquam tenetur ratione tempore quidem voluptates cupiditate voluptas illo saepe quaerat numquam recusandae? Qui, necessitatibus, est!</p>
<hr>
<!-- Comments Form -->
<div class="card my-4">
<h5 class="card-header">Комментарии:</h5>
<div class="card-body">
<form>
<div class="form-group">
<textarea class="form-control" rows="3"></textarea>
</div>
<button type="submit" class="btn btn-primary">Отправить</button>
</form>
</div>
</div>
<!-- Single Comment -->
<div class="media mb-4">
<img class="d-flex mr-3 rounded-circle" src="http://placehold.it/50x50" alt="">
<div class="media-body">
<h5 class="mt-0">Имя пользователя</h5>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
</div>
</div>
<!-- Comment with nested comments -->
<div class="media mb-4">
<img class="d-flex mr-3 rounded-circle" src="http://placehold.it/50x50" alt="">
<div class="media-body">
<h5 class="mt-0">Имя пользователя</h5>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
<div class="media mt-4">
<img class="d-flex mr-3 rounded-circle" src="http://placehold.it/50x50" alt="">
<div class="media-body">
<h5 class="mt-0">Имя пользователя</h5>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
</div>
</div>
<div class="media mt-4">
<img class="d-flex mr-3 rounded-circle" src="http://placehold.it/50x50" alt="">
<div class="media-body">
<h5 class="mt-0">Имя пользователя</h5>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
</div>
</div>
</div>
</div>
</div>
<!-- Sidebar Widgets Column -->
<div class="col-md-4">
<!-- Search Widget -->
<div class="card mb-4">
<h5 class="card-header">Поиск</h5>
<div class="card-body">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search for...">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Вперёд!</button>
</span>
</div>
</div>
</div>
<!-- Categories Widget -->
<div class="card my-4">
<h5 class="card-header">Категории</h5>
<div class="card-body">
<div class="row">
<div class="col-lg-6">
<ul class="list-unstyled mb-0">
<li>
<a href="#">Web Design</a>
</li>
<li>
<a href="#">HTML</a>
</li>
<li>
<a href="#">Freebies</a>
</li>
</ul>
</div>
<div class="col-lg-6">
<ul class="list-unstyled mb-0">
<li>
<a href="#">JavaScript</a>
</li>
<li>
<a href="#">CSS</a>
</li>
<li>
<a href="#">Tutorials</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Side Widget -->
<div class="card my-4">
<h5 class="card-header">Отдельно</h5>
<div class="card-body">
You can put anything you want inside of these side widgets. They are easy to use, and feature the new Bootstrap 4 card containers!
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

View File

@ -0,0 +1,196 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">О сайте
<small>описание</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">О сайте</li>
</ol>
<!-- Intro Content -->
<div class="row">
<div class="col-lg-6">
<img class="img-fluid rounded mb-4" src="http://placehold.it/750x450" alt="">
</div>
<div class="col-lg-6">
<h2>Описание проекта</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed voluptate nihil eum consectetur similique? Consectetur, quod, incidunt, harum nisi dolores delectus reprehenderit voluptatem perferendis dicta dolorem non blanditiis ex fugiat.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe, magni, aperiam vitae illum voluptatum aut sequi impedit non velit ab ea pariatur sint quidem corporis eveniet. Odit, temporibus reprehenderit dolorum!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Et, consequuntur, modi mollitia corporis ipsa voluptate corrupti eum ratione ex ea praesentium quibusdam? Aut, in eum facere corrupti necessitatibus perspiciatis quis?</p>
</div>
</div>
<!-- /.row -->
<!-- Team Members -->
<h2>Подробности</h2>
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 1</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 2</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100 text-center">
<img class="card-img-top" src="http://placehold.it/750x450" alt="">
<div class="card-body">
<h4 class="card-title">Описание 3</h4>
<h6 class="card-subtitle mb-2 text-muted">Position</h6>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus aut mollitia eum ipsum fugiat odio officiis odit.</p>
</div>
<div class="card-footer">
<a href="#">name@example.com</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Our Customers -->
<h2>Примеры работ</h2>
<div class="row">
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
<div class="col-lg-2 col-sm-4 mb-4">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

187
site/contact.html Normal file
View File

@ -0,0 +1,187 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Страница
<small>контактов</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Home</a>
</li>
<li class="breadcrumb-item active">Contact</li>
</ol>
<!-- Content Row -->
<div class="row">
<!-- Map Column -->
<div class="col-lg-8 mb-4">
<!-- Embedded Google Map -->
<iframe src="https://yandex.ru/map-widget/v1/-/CGDgj48T" width="100%" height="400" frameborder="1" allowfullscreen="true"></iframe>
</div>
<!-- Contact Details Column -->
<div class="col-lg-4 mb-4">
<h3>Обратная связь</h3>
<p>
Россия
<br>Москва, Красная Площадь
<br>
</p>
<p>
<abbr title="Phone">P</abbr>: (000) 000-0000
</p>
<p>
<abbr title="Email">E</abbr>:
<a href="mailto:name@example.com">name@example.com
</a>
</p>
<p>
<abbr title="Hours">H</abbr>: Понедельник - Пятница: 9:00 до 18:00
</p>
</div>
</div>
<!-- /.row -->
<!-- Contact Form -->
<!-- In order to set the email address and subject line for the contact form go to the bin/contact_me.php file. -->
<div class="row">
<div class="col-lg-8 mb-4">
<h3>Пишите нам</h3>
<form name="sentMessage" id="contactForm" novalidate>
<div class="control-group form-group">
<div class="controls">
<label>Имя:</label>
<input type="text" class="form-control" id="name" required data-validation-required-message="Please enter your name.">
<p class="help-block"></p>
</div>
</div>
<div class="control-group form-group">
<div class="controls">
<label>Телефон:</label>
<input type="tel" class="form-control" id="phone" required data-validation-required-message="Please enter your phone number.">
</div>
</div>
<div class="control-group form-group">
<div class="controls">
<label>E-mail:</label>
<input type="email" class="form-control" id="email" required data-validation-required-message="Please enter your email address.">
</div>
</div>
<div class="control-group form-group">
<div class="controls">
<label>Текст:</label>
<textarea rows="10" cols="100" class="form-control" id="message" required data-validation-required-message="Please enter your message" maxlength="999" style="resize:none"></textarea>
</div>
</div>
<div id="success"></div>
<!-- For success/fail messages -->
<button type="submit" class="btn btn-primary" id="sendMessageButton">Отправить</button>
</form>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
<!-- Contact form JavaScript -->
<!-- Do not edit these files! In order to set the email address and subject line for the contact form go to the bin/contact_me.php file. -->
<script src="js/jqBootstrapValidation.js"></script>
<script src="js/contact_me.js"></script>
</body>
</html>

7
site/css/bootstrap.min.css vendored Normal file

File diff suppressed because one or more lines are too long

10038
site/css/bootstrap4.3.1.css vendored Normal file

File diff suppressed because it is too large Load Diff

18
site/css/style.css Normal file
View File

@ -0,0 +1,18 @@
body {
padding-top: 56px; /* Отступ сверху для фиксированного меню */
}
.carousel-item { /* Параметры слайдера на главной странице */
height: 65vh;
min-height: 300px;
background: no-repeat center center scroll;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.portfolio-item { /* Отступы между карточками class="card" */
margin-bottom: 30px;
}

153
site/faq.html Normal file
View File

@ -0,0 +1,153 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item active" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">FAQ
<small>Ответы на популярные вопросы</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">FAQ</li>
</ol>
<div class="mb-4" id="accordion" role="tablist" aria-multiselectable="true">
<div class="card">
<div class="card-header" role="tab" id="headingOne">
<h5 class="mb-0">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">Ответ на вопрос #1</a>
</h5>
</div>
<div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne">
<div class="card-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
<div class="card">
<div class="card-header" role="tab" id="headingTwo">
<h5 class="mb-0">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">Ответ на вопрос #2
</a>
</h5>
</div>
<div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo">
<div class="card-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
<div class="card">
<div class="card-header" role="tab" id="headingThree">
<h5 class="mb-0">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">Ответ на вопрос #3</a>
</h5>
</div>
<div id="collapseThree" class="collapse" role="tabpanel" aria-labelledby="headingThree">
<div class="card-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
</div>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

115
site/full-width.html Normal file
View File

@ -0,0 +1,115 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item active" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Текстовая информация
<small>Subheading</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Текстовая информация</li>
</ol>
<p>Большинство шаблонов Bootstrap могут быть интегрированы в современный бизнес шаблон. Вы можете скачать готовые шаблоны на нашем сайте по адресу
<a href="https://templates.sitey.ru/">Templates.SiteY.ru</a>.</p>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

BIN
site/img/bg-1.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

BIN
site/img/bg-2.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

BIN
site/img/bg-3.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

288
site/index_en.html Normal file
View File

@ -0,0 +1,288 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<header>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<!-- Slide One - Установите фоновое изображение для этого слайда в строке ниже -->
<div class="carousel-item active" style="background-image: url(site/img/bg-1.jpg);">
<div class="carousel-caption d-none d-md-block">
<h3>Первая картинка слайдера</h3>
<p>Это описание для первого слайда.</p>
</div>
</div>
<!-- Slide Two - Установите фоновое изображение для этого слайда в строке ниже -->
<div class="carousel-item" style="background-image: url(site/img/bg-2.jpg)">
<div class="carousel-caption d-none d-md-block">
<h3>Вторая картинка слайдера</h3>
<p>Это описание для второго слайда.</p>
</div>
</div>
<!-- Slide Three - Установите фоновое изображение для этого слайда в строке ниже -->
<div class="carousel-item" style="background-image: url(site/img/bg-3.jpg)">
<div class="carousel-caption d-none d-md-block">
<h3>Третья картинка слайдера</h3>
<p>Это описание для третьего слайда.</p>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</header>
<!-- Page Content -->
<div class="container">
<h1 class="my-4">Приглашаем в наш бизнес</h1>
<!-- Marketing Icons Section -->
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Карточка 1</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente esse necessitatibus neque.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Далее</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Карточка 2</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis ipsam eos, nam perspiciatis natus commodi similique totam consectetur praesentium molestiae atque exercitationem ut consequuntur, sed eveniet, magni nostrum sint fuga.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Далее</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Карточка 3</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente esse necessitatibus neque.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Далее</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Portfolio Section -->
<h2>Представляем работы</h2>
<div class="row">
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 1</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet numquam aspernatur eum quasi sapiente nesciunt? Voluptatibus sit, repellat sequi itaque deserunt, dolores in, nesciunt, illum tempora ex quae? Nihil, dolorem!</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 2</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 3</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos quisquam, error quod sed cumque, odio distinctio velit nostrum temporibus necessitatibus et facere atque iure perspiciatis mollitia recusandae vero vel quam!</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 4</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 5</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 6</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque earum nostrum suscipit ducimus nihil provident, perferendis rem illo, voluptate atque, sit eius in voluptates, nemo repellat fugiat excepturi! Nemo, esse.</p>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Features Section -->
<div class="row">
<div class="col-lg-6">
<h2>Старт нашего бизнеса</h2>
<p>Фрейворк Bootstrap включает в себя:</p>
<ul>
<li>
<strong>Bootstrap v4.3.1</strong>
</li>
<li>jQuery</li>
<li>Font Awesome</li>
<li>Working contact form with validation</li>
<li>Unstyled page elements for easy customization</li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, omnis doloremque non cum id reprehenderit, quisquam totam aspernatur tempora minima unde aliquid ea culpa sunt. Reiciendis quia dolorum ducimus unde.</p>
</div>
<div class="col-lg-6">
<img class="img-fluid rounded" src="http://placehold.it/700x450" alt="">
</div>
</div>
<!-- /.row -->
<hr>
<!-- Call to Action Section -->
<div class="row mb-4">
<div class="col-md-8">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias, expedita, saepe, vero rerum deleniti beatae veniam harum neque nemo praesentium cum alias asperiores commodi.</p>
</div>
<div class="col-md-4">
<a class="btn btn-lg btn-secondary btn-block" href="#">Подробнее...</a>
</div>
</div>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="site/js/jquery.min.js"></script>
<script src="site/js/bootstrap.bundle.min.js"></script>
</body>
</html>

288
site/index_ru.html Normal file
View File

@ -0,0 +1,288 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<header>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<!-- Slide One - Установите фоновое изображение для этого слайда в строке ниже -->
<div class="carousel-item active" style="background-image: url(site/img/bg-1.jpg);">
<div class="carousel-caption d-none d-md-block">
<h3>Первая картинка слайдера</h3>
<p>Это описание для первого слайда.</p>
</div>
</div>
<!-- Slide Two - Установите фоновое изображение для этого слайда в строке ниже -->
<div class="carousel-item" style="background-image: url(site/img/bg-2.jpg)">
<div class="carousel-caption d-none d-md-block">
<h3>Вторая картинка слайдера</h3>
<p>Это описание для второго слайда.</p>
</div>
</div>
<!-- Slide Three - Установите фоновое изображение для этого слайда в строке ниже -->
<div class="carousel-item" style="background-image: url(site/img/bg-3.jpg)">
<div class="carousel-caption d-none d-md-block">
<h3>Третья картинка слайдера</h3>
<p>Это описание для третьего слайда.</p>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</header>
<!-- Page Content -->
<div class="container">
<h1 class="my-4">Приглашаем в наш бизнес</h1>
<!-- Marketing Icons Section -->
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Карточка 1</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente esse necessitatibus neque.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Далее</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Карточка 2</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis ipsam eos, nam perspiciatis natus commodi similique totam consectetur praesentium molestiae atque exercitationem ut consequuntur, sed eveniet, magni nostrum sint fuga.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Далее</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Карточка 3</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente esse necessitatibus neque.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Далее</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Portfolio Section -->
<h2>Представляем работы</h2>
<div class="row">
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 1</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet numquam aspernatur eum quasi sapiente nesciunt? Voluptatibus sit, repellat sequi itaque deserunt, dolores in, nesciunt, illum tempora ex quae? Nihil, dolorem!</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 2</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 3</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos quisquam, error quod sed cumque, odio distinctio velit nostrum temporibus necessitatibus et facere atque iure perspiciatis mollitia recusandae vero vel quam!</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 4</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 5</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Проект 6</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque earum nostrum suscipit ducimus nihil provident, perferendis rem illo, voluptate atque, sit eius in voluptates, nemo repellat fugiat excepturi! Nemo, esse.</p>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Features Section -->
<div class="row">
<div class="col-lg-6">
<h2>Старт нашего бизнеса</h2>
<p>Фрейворк Bootstrap включает в себя:</p>
<ul>
<li>
<strong>Bootstrap v4.3.1</strong>
</li>
<li>jQuery</li>
<li>Font Awesome</li>
<li>Working contact form with validation</li>
<li>Unstyled page elements for easy customization</li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, omnis doloremque non cum id reprehenderit, quisquam totam aspernatur tempora minima unde aliquid ea culpa sunt. Reiciendis quia dolorum ducimus unde.</p>
</div>
<div class="col-lg-6">
<img class="img-fluid rounded" src="http://placehold.it/700x450" alt="">
</div>
</div>
<!-- /.row -->
<hr>
<!-- Call to Action Section -->
<div class="row mb-4">
<div class="col-md-8">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias, expedita, saepe, vero rerum deleniti beatae veniam harum neque nemo praesentium cum alias asperiores commodi.</p>
</div>
<div class="col-md-4">
<a class="btn btn-lg btn-secondary btn-block" href="#">Подробнее...</a>
</div>
</div>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="site/js/jquery.min.js"></script>
<script src="site/js/bootstrap.bundle.min.js"></script>
</body>
</html>

7
site/js/bootstrap.bundle.min.js vendored Normal file

File diff suppressed because one or more lines are too long

4435
site/js/bootstrap4.3.1.js vendored Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,912 @@
/* jqBootstrapValidation
* A plugin for automating validation on Twitter Bootstrap formatted forms.
*
* v1.3.6
*
* License: MIT <http://opensource.org/licenses/mit-license.php> - see LICENSE file
*
* http://ReactiveRaven.github.com/jqBootstrapValidation/
*/
(function( $ ){
var createdElements = [];
var defaults = {
options: {
prependExistingHelpBlock: false,
sniffHtml: true, // sniff for 'required', 'maxlength', etc
preventSubmit: true, // stop the form submit event from firing if validation fails
submitError: false, // function called if there is an error when trying to submit
submitSuccess: false, // function called just before a successful submit event is sent to the server
semanticallyStrict: false, // set to true to tidy up generated HTML output
autoAdd: {
helpBlocks: true
},
filter: function () {
// return $(this).is(":visible"); // only validate elements you can see
return true; // validate everything
}
},
methods: {
init : function( options ) {
var settings = $.extend(true, {}, defaults);
settings.options = $.extend(true, settings.options, options);
var $siblingElements = this;
var uniqueForms = $.unique(
$siblingElements.map( function () {
return $(this).parents("form")[0];
}).toArray()
);
$(uniqueForms).bind("submit", function (e) {
var $form = $(this);
var warningsFound = 0;
var $inputs = $form.find("input,textarea,select").not("[type=submit],[type=image]").filter(settings.options.filter);
$inputs.trigger("submit.validation").trigger("validationLostFocus.validation");
$inputs.each(function (i, el) {
var $this = $(el),
$controlGroup = $this.parents(".control-group").first();
if (
$controlGroup.hasClass("has-warning")
) {
$controlGroup.removeClass("has-warning").addClass("has-error");
warningsFound++;
}
});
$inputs.trigger("validationLostFocus.validation");
if (warningsFound) {
if (settings.options.preventSubmit) {
e.preventDefault();
}
$form.addClass("has-error");
if ($.isFunction(settings.options.submitError)) {
settings.options.submitError($form, e, $inputs.jqBootstrapValidation("collectErrors", true));
}
} else {
$form.removeClass("has-error");
if ($.isFunction(settings.options.submitSuccess)) {
settings.options.submitSuccess($form, e);
}
}
});
return this.each(function(){
// Get references to everything we're interested in
var $this = $(this),
$controlGroup = $this.parents(".control-group").first(),
$helpBlock = $controlGroup.find(".help-block").first(),
$form = $this.parents("form").first(),
validatorNames = [];
// create message container if not exists
if (!$helpBlock.length && settings.options.autoAdd && settings.options.autoAdd.helpBlocks) {
$helpBlock = $('<div class="help-block" />');
$controlGroup.find('.controls').append($helpBlock);
createdElements.push($helpBlock[0]);
}
// =============================================================
// SNIFF HTML FOR VALIDATORS
// =============================================================
// *snort sniff snuffle*
if (settings.options.sniffHtml) {
var message = "";
// ---------------------------------------------------------
// PATTERN
// ---------------------------------------------------------
if ($this.attr("pattern") !== undefined) {
message = "Not in the expected format<!-- data-validation-pattern-message to override -->";
if ($this.data("validationPatternMessage")) {
message = $this.data("validationPatternMessage");
}
$this.data("validationPatternMessage", message);
$this.data("validationPatternRegex", $this.attr("pattern"));
}
// ---------------------------------------------------------
// MAX
// ---------------------------------------------------------
if ($this.attr("max") !== undefined || $this.attr("aria-valuemax") !== undefined) {
var max = ($this.attr("max") !== undefined ? $this.attr("max") : $this.attr("aria-valuemax"));
message = "Too high: Maximum of '" + max + "'<!-- data-validation-max-message to override -->";
if ($this.data("validationMaxMessage")) {
message = $this.data("validationMaxMessage");
}
$this.data("validationMaxMessage", message);
$this.data("validationMaxMax", max);
}
// ---------------------------------------------------------
// MIN
// ---------------------------------------------------------
if ($this.attr("min") !== undefined || $this.attr("aria-valuemin") !== undefined) {
var min = ($this.attr("min") !== undefined ? $this.attr("min") : $this.attr("aria-valuemin"));
message = "Too low: Minimum of '" + min + "'<!-- data-validation-min-message to override -->";
if ($this.data("validationMinMessage")) {
message = $this.data("validationMinMessage");
}
$this.data("validationMinMessage", message);
$this.data("validationMinMin", min);
}
// ---------------------------------------------------------
// MAXLENGTH
// ---------------------------------------------------------
if ($this.attr("maxlength") !== undefined) {
message = "Too long: Maximum of '" + $this.attr("maxlength") + "' characters<!-- data-validation-maxlength-message to override -->";
if ($this.data("validationMaxlengthMessage")) {
message = $this.data("validationMaxlengthMessage");
}
$this.data("validationMaxlengthMessage", message);
$this.data("validationMaxlengthMaxlength", $this.attr("maxlength"));
}
// ---------------------------------------------------------
// MINLENGTH
// ---------------------------------------------------------
if ($this.attr("minlength") !== undefined) {
message = "Too short: Minimum of '" + $this.attr("minlength") + "' characters<!-- data-validation-minlength-message to override -->";
if ($this.data("validationMinlengthMessage")) {
message = $this.data("validationMinlengthMessage");
}
$this.data("validationMinlengthMessage", message);
$this.data("validationMinlengthMinlength", $this.attr("minlength"));
}
// ---------------------------------------------------------
// REQUIRED
// ---------------------------------------------------------
if ($this.attr("required") !== undefined || $this.attr("aria-required") !== undefined) {
message = settings.builtInValidators.required.message;
if ($this.data("validationRequiredMessage")) {
message = $this.data("validationRequiredMessage");
}
$this.data("validationRequiredMessage", message);
}
// ---------------------------------------------------------
// NUMBER
// ---------------------------------------------------------
if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "number") {
message = settings.builtInValidators.number.message;
if ($this.data("validationNumberMessage")) {
message = $this.data("validationNumberMessage");
}
$this.data("validationNumberMessage", message);
}
// ---------------------------------------------------------
// EMAIL
// ---------------------------------------------------------
if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "email") {
message = "Not a valid email address<!-- data-validator-validemail-message to override -->";
if ($this.data("validationValidemailMessage")) {
message = $this.data("validationValidemailMessage");
} else if ($this.data("validationEmailMessage")) {
message = $this.data("validationEmailMessage");
}
$this.data("validationValidemailMessage", message);
}
// ---------------------------------------------------------
// MINCHECKED
// ---------------------------------------------------------
if ($this.attr("minchecked") !== undefined) {
message = "Not enough options checked; Minimum of '" + $this.attr("minchecked") + "' required<!-- data-validation-minchecked-message to override -->";
if ($this.data("validationMincheckedMessage")) {
message = $this.data("validationMincheckedMessage");
}
$this.data("validationMincheckedMessage", message);
$this.data("validationMincheckedMinchecked", $this.attr("minchecked"));
}
// ---------------------------------------------------------
// MAXCHECKED
// ---------------------------------------------------------
if ($this.attr("maxchecked") !== undefined) {
message = "Too many options checked; Maximum of '" + $this.attr("maxchecked") + "' required<!-- data-validation-maxchecked-message to override -->";
if ($this.data("validationMaxcheckedMessage")) {
message = $this.data("validationMaxcheckedMessage");
}
$this.data("validationMaxcheckedMessage", message);
$this.data("validationMaxcheckedMaxchecked", $this.attr("maxchecked"));
}
}
// =============================================================
// COLLECT VALIDATOR NAMES
// =============================================================
// Get named validators
if ($this.data("validation") !== undefined) {
validatorNames = $this.data("validation").split(",");
}
// Get extra ones defined on the element's data attributes
$.each($this.data(), function (i, el) {
var parts = i.replace(/([A-Z])/g, ",$1").split(",");
if (parts[0] === "validation" && parts[1]) {
validatorNames.push(parts[1]);
}
});
// =============================================================
// NORMALISE VALIDATOR NAMES
// =============================================================
var validatorNamesToInspect = validatorNames;
var newValidatorNamesToInspect = [];
do // repeatedly expand 'shortcut' validators into their real validators
{
// Uppercase only the first letter of each name
$.each(validatorNames, function (i, el) {
validatorNames[i] = formatValidatorName(el);
});
// Remove duplicate validator names
validatorNames = $.unique(validatorNames);
// Pull out the new validator names from each shortcut
newValidatorNamesToInspect = [];
$.each(validatorNamesToInspect, function(i, el) {
if ($this.data("validation" + el + "Shortcut") !== undefined) {
// Are these custom validators?
// Pull them out!
$.each($this.data("validation" + el + "Shortcut").split(","), function(i2, el2) {
newValidatorNamesToInspect.push(el2);
});
} else if (settings.builtInValidators[el.toLowerCase()]) {
// Is this a recognised built-in?
// Pull it out!
var validator = settings.builtInValidators[el.toLowerCase()];
if (validator.type.toLowerCase() === "shortcut") {
$.each(validator.shortcut.split(","), function (i, el) {
el = formatValidatorName(el);
newValidatorNamesToInspect.push(el);
validatorNames.push(el);
});
}
}
});
validatorNamesToInspect = newValidatorNamesToInspect;
} while (validatorNamesToInspect.length > 0)
// =============================================================
// SET UP VALIDATOR ARRAYS
// =============================================================
var validators = {};
$.each(validatorNames, function (i, el) {
// Set up the 'override' message
var message = $this.data("validation" + el + "Message");
var hasOverrideMessage = (message !== undefined);
var foundValidator = false;
message =
(
message
? message
: "'" + el + "' validation failed <!-- Add attribute 'data-validation-" + el.toLowerCase() + "-message' to input to change this message -->"
)
;
$.each(
settings.validatorTypes,
function (validatorType, validatorTemplate) {
if (validators[validatorType] === undefined) {
validators[validatorType] = [];
}
if (!foundValidator && $this.data("validation" + el + formatValidatorName(validatorTemplate.name)) !== undefined) {
validators[validatorType].push(
$.extend(
true,
{
name: formatValidatorName(validatorTemplate.name),
message: message
},
validatorTemplate.init($this, el)
)
);
foundValidator = true;
}
}
);
if (!foundValidator && settings.builtInValidators[el.toLowerCase()]) {
var validator = $.extend(true, {}, settings.builtInValidators[el.toLowerCase()]);
if (hasOverrideMessage) {
validator.message = message;
}
var validatorType = validator.type.toLowerCase();
if (validatorType === "shortcut") {
foundValidator = true;
} else {
$.each(
settings.validatorTypes,
function (validatorTemplateType, validatorTemplate) {
if (validators[validatorTemplateType] === undefined) {
validators[validatorTemplateType] = [];
}
if (!foundValidator && validatorType === validatorTemplateType.toLowerCase()) {
$this.data("validation" + el + formatValidatorName(validatorTemplate.name), validator[validatorTemplate.name.toLowerCase()]);
validators[validatorType].push(
$.extend(
validator,
validatorTemplate.init($this, el)
)
);
foundValidator = true;
}
}
);
}
}
if (! foundValidator) {
$.error("Cannot find validation info for '" + el + "'");
}
});
// =============================================================
// STORE FALLBACK VALUES
// =============================================================
$helpBlock.data(
"original-contents",
(
$helpBlock.data("original-contents")
? $helpBlock.data("original-contents")
: $helpBlock.html()
)
);
$helpBlock.data(
"original-role",
(
$helpBlock.data("original-role")
? $helpBlock.data("original-role")
: $helpBlock.attr("role")
)
);
$controlGroup.data(
"original-classes",
(
$controlGroup.data("original-clases")
? $controlGroup.data("original-classes")
: $controlGroup.attr("class")
)
);
$this.data(
"original-aria-invalid",
(
$this.data("original-aria-invalid")
? $this.data("original-aria-invalid")
: $this.attr("aria-invalid")
)
);
// =============================================================
// VALIDATION
// =============================================================
$this.bind(
"validation.validation",
function (event, params) {
var value = getValue($this);
// Get a list of the errors to apply
var errorsFound = [];
$.each(validators, function (validatorType, validatorTypeArray) {
if (value || value.length || (params && params.includeEmpty) || (!!settings.validatorTypes[validatorType].blockSubmit && params && !!params.submitting)) {
$.each(validatorTypeArray, function (i, validator) {
if (settings.validatorTypes[validatorType].validate($this, value, validator)) {
errorsFound.push(validator.message);
}
});
}
});
return errorsFound;
}
);
$this.bind(
"getValidators.validation",
function () {
return validators;
}
);
// =============================================================
// WATCH FOR CHANGES
// =============================================================
$this.bind(
"submit.validation",
function () {
return $this.triggerHandler("change.validation", {submitting: true});
}
);
$this.bind(
[
"keyup",
"focus",
"blur",
"click",
"keydown",
"keypress",
"change"
].join(".validation ") + ".validation",
function (e, params) {
var value = getValue($this);
var errorsFound = [];
$controlGroup.find("input,textarea,select").each(function (i, el) {
var oldCount = errorsFound.length;
$.each($(el).triggerHandler("validation.validation", params), function (j, message) {
errorsFound.push(message);
});
if (errorsFound.length > oldCount) {
$(el).attr("aria-invalid", "true");
} else {
var original = $this.data("original-aria-invalid");
$(el).attr("aria-invalid", (original !== undefined ? original : false));
}
});
$form.find("input,select,textarea").not($this).not("[name=\"" + $this.attr("name") + "\"]").trigger("validationLostFocus.validation");
errorsFound = $.unique(errorsFound.sort());
// Were there any errors?
if (errorsFound.length) {
// Better flag it up as a warning.
$controlGroup.removeClass("has-success has-error").addClass("has-warning");
// How many errors did we find?
if (settings.options.semanticallyStrict && errorsFound.length === 1) {
// Only one? Being strict? Just output it.
$helpBlock.html(errorsFound[0] +
( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" ));
} else {
// Multiple? Being sloppy? Glue them together into an UL.
$helpBlock.html("<ul role=\"alert\"><li>" + errorsFound.join("</li><li>") + "</li></ul>" +
( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" ));
}
} else {
$controlGroup.removeClass("has-warning has-error has-success");
if (value.length > 0) {
$controlGroup.addClass("has-success");
}
$helpBlock.html($helpBlock.data("original-contents"));
}
if (e.type === "blur") {
$controlGroup.removeClass("has-success");
}
}
);
$this.bind("validationLostFocus.validation", function () {
$controlGroup.removeClass("has-success");
});
});
},
destroy : function( ) {
return this.each(
function() {
var
$this = $(this),
$controlGroup = $this.parents(".control-group").first(),
$helpBlock = $controlGroup.find(".help-block").first();
// remove our events
$this.unbind('.validation'); // events are namespaced.
// reset help text
$helpBlock.html($helpBlock.data("original-contents"));
// reset classes
$controlGroup.attr("class", $controlGroup.data("original-classes"));
// reset aria
$this.attr("aria-invalid", $this.data("original-aria-invalid"));
// reset role
$helpBlock.attr("role", $this.data("original-role"));
// remove all elements we created
if (createdElements.indexOf($helpBlock[0]) > -1) {
$helpBlock.remove();
}
}
);
},
collectErrors : function(includeEmpty) {
var errorMessages = {};
this.each(function (i, el) {
var $el = $(el);
var name = $el.attr("name");
var errors = $el.triggerHandler("validation.validation", {includeEmpty: true});
errorMessages[name] = $.extend(true, errors, errorMessages[name]);
});
$.each(errorMessages, function (i, el) {
if (el.length === 0) {
delete errorMessages[i];
}
});
return errorMessages;
},
hasErrors: function() {
var errorMessages = [];
this.each(function (i, el) {
errorMessages = errorMessages.concat(
$(el).triggerHandler("getValidators.validation") ? $(el).triggerHandler("validation.validation", {submitting: true}) : []
);
});
return (errorMessages.length > 0);
},
override : function (newDefaults) {
defaults = $.extend(true, defaults, newDefaults);
}
},
validatorTypes: {
callback: {
name: "callback",
init: function ($this, name) {
return {
validatorName: name,
callback: $this.data("validation" + name + "Callback"),
lastValue: $this.val(),
lastValid: true,
lastFinished: true
};
},
validate: function ($this, value, validator) {
if (validator.lastValue === value && validator.lastFinished) {
return !validator.lastValid;
}
if (validator.lastFinished === true)
{
validator.lastValue = value;
validator.lastValid = true;
validator.lastFinished = false;
var rrjqbvValidator = validator;
var rrjqbvThis = $this;
executeFunctionByName(
validator.callback,
window,
$this,
value,
function (data) {
if (rrjqbvValidator.lastValue === data.value) {
rrjqbvValidator.lastValid = data.valid;
if (data.message) {
rrjqbvValidator.message = data.message;
}
rrjqbvValidator.lastFinished = true;
rrjqbvThis.data("validation" + rrjqbvValidator.validatorName + "Message", rrjqbvValidator.message);
// Timeout is set to avoid problems with the events being considered 'already fired'
setTimeout(function () {
rrjqbvThis.trigger("change.validation");
}, 1); // doesn't need a long timeout, just long enough for the event bubble to burst
}
}
);
}
return false;
}
},
ajax: {
name: "ajax",
init: function ($this, name) {
return {
validatorName: name,
url: $this.data("validation" + name + "Ajax"),
lastValue: $this.val(),
lastValid: true,
lastFinished: true
};
},
validate: function ($this, value, validator) {
if (""+validator.lastValue === ""+value && validator.lastFinished === true) {
return validator.lastValid === false;
}
if (validator.lastFinished === true)
{
validator.lastValue = value;
validator.lastValid = true;
validator.lastFinished = false;
$.ajax({
url: validator.url,
data: "value=" + value + "&field=" + $this.attr("name"),
dataType: "json",
success: function (data) {
if (""+validator.lastValue === ""+data.value) {
validator.lastValid = !!(data.valid);
if (data.message) {
validator.message = data.message;
}
validator.lastFinished = true;
$this.data("validation" + validator.validatorName + "Message", validator.message);
// Timeout is set to avoid problems with the events being considered 'already fired'
setTimeout(function () {
$this.trigger("change.validation");
}, 1); // doesn't need a long timeout, just long enough for the event bubble to burst
}
},
failure: function () {
validator.lastValid = true;
validator.message = "ajax call failed";
validator.lastFinished = true;
$this.data("validation" + validator.validatorName + "Message", validator.message);
// Timeout is set to avoid problems with the events being considered 'already fired'
setTimeout(function () {
$this.trigger("change.validation");
}, 1); // doesn't need a long timeout, just long enough for the event bubble to burst
}
});
}
return false;
}
},
regex: {
name: "regex",
init: function ($this, name) {
return {regex: regexFromString($this.data("validation" + name + "Regex"))};
},
validate: function ($this, value, validator) {
return (!validator.regex.test(value) && ! validator.negative)
|| (validator.regex.test(value) && validator.negative);
}
},
required: {
name: "required",
init: function ($this, name) {
return {};
},
validate: function ($this, value, validator) {
return !!(value.length === 0 && ! validator.negative)
|| !!(value.length > 0 && validator.negative);
},
blockSubmit: true
},
match: {
name: "match",
init: function ($this, name) {
var element = $this.parents("form").first().find("[name=\"" + $this.data("validation" + name + "Match") + "\"]").first();
element.bind("validation.validation", function () {
$this.trigger("change.validation", {submitting: true});
});
return {"element": element};
},
validate: function ($this, value, validator) {
return (value !== validator.element.val() && ! validator.negative)
|| (value === validator.element.val() && validator.negative);
},
blockSubmit: true
},
max: {
name: "max",
init: function ($this, name) {
return {max: $this.data("validation" + name + "Max")};
},
validate: function ($this, value, validator) {
return (parseFloat(value, 10) > parseFloat(validator.max, 10) && ! validator.negative)
|| (parseFloat(value, 10) <= parseFloat(validator.max, 10) && validator.negative);
}
},
min: {
name: "min",
init: function ($this, name) {
return {min: $this.data("validation" + name + "Min")};
},
validate: function ($this, value, validator) {
return (parseFloat(value) < parseFloat(validator.min) && ! validator.negative)
|| (parseFloat(value) >= parseFloat(validator.min) && validator.negative);
}
},
maxlength: {
name: "maxlength",
init: function ($this, name) {
return {maxlength: $this.data("validation" + name + "Maxlength")};
},
validate: function ($this, value, validator) {
return ((value.length > validator.maxlength) && ! validator.negative)
|| ((value.length <= validator.maxlength) && validator.negative);
}
},
minlength: {
name: "minlength",
init: function ($this, name) {
return {minlength: $this.data("validation" + name + "Minlength")};
},
validate: function ($this, value, validator) {
return ((value.length < validator.minlength) && ! validator.negative)
|| ((value.length >= validator.minlength) && validator.negative);
}
},
maxchecked: {
name: "maxchecked",
init: function ($this, name) {
var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]");
elements.bind("click.validation", function () {
$this.trigger("change.validation", {includeEmpty: true});
});
return {maxchecked: $this.data("validation" + name + "Maxchecked"), elements: elements};
},
validate: function ($this, value, validator) {
return (validator.elements.filter(":checked").length > validator.maxchecked && ! validator.negative)
|| (validator.elements.filter(":checked").length <= validator.maxchecked && validator.negative);
},
blockSubmit: true
},
minchecked: {
name: "minchecked",
init: function ($this, name) {
var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]");
elements.bind("click.validation", function () {
$this.trigger("change.validation", {includeEmpty: true});
});
return {minchecked: $this.data("validation" + name + "Minchecked"), elements: elements};
},
validate: function ($this, value, validator) {
return (validator.elements.filter(":checked").length < validator.minchecked && ! validator.negative)
|| (validator.elements.filter(":checked").length >= validator.minchecked && validator.negative);
},
blockSubmit: true
}
},
builtInValidators: {
email: {
name: "Email",
type: "shortcut",
shortcut: "validemail"
},
validemail: {
name: "Validemail",
type: "regex",
regex: "[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\\.[A-Za-z]{2,4}",
message: "Not a valid email address<!-- data-validator-validemail-message to override -->"
},
passwordagain: {
name: "Passwordagain",
type: "match",
match: "password",
message: "Does not match the given password<!-- data-validator-paswordagain-message to override -->"
},
positive: {
name: "Positive",
type: "shortcut",
shortcut: "number,positivenumber"
},
negative: {
name: "Negative",
type: "shortcut",
shortcut: "number,negativenumber"
},
number: {
name: "Number",
type: "regex",
regex: "([+-]?\\\d+(\\\.\\\d*)?([eE][+-]?[0-9]+)?)?",
message: "Must be a number<!-- data-validator-number-message to override -->"
},
integer: {
name: "Integer",
type: "regex",
regex: "[+-]?\\\d+",
message: "No decimal places allowed<!-- data-validator-integer-message to override -->"
},
positivenumber: {
name: "Positivenumber",
type: "min",
min: 0,
message: "Must be a positive number<!-- data-validator-positivenumber-message to override -->"
},
negativenumber: {
name: "Negativenumber",
type: "max",
max: 0,
message: "Must be a negative number<!-- data-validator-negativenumber-message to override -->"
},
required: {
name: "Required",
type: "required",
message: "This is required<!-- data-validator-required-message to override -->"
},
checkone: {
name: "Checkone",
type: "minchecked",
minchecked: 1,
message: "Check at least one option<!-- data-validation-checkone-message to override -->"
}
}
};
var formatValidatorName = function (name) {
return name
.toLowerCase()
.replace(
/(^|\s)([a-z])/g ,
function(m,p1,p2) {
return p1+p2.toUpperCase();
}
)
;
};
var getValue = function ($this) {
// Extract the value we're talking about
var value = $this.val();
var type = $this.attr("type");
if (type === "checkbox") {
value = ($this.is(":checked") ? value : "");
}
if (type === "radio") {
value = ($('input[name="' + $this.attr("name") + '"]:checked').length > 0 ? value : "");
}
return value;
};
function regexFromString(inputstring) {
return new RegExp("^" + inputstring + "$");
}
/**
* Thanks to Jason Bunting via StackOverflow.com
*
* http://stackoverflow.com/questions/359788/how-to-execute-a-javascript-function-when-i-have-its-name-as-a-string#answer-359910
* Short link: http://tinyurl.com/executeFunctionByName
**/
function executeFunctionByName(functionName, context /*, args*/) {
var args = Array.prototype.slice.call(arguments).splice(2);
var namespaces = functionName.split(".");
var func = namespaces.pop();
for(var i = 0; i < namespaces.length; i++) {
context = context[namespaces[i]];
}
return context[func].apply(this, args);
}
$.fn.jqBootstrapValidation = function( method ) {
if ( defaults.methods[method] ) {
return defaults.methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
return defaults.methods.init.apply( this, arguments );
} else {
$.error( 'Method ' + method + ' does not exist on jQuery.jqBootstrapValidation' );
return null;
}
};
$.jqBootstrapValidation = function (options) {
$(":input").not("[type=image],[type=submit]").jqBootstrapValidation.apply(this,arguments);
};
})( jQuery );

2
site/js/jquery.min.js vendored Normal file

File diff suppressed because one or more lines are too long

22
site/main.php Normal file
View File

@ -0,0 +1,22 @@
<?php
$url=getURL();
$lng=cutBeforeFirst($url, '/');
if(getURL()=="" || getURL()=="/") {
include 'index_en.html'; //Основной зык английский и он будет на главной странице
}elseif (getURL()=='ru' || getURL()=='ru/'){
include 'about_ru.html';
}elseif (getURL()=='en/about.html'){
include 'about_en.html';
}elseif (getURL()=='ru/about.html'){
include 'about_ru.html';
}elseif(getURL()=="/ru/connecting-and-configuring-a-gps-tracker.html" || getURL()=="/en/connecting-and-configuring-a-gps-tracker.html"){
}else{
//echo 'Error URL: "'.getURL().'" not found in database!';
include '404.html';
}

214
site/portfolio-1-col.html Normal file
View File

@ -0,0 +1,214 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item active" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Портфолио
<small>в 1 колонку</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">портфолио в одну колонку</li>
</ol>
<!-- Project One -->
<div class="row">
<div class="col-md-7">
<a href="#">
<img class="img-fluid rounded mb-3 mb-md-0" src="http://placehold.it/700x300" alt="">
</a>
</div>
<div class="col-md-5">
<h3>Портфолио 1</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium veniam exercitationem expedita laborum at voluptate. Labore, voluptates totam at aut nemo deserunt rem magni pariatur quos perspiciatis atque eveniet unde.</p>
<a class="btn btn-primary" href="#">View Project
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
<!-- /.row -->
<hr>
<!-- Project Two -->
<div class="row">
<div class="col-md-7">
<a href="#">
<img class="img-fluid rounded mb-3 mb-md-0" src="http://placehold.it/700x300" alt="">
</a>
</div>
<div class="col-md-5">
<h3>Портфолио 2</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut, odit velit cumque vero doloremque repellendus distinctio maiores rem expedita a nam vitae modi quidem similique ducimus! Velit, esse totam tempore.</p>
<a class="btn btn-primary" href="#">View Project
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
<!-- /.row -->
<hr>
<!-- Project Three -->
<div class="row">
<div class="col-md-7">
<a href="#">
<img class="img-fluid rounded mb-3 mb-md-0" src="http://placehold.it/700x300" alt="">
</a>
</div>
<div class="col-md-5">
<h3>Портфолио 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis, temporibus, dolores, at, praesentium ut unde repudiandae voluptatum sit ab debitis suscipit fugiat natus velit excepturi amet commodi deleniti alias possimus!</p>
<a class="btn btn-primary" href="#">View Project
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
<!-- /.row -->
<hr>
<!-- Project Four -->
<div class="row">
<div class="col-md-7">
<a href="#">
<img class="img-fluid rounded mb-3 mb-md-0" src="http://placehold.it/700x300" alt="">
</a>
</div>
<div class="col-md-5">
<h3>Портфолио 4</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo, quidem, consectetur, officia rem officiis illum aliquam perspiciatis aspernatur quod modi hic nemo qui soluta aut eius fugit quam in suscipit?</p>
<a class="btn btn-primary" href="#">View Project
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
<!-- /.row -->
<hr>
<!-- Pagination -->
<ul class="pagination justify-content-center">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
<li class="page-item">
<a class="page-link" href="#">1</a>
</li>
<li class="page-item">
<a class="page-link" href="#">2</a>
</li>
<li class="page-item">
<a class="page-link" href="#">3</a>
</li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

207
site/portfolio-2-col.html Normal file
View File

@ -0,0 +1,207 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item active" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Портфолио
<small>2 колонки</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Портфолио 2 колонки</li>
</ol>
<div class="row">
<div class="col-lg-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 1</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 2</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit aliquam aperiam nulla perferendis dolor nobis numquam, rem expedita, aliquid optio, alias illum eaque. Non magni, voluptates quae, necessitatibus unde temporibus.</p>
</div>
</div>
</div>
<div class="col-lg-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 3</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 4</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit aliquam aperiam nulla perferendis dolor nobis numquam, rem expedita, aliquid optio, alias illum eaque. Non magni, voluptates quae, necessitatibus unde temporibus.</p>
</div>
</div>
</div>
<div class="col-lg-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 5</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 6</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit aliquam aperiam nulla perferendis dolor nobis numquam, rem expedita, aliquid optio, alias illum eaque. Non magni, voluptates quae, necessitatibus unde temporibus.</p>
</div>
</div>
</div>
</div>
<!-- /.row -->
<!-- Pagination -->
<ul class="pagination justify-content-center">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
<li class="page-item">
<a class="page-link" href="#">1</a>
</li>
<li class="page-item">
<a class="page-link" href="#">2</a>
</li>
<li class="page-item">
<a class="page-link" href="#">3</a>
</li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

206
site/portfolio-3-col.html Normal file
View File

@ -0,0 +1,206 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item active" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Портфолио
<small>3 колонки</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">3 колонки</li>
</ol>
<div class="row">
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 1</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet numquam aspernatur eum quasi sapiente nesciunt? Voluptatibus sit, repellat sequi itaque deserunt, dolores in, nesciunt, illum tempora ex quae? Nihil, dolorem!</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 2</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 3</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos quisquam, error quod sed cumque, odio distinctio velit nostrum temporibus necessitatibus et facere atque iure perspiciatis mollitia recusandae vero vel quam!</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 4</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 5</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 6</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque earum nostrum suscipit ducimus nihil provident, perferendis rem illo, voluptate atque, sit eius in voluptates, nemo repellat fugiat excepturi! Nemo, esse.</p>
</div>
</div>
</div>
</div>
<!-- Pagination -->
<ul class="pagination justify-content-center">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
<li class="page-item">
<a class="page-link" href="#">1</a>
</li>
<li class="page-item">
<a class="page-link" href="#">2</a>
</li>
<li class="page-item">
<a class="page-link" href="#">3</a>
</li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

228
site/portfolio-4-col.html Normal file
View File

@ -0,0 +1,228 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item active" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Портфолио
<small>4 колонки</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">4 колонки</li>
</ol>
<div class="row">
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 1</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet numquam aspernatur eum quasi sapiente nesciunt? Voluptatibus sit, repellat sequi itaque deserunt, dolores in, nesciunt, illum tempora ex quae? Nihil, dolorem!</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 2</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 3</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos quisquam, error quod sed cumque, odio distinctio velit nostrum temporibus necessitatibus et facere atque iure perspiciatis mollitia recusandae vero vel quam!</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 4</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 5</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 6</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque earum nostrum suscipit ducimus nihil provident, perferendis rem illo, voluptate atque, sit eius in voluptates, nemo repellat fugiat excepturi! Nemo, esse.</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 7</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 portfolio-item">
<div class="card h-100">
<a href="#"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<div class="card-body">
<h4 class="card-title">
<a href="#">Портфолио 8</a>
</h4>
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eius adipisci dicta dignissimos neque animi ea, veritatis, provident hic consequatur ut esse! Commodi ea consequatur accusantium, beatae qui deserunt tenetur ipsa.</p>
</div>
</div>
</div>
</div>
<!-- Pagination -->
<ul class="pagination justify-content-center">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Назад</span>
</a>
</li>
<li class="page-item">
<a class="page-link" href="#">1</a>
</li>
<li class="page-item">
<a class="page-link" href="#">2</a>
</li>
<li class="page-item">
<a class="page-link" href="#">3</a>
</li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Вперёд</span>
</a>
</li>
</ul>
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

166
site/portfolio-item.html Normal file
View File

@ -0,0 +1,166 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item active" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Отдельная страница
<small>портфолио</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">портфолио</li>
</ol>
<!-- Portfolio Item Row -->
<div class="row">
<div class="col-md-8">
<img class="img-fluid" src="http://placehold.it/750x500" alt="">
</div>
<div class="col-md-4">
<h3 class="my-3">Описание портфолио</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae. Sed dui lorem, adipiscing in adipiscing et, interdum nec metus. Mauris ultricies, justo eu convallis placerat, felis enim.</p>
<h3 class="my-3">Детали проекта</h3>
<ul>
<li>Lorem Ipsum</li>
<li>Dolor Sit Amet</li>
<li>Consectetur</li>
<li>Adipiscing Elit</li>
</ul>
</div>
</div>
<!-- /.row -->
<!-- Related Projects Row -->
<h3 class="my-4">Похожие проекты</h3>
<div class="row">
<div class="col-md-3 col-sm-6 mb-4">
<a href="#">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</a>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<a href="#">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</a>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<a href="#">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</a>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<a href="#">
<img class="img-fluid" src="http://placehold.it/500x300" alt="">
</a>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

168
site/pricing.html Normal file
View File

@ -0,0 +1,168 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item active" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Наши
<small>расценки</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Прайс</li>
</ol>
<!-- Content Row -->
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h3 class="card-header">Базис</h3>
<div class="card-body">
<div class="display-4">₽200</div>
<div class="font-italic">в месяц</div>
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Vestibulum at eros</li>
<li class="list-group-item">
<a href="#" class="btn btn-primary">Перейти</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card card-outline-primary h-100">
<h3 class="card-header bg-primary text-white">Плюс</h3>
<div class="card-body">
<div class="display-4">₽300</div>
<div class="font-italic">в месяц</div>
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Vestibulum at eros</li>
<li class="list-group-item">
<a href="#" class="btn btn-primary">Перейти</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h3 class="card-header">Супер</h3>
<div class="card-body">
<div class="display-4">₽500</div>
<div class="font-italic">в месяц</div>
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Vestibulum at eros</li>
<li class="list-group-item">
<a href="#" class="btn btn-primary">Перейти</a>
</li>
</ul>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

153
site/services.html Normal file
View File

@ -0,0 +1,153 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Сервис
<small>наши услуги</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Сервис</li>
</ol>
<!-- Image Header -->
<img class="img-fluid rounded mb-4" src="http://placehold.it/1200x300" alt="">
<!-- Marketing Icons Section -->
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Описание услуги 1</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente esse necessitatibus neque.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Подробнее</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Описание услуги 2</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis ipsam eos, nam perspiciatis natus commodi similique totam consectetur praesentium molestiae atque exercitationem ut consequuntur, sed eveniet, magni nostrum sint fuga.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Подробнее</a>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<h4 class="card-header">Описание услуги 3</h4>
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente esse necessitatibus neque.</p>
</div>
<div class="card-footer">
<a href="#" class="btn btn-primary">Подробнее</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

144
site/sidebar.html Normal file
View File

@ -0,0 +1,144 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Стартовый шаблон Bootstrap 4.3.1</title>
<!-- Bootstrap core CSS -->
<link href="site/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="site/css/style.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Стартовый шаблон BS 4.3.1</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="about.html">О сайте</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html">Сервис</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Контакты</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Порфолио
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="portfolio-1-col.html">Порфолио в 1 колонку</a>
<a class="dropdown-item" href="portfolio-2-col.html">Порфолио в 2 колонки</a>
<a class="dropdown-item" href="portfolio-3-col.html">Порфолио в 3 колонки</a>
<a class="dropdown-item" href="portfolio-4-col.html">Порфолио в 4 колонки</a>
<a class="dropdown-item" href="portfolio-item.html">Порфолио блок</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Блок
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="blog-home-1.html">Блог с сайдбаром</a>
<a class="dropdown-item" href="blog-home-2.html">Блок без сайдбара</a>
<a class="dropdown-item" href="blog-post.html">Отдельная страница</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBlog" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Другие страницы
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBlog">
<a class="dropdown-item" href="full-width.html">Пустая страница</a>
<a class="dropdown-item active" href="sidebar.html">Страница с сайдбаром</a>
<a class="dropdown-item" href="faq.html">FAQ</a>
<a class="dropdown-item" href="404.html">Страница ошибки 404</a>
<a class="dropdown-item" href="pricing.html">Карточки цен</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">Колонка слева
<small>Сайдбар</small>
</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Главная</a>
</li>
<li class="breadcrumb-item active">Страница с сайдбаром</li>
</ol>
<!-- Content Row -->
<div class="row">
<!-- Sidebar Column -->
<div class="col-lg-3 mb-4">
<div class="list-group">
<a href="index.html" class="list-group-item">Главная</a>
<a href="about.html" class="list-group-item">О сайте</a>
<a href="services.html" class="list-group-item">Сервис</a>
<a href="contact.html" class="list-group-item">Контакты</a>
<a href="portfolio-1-col.html" class="list-group-item">1 порфолио</a>
<a href="portfolio-2-col.html" class="list-group-item">2 порфолио</a>
<a href="portfolio-3-col.html" class="list-group-item">3 порфолио</a>
<a href="portfolio-4-col.html" class="list-group-item">4 порфолио</a>
<a href="portfolio-item.html" class="list-group-item">Описание портфолио</a>
<a href="blog-home-1.html" class="list-group-item">Блог с сайдбаром</a>
<a href="blog-home-2.html" class="list-group-item">Блог без сайдбара</a>
<a href="blog-post.html" class="list-group-item">Отдельная страница</a>
<a href="full-width.html" class="list-group-item">Пустая страница</a>
<a href="sidebar.html" class="list-group-item active">Страница с сайдбаром</a>
<a href="faq.html" class="list-group-item">FAQ</a>
<a href="404.html" class="list-group-item">404 ошибки</a>
<a href="pricing.html" class="list-group-item">Карточки цен</a>
</div>
</div>
<!-- Content Column -->
<div class="col-lg-9 mb-4">
<h2>Пример текстовой информации</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Soluta, et temporibus, facere perferendis veniam beatae non debitis, numquam blanditiis necessitatibus vel mollitia dolorum laudantium, voluptate dolores iure maxime ducimus fugit.</p>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright &copy; Your Website 2019</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>

View File

@ -0,0 +1,779 @@
if(typeof Object.create!=="function"){
Object.create=function(o){
function F(){
};
F.prototype=o;
return new F();
};
}
var ua={toString:function(){
return navigator.userAgent;
},test:function(s){
return this.toString().toLowerCase().indexOf(s.toLowerCase())>-1;
}};
ua.version=(ua.toString().toLowerCase().match(/[\s\S]+(?:rv|it|ra|ie)[\/: ]([\d.]+)/)||[])[1];
ua.webkit=ua.test("webkit");
ua.gecko=ua.test("gecko")&&!ua.webkit;
ua.opera=ua.test("opera");
ua.ie=ua.test("msie")&&!ua.opera;
ua.ie6=ua.ie&&document.compatMode&&typeof document.documentElement.style.maxHeight==="undefined";
ua.ie7=ua.ie&&document.documentElement&&typeof document.documentElement.style.maxHeight!=="undefined"&&typeof XDomainRequest==="undefined";
ua.ie8=ua.ie&&typeof XDomainRequest!=="undefined";
var domReady=function(){
var _1=[];
var _2=function(){
if(!arguments.callee.done){
arguments.callee.done=true;
for(var i=0;i<_1.length;i++){
_1[i]();
}
}
};
if(document.addEventListener){
document.addEventListener("DOMContentLoaded",_2,false);
}
if(ua.ie){
(function(){
try{
document.documentElement.doScroll("left");
}
catch(e){
setTimeout(arguments.callee,50);
return;
}
_2();
})();
document.onreadystatechange=function(){
if(document.readyState==="complete"){
document.onreadystatechange=null;
_2();
}
};
}
if(ua.webkit&&document.readyState){
(function(){
if(document.readyState!=="loading"){
_2();
}else{
setTimeout(arguments.callee,10);
}
})();
}
window.onload=_2;
return function(fn){
if(typeof fn==="function"){
_1[_1.length]=fn;
}
return fn;
};
}();
var cssHelper=function(){
var _3={BLOCKS:/[^\s{][^{]*\{(?:[^{}]*\{[^{}]*\}[^{}]*|[^{}]*)*\}/g,BLOCKS_INSIDE:/[^\s{][^{]*\{[^{}]*\}/g,DECLARATIONS:/[a-zA-Z\-]+[^;]*:[^;]+;/g,RELATIVE_URLS:/url\(['"]?([^\/\)'"][^:\)'"]+)['"]?\)/g,REDUNDANT_COMPONENTS:/(?:\/\*([^*\\\\]|\*(?!\/))+\*\/|@import[^;]+;)/g,REDUNDANT_WHITESPACE:/\s*(,|:|;|\{|\})\s*/g,MORE_WHITESPACE:/\s{2,}/g,FINAL_SEMICOLONS:/;\}/g,NOT_WHITESPACE:/\S+/g};
var _4,_5=false;
var _6=[];
var _7=function(fn){
if(typeof fn==="function"){
_6[_6.length]=fn;
}
};
var _8=function(){
for(var i=0;i<_6.length;i++){
_6[i](_4);
}
};
var _9={};
var _a=function(n,v){
if(_9[n]){
var _b=_9[n].listeners;
if(_b){
for(var i=0;i<_b.length;i++){
_b[i](v);
}
}
}
};
var _c=function(_d,_e,_f){
if(ua.ie&&!window.XMLHttpRequest){
window.XMLHttpRequest=function(){
return new ActiveXObject("Microsoft.XMLHTTP");
};
}
if(!XMLHttpRequest){
return "";
}
var r=new XMLHttpRequest();
try{
r.open("get",_d,true);
r.setRequestHeader("X_REQUESTED_WITH","XMLHttpRequest");
}
catch(e){
_f();
return;
}
var _10=false;
setTimeout(function(){
_10=true;
},5000);
document.documentElement.style.cursor="progress";
r.onreadystatechange=function(){
if(r.readyState===4&&!_10){
if(!r.status&&location.protocol==="file:"||(r.status>=200&&r.status<300)||r.status===304||navigator.userAgent.indexOf("Safari")>-1&&typeof r.status==="undefined"){
_e(r.responseText);
}else{
_f();
}
document.documentElement.style.cursor="";
r=null;
}
};
r.send("");
};
var _11=function(_12){
_12=_12.replace(_3.REDUNDANT_COMPONENTS,"");
_12=_12.replace(_3.REDUNDANT_WHITESPACE,"$1");
_12=_12.replace(_3.MORE_WHITESPACE," ");
_12=_12.replace(_3.FINAL_SEMICOLONS,"}");
return _12;
};
var _13={mediaQueryList:function(s){
var o={};
var idx=s.indexOf("{");
var lt=s.substring(0,idx);
s=s.substring(idx+1,s.length-1);
var mqs=[],rs=[];
var qts=lt.toLowerCase().substring(7).split(",");
for(var i=0;i<qts.length;i++){
mqs[mqs.length]=_13.mediaQuery(qts[i],o);
}
var rts=s.match(_3.BLOCKS_INSIDE);
if(rts!==null){
for(i=0;i<rts.length;i++){
rs[rs.length]=_13.rule(rts[i],o);
}
}
o.getMediaQueries=function(){
return mqs;
};
o.getRules=function(){
return rs;
};
o.getListText=function(){
return lt;
};
o.getCssText=function(){
return s;
};
return o;
},mediaQuery:function(s,mql){
s=s||"";
var not=false,_14;
var exp=[];
var _15=true;
var _16=s.match(_3.NOT_WHITESPACE);
for(var i=0;i<_16.length;i++){
var _17=_16[i];
if(!_14&&(_17==="not"||_17==="only")){
if(_17==="not"){
not=true;
}
}else{
if(!_14){
_14=_17;
}else{
if(_17.charAt(0)==="("){
var _18=_17.substring(1,_17.length-1).split(":");
exp[exp.length]={mediaFeature:_18[0],value:_18[1]||null};
}
}
}
}
return {getList:function(){
return mql||null;
},getValid:function(){
return _15;
},getNot:function(){
return not;
},getMediaType:function(){
return _14;
},getExpressions:function(){
return exp;
}};
},rule:function(s,mql){
var o={};
var idx=s.indexOf("{");
var st=s.substring(0,idx);
var ss=st.split(",");
var ds=[];
var dts=s.substring(idx+1,s.length-1).split(";");
for(var i=0;i<dts.length;i++){
ds[ds.length]=_13.declaration(dts[i],o);
}
o.getMediaQueryList=function(){
return mql||null;
};
o.getSelectors=function(){
return ss;
};
o.getSelectorText=function(){
return st;
};
o.getDeclarations=function(){
return ds;
};
o.getPropertyValue=function(n){
for(var i=0;i<ds.length;i++){
if(ds[i].getProperty()===n){
return ds[i].getValue();
}
}
return null;
};
return o;
},declaration:function(s,r){
var idx=s.indexOf(":");
var p=s.substring(0,idx);
var v=s.substring(idx+1);
return {getRule:function(){
return r||null;
},getProperty:function(){
return p;
},getValue:function(){
return v;
}};
}};
var _19=function(el){
if(typeof el.cssHelperText!=="string"){
return;
}
var o={mediaQueryLists:[],rules:[],selectors:{},declarations:[],properties:{}};
var _1a=o.mediaQueryLists;
var ors=o.rules;
var _1b=el.cssHelperText.match(_3.BLOCKS);
if(_1b!==null){
for(var i=0;i<_1b.length;i++){
if(_1b[i].substring(0,7)==="@media "){
_1a[_1a.length]=_13.mediaQueryList(_1b[i]);
ors=o.rules=ors.concat(_1a[_1a.length-1].getRules());
}else{
ors[ors.length]=_13.rule(_1b[i]);
}
}
}
var oss=o.selectors;
var _1c=function(r){
var ss=r.getSelectors();
for(var i=0;i<ss.length;i++){
var n=ss[i];
if(!oss[n]){
oss[n]=[];
}
oss[n][oss[n].length]=r;
}
};
for(i=0;i<ors.length;i++){
_1c(ors[i]);
}
var ods=o.declarations;
for(i=0;i<ors.length;i++){
ods=o.declarations=ods.concat(ors[i].getDeclarations());
}
var ops=o.properties;
for(i=0;i<ods.length;i++){
var n=ods[i].getProperty();
if(!ops[n]){
ops[n]=[];
}
ops[n][ops[n].length]=ods[i];
}
el.cssHelperParsed=o;
_4[_4.length]=el;
return o;
};
var _1d=function(el,s){
el.cssHelperText=_11(s||el.innerHTML);
return _19(el);
};
var _1e=function(){
_5=true;
_4=[];
var _1f=[];
var _20=function(){
for(var i=0;i<_1f.length;i++){
_19(_1f[i]);
}
var _21=document.getElementsByTagName("style");
for(i=0;i<_21.length;i++){
_1d(_21[i]);
}
_5=false;
_8();
};
var _22=document.getElementsByTagName("link");
for(var i=0;i<_22.length;i++){
var _23=_22[i];
if(_23.getAttribute("rel").indexOf("style")>-1&&_23.href&&_23.href.length!==0&&!_23.disabled){
_1f[_1f.length]=_23;
}
}
if(_1f.length>0){
var c=0;
var _24=function(){
c++;
if(c===_1f.length){
_20();
}
};
var _25=function(_26){
var _27=_26.href;
_c(_27,function(_28){
_28=_11(_28).replace(_3.RELATIVE_URLS,"url("+_27.substring(0,_27.lastIndexOf("/"))+"/$1)");
_26.cssHelperText=_28;
_24();
},_24);
};
for(i=0;i<_1f.length;i++){
_25(_1f[i]);
}
}else{
_20();
}
};
var _29={mediaQueryLists:"array",rules:"array",selectors:"object",declarations:"array",properties:"object"};
var _2a={mediaQueryLists:null,rules:null,selectors:null,declarations:null,properties:null};
var _2b=function(_2c,v){
if(_2a[_2c]!==null){
if(_29[_2c]==="array"){
return (_2a[_2c]=_2a[_2c].concat(v));
}else{
var c=_2a[_2c];
for(var n in v){
if(v.hasOwnProperty(n)){
if(!c[n]){
c[n]=v[n];
}else{
c[n]=c[n].concat(v[n]);
}
}
}
return c;
}
}
};
var _2d=function(_2e){
_2a[_2e]=(_29[_2e]==="array")?[]:{};
for(var i=0;i<_4.length;i++){
_2b(_2e,_4[i].cssHelperParsed[_2e]);
}
return _2a[_2e];
};
domReady(function(){
var els=document.body.getElementsByTagName("*");
for(var i=0;i<els.length;i++){
els[i].checkedByCssHelper=true;
}
if(document.implementation.hasFeature("MutationEvents","2.0")||window.MutationEvent){
document.body.addEventListener("DOMNodeInserted",function(e){
var el=e.target;
if(el.nodeType===1){
_a("DOMElementInserted",el);
el.checkedByCssHelper=true;
}
},false);
}else{
setInterval(function(){
var els=document.body.getElementsByTagName("*");
for(var i=0;i<els.length;i++){
if(!els[i].checkedByCssHelper){
_a("DOMElementInserted",els[i]);
els[i].checkedByCssHelper=true;
}
}
},1000);
}
});
var _2f=function(d){
if(typeof window.innerWidth!="undefined"){
return window["inner"+d];
}else{
if(typeof document.documentElement!="undefined"&&typeof document.documentElement.clientWidth!="undefined"&&document.documentElement.clientWidth!=0){
return document.documentElement["client"+d];
}
}
};
return {addStyle:function(s,_30){
var el=document.createElement("style");
el.setAttribute("type","text/css");
document.getElementsByTagName("head")[0].appendChild(el);
if(el.styleSheet){
el.styleSheet.cssText=s;
}else{
el.appendChild(document.createTextNode(s));
}
el.addedWithCssHelper=true;
if(typeof _30==="undefined"||_30===true){
cssHelper.parsed(function(_31){
var o=_1d(el,s);
for(var n in o){
if(o.hasOwnProperty(n)){
_2b(n,o[n]);
}
}
_a("newStyleParsed",el);
});
}else{
el.parsingDisallowed=true;
}
return el;
},removeStyle:function(el){
return el.parentNode.removeChild(el);
},parsed:function(fn){
if(_5){
_7(fn);
}else{
if(typeof _4!=="undefined"){
if(typeof fn==="function"){
fn(_4);
}
}else{
_7(fn);
_1e();
}
}
},mediaQueryLists:function(fn){
cssHelper.parsed(function(_32){
fn(_2a.mediaQueryLists||_2d("mediaQueryLists"));
});
},rules:function(fn){
cssHelper.parsed(function(_33){
fn(_2a.rules||_2d("rules"));
});
},selectors:function(fn){
cssHelper.parsed(function(_34){
fn(_2a.selectors||_2d("selectors"));
});
},declarations:function(fn){
cssHelper.parsed(function(_35){
fn(_2a.declarations||_2d("declarations"));
});
},properties:function(fn){
cssHelper.parsed(function(_36){
fn(_2a.properties||_2d("properties"));
});
},broadcast:_a,addListener:function(n,fn){
if(typeof fn==="function"){
if(!_9[n]){
_9[n]={listeners:[]};
}
_9[n].listeners[_9[n].listeners.length]=fn;
}
},removeListener:function(n,fn){
if(typeof fn==="function"&&_9[n]){
var ls=_9[n].listeners;
for(var i=0;i<ls.length;i++){
if(ls[i]===fn){
ls.splice(i,1);
i-=1;
}
}
}
},getViewportWidth:function(){
return _2f("Width");
},getViewportHeight:function(){
return _2f("Height");
}};
}();
domReady(function enableCssMediaQueries(){
var _37;
var _38={LENGTH_UNIT:/[0-9]+(em|ex|px|in|cm|mm|pt|pc)$/,RESOLUTION_UNIT:/[0-9]+(dpi|dpcm)$/,ASPECT_RATIO:/^[0-9]+\/[0-9]+$/,ABSOLUTE_VALUE:/^[0-9]*(\.[0-9]+)*$/};
var _39=[];
var _3a=function(){
var id="css3-mediaqueries-test";
var el=document.createElement("div");
el.id=id;
var _3b=cssHelper.addStyle("@media all and (width) { #"+id+" { width: 1px !important; } }",false);
document.body.appendChild(el);
var ret=el.offsetWidth===1;
_3b.parentNode.removeChild(_3b);
el.parentNode.removeChild(el);
_3a=function(){
return ret;
};
return ret;
};
var _3c=function(){
_37=document.createElement("div");
_37.style.cssText="position:absolute;top:-9999em;left:-9999em;"+"margin:0;border:none;padding:0;width:1em;font-size:1em;";
document.body.appendChild(_37);
if(_37.offsetWidth!==16){
_37.style.fontSize=16/_37.offsetWidth+"em";
}
_37.style.width="";
};
var _3d=function(_3e){
_37.style.width=_3e;
var _3f=_37.offsetWidth;
_37.style.width="";
return _3f;
};
var _40=function(_41,_42){
var l=_41.length;
var min=(_41.substring(0,4)==="min-");
var max=(!min&&_41.substring(0,4)==="max-");
if(_42!==null){
var _43;
var _44;
if(_38.LENGTH_UNIT.exec(_42)){
_43="length";
_44=_3d(_42);
}else{
if(_38.RESOLUTION_UNIT.exec(_42)){
_43="resolution";
_44=parseInt(_42,10);
var _45=_42.substring((_44+"").length);
}else{
if(_38.ASPECT_RATIO.exec(_42)){
_43="aspect-ratio";
_44=_42.split("/");
}else{
if(_38.ABSOLUTE_VALUE){
_43="absolute";
_44=_42;
}else{
_43="unknown";
}
}
}
}
}
var _46,_47;
if("device-width"===_41.substring(l-12,l)){
_46=screen.width;
if(_42!==null){
if(_43==="length"){
return ((min&&_46>=_44)||(max&&_46<_44)||(!min&&!max&&_46===_44));
}else{
return false;
}
}else{
return _46>0;
}
}else{
if("device-height"===_41.substring(l-13,l)){
_47=screen.height;
if(_42!==null){
if(_43==="length"){
return ((min&&_47>=_44)||(max&&_47<_44)||(!min&&!max&&_47===_44));
}else{
return false;
}
}else{
return _47>0;
}
}else{
if("width"===_41.substring(l-5,l)){
_46=document.documentElement.clientWidth||document.body.clientWidth;
if(_42!==null){
if(_43==="length"){
return ((min&&_46>=_44)||(max&&_46<_44)||(!min&&!max&&_46===_44));
}else{
return false;
}
}else{
return _46>0;
}
}else{
if("height"===_41.substring(l-6,l)){
_47=document.documentElement.clientHeight||document.body.clientHeight;
if(_42!==null){
if(_43==="length"){
return ((min&&_47>=_44)||(max&&_47<_44)||(!min&&!max&&_47===_44));
}else{
return false;
}
}else{
return _47>0;
}
}else{
if("device-aspect-ratio"===_41.substring(l-19,l)){
return _43==="aspect-ratio"&&screen.width*_44[1]===screen.height*_44[0];
}else{
if("color-index"===_41.substring(l-11,l)){
var _48=Math.pow(2,screen.colorDepth);
if(_42!==null){
if(_43==="absolute"){
return ((min&&_48>=_44)||(max&&_48<_44)||(!min&&!max&&_48===_44));
}else{
return false;
}
}else{
return _48>0;
}
}else{
if("color"===_41.substring(l-5,l)){
var _49=screen.colorDepth;
if(_42!==null){
if(_43==="absolute"){
return ((min&&_49>=_44)||(max&&_49<_44)||(!min&&!max&&_49===_44));
}else{
return false;
}
}else{
return _49>0;
}
}else{
if("resolution"===_41.substring(l-10,l)){
var res;
if(_45==="dpcm"){
res=_3d("1cm");
}else{
res=_3d("1in");
}
if(_42!==null){
if(_43==="resolution"){
return ((min&&res>=_44)||(max&&res<_44)||(!min&&!max&&res===_44));
}else{
return false;
}
}else{
return res>0;
}
}else{
return false;
}
}
}
}
}
}
}
}
};
var _4a=function(mq){
var _4b=mq.getValid();
var _4c=mq.getExpressions();
var l=_4c.length;
if(l>0){
for(var i=0;i<l&&_4b;i++){
_4b=_40(_4c[i].mediaFeature,_4c[i].value);
}
var not=mq.getNot();
return (_4b&&!not||not&&!_4b);
}
};
var _4d=function(mql){
var mqs=mql.getMediaQueries();
var t={};
for(var i=0;i<mqs.length;i++){
if(_4a(mqs[i])){
t[mqs[i].getMediaType()]=true;
}
}
var s=[],c=0;
for(var n in t){
if(t.hasOwnProperty(n)){
if(c>0){
s[c++]=",";
}
s[c++]=n;
}
}
if(s.length>0){
_39[_39.length]=cssHelper.addStyle("@media "+s.join("")+"{"+mql.getCssText()+"}",false);
}
};
var _4e=function(_4f){
for(var i=0;i<_4f.length;i++){
_4d(_4f[i]);
}
if(ua.ie){
document.documentElement.style.display="block";
setTimeout(function(){
document.documentElement.style.display="";
},0);
setTimeout(function(){
cssHelper.broadcast("cssMediaQueriesTested");
},100);
}else{
cssHelper.broadcast("cssMediaQueriesTested");
}
};
var _50=function(){
for(var i=0;i<_39.length;i++){
cssHelper.removeStyle(_39[i]);
}
_39=[];
cssHelper.mediaQueryLists(_4e);
};
var _51=0;
var _52=function(){
var _53=cssHelper.getViewportWidth();
var _54=cssHelper.getViewportHeight();
if(ua.ie){
var el=document.createElement("div");
el.style.position="absolute";
el.style.top="-9999em";
el.style.overflow="scroll";
document.body.appendChild(el);
_51=el.offsetWidth-el.clientWidth;
document.body.removeChild(el);
}
var _55;
var _56=function(){
var vpw=cssHelper.getViewportWidth();
var vph=cssHelper.getViewportHeight();
if(Math.abs(vpw-_53)>_51||Math.abs(vph-_54)>_51){
_53=vpw;
_54=vph;
clearTimeout(_55);
_55=setTimeout(function(){
if(!_3a()){
_50();
}else{
cssHelper.broadcast("cssMediaQueriesTested");
}
},500);
}
};
window.onresize=function(){
var x=window.onresize||function(){
};
return function(){
x();
_56();
};
}();
};
var _57=document.documentElement;
_57.style.marginLeft="-32767px";
setTimeout(function(){
_57.style.marginTop="";
},20000);
return function(){
if(!_3a()){
cssHelper.addListener("newStyleParsed",function(el){
_4e(el.cssHelperParsed.mediaQueryLists);
});
cssHelper.addListener("cssMediaQueriesTested",function(){
if(ua.ie){
_57.style.width="1px";
}
setTimeout(function(){
_57.style.width="";
_57.style.marginLeft="";
},0);
cssHelper.removeListener("cssMediaQueriesTested",arguments.callee);
});
_3c();
_50();
}else{
_57.style.marginLeft="";
}
_52();
};
}());
try{
document.execCommand("BackgroundImageCache",false,true);
}
catch(e){
}

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@ -0,0 +1,160 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width; initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="media-queries.css">
<title>Шаблон сайта BradPitt | Адаптивный дизайн</title>
</head>
<body>
<div class="wrapper">
<div class="header">
<div class="headerContent">
<div class="logo"><a href="">Blue<span class="pink">Pink</span><span class="gray">.com</span></a></div>
<ul class="nav">
<li><a href="#" class="active">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blogs</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Contacts</a></li>
</ul>
</div>
</div>
<div class="content">
<div class="leftCol">
<ul class="leftNav">
<li><a href="#">Natus error sit voluptatem</a></li>
<li><a href="#">Et veritatis quasi</a></li>
<li><a href="#">Vitae dicta sunt explicabo</a></li>
<li><a href="#">Nectun sed quia conseq</a></li>
<li><a href="#">Natus error sit voluptatem</a></li>
<li><a href="#">Vitae dicta sunt explicabo</a></li>
<li><a href="#">Et veritatis quasi</a></li>
<li><a href="#">Nectun sed quia conseq</a></li>
<li><a href="#">Natus error sit voluptatem</a></li>
<li><a href="#">Vitae dicta sunt explicabo</a></li>
</ul>
<div class="block">
<h3>Left Block</h3>
<p><i>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</i></p>
<p><a href="#" class="more">Read more »</a></p>
</div>
</div>
<div class="main">
<h1>Lorem ipsum dolor sit amet</h1>
<p>Lorem ipsum dolor sit amet, <a href="#" title="link">consectetur adipisicing elit</a>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in <b title="bold">reprehenderit in voluptate velit</b> esse cillum dolore eu fugiat nulla pariatur. <i title="italic">Excepteur sint occaecat</i> cupidatat non proident, sunt in culpa qui officia deserunt.</p>
<!--Изображения-->
<h2>Images</h2>
<p><img src="images/img.jpg"><img src="images/img.jpg"><img src="images/img.jpg"></p>
<!--Списки и определения-->
<h2>Lists and Descriptions</h2>
<div class="row">
<div class="col">
<ul>
<li>Sed ut perspiciatis unde omnis iste</li>
<li>Lorem ipsum dolor sit amet</li>
<li>At vero eos et accusamus et iusto</li>
<li>Et harum quidem rerum facilis</li>
</ul>
</div>
<div class="col">
<ol>
<li>Sed ut perspiciatis unde omnis iste</li>
<li>Lorem ipsum dolor sit amet</li>
<li>At vero eos et accusamus et iusto</li>
<li>Et harum quidem rerum facilis</li>
</ol>
</div>
<div class="col">
<dl>
<dt>Sed ut perspiciatis unde omnis iste</dt>
<dd>Lorem ipsum dolor sit amet</dd>
<dt>At vero eos et accusamus et iusto</dt>
<dd>Et harum quidem rerum facilis</dd>
</dl>
</div>
</div>
<!--Таблица-->
<h2>Table</h2>
<div class="mobile">
<table class="bordered">
<thead>
<tr>
<th>Purcus</th>
<th>Hantis</th>
<th>Mastron</th>
<th>Jevicon</th>
<th>Language</th>
</tr>
</thead>
<tbody>
<tr>
<td>Gitsome</td>
<td>Some one</td>
<td>Take mose</td>
<td>Likbes</td>
<td>Racounter</td>
</tr>
<tr>
<td>Linkage</td>
<td>Fordor</td>
<td>Miad ron me</td>
<td>Diablo core</td>
<td>Tidbade</td>
</tr>
<tr>
<td>Hicura</td>
<td>Warecom</td>
<td>Xamicon</td>
<td>Yamama</td>
<td>Udoricano</td>
</tr>
<tr>
<td>Lavistaro</td>
<td>Micanorta</td>
<td>Ebloconte ma</td>
<td>Quad ri port</td>
<td>Timesquer</td>
</tr>
</tbody>
</table>
</div>
<!--Формы-->
<h2>Forms</h2>
<form>
<div class="row">
<label>Text:</label>
<input type="text" placeholder="Input type text">
</div>
<div class="row">
<label>Select:</label>
<select>
<option>Option</option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
</div>
<div class="row">
<label><input type="checkbox">Sed ut perspiciatis unde omnis iste natus</label>
<label><input type="radio" name="radiobutton" value="radiobutton">Lorem ipsum dolor sit amet, consectetur</label>
</div>
<div class="row">
<label>Textarea:</label>
<textarea></textarea>
</div>
<div class="row">
<button type="submit">Button</button>
</div>
</form>
</div>
</div>
<div class="footer">
<p>&copy; Footer content <a href="#">Link footer</a></p>
</div>
</div>
<script src="css3-mediaqueries.js"></script>
</body>
</html>

View File

@ -0,0 +1,3 @@
<?php
index-2-box.html

View File

@ -0,0 +1,72 @@
/*Размер экрана меньше 980px*/
@media screen and (max-width: 980px) {
.wrapper {
width: 100%;
padding: 0;
}
ul.nav li a {
padding: 0 20px;
}
.headerContent,.content {
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
}
}
/*Размер экрана меньше 650px*/
@media screen and (max-width: 650px) {
.leftCol {
float: none;
width: 100%;
}
.headerContent {
height: auto;
padding-bottom: 10px;
}
.logo {
display: block;
text-align: center;
float: none;
}
ul.nav {
float: none;
}
}
/*Размер экрана меньше 480px*/
@media screen and (max-width: 480px) {
html {
-webkit-text-size-adjust: none; /*Отключение регулировки размера шрифта*/
}
}
/*Размер экрана меньше 320px*/
@media screen and (max-width: 320px) {
.mobile {
overflow-x: auto;
margin: 0;
padding: 0;
}
textarea {
width: 200px;
}
}
/*Эластичные изображения*/
img {
max-width: 100%;
height: auto;
width: auto\9;/*For ie8*/
}
/*Эластичные встраиваемые видео*/
.video embed,
.video object,
.video iframe {
width: 100%;
height: auto;
}

View File

@ -0,0 +1,467 @@
* {
margin: 0;
padding: 0;
}
html,body {
width: 100%;
height: 100%;
}
body {
background: #373e47 url("images/bg.jpg") repeat;
font-family: Arial;
font-size: 12px;
color: #e4e4e4;
line-height: 18px;
text-shadow: 0 1px 0 rgba(0,0,0,0.75);
}
::selection {
background-color: #a45f93;
color: white;
text-shadow: none;
}
::-moz-selection {
background-color: #a45f93;
color: white;
text-shadow: none;
}
a {
color: #ff8de3;
text-decoration: underline;
}
p {
margin-bottom: 10px;
}
h1,h2,h3,h4,h5,h6 {
color: white;
line-height: normal;
}
h1 {
font-size: 18px;
}
h2 {
font-size: 16px;
margin-top: 15px;
}
h3 {
font-size: 14px;
}
h1+p,h2+p,h3+p {
margin-top: 3px;
}
a img {
border: none;
outline: none;
}
ul,ol,dl {
margin: 0 0 0 30px;
}
dt {
font-weight: bold;
}
dd {
font-style: italic;
}
input,button,textarea {
display: inline-block;
}
input[type=text],textarea,select {
padding: 5px;
height: auto;
border: 1px solid white;
background-color: #f0f0f0;
box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
}
input[type=text],textarea,button {
-webkit-transition: all linear 0.2s;
-moz-transition: all linear 0.2s;
-ms-transition: all linear 0.2s;
-o-transition: all linear 0.2s;
transition: all linear 0.2s;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
input[type=checkbox],input[type=radio] {
margin: 3px 5px 0 0;
float: left;
}
input[type=text] {
width: 200px;
}
select {
width: 210px;
}
textarea {
width: 300px;
height: 100px;
}
label {
display: block;
vertical-align: middle;
color: #ebd4e5;
}
input:focus,textarea:focus,select:focus {
outline: none;
box-shadow: none;
background-color: white;
}
input:-moz-placeholder {
color: #9c9c9c;
}
input::-webkit-input-placeholder {
color: #9c9c9c;
}
button {
cursor: pointer;
color: white;
font-size: 12px;
background-color: #a45f93;
background-repeat: no-repeat;
background-image: -ms-linear-gradient(top, #b76da5, #a45f93);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b76da5), to(#a45f93));
background-image: -webkit-linear-gradient(top, #b76da5, #a45f93);
background-image: -o-linear-gradient(top, #b76da5, #a45f93);
background-image: linear-gradient(top, #b76da5, #a45f93);
background-image: -moz-linear-gradient(top, #b76da5, #a45f93);
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#b76da5', endColorstr='#a45f93', GradientType=0);
border: none;
padding: 8px 20px 9px;
box-shadow: 0 2px 2px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.5);
-webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.5);
-moz-box-shadow: 0 2px 2px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.5);
text-shadow: none;
height: auto;
}
button:hover {
background-position: 0 -15px;
}
*:first-child+html button {
width: 90px;
height: 35px;
}
.row {
overflow: hidden;
margin: 10px 0;
padding: 3px 0;
}
.col {
float: left;
margin-right: 15px;
overflow: hidden;
}
table.bordered {
margin: 10px 0;
padding: 0;
border-collapse: separate;
*border-collapse: collapse;
border: 1px solid #292e35;
width: 100%;
background-color: #373e47;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-spacing: 0;
}
table.bordered th, table.bordered td {
padding: 5px;
vertical-align: top;
border-left: 1px solid #4c545e;
}
table.bordered td {
border-top: 1px solid #4c545e;
}
table.bordered thead tr th:first-child,
table.bordered tbody tr td:first-child {
border-left: none;
}
table.bordered th {
background-color: #292e35;
text-align: left;
font-weight: bold;
color: white;
}
table.bordered tbody tr:hover {
background-color: #2e333b;
}
table.bordered thead tr:first-child th:first-child {
border-radius: 3px 0 0 0;
-webkit-border-radius: 3px 0 0 0;
-moz-border-radius: 3px 0 0 0;
}
table.bordered thead:first-child th:last-child {
border-radius: 0 3px 0 0;
-webkit-border-radius: 0 3px 0 0;
-moz-border-radius: 0 3px 0 0;
}
table.bordered tbody tr:last-child td:first-child {
border-radius: 0 0 0 3px;
-webkit-border-radius: 0 0 0 3px;
-moz-border-radius: 0 0 0 3px;
}
table.bordered tbody tr:last-child td:last-child {
border-radius: 0 0 3px 0;
-webkit-border-radius: 0 0 3px 0;
-moz-border-radius: 0 0 3px 0;
}
.wrapper {
width: 980px;
padding: 0 10px;
margin: 0 auto;
min-height: 100%;
position: relative;
}
/*Шапка*/
.header {
padding-top: 20px;
margin-bottom: 20px;
}
.headerContent {
box-shadow: 0 3px 2px rgba(0,0,0,0.3);
-webkit-box-shadow: 0 3px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 0 3px 2px rgba(0,0,0,0.3);
background-color: #f2f2f2;
background-repeat: no-repeat;
background-image: -ms-linear-gradient(top, #f2f2f2, #e4e4e4);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2f2f2), to(#e4e4e4));
background-image: -webkit-linear-gradient(top, #f2f2f2, #e4e4e4);
background-image: -o-linear-gradient(top, #f2f2f2, #e4e4e4);
background-image: linear-gradient(top, #f2f2f2, #e4e4e4);
background-image: -moz-linear-gradient(top, #f2f2f2, #e4e4e4);
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#f2f2f2', endColorstr='#e4e4e4', GradientType=0);
height: 33px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
padding-top: 10px;
}
.logo {
display: inline-block;
float: left;
font-weight: bold;
}
.logo a {
text-decoration: none;
font-size: 24px;
text-shadow: 0 1px 0 white;
color: #373e47;
padding-left: 10px;
}
.logo a:hover {
color: #a45f93;
}
*:first-child+html .logo a {
line-height: normal;
}
.pink {
color: #a45f93;
}
.logo a:hover .pink {
color: #373e47;
}
.gray {
color: #8b95a4;
font-size: 18px;
}
/*Навигация*/
ul.nav {
margin: 0;
padding: 3px 0 0 0;
overflow: hidden;
float: right;
}
ul.nav li {
float: left;
list-style: none;
padding: 0;
}
ul.nav li a {
font-size: 14px;
font-weight: bold;
color: white;
text-decoration: none;
padding: 0 30px;
display: block;
color: #143567;
text-shadow: 0 1px 0 white;
}
ul.nav li a.active {
color: #a45f93;
}
ul.nav li a:hover {
color: #a45f93;
}
/*Контент*/
.content {
padding: 10px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border: 1px solid #67707d;
background-color: #475363;
background-color: rgba(87,103,127,0.5);
overflow: hidden;
}
*:first-child+html .content {
background-color: #475363;
}
/*Левая колонка*/
.leftCol {
float: left;
margin-right: 10px;
width: 220px;
}
ul.leftNav {
margin: 0 0 20px 0;
padding: 0;
background-color: #373e47;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
box-shadow: 0 1px 0 rgba(255,255,255,0.3), inset 0 2px 1px rgba(0,0,0,0.3);
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.3), inset 0 2px 1px rgba(0,0,0,0.3);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.3), inset 0 2px 1px rgba(0,0,0,0.3);
}
ul.leftNav li {
list-style: none;
}
ul.leftNav li a {
color: #e4e4e4;
text-decoration: none;
padding: 8px 10px 8px 30px;
display: block;
border-top: 1px solid #4c545e;
background: url("images/arrow-right.png") 13px 50% no-repeat;
}
ul.leftNav li:first-child a {
border-top: none;
}
ul.leftNav li a:hover {
background-color: #292e35;
}
ul.leftNav li:first-child a {
border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
-moz-border-radius: 3px 3px 0 0;
}
ul.leftNav li:last-child a {
border-radius: 0 0 3px 3px;
-webkit-border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
}
.block {
margin: 0 0 20px 0;
background-color: #373e47;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
box-shadow: 0 1px 0 rgba(255,255,255,0.3), inset 0 2px 1px rgba(0,0,0,0.3);
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.3), inset 0 2px 1px rgba(0,0,0,0.3);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.3), inset 0 2px 1px rgba(0,0,0,0.3);
}
.block>h3 {
padding: 8px 10px 0;
}
.block p {
margin: 0;
padding: 10px 10px 0;
}
.block a.more {
padding-bottom: 10px;
display: block;
}
.main {
overflow: hidden;
}
.main img {
margin-right: 15px;
border: 10px solid #697689;
-webkit-transition: all linear 0.2s;
-moz-transition: all linear 0.2s;
-ms-transition: all linear 0.2s;
-o-transition: all linear 0.2s;
transition: all linear 0.2s;
}
.main img:hover {
border: 10px solid #a45f93;
}
/*Подвал*/
.footer {
}
.footer p {
text-align: center;
}

View File

@ -0,0 +1,6 @@
[InternetShortcut]
URL=http://psd-html-css.ru/templates/htmlcss-shablon-cherry
IDList=
HotKey=0
IconFile=C:\Users\igor\AppData\Local\Mozilla\Firefox\Profiles\xdvdepx0.default\shortcutCache\fmdfXa4d5K3mbqA6r6Y1mg==.ico
IconIndex=0

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 51 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 264 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -0,0 +1,245 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Шаблоны сайтов</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link rel="stylesheet" type="text/css" href="style.css" media="all">
</head>
<body>
<div class="wrapper">
<div class="header">
<div class="headerContent">
<div class="left"><h1><a href="#">Cherry</a></h1><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p></div>
<div class="right">
<form class="search">
<input type="text" placeholder="Search...">
<input type="image" src="images/search.png" title="Search">
</form>
</div>
</div>
</div>
<div class="slider">
<div class="itemSlider">
<div class="bgSlide"><img src="images/bg-slide.jpg"></div>
<div class="descSlide">
<h1>Eaten berry</h1>
<p>and go for a walk</p>
<span>Duis aute irure dolor...</span>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
</div>
</div>
<div class="nav">
<ul class="menu">
<li><a href="#">Home</a></li>
<li><a href="#">Sliders</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Styles</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Cherry</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div class="breadcrumbs"><a href="#">Home</a> / <a href="#">Another Page</a> / This page</div>
<div class="main">
<div class="leftCol">
<form>
<h2>Contact us</h2>
<input type="text" placeholder="Lorem ipsum">
<input type="text" placeholder="Dolor sit">
<input type="text" disabled="disabled" placeholder="Disabled">
<input type="text" placeholder="Consectetur">
<select>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<div class="row">
<h4>Radio</h4>
<input type="radio">
<label>Lorem ipsum dolor sit amet</label>
<div class="clear"></div>
<input type="radio">
<label>Duis aute irure dolor</label>
<div class="clear"></div>
<input type="radio">
<label>Excepteur sint occaecat</label>
<div class="clear"></div>
</div>
<div class="row">
<h4>Checkbox</h4>
<input type="checkbox" />
<label>Duis aute irure dolor</label>
<div class="clear"></div>
<input type="checkbox" />
<label>Excepteur sint occaecat</label>
<div class="clear"></div>
</div>
<button type="submit" class="minWidth">Lorem ipsum</button>
<button type="reset" class="minWidth">Reset</button>
</form>
<div class="row">
<h2>Headline</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p><a href="#">More about</a></p>
</div>
</div>
<div class="rightCol">
<h1>What We Do…</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in <a href="#">voluptate velit esse cillum dolore</a> eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<ul class="img">
<li><a href="#"><img src="images/img1.png"></a></li>
<li><a href="#"><img src="images/img2.png"></a></li>
<li><a href="#"><img src="images/img3.png"></a></li>
</ul>
<h1>Lists</h1>
<div class="row">
<div class="span">
<h4>List style type circle <code>&lt;ul&gt;</code></h4>
<ul>
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus
<ul>
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus</li>
</ul>
</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus</li>
</ul>
</div>
<div class="span">
<h4>Unstyled <code>&lt;ul class="unstyled"&gt;</code></h4>
<ul class="unstyled">
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus
<ul>
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus</li>
</ul>
</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus</li>
</ul>
</div>
<div class="span">
<h4>Ordered <code>&lt;ol&gt;</code></h4>
<ol>
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Sed ut perspiciatis unde</li>
<li>At vero eos et accusamus</li>
</ol>
</div>
</div>
<h1>Tables</h1>
<table>
<thead>
<tr>
<th>#</th>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Lorem ipsum</td>
<td>At vero eos</td>
<td>Sed ut</td>
<td>Dolor sit amet</td>
<td><a href="#">Epd.</a></td>
</tr>
<tr>
<td>2</td>
<td>Sed ut</td>
<td>Dolor sit amet</td>
<td>Lorem ipsum</td>
<td>At vero eos</td>
<td><a href="#">Epd.</a></td>
</tr>
<tr>
<td>3</td>
<td>At vero eos</td>
<td>Lorem ipsum</td>
<td>Sed ut</td>
<td>Dolor sit amet</td>
<td><a href="#">Epd.</a></td>
</tr>
<tr>
<td>4</td>
<td>Dolor sit amet</td>
<td>At vero eos</td>
<td>Lorem ipsum</td>
<td>Sed ut</td>
<td><a href="#">Epd.</a></td>
</tr>
<tr>
<td>5</td>
<td>At vero eos</td>
<td>Lorem ipsum</td>
<td>Sed ut</td>
<td>Dolor sit amet</td>
<td><a href="#">Epd.</a></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="footer">
<div class="footerContent">
<div class="span1">
<h1>Sed ut</h1>
<div class="borderBottom"></div>
<p>Lorem ipsum dolor sit</p>
<ul class="clock">
<li>Nights! Absolutely No Extra Charge</li>
<li>Weekends! Absolutely No Extra Charge</li>
<li>Holidays! Absolutely No Extra Charge</li>
</ul>
<div class="social">
<div>Мы в социальных сетях: </div><ul><li><a target="newtab" href="http://www.facebook.com/?sk=app_2309869772"><img src="images/facebook.png"></a></li><li><a target="newtab" href="https://twitter.com/psdhtmlcss"><img src="images/twitter.png" /></a></li><li><img src="images/vk.png" /></li></ul>
</div>
</div>
<div class="span1">
<h1>At vero eos</h1>
<div class="borderBottom"></div>
<p>Lorem ipsum dolor sit</p>
<ul>
<li>West Hollywood (323) 221-1107</li>
<li>Beverly Hills (310) 202-5428</li>
<li>Pasadena (626) 296-2664</li>
<li>West Hollywood (323) 221-1107</li>
<li>Beverly Hills (310) 202-5428</li>
</ul>
<p><strong>Lorem ipsum dolor sit amet</strong></p>
</div>
<div class="span1">
<h1>Lorem ipsum dolor</h1>
<div class="borderBottom"></div>
<p>Lorem ipsum dolor sit</p>
<ul class="unstyled">
<li>Hi-Tech Cherry Company</li>
<li><a href="mailto:psdhtmlcss@mail.ru">infocherry@gmail.com</a></li>
<li>5104 W. Washington Blvd</li>
<li>Los Angeles , CA , 90016 United States</li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@ -0,0 +1,714 @@
html,body {
margin: 0;
padding: 0;
height: 100%;
}
body {
font-family: Arial,Microsoft Sans Serif;
font-size: 14px;
background: #e7e4e4 url("images/bg.png") repeat;
color: #5c646e;
}
::selection {
background-color: #9f385b;
color: white;
}
::-moz-selection {
background-color: #9f385b;
color: white;
}
*{
margin: 0;
padding: 0;
}
p {
margin: 15px 0;
line-height: 20px;
}
a {
color: #95161f;
text-decoration: underline;
}
a:hover {
}
a img {
border: none;
outline: none;
}
h1,h2,h3,h4,h5,h6 {
margin: 0;
line-height: normal;
}
h1 {
font-size: 24px;
color: #a5adb8;
text-transform: capitalize;
}
h1::first-letter {
color: #ae4b5d;
}
h2 {
font-size: 16px;
color: #282d33;
}
h3 {
font-size: 16px;
color: #9f24f6;
margin: 7px 0;
}
h4 {
font-size: 14px;
margin: 7px 0;
}
h5 {
}
h6 {
}
/*Lists*/
ul {
list-style-type: disc;
padding-left: 20px;
margin: 0;
}
ul li, ol li {
line-height: 22px;
}
ul li ul {
padding-left: 20px;
margin: 0;
}
ul.unstyled {
list-style-type: none;
padding-left: 0;
}
ul.unstyled ul li {
list-style-type: disc;
}
ol {
list-style-type: decimal;
padding-left: 25px;
}
code {
padding: 1px 3px;
background-color: #dedede;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
font-weight: normal;
font-size: 11px;
}
/*Tables*/
table {
width: 100%;
margin: 15px 0;
padding: 0;
font-size: 12px;
border-spacing: 0;
border-collapse: separate;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #282d33;
color: #9da4af;
}
table th, table td {
padding: 7px 12px 6px;
line-height: 18px;
text-align: left;
}
table th {
color: white;
font-weight: bold;
vertical-align: middle;
background-color: #9c4757;
}
table td {
vertical-align: top;
border-top: 1px solid #d8dbde;
}
table td a {
color: #d08b98;
}
table tbody th {
vertical-align: top;
border-top: 1px solid #d8dbde;
}
table th+th,table td+td,table th+td {
border-left: 1px solid #d8dbde;
}
table thead tr:first-child th:first-child, table tbody tr:first-child td:first-child {
-webkit-border-radius: 5px 0 0 0;
-moz-border-radius: 5px 0 0 0;
border-radius: 5px 0 0 0;
}
table thead tr:first-child th:last-child, table tbody tr:first-child td:last-child {
-webkit-border-radius: 0 5px 0 0;
-moz-border-radius: 0 5px 0 0;
border-radius: 0 5px 0 0;
}
table tbody tr:last-child td:first-child {
-webkit-border-radius: 0 0 0 5px;
-moz-border-radius: 0 0 0 5px;
border-radius: 0 0 0 5px;
}
table tbody tr:last-child td:last-child {
-webkit-border-radius: 0 0 5px 0;
-moz-border-radius: 0 0 5px 0;
border-radius: 0 0 5px 0;
}
table tr:hover {
background-color: #622833;
color: #d8dbde;
}
/*Forms*/
form {
display: inline-block;
}
label {
line-height: 24px;
margin-left: 3px;
float: none;
}
input,select,textarea {
display: inline-block;
width: auto;
height: 20px;
padding: 7px 5px;
line-height: 18px;
border: 1px solid white;
background-color: #e3e4e5;
-webkit-transition: background linear 0.2s;
-moz-transition: background linear 0.2s;
-ms-transition: background linear 0.2s;
-o-transition: background linear 0.2s;
transition: background linear 0.2s;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2);
margin: 5px 0;
font-size: 14px;
}
input:-moz-placeholder {
color: #757575;
}
input::-webkit-input-placeholder {
color: #757575;
}
input:focus,textarea:focus {
background-color: #d6d6d6;
outline: none;
}
select {
width: auto;
height: auto;
border: 1px solid #a2a2a2;
}
textarea {
height: auto;
}
button {
cursor: pointer;
display: inline-block;
background-color: #95161f;
background-repeat: no-repeat;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b0252e), color-stop(25%, #b0252e), to(#95161f));
background-image: -webkit-linear-gradient(#b0252e, #b0252e 25%, #95161f);
background-image: -moz-linear-gradient(top, #b0252e, #b0252e 25%, #95161f);
background-image: -ms-linear-gradient(#b0252e, #b0252e 25%, #95161f);
background-image: -o-linear-gradient(#b0252e, #b0252e 25%, #95161f);
background-image: linear-gradient(#b0252e, #b0252e 25%, #95161f);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b0252e', endColorstr='#95161f', GradientType=0);
padding: 10px 18px 11px;
color: white;
font-size: 15px;
line-height: normal;
font-weight: bold;
border: 5px solid white;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
-webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
-webkit-transition: 0.1s linear all;
-moz-transition: 0.1s linear all;
-ms-transition: 0.1s linear all;
-o-transition: 0.1s linear all;
transition: 0.1s linear all;
margin-bottom: 10px;
}
button[type=reset] {
background-color: #e6e6e6;
background-repeat: no-repeat;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f5f5), color-stop(25%, #f5f5f5), to(#e6e6e6));
background-image: -webkit-linear-gradient(#f5f5f5, #f5f5f5 25%, #e6e6e6);
background-image: -moz-linear-gradient(top, #f5f5f5, #f5f5f5 25%, #e6e6e6);
background-image: -ms-linear-gradient(#f5f5f5, #f5f5f5 25%, #e6e6e6);
background-image: -o-linear-gradient(#f5f5f5, #f5f5f5 25%, #e6e6e6);
background-image: linear-gradient(#f5f5f5, #f5f5f5 25%, #e6e6e6);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#e6e6e6', GradientType=0);
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.8);
color: #666;
}
button:hover,button[type=reset]:hover {
background-position: 0 -15px;
}
button.minWidth {
width: 187px;
}
input[type=checkbox],input[type=radio] {
width: auto;
height: auto;
margin-left: 0;
padding: 0;
line-height: normal;
float: left;
border: none;
}
input[type=file] {
height: 27px;
border: none;
}
input[type=file]:focus, input[type=checkbox]:focus, select:focus {
outline: 1px dotted #666;
}
input[disabled] {
cursor: not-allowed;
background-color: #d1d1d1;
border: 1px solid white;
color: #bdbdbd;
}
button::-moz-focus-inner, input::-moz-focus-inner {
border: 0;
padding: 0;
}
.row {
display: block;
clear: both;
overflow: hidden;
margin: 15px 0;
}
.span,.span1 {
float: left;
display: inline;
}
.span {
width: 220px;
margin-right: 10px;
}
.span1 {
width: 270px;
margin: 0 25px;
}
.left {
float: left;
}
.right {
float: right;
}
.clear {
clear: both;
}
.wrapper {
width: 100%;
min-height: 100%;
position: relative;
}
/*Header*/
.header {
width: 100%;
height: 72px;
background: #2f3441 url("images/bg-header.png") repeat-x;
}
.header .headerContent {
width: 960px;
padding: 20px 10px 0;
height: 52px;
margin: 0 auto;
}
.headerContent h1 {
font-size: 30px;
margin: 0;
text-transform: uppercase;
line-height: 24px;
}
.headerContent h1 a {
text-decoration: none;
color: #a5adb8;
}
.headerContent p {
margin: 0;
line-height: 18px;
}
form.search {
display: inline-block;
float: right;
}
form.search > input[type=text] {
width: 205px;
height: 22px;
padding: 5px;
color: #a5adb8;
background-color: #24272d;
border: 1px solid #875f66;
font-size: 14px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
float: left;
margin: 0 5px 0 0;
box-shadow: inset 0 5px 5px rgba(0,0,0, 0.3);
-webkit-box-shadow: inset 0 5px 5px rgba(0,0,0, 0.3);
-moz-box-shadow: inset 0 5px 5px rgba(0,0,0, 0.3);
}
form.search > input[type=image] {
width: 36px;
height: 34px;
padding: 0;
margin: 0;
outline: none;
border: none;
background: transparent;
}
form.search > input:-moz-placeholder {
color: #5b636e;
}
form.search > input::-webkit-input-placeholder {
color: #5b636e;
}
form.search > input[type=text]:focus {
border: 1px solid #a5adb8;
}
/*Slider*/
.slider {
width: 980px;
height: 240px;
margin: 0 auto;
position: relative;
overflow: hidden;
}
.itemSlider {
width: 980px;
height: 240px;
}
.itemSlider .bgSlide {
width: 980px;
height: 240px;
position: absolute;
top: 0;
left: 0;
}
.itemSlider .descSlide {
position: absolute;
top: 40px;
left: 30px;
width: 500px;
overflow: hidden;
}
.descSlide>h1 {
font-size: 30px;
}
.descSlide h1+p {
color: #282D33;
font-size: 18px;
font-weight: bold;
margin: 0;
}
.descSlide>span {
display: inline-block;
font-size: 16px;
font-weight: bold;
color: #a5adb8;
margin: 20px 0 6px;
}
.descSlide>p {
color: #d9dcdf;
margin-top: 0;
}
/*Navigation*/
.nav {
width: 980px;
height: 29px;
background-color: #95161f;
margin: 0 auto;
padding-top: 7px;
}
ul.menu {
display: inline-block;
float: right;
margin: 0;
padding: 0;
list-style: none;
}
ul.menu li {
float: left;
}
ul.menu li a {
color: white;
font-weight: bold;
text-decoration: none;
padding: 0 20px;
-webkit-transition: text-shadow linear 0.2s;
-moz-transition: text-shadow linear 0.2s;
-ms-transition: text-shadow linear 0.2s;
-o-transition: text-shadow linear 0.2s;
transition: text-shadow linear 0.2s;
}
ul.menu li a:hover {
text-shadow: 0 0 15px rgba(255,255,255, 0.8);
}
.breadcrumbs {
width: 940px;
padding: 4px 20px 6px;
font-size: 11px;
margin: 0 auto;
background-color: #f3f3f3;
}
/*Main*/
.main {
width: 940px;
padding: 20px 20px 270px;
overflow: hidden;
background-color: white;
margin: 0 auto;
}
/*Left Column*/
.leftCol {
width: 223px;
float: left;
margin-right: 20px;
color: #757575;
}
.leftCol form {
width: 193px;
background-color: #f3f3f3;
border: 1px solid #d8dbde;
padding: 10px;
color: #757575;
}
.leftCol input,.leftCol textarea {
width: 183px;
}
.leftCol select {
width: 193px;
}
.leftCol select:focus {
outline: none;
}
.leftCol input[type=radio],.leftCol input[type=checkbox] {
width: auto;
}
.leftCol p {
font-size: 12px;
margin: 8px 0;
}
/*Social button*/
.tw,.vk,.google {
margin-bottom: 5px;
height: 20px;
}
/*Right Column*/
.rightCol {
overflow: hidden;
}
ul.img {
display: inline-block;
list-style: none;
margin: 0;
padding: 0 7px 15px;
}
ul.img li {
float: left;
box-shadow: 0 5px 5px rgba(0,0,0, 0.3);
-webkit-box-shadow: 0 5px 5px rgba(0,0,0, 0.3);
-moz-box-shadow: 0 5px 5px rgba(0,0,0, 0.3);
-webkit-transition: border linear 0.2s;
-moz-transition: border linear 0.2s;
-ms-transition: border linear 0.2s;
-o-transition: border linear 0.2s;
transition: border linear 0.2s;
margin-right: 15px;
border: 1px solid white;
}
ul.img li a {
width: 194px;
height: 140px;
display: block;
overflow: hidden;
}
ul.img li:hover {
border: 1px solid #95161f;
}
/*Footer*/
.footer {
position: absolute;
bottom: 0;
width: 100%;
background: #e7e4e4 url("images/bg-footer.png") repeat;
border-top: 10px solid #9c4757;
height: 230px;
overflow: hidden;
}
.footerContent {
padding: 10px;
color: white;
width: 960px;
margin: 0 auto;
font-size: 12px;
color: #85898f;
overflow: hidden;
}
.footerContent p {
margin: 7px 0;
}
.footerContent p strong {
font-size: 14px;
color: #a5adb8;
}
.footerContent a {
color: #d08b98;
}
.footerContent .borderBottom {
width: 270px;
height: 1px;
background-color: #191c20;
border-bottom: 1px solid #40474f;
margin-top: 5px;
}
.footerContent ul.clock {
list-style: none;
margin: 0;
padding: 0;
}
ul.clock li {
background: url("images/clock.png") left center no-repeat;
padding-left: 20px;
margin-top: 7px;
}
/*Social*/
.social {
font-size: 12px;
margin-right: 20px;
}
.social>div {
display: block;
float: left;
margin: 18px 5px 0 0;
}
.social ul {
display: inline-block;
margin: 15px 0 0 0;
padding: 0;
list-style: none;
float: left;
}
.social ul li {
float: left;
margin-right: 5px;
}