Free University of Bozen-Bolzano

Hero

This pattern contains: atoms-heading-5 atoms-heading-1 atoms-text-paragraph

HTML

									
										<section class="hero" role="banner">
  <div class="hero_image" style="background-image:url(../../images/fpo_16x9.png)">
      <span class="hero_caption">Lorem ipsum dolor sit (37 characters)</span>
  </div>
    <div class="hero_text">
        <h5 class="hero_label">Lorem ipsum dolor sit (37 characters)</h5>        <h1 class="hero_title">Lorem ipsum dolor sit (37 characters)</h1>    </div>
  <div class="l-containerSmall">
    <div class="typography">
      <p class="hero_intro">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris ni (210 characters)</p>    </div>
  </div>
</section>

Hero Small

This pattern contains: atoms-heading-5 atoms-heading-1

HTML

									
										<section class="hero-small" role="banner">
  <div class="l-container">
      <h5 class="hero_label">Lorem ipsum dolor sit (37 characters)</h5>      <h1 class="hero_title">Lorem ipsum dolor sit (37 characters)</h1>  </div>
</section>