{{-- ✂️ Layout --}}
@extends('layouts.master')


{{-- ⚙️ Scripts relatifs à la view --}}
@section("js")
{{-- <script src="./test.js"></script> --}}
@stop


{{-- 🎨 Style relatifs à la view ---}}
@section("css")
{{-- <script src="./test.js"></script> --}}
@stop


{{-- 🔥 Content --}}
@section("content")

  {{-- Banner Section --}}
  <section class="banner banner--overlap" role="banner">
    <div class="banner__img">
      <img class="banner__img__src" src="{{ asset('img/banner.jpg') }}" alt="Alt Text goes here">
    </div>
    <div class="banner__content">
      <h1 class="banner__maintitle">Vous accompagner dans la gestion de votre syndic de copropriété</h1>
    </div>
  </section>

  {{-- Page Body --}}
  <div class="wrapper ">
    <section class="mainContent banner--overlap">
      <div class="rte">
        <h2>Ceci est un titre de niveau 2</h2>
        <p class="rte__intro">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc condimentum lorem enim, id laoreet nulla cursus sit amet. In quis tincidunt justo.</p>
        <p>Lorem ipsum dolor sit amet, <strong>consectetur adipiscing</strong> elit. Nunc condimentum lorem enim, id laoreet nulla cursus sit amet. <a href="#">In quis</a> tincidunt justo. Quisque imperdiet, sem mattis venenatis tempor, urna lacus pulvinar sapien, et porttitor magna magna eu mi.</p>
        <p>Sed venenatis nisl ex, sed suscipit diam feugiat sed. Etiam tincidunt iaculis nibh, eget laoreet sem luctus nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id magna eget lacus aliquet semper. Vivamus ultrices pellentesque ante. Nulla ante tortor, elementum vitae lacinia sed, aliquam et tortor.</p>

        <h3>Buttons: different styles</h3>

        <h4>Basic buttons</h4>
        <div class="btnGroup">
          <a href="#" class="btn">Clique moi</a>
          <a href="#" class="btn btn--outline">Clique moi</a>
        </div>

        <h4>Syndic One</h4>
        <div class="btnGroup">
          <a href="#" class="btn btn--green">Clique moi</a>
          <a href="#" class="btn btn--outline btn--green">Clique moi</a>
        </div>

        <h4>Viva Syndic</h4>
        <div class="btnGroup">
          <a href="#" class="btn btn--red">Clique moi</a>
          <a href="#" class="btn btn--outline btn--red">Clique moi</a>
        </div>

        <h4>Eseis Syndic</h4>
        <div class="btnGroup">
          <a href="#" class="btn btn--blue">Clique moi</a>
          <a href="#" class="btn btn--outline btn--blue">Clique moi</a>
        </div>

        <h3>Titre de niveau 3 avant listes</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc condimentum lorem enim, id laoreet nulla cursus sit amet. In quis tincidunt justo.</p>

        <h4>Liste désordonéee et titre niveau 4</h4>
        <ul>
          <li>Lorem ipsum dolor sit amet, consectetur</li>
          <li>Nunc condimentum lorem enim</li>
          <li>Nam erat tortor, feugiat vel orci eget, suscipit dictum leo</li>
          <li>Donec tempor placerat vehicula. Nunc ut semper lorem, sit amet molestie risus. Nulla tristique facilisis neque, eget cursus neque tempus et. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac metus pharetra, interdum sem ut, maximus dolor.</li>
        </ul>

        <hr>

        <h4>Liste ordonnée et titre niveau 4</h4>
        <ol>
          <li>Lorem ipsum dolor sit amet, consectetur</li>
          <li>Nunc condimentum lorem enim</li>
          <li>Nam erat tortor, feugiat vel orci eget, suscipit dictum leo</li>
          <li>Donec tempor placerat vehicula. Nunc ut semper lorem, sit amet molestie risus. Nulla tristique facilisis neque, eget cursus neque tempus et. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac metus pharetra, interdum sem ut, maximus dolor.</li>
        </ol>

        <h4>Blockquote exemple</h4>
        <blockquote>
          Blockquote, Donec tempor placerat vehicula. Nunc ut semper lorem, sit amet molestie risus. Nulla tristique facilisis neque, eget cursus neque tempus et. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac metus pharetra, interdum sem ut, maximus dolor.
        </blockquote>

        <img src="https://source.unsplash.com/800x300/?nature" alt="">
      </div>
    </section>
  </div>
@stop