index.html 32.2 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>Our impact | European Bioinformatics Institute</title>
  <meta name="description" content="Read about the impact of EMBL-EBI on society and the economy: reports, facts and figures" />
  <meta name="keywords" content="impact, innovation, translation, Industry, annual report" />
  <meta name="author" content="EMBL-EBI" /><!-- Your [project-name] here -->
  <meta name="HandheldFriendly" content="true" />
  <meta name="MobileOptimized" content="width" />
  <meta name="viewport" content="width=device-width,initial-scale=1" />
  <meta name="theme-color" content="#70BDBD" /> <!-- Android Chrome mobile browser tab color -->

  <!-- Add information on the life cycle of this page -->
  <meta name="ebi:owner" content="External Relations" /> <!-- Who should be contacted about changes -->
  <meta name="ebi:review-cycle" content="90" /> <!-- In days, how often should the content be reviewed -->
  <meta name="ebi:last-review" content="2018-04-09" /> <!-- The last time the content was reviewed -->

  <!-- If you link to any other sites frequently, consider optimising performance with a DNS prefetch -->
  <link rel="dns-prefetch" href="//www.ebi.ac.uk" />

  <!-- If you have custom icon, replace these as appropriate.
       You can generate them at realfavicongenerator.net -->
  <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" />

  <!-- CSS: implied media=all -->
  <!-- CSS concatenated and minified via ant build script-->
  <link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/css/ebi-global.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" />

  <!-- Use this CSS file for any custom styling -->
  <!--
    <link rel="stylesheet" href="css/custom.css" type="text/css" media="all" />
  -->

  <meta name="ebi:masthead-color" content="#000000" />
  <meta name="ebi:masthead-image" content="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.1/images/backgrounds/embl-ebi-background-4.jpg" />
  <meta name="twitter:card" content="summary_large_image" />
  <meta name="twitter:site" content="@emblebi" />
  <meta name="twitter:site:id" content="123582098" />
  <meta name="twitter:creator" content="@emblebi" />
  <meta name="twitter:creator:id" content="123582098" />
  <meta name="twitter:title" content="Our impact" />
  <meta name="twitter:url" content="https://www.ebi.ac.uk/about/our-impact" />
  <meta name="twitter:description" content="Read about the impact of EMBL-EBI on society and the economy: reports, facts and figures" />


  <!-- you can replace this with theme-[projectname].css. See http://www.ebi.ac.uk/web/style/colour for details of how to do this -->
  <!-- also inform ES so we can host your colour palette file -->
  <link rel="stylesheet" href="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/css/theme-embl-petrol.css" type="text/css" media="all" />
  <!-- end CSS-->
</head>

63
<body class="level2 embl-compatibility-ebivf  ebi-vf1-integration"><!-- add any of your classes or IDs -->
64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145
  <div id="skip-to">
    <ul>
      <li><a href="#content">Skip to main content</a></li>
      <li><a href="#local-nav">Skip to local navigation</a></li>
      <li><a href="#global-nav">Skip to EBI global navigation menu</a></li>
      <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"><a href="//www.ebi.ac.uk">EMBL-EBI</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 active"><a href="//www.ebi.ac.uk/about">About us</a></li>
        <li class="search">
          <a href="#" data-toggle="search-global-dropdown"><span class="show-for-small-only">Search</span></a>
          <div id="search-global-dropdown" class="dropdown-pane" data-dropdown data-options="closeOnClick:true;">
          <!-- The dropdown menu will be programatically added by script.js -->
          </div>
        </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>
  <div data-sticky-container>
    <header id="masthead" class="masthead" data-sticky data-sticky-on="large" data-top-anchor="content:top" data-btm-anchor="content:bottom">
      <div class="masthead-inner row">
        <!-- local-title -->
        <div class="columns medium-12" id="local-title">
          <h1><a href="/about" title="Back to About us">About us</a></h1>
        </div>
        <!-- /local-title -->
        <!-- local-nav -->
        <nav>
          <ul id="local-nav" class="dropdown menu float-left" data-description="navigational">
            <li class="active-trail last active first"><a href="/about" class="active-trail active">Overview</a></li>
            <li class=""><a href="/about/jobs" title="Opportunities at EMBL-EBI">Jobs</a></li>
            <li class=""><a href="/about/people" title="Staff directory">People &amp; groups</a></li>
            <li class=""><a href="/about/news" title="">News</a></li>
            <li class=""><a href="/about/events">Events</a></li>
            <li class=""><a href="/about/contact" title="Contact External Relations">Contact us</a></li>
          </ul>
        </nav>
        <!-- /local-nav -->
      </div>
    </header>
  </div>
  <div id="content">
    <!-- Suggested layout containers -->
    <section id="main-content-area" class="" role="main">
      <!-- Your menu structure should make a breadcrumb redundant, but if a breadcrump is needed uncomment the below -->
      <!-- <nav aria-label="You are here:" role="navigation">
        <ul class="breadcrumbs">
          <li><a href="../../">EBI Framework</a></li>
          <li><a href="../">Sample pages</a></li>
          <li>
            <span class="show-for-sr">Current: </span> Blank boilerplate
          </li>
        </ul>
      </nav> -->

      <!-- Content updates https://docs.google.com/document/d/1jzdtrkrA6TLC6oG2VipOKA6NqYo-pbu9Wf3ptsJDzMI/edit -->


      <!--.l-main -->
      <main id="main-content-area" role="main" class="row l-main">

        <div class="secondary-menu vf-u-padding__top--sm">
          <div class="menu-block-wrapper menu-block-4 menu-name-main-menu parent-mlid-0 menu-level-3">
          <ul class="menu menu-tree-menu"><li class="first leaf has-children menu-mlid-3057"><a href="/about/leadership" title="Leadership and guidance structure">Leadership</a></li>
          <li class="leaf menu-mlid-3075"><a href="/about/funding" title="Funding of EMBL-EBI">Funding</a></li>
          <li class="leaf menu-mlid-3079"><a href="/about/background" title="History of EMBL-EBI">Background</a></li>
          <li class="leaf has-children menu-mlid-3076"><a href="/about/collaborations" title="EMBL-EBI partnerships">Collaborations</a></li>
          <li class="leaf has-children active-trail active menu-mlid-14438"><a href="/about/our-impact" title="Impact: reports, facts and figures" class="active-trail active">Our impact</a></li>
Ken Hawkins's avatar
Ken Hawkins committed
146
          <li class="leaf has-children "><a href="/about/digital-bookshelf" title="Digital bookshelf" class="">Digital Bookshelf</a></li>
147 148 149 150 151 152 153 154
          <li class="last leaf has-children menu-mlid-14440"><a href="/about/equality-in-science">Equality and Diversity</a></li>
          </ul></div>
        </div>

      <!-- Beta banner -->
      <link rel="import" href="https://dev.beta.embl.org/api/v1/pattern.html?filter-content-type=article&filter-id=9102&pattern=node-body&source=contenthub" data-target="self" data-embl-js-content-hub-loader>

      <!-- Videos -->
Ken Hawkins's avatar
Ken Hawkins committed
155
      <section class="vf-intro | embl-grid embl-grid--has-centered-content vf-u-margin__bottom--xl">
Ken Hawkins's avatar
Ken Hawkins committed
156 157 158 159 160
        <div>
          <!-- <h4 class="vf-text vf-text-heading--3 vf-u-margin__top--sm">EMBL-EBI <span class="nowrap">at 25 years</span></h4> -->
        </div>
        <div>
          <h1 class="black-color vf-intro__heading">EMBL-EBI at 25 years</h1>
Ken Hawkins's avatar
Ken Hawkins committed
161
          <p class="vf-lede">To mark the 25th anniversary of EMBL-EBI, we looked back at the <a href="https://www.ebi.ac.uk/about/news/feature-story/25-anniversary-embl-ebi">early days of the institute</a> and we asked some of our colleagues to share their thoughts about the future of bioinformatics and related fields.</p>
Ken Hawkins's avatar
Ken Hawkins committed
162

163 164
          <a href="#" data-open="videoModal-5">
            <img class="orbit-image" src="/about/our-impact/video-teaser--public-private-partnerships.jpg" !inline alt="Thought leader video still">
Ken Hawkins's avatar
Ken Hawkins committed
165
          </a>
Ken Hawkins's avatar
Ken Hawkins committed
166
          <figcaption class="vf-text vf-text-body--4"><a href="#" data-open="videoModal-5">In Focus: Public-private partnerships; <span class="vf-link">watch the video</a>.</figcaption>
Ken Hawkins's avatar
Ken Hawkins committed
167 168 169 170

          <!-- This demo uses flex grid but you can use float grid too -->
          <div class="orbit" role="region" aria-label="EMBL-EBI Thought leaders">
            <nav class="orbit-bullets">
171 172 173 174
              <button  data-open="videoModal-5">
                <img src="/about/our-impact/video-teaser--public-private-partnerships.jpg" !inline alt="In Focus: Public-private partnerships">
                <span class="vf-text vf-text-body--4"> <span class="nowrap">Public-private partnerships</span></span><span class="show-for-sr">Current Slide</span>
              </button>
Ken Hawkins's avatar
Ken Hawkins committed
175
              <button  data-open="videoModal-4">
176
                <img src="/about/our-impact/video-teaser--big-data.jpg" !inline alt="In Focus: Big data infrastructure">
Ken Hawkins's avatar
Ken Hawkins committed
177 178
                <span class="vf-text vf-text-body--4"> <span class="nowrap">Big data infrastructure</span></span><span class="show-for-sr">Current Slide</span>
              </button>
Ken Hawkins's avatar
Ken Hawkins committed
179
              <button  data-open="videoModal-3">
180
                <img src="/about/our-impact/video-teaser--data-analysis.jpg" !inline alt="In Focus: Metagenomics analysis">
Ken Hawkins's avatar
Ken Hawkins committed
181
                <span class="vf-text vf-text-body--4"> <span class="nowrap">Metagenomics analysis</span></span><span class="show-for-sr">Current Slide</span>
Ken Hawkins's avatar
Ken Hawkins committed
182
              </button>
Ken Hawkins's avatar
Ken Hawkins committed
183
              <button  data-open="videoModal-2">
184
                <img src="/about/our-impact/video-teaser--bioinformatics-training.jpg" !inline alt="In Focus: Bioinformatics training">
Ken Hawkins's avatar
Ken Hawkins committed
185 186 187
                <span class="vf-text vf-text-body--4"> <span class="nowrap">Bioinformatics training</span></span><span class="show-for-sr">Current Slide</span>
              </button>
              <button data-open="videoModal-0">
188
                <img src="/about/our-impact/video-teaser.jpg" !inline alt="In Focus: Scientific publishing">
Ken Hawkins's avatar
Ken Hawkins committed
189
                <span class="vf-text vf-text-body--4"> <span class="nowrap">Scientific publishing</span></span><span class="show-for-sr">Current Slide</span>
190
              </button>
Ken Hawkins's avatar
Ken Hawkins committed
191
              <button  data-open="videoModal-1">
192
                <img src="/about/our-impact/video-teaser--drug-discovery.jpg" !inline alt="In Focus: Drug discovery">
Ken Hawkins's avatar
Ken Hawkins committed
193
                <span class="vf-text vf-text-body--4"> <span class="nowrap">Drug discovery</span></span><span class="show-for-sr">Current Slide</span>
Ken Hawkins's avatar
Ken Hawkins committed
194 195 196
              </button>
            </nav>
          </div>
197

Ken Hawkins's avatar
Ken Hawkins committed
198 199 200 201 202 203 204 205 206 207 208 209 210 211 212
          <style>
            /* some tweaks to the foundation orbit style */
            .orbit-bullets {
              /* position: relative; */
              /* margin-top: 0.8rem; */
              margin-bottom: 5.8rem;
              text-align: unset;
            }
            /* [data-whatinput='mouse'] .orbit-bullets {
              outline: 0; } */
            .orbit-bullets button {
              /* width: 1.2rem; */
              /* height: 1.2rem; */
              /* margin: 0.1rem; */
              border-radius: 0;
213
              min-width: 12rem;
Ken Hawkins's avatar
Ken Hawkins committed
214 215
              /* opacity: .5; */
              /* background-color: #777;  */
216 217 218
              margin-bottom: 2em;
              height: 100%;
              background: none;
Ken Hawkins's avatar
Ken Hawkins committed
219
            }
Ken Hawkins's avatar
Ken Hawkins committed
220 221 222 223 224 225 226 227
            .orbit-bullets button:hover {
              background-color: none;
              opacity: 1;
              cursor: pointer;
             }
            .orbit-bullets button.is-active {
              background-color: none;
              opacity: 1;
Ken Hawkins's avatar
Ken Hawkins committed
228
            }
Ken Hawkins's avatar
Ken Hawkins committed
229 230 231 232 233 234 235 236 237 238
          </style>

          <!-- https://embedresponsively.com/ -->
          <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>

          <div class="reveal" id="videoModal-0" style="width: 80%;" data-reveal>
            <div class='embed-container'><iframe src='https://www.youtube.com/embed/0H0v3RMY6eg' frameborder='0' allowfullscreen></iframe></div>
            <button class="close-button" data-close aria-label="Close modal" type="button">
              <span aria-hidden="true">&times;</span>
            </button>
239
          </div>
Ken Hawkins's avatar
Ken Hawkins committed
240 241 242 243 244 245 246 247

          <div class="reveal" id="videoModal-1" style="width: 80%;" data-reveal>
            <div class='embed-container'><iframe src='https://www.youtube.com/embed/7P7YoBEKP5w' frameborder='0' allowfullscreen></iframe></div>
            <button class="close-button" data-close aria-label="Close modal" type="button">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>

Ken Hawkins's avatar
Ken Hawkins committed
248 249 250 251 252 253 254
          <div class="reveal" id="videoModal-2" style="width: 80%;" data-reveal>
            <div class='embed-container'><iframe src='https://www.youtube.com/embed/uVP0uSMx2o8' frameborder='0' allowfullscreen></iframe></div>
            <button class="close-button" data-close aria-label="Close modal" type="button">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>

Ken Hawkins's avatar
Ken Hawkins committed
255 256 257 258 259 260 261
          <div class="reveal" id="videoModal-3" style="width: 80%;" data-reveal>
            <div class='embed-container'><iframe src='https://www.youtube.com/embed/pKQoud35RgQ' frameborder='0' allowfullscreen></iframe></div>
            <button class="close-button" data-close aria-label="Close modal" type="button">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>

Ken Hawkins's avatar
Ken Hawkins committed
262 263 264 265 266 267 268
          <div class="reveal" id="videoModal-4" style="width: 80%;" data-reveal>
            <div class='embed-container'><iframe src='https://www.youtube.com/embed/sTAhG9b_S4Y' frameborder='0' allowfullscreen></iframe></div>
            <button class="close-button" data-close aria-label="Close modal" type="button">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>

269 270 271 272 273 274 275
          <div class="reveal" id="videoModal-5" style="width: 80%;" data-reveal>
            <div class='embed-container'><iframe src='https://www.youtube.com/embed/fWEcGouKmYQ' frameborder='0' allowfullscreen></iframe></div>
            <button class="close-button" data-close aria-label="Close modal" type="button">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>

Ken Hawkins's avatar
Ken Hawkins committed
276 277 278 279 280 281 282 283 284 285 286 287 288 289
          <style>
          /* modal tweaks */
          .reveal  {
            padding-top: 38px;
          }
          .reveal .close-button:before {
            content: "close";
            font-size: 17px;
            bottom: 5px;
            position: relative;
          }
          </style>

        </div>
290 291 292
      </section>


Ken Hawkins's avatar
Ken Hawkins committed
293
      <!-- Intro -->
Ken Hawkins's avatar
Ken Hawkins committed
294
      <section class="vf-intro | embl-grid embl-grid--has-centered-content vf-u-margin__top--">
Ken Hawkins's avatar
Ken Hawkins committed
295 296 297 298 299 300 301 302 303 304 305 306 307
        <div>
          <!-- empty -->
        </div>
        <div>
          <h1 class="black-color vf-intro__heading">EMBL-EBI: Our impact</h1>

          <p class="vf-lede">We collaborate with scientists and engineers all over the world, and provide the infrastructure needed to share data openly in the life sciences.</p>

          <p class="vf-intro__text">Understanding how genetics affects the health of humans, plants and animals is essential to advances in disease prevention, food security and biodiversity.</p>

          <p class="vf-intro__text">We develop databases, tools and software that make it possible to align, verify and visualise the diverse data produced in publicly-funded research, and make that information freely available to all.</p>
        </div>
      </section>
308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405



      <!-- Facts and figures -->
      <section class="embl-grid embl-grid--has-centered-content">
      <div>
        <h4 class="vf-text vf-text-heading--3 vf-u-margin__top--">EMBL-EBI <span class="nowrap">at a glance</span></h4>
        <!-- <span class="vf-text">EMBL-EBI at a glance</span> -->
      </div>


      <div class="">
        <section class="vf-grid vf-grid__col-2">
          <!-- <div class="vf-card vf-card--by-the-numbers">
            <div class="vf-card__image vf-u-background-color--blueX">
              <i class="icon icon-common icon-analyse"></i>

              <h3 class="vf-card__title">
                20 <br/>million
              </h3>
              <p class="vf-card__text">
                unique IP addresses accessed EMBL-EBI websites in 2018
              </p>
            </div>
            <div class="vf-card__content">
            </div>
          </div> -->

          <!-- <div class="vf-card vf-card--by-the-numbers">
            <div class="vf-card__image vf-u-background-color--blueX">
              <i class="icon icon-conceptual icon-structures-3d"></i>

              <h3 class="vf-card__title">
                23 <br/>billion
              </h3>
              <p class="vf-card__text">
                web requests in 2018
              </p>
            </div>
            <div class="vf-card__content">
            </div>
          </div> -->

          <div class="vf-card vf-card--by-the-numbers">
            <div class="vf-card__image vf-u-background-color--blueX">
              <i class="icon icon-common icon-database"></i>

              <h3 class="vf-card__title">
                273 <br/>Petabytes

              </h3>
              <p class="vf-card__text">
                of raw storage data
              </p>
            </div>
            <div class="vf-card__content">
            </div>
          </div>

          <div class="vf-card vf-card--by-the-numbers">
            <div class="vf-card__image vf-u-background-color--blueX">
              <i class="icon icon-common icon-mouse-pointer"></i>

              <h3 class="vf-card__title">
                65 <br/>million

              </h3>
              <p class="vf-card__text">
                web requests made to our websites on an average day
              </p>
            </div>
            <div class="vf-card__content">
            </div>
          </div>

          <div class="vf-card vf-card--by-the-numbers">
            <div class="vf-card__image vf-u-background-color--blueX">
              <i class="icon icon-common icon-documentation"></i>

              <h3 class="vf-card__title">
                190 <br/>grants
              </h3>
              <p class="vf-card__text">
                jointly-funded with 603 institutes from 62 countries, in 2018 alone
              </p>
            </div>
            <div class="vf-card__content">
            </div>
          </div>

          <div class="vf-card vf-card--by-the-numbers">
            <div class="vf-card__image vf-u-background-color--blueX">
              <i class="icon icon-common icon-group"></i>

              <h3 class="vf-card__title">
                22 500 <br/>people
              </h3>
              <p class="vf-card__text">
Ken Hawkins's avatar
Typo  
Ken Hawkins committed
406
                participated in our 355 training events
407 408 409 410 411 412 413 414 415 416 417 418
              </p>
            </div>
            <div class="vf-card__content">
            </div>
          </div>
        </section>
      </div>
      <div><!-- empty --></div>
      </section>

      <style>
      body .vf-card.vf-card--by-the-numbers {
419
        --card-background-color: var(--vf-card-theme-color--background,none);
420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459
        grid-template-rows: 158px repeat(3, 30px);
      }
      .vf-card--by-the-numbers .vf-card__image {
        background-color: rgb(0, 122, 83);
        overflow: hidden;
        z-index: -2;
        position: relative;
      }
      .vf-card--by-the-numbers .vf-card__image .vf-card__text,
      .vf-card--by-the-numbers .vf-card__image .vf-card__title {
        padding-left: 25px;
        /* color: rgb(48, 127, 226); */
        color: white;
      }
      .vf-card--by-the-numbers .vf-card__image .vf-card__title {
        padding-top: 25px;
        font-size: 2.7em;
        line-height: 1em;
        margin-bottom: 0.1em;
      }
      .vf-card--by-the-numbers .vf-card__image .vf-card__text {
        max-width: 250px;
      }
      .vf-card--by-the-numbers .vf-card__image .icon {
        color: rgb(0, 159, 77);
        font-size: 12em;
        position: absolute;
        z-index: -1;
        right: -20px;
        bottom: -60px;
        /* transform: rotate(-4deg); */

      }
      .vf-card__image {
        /* this works better when a square-ish image cover needs to be cropped */
        object-position: bottom;

      }
      </style>

Ken Hawkins's avatar
Ken Hawkins committed
460 461 462 463
      <style>
        /* fix for visited buttons */
        .vf-button--primary:visited {
          color: #fff;
Ken Hawkins's avatar
Ken Hawkins committed
464
          box-shadow: 0px 6px 0px 0px grey;
Ken Hawkins's avatar
Ken Hawkins committed
465 466 467
        }
      </style>

468 469 470 471 472 473 474 475 476 477 478 479 480

      <!-- Achievements -->
      <section class="embl-grid embl-grid--has-centered-content vf-u-padding__top--xl">
      <div>
        <h4 class="vf-text vf-text-heading--3 vf-u-margin__top--">
          EMBL-EBI's achievements
        </h4>
        <!-- <span class="vf-text">EMBL-EBI at a glance</span> -->
      </div>
      <div class="vf-content">
        <section class="vf-grid vf-grid__col-XXX">
          <div>
            <article class="vf-summary vf-summary--news">
Ken Hawkins's avatar
Ken Hawkins committed
481
              <a href="https://www.embl.org/files/wp-content/uploads/EMBL-EBI_Scientific_Report-2018.pdf"  class="vf-summary__image"> <img title="Download the report" src="https://acxngcvroo.cloudimg.io/v7/https://www.embl.org/files/wp-content/uploads/EMBL-EBI_Scientific_Report-2018.jpg" !inline alt="Download the report" border="0" style="border: 1px solid rgba(0,0,0,.2)"> </a>
482
              <p class="vf-summary__text">
Ken Hawkins's avatar
Ken Hawkins committed
483
                Our <a href="https://www.embl.org/files/wp-content/uploads/EMBL-EBI_Scientific_Report-2018.pdf">Annual Report</a> highlights the achievements of each of our research, service and support teams, provides facts and figures on how our data resources are used, and reports on staff composition.
484
              </p>
Ken Hawkins's avatar
Ken Hawkins committed
485
              <p class="vf-summary__text"><a class="vf-button vf-button--primary vf-text-button--2" href="https://www.embl.org/files/wp-content/uploads/EMBL-EBI_Scientific_Report-2018.pdf"><i class="icon icon-generic" data-icon=";"></i> Read the latest EMBL-EBI Annual Report</a></p>
486
              <p class="vf-summary__text vf-text-body--5">
Ken Hawkins's avatar
Ken Hawkins committed
487
                View prior EMBL-EBI Scientific Reports and other <a href="/about/digital-bookshelf" class="vf-link">publications on the Digital Bookshelf</a>.
488 489
              </p>

Ken Hawkins's avatar
Ken Hawkins committed
490 491 492 493 494 495 496
              <!-- IE11 fixes -->
              <style>
              .vf-summary--news .vf-summary__image {
                display: inline-block;
              }
              </style>

497 498 499 500 501
            </article>
          </div>
        </section>
      </div>
      <div>
502
        <!-- empty -->
503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549
      </div>
      </section>

      <!-- Map -->

      <section class="embl-grid vf-u-margin__bottom--">
      <div>
        <h4 class="vf-text vf-text-heading--2 vf-u-margin__top--">
          Global impact
        </h4>
        <p class="vf-text vf-text-body--">A <a class="vf-link" href="//www.ebi.ac.uk/web/livemap/">real-time visualisation of requests</a> to EMBL-EBI data resources.</p>
      </div>
      <div>
        <div class="demo-style-intro vf-u-margin__bottom--xl">
          <iframe id="ebiTrafficMap"
                  name="ebiTrafficMap"
                  title="ebiTrafficMap"
                  width="500"
                  height="500"
                  frameborder="0"
                  scrolling="no"
                  marginheight="0"
                  marginwidth="0"
                  style="width: 100%"
                  src="//www.ebi.ac.uk/web/livemap/live-data-map.html?hideLegend=true&disableZoomScroll=true" allowfullscreen>
          </iframe>
        </div>
      </div>
      </section>


      <!-- Economic value -->
      <section class="embl-grid embl-grid--has-centered-content vf-u-padding__top--xl">
      <div>
        <h4 class="vf-text vf-text-heading--3 vf-u-margin__top--">
          Economic value
        </h4>
      </div>
      <div>
        <p class="vf-intro__text">
          In 2015 we worked with a management consultancy, Charles Beagrie Ltd., to facilitate a large-scale, economic analysis of the institute’s impact   on research practice and the global economy.
        </p>

        <div class="row columns medium-up-4 small-up-2">
          <div class="column">
            <h3 style="font-size: 2.5rem;" class="vf-u-background-color--green badge"><span class="icon icon-generic" data-icon="}"></span></h3>
            <h4 class="vf-u-text-color--green">45% of users</h4>
Ken Hawkins's avatar
Ken Hawkins committed
550
            <p class="small">said they could neither have created/collected the last data they used themselves, nor obtained it elsewhere</p>
551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570
          </div>
          <div class="column">
            <h3 style="font-size: 2.5rem;" class="vf-u-background-color--green badge"><span class="icon icon-generic" data-icon=")"></span></h3>
            <h4 class="vf-u-text-color--green">£920m/year</h4>
            <p class="small">EMBL-EBI data and services contributed to the wider realisation of future research impacts worth £920m annually or £6.9b over 30 years (NPV)</p>
          </div>
          <div class="column">
            <h3 style="font-size: 2.5rem;" class="vf-u-background-color--green badge"><span class="icon icon-generic" data-icon="T"></span></h3>
            <h4 class="vf-u-text-color--green">£335m/year</h4>
            <p class="small">EMBL-EBI data and services directly underpinned an estimated £335m of research last year or £2.5b over 30 years (NPV)</p>
          </div>
          <div class="column">
            <h3 style="font-size: 2.5rem;" class="vf-u-background-color--green badge"><span class="icon icon-generic" data-icon="D"></span></h3>
            <h4 class="vf-u-text-color--green">£1bn to £5bn</h4>
            <p class="small">Direct efficiency impact of EMBL-EBI data, representing direct worth of between £5,382 to £26,000 per respondent per annum</p>
          </div>
        </div>

        <p class="vf-text">This work, encouraged by the BBSRC, fed into a new framework for impact assessment. The resulting report included a survey of over 4000 data-service users, 45% of whom indicated that they could <strong>neither have created nor collected themselves the last data they used, nor obtained it elsewhere</strong>. The findings demonstrate the vital role of public databases in life-science research, and indicate that for every million pounds invested in EMBL-EBI, roughly 20 million pounds is returned to the global economy.</p>
        <p class="vf-text">
Ken Hawkins's avatar
Ken Hawkins committed
571
          <a class="vf-button vf-button--primary vf-text-button--2" href="https://www.embl.org/files/wp-content/uploads/EMBL-EBI_Impact_report-2016-summary.pdf"><i class="icon icon-generic" data-icon=";"></i> Download the Executive Summary</a> <a class="vf-button vf-button--secondary readmore vf-text-button--2" href="https://acxngcvroo.cloudimg.io/v7/https://www.embl.org/files/wp-content/uploads/EMBL-EBI_Impact_report-2016.pdf">Or get the full report</a>
572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617
        </p>

      </div>
      </section>

      <!-- END VF 2.0 -->

      </main>
      <!--/.l-main -->

      <!--.l-footer -->
      <footer>
      <div id="global-footer" class="global-footer">
      <nav id="global-nav-expanded" class="global-nav-expanded row">
      <!-- Footer will be automatically inserted by footer.js -->
      </nav>
      <section id="ebi-footer-meta" class="ebi-footer-meta row">
      <!-- Footer meta will be automatically inserted by footer.js -->
      </section>
      </div>

    </section>
    <!-- Optional local footer (insert citation / project-specific copyright / etc here -->
    <!--
    <footer id="local-footer" class="local-footer" role="local-footer">
      <div class="row">
        <span class="reference">How to reference this page: ...</span>
      </div>
    </footer>
    -->
    <!-- End optional local footer -->
  </div>
  <!-- End suggested layout containers / #content -->

  <footer>
    <div id="global-footer" class="global-footer">
      <nav id="global-nav-expanded" class="global-nav-expanded row">
        <!-- Footer will be automatically inserted by footer.js -->
      </nav>
      <section id="ebi-footer-meta" class="ebi-footer-meta row">
        <!-- Footer meta will be automatically inserted by footer.js -->
      </section>
    </div>
  </footer>

  <!-- VF 2.0 CSS, JS -->
618
  <link rel="stylesheet" href="https://dev.assets.emblstatic.net/embl-design-system/v1.0.0-alpha.2/css/styles.css" />
619
  <script src="https://dev.assets.emblstatic.net/embl-design-system/develop/scripts/scripts.js"></script>
620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639

  <!-- JavaScript -->
  <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
  <!--
  <script>window.jQuery || document.write('<script src="../js/libs/jquery-1.10.2.min.js"><\/script>')</script>
  -->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

  <script defer="defer" src="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/js/script.js"></script>

  <!-- The Foundation theme JavaScript -->
  <script src="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/libraries/foundation-6/js/foundation.js"></script>
  <script src="https://ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/js/foundationExtendEBI.js"></script>
  <script type="text/JavaScript">$(document).foundation();</script>
  <script type="text/JavaScript">$(document).foundationExtendEBI();</script>

  <!-- Google Analytics details... -->
  <script type="text/javascript">!function(e,a,n,t,i,o,c){e.GoogleAnalyticsObject=i,e[i]=e[i]||function(){(e[i].q=e[i].q||[]).push(arguments)},e[i].l=1*new Date,o=a.createElement(n),c=a.getElementsByTagName(n)[0],o.async=1,o.src="//www.google-analytics.com/analytics.js",c.parentNode.insertBefore(o,c)}(window,document,"script",0,"ga"),ga("create","UA-629242-1",{cookieDomain:"auto"}),ga("require","linkid","linkid.js"),ga("set","anonymizeIp",!0),ga("send","pageview");</script>
</body>
</html>