На всех страницах footer прижат к низу, а на одной нет. Почему? У кого так было?
Всем привет. Сверстал сайт на бутстрап. На всех страницах футер прижат к низу, а на странице регистрации нет. Стили общие для всех страниц. В стилях указан для html, body {height: 100%; min-width: 100%;}. В чем может быть проблема? У кого такое было?
Код страницы, на которой footer нормальный:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css2?family=Lora&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
<link rel="shortcut icon" href="assets/img/homeflat.png" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<title>DIM CLEANING</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/owl.carousel.min.css">
<link rel="stylesheet" href="assets/css/owl.theme.default.min.css">
<!-- Main Style -->
<link href="assets/css/style.css" rel="stylesheet">
<?php
require_once "functions/functions.php";
?>
</head>
<body data-spy="scroll" data-target="#navbar">
<header class="header" id="navbar">
<div class="container-fluid">
<div class="row">
<div class="header-phone col-md-4 d-flex align-items-center justify-content-center">
<p class="header-phone__nbr text-center">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-telephone-forward-fill" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M2.267.98a1.636 1.636 0 0 1 2.448.152l1.681 2.162c.309.396.418.913.296 1.4l-.513 2.053a.636.636 0 0 0 .167.604L8.65 9.654a.636.636 0 0 0 .604.167l2.052-.513a1.636 1.636 0 0 1 1.401.296l2.162 1.681c.777.604.849 1.753.153 2.448l-.97.97c-.693.693-1.73.998-2.697.658a17.471 17.471 0 0 1-6.571-4.144A17.47 17.47 0 0 1 .639 4.646c-.34-.967-.035-2.004.658-2.698l.97-.969zM12.646.646a.5.5 0 0 1 .708 0l2.5 2.5a.5.5 0 0 1 0 .708l-2.5 2.5a.5.5 0 0 1-.708-.708L14.293 4H9.5a.5.5 0 0 1 0-1h4.793l-1.647-1.646a.5.5 0 0 1 0-.708z"/>
</svg>
WhatsApp и тел: +7(910)-419-47-35
</p>
<p class="header-phone__nbr text-center">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-envelope-fill" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555zM0 4.697v7.104l5.803-3.558L0 4.697zM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757zm3.436-.586L16 11.801V4.697l-5.803 3.546z"/>
</svg>
Электронная почта: [email protected]
</p>
</div>
<div class="header-logo col-md-4 d-flex align-items-center justify-content-center">
<img src="assets/img/logo.jpg" alt="DIM Cleaning" class="header-logo__pic">
</div>
<div class="header-auth col-md-4 d-flex align-items-center justify-content-center">
<?php
if (@$_COOKIE['user'] == ''):
?>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-check2-circle" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M15.354 2.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3-3a.5.5 0 1 1 .708-.708L8 9.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
<path fill-rule="evenodd" d="M8 2.5A5.5 5.5 0 1 0 13.5 8a.5.5 0 0 1 1 0 6.5 6.5 0 1 1-3.25-5.63.5.5 0 1 1-.5.865A5.472 5.472 0 0 0 8 2.5z"/>
</svg>
<a href="register.php" class="header-auth__reg">Регистрация</a> |
<a href="authpage.php" class="header-auth__reg">Авторизация</a>
<?php else: ?>
<p>Привет <?=$_COOKIE['user']?>. <a style="color: #000; font-weight: bold" href="exit.php"> Выйти</a></p>
<?php endif;?>
</div>
</div>
<div class="row">
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="comment.php" class="header-dark__link">Отзывы клиентов</a>
</div>
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="#order" class="header-dark__link">Сделать заказ</a>
</div>
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="#stock" class="header-dark__link">Акции</a>
</div>
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="price.php" class="header-dark__link">Прайс-лист</a>
</div>
</div>
</div>
</header>
<section class="wrapper">
<div class="container-fluid">
<div class="row">
<div class="wrapper-img col">
<div class="container">
<div class="row">
<div class="wrapper-text">
<h1 class="wrapper-img__title">
Уборка квартир<br /> от 1690 рублей
</h1>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="service">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="service-title d-flex justify-content-center">
<h1 class="service-title__text">
Услуги клининговой компании DIM Cleaning
</h1>
</div>
</div>
<div class="row d-flex justify-content-center">
<div class="service-main">
<div class="card-deck">
<div class="card text-center">
<img class="card-img-top" src="assets/img/1.jpg" alt="Повседневная уборка">
<div class="card-body">
<h5 class="card-title">Повседневная уборка</h5>
<p class="card-text">От 2000 рублей</p>
<a href="price.php"><button type="button" class="btn btn-info">Подробнее</button></a>
</div>
</div>
<div class="card text-center">
<img class="card-img-top" src="assets/img/2.jpeg" alt="Генеральная уборка">
<div class="card-body">
<h5 class="card-title">Генеральная уборка</h5>
<p class="card-text">От 3000 рублей</p>
<a href="price.php"><button type="button" class="btn btn-info">Подробнее</button></a>
</div>
</div>
<div class="card text-center">
<img class="card-img-top" src="assets/img/3.jpg" alt="Уборка после ремонта">
<div class="card-body">
<h5 class="card-title">Уборка после ремонта</h5>
<p class="card-text">От 4000 рублей</p>
<a href="price.php"><button type="button" class="btn btn-info">Подробнее</button></a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="advantage">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="advantage-title">
<h1 class="advantage-title__text">
Наши преимущества
</h1>
</div>
</div>
<div class="row">
<div class="owl-carousel">
<div class="advantage-item text-center">
<img src="assets/img/homeflat.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Более 3 лет на рынке</p>
</div>
<div class="advantage-item text-center">
<img src="assets/img/clean.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Более 30000 выполненных заказов</p>
</div>
<div class="advantage-item text-center">
<img src="assets/img/bucket.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Специализированные средства <br />для уборки</p>
</div>
<div class="advantage-item text-center">
<img src="assets/img/household1.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Возможность уборки <br />в день обращения</p>
</div>
<div class="advantage-item text-center">
<img src="assets/img/thumb.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Только русские бригады клинеров</p>
</div>
<div class="advantage-item text-center">
<img src="assets/img/tick.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Техника Керхер</p>
</div>
<div class="advantage-item text-center">
<img src="assets/img/discount.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Накопительная система скидок <br /> для постоянных клиентов</p>
</div>
<div class="advantage-item text-center">
<img src="assets/img/household2.png" alt="icon" class="advantage-item__pic">
<p class="advantage-item__text">Есть нарекания к уборке?<br /> Переделаем бесплатно</p>
</div>
</div>
</div>
</div>
</section>
<section class="stock" id="stock">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="stock-title">
<h1 class="stock-title__text">
Акции
</h1>
</div>
</div>
<div class="row">
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="assets/img/cleaning3.jpg" alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="assets/img/cleaning.jpg" alt="Second slide">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleControls" 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="#carouselExampleControls" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
</section>
<section class="answer">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="answer-title">
<h1 class="answer-title__text">
Вопросы и ответы
</h1>
</div>
</div>
<div class="row d-flex justify-content-center">
<div class="accordion" id="accordionExample">
<div class="card">
<div class="card-header" id="headingOne">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Могу ли я заказывать уборку на еженедельной основе?
</button>
</h2>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
<div class="card-body">
Да. Вы можете заказать регулярную уборку по графику раз в неделю или раз в 2 недели. Так как поддерживать чистоту проще, чем ее наводить, при еженедельном обслуживании Вы получите хорошую скидку. Обычно, мы закрепляем определенный день недели и время, в которое к Вам будет приходить Домовенок, но можем разработать и индивидуальный график.Для больших любителей чистоты, наша клининговая компания может предоставлять услуги по уборке помещений на ежедневной основе.
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Могу ли я единоразово заказать генеральную уборку?
</button>
</h2>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
<div class="card-body">
Да, Вы можете заказать уборку только один раз, без подписки. “Домовенок” является признанным лидером в сложных уборках. У нас большая база профессиональных клинеров. Поэтому мы легко справимся с любым жилым помещением: квартирой, домом или коттеджем.
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Хочу, чтобы ко мне приходил один и тот же исполнитель. Это возможно?
</button>
</h2>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
<div class="card-body">
Да. В этом преимущество работы с нашим сервисов уборки. При регулярном обслуживании, к Вам будет приходить постоянный исполнитель, который знает где висят рубашки для глажки и как должен лежать коврик в ванной.
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFour">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Вы каким-то образом отбираете и обучаете своих исполнителей?
</button>
</h2>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordionExample">
<div class="card-body">
Каждый исполнитель проходит трехступенчатый отбор:<br />
1.Начинается всё с серии интервью на личные и профессиональные качества<br />
2.Затем исполнитель проходит видео-обучение и сдает тесты на знание усвоенного материала. Далее начинается практика в специально построенной модели квартиры, в которой есть все стандартные поверхности. Также после этого этапа необходимо сдать тест.<br />
3.После чего, каждый исполнитель около месяца ездит на заказы по уборке в качестве дополнительного стажера и проходит еще один курс обучения.
</div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingFive">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
Мне нравится как Вы убираетесь у меня дома. Можете ли Вы убраться в офисе?
</button>
</h2>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordionExample">
<div class="card-body">
Да, мы также убираемся в коммерческих, производственных и торговых помещениях. Клининговая компания “DIM Cleaning” уникальна в своем роде. Опыт предоставления услуг в офисах помогает нам с легкостью убирать сложные жилые объекты, а опыт уборки в квартирах помогает относится к офису, как к своему дому.
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="order" id="order">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="order-title">
<h1 class="order-title__text">
Заказать уборку
</h1>
</div>
</div>
<div class="row">
<div class="order-form col-md-6 d-flex justify-content-center">
<form class="w-50">
<div class="form-group">
<label for="subject">Услуга</label>
<input type="text" class="form-control" id="subject" name="subject" placeholder="Услуга">
</div>
<div class="form-group">
<label for="message">Телефон</label>
<input type="text" class="form-control" id="message" name="message">
</div>
<div class="form-group">
<label for="name">Имя</label>
<input type="text" class="form-control" id="name" name="name" placeholder="Имя">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="text" class="form-control" id="email" name="email" placeholder="Email">
</div>
<div id="messageShow" style="color: red"></div>
<button type="button" id="done" name="done" class="btn btn-primary">Заказать</button>
</form>
</div>
<div class="order-pic col-md-6">
<img src="assets/img/order.jpg" alt="Заказ" class="order-pic__item w-100">
</div>
</div>
</div>
</section>
<footer class="footer">
<div class="container-fluid">
<div class="row">
<div class="footer-info col-md-6 text-center">
<p class="footer-info__text">
Клининговая компания "DIM Cleaning"<br />
Все права защищены © <?=Date ('Y')?>
</p>
</div>
<div class="footer-info col-md-3">
<p class="footer-info__text">
+7(910)-419-47-35
</p>
</div>
<div class="footer-info col-md-3 text-center">
<a href="https://www.instagram.com/dim_cleaning/" target="_blank" class="footer-info__link">
<img src="assets/img/insta.png" alt="Instagram">
</a>
<a href="#" target="_blank" class="footer-info__link">
<img src="assets/img/telegram.png" alt="Telegram">
</a>
</div>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<script src="assets/js/jquery.js"></script>
<script src="assets/js/owl.carousel.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
Код страницы, где footer не прижат:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css2?family=Lora&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
<link rel="shortcut icon" href="assets/img/homeflat.png" />
<title>DIM CLEANING</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/owl.carousel.min.css">
<link rel="stylesheet" href="assets/css/owl.theme.default.min.css">
<!-- Main Style -->
<link href="assets/css/style.css" rel="stylesheet">
<?php
require_once "functions/functions.php";
?>
</head>
<body>
<header class="header" id="navbar">
<div class="container-fluid">
<div class="row">
<div class="header-phone col-md-4 d-flex align-items-center justify-content-center">
<p class="header-phone__nbr text-center">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-telephone-forward-fill" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M2.267.98a1.636 1.636 0 0 1 2.448.152l1.681 2.162c.309.396.418.913.296 1.4l-.513 2.053a.636.636 0 0 0 .167.604L8.65 9.654a.636.636 0 0 0 .604.167l2.052-.513a1.636 1.636 0 0 1 1.401.296l2.162 1.681c.777.604.849 1.753.153 2.448l-.97.97c-.693.693-1.73.998-2.697.658a17.471 17.471 0 0 1-6.571-4.144A17.47 17.47 0 0 1 .639 4.646c-.34-.967-.035-2.004.658-2.698l.97-.969zM12.646.646a.5.5 0 0 1 .708 0l2.5 2.5a.5.5 0 0 1 0 .708l-2.5 2.5a.5.5 0 0 1-.708-.708L14.293 4H9.5a.5.5 0 0 1 0-1h4.793l-1.647-1.646a.5.5 0 0 1 0-.708z"/>
</svg>
WhatsApp и тел: +7(910)-419-47-35
</p>
<p class="header-phone__nbr text-center">
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-envelope-fill" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555zM0 4.697v7.104l5.803-3.558L0 4.697zM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757zm3.436-.586L16 11.801V4.697l-5.803 3.546z"/>
</svg>
Электронная почта: [email protected]
</p>
</div>
<div class="header-logo col-md-4 d-flex align-items-center justify-content-center">
<img src="assets/img/logo.jpg" alt="DIM Cleaning" class="header-logo__pic">
</div>
<div class="header-auth col-md-4 d-flex align-items-center justify-content-center">
<?php
if (@$_COOKIE['user'] == ''):
?>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-check2-circle" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M15.354 2.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3-3a.5.5 0 1 1 .708-.708L8 9.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
<path fill-rule="evenodd" d="M8 2.5A5.5 5.5 0 1 0 13.5 8a.5.5 0 0 1 1 0 6.5 6.5 0 1 1-3.25-5.63.5.5 0 1 1-.5.865A5.472 5.472 0 0 0 8 2.5z"/>
</svg>
<a href="register.php" class="header-auth__reg">Регистрация</a> |
<a href="authpage.php" class="header-auth__reg">Авторизация</a>
<?php else: ?>
<p>Привет <?=$_COOKIE['user']?>. <a style="color: #000; font-weight: bold" href="exit.php"> Выйти</a></p>
<?php endif;?>
</div>
</div>
<div class="row">
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="index.php" class="header-dark__link">Отзывы клиентов</a>
</div>
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="index.php" class="header-dark__link">Сделать заказ</a>
</div>
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="index.php" class="header-dark__link">Акции</a>
</div>
<div class="header-dark col-12 col-md-3 d-flex justify-content-center">
<a href="price.php" class="header-dark__link">Прайс-лист</a>
</div>
</div>
</div>
</header>
<section class="register">
<div class="container">
<div class="row">
<div class="register-form col d-flex justify-content-center">
<form class="w-50" action="auth.php" method="post">
<div class="form-group">
<label for="login">Логин</label>
<input type="text" class="form-control" id="login" name="login" placeholder="Логин">
</div>
<div class="form-group">
<label for="pass">Пароль</label>
<input type="password" class="form-control" id="pass" name="pass" placeholder="Пароль">
</div>
<button type="submit" class="btn btn-primary">Войти</button>
</form>
</div>
</div>
</div>
</section>
<footer class="footer">
<div class="container-fluid">
<div class="row">
<div class="footer-info col-md-6 text-center">
<p class="footer-info__text">
Клининговая компания "DIM Cleaning"<br />
Все права защищены © <?=Date ('Y')?>
</p>
</div>
<div class="footer-info col-md-3">
<p class="footer-info__text">
+7(910)-419-47-35
</p>
</div>
<div class="footer-info col-md-3 text-center">
<a href="https://www.instagram.com/dim_cleaning/" target="_blank" class="footer-info__link">
<img src="assets/img/insta.png" alt="Instagram">
</a>
<a href="#" target="_blank" class="footer-info__link">
<img src="assets/img/telegram.png" alt="Telegram">
</a>
</div>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<script src="assets/js/jquery.js"></script>
<script src="assets/js/owl.carousel.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
CSS
html, body {
height: 100%;
max-width: 100%;
/* overflow-x: hidden; */
}
body {
font-family: 'Lora', serif;
background-color: #fff;
position: relative;
}
a:hover {
text-decoration: none;
}
/* Style for header */
.header {
background-color: #fff;
font-size: 18px;
width: 100%;
}
.header-logo__pic {
width: 67%;
height: 80%;
border-radius: 10px;
margin: 20px 0;
}
.header-auth__reg {
color: #00264d;
margin: 0 5px;
}
.header-auth__reg:hover {
color: #6666ff;
}
.header-dark {
background-color: #00b3b3;
}
.header-dark__link {
color: #fff;
font-size: 20px;
}
.header-dark__link:hover {
color: #ffff4d;
}
/* Style for wrapper */
.wrapper {
background: url(2.jpg) no-repeat center top / cover;
}
.wrapper-img {
padding-top: 30px;
}
.wrapper-img__title {
font-family: 'Lobster', cursive;
font-size: 50px;
color: #181f32;
margin-bottom: 60px;
}
/* Style for services */
.service {
margin-top: 60px;
margin-bottom: 60px;
}
.service-title__text {
margin-bottom: 60px;
}
.card:hover {
-moz-transform: scale(1) translate(10px, -20px);
-webkit-transform: scale(1) translate(10px, -20px);
-o-transform: scale(1) translate(10px, -20px);
-ms-transform: scale(1) translate(10px, -20px);
transform: scale(1) translate(10px, -20px);
transition: all 0.8s ease;
cursor: pointer;
}
/* Style for advantage */
.advantage {
background-color: #e6faff;
padding-bottom: 20px;
}
.advantage-item {
cursor: pointer;
}
.advantage-title__text {
margin-bottom: 60px;
margin-top: 30px;
}
.advantage-item__text {
margin-top: 10px;
}
.owl-carousel .owl-item img {
width: 40%;
margin-left: 110px;
}
/* Style for stock */
.stock {
margin-top: 30px;
margin-bottom: 30px;
}
.stock-title {
margin-bottom: 30px;
}
/* Style for answer */
.answer-title__text {
margin-bottom: 30px;
}
/* Style for order */
.order {
margin-top: 30px;
background-color: #e6faff;
padding: 40px 0;
}
.order-title {
margin-bottom: 30px;
}
/* Style for footer */
.footer {
background-color: #17a2b8;
padding: 10px 0;
}
.footer-info__text {
color: #fff;
font-size: 20px;
}
.footer-info__link {
margin-right: 10px;
}
/* Style for register */
.register {
margin: 100px 0;
}
/* Style for comment */
.comment-title {
margin-top: 50px;
}
.comment-form {
margin-bottom: 50px;
}
.comment-user {
margin-bottom: 50px;
}
@media screen and (min-width: 320px) and (max-width: 425px) {
.header-phone__nbr {
font-size: 80%;
}
.header-auth__reg {
font-size: 95%;
}
h1.wrapper-img__title {
font-size: 200%;
}
h1.service-title__text {
text-align: center;
}
.card-deck .card {
margin-bottom: 0;
}
h1.advantage-title__text {
text-align: center;
}
.owl-carousel .owl-item img {
margin-left: 25%;
width: 50%;
}
h1.answer-title__text {
text-align: center;
}
.order-form {
margin-bottom: 10%;
}
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
.header-phone__nbr {
font-size: 72%;
}
.header-auth__reg {
font-size: 72%;
}
}
@media screen and (min-width: 1500px) and (max-width: 2560px) {
h1.wrapper-img__title {
font-size: 400%;
}
.header-phone__nbr {
font-size: 150%;
}
.header-auth__reg {
font-size: 150%;
}
}