index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Flowers shop</title>
  <link rel="stylesheet" href="css/main.css">
  <link
    href="https://fonts.googleapis.com/css2?family=Montaga&family=Rokkitt&family=Rosarivo&family=Rouge+Script&display=swap"
    rel="stylesheet">
</head>

<body>

  <header class="header">
    <div class="container">
      <div class="header__content">
        <h2 class="logo logo_header">FLOWERS</h2>
        <input type="checkbox" class="nav-toggle" id="nav-toggle">
        <nav>
          <ul class="navigation">
            <li><a href="#catalogue">Catalogue</a></li>
            <li><a href="#review">Reviews</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contacts">Contacts</a></li>
          </ul>
        </nav>
        <label for="nav-toggle" class="nav-toggle-label">
          <span class="nav-toggle-label__item"></span>
        </label>
        <a href="#" class="cart">
          <img src="images/cart.svg" alt="cart">
        </a>
      </div>
    </div>
  </header>

  <section class="banner">
    <div class="container">
      <div class="banner-wrapper">

        <h1 class="banner__title">Welcome</h1>

        <p class="banner__text">In our store you can buy fresh flowers for all occasions: birthday, wedding, anniversary
          or something else.
          Give loved ones joy.</p>
        <div class="banner__btn">
          <a href="#" class="button"><span>Shop now</span></a>
        </div>
      </div>
    </div>
  </section>

  <section class="content promo congratulations" id="catalogue">
    <div class="container">
      <h3 class="title promo__title">For congratulations...</h3>
      <div class="promo-wrapper">
        <p class="promo__text">Flowers are always actual gift. It’s beatiful way to say your congratilations, make
          declaration of love or make an elegant present to a loved one on a common day!</p>
        <img class="promo__img promo__img_bottom img1" src="images/promo1.jpg" alt="">
        <img class="promo__img img2" src="images/promo2.jpg" alt="">
        <div class="promo__btn">
          <a href="#" class="button"><span>View all</span></a>
        </div>
      </div>
    </div>
  </section>

  <section class="content promo home">
    <div class="container">
      <h3 class="title promo__title">For home...</h3>
      <div class="promo-wrapper">
        <p class="promo__text">Properly selected flowers can add a twist to your interior. Flowers give the interior
          a
          new life, filled with purity, freshness and comfort.</p>

        <img class="promo__img promo__img_bottom img1" src="images/promo3.jpg" alt="">
        <img class="promo__img img2" src="images/promo4.jpg" alt="">
        <div class="promo__btn">
          <a href="#" class="button"><span>View all</span></a>

        </div>
      </div>
    </div>
  </section>

  <section class="content review" id="review">
    <div class="container">
      <h3 class="title review__title">Reviews</h3>
      <div class="review-wrapper">
        <div class="review__comment">
          <img src="images/comment_girl1.png" alt="comment_girl1">
          <p>“Every year I receive flowers from my husband as a gift for our anniversary. I was very surprised that
            these flowers have long kept a fresh look.” - Fiona</p>
        </div>
        <div class="review__comment">
          <img src="images/comment_girl2.png" alt="comment_girl2">
          <p>“It is always nice to receive flowers as a gift. They look perfect and bring home a pleasant aroma. I
            ordered them as a gift to my sister and she was very pleased.” - Charlotte</p>
        </div>
      </div>
    </div>
  </section>

  <section class="content about" id="about">
    <div class="container">
      <h3 class="title about__title">About</h3>
      <div class="about-wrapper">
        <img src="images/about.jpg" alt="about image" class="about__img">
        <p class="about__text">FLOWERS always worked with suppliers directly, so we can guarantee the high quality of
          our goods. Satisfying the needs of our customers, we hope to get a positive experience. In our stores you can
          find beautiful solutions for your needs.</p>

        <p class="about__text">We partner with local florists to hand-craft floral arrangements available for same-day.
          In addition to
          delivering flowers, we support locally-owned retail florists by providing technology, marketing, and digital
          services to members of our florist network.</p>
      </div>
    </div>
  </section>

  <section class="content contacts" id="contacts">
    <div class="container">
      <h3 class="title contacts__title">Contacts</h3>
      <p class="contacts_number">+7 (269) 999 999</p>
      <p>flowers@gmail.com</p>
      <p>Elderveldplein 7, Arnhem, Nederland</p>
    </div>
  </section>

  <footer class="footer">
    <div class="container">
      <nav>
        <ul class="navigation">
          <li><a href="#catalogue">Catalogue</a></li>
          <li><a href="#review">Reviews</a></li>
          <li><a href="#about">About</a></li>
          <li><a href="#contacts">Contacts</a></li>
        </ul>
      </nav>
      <h2 class="logo logo_footer">FLOWERS</h2>
      <p>© 2020 - All rights reserved</p>
      <p>Privacy Policy · Terms of Service</p>
    </div>
  </footer>


</body>

</html>