This pattern contains: atoms-logo molecules-nav molecules-nav-study-course molecules-nav-links-university molecules-nav-links-faculty molecules-nav-grid-bachelor molecules-nav-grid-master molecules-nav-grid-phd molecules-nav-grid-lifelong molecules-nav-mobile

									
										<header class="js-header header">
  <div class="l-container">
    <div class="header_inner">
      <a class="logo" href="../../patterns/04-pages-00-homepage/04-pages-00-homepage.html">
        <svg class="logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 65 52">
          <title>Title</title>
          <desc>Description</desc>
          <path d="M38.9,0.2h25.7v3.6H38.9V0.2z"/>
          <path d="M12.6,34.5H9v-1.3c-1,1-2.2,1.5-3.6,1.5c-1.4,0-2.6-0.4-3.5-1.3
              c-1-1-1.5-2.4-1.5-4.1V20h3.7v8.8c0,0.9,0.3,1.6,0.8,2.1c0.4,0.4,1,0.6,1.6,0.6c0.7,0,1.2-0.2,1.6-0.6c0.5-0.5,0.8-1.1,0.8-2.1V20
              h3.7V34.5"/>
          <path d="M28.2,34.5h-3.7v-8.8c0-0.9-0.3-1.6-0.8-2.1c-0.4-0.4-1-0.6-1.6-0.6
              c-0.7,0-1.2,0.2-1.6,0.6c-0.5,0.5-0.8,1.2-0.8,2.1v8.8H16V20h3.6v1.3c1-1,2.2-1.5,3.7-1.5c1.4,0,2.6,0.4,3.5,1.3
              c1,1,1.5,2.4,1.5,4.1V34.5"/>
          <path d="M31.7,14.6h3.7v2.9h-3.7V14.6z M31.7,20h3.7v14.5h-3.7V20z"/>
          <path d="M51.2,27.2c0,1.5-0.1,2.6-0.2,3.3c-0.2,1.2-0.6,2.1-1.3,2.8
              c-0.9,0.9-2.1,1.3-3.6,1.3c-1.5,0-2.7-0.5-3.6-1.5v1.4h-3.5V14.7h3.7v6.6c0.9-1,2-1.4,3.5-1.4c1.5,0,2.7,0.4,3.5,1.3
              c0.7,0.6,1.1,1.6,1.3,2.8C51.1,24.7,51.2,25.8,51.2,27.2 M47.5,27.2c0-1.3-0.1-2.2-0.3-2.8c-0.4-0.9-1.1-1.4-2.1-1.4
              c-1.1,0-1.8,0.5-2.1,1.4c-0.2,0.6-0.3,1.5-0.3,2.8c0,1.3,0.1,2.2,0.3,2.8c0.4,0.9,1.1,1.4,2.1,1.4c1.1,0,1.8-0.5,2.1-1.4
              C47.4,29.4,47.5,28.5,47.5,27.2"/>
          <path d="M64.6,34.5H53.5v-2.7l6.5-8.5h-6.1V20h10.8v2.8L58,31.3h6.6V34.5"/>
          <path d="M38.9,47.4h25.7V51H38.9V47.4z"/>
        </svg>
      </a>      <div class="mainNav">
          <nav class="js-nav" data-nav-level="1">
          	<ul class="nav_wrap">
            		<li>
                  <a class="js-nav_item nav_item" href="#" data-toggle-elem="#nav-university">University</a>
                </li>
            		<li>
                  <a class="js-nav_item nav_item" href="#" data-toggle-elem="#nav-faculties">Faculties</a>
                </li>
            		<li>
                  <a class="js-nav_item nav_item" href="#" data-toggle-elem="#nav-study-courses">Study Programmes</a>
                </li>
          	</ul>
          </nav>
      </div>
      <div class="utility">
          <a class="nav_item nav_item-utility js-nav_item" href="#" data-toggle-elem="#nav-languages">EN</a>
          <a class="nav_item nav_item-utility js-nav_item" href="#" data-toggle-elem="#nav-services">Services</a>
        <div class="utility_search"></div>
        <div class="utility_hamburger">
          <div class="burger"></div>
        </div>
      </div>
    </div>
  </div>
</header>

<div class="navSecondary_wrapper">
  <div class="l-container">
      <nav id="nav-study-courses" class="js-nav navSecondary" data-nav-level="2">
      	<ul class="nav_wrap">
        		<li>
              <a class="js-nav_item nav_item" href="#" data-toggle-elem="#nav-bachelor">Bachelor</a>
            </li>
        		<li>
              <a class="js-nav_item nav_item" href="#" data-toggle-elem="#nav-master">Master</a>
            </li>
        		<li>
              <a class="js-nav_item nav_item" href="#" data-toggle-elem="#nav-phd">PhD</a>
            </li>
        		<li>
              <a class="js-nav_item nav_item" href="#" data-toggle-elem="#nav-lifelong">Lifelong Learning</a>
            </li>
      	</ul>
      </nav>
  </div>
</div>

<div class="navLinks_wrapper">
  <div class="l-container">
      <nav id="nav-university" class="js-nav navLinks" data-nav-level="2">
        <ul class="nav_wrap navLinks_wrap">
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Profile</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Organisation</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Cooperation</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Jobs</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Calls</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Press</a>
            </li>
        </ul>
      </nav>
  </div>
</div>

<div class="navLinks_wrapper">
  <div class="l-container">
      <nav id="nav-faculties" class="js-nav navLinks" data-nav-level="2">
        <ul class="nav_wrap navLinks_wrap">
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Computer Science</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Economics and Management</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Education</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Design and Art</a>
            </li>
            <li class="navLinks_item">
              <a class="js-nav-item" href="#">Science and Technology</a>
            </li>
        </ul>
      </nav>
  </div>
</div>

<div class="navGrid_wrapper">
  <div class="l-container">
      <nav id="nav-bachelor" class="js-nav navGrid" data-nav-level="3">
        <ul class="nav_wrap navGrid_wrap">
            <li class="navGrid_item">
              <span class="gridItem_label">econ</span>
              <div class="gridItem_name">
                <a href="#">Economics and Management</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">econ</span>
              <div class="gridItem_name">
                <a href="#">Economics and Social Sciences</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">econ</span>
              <div class="gridItem_name">
                <a href="#">Tourism, Sport and Event Management</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">comp</span>
              <div class="gridItem_name">
                <a href="#">Computer Science and Engineering</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">Agricultural and Agro-Environmental Sciences</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">Industrial and Mechanical Engineering</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">edu</span>
              <div class="gridItem_name">
                <a href="#">Communication Sciences and Culture</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">edu</span>
              <div class="gridItem_name">
                <a href="#">Social Education</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">edu</span>
              <div class="gridItem_name">
                <a href="#">Social Work</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">dsgn</span>
              <div class="gridItem_name">
                <a href="#">Design and Art</a>
              </div>
            </li>
          <li class="navGrid_item"></li>
        </ul>
      </nav>
  </div>
</div>

<div class="navGrid_wrapper">
  <div class="l-container">
      <nav id="nav-master" class="js-nav navGrid" data-nav-level="3">
        <ul class="nav_wrap navGrid_wrap">
            <li class="navGrid_item">
              <span class="gridItem_label">econ</span>
              <div class="gridItem_name">
                <a href="#">Economics and Management of the Public Sector</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">econ</span>
              <div class="gridItem_name">
                <a href="#">Economics and Social Sciences</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">econ</span>
              <div class="gridItem_name">
                <a href="#">Tourism, Sport and Event Management</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">comp</span>
              <div class="gridItem_name">
                <a href="#">Computer Science and Engineering</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">Agricultural and Agro-Environmental Sciences</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">Environmental Management of Mountain Areas</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">Energy Engineering</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">International Horticultural Science</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">edu</span>
              <div class="gridItem_name">
                <a href="#">Primary Education (One Cycle – 5 years)</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">dsgn</span>
              <div class="gridItem_name">
                <a href="#">Eco-Social Design (Glocal Design)</a>
              </div>
            </li>
          <li class="navGrid_item"></li>
        </ul>
      </nav>
  </div>
</div>

<div class="navGrid_wrapper">
  <div class="l-container">
      <nav id="nav-phd" class="js-nav navGrid" data-nav-level="3">
        <ul class="nav_wrap navGrid_wrap">
            <li class="navGrid_item">
              <span class="gridItem_label">comp</span>
              <div class="gridItem_name">
                <a href="#">Computer Science</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">Mountain Environment and Agriculture</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">tech</span>
              <div class="gridItem_name">
                <a href="#">Sustainable Energy and Technologies</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">eco</span>
              <div class="gridItem_name">
                <a href="#">Management and Economics on Organizational and Institutional Outliers</a>
              </div>
            </li>
            <li class="navGrid_item">
              <span class="gridItem_label">edu</span>
              <div class="gridItem_name">
                <a href="#">General Pedagogy, Social Pedagogy and General Education</a>
              </div>
            </li>
          <li class="navGrid_item"></li>
        </ul>
      </nav>
  </div>
</div>

<div class="navGrid_wrapper">
  <div class="l-container">
      <nav id="nav-lifelong" class="js-nav navGrid" data-nav-level="3">
        <ul class="nav_wrap navGrid_wrap">
            <li class="navGrid_item">
              <span class="gridItem_label">Lorem</span>
              <div class="gridItem_name">
                <a href="#">Lorem ipsum</a>
              </div>
            </li>
          <li class="navGrid_item"></li>
        </ul>
      </nav>
  </div>
</div>

<div id="nav-mobile" class="navMobile_wrapper">
  <div class="l-container">
    <nav class="navMobile">
    	<ul class="navMobile_list">
      		<li>
            <a class="navMobile_item" href="#">University</a>
                <ul class="navMobile_second">
                    <li><a class="navMobile_link" href="#">Profile</a></li>
                    <li><a class="navMobile_link" href="#">Organisation</a></li>
                    <li><a class="navMobile_link" href="#">Cooperation</a></li>
                    <li><a class="navMobile_link" href="#">Jobs</a></li>
                    <li><a class="navMobile_link" href="#">Calls</a></li>
                    <li><a class="navMobile_link" href="#">Press</a></li>
                </ul>


          </li>
      		<li>
            <a class="navMobile_item" href="#">Faculties</a>


                <ul class="navMobile_second">
                    <li><a class="navMobile_link" href="#">Computer Science</a></li>
                    <li><a class="navMobile_link" href="#">Economics and Management</a></li>
                    <li><a class="navMobile_link" href="#">Education</a></li>
                    <li><a class="navMobile_link" href="#">Design and Art</a></li>
                    <li><a class="navMobile_link" href="#">Science and Technology</a></li>
                </ul>
          </li>
      		<li>
            <a class="navMobile_item" href="#">Study Programmes</a>

                <ul class="navMobile_second">
                    <li>
                      <a class="navMobile_item" href="#">Bachelor</a>
                          <ul class="navMobile_third">
                              <li class="navMobile_link">
                                <span class="navMobile_label">econ</span>
                                <a href="#">Economics and Management</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">econ</span>
                                <a href="#">Economics and Social Sciences</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">econ</span>
                                <a href="#">Tourism, Sport and Event Management</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">comp</span>
                                <a href="#">Computer Science and Engineering</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">Agricultural and Agro-Environmental Sciences</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">Industrial and Mechanical Engineering</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">edu</span>
                                <a href="#">Communication Sciences and Culture</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">edu</span>
                                <a href="#">Social Education</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">edu</span>
                                <a href="#">Social Work</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">dsgn</span>
                                <a href="#">Design and Art</a>
                              </li>
                          </ul>



                    </li>
                    <li>
                      <a class="navMobile_item" href="#">Master</a>

                          <ul class="navMobile_third">
                              <li class="navMobile_link">
                                <span class="navMobile_label">econ</span>
                                <a href="#">Economics and Management of the Public Sector</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">econ</span>
                                <a href="#">Economics and Social Sciences</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">econ</span>
                                <a href="#">Tourism, Sport and Event Management</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">comp</span>
                                <a href="#">Computer Science and Engineering</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">Agricultural and Agro-Environmental Sciences</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">Environmental Management of Mountain Areas</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">Energy Engineering</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">International Horticultural Science</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">edu</span>
                                <a href="#">Primary Education (One Cycle – 5 years)</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">dsgn</span>
                                <a href="#">Eco-Social Design (Glocal Design)</a>
                              </li>
                          </ul>


                    </li>
                    <li>
                      <a class="navMobile_item" href="#">PhD</a>


                          <ul class="navMobile_third">
                              <li class="navMobile_link">
                                <span class="navMobile_label">comp</span>
                                <a href="#">Computer Science</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">Mountain Environment and Agriculture</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">tech</span>
                                <a href="#">Sustainable Energy and Technologies</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">eco</span>
                                <a href="#">Management and Economics on Organizational and Institutional Outliers</a>
                              </li>
                              <li class="navMobile_link">
                                <span class="navMobile_label">edu</span>
                                <a href="#">General Pedagogy, Social Pedagogy and General Education</a>
                              </li>
                          </ul>

                    </li>
                    <li>
                      <a class="navMobile_item" href="#">Lifelong Learning</a>



                          <ul class="navMobile_third">
                              <li class="navMobile_link">
                                <span class="navMobile_label">Lorem</span>
                                <a href="#">Lorem ipsum</a>
                              </li>
                          </ul>
                    </li>
                </ul>

          </li>
        <li>
          <a class="navMobile_item" href="#">Services</a>
        </li>
    	</ul>
    </nav>
  </div>
</div>
									
								

This pattern contains: atoms-heading-5 atoms-image-4x3 atoms-text-paragraph atoms-maps molecules-social-links-white

									
										<footer class="footer">
    <div class="footer_banner">
      <div class="l-container">
        <p class="footer_bannerText">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>
  <div class="l-container">
    <h3 class="footer_title">Lorem ipsum dolor sit (37 characters)</h3>    <div class="g-row">

      <div class="g g-md-12">
          <div class="u-push-btm">
              <div class="g-row">
                <h5 class="g g-24">Lorem ipsum dolor sit (37 characters)</h5>                <div class="g g-sm-12">
                  <div class="footer_image">
                    <img class="" src="../../images/fpo_4x3.png" alt="" />                  </div>
                </div>
                <div class="g g-sm-12">
                    <p class="footer_address">Lorem</p>
                    <a class="footer_link footer_link-block" href="#">Lorem</a>
                </div>
              </div>
          </div>

          <div class="footer_section">
            <h5 class="">Lorem ipsum dolor sit (37 characters)</h5>            <p class="">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>

      <div class="g g-md-11 g-md-off-1">
          <div class="maps">
            <iframe class="maps_iframe" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2746.5067386875935!2d11.3503271!3d46.498078799999995!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47829e795d3a902d%3A0xdc939b140fa714ad!2sFree+University+of+Bozen-Bolzano!5e0!3m2!1sen!2sde!4v1442240508917" height="300" frameborder="0" style="border:0"></iframe>
          </div>      </div>
    </div>

    <div class="g-row u-push-btm">
      <div class="g g-md-12 u-push-btm u-md-push-btm-none">
          <h5 class="">Lorem ipsum dolor sit (37 characters)</h5>          <div class="social">
          	<a class="socialItem" href="#"><i class="i i-facebook-brand"></i></a>
          	<a class="socialItem" href="#"><i class="i i-twitter-brand"></i></a>
            <a class="socialItem" href="#"><i class="i i-instagram-brand"></i></a>
            <a class="socialItem" href="#"><i class="i i-linkedin-brand"></i></a>
          </div>      </div>
      <div class="g g-md-11 g-md-off-1">
          <h5 class="">Lorem ipsum dolor sit (37 characters)</h5>          <form class="footer_form" action="#">
            <input class="form_input footer_input" type="email" placeholder="Lorem">            <a href="#" class="btn btn-alt btn-medium footer_button">Lorem ipsum</a>          </form>
      </div>
    </div>

    <div class="g-row">
      <div class="g g-md-24">
            <a class="footer_link u-push-rgt" href="#">Lorem</a>
          <span>© Unibz</span>
      </div>
    </div>
  </div>
</footer>