<!DOCTYPE html>
<html dir="ltr" lang="en">
<head>
<link rel="stylesheet" type="text/css" href="/build/huds-lib.css" />
<link rel="stylesheet" type="text/css" href="/fonts/fonts.css" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
<title>Stencil Component Starter</title>
<script type="module" src="/build/huds-lib.esm.js"></script>
<script nomodule src="/build/huds-lib.js"></script>
</head>
<body class="full-width" style="padding: 0; margin: 0;">
<div class="site-header-demo-container">
<hy-site-header
logo-label="University of Helsinki"
logo-url="/"
search-button-label="Search"
data-site-header-labels='{
"menu_labels": {"open":"Open mobile menu","close":"Close mobile menu panel","expand":"Expand submenu"},
"search_labels":{"label":"Search","open":"Open search","close":"Close search"},
"language_labels":{"open":"Open language list","close":"Close language list"}}'
data-menu-language='[
{"langCode":"fi","abbr":"fin","label":"Finnish","url":"/fi"},
{"langCode":"en","abbr":"eng","label":"English","url":"/en","isActive":"true"},
{"langCode":"sv","abbr":"swe","label":"Swedish","url":"/sv"}
]'
data-menu-donate='[{"url":"#","label":"Support us"}]'
>
<hy-menu slot="menu">
<hy-menu-level-container menu-level="1">
<hy-menu-item menu-link-id="1" url="#" label="News">
<hy-menu-level-container menu-level="2">
<hy-menu-item menu-link-id="2" url="#" label="News"></hy-menu-item>
<hy-menu-item menu-link-id="3" url="#" label="Events"></hy-menu-item>
<hy-menu-item menu-link-id="4" url="#" label="Think Corner"></hy-menu-item>
<hy-menu-item menu-link-id="5" url="#" label="Unitube"></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
<hy-menu-item menu-link-id="6" url="#" label="Research" in-active-trail="true">
<hy-menu-level-container menu-level="2">
<hy-menu-item menu-link-id="7" url="#" label="Top research">
<hy-menu-level-container menu-level="3">
<hy-menu-item menu-link-id="8" url="#" label="Centres of excellence"></hy-menu-item>
<hy-menu-item menu-link-id="9" url="#" label="Academy professors"></hy-menu-item>
<hy-menu-item menu-link-id="10" url="#" label="ERC researchers and projects"></hy-menu-item>
<hy-menu-item menu-link-id="11" url="#" label="Highly cited researchers"></hy-menu-item>
<hy-menu-item menu-link-id="12" url="#" label="Strategic research areas"></hy-menu-item>
<hy-menu-item menu-link-id="13" url="#" label="Profile-building research areas"></hy-menu-item>
<hy-menu-item menu-link-id="14" url="#" label="Research impact"></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
<hy-menu-item menu-link-id="15" url="#" label="Researchers"></hy-menu-item>
<hy-menu-item menu-link-id="16" url="#" label="Fields of science"></hy-menu-item>
<hy-menu-item menu-link-id="17" url="#" label="Research groups"></hy-menu-item>
<hy-menu-item menu-link-id="18" url="#" label="Doctoral education">
<hy-menu-level-container menu-level="3">
<hy-menu-item menu-link-id="19" url="#" label="Structure of the doctoral degree"></hy-menu-item>
<hy-menu-item menu-link-id="20" url="#" label="Research skills"></hy-menu-item>
<hy-menu-item menu-link-id="21" url="#" label="Doctoral dissertation"></hy-menu-item>
<hy-menu-item
menu-link-id="22"
url="#"
label="Public examination of the doctoral dissertation"
></hy-menu-item>
<hy-menu-item menu-link-id="23" url="#" label="The research career"></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
<hy-menu-item menu-link-id="24" url="#" label="Research institutes"></hy-menu-item>
<hy-menu-item menu-link-id="25" url="#" label="Research stations"></hy-menu-item>
<hy-menu-item
menu-link-id="26"
url="#"
label="Services for researchers and research policy"
in-active-trail="true"
>
<hy-menu-level-container menu-level="3">
<hy-menu-item menu-link-id="27" url="#" label="Research infrastructures">
<hy-menu-level-container menu-level="4">
<hy-menu-item
menu-link-id="28"
url="#"
label="Research infrastructure development programme"
></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
<hy-menu-item menu-link-id="29" url="#" label="Research funding"></hy-menu-item>
<hy-menu-item menu-link-id="30" url="#" label="Data management"></hy-menu-item>
<hy-menu-item menu-link-id="31" url="#" label="Research ethics" in-active-trail="true">
<hy-menu-level-container menu-level="4">
<hy-menu-item
menu-link-id="32"
url="#"
label="Ethical Review Board in the Humanities and Social and Behavioral Sciences"
></hy-menu-item>
<hy-menu-item
menu-link-id="33"
url="#"
label="Viikki Campus Research Ethics Committee"
in-active-trail="true"
is-active="true"
></hy-menu-item>
<hy-menu-item
menu-link-id="34"
url="#"
label="Research ethics committee of the Faculty of Medicine"
></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
<hy-menu-item menu-link-id="35" url="#" label="Open science">
<hy-menu-level-container menu-level="4">
<hy-menu-item
menu-link-id="36"
url="#"
label="Open science services for researchers"
></hy-menu-item>
<hy-menu-item menu-link-id="37" url="#" label="Principles of open publishing"></hy-menu-item>
<hy-menu-item menu-link-id="38" url="#" label="Data policy"></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
<hy-menu-item menu-link-id="39" url="#" label="Commercialisation of research">
<hy-menu-level-container menu-level="4">
<hy-menu-item menu-link-id="40" url="#" label="Disclose an innovation"></hy-menu-item>
<hy-menu-item menu-link-id="41" url="#" label="Invention rights and protection"></hy-menu-item>
<hy-menu-item
menu-link-id="42"
url="#"
label="Stages of the commercialisation process"
></hy-menu-item>
<hy-menu-item
menu-link-id="43"
url="#"
label="How to fund commercialisation of research"
></hy-menu-item>
<hy-menu-item menu-link-id="44" url="#" label="Why commercialise?"></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
<hy-menu-item menu-link-id="45" url="#" label="Admissions"></hy-menu-item>
<hy-menu-item menu-link-id="46" url="#" label="Cooperation"></hy-menu-item>
<hy-menu-item menu-link-id="47" url="#" label="About us"></hy-menu-item>
<hy-menu-item menu-link-id="48" menu-item-alternative="true" url="#" label="Faculties and units">
<hy-menu-level-container menu-level="2">
<hy-menu-item menu-link-id="49" url="#" label="Faculty of Agriculture and Forestry"></hy-menu-item>
<hy-menu-item menu-link-id="50" url="#" label="Faculty of Arts"></hy-menu-item>
<hy-menu-item
menu-link-id="51"
url="#"
label="Faculty of Biological and Environmental Sciences"
></hy-menu-item>
<hy-menu-item menu-link-id="52" url="#" label="Faculty of Educational Sciences"></hy-menu-item>
<hy-menu-item menu-link-id="53" url="#" label="Faculty of Law"></hy-menu-item>
<hy-menu-item menu-link-id="54" url="#" label="Faculty of Medicine"></hy-menu-item>
<hy-menu-item menu-link-id="55" url="#" label="Faculty of Pharmacy"></hy-menu-item>
<hy-menu-item menu-link-id="56" url="#" label="Faculty of Science"></hy-menu-item>
<hy-menu-item menu-link-id="57" url="#" label="Faculty of Social Sciences"></hy-menu-item>
<hy-menu-item menu-link-id="58" url="#" label="Faculty of Theology"></hy-menu-item>
<hy-menu-item menu-link-id="59" url="#" label="Faculty of Veterinary Medicine"></hy-menu-item>
<hy-menu-item menu-link-id="50" url="#" label="Swedish School of Social Science"></hy-menu-item>
</hy-menu-level-container>
</hy-menu-item>
</hy-menu-level-container>
</hy-menu>
</hy-site-header>
</div>
<section>
<a href="#facebook_ads_example">Click here to see an example of how a company uses Facebook ads.</a>
</section>
<section>
<a href="#this-is-an-accordion-item-2--title">Click here to go to Accordion Item 2</a>
</section>
<hy-banner
text-title="Check upcoming conferences"
text-description="Take advantage of our curated list of high profile conferences near Helsinki and in the Nordics."
url="#this-is-an-accordion-item-2--title"
url-title="Show list of conferences"
sc-label="List of conferences"
>
</hy-banner>
<hy-accordion-container accordionId="example-accordion">
<hy-accordion-item accordiontitle="This is an accordion item 1">
<hy-paragraph-text>Accordion content</hy-paragraph-text>
</hy-accordion-item>
<hy-accordion-item accordiontitle="This is an accordion item 2">
<hy-paragraph-text>Accordion content</hy-paragraph-text>
</hy-accordion-item>
<hy-accordion-item accordiontitle="This is an accordion item 3">
<hy-paragraph-text>Accordion content</hy-paragraph-text>
</hy-accordion-item>
</hy-accordion-container>
<hy-key-figure-group
data-items='[{"heading":"3500 h","description":"Opetusta annettiin Helsingin yliopistossa vuonna 2019"},
{"heading":"87%","description":"Hakijoista valitsi Helsingin yliopiston ensisijaiseksi vaihtoehdoksi."},
{"heading":"4/5","description":"Key Highlight description text updated"}]'
>
</hy-key-figure-group>
<a id="facebook_ads_example">This is the Facebook ad example I want to link to.</a>
</body>
</html>