Organisms

Organisms are groups of molecules joined together to form a relatively complex, distinct section of an interface.

Building up from molecules to organisms encourages creating standalone, portable, reusable components.

Atomic Design by Brad Frost

Articles List

<div class="prismea-landingpage-articles-list">
  <div class="prismea-landingpage-article-card"><img class="prismea-landingpage-article-card-image" src="https://placeimg.com/380/250/animals"/>
    <div class="prismea-landingpage-article-card-body">
      <div class="prismea-vertical-spacing-10--slot">
        <div class="prismea-landingpage-category-label">
          <div class="prismea-landingpage-category-label-text">
            <p class="prismea-text -size-14">Lorem Ipsum</p>
          </div>
        </div>
      </div>
      <h3 class="prismea-text -size-18 -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h3>
      <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.</p>
    </div>
    <div class="prismea-landingpage-article-card-footer"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <p class="prismea-text -size-12 prismea-color -color-grey4"><span>Lorem ipsum dolor sit</span><span class="prismea-color -color-primary"> amet consectetur</span></p>
    </div>
  </div>
  <div class="prismea-landingpage-article-card"><img class="prismea-landingpage-article-card-image" src="https://placeimg.com/380/250/animals"/>
    <div class="prismea-landingpage-article-card-body">
      <div class="prismea-vertical-spacing-10--slot">
        <div class="prismea-landingpage-category-label">
          <div class="prismea-landingpage-category-label-text">
            <p class="prismea-text -size-14">Lorem Ipsum</p>
          </div>
        </div>
      </div>
      <h3 class="prismea-text -size-18 -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h3>
      <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.</p>
    </div>
    <div class="prismea-landingpage-article-card-footer"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <p class="prismea-text -size-12 prismea-color -color-grey4"><span>Lorem ipsum dolor sit</span><span class="prismea-color -color-primary"> amet consectetur</span></p>
    </div>
  </div>
  <div class="prismea-landingpage-article-card"><img class="prismea-landingpage-article-card-image" src="https://placeimg.com/380/250/animals"/>
    <div class="prismea-landingpage-article-card-body">
      <div class="prismea-vertical-spacing-10--slot">
        <div class="prismea-landingpage-category-label">
          <div class="prismea-landingpage-category-label-text">
            <p class="prismea-text -size-14">Lorem Ipsum</p>
          </div>
        </div>
      </div>
      <h3 class="prismea-text -size-18 -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h3>
      <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.</p>
    </div>
    <div class="prismea-landingpage-article-card-footer"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <p class="prismea-text -size-12 prismea-color -color-grey4"><span>Lorem ipsum dolor sit</span><span class="prismea-color -color-primary"> amet consectetur</span></p>
    </div>
  </div>
  <div class="prismea-landingpage-article-card"><img class="prismea-landingpage-article-card-image" src="https://placeimg.com/380/250/animals"/>
    <div class="prismea-landingpage-article-card-body">
      <div class="prismea-vertical-spacing-10--slot">
        <div class="prismea-landingpage-category-label">
          <div class="prismea-landingpage-category-label-text">
            <p class="prismea-text -size-14">Lorem Ipsum</p>
          </div>
        </div>
      </div>
      <h3 class="prismea-text -size-18 -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h3>
      <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.</p>
    </div>
    <div class="prismea-landingpage-article-card-footer"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <p class="prismea-text -size-12 prismea-color -color-grey4"><span>Lorem ipsum dolor sit</span><span class="prismea-color -color-primary"> amet consectetur</span></p>
    </div>
  </div>
  <div class="prismea-landingpage-article-card"><img class="prismea-landingpage-article-card-image" src="https://placeimg.com/380/250/animals"/>
    <div class="prismea-landingpage-article-card-body">
      <div class="prismea-vertical-spacing-10--slot">
        <div class="prismea-landingpage-category-label">
          <div class="prismea-landingpage-category-label-text">
            <p class="prismea-text -size-14">Lorem Ipsum</p>
          </div>
        </div>
      </div>
      <h3 class="prismea-text -size-18 -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h3>
      <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.</p>
    </div>
    <div class="prismea-landingpage-article-card-footer"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <p class="prismea-text -size-12 prismea-color -color-grey4"><span>Lorem ipsum dolor sit</span><span class="prismea-color -color-primary"> amet consectetur</span></p>
    </div>
  </div>
  <div class="prismea-landingpage-article-card"><img class="prismea-landingpage-article-card-image" src="https://placeimg.com/380/250/animals"/>
    <div class="prismea-landingpage-article-card-body">
      <div class="prismea-vertical-spacing-10--slot">
        <div class="prismea-landingpage-category-label">
          <div class="prismea-landingpage-category-label-text">
            <p class="prismea-text -size-14">Lorem Ipsum</p>
          </div>
        </div>
      </div>
      <h3 class="prismea-text -size-18 -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h3>
      <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.</p>
    </div>
    <div class="prismea-landingpage-article-card-footer"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <p class="prismea-text -size-12 prismea-color -color-grey4"><span>Lorem ipsum dolor sit</span><span class="prismea-color -color-primary"> amet consectetur</span></p>
    </div>
  </div>
  <div class="prismea-landingpage-article-card"><img class="prismea-landingpage-article-card-image" src="https://placeimg.com/380/250/animals"/>
    <div class="prismea-landingpage-article-card-body">
      <div class="prismea-vertical-spacing-10--slot">
        <div class="prismea-landingpage-category-label">
          <div class="prismea-landingpage-category-label-text">
            <p class="prismea-text -size-14">Lorem Ipsum</p>
          </div>
        </div>
      </div>
      <h3 class="prismea-text -size-18 -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h3>
      <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.</p>
    </div>
    <div class="prismea-landingpage-article-card-footer"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <p class="prismea-text -size-12 prismea-color -color-grey4"><span>Lorem ipsum dolor sit</span><span class="prismea-color -color-primary"> amet consectetur</span></p>
    </div>
  </div>
</div>
.prismea-landingpage-articles-list
  .prismea-landingpage-article-card
    img.prismea-landingpage-article-card-image(src='https://placeimg.com/380/250/animals')
    .prismea-landingpage-article-card-body
      .prismea-vertical-spacing-10--slot
        .prismea-landingpage-category-label
          .prismea-landingpage-category-label-text
            p.prismea-text.-size-14 Lorem Ipsum
      h3.prismea-text.-size-18.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
      p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.
    .prismea-landingpage-article-card-footer
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      p.prismea-text.-size-12.prismea-color.-color-grey4
        span Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur
  .prismea-landingpage-article-card
    img.prismea-landingpage-article-card-image(src='https://placeimg.com/380/250/animals')
    .prismea-landingpage-article-card-body
      .prismea-vertical-spacing-10--slot
        .prismea-landingpage-category-label
          .prismea-landingpage-category-label-text
            p.prismea-text.-size-14 Lorem Ipsum
      h3.prismea-text.-size-18.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
      p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.
    .prismea-landingpage-article-card-footer
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      p.prismea-text.-size-12.prismea-color.-color-grey4
        span Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur
  .prismea-landingpage-article-card
    img.prismea-landingpage-article-card-image(src='https://placeimg.com/380/250/animals')
    .prismea-landingpage-article-card-body
      .prismea-vertical-spacing-10--slot
        .prismea-landingpage-category-label
          .prismea-landingpage-category-label-text
            p.prismea-text.-size-14 Lorem Ipsum
      h3.prismea-text.-size-18.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
      p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.
    .prismea-landingpage-article-card-footer
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      p.prismea-text.-size-12.prismea-color.-color-grey4
        span Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur
  .prismea-landingpage-article-card
    img.prismea-landingpage-article-card-image(src='https://placeimg.com/380/250/animals')
    .prismea-landingpage-article-card-body
      .prismea-vertical-spacing-10--slot
        .prismea-landingpage-category-label
          .prismea-landingpage-category-label-text
            p.prismea-text.-size-14 Lorem Ipsum
      h3.prismea-text.-size-18.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
      p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.
    .prismea-landingpage-article-card-footer
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      p.prismea-text.-size-12.prismea-color.-color-grey4
        span Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur
  .prismea-landingpage-article-card
    img.prismea-landingpage-article-card-image(src='https://placeimg.com/380/250/animals')
    .prismea-landingpage-article-card-body
      .prismea-vertical-spacing-10--slot
        .prismea-landingpage-category-label
          .prismea-landingpage-category-label-text
            p.prismea-text.-size-14 Lorem Ipsum
      h3.prismea-text.-size-18.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
      p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.
    .prismea-landingpage-article-card-footer
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      p.prismea-text.-size-12.prismea-color.-color-grey4
        span Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur
  .prismea-landingpage-article-card
    img.prismea-landingpage-article-card-image(src='https://placeimg.com/380/250/animals')
    .prismea-landingpage-article-card-body
      .prismea-vertical-spacing-10--slot
        .prismea-landingpage-category-label
          .prismea-landingpage-category-label-text
            p.prismea-text.-size-14 Lorem Ipsum
      h3.prismea-text.-size-18.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
      p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.
    .prismea-landingpage-article-card-footer
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      p.prismea-text.-size-12.prismea-color.-color-grey4
        span Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur
  .prismea-landingpage-article-card
    img.prismea-landingpage-article-card-image(src='https://placeimg.com/380/250/animals')
    .prismea-landingpage-article-card-body
      .prismea-vertical-spacing-10--slot
        .prismea-landingpage-category-label
          .prismea-landingpage-category-label-text
            p.prismea-text.-size-14 Lorem Ipsum
      h3.prismea-text.-size-18.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
      p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa perspiciatis numquam consectetur vitae commodi similique exercitationem, lauda.
    .prismea-landingpage-article-card-footer
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      p.prismea-text.-size-12.prismea-color.-color-grey4
        span Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur

Blog Advertising

<div class="prismea-landingpage-blog-advertising prismea-landingpage-content-container--blog">
  <div class="prismea-landingpage-blog-advertising-text">
    <h3 class="prismea-title-2 prismea-text -text-medium">Lorem ipsum dolor</h3>
    <h2 class="prismea-title-2">Lorem ipsum dolor sit amet consectetur</h2>
    <p class="prismea-text prismea-color -color-grey5 prismea-vertical-spacing-20--slot">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sucipit voluptates in.</p>
    <div class="prismea-vertical-spacing-20--slot">
      <a class="prismea-button -primary" href="#">Button</a>
    </div>
  </div>
  <div class="prismea-landingpage-blog-advertising-visual"><img src="https://placeimg.com/400/400/animals"/></div>
</div>
.prismea-landingpage-blog-advertising.prismea-landingpage-content-container--blog
  .prismea-landingpage-blog-advertising-text
    h3.prismea-title-2.prismea-text.-text-medium Lorem ipsum dolor
    h2.prismea-title-2 Lorem ipsum dolor sit amet consectetur
    p.prismea-text.prismea-color.-color-grey5.prismea-vertical-spacing-20--slot Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sucipit voluptates in.
    .prismea-vertical-spacing-20--slot
      a.prismea-button.-primary(href='#') Button
  .prismea-landingpage-blog-advertising-visual
    img(src='https://placeimg.com/400/400/animals')

Blog Article

<div class="prismea-landingpage-blog-article prismea-landingpage-content-container--blog">
  <div class="prismea-landingpage-blog-article-banner"><img class="prismea-landingpage-blog-article-banner" src="https://placeimg.com/1200/350/animals"/></div>
  <div class="prismea-landingpage-blog-article-body">
    <div class="prismea-landingpage-blog-article-body-sharing">
      <div class="prismea-landingpage-blog-article-body-sharing-links"><a class="prismea-landingpage-share-link"><i class="prismea-icon prismea-landingpage-glyph-26_twitter"></i></a><a class="prismea-landingpage-share-link"><i class="prismea-icon prismea-landingpage-glyph-26_facebook"></i></a><a class="prismea-landingpage-share-link"><i class="prismea-icon prismea-landingpage-glyph-26_linkedin"></i></a>
      </div>
    </div>
    <div class="prismea-vertical-spacing-20--slot prismea-vertical-spacing-20 -flex -middle">
      <div class="prismea-landingpage-category-label">
        <div class="prismea-landingpage-category-label-text">
          <p class="prismea-text -size-14">Lorem Ipsum</p>
        </div>
      </div>
    </div>
    <div class="prismea-vertical-spacing-15--slot -center">
      <h2 class="prismea-title-2 prismea-text -text-medium">Lorem ipsum dolor sit amet consectetur adipisicing elit</h2>
    </div>
    <div class="prismea-vertical-spacing-15--slot -center"><img class="prismea-landingpage-author-picture" src="https://placeimg.com/100/100/animals"/>
      <div class="prismea-text -size-12 prismea-color -color-grey4">Lorem ipsum dolor sit<span class="prismea-color -color-primary"> amet consectetur</span></div>
    </div>
    <div class="prismea-vertical-spacing-70--slot">
      <p class="prismea-text -size-14 -text-medium prismea-vertical-spacing-40--slot">Lorem<i class="prismea-icon prismea-landingpage-glyph-16_chevron_right -color-primary"></i>Ipsum<i class="prismea-icon prismea-landingpage-glyph-16_chevron_right -color-primary"></i>Dolor sit amet consectetur adipisicing elit
      </p>
      <div class="prismea-landingpage-wysiwyg prismea-text">
        <p class="prismea-vertical-spacing-30--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores aliquam optio assumenda. Ullam accusamus tenetur quibusdam? Veniam, tempore qui rerum ex, rem iste voluptas suscipit, porro obcaecati repudiandae excepturi illum!</p>
        <h2 class="prismea-title-2 prismea-vertical-spacing-40--slot">Lorem ipsum dolor sit amet</h2>
        <p class="prismea-vertical-spacing-30--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores aliquam optio assumenda. Ullam accusamus tenetur quibusdam? Veniam, tempore qui rerum ex, rem iste voluptas suscipit, porro obcaecati repudiandae excepturi illum!</p>
        <p class="prismea-vertical-spacing-30--slot">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores aliquam optio assumenda. Ullam accusamus tenetur quibusdam? Veniam, tempore qui rerum ex, rem iste voluptas suscipit, porro obcaecati repudiandae excepturi illum!</p><img class="prismea-vertical-spacing-30--slot" src="https://placeimg.com/800/450/animals"/>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-blog-article.prismea-landingpage-content-container--blog
  .prismea-landingpage-blog-article-banner
    img.prismea-landingpage-blog-article-banner(src='https://placeimg.com/1200/350/animals')
  .prismea-landingpage-blog-article-body
    .prismea-landingpage-blog-article-body-sharing
      .prismea-landingpage-blog-article-body-sharing-links
        a.prismea-landingpage-share-link
          i.prismea-icon.prismea-landingpage-glyph-26_twitter
        a.prismea-landingpage-share-link
          i.prismea-icon.prismea-landingpage-glyph-26_facebook
        a.prismea-landingpage-share-link
          i.prismea-icon.prismea-landingpage-glyph-26_linkedin
    .prismea-vertical-spacing-20--slot.prismea-vertical-spacing-20.-flex.-middle
      .prismea-landingpage-category-label
        .prismea-landingpage-category-label-text
          p.prismea-text.-size-14 Lorem Ipsum
    .prismea-vertical-spacing-15--slot.-center
      h2.prismea-title-2.prismea-text.-text-medium Lorem ipsum dolor sit amet consectetur adipisicing elit
    .prismea-vertical-spacing-15--slot.-center
      img.prismea-landingpage-author-picture(src='https://placeimg.com/100/100/animals')
      .prismea-text.-size-12.prismea-color.-color-grey4
        | Lorem ipsum dolor sit
        span.prismea-color.-color-primary  amet consectetur
    .prismea-vertical-spacing-70--slot
      p.prismea-text.-size-14.-text-medium.prismea-vertical-spacing-40--slot
        | Lorem
        i.prismea-icon.prismea-landingpage-glyph-16_chevron_right.-color-primary
        | Ipsum
        i.prismea-icon.prismea-landingpage-glyph-16_chevron_right.-color-primary
        | Dolor sit amet consectetur adipisicing elit

      .prismea-landingpage-wysiwyg.prismea-text
        p.prismea-vertical-spacing-30--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores aliquam optio assumenda. Ullam accusamus tenetur quibusdam? Veniam, tempore qui rerum ex, rem iste voluptas suscipit, porro obcaecati repudiandae excepturi illum!
        h2.prismea-title-2.prismea-vertical-spacing-40--slot Lorem ipsum dolor sit amet
        p.prismea-vertical-spacing-30--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores aliquam optio assumenda. Ullam accusamus tenetur quibusdam? Veniam, tempore qui rerum ex, rem iste voluptas suscipit, porro obcaecati repudiandae excepturi illum!
        p.prismea-vertical-spacing-30--slot Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores aliquam optio assumenda. Ullam accusamus tenetur quibusdam? Veniam, tempore qui rerum ex, rem iste voluptas suscipit, porro obcaecati repudiandae excepturi illum!
        img.prismea-vertical-spacing-30--slot(src='https://placeimg.com/800/450/animals')

Error Header

Diplayed only on the error template.

<div class="prismea-landingpage-error-header">
  <div class="prismea-landingpage-content-container prismea-color -color-white">
    <div class="prismea-vertical-spacing-10 -center">
      <p class="prismea-vertical-spacing-5--slot prismea-text -montserrat -size-80 -text-medium">404</p>
      <p class="prismea-vertical-spacing-20--slot prismea-text -montserrat -size-32">La page que vous<br/>recherchez n'existe pas</p>
      <p class="prismea-vertical-spacing-20--slot prismea-text">Nous sommes désolé mais il semblerait que la page à laquelle vous souhaitez accéder n’existe pas.</p>
      <div class="prismea-vertical-spacing-30--slot">
        <a class="prismea-button -white -transparent" href="#">Revenir à l'accueil</a>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-error-header
  .prismea-landingpage-content-container.prismea-color.-color-white
    .prismea-vertical-spacing-10.-center
      p.prismea-vertical-spacing-5--slot.prismea-text.-montserrat.-size-80.-text-medium 404
      p.prismea-vertical-spacing-20--slot.prismea-text.-montserrat.-size-32
        | La page que vous
        br
        | recherchez n'existe pas
      p.prismea-vertical-spacing-20--slot.prismea-text Nous sommes désolé mais il semblerait que la page à laquelle vous souhaitez accéder n’existe pas.
      .prismea-vertical-spacing-30--slot
        a.prismea-button.-white.-transparent(href='#') Revenir à l'accueil

Displayed on bottom of each page.

<footer class="prismea-landingpage-page-footer">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-landingpage-page-footer-links prismea-vertical-spacing-60--slot">
      <div class="prismea-landingpage-page-footer-links-column"><a class="prismea-landingpage-page-footer-links-brand">
          <div class="prismea-landingpage-prismea-logo"><i class="prismea-icon -x4 prismea-landingpage-glyph-42_prismea_left -color-white"></i><i class="prismea-icon prismea-landingpage-glyph-18_prismea_text -color-white"></i>
          </div></a>
        <div class="prismea-landingpage-page-footer-links-network"><a class="prismea-landingpage-page-footer-links-network-link"><i class="prismea-icon prismea-landingpage-glyph-32_twitter"></i></a><a class="prismea-landingpage-page-footer-links-network-link"><i class="prismea-icon prismea-landingpage-glyph-32_instagram"></i></a><a class="prismea-landingpage-page-footer-links-network-link"><i class="prismea-icon prismea-landingpage-glyph-32_facebook"></i></a><a class="prismea-landingpage-page-footer-links-network-link"><i class="prismea-icon prismea-landingpage-glyph-32_linkedin"></i></a></div>
      </div>
      <div class="prismea-landingpage-page-footer-links-column"><a class="prismea-landingpage-page-footer-links-navigation-link prismea-text">Lorem ipsum dolor sit</a><a class="prismea-landingpage-page-footer-links-navigation-link prismea-text">Lorem ipsum dolor</a><a class="prismea-landingpage-page-footer-links-navigation-link prismea-text">Lorem ipsum dolor sit amet</a></div>
      <div class="prismea-landingpage-page-footer-links-column"><a class="prismea-landingpage-page-footer-links-navigation-link prismea-text">Lorem ipsum dolor sit</a><a class="prismea-landingpage-page-footer-links-navigation-link prismea-text">Lorem ipsum dolor</a></div>
      <div class="prismea-landingpage-page-footer-links-column"><a class="prismea-landingpage-page-footer-links-navigation-link prismea-text">Lorem ipsum dolor</a><a class="prismea-landingpage-page-footer-links-navigation-link prismea-text">Lorem ipsum dolor sit amet</a></div>
    </div>
    <div class="prismea-landingpage-page-footer-mentions prismea-vertical-spacing-15--slot">
      <div class="prismea-landingpage-page-footer-mentions-copyright">
        <p class="prismea-text -size-14">Lorem ipsum dolor sit amet consectetur</p>
      </div>
      <div class="prismea-landingpage-page-footer-mentions-label">
        <div class="prismea-horizontal-spacing-10--slot">
          <p class="prismea-text -text-medium -size-14">Lorem ipsum</p>
        </div>
        <div class="prismea-horizontal-spacing-10--slot"><img src="../../images/finance-innovation.png"/></div>
      </div>
    </div>
    <div class="prismea-landingpage-page-footer-editor prismea-vertical-spacing-15--slot">
      <p class="prismea-text -size-10">Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat, nobis tempore nostrum veritatis odio quisquam, omnis esse sapiente porro voluptatem libero mollitia? Molestias laborum optio, consequuntur velit sed possimus consectetur. Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat, nobis tempore nostrum veritatis odio quisquam, omnis esse sapiente porro voluptatem libero mollitia? Molestias laborum optio, consequuntur velit sed possimus consectetur. Lorem ipsum dolor sit amet consectetur adipisicing elit. Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
    </div>
  </div>
</footer>
footer.prismea-landingpage-page-footer
  .prismea-landingpage-content-container
    .prismea-landingpage-page-footer-links.prismea-vertical-spacing-60--slot
      .prismea-landingpage-page-footer-links-column
        a.prismea-landingpage-page-footer-links-brand
          .prismea-landingpage-prismea-logo
            i.prismea-icon.-x4.prismea-landingpage-glyph-42_prismea_left.-color-white
            i.prismea-icon.prismea-landingpage-glyph-18_prismea_text.-color-white
        .prismea-landingpage-page-footer-links-network
          a.prismea-landingpage-page-footer-links-network-link
            i.prismea-icon.prismea-landingpage-glyph-32_twitter
          a.prismea-landingpage-page-footer-links-network-link
            i.prismea-icon.prismea-landingpage-glyph-32_instagram
          a.prismea-landingpage-page-footer-links-network-link
            i.prismea-icon.prismea-landingpage-glyph-32_facebook
          a.prismea-landingpage-page-footer-links-network-link
            i.prismea-icon.prismea-landingpage-glyph-32_linkedin
      .prismea-landingpage-page-footer-links-column
        a.prismea-landingpage-page-footer-links-navigation-link.prismea-text Lorem ipsum dolor sit
        a.prismea-landingpage-page-footer-links-navigation-link.prismea-text Lorem ipsum dolor
        a.prismea-landingpage-page-footer-links-navigation-link.prismea-text Lorem ipsum dolor sit amet
      .prismea-landingpage-page-footer-links-column
        a.prismea-landingpage-page-footer-links-navigation-link.prismea-text Lorem ipsum dolor sit
        a.prismea-landingpage-page-footer-links-navigation-link.prismea-text Lorem ipsum dolor
      .prismea-landingpage-page-footer-links-column
        a.prismea-landingpage-page-footer-links-navigation-link.prismea-text Lorem ipsum dolor
        a.prismea-landingpage-page-footer-links-navigation-link.prismea-text Lorem ipsum dolor sit amet
    .prismea-landingpage-page-footer-mentions.prismea-vertical-spacing-15--slot
      .prismea-landingpage-page-footer-mentions-copyright
        p.prismea-text.-size-14 Lorem ipsum dolor sit amet consectetur
      .prismea-landingpage-page-footer-mentions-label
        .prismea-horizontal-spacing-10--slot
          p.prismea-text.-text-medium.-size-14 Lorem ipsum
        .prismea-horizontal-spacing-10--slot
          img(src='../../images/finance-innovation.png')
    .prismea-landingpage-page-footer-editor.prismea-vertical-spacing-15--slot
      p.prismea-text.-size-10 Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat, nobis tempore nostrum veritatis odio quisquam, omnis esse sapiente porro voluptatem libero mollitia? Molestias laborum optio, consequuntur velit sed possimus consectetur. Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat, nobis tempore nostrum veritatis odio quisquam, omnis esse sapiente porro voluptatem libero mollitia? Molestias laborum optio, consequuntur velit sed possimus consectetur. Lorem ipsum dolor sit amet consectetur adipisicing elit. Lorem ipsum dolor sit amet consectetur adipisicing elit.

You can use the following variants:

  • -fixed: the menu is fixed at the top of the page
  • -transparent: the menu has no background
  • -minified: only the logo is displayed
  • -open: for mobile devices, the links are displayed
  • Add a search button
<nav class="prismea-landingpage-page-menu -fixed">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-landingpage-page-menu-content"><a>
        <div class="prismea-landingpage-prismea-logo"><i class="prismea-icon -x4 prismea-landingpage-glyph-42_prismea_left -color-primary"></i><i class="prismea-icon prismea-landingpage-glyph-18_prismea_text"></i>
        </div></a>
      <div class="prismea-landingpage-page-menu-buttons">
        <div class="prismea-landingpage-page-menu-button-open"><i class="prismea-icon prismea-landingpage-glyph-12_menu"></i>
        </div>
        <div class="prismea-landingpage-page-menu-button-close"><i class="prismea-icon prismea-landingpage-glyph-16_close"></i>
        </div>
      </div>
      <ul class="prismea-landingpage-page-menu-links">
        <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum</a></li>
        <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor sit</a></li>
        <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor</a></li>
        <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-button -primary">Lorem ipsum</a></li>
      </ul>
    </div>
  </div>
</nav>
<div style="position: relative; top: 90px;">
  <nav class="prismea-landingpage-page-menu -transparent">
    <div class="prismea-landingpage-content-container">
      <div class="prismea-landingpage-page-menu-content"><a>
          <div class="prismea-landingpage-prismea-logo"><i class="prismea-icon -x4 prismea-landingpage-glyph-42_prismea_left -color-white"></i><i class="prismea-icon prismea-landingpage-glyph-18_prismea_text -color-white"></i>
          </div></a>
        <div class="prismea-landingpage-page-menu-buttons">
          <div class="prismea-landingpage-page-menu-button-open"><i class="prismea-icon prismea-landingpage-glyph-12_menu"></i>
          </div>
          <div class="prismea-landingpage-page-menu-button-close"><i class="prismea-icon prismea-landingpage-glyph-16_close"></i>
          </div>
        </div>
        <ul class="prismea-landingpage-page-menu-links">
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor sit</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-button -primary">Lorem ipsum</a></li>
        </ul>
      </div>
    </div>
  </nav>
</div>
<div style="position: relative; top: 180px;">
  <nav class="prismea-landingpage-page-menu -transparent -minified">
    <div class="prismea-landingpage-content-container">
      <div class="prismea-landingpage-page-menu-content"><a>
          <div class="prismea-landingpage-prismea-logo"><i class="prismea-icon -x4 prismea-landingpage-glyph-42_prismea_left -color-white"></i><i class="prismea-icon prismea-landingpage-glyph-18_prismea_text -color-white"></i>
          </div></a>
        <div class="prismea-landingpage-page-menu-buttons">
          <div class="prismea-landingpage-page-menu-button-open"><i class="prismea-icon prismea-landingpage-glyph-12_menu"></i>
          </div>
          <div class="prismea-landingpage-page-menu-button-close"><i class="prismea-icon prismea-landingpage-glyph-16_close"></i>
          </div>
        </div>
        <ul class="prismea-landingpage-page-menu-links">
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor sit</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-button -primary">Lorem ipsum</a></li>
        </ul>
      </div>
    </div>
  </nav>
</div>
<div style="position: relative; top: 270px;">
  <nav class="prismea-landingpage-page-menu">
    <div class="prismea-landingpage-content-container">
      <div class="prismea-landingpage-page-menu-content"><a>
          <div class="prismea-landingpage-prismea-logo"><i class="prismea-icon -x4 prismea-landingpage-glyph-42_prismea_left -color-primary"></i><i class="prismea-icon prismea-landingpage-glyph-18_prismea_text"></i>
          </div></a>
        <div class="prismea-landingpage-page-menu-buttons">
          <div class="prismea-landingpage-page-menu-button-search"><i class="prismea-icon prismea-landingpage-glyph-12_search -color-grey5"></i>
          </div>
          <div class="prismea-landingpage-page-menu-button-open"><i class="prismea-icon prismea-landingpage-glyph-12_menu"></i>
          </div>
          <div class="prismea-landingpage-page-menu-button-close"><i class="prismea-icon prismea-landingpage-glyph-16_close"></i>
          </div>
        </div>
        <ul class="prismea-landingpage-page-menu-links">
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor sit</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-button -primary">Lorem ipsum</a></li>
        </ul>
      </div>
    </div>
  </nav>
</div>
<div style="position: relative; top: 360px;">
  <nav class="prismea-landingpage-page-menu -open">
    <div class="prismea-landingpage-content-container">
      <div class="prismea-landingpage-page-menu-content"><a>
          <div class="prismea-landingpage-prismea-logo"><i class="prismea-icon -x4 prismea-landingpage-glyph-42_prismea_left -color-primary"></i><i class="prismea-icon prismea-landingpage-glyph-18_prismea_text"></i>
          </div></a>
        <div class="prismea-landingpage-page-menu-buttons">
          <div class="prismea-landingpage-page-menu-button-open"><i class="prismea-icon prismea-landingpage-glyph-12_menu"></i>
          </div>
          <div class="prismea-landingpage-page-menu-button-close"><i class="prismea-icon prismea-landingpage-glyph-16_close"></i>
          </div>
        </div>
        <ul class="prismea-landingpage-page-menu-links">
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor sit</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-text">Lorem ipsum dolor</a></li>
          <li class="prismea-landingpage-page-menu-links-link"><a class="prismea-button -primary">Lorem ipsum</a></li>
        </ul>
      </div>
    </div>
  </nav>
</div>
nav.prismea-landingpage-page-menu.-fixed
  .prismea-landingpage-content-container
    .prismea-landingpage-page-menu-content
      a
        .prismea-landingpage-prismea-logo
          i.prismea-icon.-x4.prismea-landingpage-glyph-42_prismea_left.-color-primary
          i.prismea-icon.prismea-landingpage-glyph-18_prismea_text
      .prismea-landingpage-page-menu-buttons
        .prismea-landingpage-page-menu-button-open
          i.prismea-icon.prismea-landingpage-glyph-12_menu
        .prismea-landingpage-page-menu-button-close
          i.prismea-icon.prismea-landingpage-glyph-16_close
      ul.prismea-landingpage-page-menu-links
        li.prismea-landingpage-page-menu-links-link
          a.prismea-text Lorem ipsum
        li.prismea-landingpage-page-menu-links-link
          a.prismea-text Lorem ipsum dolor sit
        li.prismea-landingpage-page-menu-links-link
          a.prismea-text Lorem ipsum dolor
        li.prismea-landingpage-page-menu-links-link
          a.prismea-button.-primary Lorem ipsum
div(style='position: relative; top: 90px;')
  nav.prismea-landingpage-page-menu.-transparent
    .prismea-landingpage-content-container
      .prismea-landingpage-page-menu-content
        a
          .prismea-landingpage-prismea-logo
            i.prismea-icon.-x4.prismea-landingpage-glyph-42_prismea_left.-color-white
            i.prismea-icon.prismea-landingpage-glyph-18_prismea_text.-color-white
        .prismea-landingpage-page-menu-buttons
          .prismea-landingpage-page-menu-button-open
            i.prismea-icon.prismea-landingpage-glyph-12_menu
          .prismea-landingpage-page-menu-button-close
            i.prismea-icon.prismea-landingpage-glyph-16_close
        ul.prismea-landingpage-page-menu-links
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor sit
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor
          li.prismea-landingpage-page-menu-links-link
            a.prismea-button.-primary Lorem ipsum
div(style='position: relative; top: 180px;')
  nav.prismea-landingpage-page-menu.-transparent.-minified
    .prismea-landingpage-content-container
      .prismea-landingpage-page-menu-content
        a
          .prismea-landingpage-prismea-logo
            i.prismea-icon.-x4.prismea-landingpage-glyph-42_prismea_left.-color-white
            i.prismea-icon.prismea-landingpage-glyph-18_prismea_text.-color-white
        .prismea-landingpage-page-menu-buttons
          .prismea-landingpage-page-menu-button-open
            i.prismea-icon.prismea-landingpage-glyph-12_menu
          .prismea-landingpage-page-menu-button-close
            i.prismea-icon.prismea-landingpage-glyph-16_close
        ul.prismea-landingpage-page-menu-links
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor sit
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor
          li.prismea-landingpage-page-menu-links-link
            a.prismea-button.-primary Lorem ipsum
div(style='position: relative; top: 270px;')
  nav.prismea-landingpage-page-menu
    .prismea-landingpage-content-container
      .prismea-landingpage-page-menu-content
        a
          .prismea-landingpage-prismea-logo
            i.prismea-icon.-x4.prismea-landingpage-glyph-42_prismea_left.-color-primary
            i.prismea-icon.prismea-landingpage-glyph-18_prismea_text
        .prismea-landingpage-page-menu-buttons
          .prismea-landingpage-page-menu-button-search
            i.prismea-icon.prismea-landingpage-glyph-12_search.-color-grey5
          .prismea-landingpage-page-menu-button-open
            i.prismea-icon.prismea-landingpage-glyph-12_menu
          .prismea-landingpage-page-menu-button-close
            i.prismea-icon.prismea-landingpage-glyph-16_close
        ul.prismea-landingpage-page-menu-links
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor sit
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor
          li.prismea-landingpage-page-menu-links-link
            a.prismea-button.-primary Lorem ipsum
div(style='position: relative; top: 360px;')
  nav.prismea-landingpage-page-menu.-open
    .prismea-landingpage-content-container
      .prismea-landingpage-page-menu-content
        a
          .prismea-landingpage-prismea-logo
            i.prismea-icon.-x4.prismea-landingpage-glyph-42_prismea_left.-color-primary
            i.prismea-icon.prismea-landingpage-glyph-18_prismea_text
        .prismea-landingpage-page-menu-buttons
          .prismea-landingpage-page-menu-button-open
            i.prismea-icon.prismea-landingpage-glyph-12_menu
          .prismea-landingpage-page-menu-button-close
            i.prismea-icon.prismea-landingpage-glyph-16_close
        ul.prismea-landingpage-page-menu-links
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor sit
          li.prismea-landingpage-page-menu-links-link
            a.prismea-text Lorem ipsum dolor
          li.prismea-landingpage-page-menu-links-link
            a.prismea-button.-primary Lorem ipsum

User journey header

Used in user-journey templates.

<header class="prismea-landingpage-user-journey-header">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-30--slot -center prismea-landingpage-user-journey-header-title"><a class="prismea-landingpage-user-journey-header-previous-link"><i class="prismea-icon prismea-landingpage-glyph-12_arrow-left -color-white"></i></a>
      <h1 class="prismea-text -size-22 prismea-color -color-white">User journey header title</h1>
    </div>
    <div class="prismea-landingpage-stepper-header prismea-landingpage-content-container">
      <div class="prismea-vertical-spacing-5--slot">
        <p class="prismea-text -center prismea-color -color-white -text-bold">Step 2/4</p>
        <p class="prismea-text -center prismea-color -color-white">Step title</p>
      </div>
      <div class="prismea-vertical-spacing-5--slot">
        <div class="prismea-progress-bar -white-opacity-20">
          <div class="prismea-progress-bar--progression -white" style="width:50%;"></div>
        </div>
      </div>
    </div>
  </div>
</header>
header.prismea-landingpage-user-journey-header
  .prismea-landingpage-content-container
    .prismea-vertical-spacing-30--slot.-center.prismea-landingpage-user-journey-header-title
      a.prismea-landingpage-user-journey-header-previous-link
        i.prismea-icon.prismea-landingpage-glyph-12_arrow-left.-color-white
      h1.prismea-text.-size-22.prismea-color.-color-white User journey header title
    .prismea-landingpage-stepper-header.prismea-landingpage-content-container
      .prismea-vertical-spacing-5--slot
        p.prismea-text.-center.prismea-color.-color-white.-text-bold Step 2/4
        p.prismea-text.-center.prismea-color.-color-white Step title
      .prismea-vertical-spacing-5--slot
        .prismea-progress-bar.-white-opacity-20
          .prismea-progress-bar--progression.-white(style='width:50%;')

Button block

Can be displayed on homepage, editorial pages and user journey pages.

<div class="prismea-landingpage-block prismea-landingpage-block-button -grey1">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-landingpage-button-position -justify-middle">
      <a class="prismea-button -primary" href="#">Default button</a>
    </div>
  </div>
</div>
<div class="prismea-landingpage-block prismea-landingpage-block-button -grey1">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-landingpage-button-position -justify-middle">
      <a class="prismea-button -primary" href="#">Default button</a>
      <a class="prismea-button -primary -outlined" href="#">Outlined button</a>
    </div>
  </div>
</div>
.prismea-landingpage-block.prismea-landingpage-block-button.-grey1
  .prismea-landingpage-content-container
    .prismea-landingpage-button-position.-justify-middle
      a.prismea-button.-primary(href='#') Default button
.prismea-landingpage-block.prismea-landingpage-block-button.-grey1
  .prismea-landingpage-content-container
    .prismea-landingpage-button-position.-justify-middle
      a.prismea-button.-primary(href='#') Default button
      a.prismea-button.-primary.-outlined(href='#') Outlined button

Checklist Block

Can be displayed on homepage, editorial pages and user journey pages.

<div class="prismea-landingpage-block prismea-landingpage-block-checklist -grey1">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-landingpage-block-checklist-content">
      <div class="prismea-landingpage-block-checklist-head">
        <hr class="prismea-separator -secondary"/>
        <h2 class="prismea-text -montserrat prismea-color -color-secondary">
          Lorem
          ipsum dolor
          sit amet
        </h2>
        <hr class="prismea-separator -secondary"/>
      </div>
      <div class="prismea-landingpage-block-checklist-body">
        <ul class="prismea-landingpage-checklist -color-grey5 prismea-landingpage-block-checklist-column">
          <li class="prismea-text prismea-color">Lorem ipsum dolor sit amet consectetur</li>
          <li class="prismea-text prismea-color">Fusce blandit nunc libero</li>
          <li class="prismea-text prismea-color">Phasellus ac mi</li>
        </ul>
        <ul class="prismea-landingpage-checklist -color-grey5 prismea-landingpage-block-checklist-column">
          <li class="prismea-text prismea-color">Lorem ipsum dolor sit amet consectetur</li>
          <li class="prismea-text prismea-color">Fusce blandit nunc libero</li>
          <li class="prismea-text prismea-color">Phasellus ac mi</li>
        </ul>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-block.prismea-landingpage-block-checklist.-grey1
  .prismea-landingpage-content-container
    .prismea-landingpage-block-checklist-content
      .prismea-landingpage-block-checklist-head
        hr.prismea-separator.-secondary
        h2.prismea-text.-montserrat.prismea-color.-color-secondary.
          
          Lorem ipsum dolor sit amet
          
        hr.prismea-separator.-secondary
      .prismea-landingpage-block-checklist-body
        ul.prismea-landingpage-checklist.-color-grey5.prismea-landingpage-block-checklist-column
          li.prismea-text.prismea-color Lorem ipsum dolor sit amet consectetur
          li.prismea-text.prismea-color Fusce blandit nunc libero
          li.prismea-text.prismea-color Phasellus ac mi
        ul.prismea-landingpage-checklist.-color-grey5.prismea-landingpage-block-checklist-column
          li.prismea-text.prismea-color Lorem ipsum dolor sit amet consectetur
          li.prismea-text.prismea-color Fusce blandit nunc libero
          li.prismea-text.prismea-color Phasellus ac mi

Features Block

Can be displayed on homepage, editorial pages and user journey pages. May not have content to make a simple parallax image

<div class="prismea-landingpage-block-features" style="background-image: url(https://placeimg.com/1920/800/animals)">
</div>
<div style="height: 20px"></div>
<div class="prismea-landingpage-block-features" style="background-image: url(https://placeimg.com/1920/800/animals)">
  <div class="prismea-landingpage-content-container">
    <h2 class="prismea-title-2 prismea-color -color-white -text-multiline">Lorem ipsum dolor 
sit amet</h2>
    <div class="prismea-landingpage-block-features-list prismea-vertical-spacing-70--slot">
      <div class="prismea-landingpage-block-features-list-item">
        <div class="prismea-landingpage-block-features-list-item-header"><i class="prismea-icon prismea-landingpage-glyph-42_layer_left -color-white"></i>
        </div>
        <div class="prismea-landingpage-block-features-list-item-body prismea-vertical-spacing-15--slot">
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text -text-medium -size-18">Lorem ipsum</p>
          </div>
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.</p>
          </div>
        </div>
      </div>
      <div class="prismea-landingpage-block-features-list-item">
        <div class="prismea-landingpage-block-features-list-item-header"><i class="prismea-icon prismea-landingpage-glyph-42_layer_left -color-white"></i><span class="prismea-landingpage-badge prismea-text -size-10 -text-bold -uppercase -secondary">Lorem ipsum dolor</span>
        </div>
        <div class="prismea-landingpage-block-features-list-item-body prismea-vertical-spacing-15--slot">
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text -text-medium -size-18">Lorem ipsum</p>
          </div>
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.</p>
          </div>
        </div>
      </div>
      <div class="prismea-landingpage-block-features-list-item">
        <div class="prismea-landingpage-block-features-list-item-header"><i class="prismea-icon prismea-landingpage-glyph-42_layer_left -color-white"></i>
        </div>
        <div class="prismea-landingpage-block-features-list-item-body prismea-vertical-spacing-15--slot">
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text -text-medium -size-18">Lorem ipsum</p>
          </div>
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.</p>
          </div>
        </div>
      </div>
      <div class="prismea-landingpage-block-features-list-item">
        <div class="prismea-landingpage-block-features-list-item-header"><i class="prismea-icon prismea-landingpage-glyph-42_layer_left -color-white"></i><span class="prismea-landingpage-badge prismea-text -size-10 -text-bold -uppercase -secondary">Lorem ipsum dolor</span>
        </div>
        <div class="prismea-landingpage-block-features-list-item-body prismea-vertical-spacing-15--slot">
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text -text-medium -size-18">Lorem ipsum</p>
          </div>
          <div class="prismea-vertical-spacing-15--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-block-features(style='background-image: url(https://placeimg.com/1920/800/animals)').
  
  
div(style='height: 20px')
.prismea-landingpage-block-features(style='background-image: url(https://placeimg.com/1920/800/animals)')
  .prismea-landingpage-content-container
    h2.prismea-title-2.prismea-color.-color-white.-text-multiline Lorem ipsum dolor sit amet
    .prismea-landingpage-block-features-list.prismea-vertical-spacing-70--slot
      .prismea-landingpage-block-features-list-item
        .prismea-landingpage-block-features-list-item-header
          i.prismea-icon.prismea-landingpage-glyph-42_layer_left.-color-white
        .prismea-landingpage-block-features-list-item-body.prismea-vertical-spacing-15--slot
          .prismea-vertical-spacing-15--slot
            p.prismea-text.-text-medium.-size-18 Lorem ipsum
          .prismea-vertical-spacing-15--slot
            p.prismea-text Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.
      .prismea-landingpage-block-features-list-item
        .prismea-landingpage-block-features-list-item-header
          i.prismea-icon.prismea-landingpage-glyph-42_layer_left.-color-white
          span.prismea-landingpage-badge.prismea-text.-size-10.-text-bold.-uppercase.-secondary Lorem ipsum dolor
        .prismea-landingpage-block-features-list-item-body.prismea-vertical-spacing-15--slot
          .prismea-vertical-spacing-15--slot
            p.prismea-text.-text-medium.-size-18 Lorem ipsum
          .prismea-vertical-spacing-15--slot
            p.prismea-text Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.
      .prismea-landingpage-block-features-list-item
        .prismea-landingpage-block-features-list-item-header
          i.prismea-icon.prismea-landingpage-glyph-42_layer_left.-color-white
        .prismea-landingpage-block-features-list-item-body.prismea-vertical-spacing-15--slot
          .prismea-vertical-spacing-15--slot
            p.prismea-text.-text-medium.-size-18 Lorem ipsum
          .prismea-vertical-spacing-15--slot
            p.prismea-text Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.
      .prismea-landingpage-block-features-list-item
        .prismea-landingpage-block-features-list-item-header
          i.prismea-icon.prismea-landingpage-glyph-42_layer_left.-color-white
          span.prismea-landingpage-badge.prismea-text.-size-10.-text-bold.-uppercase.-secondary Lorem ipsum dolor
        .prismea-landingpage-block-features-list-item-body.prismea-vertical-spacing-15--slot
          .prismea-vertical-spacing-15--slot
            p.prismea-text.-text-medium.-size-18 Lorem ipsum
          .prismea-vertical-spacing-15--slot
            p.prismea-text Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro cum repellat totam reiciendis fugiat cumque.

Can be displayed on the top of the editorial pages.

<header class="prismea-landingpage-header"><img class="prismea-landingpage-header-image" src="https://placeimg.com/1000/400/animals"/>
  <div class="prismea-landingpage-header-content prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-30--slot prismea-landingpage-header-title">
      <h1 class="prismea-title-1 prismea-color -color-white">Lorem ipsum dolor sit amet consectetur adipisicing elit</h1>
    </div>
    <div class="prismea-vertical-spacing-30--slot">
      <div class="prismea-landingpage-button-position -justify-start">
        <a class="prismea-button -transparent" href="#">Lorem ipsum</a>
      </div>
    </div>
    <div class="prismea-vertical-spacing-65--slot prismea-landingpage-header-label">
      <p class="prismea-text prismea-color -color-white">Lorem ipsum</p><img src="../../../images/credit-du-nord.png"/>
    </div>
  </div>
</header>
header.prismea-landingpage-header
  img.prismea-landingpage-header-image(src='https://placeimg.com/1000/400/animals')
  .prismea-landingpage-header-content.prismea-landingpage-content-container
    .prismea-vertical-spacing-30--slot.prismea-landingpage-header-title
      h1.prismea-title-1.prismea-color.-color-white Lorem ipsum dolor sit amet consectetur adipisicing elit
    .prismea-vertical-spacing-30--slot
      .prismea-landingpage-button-position.-justify-start
        a.prismea-button.-transparent(href='#') Lorem ipsum
    .prismea-vertical-spacing-65--slot.prismea-landingpage-header-label
      p.prismea-text.prismea-color.-color-white Lorem ipsum
      img(src='../../../images/credit-du-nord.png')

Horizontal Items block

You can add the -header class at the bottom of the homepage header.

<div class="prismea-landingpage-block-horizontal-items -grey2">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-20--slot">
      <p class="prismea-text -montserrat -size-18">Lorem ipsum dolor sit amet</p>
    </div>
    <div class="prismea-vertical-spacing-20--slot">
      <hr class="prismea-separator -primary"/>
    </div>
    <div class="prismea-vertical-spacing-30--slot prismea-landingpage-block-horizontal-items-body">
      <div class="prismea-landingpage-block-horizontal-items-item -border-primary"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-primary"></i>
        <p class="prismea-text prismea-color -color-grey5">Lorem ipsum dolor sit amet consectetur</p>
      </div>
      <div class="prismea-landingpage-block-horizontal-items-item -border-primary"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-primary"></i>
        <p class="prismea-text prismea-color -color-grey5">Lorem ipsum dolor sit amet consectetur</p>
      </div>
      <div class="prismea-landingpage-block-horizontal-items-item -border-primary"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-primary"></i>
        <p class="prismea-text prismea-color -color-grey5">Lorem ipsum dolor sit amet consectetur</p>
      </div>
    </div>
  </div>
</div>
<div class="prismea-landingpage-block-horizontal-items -grey2">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-30--slot prismea-landingpage-block-horizontal-items-body">
      <div class="prismea-landingpage-block-horizontal-items-item -column -border-primary"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-primary"></i>
        <p class="prismea-text -text-bold -size-18 prismea-color -color-grey5">Lorem ipsum</p>
        <p class="prismea-text prismea-color -color-grey5">Lorem ipsum dolor sit amet consectetur</p>
      </div>
      <div class="prismea-landingpage-block-horizontal-items-item -column -border-primary"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-primary"></i>
        <p class="prismea-text -text-bold -size-18 prismea-color -color-grey5">Lorem ipsum</p>
        <p class="prismea-text prismea-color -color-grey5">Lorem ipsum dolor sit amet consectetur</p>
      </div>
      <div class="prismea-landingpage-block-horizontal-items-item -column -border-primary"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-primary"></i>
        <p class="prismea-text -text-bold -size-18 prismea-color -color-grey5">Lorem ipsum</p>
        <p class="prismea-text prismea-color -color-grey5">Lorem ipsum dolor sit amet consectetur</p>
      </div>
    </div>
  </div>
</div>
<div style="background-color: #000000; height: 100px;"></div>
<div class="prismea-landingpage-block-horizontal-items -header -primary">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-30--slot prismea-landingpage-block-horizontal-items-body">
      <div class="prismea-landingpage-block-horizontal-items-item -separator -border-white"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-white"></i>
        <p class="prismea-text prismea-color -color-white">Lorem ipsum dolor sit amet consectetur</p>
      </div>
      <div class="prismea-landingpage-block-horizontal-items-item -separator -border-white"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-white"></i>
        <p class="prismea-text prismea-color -color-white">Lorem ipsum dolor sit amet consectetur</p>
      </div>
      <div class="prismea-landingpage-block-horizontal-items-item -separator -border-white"><i class="prismea-icon prismea-landingpage-glyph-42_chronometer -color-white"></i>
        <p class="prismea-text prismea-color -color-white">Lorem ipsum dolor sit amet consectetur</p>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-block-horizontal-items.-grey2
  .prismea-landingpage-content-container
    .prismea-vertical-spacing-20--slot
      p.prismea-text.-montserrat.-size-18 Lorem ipsum dolor sit amet
    .prismea-vertical-spacing-20--slot
      hr.prismea-separator.-primary
    .prismea-vertical-spacing-30--slot.prismea-landingpage-block-horizontal-items-body
      .prismea-landingpage-block-horizontal-items-item.-border-primary
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-primary
        p.prismea-text.prismea-color.-color-grey5 Lorem ipsum dolor sit amet consectetur
      .prismea-landingpage-block-horizontal-items-item.-border-primary
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-primary
        p.prismea-text.prismea-color.-color-grey5 Lorem ipsum dolor sit amet consectetur
      .prismea-landingpage-block-horizontal-items-item.-border-primary
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-primary
        p.prismea-text.prismea-color.-color-grey5 Lorem ipsum dolor sit amet consectetur
.prismea-landingpage-block-horizontal-items.-grey2
  .prismea-landingpage-content-container
    .prismea-vertical-spacing-30--slot.prismea-landingpage-block-horizontal-items-body
      .prismea-landingpage-block-horizontal-items-item.-column.-border-primary
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-primary
        p.prismea-text.-text-bold.-size-18.prismea-color.-color-grey5 Lorem ipsum
        p.prismea-text.prismea-color.-color-grey5 Lorem ipsum dolor sit amet consectetur
      .prismea-landingpage-block-horizontal-items-item.-column.-border-primary
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-primary
        p.prismea-text.-text-bold.-size-18.prismea-color.-color-grey5 Lorem ipsum
        p.prismea-text.prismea-color.-color-grey5 Lorem ipsum dolor sit amet consectetur
      .prismea-landingpage-block-horizontal-items-item.-column.-border-primary
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-primary
        p.prismea-text.-text-bold.-size-18.prismea-color.-color-grey5 Lorem ipsum
        p.prismea-text.prismea-color.-color-grey5 Lorem ipsum dolor sit amet consectetur
div(style='background-color: #000000; height: 100px;')
.prismea-landingpage-block-horizontal-items.-header.-primary
  .prismea-landingpage-content-container
    .prismea-vertical-spacing-30--slot.prismea-landingpage-block-horizontal-items-body
      .prismea-landingpage-block-horizontal-items-item.-separator.-border-white
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-white
        p.prismea-text.prismea-color.-color-white Lorem ipsum dolor sit amet consectetur
      .prismea-landingpage-block-horizontal-items-item.-separator.-border-white
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-white
        p.prismea-text.prismea-color.-color-white Lorem ipsum dolor sit amet consectetur
      .prismea-landingpage-block-horizontal-items-item.-separator.-border-white
        i.prismea-icon.prismea-landingpage-glyph-42_chronometer.-color-white
        p.prismea-text.prismea-color.-color-white Lorem ipsum dolor sit amet consectetur

Image + Text Block

You can use the following variants :

  • Title : customize Block Title
  • Buttons : customize Buttons group
  • Wysiwyg : automatic formatting with HTML5 tags, and use -left, -center or -right for alignement
  • Background : -primary, -secondary, -grey1, -grey2, -grey3, -grey4, -grey5
  • Image : -justify-end to put the image on the right and-reverse to put the image on the left
<div class="prismea-landingpage-block prismea-landingpage-block-image-text">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-horizontal-spacing-90 -middle -reverse">
      <div class="prismea-horizontal-spacing-90--slot -expand">
        <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -left">
          <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_floor_left -color-primary"></i>
          </div>
          <div class="prismea-vertical-spacing-10--slot">
            <p class="prismea-text -uppercase prismea-color -color-grey5">In gravida diam eu felis pharetra</p>
          </div>
          <div class="prismea-vertical-spacing-10--slot">
            <h2 class="prismea-title-2">Lorem ipsum dolor sit amet</h2>
          </div>
        </div>
        <div class="prismea-landingpage-wysiwyg prismea-vertical-spacing-30 -left">
          <div class="prismea-vertical-spacing-30--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)</p>
          </div>
          <div class="prismea-vertical-spacing-30--slot">
            <ul class="prismea-list-item">
              <li class="prismea-text"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong> In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
              </li>
              <li class="prismea-text"><strong>Fusce blandit nunc libero, in ultricies massa faucibus nec.</strong> Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.
              </li>
            </ul>
          </div>
        </div>
        <div class="prismea-vertical-spacing-40--slot">
          <div class="prismea-landingpage-button-position -justify-start">
            <a class="prismea-button -primary -outlined" href="#">Button</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-90--slot -expand -flex"><img src="https://placeimg.com/410/470/animals"/></div>
    </div>
  </div>
</div>
<div class="prismea-landingpage-block prismea-landingpage-block-image-text -primary">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-horizontal-spacing-90 -middle -reverse">
      <div class="prismea-horizontal-spacing-90--slot -expand">
        <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -center">
          <div class="prismea-vertical-spacing-10--slot">
            <h2 class="prismea-title-2 prismea-color -color-white -text-multiline">Lorem ipsum dolor sit amet</h2>
          </div>
          <div class="prismea-vertical-spacing-15--slot">
            <hr class="prismea-separator -white -center -small"/>
          </div>
          <div class="prismea-vertical-spacing-10--slot">
            <p class="prismea-text -size-18 prismea-color -color-white">In gravida diam eu felis pharetra, eget iaculis mauris finibus.</p>
          </div>
        </div>
        <div class="prismea-landingpage-wysiwyg prismea-vertical-spacing-30 -center -white">
          <div class="prismea-vertical-spacing-30--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)</p>
          </div>
          <div class="prismea-vertical-spacing-30--slot">
            <ul class="prismea-list-item">
              <li class="prismea-text"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong> In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
              </li>
              <li class="prismea-text"><strong>Fusce blandit nunc libero, in ultricies massa faucibus nec.</strong> Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.
              </li>
            </ul>
          </div>
        </div>
        <div class="prismea-vertical-spacing-40--slot">
          <div class="prismea-landingpage-button-position -justify-middle">
            <a class="prismea-button -transparent" href="#">Button</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-90--slot -expand -flex"><img src="https://placeimg.com/410/470/animals"/></div>
    </div>
  </div>
</div>
<div class="prismea-landingpage-block prismea-landingpage-block-image-text">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-horizontal-spacing-90 -middle">
      <div class="prismea-horizontal-spacing-90--slot -expand">
        <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -vertical-separator -left">
          <div class="prismea-vertical-spacing-10--slot">
            <h2 class="prismea-title-2">Lorem ipsum dolor sit amet</h2>
          </div>
          <div class="prismea-vertical-spacing-10--slot">
            <p class="prismea-text -size-18">In gravida diam eu felis pharetra, eget iaculis mauris finibus.</p>
          </div>
        </div>
        <div class="prismea-landingpage-wysiwyg prismea-vertical-spacing-30 -left">
          <div class="prismea-vertical-spacing-30--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)</p>
          </div>
          <div class="prismea-vertical-spacing-30--slot">
            <ul class="prismea-list-item">
              <li class="prismea-text"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong> In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
              </li>
              <li class="prismea-text"><strong>Fusce blandit nunc libero, in ultricies massa faucibus nec.</strong> Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.
              </li>
            </ul>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-90--slot -expand -flex -justify-end"><img src="https://placeimg.com/410/470/animals"/></div>
    </div>
  </div>
</div>
<div class="prismea-landingpage-block prismea-landingpage-block-image-text">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-horizontal-spacing-90 -middle">
      <div class="prismea-horizontal-spacing-90--slot -expand">
        <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -vertical-separator -right">
          <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_floor_right -color-secondary"></i>
          </div>
          <div class="prismea-vertical-spacing-10--slot">
            <h2 class="prismea-title-2 prismea-color -color-primary -text-multiline">Lorem ipsum dolor sit amet</h2>
          </div>
        </div>
        <div class="prismea-landingpage-wysiwyg prismea-vertical-spacing-30 -right">
          <div class="prismea-vertical-spacing-30--slot">
            <p class="prismea-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)</p>
          </div>
          <div class="prismea-vertical-spacing-30--slot">
            <ul class="prismea-list-item">
              <li class="prismea-text"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong> In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
              </li>
              <li class="prismea-text"><strong>Fusce blandit nunc libero, in ultricies massa faucibus nec.</strong> Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.
              </li>
            </ul>
          </div>
        </div>
        <div class="prismea-vertical-spacing-40--slot">
          <div class="prismea-landingpage-button-position -justify-end">
            <a class="prismea-button -primary" href="#">Button</a>
            <a class="prismea-button -primary -outlined" href="#">Button</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-90--slot -expand -flex -justify-end"><img src="https://placeimg.com/410/470/animals"/></div>
    </div>
  </div>
</div>
.prismea-landingpage-block.prismea-landingpage-block-image-text
  .prismea-landingpage-content-container
    .prismea-horizontal-spacing-90.-middle.-reverse
      .prismea-horizontal-spacing-90--slot.-expand
        .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-left
          .prismea-vertical-spacing-10--slot
            i.prismea-icon.prismea-landingpage-glyph-42_symbol_floor_left.-color-primary
          .prismea-vertical-spacing-10--slot
            p.prismea-text.-uppercase.prismea-color.-color-grey5 In gravida diam eu felis pharetra
          .prismea-vertical-spacing-10--slot
            h2.prismea-title-2 Lorem ipsum dolor sit amet
        .prismea-landingpage-wysiwyg.prismea-vertical-spacing-30.-left
          .prismea-vertical-spacing-30--slot
            p.prismea-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)
          .prismea-vertical-spacing-30--slot
            ul.prismea-list-item
              li.prismea-text
                strong Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                |  In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

              li.prismea-text
                strong Fusce blandit nunc libero, in ultricies massa faucibus nec.
                |  Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.

        .prismea-vertical-spacing-40--slot
          .prismea-landingpage-button-position.-justify-start
            a.prismea-button.-primary.-outlined(href='#') Button
      .prismea-horizontal-spacing-90--slot.-expand.-flex
        img(src='https://placeimg.com/410/470/animals')
.prismea-landingpage-block.prismea-landingpage-block-image-text.-primary
  .prismea-landingpage-content-container
    .prismea-horizontal-spacing-90.-middle.-reverse
      .prismea-horizontal-spacing-90--slot.-expand
        .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-center
          .prismea-vertical-spacing-10--slot
            h2.prismea-title-2.prismea-color.-color-white.-text-multiline Lorem ipsum dolor sit amet
          .prismea-vertical-spacing-15--slot
            hr.prismea-separator.-white.-center.-small
          .prismea-vertical-spacing-10--slot
            p.prismea-text.-size-18.prismea-color.-color-white In gravida diam eu felis pharetra, eget iaculis mauris finibus.
        .prismea-landingpage-wysiwyg.prismea-vertical-spacing-30.-center.-white
          .prismea-vertical-spacing-30--slot
            p.prismea-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)
          .prismea-vertical-spacing-30--slot
            ul.prismea-list-item
              li.prismea-text
                strong Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                |  In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

              li.prismea-text
                strong Fusce blandit nunc libero, in ultricies massa faucibus nec.
                |  Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.

        .prismea-vertical-spacing-40--slot
          .prismea-landingpage-button-position.-justify-middle
            a.prismea-button.-transparent(href='#') Button
      .prismea-horizontal-spacing-90--slot.-expand.-flex
        img(src='https://placeimg.com/410/470/animals')
.prismea-landingpage-block.prismea-landingpage-block-image-text
  .prismea-landingpage-content-container
    .prismea-horizontal-spacing-90.-middle
      .prismea-horizontal-spacing-90--slot.-expand
        .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-vertical-separator.-left
          .prismea-vertical-spacing-10--slot
            h2.prismea-title-2 Lorem ipsum dolor sit amet
          .prismea-vertical-spacing-10--slot
            p.prismea-text.-size-18 In gravida diam eu felis pharetra, eget iaculis mauris finibus.
        .prismea-landingpage-wysiwyg.prismea-vertical-spacing-30.-left
          .prismea-vertical-spacing-30--slot
            p.prismea-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)
          .prismea-vertical-spacing-30--slot
            ul.prismea-list-item
              li.prismea-text
                strong Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                |  In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

              li.prismea-text
                strong Fusce blandit nunc libero, in ultricies massa faucibus nec.
                |  Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.

      .prismea-horizontal-spacing-90--slot.-expand.-flex.-justify-end
        img(src='https://placeimg.com/410/470/animals')
.prismea-landingpage-block.prismea-landingpage-block-image-text
  .prismea-landingpage-content-container
    .prismea-horizontal-spacing-90.-middle
      .prismea-horizontal-spacing-90--slot.-expand
        .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-vertical-separator.-right
          .prismea-vertical-spacing-10--slot
            i.prismea-icon.prismea-landingpage-glyph-42_symbol_floor_right.-color-secondary
          .prismea-vertical-spacing-10--slot
            h2.prismea-title-2.prismea-color.-color-primary.-text-multiline Lorem ipsum dolor sit amet
        .prismea-landingpage-wysiwyg.prismea-vertical-spacing-30.-right
          .prismea-vertical-spacing-30--slot
            p.prismea-text Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (16px)
          .prismea-vertical-spacing-30--slot
            ul.prismea-list-item
              li.prismea-text
                strong Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                |  In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

              li.prismea-text
                strong Fusce blandit nunc libero, in ultricies massa faucibus nec.
                |  Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.

        .prismea-vertical-spacing-40--slot
          .prismea-landingpage-button-position.-justify-end
            a.prismea-button.-primary(href='#') Button
            a.prismea-button.-primary.-outlined(href='#') Button
      .prismea-horizontal-spacing-90--slot.-expand.-flex.-justify-end
        img(src='https://placeimg.com/410/470/animals')

Rating Block

Can be displayed on homepage, editorial pages and user journey pages.

<div class="prismea-landingpage-block prismea-landingpage-block-rating">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-landingpage-block-rating-body">
      <div class="prismea-landingpage-block-rating-title">
        <p class="prismea-text -uppercase -size-14 prismea-color -color-grey5">In gravida diam</p>
        <h2 class="prismea-title-2">Lorem ipsum dolor sit amet</h2>
      </div>
      <div class="prismea-landingpage-block-rating-content">
        <div class="prismea-landingpage-block-rating-content-store">
          <p class="prismea-text -montserrat -size-22"><span class="prismea-text -size-36 prismea-color -color-primary">4.8</span>/5</p>
          <div class="prismea-landingpage-block-rating-content-store-stars">
            <div class="prismea-landingpage-block-rating-content-store-stars--off">★★★★★</div>
            <div class="prismea-landingpage-block-rating-content-store-stars--on" style="width: 96%">★★★★★</div>
          </div>
          <div class="prismea-landingpage-block-rating-content-store-name prismea-vertical-spacing-15--slot"><i class="prismea-icon prismea-landingpage-glyph-32_app_store -color-grey6"></i><span class="prismea-text -size-14">App Store</span>
          </div>
        </div>
        <div class="prismea-landingpage-block-rating-content-store">
          <p class="prismea-text -montserrat -size-22"><span class="prismea-text -size-36 prismea-color -color-primary">4.4</span>/5</p>
          <div class="prismea-landingpage-block-rating-content-store-stars">
            <div class="prismea-landingpage-block-rating-content-store-stars--off">★★★★★</div>
            <div class="prismea-landingpage-block-rating-content-store-stars--on" style="width: 88.00000000000001%">★★★★★</div>
          </div>
          <div class="prismea-landingpage-block-rating-content-store-name prismea-vertical-spacing-15--slot"><i class="prismea-icon prismea-landingpage-glyph-32_google_play -color-grey6"></i><span class="prismea-text -size-14">Google Play</span>
          </div>
        </div>
      </div>
    </div>
    <div class="prismea-vertical-spacing-25--slot">
      <hr class="prismea-separator -large"/>
    </div>
  </div>
</div>
.prismea-landingpage-block.prismea-landingpage-block-rating
  .prismea-landingpage-content-container
    .prismea-landingpage-block-rating-body
      .prismea-landingpage-block-rating-title
        p.prismea-text.-uppercase.-size-14.prismea-color.-color-grey5 In gravida diam
        h2.prismea-title-2 Lorem ipsum dolor sit amet
      .prismea-landingpage-block-rating-content
        .prismea-landingpage-block-rating-content-store
          p.prismea-text.-montserrat.-size-22
            span.prismea-text.-size-36.prismea-color.-color-primary 4.8
            | /5
          .prismea-landingpage-block-rating-content-store-stars
            .prismea-landingpage-block-rating-content-store-stars--off ★★★★★
            .prismea-landingpage-block-rating-content-store-stars--on(style='width: 96%') ★★★★★
          .prismea-landingpage-block-rating-content-store-name.prismea-vertical-spacing-15--slot
            i.prismea-icon.prismea-landingpage-glyph-32_app_store.-color-grey6
            span.prismea-text.-size-14 App Store
        .prismea-landingpage-block-rating-content-store
          p.prismea-text.-montserrat.-size-22
            span.prismea-text.-size-36.prismea-color.-color-primary 4.4
            | /5
          .prismea-landingpage-block-rating-content-store-stars
            .prismea-landingpage-block-rating-content-store-stars--off ★★★★★
            .prismea-landingpage-block-rating-content-store-stars--on(style='width: 88.00000000000001%') ★★★★★
          .prismea-landingpage-block-rating-content-store-name.prismea-vertical-spacing-15--slot
            i.prismea-icon.prismea-landingpage-glyph-32_google_play.-color-grey6
            span.prismea-text.-size-14 Google Play
    .prismea-vertical-spacing-25--slot
      hr.prismea-separator.-large

Simple Block

You can use the following variants :

  • Title : customize Block Title
  • Buttons : customize Buttons group
  • Wysiwyg : automatic formatting with HTML5 tags, and use -left, -center or -right for alignement
  • Background : -primary, -secondary, -grey1, -grey2, -grey3, -grey4, -grey5
<div class="prismea-landingpage-block prismea-landingpage-block-simple">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -left">
      <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_floor_left -color-primary"></i>
      </div>
      <div class="prismea-vertical-spacing-10--slot">
        <p class="prismea-text -uppercase prismea-color -color-grey5">In gravida diam eu felis pharetra</p>
      </div>
      <div class="prismea-vertical-spacing-10--slot">
        <h2 class="prismea-title-2">Lorem ipsum dolor sit amet</h2>
      </div>
    </div>
    <div class="prismea-landingpage-wysiwyg prismea-vertical-spacing-30 -left">
      <div class="prismea-vertical-spacing-30--slot">
        <p class="prismea-text"><span class="prismea-landingpage-wysiwyg--prefix-title">Paragraph Title</span><br/>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque bibendum cursus ipsum</strong>, dictum consequat ipsum tempus quis. <em>Nulla suscipit gravida ultricies.</em> Ut nec felis at <a href="#">sapien condimentum</a> faucibus. Pellentesque tempus nec est eu iaculis.</p>
      </div>
      <div class="prismea-vertical-spacing-30--slot">
        <ul class="prismea-list-item">
          <li class="prismea-text"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong> In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
          </li>
          <li class="prismea-text"><strong>Fusce blandit nunc libero, in ultricies massa faucibus nec.</strong> Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.
          </li>
        </ul>
      </div>
    </div>
    <div class="prismea-vertical-spacing-40--slot">
      <div class="prismea-landingpage-button-position -justify-start">
        <a class="prismea-button -primary -outlined" href="#">Button</a>
      </div>
    </div>
  </div>
</div>
<div class="prismea-landingpage-block prismea-landingpage-block-simple -primary">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -center">
      <div class="prismea-vertical-spacing-10--slot">
        <h2 class="prismea-title-2 prismea-color -color-white -text-multiline">Lorem ipsum dolor sit amet</h2>
      </div>
      <div class="prismea-vertical-spacing-15--slot">
        <hr class="prismea-separator -white -center -small"/>
      </div>
      <div class="prismea-vertical-spacing-10--slot">
        <p class="prismea-text -size-18 prismea-color -color-white">In gravida diam eu felis pharetra, eget iaculis mauris finibus.</p>
      </div>
    </div>
    <div class="prismea-landingpage-wysiwyg prismea-vertical-spacing-30 -center -white">
      <div class="prismea-vertical-spacing-30--slot">
        <p class="prismea-text"><span class="prismea-landingpage-wysiwyg--prefix-title">Paragraph Title</span><br/>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque bibendum cursus ipsum</strong>, dictum consequat ipsum tempus quis. <em>Nulla suscipit gravida ultricies.</em> Ut nec felis at <a href="#">sapien condimentum</a> faucibus. Pellentesque tempus nec est eu iaculis.</p>
      </div>
      <div class="prismea-vertical-spacing-30--slot">
        <ul class="prismea-list-item">
          <li class="prismea-text"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong> In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
          </li>
          <li class="prismea-text"><strong>Fusce blandit nunc libero, in ultricies massa faucibus nec.</strong> Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.
          </li>
        </ul>
      </div>
    </div>
    <div class="prismea-vertical-spacing-40--slot">
      <div class="prismea-landingpage-button-position -justify-middle">
        <a class="prismea-button -transparent" href="#">Button</a>
      </div>
    </div>
  </div>
</div>
<div class="prismea-landingpage-block prismea-landingpage-block-simple">
  <div class="prismea-landingpage-content-container">
    <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -vertical-separator -right">
      <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_floor_right -color-secondary"></i>
      </div>
      <div class="prismea-vertical-spacing-10--slot">
        <h2 class="prismea-title-2 prismea-color -color-primary -text-multiline">Lorem ipsum dolor sit amet</h2>
      </div>
    </div>
    <div class="prismea-landingpage-wysiwyg prismea-vertical-spacing-30 -right">
      <div class="prismea-vertical-spacing-30--slot">
        <p class="prismea-text"><span class="prismea-landingpage-wysiwyg--prefix-title">Paragraph Title</span><br/>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque bibendum cursus ipsum</strong>, dictum consequat ipsum tempus quis. <em>Nulla suscipit gravida ultricies.</em> Ut nec felis at <a href="#">sapien condimentum</a> faucibus. Pellentesque tempus nec est eu iaculis.</p>
      </div>
      <div class="prismea-vertical-spacing-30--slot">
        <ul class="prismea-list-item">
          <li class="prismea-text"><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong> In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
          </li>
          <li class="prismea-text"><strong>Fusce blandit nunc libero, in ultricies massa faucibus nec.</strong> Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.
          </li>
        </ul>
      </div>
    </div>
    <div class="prismea-vertical-spacing-40--slot">
      <div class="prismea-landingpage-button-position -justify-end">
        <a class="prismea-button -primary" href="#">Button</a>
        <a class="prismea-button -primary -outlined" href="#">Button</a>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-block.prismea-landingpage-block-simple
  .prismea-landingpage-content-container
    .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-left
      .prismea-vertical-spacing-10--slot
        i.prismea-icon.prismea-landingpage-glyph-42_symbol_floor_left.-color-primary
      .prismea-vertical-spacing-10--slot
        p.prismea-text.-uppercase.prismea-color.-color-grey5 In gravida diam eu felis pharetra
      .prismea-vertical-spacing-10--slot
        h2.prismea-title-2 Lorem ipsum dolor sit amet
    .prismea-landingpage-wysiwyg.prismea-vertical-spacing-30.-left
      .prismea-vertical-spacing-30--slot
        p.prismea-text
          span.prismea-landingpage-wysiwyg--prefix-title Paragraph Title
          br
          | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
          strong Pellentesque bibendum cursus ipsum
          | , dictum consequat ipsum tempus quis. 
          em Nulla suscipit gravida ultricies.
          |  Ut nec felis at 
          a(href='#') sapien condimentum
          |  faucibus. Pellentesque tempus nec est eu iaculis.
      .prismea-vertical-spacing-30--slot
        ul.prismea-list-item
          li.prismea-text
            strong Lorem ipsum dolor sit amet, consectetur adipiscing elit.
            |  In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

          li.prismea-text
            strong Fusce blandit nunc libero, in ultricies massa faucibus nec.
            |  Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.

    .prismea-vertical-spacing-40--slot
      .prismea-landingpage-button-position.-justify-start
        a.prismea-button.-primary.-outlined(href='#') Button
.prismea-landingpage-block.prismea-landingpage-block-simple.-primary
  .prismea-landingpage-content-container
    .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-center
      .prismea-vertical-spacing-10--slot
        h2.prismea-title-2.prismea-color.-color-white.-text-multiline Lorem ipsum dolor sit amet
      .prismea-vertical-spacing-15--slot
        hr.prismea-separator.-white.-center.-small
      .prismea-vertical-spacing-10--slot
        p.prismea-text.-size-18.prismea-color.-color-white In gravida diam eu felis pharetra, eget iaculis mauris finibus.
    .prismea-landingpage-wysiwyg.prismea-vertical-spacing-30.-center.-white
      .prismea-vertical-spacing-30--slot
        p.prismea-text
          span.prismea-landingpage-wysiwyg--prefix-title Paragraph Title
          br
          | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
          strong Pellentesque bibendum cursus ipsum
          | , dictum consequat ipsum tempus quis. 
          em Nulla suscipit gravida ultricies.
          |  Ut nec felis at 
          a(href='#') sapien condimentum
          |  faucibus. Pellentesque tempus nec est eu iaculis.
      .prismea-vertical-spacing-30--slot
        ul.prismea-list-item
          li.prismea-text
            strong Lorem ipsum dolor sit amet, consectetur adipiscing elit.
            |  In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

          li.prismea-text
            strong Fusce blandit nunc libero, in ultricies massa faucibus nec.
            |  Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.

    .prismea-vertical-spacing-40--slot
      .prismea-landingpage-button-position.-justify-middle
        a.prismea-button.-transparent(href='#') Button
.prismea-landingpage-block.prismea-landingpage-block-simple
  .prismea-landingpage-content-container
    .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-vertical-separator.-right
      .prismea-vertical-spacing-10--slot
        i.prismea-icon.prismea-landingpage-glyph-42_symbol_floor_right.-color-secondary
      .prismea-vertical-spacing-10--slot
        h2.prismea-title-2.prismea-color.-color-primary.-text-multiline Lorem ipsum dolor sit amet
    .prismea-landingpage-wysiwyg.prismea-vertical-spacing-30.-right
      .prismea-vertical-spacing-30--slot
        p.prismea-text
          span.prismea-landingpage-wysiwyg--prefix-title Paragraph Title
          br
          | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
          strong Pellentesque bibendum cursus ipsum
          | , dictum consequat ipsum tempus quis. 
          em Nulla suscipit gravida ultricies.
          |  Ut nec felis at 
          a(href='#') sapien condimentum
          |  faucibus. Pellentesque tempus nec est eu iaculis.
      .prismea-vertical-spacing-30--slot
        ul.prismea-list-item
          li.prismea-text
            strong Lorem ipsum dolor sit amet, consectetur adipiscing elit.
            |  In quis egestas ex, ut vehicula felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

          li.prismea-text
            strong Fusce blandit nunc libero, in ultricies massa faucibus nec.
            |  Proin metus odio, ultricies quis libero vitae, tempor tempus est. Phasellus ac mi sed nulla molestie auctor.

    .prismea-vertical-spacing-40--slot
      .prismea-landingpage-button-position.-justify-end
        a.prismea-button.-primary(href='#') Button
        a.prismea-button.-primary.-outlined(href='#') Button

Simple header

Can be displayed on the top of the editorial pages.

<header class="prismea-landingpage-simple-header prismea-vertical-spacing-10 -center">
  <div class="prismea-vertical-spacing-5--slot">
    <p class="prismea-text -uppercase -text-bold -size-12 prismea-color -color-white">prismea</p>
  </div>
  <div class="prismea-vertical-spacing-5--slot">
    <h1 class="prismea-title-2 prismea-color -color-white -text-multiline">Page header title</h1>
  </div>
</header>
header.prismea-landingpage-simple-header.prismea-vertical-spacing-10.-center
  .prismea-vertical-spacing-5--slot
    p.prismea-text.-uppercase.-text-bold.-size-12.prismea-color.-color-white prismea
  .prismea-vertical-spacing-5--slot
    h1.prismea-title-2.prismea-color.-color-white.-text-multiline Page header title

Block Step Company Type (1/4)

<div class="prismea-landingpage-block-step">
  <div class="prismea-vertical-spacing-10--slot -center">
    <h2 class="prismea-text -size-18">Lorem ipsum dolor</h2>
  </div>
  <div class="prismea-vertical-spacing-10--slot">
    <hr class="prismea-separator -large"/>
  </div>
  <div class="prismea-vertical-spacing-30--slot">
    <div class="prismea-horizontal-spacing-30 -justify-middle">
      <div class="prismea-horizontal-spacing-20--slot">
        <div class="prismea-landingpage-card">
          <div class="prismea-vertical-spacing-40 -center">
            <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_sharp -color-secondary"></i>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <p class="prismea-text -text-medium -size-18 prismea-color -color-secondary">Lorem ipsum</p>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <div class="prismea-vertical-spacing-15--slot">
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -text-medium prismea-color -color-grey5">Lorem ipsum dolor</p>
              </div>
              <div class="prismea-vertical-spacing-5--slot"></div>
              <p class="prismea-text prismea-color -color-grey5">Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.</p>
            </div>
          </div>
          <div class="prismea-vertical-spacing-40--slot -center">
            <a class="prismea-button -primary" href="#">Lorem ipsum</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-20--slot">
        <div class="prismea-landingpage-card">
          <div class="prismea-vertical-spacing-40 -center">
            <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_sharp -color-secondary"></i>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <p class="prismea-text -text-medium -size-18 prismea-color -color-secondary">Lorem ipsum</p>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <div class="prismea-vertical-spacing-15--slot">
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -text-medium prismea-color -color-grey5">Lorem ipsum dolor</p>
              </div>
              <div class="prismea-vertical-spacing-5--slot"></div>
              <p class="prismea-text prismea-color -color-grey5">Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.</p>
            </div>
          </div>
          <div class="prismea-vertical-spacing-40--slot -center">
            <a class="prismea-button -primary" href="#">Lorem ipsum</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-20--slot">
        <div class="prismea-landingpage-card">
          <div class="prismea-vertical-spacing-40 -center">
            <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_sharp -color-secondary"></i>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <p class="prismea-text -text-medium -size-18 prismea-color -color-secondary">Lorem ipsum</p>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <div class="prismea-vertical-spacing-15--slot">
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -text-medium prismea-color -color-grey5">Lorem ipsum dolor</p>
              </div>
              <div class="prismea-vertical-spacing-5--slot"></div>
              <p class="prismea-text prismea-color -color-grey5">Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.</p>
            </div>
          </div>
          <div class="prismea-vertical-spacing-40--slot -center">
            <a class="prismea-button -primary" href="#">Lorem ipsum</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-20--slot">
        <div class="prismea-landingpage-card">
          <div class="prismea-vertical-spacing-40 -center">
            <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_sharp -color-primary"></i>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <p class="prismea-text -text-medium -size-18 prismea-color -color-primary">Lorem ipsum</p>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <div class="prismea-vertical-spacing-15--slot">
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -text-medium prismea-color -color-grey5">Lorem ipsum dolor</p>
              </div>
              <div class="prismea-vertical-spacing-5--slot"></div>
              <p class="prismea-text prismea-color -color-grey5">Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.</p>
            </div>
          </div>
          <div class="prismea-vertical-spacing-40--slot -center">
            <a class="prismea-button -primary" href="#">Lorem ipsum</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-block-step
  .prismea-vertical-spacing-10--slot.-center
    h2.prismea-text.-size-18 Lorem ipsum dolor
  .prismea-vertical-spacing-10--slot
    hr.prismea-separator.-large
  .prismea-vertical-spacing-30--slot
    .prismea-horizontal-spacing-30.-justify-middle
      .prismea-horizontal-spacing-20--slot
        .prismea-landingpage-card
          .prismea-vertical-spacing-40.-center
            .prismea-vertical-spacing-10--slot
              i.prismea-icon.prismea-landingpage-glyph-42_symbol_sharp.-color-secondary
            .prismea-vertical-spacing-5--slot
              p.prismea-text.-text-medium.-size-18.prismea-color.-color-secondary Lorem ipsum
            .prismea-vertical-spacing-5--slot
              hr.prismea-separator.-primary.-medium
            .prismea-vertical-spacing-15--slot
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-text-medium.prismea-color.-color-grey5 Lorem ipsum dolor
              .prismea-vertical-spacing-5--slot
              p.prismea-text.prismea-color.-color-grey5 Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.
          .prismea-vertical-spacing-40--slot.-center
            a.prismea-button.-primary(href='#') Lorem ipsum
      .prismea-horizontal-spacing-20--slot
        .prismea-landingpage-card
          .prismea-vertical-spacing-40.-center
            .prismea-vertical-spacing-10--slot
              i.prismea-icon.prismea-landingpage-glyph-42_symbol_sharp.-color-secondary
            .prismea-vertical-spacing-5--slot
              p.prismea-text.-text-medium.-size-18.prismea-color.-color-secondary Lorem ipsum
            .prismea-vertical-spacing-5--slot
              hr.prismea-separator.-primary.-medium
            .prismea-vertical-spacing-15--slot
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-text-medium.prismea-color.-color-grey5 Lorem ipsum dolor
              .prismea-vertical-spacing-5--slot
              p.prismea-text.prismea-color.-color-grey5 Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.
          .prismea-vertical-spacing-40--slot.-center
            a.prismea-button.-primary(href='#') Lorem ipsum
      .prismea-horizontal-spacing-20--slot
        .prismea-landingpage-card
          .prismea-vertical-spacing-40.-center
            .prismea-vertical-spacing-10--slot
              i.prismea-icon.prismea-landingpage-glyph-42_symbol_sharp.-color-secondary
            .prismea-vertical-spacing-5--slot
              p.prismea-text.-text-medium.-size-18.prismea-color.-color-secondary Lorem ipsum
            .prismea-vertical-spacing-5--slot
              hr.prismea-separator.-primary.-medium
            .prismea-vertical-spacing-15--slot
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-text-medium.prismea-color.-color-grey5 Lorem ipsum dolor
              .prismea-vertical-spacing-5--slot
              p.prismea-text.prismea-color.-color-grey5 Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.
          .prismea-vertical-spacing-40--slot.-center
            a.prismea-button.-primary(href='#') Lorem ipsum
      .prismea-horizontal-spacing-20--slot
        .prismea-landingpage-card
          .prismea-vertical-spacing-40.-center
            .prismea-vertical-spacing-10--slot
              i.prismea-icon.prismea-landingpage-glyph-42_symbol_sharp.-color-primary
            .prismea-vertical-spacing-5--slot
              p.prismea-text.-text-medium.-size-18.prismea-color.-color-primary Lorem ipsum
            .prismea-vertical-spacing-5--slot
              hr.prismea-separator.-primary.-medium
            .prismea-vertical-spacing-15--slot
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-text-medium.prismea-color.-color-grey5 Lorem ipsum dolor
              .prismea-vertical-spacing-5--slot
              p.prismea-text.prismea-color.-color-grey5 Lorem ipsum, dolor sit amet consectetur adipisicing elit. A placeat officia nesciunt eligendi omnis.
          .prismea-vertical-spacing-40--slot.-center
            a.prismea-button.-primary(href='#') Lorem ipsum

Block Step Offer (2/4)

<div class="prismea-landingpage-block-step"><a class="prismea-landingpage-block-step-previous-link prismea-text -size-14 prismea-color -color-grey5"><i class="prismea-icon prismea-landingpage-glyph-12_arrow-left -color-primary"></i> Lorem ipsum dolor sit</a>
  <div class="prismea-vertical-spacing-10--slot -center">
    <h2 class="prismea-text -size-18">Lorem ipsum dolor</h2>
  </div>
  <div class="prismea-vertical-spacing-10--slot">
    <hr class="prismea-separator -large"/>
  </div>
  <div class="prismea-vertical-spacing-30--slot">
    <div class="prismea-horizontal-spacing-30 -justify-middle">
      <div class="prismea-horizontal-spacing-20--slot">
        <div class="prismea-landingpage-card">
          <div class="prismea-vertical-spacing-40 -center">
            <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_vortex -color-secondary"></i>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <p class="prismea-text -text-medium -size-18 prismea-color -color-primary">Lorem ipsum</p>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -montserrat -size-52">29€</p>
              </div>
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -size-14 prismea-color -color-grey5">Lorem ipsum, dolor sit</p>
              </div>
            </div>
            <div class="prismea-vertical-spacing-10--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <ul class="prismea-landingpage-checklist -color-grey5 prismea-vertical-spacing-30--slot -left">
              <li class="prismea-text -checklist prismea-color">Lorem ipsum dolor sit amet consectetur</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
            </ul>
          </div>
          <div class="prismea-vertical-spacing-30--slot -center">
            <a class="prismea-button -primary" href="#">Lorem ipsum</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-20--slot">
        <div class="prismea-landingpage-card">
          <div class="prismea-vertical-spacing-40 -center">
            <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_vortex -color-secondary"></i>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <p class="prismea-text -text-medium -size-18 prismea-color -color-primary">Lorem ipsum</p>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -montserrat -size-52">29€</p>
              </div>
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -size-14 prismea-color -color-grey5">Lorem ipsum, dolor sit</p>
              </div>
            </div>
            <div class="prismea-vertical-spacing-10--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <ul class="prismea-landingpage-checklist -color-grey5 prismea-vertical-spacing-30--slot -left">
              <li class="prismea-text -checklist prismea-color">Lorem ipsum dolor sit amet consectetur</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
            </ul>
          </div>
          <div class="prismea-vertical-spacing-30--slot -center">
            <a class="prismea-button -primary" href="#">Lorem ipsum</a>
          </div>
        </div>
      </div>
      <div class="prismea-horizontal-spacing-20--slot">
        <div class="prismea-landingpage-card">
          <div class="prismea-landingpage-card--banner -primary prismea-vertical-spacing-5 -justify-middle -flex -center">
            <p class="prismea-text -uppercase -size-12 prismea-color -color-white">Lorem ipsum</p>
          </div>
          <div class="prismea-vertical-spacing-40 -center">
            <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_vortex -color-secondary"></i>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <p class="prismea-text -text-medium -size-18 prismea-color -color-primary">Lorem ipsum</p>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <div class="prismea-vertical-spacing-5--slot">
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -montserrat -size-52">29€</p>
              </div>
              <div class="prismea-vertical-spacing-5--slot">
                <p class="prismea-text -size-14 prismea-color -color-grey5">Lorem ipsum, dolor sit</p>
              </div>
            </div>
            <div class="prismea-vertical-spacing-10--slot">
              <hr class="prismea-separator -primary -medium"/>
            </div>
            <ul class="prismea-landingpage-checklist -color-grey5 prismea-vertical-spacing-30--slot -left">
              <li class="prismea-text -checklist prismea-color">Lorem ipsum dolor sit amet consectetur</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi fusce blandit nunc libero</li>
              <li class="prismea-text -checklist prismea-color">Phasellus ac mi</li>
              <li class="prismea-text -checklist prismea-color">Fusce blandit nunc libero</li>
            </ul>
          </div>
          <div class="prismea-vertical-spacing-30--slot -center">
            <a class="prismea-button -primary" href="#">Lorem ipsum</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
.prismea-landingpage-block-step
  a.prismea-landingpage-block-step-previous-link.prismea-text.-size-14.prismea-color.-color-grey5
    i.prismea-icon.prismea-landingpage-glyph-12_arrow-left.-color-primary
    |  Lorem ipsum dolor sit
  .prismea-vertical-spacing-10--slot.-center
    h2.prismea-text.-size-18 Lorem ipsum dolor
  .prismea-vertical-spacing-10--slot
    hr.prismea-separator.-large
  .prismea-vertical-spacing-30--slot
    .prismea-horizontal-spacing-30.-justify-middle
      .prismea-horizontal-spacing-20--slot
        .prismea-landingpage-card
          .prismea-vertical-spacing-40.-center
            .prismea-vertical-spacing-10--slot
              i.prismea-icon.prismea-landingpage-glyph-42_symbol_vortex.-color-secondary
            .prismea-vertical-spacing-5--slot
              p.prismea-text.-text-medium.-size-18.prismea-color.-color-primary Lorem ipsum
            .prismea-vertical-spacing-5--slot
              hr.prismea-separator.-primary.-medium
            .prismea-vertical-spacing-5--slot
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-montserrat.-size-52 29€
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-size-14.prismea-color.-color-grey5 Lorem ipsum, dolor sit
            .prismea-vertical-spacing-10--slot
              hr.prismea-separator.-primary.-medium
            ul.prismea-landingpage-checklist.-color-grey5.prismea-vertical-spacing-30--slot.-left
              li.prismea-text.-checklist.prismea-color Lorem ipsum dolor sit amet consectetur
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
          .prismea-vertical-spacing-30--slot.-center
            a.prismea-button.-primary(href='#') Lorem ipsum
      .prismea-horizontal-spacing-20--slot
        .prismea-landingpage-card
          .prismea-vertical-spacing-40.-center
            .prismea-vertical-spacing-10--slot
              i.prismea-icon.prismea-landingpage-glyph-42_symbol_vortex.-color-secondary
            .prismea-vertical-spacing-5--slot
              p.prismea-text.-text-medium.-size-18.prismea-color.-color-primary Lorem ipsum
            .prismea-vertical-spacing-5--slot
              hr.prismea-separator.-primary.-medium
            .prismea-vertical-spacing-5--slot
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-montserrat.-size-52 29€
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-size-14.prismea-color.-color-grey5 Lorem ipsum, dolor sit
            .prismea-vertical-spacing-10--slot
              hr.prismea-separator.-primary.-medium
            ul.prismea-landingpage-checklist.-color-grey5.prismea-vertical-spacing-30--slot.-left
              li.prismea-text.-checklist.prismea-color Lorem ipsum dolor sit amet consectetur
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
          .prismea-vertical-spacing-30--slot.-center
            a.prismea-button.-primary(href='#') Lorem ipsum
      .prismea-horizontal-spacing-20--slot
        .prismea-landingpage-card
          .prismea-landingpage-card--banner.-primary.prismea-vertical-spacing-5.-justify-middle.-flex.-center
            p.prismea-text.-uppercase.-size-12.prismea-color.-color-white Lorem ipsum
          .prismea-vertical-spacing-40.-center
            .prismea-vertical-spacing-10--slot
              i.prismea-icon.prismea-landingpage-glyph-42_symbol_vortex.-color-secondary
            .prismea-vertical-spacing-5--slot
              p.prismea-text.-text-medium.-size-18.prismea-color.-color-primary Lorem ipsum
            .prismea-vertical-spacing-5--slot
              hr.prismea-separator.-primary.-medium
            .prismea-vertical-spacing-5--slot
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-montserrat.-size-52 29€
              .prismea-vertical-spacing-5--slot
                p.prismea-text.-size-14.prismea-color.-color-grey5 Lorem ipsum, dolor sit
            .prismea-vertical-spacing-10--slot
              hr.prismea-separator.-primary.-medium
            ul.prismea-landingpage-checklist.-color-grey5.prismea-vertical-spacing-30--slot.-left
              li.prismea-text.-checklist.prismea-color Lorem ipsum dolor sit amet consectetur
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi fusce blandit nunc libero
              li.prismea-text.-checklist.prismea-color Phasellus ac mi
              li.prismea-text.-checklist.prismea-color Fusce blandit nunc libero
          .prismea-vertical-spacing-30--slot.-center
            a.prismea-button.-primary(href='#') Lorem ipsum

Block Step User Data (3/4)

<div class="prismea-landingpage-block-step"><a class="prismea-landingpage-block-step-previous-link prismea-text -size-14 prismea-color -color-grey5"><i class="prismea-icon prismea-landingpage-glyph-12_arrow-left -color-primary"></i> Lorem ipsum dolor sit</a>
  <div class="prismea-vertical-spacing-10--slot -center">
    <h2 class="prismea-text -size-18">Lorem ipsum dolor</h2>
  </div>
  <div class="prismea-vertical-spacing-10--slot">
    <hr class="prismea-separator -large"/>
  </div>
  <div class="prismea-vertical-spacing-40--slot prismea-horizontal-spacing-90 -justify-middle">
    <div class="prismea-horizontal-spacing-60--slot">
      <div class="prismea-vertical-spacing-5--slot prismea-landingpage-block-title">
        <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_floor_left -color-secondary"></i>
        </div>
        <div class="prismea-vertical-spacing-10--slot">
          <p class="prismea-text -uppercase -size-12 prismea-color -color-grey5">In gravida diam</p>
        </div>
        <div class="prismea-vertical-spacing-5--slot">
          <h2 class="prismea-title-2 prismea-color -color-primary -text-multiline">Foobar</h2>
          <h2 class="prismea-title-2">Lorem ipsum</h2>
        </div>
        <div class="prismea-vertical-spacing-10--slot prismea-landingpage-only-desktop">
          <p class="prismea-text -size-18 prismea-color -color-grey5">In gravida diam eu felis pharetra, eget iaculis mauris finibus.</p>
        </div>
      </div>
      <div class="prismea-vertical-spacing-40--slot prismea-landingpage-only-desktop"><img src="https://placeimg.com/160/160/animals"/></div>
    </div>
    <div class="prismea-horizontal-spacing-90--slot">
      <form class="prismea-landingpage-form -grey3">
        <div class="prismea-landingpage-input-group">
          <label class="prismea-text -size-14 prismea-color -color-grey5" for="inputName">Lorem ipsum dolor sit</label>
          <input type="tel" name="inputName" id="inputName" placeholder="XXXX XXX XXX"/>
        </div>
        <div class="prismea-landingpage-input-group">
          <label class="prismea-text -size-14 prismea-color -color-grey5" for="inputName">Lorem ipsum dolor sit</label>
          <input type="email" name="inputName" id="inputName"/>
        </div>
        <div class="prismea-landingpage-input-group">
          <label class="prismea-text -size-14 prismea-color -color-grey5" for="inputName">Lorem ipsum dolor sit</label>
          <input type="text" name="inputName" id="inputName"/>
        </div>
        <div class="prismea-landingpage-input-group">
          <button class="prismea-button -primary" type="submit">Foobar</button>
        </div>
        <div class="prismea-vertical-spacing-20--slot">
          <p class="prismea-text -size-12 prismea-color -color-grey4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (12px)</p>
        </div>
      </form>
    </div>
  </div>
</div>
.prismea-landingpage-block-step
  a.prismea-landingpage-block-step-previous-link.prismea-text.-size-14.prismea-color.-color-grey5
    i.prismea-icon.prismea-landingpage-glyph-12_arrow-left.-color-primary
    |  Lorem ipsum dolor sit
  .prismea-vertical-spacing-10--slot.-center
    h2.prismea-text.-size-18 Lorem ipsum dolor
  .prismea-vertical-spacing-10--slot
    hr.prismea-separator.-large
  .prismea-vertical-spacing-40--slot.prismea-horizontal-spacing-90.-justify-middle
    .prismea-horizontal-spacing-60--slot
      .prismea-vertical-spacing-5--slot.prismea-landingpage-block-title
        .prismea-vertical-spacing-10--slot
          i.prismea-icon.prismea-landingpage-glyph-42_symbol_floor_left.-color-secondary
        .prismea-vertical-spacing-10--slot
          p.prismea-text.-uppercase.-size-12.prismea-color.-color-grey5 In gravida diam
        .prismea-vertical-spacing-5--slot
          h2.prismea-title-2.prismea-color.-color-primary.-text-multiline Foobar
          h2.prismea-title-2 Lorem ipsum
        .prismea-vertical-spacing-10--slot.prismea-landingpage-only-desktop
          p.prismea-text.-size-18.prismea-color.-color-grey5 In gravida diam eu felis pharetra, eget iaculis mauris finibus.
      .prismea-vertical-spacing-40--slot.prismea-landingpage-only-desktop
        img(src='https://placeimg.com/160/160/animals')
    .prismea-horizontal-spacing-90--slot
      form.prismea-landingpage-form.-grey3
        .prismea-landingpage-input-group
          label.prismea-text.-size-14.prismea-color.-color-grey5(for='inputName') Lorem ipsum dolor sit
          input#inputName(type='tel', name='inputName', placeholder='XXXX XXX XXX')
        .prismea-landingpage-input-group
          label.prismea-text.-size-14.prismea-color.-color-grey5(for='inputName') Lorem ipsum dolor sit
          input#inputName(type='email', name='inputName')
        .prismea-landingpage-input-group
          label.prismea-text.-size-14.prismea-color.-color-grey5(for='inputName') Lorem ipsum dolor sit
          input#inputName(type='text', name='inputName')
        .prismea-landingpage-input-group
          button.prismea-button.-primary(type='submit') Foobar
        .prismea-vertical-spacing-20--slot
          p.prismea-text.-size-12.prismea-color.-color-grey4 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Ut nec felis at sapien condimentum faucibus. Pellentesque tempus nec est eu iaculis. (12px)

Block Step Thanks (4/4)

<div class="prismea-landingpage-block-step"><a class="prismea-landingpage-block-step-previous-link prismea-text -size-14 prismea-color -color-grey5"><i class="prismea-icon prismea-landingpage-glyph-12_arrow-left -color-primary"></i> Lorem ipsum dolor sit</a>
  <div class="prismea-vertical-spacing-10--slot -center">
    <h2 class="prismea-text -size-18">Lorem ipsum dolor</h2>
  </div>
  <div class="prismea-vertical-spacing-10--slot">
    <hr class="prismea-separator -large"/>
  </div>
  <div class="prismea-vertical-spacing-40--slot prismea-horizontal-spacing-30 -justify-middle">
    <div class="prismea-horizontal-spacing-90--slot">
      <div class="prismea-vertical-spacing-40--slot prismea-landingpage-block-title -left">
        <div class="prismea-vertical-spacing-10--slot"><i class="prismea-icon prismea-landingpage-glyph-42_symbol_floor_left -color-secondary"></i>
        </div>
        <div class="prismea-vertical-spacing-10--slot">
          <h2 class="prismea-title-2">Lorem ipsum dolor sit amet</h2>
        </div>
        <div class="prismea-vertical-spacing-10--slot">
          <p class="prismea-text -size-18 prismea-color -color-grey4">In gravida diam eu felis pharetra, eget iaculis mauris finibus.</p>
        </div>
      </div>
      <div class="prismea-vertical-spacing-40--slot">
        <div class="prismea-landingpage-button-position -justify-left">
          <a class="prismea-button -primary" href="#">Button</a>
        </div>
      </div>
      <div class="prismea-vertical-spacing-40--slot"><a class="prismea-landingpage-store-link" href="https://play.google.com/store/apps/details?id=com.prismea.android&amp;pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1"><img src="https://lh3.googleusercontent.com/qF9r3ZjtgG-qyHdmjecArtKiulz1gmwL_xl9R3_fzk6igSeoN0wYbJSKEX5d_fxJRwYZJpHbqcLB3i9atl-9dOfUl9an7U43TfZ9PtQ=s0" alt="Disponible sur Google Play"/></a><a class="prismea-landingpage-store-link" href="https://apps.apple.com/fr/app/prismea/id1471623555?itsct=apps_box&amp;amp;itscg=30200"><img src="https://tools.applemediaservices.com/api/badges/download-on-the-app-store/black/fr-fr?size=250x83&amp;amp;releaseDate=1587168000&amp;h=12208210dfd04a56e78e84f453aaabd5" alt="Disponible sur l'App Store"/></a>
      </div>
    </div>
    <div class="prismea-horizontal-spacing-90--slot"><img src="https://placeimg.com/410/470/animals"/></div>
  </div>
</div>
.prismea-landingpage-block-step
  a.prismea-landingpage-block-step-previous-link.prismea-text.-size-14.prismea-color.-color-grey5
    i.prismea-icon.prismea-landingpage-glyph-12_arrow-left.-color-primary
    |  Lorem ipsum dolor sit
  .prismea-vertical-spacing-10--slot.-center
    h2.prismea-text.-size-18 Lorem ipsum dolor
  .prismea-vertical-spacing-10--slot
    hr.prismea-separator.-large
  .prismea-vertical-spacing-40--slot.prismea-horizontal-spacing-30.-justify-middle
    .prismea-horizontal-spacing-90--slot
      .prismea-vertical-spacing-40--slot.prismea-landingpage-block-title.-left
        .prismea-vertical-spacing-10--slot
          i.prismea-icon.prismea-landingpage-glyph-42_symbol_floor_left.-color-secondary
        .prismea-vertical-spacing-10--slot
          h2.prismea-title-2 Lorem ipsum dolor sit amet
        .prismea-vertical-spacing-10--slot
          p.prismea-text.-size-18.prismea-color.-color-grey4 In gravida diam eu felis pharetra, eget iaculis mauris finibus.
      .prismea-vertical-spacing-40--slot
        .prismea-landingpage-button-position.-justify-left
          a.prismea-button.-primary(href='#') Button
      .prismea-vertical-spacing-40--slot
        a.prismea-landingpage-store-link(href='https://play.google.com/store/apps/details?id=com.prismea.android&pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1')
          img(src='https://lh3.googleusercontent.com/qF9r3ZjtgG-qyHdmjecArtKiulz1gmwL_xl9R3_fzk6igSeoN0wYbJSKEX5d_fxJRwYZJpHbqcLB3i9atl-9dOfUl9an7U43TfZ9PtQ=s0', alt='Disponible sur Google Play')
        a.prismea-landingpage-store-link(href='https://apps.apple.com/fr/app/prismea/id1471623555?itsct=apps_box&amp;itscg=30200')
          img(src='https://tools.applemediaservices.com/api/badges/download-on-the-app-store/black/fr-fr?size=250x83&amp;releaseDate=1587168000&h=12208210dfd04a56e78e84f453aaabd5', alt='Disponible sur l\'App Store')
    .prismea-horizontal-spacing-90--slot
      img(src='https://placeimg.com/410/470/animals')

Cookie Banner

<div class="prismea-landingpage-cookie prismea-landingpage-cookie-banner">
  <div class="prismea-landingpage-cookie-header prismea-landingpage-cookie-banner-header">
    <h3 class="prismea-landingpage-cookie-header-title prismea-text -montserrat">Lorem ipsum dolor sit amet</h3>
  </div>
  <div class="prismea-landingpage-cookie-banner-body">
    <div class="prismea-landingpage-cookie-banner-body-description prismea-landingpage-wysiwyg">
      <p class="prismea-text -size-14">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. <a href="#">Ut nec felis.</a></p>
    </div>
    <div class="prismea-landingpage-cookie-banner-body-list">
      <div class="prismea-vertical-spacing-35--slot">
        <div class="prismea-vertical-spacing-10--slot">
          <p class="prismea-text -size-16 prismea-color -color-primary">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
        </div>
        <div class="prismea-vertical-spacing-10--slot">
          <p class="prismea-text -size-14 prismea-color -color-grey5">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum.</p>
        </div>
      </div>
      <ul class="prismea-vertical-spacing-15--slot">
        <li class="prismea-landingpage-cookie-list-item prismea-vertical-spacing-25--slot">
          <div class="prismea-landingpage-cookie-list-item-icon"><i class="prismea-icon prismea-landingpage-glyph-42_statistical -color-primary"></i>
          </div>
          <p class="prismea-text -size-14">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit :<span class="prismea-color -color-grey5"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.</span></p>
        </li>
        <li class="prismea-landingpage-cookie-list-item prismea-vertical-spacing-25--slot">
          <div class="prismea-landingpage-cookie-list-item-icon"><i class="prismea-icon prismea-landingpage-glyph-42_statistical -color-primary"></i>
          </div>
          <p class="prismea-text -size-14">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit :<span class="prismea-color -color-grey5"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.</span></p>
        </li>
        <li class="prismea-landingpage-cookie-list-item prismea-vertical-spacing-25--slot">
          <div class="prismea-landingpage-cookie-list-item-icon"><i class="prismea-icon prismea-landingpage-glyph-42_statistical -color-primary"></i>
          </div>
          <p class="prismea-text -size-14">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit :<span class="prismea-color -color-grey5"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.</span></p>
        </li>
      </ul>
      <p class="prismea-landingpage-cookie-banner-body-list-footer prismea-vertical-spacing-15--slot prismea-text -size-14"><span class="prismea-color -color-grey5">Lorem ipsum dolor sit amet, consectetur adipiscing elit</span><a class="prismea-text -underline">Ut nec felis</a></p>
    </div>
  </div>
  <div class="prismea-landingpage-cookie-footer">
    <div class="prismea-vertical-spacing-10--slot">
      <div class="prismea-landingpage-button-position -justify-middle">
        <a class="prismea-button -primary" href="#">Default button</a>
      </div>
    </div>
    <div class="prismea-landingpage-cookie-footer-links prismea-vertical-spacing-10--slot"><a class="prismea-text -size-14 prismea-color -color-primary -underline">Lorem ipsum dolor sit amet</a><a class="prismea-text -size-14 prismea-color -color-grey5 -underline">Lorem ipsum dolor</a></div>
  </div>
</div>
.prismea-landingpage-cookie.prismea-landingpage-cookie-banner
  .prismea-landingpage-cookie-header.prismea-landingpage-cookie-banner-header
    h3.prismea-landingpage-cookie-header-title.prismea-text.-montserrat Lorem ipsum dolor sit amet
  .prismea-landingpage-cookie-banner-body
    .prismea-landingpage-cookie-banner-body-description.prismea-landingpage-wysiwyg
      p.prismea-text.-size-14
        | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
        a(href='#') Ut nec felis.
    .prismea-landingpage-cookie-banner-body-list
      .prismea-vertical-spacing-35--slot
        .prismea-vertical-spacing-10--slot
          p.prismea-text.-size-16.prismea-color.-color-primary Lorem ipsum dolor sit amet, consectetur adipiscing elit.
        .prismea-vertical-spacing-10--slot
          p.prismea-text.-size-14.prismea-color.-color-grey5 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum.
      ul.prismea-vertical-spacing-15--slot
        li.prismea-landingpage-cookie-list-item.prismea-vertical-spacing-25--slot
          .prismea-landingpage-cookie-list-item-icon
            i.prismea-icon.prismea-landingpage-glyph-42_statistical.-color-primary
          p.prismea-text.-size-14
            | 
Lorem ipsum dolor sit amet, consectetur adipiscing elit :
            span.prismea-color.-color-grey5  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.
        li.prismea-landingpage-cookie-list-item.prismea-vertical-spacing-25--slot
          .prismea-landingpage-cookie-list-item-icon
            i.prismea-icon.prismea-landingpage-glyph-42_statistical.-color-primary
          p.prismea-text.-size-14
            | 
Lorem ipsum dolor sit amet, consectetur adipiscing elit :
            span.prismea-color.-color-grey5  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.
        li.prismea-landingpage-cookie-list-item.prismea-vertical-spacing-25--slot
          .prismea-landingpage-cookie-list-item-icon
            i.prismea-icon.prismea-landingpage-glyph-42_statistical.-color-primary
          p.prismea-text.-size-14
            | 
Lorem ipsum dolor sit amet, consectetur adipiscing elit :
            span.prismea-color.-color-grey5  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.
      p.prismea-landingpage-cookie-banner-body-list-footer.prismea-vertical-spacing-15--slot.prismea-text.-size-14
        span.prismea-color.-color-grey5 Lorem ipsum dolor sit amet, consectetur adipiscing elit
        a.prismea-text.-underline Ut nec felis
  .prismea-landingpage-cookie-footer
    .prismea-vertical-spacing-10--slot
      .prismea-landingpage-button-position.-justify-middle
        a.prismea-button.-primary(href='#') Default button
    .prismea-landingpage-cookie-footer-links.prismea-vertical-spacing-10--slot
      a.prismea-text.-size-14.prismea-color.-color-primary.-underline Lorem ipsum dolor sit amet
      a.prismea-text.-size-14.prismea-color.-color-grey5.-underline Lorem ipsum dolor

Cookie Modal

<div class="prismea-landingpage-cookie prismea-landingpage-cookie-modal">
  <div class="prismea-landingpage-cookie-header prismea-landingpage-cookie-modal-header">
    <h3 class="prismea-landingpage-cookie-header-title prismea-text -montserrat">Lorem ipsum dolor sit amet</h3><i class="prismea-icon prismea-landingpage-glyph-16_close"></i>
  </div>
  <div class="prismea-landingpage-cookie-modal-body">
    <div class="prismea-vertical-spacing-35--slot prismea-landingpage-wysiwyg">
      <p class="prismea-text -size-14">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. <a href="#">Ut nec felis.</a></p>
    </div>
    <ul class="prismea-vertical-spacing-35--slot">
      <li class="prismea-vertical-spacing-40--slot">
        <div class="prismea-landingpage-cookie-list-item">
          <div class="prismea-landingpage-cookie-list-item-icon"><i class="prismea-icon prismea-landingpage-glyph-42_statistical -color-primary"></i>
          </div>
          <p class="prismea-text -size-14">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit :<span class="prismea-color -color-grey5"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.</span></p>
        </div>
        <div class="prismea-landingpage-cookie-list-switch">
          <button class="prismea-switch -off -with-label" role="switch" aria-checked="false" aria-label="Switch"><span class="prismea-switch--label -color-light">Off</span><i class="prismea-switch--button"></i>
          </button>
        </div>
      </li>
      <li class="prismea-vertical-spacing-40--slot">
        <div class="prismea-landingpage-cookie-list-item">
          <div class="prismea-landingpage-cookie-list-item-icon"><i class="prismea-icon prismea-landingpage-glyph-42_statistical -color-primary"></i>
          </div>
          <p class="prismea-text -size-14">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit :<span class="prismea-color -color-grey5"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.</span></p>
        </div>
        <div class="prismea-landingpage-cookie-list-switch">
          <button class="prismea-switch -on -with-label" role="switch" aria-checked="true" aria-label="Switch"><span class="prismea-switch--label -color-light">On</span><i class="prismea-switch--button"></i>
          </button>
        </div>
      </li>
      <li class="prismea-vertical-spacing-40--slot">
        <div class="prismea-landingpage-cookie-list-item">
          <div class="prismea-landingpage-cookie-list-item-icon"><i class="prismea-icon prismea-landingpage-glyph-42_statistical -color-primary"></i>
          </div>
          <p class="prismea-text -size-14">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit :<span class="prismea-color -color-grey5"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.</span></p>
        </div>
        <div class="prismea-landingpage-cookie-list-switch">
          <button class="prismea-switch -off -with-label" role="switch" aria-checked="false" aria-label="Switch"><span class="prismea-switch--label -color-light">Off</span><i class="prismea-switch--button"></i>
          </button>
        </div>
      </li>
    </ul>
  </div>
  <div class="prismea-landingpage-cookie-footer">
    <div class="prismea-vertical-spacing-10--slot">
      <div class="prismea-landingpage-button-position -justify-middle">
        <a class="prismea-button -primary" href="#">Default button</a>
      </div>
    </div>
    <div class="prismea-landingpage-cookie-footer-links prismea-vertical-spacing-10--slot"><a class="prismea-text -size-14 prismea-color -color-primary -underline">Lorem ipsum dolor sit amet</a><a class="prismea-text -size-14 prismea-color -color-grey5 -underline">Lorem ipsum dolor</a></div>
  </div>
</div>
.prismea-landingpage-cookie.prismea-landingpage-cookie-modal
  .prismea-landingpage-cookie-header.prismea-landingpage-cookie-modal-header
    h3.prismea-landingpage-cookie-header-title.prismea-text.-montserrat Lorem ipsum dolor sit amet
    i.prismea-icon.prismea-landingpage-glyph-16_close
  .prismea-landingpage-cookie-modal-body
    .prismea-vertical-spacing-35--slot.prismea-landingpage-wysiwyg
      p.prismea-text.-size-14
        | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
        a(href='#') Ut nec felis.
    ul.prismea-vertical-spacing-35--slot
      li.prismea-vertical-spacing-40--slot
        .prismea-landingpage-cookie-list-item
          .prismea-landingpage-cookie-list-item-icon
            i.prismea-icon.prismea-landingpage-glyph-42_statistical.-color-primary
          p.prismea-text.-size-14
            | 
Lorem ipsum dolor sit amet, consectetur adipiscing elit :
            span.prismea-color.-color-grey5  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.
        .prismea-landingpage-cookie-list-switch
          button.prismea-switch.-off.-with-label(role='switch', aria-checked='false', aria-label='Switch')
            span.prismea-switch--label.-color-light Off
            i.prismea-switch--button
      li.prismea-vertical-spacing-40--slot
        .prismea-landingpage-cookie-list-item
          .prismea-landingpage-cookie-list-item-icon
            i.prismea-icon.prismea-landingpage-glyph-42_statistical.-color-primary
          p.prismea-text.-size-14
            | 
Lorem ipsum dolor sit amet, consectetur adipiscing elit :
            span.prismea-color.-color-grey5  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.
        .prismea-landingpage-cookie-list-switch
          button.prismea-switch.-on.-with-label(role='switch', aria-checked='true', aria-label='Switch')
            span.prismea-switch--label.-color-light On
            i.prismea-switch--button
      li.prismea-vertical-spacing-40--slot
        .prismea-landingpage-cookie-list-item
          .prismea-landingpage-cookie-list-item-icon
            i.prismea-icon.prismea-landingpage-glyph-42_statistical.-color-primary
          p.prismea-text.-size-14
            | 
Lorem ipsum dolor sit amet, consectetur adipiscing elit :
            span.prismea-color.-color-grey5  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque bibendum cursus ipsum, dictum consequat ipsum tempus quis. Nulla suscipit gravida ultricies.
        .prismea-landingpage-cookie-list-switch
          button.prismea-switch.-off.-with-label(role='switch', aria-checked='false', aria-label='Switch')
            span.prismea-switch--label.-color-light Off
            i.prismea-switch--button
  .prismea-landingpage-cookie-footer
    .prismea-vertical-spacing-10--slot
      .prismea-landingpage-button-position.-justify-middle
        a.prismea-button.-primary(href='#') Default button
    .prismea-landingpage-cookie-footer-links.prismea-vertical-spacing-10--slot
      a.prismea-text.-size-14.prismea-color.-color-primary.-underline Lorem ipsum dolor sit amet
      a.prismea-text.-size-14.prismea-color.-color-grey5.-underline Lorem ipsum dolor