Commit 66fa9e20 authored by Ken Hawkins's avatar Ken Hawkins
Browse files

Move new homepage into position

parent 3f83666c
Pipeline #63502 canceled with stages
in 3 minutes and 6 seconds
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>The European Bioinformatics Institute &lt; EMBL-EBI</title>
<meta name="description" content="EMBL-EBI" /><!-- Describe what this page is about -->
<meta name="keywords" content="bioinformatics, europe, institute" /><!-- A few keywords that relate to the content of THIS PAGE (not the whol project) -->
<meta name="keywords" content="bioinformatics, europe, institute" />
<!-- A few keywords that relate to the content of THIS PAGE (not the whol project) -->
<meta name="author" content="EMBL-EBI" /><!-- Your [project-name] here -->
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="width" />
......@@ -17,23 +19,41 @@
<meta name="ebi:last-review" content="2017-05-02" /> <!-- The last time the content was reviewed -->
<meta name="ebi:expiry" content="2017-06-20" /> <!-- When this content is no longer relevant -->
<link rel="icon" type="image/x-icon" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/favicon.ico" />
<link rel="icon" type="image/png" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="192×192" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/android-chrome-192x192.png" /> <!-- Android (192px) -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-114x114.png" /> <!-- For iPhone 4 Retina display (114px) -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-72x72.png" /> <!-- For iPad (72px) -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-144x144.png" /> <!-- For iPad retinat (144px) -->
<link rel="apple-touch-icon-precomposed" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-57x57.png" /> <!-- For iPhone (57px) -->
<link rel="mask-icon" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/safari-pinned-tab.svg" color="#ffffff" /> <!-- Safari icon for pinned tab -->
<link rel="icon" type="image/x-icon"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/favicon.ico" />
<link rel="icon" type="image/png"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="192×192"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/android-chrome-192x192.png" />
<!-- Android (192px) -->
<link rel="apple-touch-icon-precomposed" sizes="114x114"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-114x114.png" />
<!-- For iPhone 4 Retina display (114px) -->
<link rel="apple-touch-icon-precomposed" sizes="72x72"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-72x72.png" />
<!-- For iPad (72px) -->
<link rel="apple-touch-icon-precomposed" sizes="144x144"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-144x144.png" />
<!-- For iPad retinat (144px) -->
<link rel="apple-touch-icon-precomposed"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/apple-icon-57x57.png" />
<!-- For iPhone (57px) -->
<link rel="mask-icon"
href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/safari-pinned-tab.svg"
color="#ffffff" /> <!-- Safari icon for pinned tab -->
<meta name="msapplication-TileColor" content="#2b5797" /> <!-- MS Icons -->
<meta name="msapplication-TileImage" content="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/mstile-144x144.png" />
<meta name="msapplication-TileImage"
content="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/favicons/mstile-144x144.png" />
<link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/css/ebi-global.min.css" type="text/css" media="all" />
<link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/fonts.css" type="text/css" media="all" />
<link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/css/ebi-global.min.css"
type="text/css" media="all" />
<link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Icon-fonts/v1.3/fonts.css" type="text/css"
media="all" />
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/embl-design-system/v1.0.0-alpha.2/css/styles.css" />
</head>
<body class="level2"><!-- add any of your classes or IDs -->
<body class="ebi-vf1-integration">
<!-- add any of your classes or IDs -->
<div id="skip-to">
<ul>
<li><a href="#content">Skip to main content</a></li>
......@@ -42,25 +62,10 @@
<li><a href="#global-nav-expanded">Skip to expanded EBI global navigation menu (includes all sub-sections)</a></li>
</ul>
</div>
<header id="masthead-black-bar" class="clearfix masthead-black-bar">
<nav class="row">
<ul id="global-nav" class="menu">
<!-- set active class as appropriate -->
<li class="home-mobile"><a href="//www.ebi.ac.uk"></a></li>
<li class="home active"><a href="//www.ebi.ac.uk"></a></li>
<li class="services"><a href="//www.ebi.ac.uk/services">Services</a></li>
<li class="research"><a href="//www.ebi.ac.uk/research">Research</a></li>
<li class="training"><a href="//www.ebi.ac.uk/training">Training</a></li>
<li class="about"><a href="//www.ebi.ac.uk/about">About us</a></li>
<li class="float-right show-for-medium embl-selector">
<button class="button float-right" type="button" data-toggle="embl-dropdown">Hinxton</button>
<!-- The dropdown menu will be programatically added by script.js -->
</li>
</ul>
</nav>
</header>
<header id="masthead-black-bar" class="clearfix masthead-black-bar"></header>
<div data-sticky-container>
<div id="masthead" class="masthead" data-sticky data-sticky-on="disabled" data-top-anchor="content:top" data-btm-anchor="content:bottom">
<div id="masthead" class="masthead" data-sticky data-sticky-on="disabled" data-top-anchor="content:top"
data-btm-anchor="content:bottom">
<header>
<div class="masthead-background" style="position: relative; z-index: 1; height: 380px; opacity: .7;">
<div class="row masthead-background-inner"></div>
......@@ -77,156 +82,192 @@
<div class="masthead-content">
<div class="row">
<div class="columns medium-3 white-color">
<div class="margin-top-xlarge padding-top-xlarge"><!--spacer--></div>
<img src="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/EMBL_EBI_Logo_white.svg" !inline style="width:300px;position:relative;z-index: 5;">
<div class="margin-top-xlarge padding-top-xlarge">
<!--spacer-->
</div>
<img
src="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/images/logos/EMBL-EBI/EMBL_EBI_Logo_white.svg"
!inline style="width:300px;position:relative;z-index: 5;">
<p>The home for big data in biology</p>
<div class="show-for-large margin-bottom-xlarge"><!--spacer--></div>
<div class="show-for-large margin-bottom-xlarge">
<!--spacer-->
</div>
</div>
<div class="columns show-for-medium medium-9" style="">
<div class="margin-top-xlarge padding-top-xlarge"><!--spacer--></div>
<div class="float-right show-for-medium visulisation-legend hidden">
<h1 class="vf-text vf-text-heading--1 vf-text--invert vf-u-margin__bottom--sm"><a href="//www.ebi.ac.uk/about/our-impact" style="border-bottom: none;">25 Years of EMBL-EBI</a></h1>
<div class="vf-text vf-text-body--5 vf-u-padding__left--sm">
<a class="vf-link readmore" href="//www.ebi.ac.uk/about/our-impact" style="border-bottom: none;"><i class="icon icon-common icon-video"></i> In Focus: Exploring innovation in the life sciences</a>
</div>
<div class="margin-top-xlarge padding-top-xlarge">
<!--spacer-->
</div>
<div class="float-right show-for-medium visulisation-legend">
<!-- <h1 class="vf-text vf-text-heading--1 vf-text--invert vf-u-margin__bottom--sm"><a href="//www.ebi.ac.uk/about/our-impact" style="border-bottom: none;">Innovation in the life sciences </a></h1> -->
<!-- <div class="vf-text vf-text-body--5 vf-u-padding__left--sm">
<a class="vf-link readmore" href="//www.ebi.ac.uk/about/our-impact" style="border-bottom: none;"><i class="icon icon-common icon-video"></i> Videos on the future of bioinformatics and related fields</a>
</div> -->
</div>
<style type="text/css">
.description-wrapper {
min-height: 4.3rem;
}
.masthead {
background-color: rgb(0,0,0); margin-top: 0px; bottom: auto; top: 0px; max-width: 100%;
height: 380px;
overflow: hidden;
}
.masthead-inner{
padding-top:0; position: relative; z-index: 4; top: -1180px; margin-bottom: -400px; text-shadow: 1px 1px 3px #000;
}
.masthead-inner .callout,
.masthead-inner .button {
text-shadow: none;
}
iframe.masthead-background-inner {
margin-top: -130px;
height: 530px
}
.visulisation-legend {
color: #fff;
margin-right: 2rem;
}
.visulisation-legend .headline,
/*.visulisation-legend .readmore,*/
.visulisation-legend .description {
color: #fff;
background: #222;
display: inline-block;
padding: 0 .5rem;
font-family: monospace;
float: right;
clear: right;
}
.visulisation-legend .readmore {
/*font-family: monospace;*/
/*font-size: 1.2rem;*/
padding-right: .5rem;
float: right;
}
.visulisation-legend .description {
font-size: 1.3rem;
}
/*.visulisation, .visulisation iframe { border:0; width: 800px; height: 315px; overflow: hidden; }*/
@media screen and (min-width: 40rem) {
.masthead-background-inner {
background-size: 1300px;
background-position: 100% 100%;
height: 380px;
.description-wrapper {
min-height: 4.3rem;
}
.masthead .with-overlay .caption {
width: 100%;
padding: 5%;
color: #fff;
opacity: 1;
min-height: 380px;
background-size: 100%;
background-position: 100% 60%;
background-repeat: no-repeat;
.masthead {
background-color: rgb(0, 0, 0);
margin-top: 0px;
bottom: auto;
top: 0px;
max-width: 100%;
height: 380px;
overflow: hidden;
}
.masthead .with-overlay.background-1 .caption {
background-image: url(/front-page-archive/201909/annual-report-2018-frame-1.jpg);
animation-duration: 100s;
animation-timing-function: linear;
/* disable animation until we have new text
animation-name: fader1;
*/
animation-iteration-count: infinite;
.masthead-inner {
padding-top: 0;
position: relative;
transform: translate(-1em);
z-index: 4;
top: -1180px;
margin-bottom: -400px;
text-shadow: 1px 1px 3px #000;
}
.masthead .with-overlay.background-2 .caption {
background-image: url(/front-page-archive/201909/annual-report-2018-frame-2.jpg);
mix-blend-mode: multiply;
animation-duration: 5s;
animation-timing-function: linear;
/* disable animation until we have new text
animation-name: fader2;
*/
animation-iteration-count: infinite;
opacity: 0;
position: relative;
transform: translate(0);
.masthead-inner .callout,
.masthead-inner .button {
text-shadow: none;
}
}
@keyframes fader1 {
0% {
transform: translate(0em);
iframe.masthead-background-inner {
margin-top: -130px;
height: 530px
}
25% {
transform: translate(-1em);
.visulisation-legend {
color: #fff;
margin-right: 2rem;
}
50% {
transform: translate(0em);
.visulisation-legend .headline,
/*.visulisation-legend .readmore,*/
.visulisation-legend .description {
color: #fff;
background: #222;
display: inline-block;
padding: 0 .5rem;
font-family: monospace;
float: right;
clear: right;
}
75% {
transform: translate(1em);
.visulisation-legend .readmore {
/*font-family: monospace;*/
/*font-size: 1.2rem;*/
padding-right: .5rem;
float: right;
}
100% {
transform: translate(0em);
.visulisation-legend .description {
font-size: 1.3rem;
}
}
@keyframes fader2 {
0% {
opacity: 0;
transform: translate(0em);
background-size: 100%;
/*.visulisation, .visulisation iframe { border:0; width: 800px; height: 315px; overflow: hidden; }*/
@media screen and (min-width: 40rem) {
.masthead-background {
/*background-color: #222;*/
}
.masthead-background-inner {
background-size: 1300px;
background-position: 100% 100%;
height: 380px;
}
.masthead .with-overlay .caption {
width: 100%;
padding: 5%;
color: #fff;
opacity: 1;
min-height: 380px;
background-size: 100%;
background-position: 100% 60%;
background-repeat: no-repeat;
}
.masthead .with-overlay.background-1 .caption {
background-image: url(//www.ebi.ac.uk/front-page-archive/201909/annual-report-2018-frame-1.jpg);
animation-duration: 100s;
animation-timing-function: linear;
animation-name: fader1;
animation-iteration-count: infinite;
position: relative;
transform: translate(-1em);
}
.masthead .with-overlay.background-2 .caption {
background-image: url(/front-page-archive/201909/annual-report-2018-frame-2.jpg);
mix-blend-mode: multiply;
animation-duration: 5s;
animation-timing-function: linear;
animation-name: fader2;
animation-iteration-count: infinite;
opacity: 0;
position: relative;
transform: translate(0);
}
}
50% {
opacity: .15;
transform: translate(.1em);
background-size: 130%;
@keyframes fader1 {
0% {
transform: translate(0em);
}
25% {
transform: translate(-1em);
}
50% {
transform: translate(0em);
}
75% {
transform: translate(1em);
}
100% {
transform: translate(0em);
}
}
100% {
opacity: 0;
transform: translate(5em);
background-size: 150%;
@keyframes fader2 {
0% {
opacity: 0;
transform: translate(0em);
background-size: 100%;
}
50% {
opacity: .15;
transform: translate(.1em);
background-size: 130%;
}
100% {
opacity: 0;
transform: translate(5em);
background-size: 150%;
}
}
}
@media screen and (max-width: 64em) {
.visulisation-legend {
float: left;
@media screen and (max-width: 64em) {
.visulisation-legend {
float: left;
}
}
}
</style>
</div>
</div>
<div class="row padding-top-xlarge padding-bottom-xlarge">
<div class="columns small-12 large-7 medium-6">
<span class="label show-for-small-only white-color">EBI Search</span>
<p class="show-for-medium">Our unique Search service helps you explore dozens of biological data resources. <span class="show-for-large inline-block"><a class="readmore" href="/ebisearch/overview.ebi">More about EBI Search</a></span>
<p class="show-for-medium">Our unique Search service helps you explore dozens of biological data
resources. <span class="show-for-large inline-block"><a class="readmore"
href="/ebisearch/overview.ebi">More about EBI Search</a></span>
</p>
<form id="ebi_search" action="/ebisearch/search.ebi" data-abide novalidate>
<fieldset>
......@@ -255,13 +296,16 @@
</select>
</div>
<div class="columns small-8 margin-bottom-none search-text-wrapper">
<input id="query" class="margin-bottom-none" title="EBI Search" tabindex="2" type="text" name="query" value="" size="35" maxlength="2048" placeholder="Find a gene, protein or chemical" required>
<input id="query" class="margin-bottom-none" title="EBI Search" tabindex="2" type="text"
name="query" value="" size="35" maxlength="2048"
placeholder="Find a gene, protein or chemical" required>
<span class="form-error margin-top-small">
You need to enter a search query.
</span>
</div>
<div class="columns small-2 margin-bottom-none">
<input id="search_submit" class="button icon icon-functional margin-bottom-none" tabindex="3" type="submit" name="submit1" value="1" style="line-height:.9">
<input id="search_submit" class="button icon icon-functional margin-bottom-none" tabindex="3"
type="submit" name="submit1" value="1" style="line-height:.9">
</div>
<!-- <input id="allebi" type="hidden" name="db" value="allebi" checked="checked" /> -->
<input type="hidden" name="requestFrom" value="ebi_index">
......@@ -269,7 +313,10 @@
</fieldset>
<fieldset>
<div id="example" class="medium-push-2 medium-10 columns small">
Example searches: <a href="/ebisearch/search.ebi?db=allebi&amp;requestFrom=ebi_index&amp;query=blast">blast</a> <a href="/ebisearch/search.ebi?db=allebi&amp;query=keratin&amp;requestFrom=ebi_index">keratin</a> <a href="/ebisearch/search.ebi?db=allebi&amp;query=bfl1&amp;requestFrom=ebi_index">bfl1</a>
Example searches: <a
href="/ebisearch/search.ebi?db=allebi&amp;requestFrom=ebi_index&amp;query=blast">blast</a> <a
href="/ebisearch/search.ebi?db=allebi&amp;query=keratin&amp;requestFrom=ebi_index">keratin</a>
<a href="/ebisearch/search.ebi?db=allebi&amp;query=bfl1&amp;requestFrom=ebi_index">bfl1</a>
</div>
</fieldset>
</form>
......@@ -277,20 +324,28 @@
<div class="columns large-2 medium-3 show-for-medium">
<div>
<p>Find a tool for your data analysis.</p>
<a href="//www.ebi.ac.uk/services/" class="button readmore" style="border-bottom: none;line-height: .9;"><i class="icon icon-generic" data-icon="("></i> Find a tool</a>
<a href="//www.ebi.ac.uk/services/" class="button readmore"
style="border-bottom: none;line-height: .9;"><i class="icon icon-generic" data-icon="("></i> Find
a tool</a>
</div>
</div>
<div class="columns large-2 medium-3 small-6 show-for-medium">
<div>
<p>Share your scientific data with the world.</p>
<a href="//www.ebi.ac.uk/submission/" class="button readmore" style="border-bottom: none;line-height: .9;"><i class="icon icon-functional" data-icon="D"></i> Deposit data</a>
<a href="//www.ebi.ac.uk/submission/" class="button readmore"
style="border-bottom: none;line-height: .9;"><i class="icon icon-functional" data-icon="D"></i>
Deposit data</a>
</div>
</div>
<div class="columns small-12 show-for-small-only padding-top-large">
<span class="label show-for-small-only white-color">Access and share data</span>
<div>
<a href="//www.ebi.ac.uk/services/" class="button no-underline readmore" style="border-bottom: none;line-height: .9;"><i class="icon icon-generic" data-icon="("></i> Find a tool</a>
<a href="//www.ebi.ac.uk/submission/" class="button no-underline readmore" style="border-bottom: none;line-height: .9;"><i class="icon icon-generic" data-icon="q"></i> Deposit data</a>
<a href="//www.ebi.ac.uk/services/" class="button no-underline readmore"
style="border-bottom: none;line-height: .9;"><i class="icon icon-generic" data-icon="("></i> Find
a tool</a>
<a href="//www.ebi.ac.uk/submission/" class="button no-underline readmore"
style="border-bottom: none;line-height: .9;"><i class="icon icon-generic" data-icon="q"></i>
Deposit data</a>
</div>
</div>
</div>
......@@ -311,108 +366,230 @@
<div class="row medium-up-2 large-up-3" data-equalizer>
<a href="//www.ebi.ac.uk/about/our-impact" class="column no-underline" data-equalizer-watch>
<p><h3 class="black-color margin-bottom-none"><div class="inline-block">We are EMBL-EBI</div></h3>
<p>The European Bioinformatics Institute (EMBL-EBI) is part of EMBL, Europe’s flagship laboratory for the life sciences. More about EMBL-EBI and our impact.&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
<p>
<h3 class="black-color margin-bottom-none">
<div class="inline-block">We are EMBL-EBI</div>
</h3>
<p>The European Bioinformatics Institute (EMBL-EBI) is part of EMBL, Europe’s flagship laboratory for the life sciences. More about EMBL-EBI and our impact.&nbsp;<i class="icon icon-functional"
data-icon=">"></i></p>
</p>
</a>
<a href="//www.ebi.ac.uk/services" class="column no-underline padding-top-medium" data-equalizer-watch>
<p><h4 class="services-color"><span class="icon icon-generic" data-icon="("></span> <div class="inline-block">Data resources</div></h4>
<p>Explore our open data resources to enrich your research. Browse data, perform analyses or share your own results.&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
<p>
<h4 class="services-color"><span class="icon icon-generic" data-icon="("></span>
<div class="inline-block">Data resources</div>
</h4>
<p>Explore our open data resources to enrich your research. Browse data, perform analyses or share your own results.&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
</p>
</a>
<a href="//www.ebi.ac.uk/research" class="column no-underline padding-top-medium" data-equalizer-watch>
<p><h4 class="research-color"><span class="icon icon-generic" data-icon=")"></span> <div class="inline-block">Research</div></h4>
<p>Find out about our research groups, postdoctoral schemes and PhD Programme&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
<p>
<h4 class="research-color"><span class="icon icon-generic" data-icon=")"></span>
<div class="inline-block">Research</div>
</h4>
<p>Find out about our research groups, postdoctoral schemes and PhD Programme&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
</p>
</a>
<a href="//www.ebi.ac.uk/training" class="column no-underline padding-top-medium" data-equalizer-watch>
<p><h4 class="training-color"><span class="icon icon-generic" data-icon="t"></span> <div class="inline-block">Training</div></h4>
<p>Access a wealth of world-leading training in bioinformatics and scientific service provision, regardless of your career stage or sector&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
<p>
<h4 class="training-color"><span class="icon icon-generic" data-icon="t"></span>
<div class="inline-block">Training</div>
</h4>
<p>Access a wealth of world-leading training in bioinformatics and scientific service provision,
regardless of your career stage or sector&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
</p>
</a>
<a href="//www.ebi.ac.uk/industry" class="column no-underline padding-top-medium" data-equalizer-watch>
<p><h4 class="industry-color"><span class="icon icon-generic" data-icon="I"></span> <div class="inline-block">Industry</div></h4>
<p>Explore our knowledge-exchange Industry Programme and take part in translational partnerships and projects&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
<p>
<h4 class="industry-color"><span class="icon icon-generic" data-icon="I"></span>
<div class="inline-block">Industry</div>
</h4>
<p>Explore our knowledge-exchange Industry Programme and take part in translational partnerships and
projects&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
</p>
</a>
<a href="https://www.elixir-europe.org" class="column no-underline padding-top-medium" data-equalizer-watch>
<p><h4 class="elixir-color"><span class="icon icon-generic" data-icon="%"></span> <div class="inline-block">ELIXIR</div></h4>
<p>We support, as an ELIXIR node, the coordination of biological data provision throughout Europe&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
<p>
<h4 class="elixir-color"><span class="icon icon-generic" data-icon="%"></span>
<div class="inline-block">ELIXIR</div>
</h4>
<p>We support, as an ELIXIR node, the coordination of biological data provision throughout
Europe&nbsp;<i class="icon icon-functional" data-icon=">"></i></p>
</p>
</a>
</div>
</div>
</div>
<div class="medium-4 columns callout analytics-content-left">
<style>
.vf-link--white,
.vf-link--white:hover,
.vf-link--white:visited {
color: #fff
}
</style>
<div class="row padding-bottom-xlarge" style="position: relative;">
<div class="medium-8 columns | analytics-content-left"
style=" position: -webkit-sticky; position: sticky; top:0">
<h3><a href="//www.ebi.ac.uk/about/news" class="no-underline">Featured topics</a></h3>
<div class="vf-u-background-color--bright-green--dark padding-bottom-large"
style="background: rgb(73,140,134);">
<a href="https://www.youtube.com/watch?v=fWEcGouKmYQ&feature=emb_title"><img class="orbit-image"
src="//www.ebi.ac.uk/about/our-impact/video-teaser--public-private-partnerships.jpg"
alt="Thought leader video still"></a>
<div class="vf-u-text-color--ui--white">
<div class="vf-u-margin__top--lg vf-u-margin__right--xl vf-u-margin__left--xl ">
<quote class="vf-text--body vf-text-body--1">
<p>To find new ways of creating medicine, producing food and safeguarding biodiversity, academia and
the private sector need to work together.</p>
</quote>
<p class="vf-figure__captionx | vf-u-text-color--ui--white">
<a href="https://www.ebi.ac.uk/about/jobs/career-profiles/jessica-vamathevan"
class="vf-link vf-link--white">Jessica Vamathevan</a>, Head of EMBL-EBI's Strategic Partnership
Office, explains the challenges and potential of public-private partnerships for science. <a
class="vf-link vf-link--white"
href="https://www.youtube.com/playlist?list=PLs84PsexbuAgRUuWCzrQe5E7l50deBc2J&x">Watch more videos
from the In Focus series</a>.
</p>
</div>
</div>
</div>
</div>
<div class="medium-4 columns analytics-content-right">
<h3><a href="//www.ebi.ac.uk/about/news" class="no-underline">Latest news</a></h3>
<span class="label">Research highlights, service updates and more</span>
<div class="row collapse">
<div class="with-overlay">
<!-- <img src="//www.ebi.ac.uk/sites/ebi.ac.uk/files/styles/large/public/groups/external_relations/images/News/EMPIAR_news_21_03_2016_EBI.jpg?itok=Y5aDjbJy" alt="Photo of Uranus."> -->
<div id="news-lead-item"></div>
</div>
</div>
<div id="news-updates"></div>
<div class="margin-top-large margin-bottom-xlarge ">
<a class="readmore button margin-bottom-none" href="//www.ebi.ac.uk/about/news/">Read all EMBL-EBI news</a><br/>
<a class="readmore small" href="//news.embl.de">News from across EMBL </a><br/>
<div class="margin-top-large margin-bottom-small">
<a class="vf-button vf-button--secondary vf-button--sm" href="//www.ebi.ac.uk/about/news/">Read all EMBL-EBI news</a><br />
</div>
</div>
<div class="medium-8 columns analytics-content-right">
<h3 class="padding-top-large"><a href="//www.ebi.ac.uk/about/events" class="no-underline">Our events</a></h3>
<h3 class="padding-top-small"><a href="//www.ebi.ac.uk/about/events" class="no-underline">Our events</a></h3>
<div id="upcoming-events">
<!-- loaded by handlebars -->
</div>
<a class="readmore button margin-top-large margin-bottom-xlarge" href="//www.ebi.ac.uk/about/events">See all EMBL-EBI events</a>
<a class="vf-button vf-button--secondary vf-button--sm" href="//www.ebi.ac.uk/about/events">See all EMBL-EBI events</a>
</div>
</div>
<div class="row analytics-content-footer">
<h3 class="show-for-large"><a href="//www.ebi.ac.uk/about" class="readmore no-underline">About EMBL-EBI's culture and impact</a></h3>
<div class="row large-up-5 medium-up-3 small-up-2 padding-bottom-large " data-equalizer data-equalize-on="small" >
<div class="column">
<a href="//www.ebi.ac.uk/about/jobs">
<img src="//www.ebi.ac.uk/sites/ebi.ac.uk/files/styles/large/public/groups/external_relations/images/Events/all-at-ebi_stepping_down_EBI.jpg" alt="Staff outside Hindton Hall.">
</a>