@charset "UTF-8";
/* 1.2 Fonts */
/*
Placeholders

Styleguide 1.6
*/
/* 1.6.1 Title */
/*
Title

Mixins for title font-size and line-height. Do not use these for anything but
title sizes, as the line-heights are too dense for long-lenght body texts.

title-12px - 12px/15px
title-14px - 14px/15px
title-16px - 16px/18px
title-18px - 18px/18px
title-20px - 20px/21px
title-24px - 24px/24px
title-24px - 26px/27px
title-30px - 30px/30px
title-48px - 48px/48px

Styleguide 1.6.1
*/
/* 1.6.2 Text */
/*
Text

Styleguide 1.6.2
*/
/* 1.6.3 Meta */
/*
Meta

Styleguide 1.6.3
*/
/* 1.6.4 Date */
/*
Date

Styleguide 1.6.4
*/
/* 1.6.5 Location */
/*
Location

Styleguide 1.6.5
*/
/* 1.6.6 Theme */
/*
theme

@mixin theme-color
@mixin theme-border
@mixin theme-opaque-background
@mixin theme-transparent-background

Styleguide 1.6.6
*/
/* 1.6.99 Miscellaneous */
/*
Miscellaneous

Styleguide 1.6.99
*/
/* it's an official colour these days! */
/* alternate spelling */
/* alternate spelling */
/* alternate spelling */
/* alternate spelling */
/* alternate spelling */
/* alternate spelling */
/* alternate spelling */
/* 1.3.1 Rhythm */
/*
Settings

Styleguide 1.3
*/
/* 1.3.4 Base */
/* 1.3.1 Rhythm */
/*
Rhythm

This measure is used to calculate vertical measurements like line-height and top and bottom paddings and margins. All vertical measurements need to be a whole multiple of this value to maintain consistent vertical rhythm.

$rhythm - 3px

markup:
{$modifiers}

Styleguide 1.3.1
*/
/* 1.3.2 Typography */
/*
Typography

If `$use-brand-type: true` type is set in Merriwheather and Futura.
If `$use-brand-type: false` type is set in Times and Open Sans.

Styleguide 1.3.2
*/
/* 21px */
/* 1.3.5 Breakpoint */
/*
Breakpoint settings

$lt-small-handheld - Breakpoint for (**smaller than**) smaller handheld devices (<=319px).
$lt-medium-handheld - Breakpoint for (**smaller than**) medium sized handheld devices (<=519px).
$lt-large-handheld - Breakpoint for (**smaller than**) larger handheld devices and smaller desktop devices (<=767px).
$lt-small-desktop - Breakpoint for (**smaller than**) medium sized handheld and small desktop devices (<=1023px).
$lt-medium-desktop - Breakpoint for (**smaller than**) Breakpoint for large (desktop) devices (<=1259px).
$lt-large-desktop - Breakpoint for (**smaller than**) Breakpoint for large (desktop) devices (<=1439px).
<hr>
$gt-small-handheld - Breakpoint for (**larger than**) smaller handheld devices (>=320px).
$gt-medium-handheld - Breakpoint for (**larger than**) medium sized handheld devices (>=520px).
$gt-large-handheld - Breakpoint for (**larger than**) larger handheld devices and smaller desktop devices (>=768px).
$gt-small-desktop - Breakpoint for (**larger than**) medium sized handheld and small desktop devices (>=1024px).
$gt-medium-desktop - Breakpoint for (**larger than**) Breakpoint for large (desktop) devices (>=1260px).
$gt-large-desktop - Breakpoint for (**larger than**) Breakpoint for large (desktop) devices (>=1440px).
<hr>
$portrait - Breakpoint for portrait oriented viewports.
$landscape - Breakpoint for landscape oriented viewports.

markup:
{$modifiers}

Styleguide 1.3.3
*/
/* 1.3.7 Grid */
/* 1.3.8 Layout */
/*
Layout

$grids - Layouts accross breakpoints.

markup:
<pre>{$modifiers}</pre>

Styleguide 1.3.8
*/
/* 1.3.9 Miscellaneaous */
/* 1. */
/*
Base

Styleguide 1.0
*/
/* 1.2 Fonts */
/*
Fonts

Styleguide 1.2
*/
/* 1.3 Settings */
/* 1.3.1 Rhythm */
/*
Settings

Styleguide 1.3
*/
/* 1.3.4 Base */
/* 1.3.1 Rhythm */
/*
Rhythm

This measure is used to calculate vertical measurements like line-height and top and bottom paddings and margins. All vertical measurements need to be a whole multiple of this value to maintain consistent vertical rhythm.

$rhythm - 3px

markup:
{$modifiers}

Styleguide 1.3.1
*/
/* 1.3.2 Typography */
/*
Typography

If `$use-brand-type: true` type is set in Merriwheather and Futura.
If `$use-brand-type: false` type is set in Times and Open Sans.

Styleguide 1.3.2
*/
/* 21px */
/* 1.3.5 Breakpoint */
/*
Breakpoint settings

$lt-small-handheld - Breakpoint for (**smaller than**) smaller handheld devices (<=319px).
$lt-medium-handheld - Breakpoint for (**smaller than**) medium sized handheld devices (<=519px).
$lt-large-handheld - Breakpoint for (**smaller than**) larger handheld devices and smaller desktop devices (<=767px).
$lt-small-desktop - Breakpoint for (**smaller than**) medium sized handheld and small desktop devices (<=1023px).
$lt-medium-desktop - Breakpoint for (**smaller than**) Breakpoint for large (desktop) devices (<=1259px).
$lt-large-desktop - Breakpoint for (**smaller than**) Breakpoint for large (desktop) devices (<=1439px).
<hr>
$gt-small-handheld - Breakpoint for (**larger than**) smaller handheld devices (>=320px).
$gt-medium-handheld - Breakpoint for (**larger than**) medium sized handheld devices (>=520px).
$gt-large-handheld - Breakpoint for (**larger than**) larger handheld devices and smaller desktop devices (>=768px).
$gt-small-desktop - Breakpoint for (**larger than**) medium sized handheld and small desktop devices (>=1024px).
$gt-medium-desktop - Breakpoint for (**larger than**) Breakpoint for large (desktop) devices (>=1260px).
$gt-large-desktop - Breakpoint for (**larger than**) Breakpoint for large (desktop) devices (>=1440px).
<hr>
$portrait - Breakpoint for portrait oriented viewports.
$landscape - Breakpoint for landscape oriented viewports.

markup:
{$modifiers}

Styleguide 1.3.3
*/
/* 1.3.7 Grid */
/* 1.3.8 Layout */
/*
Layout

$grids - Layouts accross breakpoints.

markup:
<pre>{$modifiers}</pre>

Styleguide 1.3.8
*/
/* 1.3.9 Miscellaneaous */
/* 1.1 Settings */
/*
Colour

Styleguide 1.1
*/
/*
Base colours

$color-black - #000
$color-green - #67ab43
$color-dark-green - #1d673b

markup:
<div style="background: {$modifiers};" class="styleguide-color">{$modifiers}</div>

Styleguide 1.1.1
*/
/*
Spot colours

$color-blue - #56c0dd
$color-lime - #c1d435
$color-yellow - #facf21
$color-gold - #eb942c
$color-orange - #e26435
$color-salmon - #eb735d
$color-red - #ec2d10
$color-burgundy - #ba222a
$color-purple - #9b3381

markup:
<div style="background: {$modifiers};" class="styleguide-color">{$modifiers}</div>

Styleguide 1.1.2
*/
/* Brand */
/* Spore */
/* Theme */
/*
Social media colours

$color-rss - RSS Orange
$color-twitter - Official Twitter blue
$color-facebook - Official Facebook blue
$color-linkedin - Official LinkedIn blue
$color-youtube - Official YouTube red
$color-youtube--dark - Official YouTube red (darker shade)

markup:
<div style="background: {$modifiers};" class="styleguide-color">{$modifiers}</div>

Styleguide 1.1.3
*/
/*
Applied colours

$color-background - Background colour
$color-body - Body colour
$color-theme - Theme colour
$color-primary - Primary colour
$color-secondary - Secondary colour
$color-button - Primary button colour

markup:
<div style="background: {$modifiers};" class="styleguide-color">{$modifiers}</div>

Styleguide 1.1.4
*/
/* Mixing colours */
/* Button colours */
/* Links colours */
/* Collections */
/* 1.5 Placeholders */
/*
Placeholders

Styleguide 1.5
*/
/* 1.5.1 Font Sizes */
/*
Font sizes

Styleguide 1.5.1
*/
/* 1.5.2 Meta */
/*
Meta

Styleguide 1.5.2
*/
.title, .button, [data-vendor="commento"] .commento-button.commento-submit-button, .fld-label, .date, .date__project, .tag, [data-copyright]:after, .picker__holder, .meta, .block-link, .read-more, .stamp, .letter, .issue-label, .menu__item, .menu-toggle, .publication-download__item, .article-headline__author, .ctx-item__search .item, .selectize-control .item, .selectize-control .option, .selectize-control .optgroup-header {
  font-family: "Open Sans", sans-serif;
  text-transform: uppercase; }

/* 1.6 Mixins */
/*
Placeholders

Styleguide 1.6
*/
/* 1.6.1 Title */
/*
Title

Mixins for title font-size and line-height. Do not use these for anything but
title sizes, as the line-heights are too dense for long-lenght body texts.

title-12px - 12px/15px
title-14px - 14px/15px
title-16px - 16px/18px
title-18px - 18px/18px
title-20px - 20px/21px
title-24px - 24px/24px
title-24px - 26px/27px
title-30px - 30px/30px
title-48px - 48px/48px

Styleguide 1.6.1
*/
/* 1.6.2 Text */
/*
Text

Styleguide 1.6.2
*/
/* 1.6.3 Meta */
/*
Meta

Styleguide 1.6.3
*/
/* 1.6.4 Date */
/*
Date

Styleguide 1.6.4
*/
/* 1.6.5 Location */
/*
Location

Styleguide 1.6.5
*/
/* 1.6.6 Theme */
/*
theme

@mixin theme-color
@mixin theme-border
@mixin theme-opaque-background
@mixin theme-transparent-background

Styleguide 1.6.6
*/
/* 1.6.99 Miscellaneous */
/*
Miscellaneous

Styleguide 1.6.99
*/
/* 1.4 Base styles */
/*
Base styles

Smart reset, based on @necolas's normalize but updated to use the system's real values.

Styleguide 1.4
*/
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Correct the line height in all browsers.
 * 3. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
/**
 * Add the correct display in IE 9-.
 */
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
/* Grouping content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */
/**
 * Add the correct margin in IE 8.
 */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
/**
 * Add the correct font style in Android 4.3-.
 */
/**
 * Add the correct background and color in IE 9-.
 */
/**
 * Add the correct font size in all browsers.
 */
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
/* Embedded content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
/**
 * Add the correct display in iOS 4-7.
 */
/**
 * Remove the border on images inside links in IE 10-.
 */
/**
 * Hide the overflow in IE.
 */
/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform on select element in Firefox.
 */
/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
/**
 * Remove the inner border and padding in Firefox.
 */
/**
 * Restore the focus styles unset by the previous rule.
 */
/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
/**
 * Remove the default vertical scrollbar in IE.
 */
/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
/* Interactive
   ========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
/*
 * Add the correct display in all browsers.
 */
/* Scripting
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
/**
 * Add the correct display in IE.
 */
/* Hidden
   ========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
/* Tables
   ========================================================================== */
/*
 * Remove most spacing between table cells.
 */
/* More Piecss base styles
   ========================================================================== */
/*
  * Set consistent quote types.
  */
/*
 * Apply a bottom margin of one line-height to any element in this comma
 * separated list.
 */
/**
 * Reset margin.
 */
/**
 * Reset box-model
 */
/*
 * Full typographic reset.
 */
/*
 * Reset font-weights.
 */
/*
 * Set anchor colours.
 */
/**
 * Override the fieldset settings above wit more 'Piecss' like behaviour.
 */
/**
 * Override the fieldset settings above wit more 'Piecss' like behaviour.
 */
/*
 * 1. Apply a natural box layout model to all elements
 * 2. Remove margins from all elements
 */
*, *::before, *::after {
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  margin: 0; }

/*
 * 1. Remove default margin.
 * 2. Set height to accommodate hero module
 * 4. Removes scroll lock on iOS Safari
 */
/*
 * 2. Set default anchor colour.
 */
/*
 * Reset the headers – their visual appearance is decoupled from their semantic meaning
 */
/*
 * Address inconsistent and variable font size in all browsers.
 */
/*
 * Margin is already reset in $reset-margin
 */
/*
 * 1. Correct color not being inherited.
 */
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Correct the line height in all browsers.
 * 3. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
/**
 * Add the correct display in IE 9-.
 */
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
/* Grouping content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */
/**
 * Add the correct margin in IE 8.
 */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
/**
 * Add the correct font style in Android 4.3-.
 */
/**
 * Add the correct background and color in IE 9-.
 */
/**
 * Add the correct font size in all browsers.
 */
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
/* Embedded content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
/**
 * Add the correct display in iOS 4-7.
 */
/**
 * Remove the border on images inside links in IE 10-.
 */
/**
 * Hide the overflow in IE.
 */
/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform on select element in Firefox.
 */
/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
/**
 * Remove the inner border and padding in Firefox.
 */
/**
 * Restore the focus styles unset by the previous rule.
 */
/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
/**
 * Remove the default vertical scrollbar in IE.
 */
/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
/* Interactive
   ========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
/*
 * Add the correct display in all browsers.
 */
/* Scripting
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
/**
 * Add the correct display in IE.
 */
/* Hidden
   ========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
/* Tables
   ========================================================================== */
/*
 * Remove most spacing between table cells.
 */
/* More Piecss base styles
   ========================================================================== */
/*
  * Set consistent quote types.
  */
/*
 * Apply a bottom margin of one line-height to any element in this comma
 * separated list.
 */
/**
 * Reset margin.
 */
/**
 * Reset box-model
 */
/*
 * Full typographic reset.
 */
/*
 * Reset font-weights.
 */
/*
 * Set anchor colours.
 */
/**
 * Override the fieldset settings above wit more 'Piecss' like behaviour.
 */
/**
 * Override the fieldset settings above wit more 'Piecss' like behaviour.
 */
html {
  line-height: 1.5;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-family: Georgia, Times New Roman, Times, serif;
  font-weight: 300;
  background: #fff;
  color: #3d3d3d; }

body {
  margin: 0; }

article, aside, footer, header, nav, section, figcaption, figure, main, details, menu {
  display: block; }

h1 {
  font-size: inherit;
  line-height: inherit;
  margin: 0.67em 0; }

figure {
  margin: 1em 40px; }

hr {
  -moz-box-sizing: content-box;
       box-sizing: content-box;
  height: 0;
  overflow: visible; }

code, kbd, samp, pre {
  font-family: monospace, monospace;
  font-size: 1em; }

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  color: #95c47b;
  text-decoration: none; }

a:active, a:hover {
  outline-width: 0; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: dotted;
  text-decoration: dotted; }

b, strong {
  font-weight: inherit;
  font-weight: bolder;
  font-weight: bolder; }

dfn {
  font-style: italic; }

mark {
  background: #ff0;
  color: #3d3d3d; }

small {
  font-size: 0.625em; }

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

audio, video {
  display: inline-block; }

audio:not([controls]) {
  display: none;
  height: 0; }

img {
  border-style: none;
  max-width: 100%; }

svg:not(:root) {
  overflow: hidden; }

button, input, optgroup, select, textarea {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.5;
  font-style: inherit;
  font-variant: inherit;
  font-weight: inherit;
  color: inherit;
  margin: 0; }

button, input {
  overflow: visible; }

button, select {
  text-transform: none; }

button, html [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

legend {
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }

progress {
  display: inline-block;
  vertical-align: baseline; }

textarea {
  overflow: auto; }

[type="checkbox"], [type="radio"] {
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  padding: 0;
  width: initial; }

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

summary {
  display: list-item; }

canvas {
  display: inline-block; }

template {
  display: none; }

[hidden] {
  display: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td, th {
  padding: 0; }

q {
  quotes: “ ” ‘ ’; }

body, fieldset, figure, h1, input, optgroup, select, textarea, p, article {
  margin: 0; }

* {
  -moz-box-sizing: border-box;
       box-sizing: border-box; }

optgroup strong {
  font-weight: bold; }

em, dfn {
  font-style: italic; }

i, b {
  font-weight: regular; }

a:visited {
  color: #48782f; }

a:active {
  color: #af9117; }

a:hover {
  color: #facf21; }

html, body {
  margin: 0;
  height: 100%;
  min-height: 100%;
  max-width: 100%; }

h1, h3, h4, h5, h6 {
  font-weight: 300; }

fieldset {
  border: 0;
  margin: 0;
  padding: 0; }

label {
  display: inline-block; }

label, input, select, textarea {
  width: 100%; }

button {
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer; }

iframe {
  width: 100%; }

strong {
  font-weight: bold; }

q, blockquote {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

html body {
  color: #3d3d3d; }

/* 2. */
/*
Elements

Styleguide 3.0
*/
/* 3.97 Location */
.reset, .menu {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none; }

.selectize-control input {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none; }

/* 3.1 Body */
/*
Body [REVIEW]

.body--whisper - Smaller text
.body--quiet - Slightly translucent
.body--align-center - Align content using text-align: center

markup:
<p class="{$modifiers}">Drone technology could help farmers around the world monitor their crops, fend off pests, improve land tenure, and more. But to realise its full potential, regulatory regimes are necessary, while keeping citizens’ safety and privacy rights secure.</p>

Styleguide 3.1
*/
.body--whisper {
  font-size: 0.8125em;
  line-height: 1.38462; }

.body--quiet {
  font-size: 0.75em;
  line-height: 1.5;
  opacity: .76; }

.body--align-center {
  text-align: center; }

@media only screen and (min-width: 48em) {
  .body--whisper {
    font-size: 0.875em;
    line-height: 1.28571; } }

/* 3.2 Heading */
/*
Heading

Subheading in body copy

.heading - Heading
.heading.heading--sub - Subheading
.heading.heading--alternate - Heading with normal font-weight

markup:
<h1 class="{$modifiers}">Drone technology could help farmers around the world monitor their crops.</h1>

Styleguide 3.2
*/
.heading {
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  /* small title*/
  font-size: 0.875em;
  line-height: 1.28571; }
  .heading,
  a .heading,
  .heading a {
    text-decoration: none;
    color: inherit; }
  .heading--tile {
    /* medium title*/
    font-size: 1.125em;
    line-height: 1.33333; }
  .heading--focus {
    /* regular title*/
    font-size: 1em;
    line-height: 1.3125; }
  .heading--sub {
    line-height: 1.4; }
  .heading--alternate {
    font-weight: 400; }
  @media only screen and (min-width: 32.5em) {
    .heading--tile, .heading--hero {
      /* large title*/
      font-size: 1.5em;
      line-height: 1.125; } }
  @media only screen and (min-width: 48em) {
    .heading {
      font-size: 1em; }
      .heading--apropos {
        font-size: 0.875em; }
      .heading--focus {
        /* medium title*/
        font-size: 1.25em;
        line-height: 1.35; } }
  @media only screen and (min-width: 64em) {
    .heading--sub {
      margin-top: 30px; }
    .heading--tile, .heading--hero {
      /* large title*/
      font-size: 1.5em;
      line-height: 1.125; } }
  @media only screen and (min-width: 90em) {
    .heading--moderate {
      /* hero title*/
      font-size: 1.875em;
      line-height: 1.1; }
    .heading--hero {
      /* giant title*/
      font-size: 3em;
      line-height: 1.0625; } }

/* 3.3 Headline */
/*
Title [REVIEW]

Titles are different from headings. They are used in title and headline blocks and story lists. If you want to style an article heading, use the heading class.

.title - This smaller title is used in story lists
.title.title--lead - Larger title
.title.title--tile - In between --lead and --title
.title.title--section - Extra margin top and bottom
.title.title--sub-section - About us small title
.title.title--apropos -  Apropos title
.title.title--container - Container title
.title.title--filter - Filter title
.title.title--tab - Tab title
.title.title--eror - Error title
.title.title--hero - Hero title
.title.title--event - Event title
.title.title--thin - Thin title
.title.title--statistic - Statistic title

markup:
<h1 class="{$modifiers}">Extra, extra – read all about it!</h1>

Styleguide 3.3
*/
.title {
  font-weight: 600;
  /* regular title*/
  font-size: 1em;
  line-height: 1.3125;
  max-width: 100%; }
  a .title,
  .title a {
    text-decoration: none; }
  .title--sub-section {
    /* small title*/
    font-size: 0.75em;
    line-height: 1.5; }
  .title--apropos {
    /* small title*/
    font-size: 0.875em;
    line-height: 1.28571; }
  .title--section, .title--container {
    /* medium title*/
    font-size: 1.25em;
    line-height: 1.35; }
  .title--filter {
    /* small meta*/
    font-size: 0.6875em;
    line-height: 1.09091; }
  .title--tab {
    /* small title*/
    font-size: 0.875em;
    line-height: 1.28571;
    padding-bottom: 6px;
    color: inherit; }
    .title--tab:last-child {
      padding-bottom: 0; }
    .title--tab.is-current {
      color: #67ab43; }
      .title--tab.is-current.theme--dark,
      .theme--dark .title--tab.is-current,
      .theme .theme.theme--dark .title--tab.is-current {
        color: #3d3d3d; }
      .title--tab.is-current.theme--green,
      .theme--green .title--tab.is-current,
      .theme .theme.theme--green .title--tab.is-current {
        color: #67ab43; }
      .title--tab.is-current.theme--blue,
      .theme--blue .title--tab.is-current,
      .theme .theme.theme--blue .title--tab.is-current {
        color: #56c0dd; }
      .title--tab.is-current.theme--lime,
      .theme--lime .title--tab.is-current,
      .theme .theme.theme--lime .title--tab.is-current {
        color: #c1d435; }
      .title--tab.is-current.theme--yellow,
      .theme--yellow .title--tab.is-current,
      .theme .theme.theme--yellow .title--tab.is-current {
        color: #facf21; }
      .title--tab.is-current.theme--gold,
      .theme--gold .title--tab.is-current,
      .theme .theme.theme--gold .title--tab.is-current {
        color: #eb942c; }
      .title--tab.is-current.theme--orange,
      .theme--orange .title--tab.is-current,
      .theme .theme.theme--orange .title--tab.is-current {
        color: #e26435; }
      .title--tab.is-current.theme--salmon,
      .theme--salmon .title--tab.is-current,
      .theme .theme.theme--salmon .title--tab.is-current {
        color: #eb735d; }
      .title--tab.is-current.theme--red,
      .theme--red .title--tab.is-current,
      .theme .theme.theme--red .title--tab.is-current {
        color: #ec2d10; }
      .title--tab.is-current.theme--burgundy,
      .theme--burgundy .title--tab.is-current,
      .theme .theme.theme--burgundy .title--tab.is-current {
        color: #ba222a; }
      .title--tab.is-current.theme--purple,
      .theme--purple .title--tab.is-current,
      .theme .theme.theme--purple .title--tab.is-current {
        color: #9b3381; }
      .title--tab.is-current.theme--youth,
      .theme--youth .title--tab.is-current,
      .theme .theme.theme--youth .title--tab.is-current {
        color: #d57800; }
      .title--tab.is-current.theme--digitalisation,
      .theme--digitalisation .title--tab.is-current,
      .theme .theme.theme--digitalisation .title--tab.is-current {
        color: #9a3324; }
      .title--tab.is-current.theme--climate,
      .theme--climate .title--tab.is-current,
      .theme .theme.theme--climate .title--tab.is-current {
        color: #693c5e; }
      .title--tab.is-current.theme--gender,
      .theme--gender .title--tab.is-current,
      .theme .theme.theme--gender .title--tab.is-current {
        color: #046a38; }
      .title--tab.is-current.theme--nutrition,
      .theme--nutrition .title--tab.is-current,
      .theme .theme.theme--nutrition .title--tab.is-current {
        color: #487a7b; }
      .title--tab.is-current.theme--blog,
      .theme--blog .title--tab.is-current,
      .theme .theme.theme--blog .title--tab.is-current {
        color: #ffa300; }
      .title--tab.is-current.theme--spore-blue,
      .theme--spore-blue .title--tab.is-current,
      .theme .theme.theme--spore-blue .title--tab.is-current {
        color: #3f68b1; }
      .title--tab.is-current.theme--spore-brown,
      .theme--spore-brown .title--tab.is-current,
      .theme .theme.theme--spore-brown .title--tab.is-current {
        color: #774b04; }
      .title--tab.is-current.theme--spore-dark-blue,
      .theme--spore-dark-blue .title--tab.is-current,
      .theme .theme.theme--spore-dark-blue .title--tab.is-current {
        color: #044e7e; }
      .title--tab.is-current.theme--spore-forest-green,
      .theme--spore-forest-green .title--tab.is-current,
      .theme .theme.theme--spore-forest-green .title--tab.is-current {
        color: #5f810a; }
      .title--tab.is-current.theme--spore-grey-blue,
      .theme--spore-grey-blue .title--tab.is-current,
      .theme .theme.theme--spore-grey-blue .title--tab.is-current {
        color: #6d8c9f; }
      .title--tab.is-current.theme--spore-light-blue,
      .theme--spore-light-blue .title--tab.is-current,
      .theme .theme.theme--spore-light-blue .title--tab.is-current {
        color: #79accf; }
      .title--tab.is-current.theme--spore-lime,
      .theme--spore-lime .title--tab.is-current,
      .theme .theme.theme--spore-lime .title--tab.is-current {
        color: #bbae03; }
      .title--tab.is-current.theme--spore-ochre,
      .theme--spore-ochre .title--tab.is-current,
      .theme .theme.theme--spore-ochre .title--tab.is-current {
        color: #db9623; }
      .title--tab.is-current.theme--spore-olive-green,
      .theme--spore-olive-green .title--tab.is-current,
      .theme .theme.theme--spore-olive-green .title--tab.is-current {
        color: #778d3e; }
      .title--tab.is-current.theme--spore-red,
      .theme--spore-red .title--tab.is-current,
      .theme .theme.theme--spore-red .title--tab.is-current {
        color: #f54c23; }
      .title--tab.is-current.theme--spore-taupe,
      .theme--spore-taupe .title--tab.is-current,
      .theme .theme.theme--spore-taupe .title--tab.is-current {
        color: #7b6d65; }
      .title--tab.is-current.theme--spore-teal,
      .theme--spore-teal .title--tab.is-current,
      .theme .theme.theme--spore-teal .title--tab.is-current {
        color: #077fc1; }
  .title--error {
    color: #67ab43;
    font-size: 7.5em;
    line-height: 1; }
    .title--error.theme--dark,
    .theme--dark .title--error,
    .theme .theme.theme--dark .title--error {
      color: #3d3d3d; }
    .title--error.theme--green,
    .theme--green .title--error,
    .theme .theme.theme--green .title--error {
      color: #67ab43; }
    .title--error.theme--blue,
    .theme--blue .title--error,
    .theme .theme.theme--blue .title--error {
      color: #56c0dd; }
    .title--error.theme--lime,
    .theme--lime .title--error,
    .theme .theme.theme--lime .title--error {
      color: #c1d435; }
    .title--error.theme--yellow,
    .theme--yellow .title--error,
    .theme .theme.theme--yellow .title--error {
      color: #facf21; }
    .title--error.theme--gold,
    .theme--gold .title--error,
    .theme .theme.theme--gold .title--error {
      color: #eb942c; }
    .title--error.theme--orange,
    .theme--orange .title--error,
    .theme .theme.theme--orange .title--error {
      color: #e26435; }
    .title--error.theme--salmon,
    .theme--salmon .title--error,
    .theme .theme.theme--salmon .title--error {
      color: #eb735d; }
    .title--error.theme--red,
    .theme--red .title--error,
    .theme .theme.theme--red .title--error {
      color: #ec2d10; }
    .title--error.theme--burgundy,
    .theme--burgundy .title--error,
    .theme .theme.theme--burgundy .title--error {
      color: #ba222a; }
    .title--error.theme--purple,
    .theme--purple .title--error,
    .theme .theme.theme--purple .title--error {
      color: #9b3381; }
    .title--error.theme--youth,
    .theme--youth .title--error,
    .theme .theme.theme--youth .title--error {
      color: #d57800; }
    .title--error.theme--digitalisation,
    .theme--digitalisation .title--error,
    .theme .theme.theme--digitalisation .title--error {
      color: #9a3324; }
    .title--error.theme--climate,
    .theme--climate .title--error,
    .theme .theme.theme--climate .title--error {
      color: #693c5e; }
    .title--error.theme--gender,
    .theme--gender .title--error,
    .theme .theme.theme--gender .title--error {
      color: #046a38; }
    .title--error.theme--nutrition,
    .theme--nutrition .title--error,
    .theme .theme.theme--nutrition .title--error {
      color: #487a7b; }
    .title--error.theme--blog,
    .theme--blog .title--error,
    .theme .theme.theme--blog .title--error {
      color: #ffa300; }
    .title--error.theme--spore-blue,
    .theme--spore-blue .title--error,
    .theme .theme.theme--spore-blue .title--error {
      color: #3f68b1; }
    .title--error.theme--spore-brown,
    .theme--spore-brown .title--error,
    .theme .theme.theme--spore-brown .title--error {
      color: #774b04; }
    .title--error.theme--spore-dark-blue,
    .theme--spore-dark-blue .title--error,
    .theme .theme.theme--spore-dark-blue .title--error {
      color: #044e7e; }
    .title--error.theme--spore-forest-green,
    .theme--spore-forest-green .title--error,
    .theme .theme.theme--spore-forest-green .title--error {
      color: #5f810a; }
    .title--error.theme--spore-grey-blue,
    .theme--spore-grey-blue .title--error,
    .theme .theme.theme--spore-grey-blue .title--error {
      color: #6d8c9f; }
    .title--error.theme--spore-light-blue,
    .theme--spore-light-blue .title--error,
    .theme .theme.theme--spore-light-blue .title--error {
      color: #79accf; }
    .title--error.theme--spore-lime,
    .theme--spore-lime .title--error,
    .theme .theme.theme--spore-lime .title--error {
      color: #bbae03; }
    .title--error.theme--spore-ochre,
    .theme--spore-ochre .title--error,
    .theme .theme.theme--spore-ochre .title--error {
      color: #db9623; }
    .title--error.theme--spore-olive-green,
    .theme--spore-olive-green .title--error,
    .theme .theme.theme--spore-olive-green .title--error {
      color: #778d3e; }
    .title--error.theme--spore-red,
    .theme--spore-red .title--error,
    .theme .theme.theme--spore-red .title--error {
      color: #f54c23; }
    .title--error.theme--spore-taupe,
    .theme--spore-taupe .title--error,
    .theme .theme.theme--spore-taupe .title--error {
      color: #7b6d65; }
    .title--error.theme--spore-teal,
    .theme--spore-teal .title--error,
    .theme .theme.theme--spore-teal .title--error {
      color: #077fc1; }
    @media only screen and (min-width: 90em) {
      .title--error {
        font-size: 11.25em; } }
  .title--hero, .title--event {
    /* medium title*/
    font-size: 1.125em;
    line-height: 1.33333; }
  .title--thin {
    font-weight: normal; }
  .title--event {
    font-weight: normal;
    text-transform: none; }
  @media only screen and (min-width: 32.5em) {
    .title--hero, .title--event {
      /* large title*/
      font-size: 1.5em;
      line-height: 1.125; } }
  @media only screen and (min-width: 48em) {
    .title--statistic {
      font-size: 3.75em; } }
  @media only screen and (min-width: 64em) {
    .title--container {
      /* large title*/
      font-size: 1.625em;
      line-height: 1.03846; }
    .title--hero {
      /* medium title*/
      font-size: 1.25em;
      line-height: 1.35; }
    .title--lead {
      /* medium title*/
      font-size: 1.125em;
      line-height: 1.33333; } }
  @media only screen and (min-width: 90em) {
    .title--filter {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25; } }
  @media only screen and (min-width: 100em) {
    .title--hero {
      /* hero title*/
      font-size: 1.875em;
      line-height: 1.1; } }
  .theme--dark .title {
    opacity: .94; }
  .theme--dark .title--tile {
    line-height: 1.1; }
  .title--inverse {
    color: #fff; }

/* 3.4 Anchor */
/*
Anchor

.anchor - Anchor
.anchor:visited - Visited link
.anchor:hover - Hovered link
.anchor:active - Active link
.anchor.anchor--shy - Hides anchor properties
.is-heir - Inherits typographic and colour of parent

markup:
<a class="{$modifiers}" href="javascript:void();">I am text with a link</a>

Styleguide 3.4
*/
a, a:active, a:visited,
.anchor,
.anchor:active,
.anchor:visited {
  color: #67ab43; }
  a.theme--dark,
  .theme--dark a,
  .theme .theme.theme--dark a, a:active.theme--dark,
  .theme--dark a:active,
  .theme .theme.theme--dark a:active, a:visited.theme--dark,
  .theme--dark a:visited,
  .theme .theme.theme--dark a:visited,
  .anchor.theme--dark,
  .theme--dark
  .anchor,
  .theme .theme.theme--dark
  .anchor,
  .anchor:active.theme--dark,
  .theme--dark
  .anchor:active,
  .theme .theme.theme--dark
  .anchor:active,
  .anchor:visited.theme--dark,
  .theme--dark
  .anchor:visited,
  .theme .theme.theme--dark
  .anchor:visited {
    color: #3d3d3d; }
  a.theme--green,
  .theme--green a,
  .theme .theme.theme--green a, a:active.theme--green,
  .theme--green a:active,
  .theme .theme.theme--green a:active, a:visited.theme--green,
  .theme--green a:visited,
  .theme .theme.theme--green a:visited,
  .anchor.theme--green,
  .theme--green
  .anchor,
  .theme .theme.theme--green
  .anchor,
  .anchor:active.theme--green,
  .theme--green
  .anchor:active,
  .theme .theme.theme--green
  .anchor:active,
  .anchor:visited.theme--green,
  .theme--green
  .anchor:visited,
  .theme .theme.theme--green
  .anchor:visited {
    color: #67ab43; }
  a.theme--blue,
  .theme--blue a,
  .theme .theme.theme--blue a, a:active.theme--blue,
  .theme--blue a:active,
  .theme .theme.theme--blue a:active, a:visited.theme--blue,
  .theme--blue a:visited,
  .theme .theme.theme--blue a:visited,
  .anchor.theme--blue,
  .theme--blue
  .anchor,
  .theme .theme.theme--blue
  .anchor,
  .anchor:active.theme--blue,
  .theme--blue
  .anchor:active,
  .theme .theme.theme--blue
  .anchor:active,
  .anchor:visited.theme--blue,
  .theme--blue
  .anchor:visited,
  .theme .theme.theme--blue
  .anchor:visited {
    color: #56c0dd; }
  a.theme--lime,
  .theme--lime a,
  .theme .theme.theme--lime a, a:active.theme--lime,
  .theme--lime a:active,
  .theme .theme.theme--lime a:active, a:visited.theme--lime,
  .theme--lime a:visited,
  .theme .theme.theme--lime a:visited,
  .anchor.theme--lime,
  .theme--lime
  .anchor,
  .theme .theme.theme--lime
  .anchor,
  .anchor:active.theme--lime,
  .theme--lime
  .anchor:active,
  .theme .theme.theme--lime
  .anchor:active,
  .anchor:visited.theme--lime,
  .theme--lime
  .anchor:visited,
  .theme .theme.theme--lime
  .anchor:visited {
    color: #c1d435; }
  a.theme--yellow,
  .theme--yellow a,
  .theme .theme.theme--yellow a, a:active.theme--yellow,
  .theme--yellow a:active,
  .theme .theme.theme--yellow a:active, a:visited.theme--yellow,
  .theme--yellow a:visited,
  .theme .theme.theme--yellow a:visited,
  .anchor.theme--yellow,
  .theme--yellow
  .anchor,
  .theme .theme.theme--yellow
  .anchor,
  .anchor:active.theme--yellow,
  .theme--yellow
  .anchor:active,
  .theme .theme.theme--yellow
  .anchor:active,
  .anchor:visited.theme--yellow,
  .theme--yellow
  .anchor:visited,
  .theme .theme.theme--yellow
  .anchor:visited {
    color: #facf21; }
  a.theme--gold,
  .theme--gold a,
  .theme .theme.theme--gold a, a:active.theme--gold,
  .theme--gold a:active,
  .theme .theme.theme--gold a:active, a:visited.theme--gold,
  .theme--gold a:visited,
  .theme .theme.theme--gold a:visited,
  .anchor.theme--gold,
  .theme--gold
  .anchor,
  .theme .theme.theme--gold
  .anchor,
  .anchor:active.theme--gold,
  .theme--gold
  .anchor:active,
  .theme .theme.theme--gold
  .anchor:active,
  .anchor:visited.theme--gold,
  .theme--gold
  .anchor:visited,
  .theme .theme.theme--gold
  .anchor:visited {
    color: #eb942c; }
  a.theme--orange,
  .theme--orange a,
  .theme .theme.theme--orange a, a:active.theme--orange,
  .theme--orange a:active,
  .theme .theme.theme--orange a:active, a:visited.theme--orange,
  .theme--orange a:visited,
  .theme .theme.theme--orange a:visited,
  .anchor.theme--orange,
  .theme--orange
  .anchor,
  .theme .theme.theme--orange
  .anchor,
  .anchor:active.theme--orange,
  .theme--orange
  .anchor:active,
  .theme .theme.theme--orange
  .anchor:active,
  .anchor:visited.theme--orange,
  .theme--orange
  .anchor:visited,
  .theme .theme.theme--orange
  .anchor:visited {
    color: #e26435; }
  a.theme--salmon,
  .theme--salmon a,
  .theme .theme.theme--salmon a, a:active.theme--salmon,
  .theme--salmon a:active,
  .theme .theme.theme--salmon a:active, a:visited.theme--salmon,
  .theme--salmon a:visited,
  .theme .theme.theme--salmon a:visited,
  .anchor.theme--salmon,
  .theme--salmon
  .anchor,
  .theme .theme.theme--salmon
  .anchor,
  .anchor:active.theme--salmon,
  .theme--salmon
  .anchor:active,
  .theme .theme.theme--salmon
  .anchor:active,
  .anchor:visited.theme--salmon,
  .theme--salmon
  .anchor:visited,
  .theme .theme.theme--salmon
  .anchor:visited {
    color: #eb735d; }
  a.theme--red,
  .theme--red a,
  .theme .theme.theme--red a, a:active.theme--red,
  .theme--red a:active,
  .theme .theme.theme--red a:active, a:visited.theme--red,
  .theme--red a:visited,
  .theme .theme.theme--red a:visited,
  .anchor.theme--red,
  .theme--red
  .anchor,
  .theme .theme.theme--red
  .anchor,
  .anchor:active.theme--red,
  .theme--red
  .anchor:active,
  .theme .theme.theme--red
  .anchor:active,
  .anchor:visited.theme--red,
  .theme--red
  .anchor:visited,
  .theme .theme.theme--red
  .anchor:visited {
    color: #ec2d10; }
  a.theme--burgundy,
  .theme--burgundy a,
  .theme .theme.theme--burgundy a, a:active.theme--burgundy,
  .theme--burgundy a:active,
  .theme .theme.theme--burgundy a:active, a:visited.theme--burgundy,
  .theme--burgundy a:visited,
  .theme .theme.theme--burgundy a:visited,
  .anchor.theme--burgundy,
  .theme--burgundy
  .anchor,
  .theme .theme.theme--burgundy
  .anchor,
  .anchor:active.theme--burgundy,
  .theme--burgundy
  .anchor:active,
  .theme .theme.theme--burgundy
  .anchor:active,
  .anchor:visited.theme--burgundy,
  .theme--burgundy
  .anchor:visited,
  .theme .theme.theme--burgundy
  .anchor:visited {
    color: #ba222a; }
  a.theme--purple,
  .theme--purple a,
  .theme .theme.theme--purple a, a:active.theme--purple,
  .theme--purple a:active,
  .theme .theme.theme--purple a:active, a:visited.theme--purple,
  .theme--purple a:visited,
  .theme .theme.theme--purple a:visited,
  .anchor.theme--purple,
  .theme--purple
  .anchor,
  .theme .theme.theme--purple
  .anchor,
  .anchor:active.theme--purple,
  .theme--purple
  .anchor:active,
  .theme .theme.theme--purple
  .anchor:active,
  .anchor:visited.theme--purple,
  .theme--purple
  .anchor:visited,
  .theme .theme.theme--purple
  .anchor:visited {
    color: #9b3381; }
  a.theme--youth,
  .theme--youth a,
  .theme .theme.theme--youth a, a:active.theme--youth,
  .theme--youth a:active,
  .theme .theme.theme--youth a:active, a:visited.theme--youth,
  .theme--youth a:visited,
  .theme .theme.theme--youth a:visited,
  .anchor.theme--youth,
  .theme--youth
  .anchor,
  .theme .theme.theme--youth
  .anchor,
  .anchor:active.theme--youth,
  .theme--youth
  .anchor:active,
  .theme .theme.theme--youth
  .anchor:active,
  .anchor:visited.theme--youth,
  .theme--youth
  .anchor:visited,
  .theme .theme.theme--youth
  .anchor:visited {
    color: #d57800; }
  a.theme--digitalisation,
  .theme--digitalisation a,
  .theme .theme.theme--digitalisation a, a:active.theme--digitalisation,
  .theme--digitalisation a:active,
  .theme .theme.theme--digitalisation a:active, a:visited.theme--digitalisation,
  .theme--digitalisation a:visited,
  .theme .theme.theme--digitalisation a:visited,
  .anchor.theme--digitalisation,
  .theme--digitalisation
  .anchor,
  .theme .theme.theme--digitalisation
  .anchor,
  .anchor:active.theme--digitalisation,
  .theme--digitalisation
  .anchor:active,
  .theme .theme.theme--digitalisation
  .anchor:active,
  .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .anchor:visited,
  .theme .theme.theme--digitalisation
  .anchor:visited {
    color: #9a3324; }
  a.theme--climate,
  .theme--climate a,
  .theme .theme.theme--climate a, a:active.theme--climate,
  .theme--climate a:active,
  .theme .theme.theme--climate a:active, a:visited.theme--climate,
  .theme--climate a:visited,
  .theme .theme.theme--climate a:visited,
  .anchor.theme--climate,
  .theme--climate
  .anchor,
  .theme .theme.theme--climate
  .anchor,
  .anchor:active.theme--climate,
  .theme--climate
  .anchor:active,
  .theme .theme.theme--climate
  .anchor:active,
  .anchor:visited.theme--climate,
  .theme--climate
  .anchor:visited,
  .theme .theme.theme--climate
  .anchor:visited {
    color: #693c5e; }
  a.theme--gender,
  .theme--gender a,
  .theme .theme.theme--gender a, a:active.theme--gender,
  .theme--gender a:active,
  .theme .theme.theme--gender a:active, a:visited.theme--gender,
  .theme--gender a:visited,
  .theme .theme.theme--gender a:visited,
  .anchor.theme--gender,
  .theme--gender
  .anchor,
  .theme .theme.theme--gender
  .anchor,
  .anchor:active.theme--gender,
  .theme--gender
  .anchor:active,
  .theme .theme.theme--gender
  .anchor:active,
  .anchor:visited.theme--gender,
  .theme--gender
  .anchor:visited,
  .theme .theme.theme--gender
  .anchor:visited {
    color: #046a38; }
  a.theme--nutrition,
  .theme--nutrition a,
  .theme .theme.theme--nutrition a, a:active.theme--nutrition,
  .theme--nutrition a:active,
  .theme .theme.theme--nutrition a:active, a:visited.theme--nutrition,
  .theme--nutrition a:visited,
  .theme .theme.theme--nutrition a:visited,
  .anchor.theme--nutrition,
  .theme--nutrition
  .anchor,
  .theme .theme.theme--nutrition
  .anchor,
  .anchor:active.theme--nutrition,
  .theme--nutrition
  .anchor:active,
  .theme .theme.theme--nutrition
  .anchor:active,
  .anchor:visited.theme--nutrition,
  .theme--nutrition
  .anchor:visited,
  .theme .theme.theme--nutrition
  .anchor:visited {
    color: #487a7b; }
  a.theme--blog,
  .theme--blog a,
  .theme .theme.theme--blog a, a:active.theme--blog,
  .theme--blog a:active,
  .theme .theme.theme--blog a:active, a:visited.theme--blog,
  .theme--blog a:visited,
  .theme .theme.theme--blog a:visited,
  .anchor.theme--blog,
  .theme--blog
  .anchor,
  .theme .theme.theme--blog
  .anchor,
  .anchor:active.theme--blog,
  .theme--blog
  .anchor:active,
  .theme .theme.theme--blog
  .anchor:active,
  .anchor:visited.theme--blog,
  .theme--blog
  .anchor:visited,
  .theme .theme.theme--blog
  .anchor:visited {
    color: #ffa300; }
  a.theme--spore-blue,
  .theme--spore-blue a,
  .theme .theme.theme--spore-blue a, a:active.theme--spore-blue,
  .theme--spore-blue a:active,
  .theme .theme.theme--spore-blue a:active, a:visited.theme--spore-blue,
  .theme--spore-blue a:visited,
  .theme .theme.theme--spore-blue a:visited,
  .anchor.theme--spore-blue,
  .theme--spore-blue
  .anchor,
  .theme .theme.theme--spore-blue
  .anchor,
  .anchor:active.theme--spore-blue,
  .theme--spore-blue
  .anchor:active,
  .theme .theme.theme--spore-blue
  .anchor:active,
  .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .anchor:visited,
  .theme .theme.theme--spore-blue
  .anchor:visited {
    color: #3f68b1; }
  a.theme--spore-brown,
  .theme--spore-brown a,
  .theme .theme.theme--spore-brown a, a:active.theme--spore-brown,
  .theme--spore-brown a:active,
  .theme .theme.theme--spore-brown a:active, a:visited.theme--spore-brown,
  .theme--spore-brown a:visited,
  .theme .theme.theme--spore-brown a:visited,
  .anchor.theme--spore-brown,
  .theme--spore-brown
  .anchor,
  .theme .theme.theme--spore-brown
  .anchor,
  .anchor:active.theme--spore-brown,
  .theme--spore-brown
  .anchor:active,
  .theme .theme.theme--spore-brown
  .anchor:active,
  .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .anchor:visited,
  .theme .theme.theme--spore-brown
  .anchor:visited {
    color: #774b04; }
  a.theme--spore-dark-blue,
  .theme--spore-dark-blue a,
  .theme .theme.theme--spore-dark-blue a, a:active.theme--spore-dark-blue,
  .theme--spore-dark-blue a:active,
  .theme .theme.theme--spore-dark-blue a:active, a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue a:visited,
  .theme .theme.theme--spore-dark-blue a:visited,
  .anchor.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .anchor,
  .theme .theme.theme--spore-dark-blue
  .anchor,
  .anchor:active.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .anchor:active,
  .theme .theme.theme--spore-dark-blue
  .anchor:active,
  .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .anchor:visited {
    color: #044e7e; }
  a.theme--spore-forest-green,
  .theme--spore-forest-green a,
  .theme .theme.theme--spore-forest-green a, a:active.theme--spore-forest-green,
  .theme--spore-forest-green a:active,
  .theme .theme.theme--spore-forest-green a:active, a:visited.theme--spore-forest-green,
  .theme--spore-forest-green a:visited,
  .theme .theme.theme--spore-forest-green a:visited,
  .anchor.theme--spore-forest-green,
  .theme--spore-forest-green
  .anchor,
  .theme .theme.theme--spore-forest-green
  .anchor,
  .anchor:active.theme--spore-forest-green,
  .theme--spore-forest-green
  .anchor:active,
  .theme .theme.theme--spore-forest-green
  .anchor:active,
  .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .anchor:visited {
    color: #5f810a; }
  a.theme--spore-grey-blue,
  .theme--spore-grey-blue a,
  .theme .theme.theme--spore-grey-blue a, a:active.theme--spore-grey-blue,
  .theme--spore-grey-blue a:active,
  .theme .theme.theme--spore-grey-blue a:active, a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue a:visited,
  .theme .theme.theme--spore-grey-blue a:visited,
  .anchor.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .anchor,
  .theme .theme.theme--spore-grey-blue
  .anchor,
  .anchor:active.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .anchor:active,
  .theme .theme.theme--spore-grey-blue
  .anchor:active,
  .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .anchor:visited {
    color: #6d8c9f; }
  a.theme--spore-light-blue,
  .theme--spore-light-blue a,
  .theme .theme.theme--spore-light-blue a, a:active.theme--spore-light-blue,
  .theme--spore-light-blue a:active,
  .theme .theme.theme--spore-light-blue a:active, a:visited.theme--spore-light-blue,
  .theme--spore-light-blue a:visited,
  .theme .theme.theme--spore-light-blue a:visited,
  .anchor.theme--spore-light-blue,
  .theme--spore-light-blue
  .anchor,
  .theme .theme.theme--spore-light-blue
  .anchor,
  .anchor:active.theme--spore-light-blue,
  .theme--spore-light-blue
  .anchor:active,
  .theme .theme.theme--spore-light-blue
  .anchor:active,
  .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .anchor:visited {
    color: #79accf; }
  a.theme--spore-lime,
  .theme--spore-lime a,
  .theme .theme.theme--spore-lime a, a:active.theme--spore-lime,
  .theme--spore-lime a:active,
  .theme .theme.theme--spore-lime a:active, a:visited.theme--spore-lime,
  .theme--spore-lime a:visited,
  .theme .theme.theme--spore-lime a:visited,
  .anchor.theme--spore-lime,
  .theme--spore-lime
  .anchor,
  .theme .theme.theme--spore-lime
  .anchor,
  .anchor:active.theme--spore-lime,
  .theme--spore-lime
  .anchor:active,
  .theme .theme.theme--spore-lime
  .anchor:active,
  .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .anchor:visited,
  .theme .theme.theme--spore-lime
  .anchor:visited {
    color: #bbae03; }
  a.theme--spore-ochre,
  .theme--spore-ochre a,
  .theme .theme.theme--spore-ochre a, a:active.theme--spore-ochre,
  .theme--spore-ochre a:active,
  .theme .theme.theme--spore-ochre a:active, a:visited.theme--spore-ochre,
  .theme--spore-ochre a:visited,
  .theme .theme.theme--spore-ochre a:visited,
  .anchor.theme--spore-ochre,
  .theme--spore-ochre
  .anchor,
  .theme .theme.theme--spore-ochre
  .anchor,
  .anchor:active.theme--spore-ochre,
  .theme--spore-ochre
  .anchor:active,
  .theme .theme.theme--spore-ochre
  .anchor:active,
  .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .anchor:visited,
  .theme .theme.theme--spore-ochre
  .anchor:visited {
    color: #db9623; }
  a.theme--spore-olive-green,
  .theme--spore-olive-green a,
  .theme .theme.theme--spore-olive-green a, a:active.theme--spore-olive-green,
  .theme--spore-olive-green a:active,
  .theme .theme.theme--spore-olive-green a:active, a:visited.theme--spore-olive-green,
  .theme--spore-olive-green a:visited,
  .theme .theme.theme--spore-olive-green a:visited,
  .anchor.theme--spore-olive-green,
  .theme--spore-olive-green
  .anchor,
  .theme .theme.theme--spore-olive-green
  .anchor,
  .anchor:active.theme--spore-olive-green,
  .theme--spore-olive-green
  .anchor:active,
  .theme .theme.theme--spore-olive-green
  .anchor:active,
  .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .anchor:visited {
    color: #778d3e; }
  a.theme--spore-red,
  .theme--spore-red a,
  .theme .theme.theme--spore-red a, a:active.theme--spore-red,
  .theme--spore-red a:active,
  .theme .theme.theme--spore-red a:active, a:visited.theme--spore-red,
  .theme--spore-red a:visited,
  .theme .theme.theme--spore-red a:visited,
  .anchor.theme--spore-red,
  .theme--spore-red
  .anchor,
  .theme .theme.theme--spore-red
  .anchor,
  .anchor:active.theme--spore-red,
  .theme--spore-red
  .anchor:active,
  .theme .theme.theme--spore-red
  .anchor:active,
  .anchor:visited.theme--spore-red,
  .theme--spore-red
  .anchor:visited,
  .theme .theme.theme--spore-red
  .anchor:visited {
    color: #f54c23; }
  a.theme--spore-taupe,
  .theme--spore-taupe a,
  .theme .theme.theme--spore-taupe a, a:active.theme--spore-taupe,
  .theme--spore-taupe a:active,
  .theme .theme.theme--spore-taupe a:active, a:visited.theme--spore-taupe,
  .theme--spore-taupe a:visited,
  .theme .theme.theme--spore-taupe a:visited,
  .anchor.theme--spore-taupe,
  .theme--spore-taupe
  .anchor,
  .theme .theme.theme--spore-taupe
  .anchor,
  .anchor:active.theme--spore-taupe,
  .theme--spore-taupe
  .anchor:active,
  .theme .theme.theme--spore-taupe
  .anchor:active,
  .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .anchor:visited,
  .theme .theme.theme--spore-taupe
  .anchor:visited {
    color: #7b6d65; }
  a.theme--spore-teal,
  .theme--spore-teal a,
  .theme .theme.theme--spore-teal a, a:active.theme--spore-teal,
  .theme--spore-teal a:active,
  .theme .theme.theme--spore-teal a:active, a:visited.theme--spore-teal,
  .theme--spore-teal a:visited,
  .theme .theme.theme--spore-teal a:visited,
  .anchor.theme--spore-teal,
  .theme--spore-teal
  .anchor,
  .theme .theme.theme--spore-teal
  .anchor,
  .anchor:active.theme--spore-teal,
  .theme--spore-teal
  .anchor:active,
  .theme .theme.theme--spore-teal
  .anchor:active,
  .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .anchor:visited,
  .theme .theme.theme--spore-teal
  .anchor:visited {
    color: #077fc1; }

.theme--dark a, .theme--dark a:active, .theme--dark a:visited,
.theme .theme--dark a,
.theme .theme--dark a:active,
.theme .theme--dark a:visited, .theme--dark
.anchor, .theme--dark
.anchor:active, .theme--dark
.anchor:visited,
.theme .theme--dark
.anchor,
.theme .theme--dark
.anchor:active,
.theme .theme--dark
.anchor:visited {
  color: #3d3d3d; }

.theme--green a, .theme--green a:active, .theme--green a:visited,
.theme .theme--green a,
.theme .theme--green a:active,
.theme .theme--green a:visited, .theme--green
.anchor, .theme--green
.anchor:active, .theme--green
.anchor:visited,
.theme .theme--green
.anchor,
.theme .theme--green
.anchor:active,
.theme .theme--green
.anchor:visited {
  color: #67ab43; }

.theme--blue a, .theme--blue a:active, .theme--blue a:visited,
.theme .theme--blue a,
.theme .theme--blue a:active,
.theme .theme--blue a:visited, .theme--blue
.anchor, .theme--blue
.anchor:active, .theme--blue
.anchor:visited,
.theme .theme--blue
.anchor,
.theme .theme--blue
.anchor:active,
.theme .theme--blue
.anchor:visited {
  color: #56c0dd; }

.theme--lime a, .theme--lime a:active, .theme--lime a:visited,
.theme .theme--lime a,
.theme .theme--lime a:active,
.theme .theme--lime a:visited, .theme--lime
.anchor, .theme--lime
.anchor:active, .theme--lime
.anchor:visited,
.theme .theme--lime
.anchor,
.theme .theme--lime
.anchor:active,
.theme .theme--lime
.anchor:visited {
  color: #c1d435; }

.theme--yellow a, .theme--yellow a:active, .theme--yellow a:visited,
.theme .theme--yellow a,
.theme .theme--yellow a:active,
.theme .theme--yellow a:visited, .theme--yellow
.anchor, .theme--yellow
.anchor:active, .theme--yellow
.anchor:visited,
.theme .theme--yellow
.anchor,
.theme .theme--yellow
.anchor:active,
.theme .theme--yellow
.anchor:visited {
  color: #facf21; }

.theme--gold a, .theme--gold a:active, .theme--gold a:visited,
.theme .theme--gold a,
.theme .theme--gold a:active,
.theme .theme--gold a:visited, .theme--gold
.anchor, .theme--gold
.anchor:active, .theme--gold
.anchor:visited,
.theme .theme--gold
.anchor,
.theme .theme--gold
.anchor:active,
.theme .theme--gold
.anchor:visited {
  color: #eb942c; }

.theme--orange a, .theme--orange a:active, .theme--orange a:visited,
.theme .theme--orange a,
.theme .theme--orange a:active,
.theme .theme--orange a:visited, .theme--orange
.anchor, .theme--orange
.anchor:active, .theme--orange
.anchor:visited,
.theme .theme--orange
.anchor,
.theme .theme--orange
.anchor:active,
.theme .theme--orange
.anchor:visited {
  color: #e26435; }

.theme--salmon a, .theme--salmon a:active, .theme--salmon a:visited,
.theme .theme--salmon a,
.theme .theme--salmon a:active,
.theme .theme--salmon a:visited, .theme--salmon
.anchor, .theme--salmon
.anchor:active, .theme--salmon
.anchor:visited,
.theme .theme--salmon
.anchor,
.theme .theme--salmon
.anchor:active,
.theme .theme--salmon
.anchor:visited {
  color: #eb735d; }

.theme--red a, .theme--red a:active, .theme--red a:visited,
.theme .theme--red a,
.theme .theme--red a:active,
.theme .theme--red a:visited, .theme--red
.anchor, .theme--red
.anchor:active, .theme--red
.anchor:visited,
.theme .theme--red
.anchor,
.theme .theme--red
.anchor:active,
.theme .theme--red
.anchor:visited {
  color: #ec2d10; }

.theme--burgundy a, .theme--burgundy a:active, .theme--burgundy a:visited,
.theme .theme--burgundy a,
.theme .theme--burgundy a:active,
.theme .theme--burgundy a:visited, .theme--burgundy
.anchor, .theme--burgundy
.anchor:active, .theme--burgundy
.anchor:visited,
.theme .theme--burgundy
.anchor,
.theme .theme--burgundy
.anchor:active,
.theme .theme--burgundy
.anchor:visited {
  color: #ba222a; }

.theme--purple a, .theme--purple a:active, .theme--purple a:visited,
.theme .theme--purple a,
.theme .theme--purple a:active,
.theme .theme--purple a:visited, .theme--purple
.anchor, .theme--purple
.anchor:active, .theme--purple
.anchor:visited,
.theme .theme--purple
.anchor,
.theme .theme--purple
.anchor:active,
.theme .theme--purple
.anchor:visited {
  color: #9b3381; }

.theme--youth a, .theme--youth a:active, .theme--youth a:visited,
.theme .theme--youth a,
.theme .theme--youth a:active,
.theme .theme--youth a:visited, .theme--youth
.anchor, .theme--youth
.anchor:active, .theme--youth
.anchor:visited,
.theme .theme--youth
.anchor,
.theme .theme--youth
.anchor:active,
.theme .theme--youth
.anchor:visited {
  color: #d57800; }

.theme--digitalisation a, .theme--digitalisation a:active, .theme--digitalisation a:visited,
.theme .theme--digitalisation a,
.theme .theme--digitalisation a:active,
.theme .theme--digitalisation a:visited, .theme--digitalisation
.anchor, .theme--digitalisation
.anchor:active, .theme--digitalisation
.anchor:visited,
.theme .theme--digitalisation
.anchor,
.theme .theme--digitalisation
.anchor:active,
.theme .theme--digitalisation
.anchor:visited {
  color: #9a3324; }

.theme--climate a, .theme--climate a:active, .theme--climate a:visited,
.theme .theme--climate a,
.theme .theme--climate a:active,
.theme .theme--climate a:visited, .theme--climate
.anchor, .theme--climate
.anchor:active, .theme--climate
.anchor:visited,
.theme .theme--climate
.anchor,
.theme .theme--climate
.anchor:active,
.theme .theme--climate
.anchor:visited {
  color: #693c5e; }

.theme--gender a, .theme--gender a:active, .theme--gender a:visited,
.theme .theme--gender a,
.theme .theme--gender a:active,
.theme .theme--gender a:visited, .theme--gender
.anchor, .theme--gender
.anchor:active, .theme--gender
.anchor:visited,
.theme .theme--gender
.anchor,
.theme .theme--gender
.anchor:active,
.theme .theme--gender
.anchor:visited {
  color: #046a38; }

.theme--nutrition a, .theme--nutrition a:active, .theme--nutrition a:visited,
.theme .theme--nutrition a,
.theme .theme--nutrition a:active,
.theme .theme--nutrition a:visited, .theme--nutrition
.anchor, .theme--nutrition
.anchor:active, .theme--nutrition
.anchor:visited,
.theme .theme--nutrition
.anchor,
.theme .theme--nutrition
.anchor:active,
.theme .theme--nutrition
.anchor:visited {
  color: #487a7b; }

.theme--blog a, .theme--blog a:active, .theme--blog a:visited,
.theme .theme--blog a,
.theme .theme--blog a:active,
.theme .theme--blog a:visited, .theme--blog
.anchor, .theme--blog
.anchor:active, .theme--blog
.anchor:visited,
.theme .theme--blog
.anchor,
.theme .theme--blog
.anchor:active,
.theme .theme--blog
.anchor:visited {
  color: #ffa300; }

.theme--spore-blue a, .theme--spore-blue a:active, .theme--spore-blue a:visited,
.theme .theme--spore-blue a,
.theme .theme--spore-blue a:active,
.theme .theme--spore-blue a:visited, .theme--spore-blue
.anchor, .theme--spore-blue
.anchor:active, .theme--spore-blue
.anchor:visited,
.theme .theme--spore-blue
.anchor,
.theme .theme--spore-blue
.anchor:active,
.theme .theme--spore-blue
.anchor:visited {
  color: #3f68b1; }

.theme--spore-brown a, .theme--spore-brown a:active, .theme--spore-brown a:visited,
.theme .theme--spore-brown a,
.theme .theme--spore-brown a:active,
.theme .theme--spore-brown a:visited, .theme--spore-brown
.anchor, .theme--spore-brown
.anchor:active, .theme--spore-brown
.anchor:visited,
.theme .theme--spore-brown
.anchor,
.theme .theme--spore-brown
.anchor:active,
.theme .theme--spore-brown
.anchor:visited {
  color: #774b04; }

.theme--spore-dark-blue a, .theme--spore-dark-blue a:active, .theme--spore-dark-blue a:visited,
.theme .theme--spore-dark-blue a,
.theme .theme--spore-dark-blue a:active,
.theme .theme--spore-dark-blue a:visited, .theme--spore-dark-blue
.anchor, .theme--spore-dark-blue
.anchor:active, .theme--spore-dark-blue
.anchor:visited,
.theme .theme--spore-dark-blue
.anchor,
.theme .theme--spore-dark-blue
.anchor:active,
.theme .theme--spore-dark-blue
.anchor:visited {
  color: #044e7e; }

.theme--spore-forest-green a, .theme--spore-forest-green a:active, .theme--spore-forest-green a:visited,
.theme .theme--spore-forest-green a,
.theme .theme--spore-forest-green a:active,
.theme .theme--spore-forest-green a:visited, .theme--spore-forest-green
.anchor, .theme--spore-forest-green
.anchor:active, .theme--spore-forest-green
.anchor:visited,
.theme .theme--spore-forest-green
.anchor,
.theme .theme--spore-forest-green
.anchor:active,
.theme .theme--spore-forest-green
.anchor:visited {
  color: #5f810a; }

.theme--spore-grey-blue a, .theme--spore-grey-blue a:active, .theme--spore-grey-blue a:visited,
.theme .theme--spore-grey-blue a,
.theme .theme--spore-grey-blue a:active,
.theme .theme--spore-grey-blue a:visited, .theme--spore-grey-blue
.anchor, .theme--spore-grey-blue
.anchor:active, .theme--spore-grey-blue
.anchor:visited,
.theme .theme--spore-grey-blue
.anchor,
.theme .theme--spore-grey-blue
.anchor:active,
.theme .theme--spore-grey-blue
.anchor:visited {
  color: #6d8c9f; }

.theme--spore-light-blue a, .theme--spore-light-blue a:active, .theme--spore-light-blue a:visited,
.theme .theme--spore-light-blue a,
.theme .theme--spore-light-blue a:active,
.theme .theme--spore-light-blue a:visited, .theme--spore-light-blue
.anchor, .theme--spore-light-blue
.anchor:active, .theme--spore-light-blue
.anchor:visited,
.theme .theme--spore-light-blue
.anchor,
.theme .theme--spore-light-blue
.anchor:active,
.theme .theme--spore-light-blue
.anchor:visited {
  color: #79accf; }

.theme--spore-lime a, .theme--spore-lime a:active, .theme--spore-lime a:visited,
.theme .theme--spore-lime a,
.theme .theme--spore-lime a:active,
.theme .theme--spore-lime a:visited, .theme--spore-lime
.anchor, .theme--spore-lime
.anchor:active, .theme--spore-lime
.anchor:visited,
.theme .theme--spore-lime
.anchor,
.theme .theme--spore-lime
.anchor:active,
.theme .theme--spore-lime
.anchor:visited {
  color: #bbae03; }

.theme--spore-ochre a, .theme--spore-ochre a:active, .theme--spore-ochre a:visited,
.theme .theme--spore-ochre a,
.theme .theme--spore-ochre a:active,
.theme .theme--spore-ochre a:visited, .theme--spore-ochre
.anchor, .theme--spore-ochre
.anchor:active, .theme--spore-ochre
.anchor:visited,
.theme .theme--spore-ochre
.anchor,
.theme .theme--spore-ochre
.anchor:active,
.theme .theme--spore-ochre
.anchor:visited {
  color: #db9623; }

.theme--spore-olive-green a, .theme--spore-olive-green a:active, .theme--spore-olive-green a:visited,
.theme .theme--spore-olive-green a,
.theme .theme--spore-olive-green a:active,
.theme .theme--spore-olive-green a:visited, .theme--spore-olive-green
.anchor, .theme--spore-olive-green
.anchor:active, .theme--spore-olive-green
.anchor:visited,
.theme .theme--spore-olive-green
.anchor,
.theme .theme--spore-olive-green
.anchor:active,
.theme .theme--spore-olive-green
.anchor:visited {
  color: #778d3e; }

.theme--spore-red a, .theme--spore-red a:active, .theme--spore-red a:visited,
.theme .theme--spore-red a,
.theme .theme--spore-red a:active,
.theme .theme--spore-red a:visited, .theme--spore-red
.anchor, .theme--spore-red
.anchor:active, .theme--spore-red
.anchor:visited,
.theme .theme--spore-red
.anchor,
.theme .theme--spore-red
.anchor:active,
.theme .theme--spore-red
.anchor:visited {
  color: #f54c23; }

.theme--spore-taupe a, .theme--spore-taupe a:active, .theme--spore-taupe a:visited,
.theme .theme--spore-taupe a,
.theme .theme--spore-taupe a:active,
.theme .theme--spore-taupe a:visited, .theme--spore-taupe
.anchor, .theme--spore-taupe
.anchor:active, .theme--spore-taupe
.anchor:visited,
.theme .theme--spore-taupe
.anchor,
.theme .theme--spore-taupe
.anchor:active,
.theme .theme--spore-taupe
.anchor:visited {
  color: #7b6d65; }

.theme--spore-teal a, .theme--spore-teal a:active, .theme--spore-teal a:visited,
.theme .theme--spore-teal a,
.theme .theme--spore-teal a:active,
.theme .theme--spore-teal a:visited, .theme--spore-teal
.anchor, .theme--spore-teal
.anchor:active, .theme--spore-teal
.anchor:visited,
.theme .theme--spore-teal
.anchor,
.theme .theme--spore-teal
.anchor:active,
.theme .theme--spore-teal
.anchor:visited {
  color: #077fc1; }

a:visited .is-heir,
.anchor:visited .is-heir {
  color: inherit; }

a:hover, a:hover--shy, a:hover:hover,
.theme a,
.theme a--shy,
.theme a:hover,
.theme .theme a,
.theme .theme a--shy,
.theme .theme a:hover, a.is-heir, a.is-heir--shy, a.is-heir:hover,
a:hover .is-heir,
a:hover .is-heir--shy,
a:hover .is-heir:hover,
.anchor:hover,
.anchor:hover--shy,
.anchor:hover:hover,
.theme
.anchor,
.theme
.anchor--shy,
.theme
.anchor:hover,
.theme .theme
.anchor,
.theme .theme
.anchor--shy,
.theme .theme
.anchor:hover,
.anchor.is-heir,
.anchor.is-heir--shy,
.anchor.is-heir:hover,
.anchor:hover .is-heir,
.anchor:hover .is-heir--shy,
.anchor:hover .is-heir:hover {
  color: #3d3d3d; }

a--shy, a--shy:visited,
.theme .theme a--shy,
.theme a--shy,
.anchor--shy,
.anchor--shy:visited,
.theme .theme
.anchor--shy,
.theme
.anchor--shy {
  color: inherit; }

.post-anchor a:visited,
.theme--blue .post-anchor a:visited,
.theme--lime .post-anchor a:visited,
.theme--yellow .post-anchor a:visited,
.theme--gold .post-anchor a:visited,
.theme--orange .post-anchor a:visited,
.theme--salmon .post-anchor a:visited,
.theme--red .post-anchor a:visited,
.theme--burgundy .post-anchor a:visited,
.theme--purple .post-anchor a:visited,
.post-anchor .anchor:visited,
.theme--blue
.post-anchor .anchor:visited,
.theme--lime
.post-anchor .anchor:visited,
.theme--yellow
.post-anchor .anchor:visited,
.theme--gold
.post-anchor .anchor:visited,
.theme--orange
.post-anchor .anchor:visited,
.theme--salmon
.post-anchor .anchor:visited,
.theme--red
.post-anchor .anchor:visited,
.theme--burgundy
.post-anchor .anchor:visited,
.theme--purple
.post-anchor .anchor:visited {
  color: #527440; }
  .post-anchor a:visited.theme--dark,
  .theme--dark .post-anchor a:visited,
  .theme .theme.theme--dark .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--dark,
  .theme--dark
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--dark
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--dark,
  .theme--dark
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--dark
  .theme--purple
  .post-anchor .anchor:visited {
    color: #3d3d3d; }
  .post-anchor a:visited.theme--green,
  .theme--green .post-anchor a:visited,
  .theme .theme.theme--green .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--green,
  .theme--green
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--green,
  .theme--green
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--green,
  .theme--green
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--green,
  .theme--green
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--green,
  .theme--green
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--green,
  .theme--green
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--green,
  .theme--green
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--green,
  .theme--green
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--green,
  .theme--green
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--green
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--green,
  .theme--green
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--green
  .theme--purple
  .post-anchor .anchor:visited {
    color: #527440; }
  .post-anchor a:visited.theme--blue,
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--blue .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--blue,
  .theme--blue
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--blue
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--blue,
  .theme--blue
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--blue
  .theme--purple
  .post-anchor .anchor:visited {
    color: #4a7f8d; }
  .post-anchor a:visited.theme--lime,
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--lime .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--lime,
  .theme--lime
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--lime
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--lime,
  .theme--lime
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--lime
  .theme--purple
  .post-anchor .anchor:visited {
    color: #7f8939; }
  .post-anchor a:visited.theme--yellow,
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--yellow .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--yellow,
  .theme--yellow
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--yellow
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--yellow,
  .theme--yellow
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--yellow
  .theme--purple
  .post-anchor .anchor:visited {
    color: #9c862f; }
  .post-anchor a:visited.theme--gold,
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--gold .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--gold,
  .theme--gold
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--gold
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--gold,
  .theme--gold
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--gold
  .theme--purple
  .post-anchor .anchor:visited {
    color: #946935; }
  .post-anchor a:visited.theme--orange,
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--orange .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--orange,
  .theme--orange
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--orange
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--orange,
  .theme--orange
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--orange
  .theme--purple
  .post-anchor .anchor:visited {
    color: #905139; }
  .post-anchor a:visited.theme--salmon,
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--salmon .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--salmon,
  .theme--salmon
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--salmon
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--salmon,
  .theme--salmon
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--salmon
  .theme--purple
  .post-anchor .anchor:visited {
    color: #94584d; }
  .post-anchor a:visited.theme--red,
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--red .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--red,
  .theme--red
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--red,
  .theme--red
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--red,
  .theme--red
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--red,
  .theme--red
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--red,
  .theme--red
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--red,
  .theme--red
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--red,
  .theme--red
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--red,
  .theme--red
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--red,
  .theme--red
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--red
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--red,
  .theme--red
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--red
  .theme--purple
  .post-anchor .anchor:visited {
    color: #953527; }
  .post-anchor a:visited.theme--burgundy,
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--burgundy .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--burgundy,
  .theme--burgundy
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--burgundy
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--burgundy,
  .theme--burgundy
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--burgundy
  .theme--purple
  .post-anchor .anchor:visited {
    color: #7c3034; }
  .post-anchor a:visited.theme--purple,
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--purple .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--purple,
  .theme--purple
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--purple
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--purple,
  .theme--purple
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--purple
  .theme--purple
  .post-anchor .anchor:visited {
    color: #6c385f; }
  .post-anchor a:visited.theme--youth,
  .theme--youth .post-anchor a:visited,
  .theme .theme.theme--youth .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--youth,
  .theme--youth
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--youth
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--youth,
  .theme--youth
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--youth
  .theme--purple
  .post-anchor .anchor:visited {
    color: #895b1f; }
  .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation .post-anchor a:visited,
  .theme .theme.theme--digitalisation .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--digitalisation
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--digitalisation,
  .theme--digitalisation
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--digitalisation
  .theme--purple
  .post-anchor .anchor:visited {
    color: #6c3831; }
  .post-anchor a:visited.theme--climate,
  .theme--climate .post-anchor a:visited,
  .theme .theme.theme--climate .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--climate,
  .theme--climate
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--climate
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--climate,
  .theme--climate
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--climate
  .theme--purple
  .post-anchor .anchor:visited {
    color: #533d4e; }
  .post-anchor a:visited.theme--gender,
  .theme--gender .post-anchor a:visited,
  .theme .theme.theme--gender .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--gender,
  .theme--gender
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--gender
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--gender,
  .theme--gender
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--gender
  .theme--purple
  .post-anchor .anchor:visited {
    color: #21543b; }
  .post-anchor a:visited.theme--nutrition,
  .theme--nutrition .post-anchor a:visited,
  .theme .theme.theme--nutrition .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--nutrition,
  .theme--nutrition
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--nutrition
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--nutrition,
  .theme--nutrition
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--nutrition
  .theme--purple
  .post-anchor .anchor:visited {
    color: #435c5c; }
  .post-anchor a:visited.theme--blog,
  .theme--blog .post-anchor a:visited,
  .theme .theme.theme--blog .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--blog,
  .theme--blog
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--blog
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--blog,
  .theme--blog
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--blog
  .theme--purple
  .post-anchor .anchor:visited {
    color: #9e701f; }
  .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue .post-anchor a:visited,
  .theme .theme.theme--spore-blue .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-blue
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-blue,
  .theme--spore-blue
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-blue
  .theme--purple
  .post-anchor .anchor:visited {
    color: #3e5377; }
  .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown .post-anchor a:visited,
  .theme .theme.theme--spore-brown .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-brown
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-brown,
  .theme--spore-brown
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-brown
  .theme--purple
  .post-anchor .anchor:visited {
    color: #5a4421; }
  .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-dark-blue
  .theme--purple
  .post-anchor .anchor:visited {
    color: #21465e; }
  .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-forest-green
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-forest-green,
  .theme--spore-forest-green
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-forest-green
  .theme--purple
  .post-anchor .anchor:visited {
    color: #4e5f24; }
  .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-grey-blue
  .theme--purple
  .post-anchor .anchor:visited {
    color: #55656e; }
  .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-light-blue
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-light-blue,
  .theme--spore-light-blue
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-light-blue
  .theme--purple
  .post-anchor .anchor:visited {
    color: #5b7586; }
  .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime .post-anchor a:visited,
  .theme .theme.theme--spore-lime .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-lime
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-lime,
  .theme--spore-lime
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-lime
  .theme--purple
  .post-anchor .anchor:visited {
    color: #7c7620; }
  .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre .post-anchor a:visited,
  .theme .theme.theme--spore-ochre .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-ochre
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-ochre,
  .theme--spore-ochre
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-ochre
  .theme--purple
  .post-anchor .anchor:visited {
    color: #8c6a30; }
  .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-olive-green
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-olive-green,
  .theme--spore-olive-green
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-olive-green
  .theme--purple
  .post-anchor .anchor:visited {
    color: #5a653e; }
  .post-anchor a:visited.theme--spore-red,
  .theme--spore-red .post-anchor a:visited,
  .theme .theme.theme--spore-red .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-red,
  .theme--spore-red
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-red
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-red,
  .theme--spore-red
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-red
  .theme--purple
  .post-anchor .anchor:visited {
    color: #994530; }
  .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe .post-anchor a:visited,
  .theme .theme.theme--spore-taupe .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-taupe
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-taupe,
  .theme--spore-taupe
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-taupe
  .theme--purple
  .post-anchor .anchor:visited {
    color: #5c5551; }
  .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal .post-anchor a:visited,
  .theme .theme.theme--spore-teal .post-anchor a:visited,
  .theme--blue .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--blue .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--blue .post-anchor a:visited,
  .theme--lime .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--lime .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--lime .post-anchor a:visited,
  .theme--yellow .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--yellow .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--yellow .post-anchor a:visited,
  .theme--gold .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--gold .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--gold .post-anchor a:visited,
  .theme--orange .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--orange .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--orange .post-anchor a:visited,
  .theme--salmon .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--salmon .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--salmon .post-anchor a:visited,
  .theme--red .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--red .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--red .post-anchor a:visited,
  .theme--burgundy .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--burgundy .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--burgundy .post-anchor a:visited,
  .theme--purple .post-anchor a:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--purple .post-anchor a:visited,
  .theme .theme.theme--spore-teal
  .theme--purple .post-anchor a:visited,
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .post-anchor .anchor:visited,
  .theme--blue
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--blue
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--blue
  .post-anchor .anchor:visited,
  .theme--lime
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--lime
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--lime
  .post-anchor .anchor:visited,
  .theme--yellow
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--yellow
  .post-anchor .anchor:visited,
  .theme--gold
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--gold
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--gold
  .post-anchor .anchor:visited,
  .theme--orange
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--orange
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--orange
  .post-anchor .anchor:visited,
  .theme--salmon
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--salmon
  .post-anchor .anchor:visited,
  .theme--red
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--red
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--red
  .post-anchor .anchor:visited,
  .theme--burgundy
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--burgundy
  .post-anchor .anchor:visited,
  .theme--purple
  .post-anchor .anchor:visited.theme--spore-teal,
  .theme--spore-teal
  .theme--purple
  .post-anchor .anchor:visited,
  .theme .theme.theme--spore-teal
  .theme--purple
  .post-anchor .anchor:visited {
    color: #225e7f; }

/* 3.5 Button */
/*
Button

.button - Default button
.button.button--wide - Wider button
.button.button--stretch - Stretched default button
.button.button--shy - Borderless button
.button.button--inverse - Inversed button
.button.is-current - Active/current button
.button.is-disabled - Disabled button

markup:
<button class="{$modifiers}">Button</button>

Styleguide 3.5
*/
.button, [data-vendor="commento"] .commento-button.commento-submit-button {
  display: inline-block;
  padding: 9px 15px;
  background: #fff;
  text-decoration: none;
  font-size: 0.75em;
  font-weight: 600;
  line-height: 1em; }
  .button, [data-vendor="commento"] .commento-button.commento-submit-button, .button--dark,
  .well.well .button--dark {
    border: 2px solid #3d3d3d;
    color: #3d3d3d; }
  .button:hover, [data-vendor="commento"] .commento-button.commento-submit-button:hover, .button:active, [data-vendor="commento"] .commento-button.commento-submit-button:active, .button:focus, [data-vendor="commento"] .commento-button.commento-submit-button:focus,
  .well.well .button--dark:hover {
    border-color: #67ab43;
    background-color: #67ab43;
    color: #fff; }
    .button:hover.theme--dark, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--dark,
    .theme--dark .button:hover,
    .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--dark .commento-button.commento-submit-button:hover,
    .theme .theme--dark .button:hover,
    .theme .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--dark .commento-button.commento-submit-button:hover, .button:active.theme--dark, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--dark,
    .theme--dark .button:active,
    .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--dark .commento-button.commento-submit-button:active,
    .theme .theme--dark .button:active,
    .theme .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--dark .commento-button.commento-submit-button:active, .button:focus.theme--dark, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--dark,
    .theme--dark .button:focus,
    .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--dark .commento-button.commento-submit-button:focus,
    .theme .theme--dark .button:focus,
    .theme .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--dark .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--dark,
    .theme--dark
    .well.well .button--dark:hover,
    .theme .theme--dark
    .well.well .button--dark:hover {
      border-color: #3d3d3d; }
    .button:hover.theme--green, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--green,
    .theme--green .button:hover,
    .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--green .commento-button.commento-submit-button:hover,
    .theme .theme--green .button:hover,
    .theme .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--green .commento-button.commento-submit-button:hover, .button:active.theme--green, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--green,
    .theme--green .button:active,
    .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--green .commento-button.commento-submit-button:active,
    .theme .theme--green .button:active,
    .theme .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--green .commento-button.commento-submit-button:active, .button:focus.theme--green, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--green,
    .theme--green .button:focus,
    .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--green .commento-button.commento-submit-button:focus,
    .theme .theme--green .button:focus,
    .theme .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--green .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--green,
    .theme--green
    .well.well .button--dark:hover,
    .theme .theme--green
    .well.well .button--dark:hover {
      border-color: #67ab43; }
    .button:hover.theme--blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--blue,
    .theme--blue .button:hover,
    .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--blue .commento-button.commento-submit-button:hover,
    .theme .theme--blue .button:hover,
    .theme .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--blue .commento-button.commento-submit-button:hover, .button:active.theme--blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--blue,
    .theme--blue .button:active,
    .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--blue .commento-button.commento-submit-button:active,
    .theme .theme--blue .button:active,
    .theme .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--blue .commento-button.commento-submit-button:active, .button:focus.theme--blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--blue,
    .theme--blue .button:focus,
    .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--blue .commento-button.commento-submit-button:focus,
    .theme .theme--blue .button:focus,
    .theme .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--blue,
    .theme--blue
    .well.well .button--dark:hover,
    .theme .theme--blue
    .well.well .button--dark:hover {
      border-color: #56c0dd; }
    .button:hover.theme--lime, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--lime,
    .theme--lime .button:hover,
    .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--lime .commento-button.commento-submit-button:hover,
    .theme .theme--lime .button:hover,
    .theme .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--lime .commento-button.commento-submit-button:hover, .button:active.theme--lime, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--lime,
    .theme--lime .button:active,
    .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--lime .commento-button.commento-submit-button:active,
    .theme .theme--lime .button:active,
    .theme .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--lime .commento-button.commento-submit-button:active, .button:focus.theme--lime, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--lime,
    .theme--lime .button:focus,
    .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--lime .commento-button.commento-submit-button:focus,
    .theme .theme--lime .button:focus,
    .theme .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--lime .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--lime,
    .theme--lime
    .well.well .button--dark:hover,
    .theme .theme--lime
    .well.well .button--dark:hover {
      border-color: #c1d435; }
    .button:hover.theme--yellow, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--yellow,
    .theme--yellow .button:hover,
    .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--yellow .commento-button.commento-submit-button:hover,
    .theme .theme--yellow .button:hover,
    .theme .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--yellow .commento-button.commento-submit-button:hover, .button:active.theme--yellow, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--yellow,
    .theme--yellow .button:active,
    .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--yellow .commento-button.commento-submit-button:active,
    .theme .theme--yellow .button:active,
    .theme .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--yellow .commento-button.commento-submit-button:active, .button:focus.theme--yellow, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--yellow,
    .theme--yellow .button:focus,
    .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--yellow .commento-button.commento-submit-button:focus,
    .theme .theme--yellow .button:focus,
    .theme .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--yellow .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--yellow,
    .theme--yellow
    .well.well .button--dark:hover,
    .theme .theme--yellow
    .well.well .button--dark:hover {
      border-color: #facf21; }
    .button:hover.theme--gold, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--gold,
    .theme--gold .button:hover,
    .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--gold .commento-button.commento-submit-button:hover,
    .theme .theme--gold .button:hover,
    .theme .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--gold .commento-button.commento-submit-button:hover, .button:active.theme--gold, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--gold,
    .theme--gold .button:active,
    .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--gold .commento-button.commento-submit-button:active,
    .theme .theme--gold .button:active,
    .theme .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--gold .commento-button.commento-submit-button:active, .button:focus.theme--gold, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--gold,
    .theme--gold .button:focus,
    .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--gold .commento-button.commento-submit-button:focus,
    .theme .theme--gold .button:focus,
    .theme .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--gold .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--gold,
    .theme--gold
    .well.well .button--dark:hover,
    .theme .theme--gold
    .well.well .button--dark:hover {
      border-color: #eb942c; }
    .button:hover.theme--orange, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--orange,
    .theme--orange .button:hover,
    .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--orange .commento-button.commento-submit-button:hover,
    .theme .theme--orange .button:hover,
    .theme .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--orange .commento-button.commento-submit-button:hover, .button:active.theme--orange, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--orange,
    .theme--orange .button:active,
    .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--orange .commento-button.commento-submit-button:active,
    .theme .theme--orange .button:active,
    .theme .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--orange .commento-button.commento-submit-button:active, .button:focus.theme--orange, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--orange,
    .theme--orange .button:focus,
    .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--orange .commento-button.commento-submit-button:focus,
    .theme .theme--orange .button:focus,
    .theme .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--orange .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--orange,
    .theme--orange
    .well.well .button--dark:hover,
    .theme .theme--orange
    .well.well .button--dark:hover {
      border-color: #e26435; }
    .button:hover.theme--salmon, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--salmon,
    .theme--salmon .button:hover,
    .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--salmon .commento-button.commento-submit-button:hover,
    .theme .theme--salmon .button:hover,
    .theme .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--salmon .commento-button.commento-submit-button:hover, .button:active.theme--salmon, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--salmon,
    .theme--salmon .button:active,
    .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--salmon .commento-button.commento-submit-button:active,
    .theme .theme--salmon .button:active,
    .theme .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--salmon .commento-button.commento-submit-button:active, .button:focus.theme--salmon, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--salmon,
    .theme--salmon .button:focus,
    .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--salmon .commento-button.commento-submit-button:focus,
    .theme .theme--salmon .button:focus,
    .theme .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--salmon .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--salmon,
    .theme--salmon
    .well.well .button--dark:hover,
    .theme .theme--salmon
    .well.well .button--dark:hover {
      border-color: #eb735d; }
    .button:hover.theme--red, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--red,
    .theme--red .button:hover,
    .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--red .commento-button.commento-submit-button:hover,
    .theme .theme--red .button:hover,
    .theme .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--red .commento-button.commento-submit-button:hover, .button:active.theme--red, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--red,
    .theme--red .button:active,
    .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--red .commento-button.commento-submit-button:active,
    .theme .theme--red .button:active,
    .theme .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--red .commento-button.commento-submit-button:active, .button:focus.theme--red, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--red,
    .theme--red .button:focus,
    .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--red .commento-button.commento-submit-button:focus,
    .theme .theme--red .button:focus,
    .theme .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--red .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--red,
    .theme--red
    .well.well .button--dark:hover,
    .theme .theme--red
    .well.well .button--dark:hover {
      border-color: #ec2d10; }
    .button:hover.theme--burgundy, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--burgundy,
    .theme--burgundy .button:hover,
    .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--burgundy .commento-button.commento-submit-button:hover,
    .theme .theme--burgundy .button:hover,
    .theme .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--burgundy .commento-button.commento-submit-button:hover, .button:active.theme--burgundy, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--burgundy,
    .theme--burgundy .button:active,
    .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--burgundy .commento-button.commento-submit-button:active,
    .theme .theme--burgundy .button:active,
    .theme .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--burgundy .commento-button.commento-submit-button:active, .button:focus.theme--burgundy, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--burgundy,
    .theme--burgundy .button:focus,
    .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--burgundy .commento-button.commento-submit-button:focus,
    .theme .theme--burgundy .button:focus,
    .theme .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--burgundy .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--burgundy,
    .theme--burgundy
    .well.well .button--dark:hover,
    .theme .theme--burgundy
    .well.well .button--dark:hover {
      border-color: #ba222a; }
    .button:hover.theme--purple, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--purple,
    .theme--purple .button:hover,
    .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--purple .commento-button.commento-submit-button:hover,
    .theme .theme--purple .button:hover,
    .theme .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--purple .commento-button.commento-submit-button:hover, .button:active.theme--purple, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--purple,
    .theme--purple .button:active,
    .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--purple .commento-button.commento-submit-button:active,
    .theme .theme--purple .button:active,
    .theme .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--purple .commento-button.commento-submit-button:active, .button:focus.theme--purple, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--purple,
    .theme--purple .button:focus,
    .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--purple .commento-button.commento-submit-button:focus,
    .theme .theme--purple .button:focus,
    .theme .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--purple .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--purple,
    .theme--purple
    .well.well .button--dark:hover,
    .theme .theme--purple
    .well.well .button--dark:hover {
      border-color: #9b3381; }
    .button:hover.theme--youth, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--youth,
    .theme--youth .button:hover,
    .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--youth .commento-button.commento-submit-button:hover,
    .theme .theme--youth .button:hover,
    .theme .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--youth .commento-button.commento-submit-button:hover, .button:active.theme--youth, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--youth,
    .theme--youth .button:active,
    .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--youth .commento-button.commento-submit-button:active,
    .theme .theme--youth .button:active,
    .theme .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--youth .commento-button.commento-submit-button:active, .button:focus.theme--youth, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--youth,
    .theme--youth .button:focus,
    .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--youth .commento-button.commento-submit-button:focus,
    .theme .theme--youth .button:focus,
    .theme .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--youth .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--youth,
    .theme--youth
    .well.well .button--dark:hover,
    .theme .theme--youth
    .well.well .button--dark:hover {
      border-color: #d57800; }
    .button:hover.theme--digitalisation, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--digitalisation,
    .theme--digitalisation .button:hover,
    .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--digitalisation .commento-button.commento-submit-button:hover,
    .theme .theme--digitalisation .button:hover,
    .theme .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--digitalisation .commento-button.commento-submit-button:hover, .button:active.theme--digitalisation, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--digitalisation,
    .theme--digitalisation .button:active,
    .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--digitalisation .commento-button.commento-submit-button:active,
    .theme .theme--digitalisation .button:active,
    .theme .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--digitalisation .commento-button.commento-submit-button:active, .button:focus.theme--digitalisation, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--digitalisation,
    .theme--digitalisation .button:focus,
    .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--digitalisation .commento-button.commento-submit-button:focus,
    .theme .theme--digitalisation .button:focus,
    .theme .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--digitalisation .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--digitalisation,
    .theme--digitalisation
    .well.well .button--dark:hover,
    .theme .theme--digitalisation
    .well.well .button--dark:hover {
      border-color: #9a3324; }
    .button:hover.theme--climate, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--climate,
    .theme--climate .button:hover,
    .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--climate .commento-button.commento-submit-button:hover,
    .theme .theme--climate .button:hover,
    .theme .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--climate .commento-button.commento-submit-button:hover, .button:active.theme--climate, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--climate,
    .theme--climate .button:active,
    .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--climate .commento-button.commento-submit-button:active,
    .theme .theme--climate .button:active,
    .theme .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--climate .commento-button.commento-submit-button:active, .button:focus.theme--climate, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--climate,
    .theme--climate .button:focus,
    .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--climate .commento-button.commento-submit-button:focus,
    .theme .theme--climate .button:focus,
    .theme .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--climate .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--climate,
    .theme--climate
    .well.well .button--dark:hover,
    .theme .theme--climate
    .well.well .button--dark:hover {
      border-color: #693c5e; }
    .button:hover.theme--gender, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--gender,
    .theme--gender .button:hover,
    .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--gender .commento-button.commento-submit-button:hover,
    .theme .theme--gender .button:hover,
    .theme .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--gender .commento-button.commento-submit-button:hover, .button:active.theme--gender, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--gender,
    .theme--gender .button:active,
    .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--gender .commento-button.commento-submit-button:active,
    .theme .theme--gender .button:active,
    .theme .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--gender .commento-button.commento-submit-button:active, .button:focus.theme--gender, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--gender,
    .theme--gender .button:focus,
    .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--gender .commento-button.commento-submit-button:focus,
    .theme .theme--gender .button:focus,
    .theme .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--gender .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--gender,
    .theme--gender
    .well.well .button--dark:hover,
    .theme .theme--gender
    .well.well .button--dark:hover {
      border-color: #046a38; }
    .button:hover.theme--nutrition, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--nutrition,
    .theme--nutrition .button:hover,
    .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--nutrition .commento-button.commento-submit-button:hover,
    .theme .theme--nutrition .button:hover,
    .theme .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--nutrition .commento-button.commento-submit-button:hover, .button:active.theme--nutrition, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--nutrition,
    .theme--nutrition .button:active,
    .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--nutrition .commento-button.commento-submit-button:active,
    .theme .theme--nutrition .button:active,
    .theme .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--nutrition .commento-button.commento-submit-button:active, .button:focus.theme--nutrition, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--nutrition,
    .theme--nutrition .button:focus,
    .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--nutrition .commento-button.commento-submit-button:focus,
    .theme .theme--nutrition .button:focus,
    .theme .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--nutrition .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--nutrition,
    .theme--nutrition
    .well.well .button--dark:hover,
    .theme .theme--nutrition
    .well.well .button--dark:hover {
      border-color: #487a7b; }
    .button:hover.theme--blog, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--blog,
    .theme--blog .button:hover,
    .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--blog .commento-button.commento-submit-button:hover,
    .theme .theme--blog .button:hover,
    .theme .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--blog .commento-button.commento-submit-button:hover, .button:active.theme--blog, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--blog,
    .theme--blog .button:active,
    .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--blog .commento-button.commento-submit-button:active,
    .theme .theme--blog .button:active,
    .theme .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--blog .commento-button.commento-submit-button:active, .button:focus.theme--blog, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--blog,
    .theme--blog .button:focus,
    .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--blog .commento-button.commento-submit-button:focus,
    .theme .theme--blog .button:focus,
    .theme .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--blog .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--blog,
    .theme--blog
    .well.well .button--dark:hover,
    .theme .theme--blog
    .well.well .button--dark:hover {
      border-color: #ffa300; }
    .button:hover.theme--spore-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-blue,
    .theme--spore-blue .button:hover,
    .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-blue .button:hover,
    .theme .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-blue,
    .theme--spore-blue .button:active,
    .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-blue .button:active,
    .theme .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-blue,
    .theme--spore-blue .button:focus,
    .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-blue .button:focus,
    .theme .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-blue,
    .theme--spore-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-blue
    .well.well .button--dark:hover {
      border-color: #3f68b1; }
    .button:hover.theme--spore-brown, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-brown,
    .theme--spore-brown .button:hover,
    .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-brown .commento-button.commento-submit-button:hover,
    .theme .theme--spore-brown .button:hover,
    .theme .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-brown .commento-button.commento-submit-button:hover, .button:active.theme--spore-brown, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-brown,
    .theme--spore-brown .button:active,
    .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-brown .commento-button.commento-submit-button:active,
    .theme .theme--spore-brown .button:active,
    .theme .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-brown .commento-button.commento-submit-button:active, .button:focus.theme--spore-brown, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-brown,
    .theme--spore-brown .button:focus,
    .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-brown .commento-button.commento-submit-button:focus,
    .theme .theme--spore-brown .button:focus,
    .theme .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-brown .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-brown,
    .theme--spore-brown
    .well.well .button--dark:hover,
    .theme .theme--spore-brown
    .well.well .button--dark:hover {
      border-color: #774b04; }
    .button:hover.theme--spore-dark-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-dark-blue,
    .theme--spore-dark-blue .button:hover,
    .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-dark-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-dark-blue .button:hover,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-dark-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-dark-blue,
    .theme--spore-dark-blue .button:active,
    .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-dark-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-dark-blue .button:active,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-dark-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-dark-blue,
    .theme--spore-dark-blue .button:focus,
    .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-dark-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-dark-blue .button:focus,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-dark-blue,
    .theme--spore-dark-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-dark-blue
    .well.well .button--dark:hover {
      border-color: #044e7e; }
    .button:hover.theme--spore-forest-green, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-forest-green,
    .theme--spore-forest-green .button:hover,
    .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-forest-green .commento-button.commento-submit-button:hover,
    .theme .theme--spore-forest-green .button:hover,
    .theme .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-forest-green .commento-button.commento-submit-button:hover, .button:active.theme--spore-forest-green, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-forest-green,
    .theme--spore-forest-green .button:active,
    .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-forest-green .commento-button.commento-submit-button:active,
    .theme .theme--spore-forest-green .button:active,
    .theme .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-forest-green .commento-button.commento-submit-button:active, .button:focus.theme--spore-forest-green, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-forest-green,
    .theme--spore-forest-green .button:focus,
    .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-forest-green .commento-button.commento-submit-button:focus,
    .theme .theme--spore-forest-green .button:focus,
    .theme .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-forest-green .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-forest-green,
    .theme--spore-forest-green
    .well.well .button--dark:hover,
    .theme .theme--spore-forest-green
    .well.well .button--dark:hover {
      border-color: #5f810a; }
    .button:hover.theme--spore-grey-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-grey-blue,
    .theme--spore-grey-blue .button:hover,
    .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-grey-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-grey-blue .button:hover,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-grey-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-grey-blue,
    .theme--spore-grey-blue .button:active,
    .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-grey-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-grey-blue .button:active,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-grey-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-grey-blue,
    .theme--spore-grey-blue .button:focus,
    .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-grey-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-grey-blue .button:focus,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-grey-blue,
    .theme--spore-grey-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-grey-blue
    .well.well .button--dark:hover {
      border-color: #6d8c9f; }
    .button:hover.theme--spore-light-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-light-blue,
    .theme--spore-light-blue .button:hover,
    .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-light-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-light-blue .button:hover,
    .theme .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-light-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-light-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-light-blue,
    .theme--spore-light-blue .button:active,
    .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-light-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-light-blue .button:active,
    .theme .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-light-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-light-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-light-blue,
    .theme--spore-light-blue .button:focus,
    .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-light-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-light-blue .button:focus,
    .theme .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-light-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-light-blue,
    .theme--spore-light-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-light-blue
    .well.well .button--dark:hover {
      border-color: #79accf; }
    .button:hover.theme--spore-lime, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-lime,
    .theme--spore-lime .button:hover,
    .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-lime .commento-button.commento-submit-button:hover,
    .theme .theme--spore-lime .button:hover,
    .theme .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-lime .commento-button.commento-submit-button:hover, .button:active.theme--spore-lime, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-lime,
    .theme--spore-lime .button:active,
    .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-lime .commento-button.commento-submit-button:active,
    .theme .theme--spore-lime .button:active,
    .theme .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-lime .commento-button.commento-submit-button:active, .button:focus.theme--spore-lime, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-lime,
    .theme--spore-lime .button:focus,
    .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-lime .commento-button.commento-submit-button:focus,
    .theme .theme--spore-lime .button:focus,
    .theme .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-lime .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-lime,
    .theme--spore-lime
    .well.well .button--dark:hover,
    .theme .theme--spore-lime
    .well.well .button--dark:hover {
      border-color: #bbae03; }
    .button:hover.theme--spore-ochre, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-ochre,
    .theme--spore-ochre .button:hover,
    .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-ochre .commento-button.commento-submit-button:hover,
    .theme .theme--spore-ochre .button:hover,
    .theme .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-ochre .commento-button.commento-submit-button:hover, .button:active.theme--spore-ochre, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-ochre,
    .theme--spore-ochre .button:active,
    .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-ochre .commento-button.commento-submit-button:active,
    .theme .theme--spore-ochre .button:active,
    .theme .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-ochre .commento-button.commento-submit-button:active, .button:focus.theme--spore-ochre, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-ochre,
    .theme--spore-ochre .button:focus,
    .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-ochre .commento-button.commento-submit-button:focus,
    .theme .theme--spore-ochre .button:focus,
    .theme .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-ochre .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-ochre,
    .theme--spore-ochre
    .well.well .button--dark:hover,
    .theme .theme--spore-ochre
    .well.well .button--dark:hover {
      border-color: #db9623; }
    .button:hover.theme--spore-olive-green, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-olive-green,
    .theme--spore-olive-green .button:hover,
    .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-olive-green .commento-button.commento-submit-button:hover,
    .theme .theme--spore-olive-green .button:hover,
    .theme .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-olive-green .commento-button.commento-submit-button:hover, .button:active.theme--spore-olive-green, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-olive-green,
    .theme--spore-olive-green .button:active,
    .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-olive-green .commento-button.commento-submit-button:active,
    .theme .theme--spore-olive-green .button:active,
    .theme .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-olive-green .commento-button.commento-submit-button:active, .button:focus.theme--spore-olive-green, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-olive-green,
    .theme--spore-olive-green .button:focus,
    .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-olive-green .commento-button.commento-submit-button:focus,
    .theme .theme--spore-olive-green .button:focus,
    .theme .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-olive-green .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-olive-green,
    .theme--spore-olive-green
    .well.well .button--dark:hover,
    .theme .theme--spore-olive-green
    .well.well .button--dark:hover {
      border-color: #778d3e; }
    .button:hover.theme--spore-red, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-red,
    .theme--spore-red .button:hover,
    .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-red .commento-button.commento-submit-button:hover,
    .theme .theme--spore-red .button:hover,
    .theme .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-red .commento-button.commento-submit-button:hover, .button:active.theme--spore-red, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-red,
    .theme--spore-red .button:active,
    .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-red .commento-button.commento-submit-button:active,
    .theme .theme--spore-red .button:active,
    .theme .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-red .commento-button.commento-submit-button:active, .button:focus.theme--spore-red, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-red,
    .theme--spore-red .button:focus,
    .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-red .commento-button.commento-submit-button:focus,
    .theme .theme--spore-red .button:focus,
    .theme .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-red .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-red,
    .theme--spore-red
    .well.well .button--dark:hover,
    .theme .theme--spore-red
    .well.well .button--dark:hover {
      border-color: #f54c23; }
    .button:hover.theme--spore-taupe, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-taupe,
    .theme--spore-taupe .button:hover,
    .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-taupe .commento-button.commento-submit-button:hover,
    .theme .theme--spore-taupe .button:hover,
    .theme .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-taupe .commento-button.commento-submit-button:hover, .button:active.theme--spore-taupe, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-taupe,
    .theme--spore-taupe .button:active,
    .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-taupe .commento-button.commento-submit-button:active,
    .theme .theme--spore-taupe .button:active,
    .theme .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-taupe .commento-button.commento-submit-button:active, .button:focus.theme--spore-taupe, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-taupe,
    .theme--spore-taupe .button:focus,
    .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-taupe .commento-button.commento-submit-button:focus,
    .theme .theme--spore-taupe .button:focus,
    .theme .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-taupe .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-taupe,
    .theme--spore-taupe
    .well.well .button--dark:hover,
    .theme .theme--spore-taupe
    .well.well .button--dark:hover {
      border-color: #7b6d65; }
    .button:hover.theme--spore-teal, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-teal,
    .theme--spore-teal .button:hover,
    .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-teal .commento-button.commento-submit-button:hover,
    .theme .theme--spore-teal .button:hover,
    .theme .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-teal .commento-button.commento-submit-button:hover, .button:active.theme--spore-teal, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-teal,
    .theme--spore-teal .button:active,
    .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-teal .commento-button.commento-submit-button:active,
    .theme .theme--spore-teal .button:active,
    .theme .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-teal .commento-button.commento-submit-button:active, .button:focus.theme--spore-teal, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-teal,
    .theme--spore-teal .button:focus,
    .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-teal .commento-button.commento-submit-button:focus,
    .theme .theme--spore-teal .button:focus,
    .theme .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-teal .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-teal,
    .theme--spore-teal
    .well.well .button--dark:hover,
    .theme .theme--spore-teal
    .well.well .button--dark:hover {
      border-color: #077fc1; }
    .button:hover.theme--dark, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--dark,
    .theme--dark .button:hover,
    .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--dark .commento-button.commento-submit-button:hover,
    .theme .theme--dark .button:hover,
    .theme .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--dark .commento-button.commento-submit-button:hover, .button:active.theme--dark, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--dark,
    .theme--dark .button:active,
    .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--dark .commento-button.commento-submit-button:active,
    .theme .theme--dark .button:active,
    .theme .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--dark .commento-button.commento-submit-button:active, .button:focus.theme--dark, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--dark,
    .theme--dark .button:focus,
    .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--dark .commento-button.commento-submit-button:focus,
    .theme .theme--dark .button:focus,
    .theme .theme--dark [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--dark .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--dark,
    .theme--dark
    .well.well .button--dark:hover,
    .theme .theme--dark
    .well.well .button--dark:hover {
      background-color: #3d3d3d; }
    .button:hover.theme--green, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--green,
    .theme--green .button:hover,
    .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--green .commento-button.commento-submit-button:hover,
    .theme .theme--green .button:hover,
    .theme .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--green .commento-button.commento-submit-button:hover, .button:active.theme--green, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--green,
    .theme--green .button:active,
    .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--green .commento-button.commento-submit-button:active,
    .theme .theme--green .button:active,
    .theme .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--green .commento-button.commento-submit-button:active, .button:focus.theme--green, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--green,
    .theme--green .button:focus,
    .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--green .commento-button.commento-submit-button:focus,
    .theme .theme--green .button:focus,
    .theme .theme--green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--green .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--green,
    .theme--green
    .well.well .button--dark:hover,
    .theme .theme--green
    .well.well .button--dark:hover {
      background-color: #67ab43; }
    .button:hover.theme--blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--blue,
    .theme--blue .button:hover,
    .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--blue .commento-button.commento-submit-button:hover,
    .theme .theme--blue .button:hover,
    .theme .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--blue .commento-button.commento-submit-button:hover, .button:active.theme--blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--blue,
    .theme--blue .button:active,
    .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--blue .commento-button.commento-submit-button:active,
    .theme .theme--blue .button:active,
    .theme .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--blue .commento-button.commento-submit-button:active, .button:focus.theme--blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--blue,
    .theme--blue .button:focus,
    .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--blue .commento-button.commento-submit-button:focus,
    .theme .theme--blue .button:focus,
    .theme .theme--blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--blue,
    .theme--blue
    .well.well .button--dark:hover,
    .theme .theme--blue
    .well.well .button--dark:hover {
      background-color: #56c0dd; }
    .button:hover.theme--lime, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--lime,
    .theme--lime .button:hover,
    .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--lime .commento-button.commento-submit-button:hover,
    .theme .theme--lime .button:hover,
    .theme .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--lime .commento-button.commento-submit-button:hover, .button:active.theme--lime, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--lime,
    .theme--lime .button:active,
    .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--lime .commento-button.commento-submit-button:active,
    .theme .theme--lime .button:active,
    .theme .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--lime .commento-button.commento-submit-button:active, .button:focus.theme--lime, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--lime,
    .theme--lime .button:focus,
    .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--lime .commento-button.commento-submit-button:focus,
    .theme .theme--lime .button:focus,
    .theme .theme--lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--lime .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--lime,
    .theme--lime
    .well.well .button--dark:hover,
    .theme .theme--lime
    .well.well .button--dark:hover {
      background-color: #c1d435; }
    .button:hover.theme--yellow, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--yellow,
    .theme--yellow .button:hover,
    .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--yellow .commento-button.commento-submit-button:hover,
    .theme .theme--yellow .button:hover,
    .theme .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--yellow .commento-button.commento-submit-button:hover, .button:active.theme--yellow, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--yellow,
    .theme--yellow .button:active,
    .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--yellow .commento-button.commento-submit-button:active,
    .theme .theme--yellow .button:active,
    .theme .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--yellow .commento-button.commento-submit-button:active, .button:focus.theme--yellow, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--yellow,
    .theme--yellow .button:focus,
    .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--yellow .commento-button.commento-submit-button:focus,
    .theme .theme--yellow .button:focus,
    .theme .theme--yellow [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--yellow .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--yellow,
    .theme--yellow
    .well.well .button--dark:hover,
    .theme .theme--yellow
    .well.well .button--dark:hover {
      background-color: #facf21; }
    .button:hover.theme--gold, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--gold,
    .theme--gold .button:hover,
    .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--gold .commento-button.commento-submit-button:hover,
    .theme .theme--gold .button:hover,
    .theme .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--gold .commento-button.commento-submit-button:hover, .button:active.theme--gold, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--gold,
    .theme--gold .button:active,
    .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--gold .commento-button.commento-submit-button:active,
    .theme .theme--gold .button:active,
    .theme .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--gold .commento-button.commento-submit-button:active, .button:focus.theme--gold, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--gold,
    .theme--gold .button:focus,
    .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--gold .commento-button.commento-submit-button:focus,
    .theme .theme--gold .button:focus,
    .theme .theme--gold [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--gold .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--gold,
    .theme--gold
    .well.well .button--dark:hover,
    .theme .theme--gold
    .well.well .button--dark:hover {
      background-color: #eb942c; }
    .button:hover.theme--orange, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--orange,
    .theme--orange .button:hover,
    .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--orange .commento-button.commento-submit-button:hover,
    .theme .theme--orange .button:hover,
    .theme .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--orange .commento-button.commento-submit-button:hover, .button:active.theme--orange, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--orange,
    .theme--orange .button:active,
    .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--orange .commento-button.commento-submit-button:active,
    .theme .theme--orange .button:active,
    .theme .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--orange .commento-button.commento-submit-button:active, .button:focus.theme--orange, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--orange,
    .theme--orange .button:focus,
    .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--orange .commento-button.commento-submit-button:focus,
    .theme .theme--orange .button:focus,
    .theme .theme--orange [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--orange .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--orange,
    .theme--orange
    .well.well .button--dark:hover,
    .theme .theme--orange
    .well.well .button--dark:hover {
      background-color: #e26435; }
    .button:hover.theme--salmon, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--salmon,
    .theme--salmon .button:hover,
    .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--salmon .commento-button.commento-submit-button:hover,
    .theme .theme--salmon .button:hover,
    .theme .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--salmon .commento-button.commento-submit-button:hover, .button:active.theme--salmon, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--salmon,
    .theme--salmon .button:active,
    .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--salmon .commento-button.commento-submit-button:active,
    .theme .theme--salmon .button:active,
    .theme .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--salmon .commento-button.commento-submit-button:active, .button:focus.theme--salmon, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--salmon,
    .theme--salmon .button:focus,
    .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--salmon .commento-button.commento-submit-button:focus,
    .theme .theme--salmon .button:focus,
    .theme .theme--salmon [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--salmon .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--salmon,
    .theme--salmon
    .well.well .button--dark:hover,
    .theme .theme--salmon
    .well.well .button--dark:hover {
      background-color: #eb735d; }
    .button:hover.theme--red, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--red,
    .theme--red .button:hover,
    .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--red .commento-button.commento-submit-button:hover,
    .theme .theme--red .button:hover,
    .theme .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--red .commento-button.commento-submit-button:hover, .button:active.theme--red, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--red,
    .theme--red .button:active,
    .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--red .commento-button.commento-submit-button:active,
    .theme .theme--red .button:active,
    .theme .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--red .commento-button.commento-submit-button:active, .button:focus.theme--red, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--red,
    .theme--red .button:focus,
    .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--red .commento-button.commento-submit-button:focus,
    .theme .theme--red .button:focus,
    .theme .theme--red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--red .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--red,
    .theme--red
    .well.well .button--dark:hover,
    .theme .theme--red
    .well.well .button--dark:hover {
      background-color: #ec2d10; }
    .button:hover.theme--burgundy, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--burgundy,
    .theme--burgundy .button:hover,
    .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--burgundy .commento-button.commento-submit-button:hover,
    .theme .theme--burgundy .button:hover,
    .theme .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--burgundy .commento-button.commento-submit-button:hover, .button:active.theme--burgundy, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--burgundy,
    .theme--burgundy .button:active,
    .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--burgundy .commento-button.commento-submit-button:active,
    .theme .theme--burgundy .button:active,
    .theme .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--burgundy .commento-button.commento-submit-button:active, .button:focus.theme--burgundy, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--burgundy,
    .theme--burgundy .button:focus,
    .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--burgundy .commento-button.commento-submit-button:focus,
    .theme .theme--burgundy .button:focus,
    .theme .theme--burgundy [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--burgundy .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--burgundy,
    .theme--burgundy
    .well.well .button--dark:hover,
    .theme .theme--burgundy
    .well.well .button--dark:hover {
      background-color: #ba222a; }
    .button:hover.theme--purple, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--purple,
    .theme--purple .button:hover,
    .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--purple .commento-button.commento-submit-button:hover,
    .theme .theme--purple .button:hover,
    .theme .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--purple .commento-button.commento-submit-button:hover, .button:active.theme--purple, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--purple,
    .theme--purple .button:active,
    .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--purple .commento-button.commento-submit-button:active,
    .theme .theme--purple .button:active,
    .theme .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--purple .commento-button.commento-submit-button:active, .button:focus.theme--purple, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--purple,
    .theme--purple .button:focus,
    .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--purple .commento-button.commento-submit-button:focus,
    .theme .theme--purple .button:focus,
    .theme .theme--purple [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--purple .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--purple,
    .theme--purple
    .well.well .button--dark:hover,
    .theme .theme--purple
    .well.well .button--dark:hover {
      background-color: #9b3381; }
    .button:hover.theme--youth, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--youth,
    .theme--youth .button:hover,
    .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--youth .commento-button.commento-submit-button:hover,
    .theme .theme--youth .button:hover,
    .theme .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--youth .commento-button.commento-submit-button:hover, .button:active.theme--youth, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--youth,
    .theme--youth .button:active,
    .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--youth .commento-button.commento-submit-button:active,
    .theme .theme--youth .button:active,
    .theme .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--youth .commento-button.commento-submit-button:active, .button:focus.theme--youth, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--youth,
    .theme--youth .button:focus,
    .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--youth .commento-button.commento-submit-button:focus,
    .theme .theme--youth .button:focus,
    .theme .theme--youth [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--youth .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--youth,
    .theme--youth
    .well.well .button--dark:hover,
    .theme .theme--youth
    .well.well .button--dark:hover {
      background-color: #d57800; }
    .button:hover.theme--digitalisation, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--digitalisation,
    .theme--digitalisation .button:hover,
    .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--digitalisation .commento-button.commento-submit-button:hover,
    .theme .theme--digitalisation .button:hover,
    .theme .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--digitalisation .commento-button.commento-submit-button:hover, .button:active.theme--digitalisation, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--digitalisation,
    .theme--digitalisation .button:active,
    .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--digitalisation .commento-button.commento-submit-button:active,
    .theme .theme--digitalisation .button:active,
    .theme .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--digitalisation .commento-button.commento-submit-button:active, .button:focus.theme--digitalisation, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--digitalisation,
    .theme--digitalisation .button:focus,
    .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--digitalisation .commento-button.commento-submit-button:focus,
    .theme .theme--digitalisation .button:focus,
    .theme .theme--digitalisation [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--digitalisation .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--digitalisation,
    .theme--digitalisation
    .well.well .button--dark:hover,
    .theme .theme--digitalisation
    .well.well .button--dark:hover {
      background-color: #9a3324; }
    .button:hover.theme--climate, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--climate,
    .theme--climate .button:hover,
    .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--climate .commento-button.commento-submit-button:hover,
    .theme .theme--climate .button:hover,
    .theme .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--climate .commento-button.commento-submit-button:hover, .button:active.theme--climate, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--climate,
    .theme--climate .button:active,
    .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--climate .commento-button.commento-submit-button:active,
    .theme .theme--climate .button:active,
    .theme .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--climate .commento-button.commento-submit-button:active, .button:focus.theme--climate, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--climate,
    .theme--climate .button:focus,
    .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--climate .commento-button.commento-submit-button:focus,
    .theme .theme--climate .button:focus,
    .theme .theme--climate [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--climate .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--climate,
    .theme--climate
    .well.well .button--dark:hover,
    .theme .theme--climate
    .well.well .button--dark:hover {
      background-color: #693c5e; }
    .button:hover.theme--gender, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--gender,
    .theme--gender .button:hover,
    .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--gender .commento-button.commento-submit-button:hover,
    .theme .theme--gender .button:hover,
    .theme .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--gender .commento-button.commento-submit-button:hover, .button:active.theme--gender, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--gender,
    .theme--gender .button:active,
    .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--gender .commento-button.commento-submit-button:active,
    .theme .theme--gender .button:active,
    .theme .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--gender .commento-button.commento-submit-button:active, .button:focus.theme--gender, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--gender,
    .theme--gender .button:focus,
    .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--gender .commento-button.commento-submit-button:focus,
    .theme .theme--gender .button:focus,
    .theme .theme--gender [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--gender .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--gender,
    .theme--gender
    .well.well .button--dark:hover,
    .theme .theme--gender
    .well.well .button--dark:hover {
      background-color: #046a38; }
    .button:hover.theme--nutrition, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--nutrition,
    .theme--nutrition .button:hover,
    .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--nutrition .commento-button.commento-submit-button:hover,
    .theme .theme--nutrition .button:hover,
    .theme .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--nutrition .commento-button.commento-submit-button:hover, .button:active.theme--nutrition, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--nutrition,
    .theme--nutrition .button:active,
    .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--nutrition .commento-button.commento-submit-button:active,
    .theme .theme--nutrition .button:active,
    .theme .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--nutrition .commento-button.commento-submit-button:active, .button:focus.theme--nutrition, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--nutrition,
    .theme--nutrition .button:focus,
    .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--nutrition .commento-button.commento-submit-button:focus,
    .theme .theme--nutrition .button:focus,
    .theme .theme--nutrition [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--nutrition .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--nutrition,
    .theme--nutrition
    .well.well .button--dark:hover,
    .theme .theme--nutrition
    .well.well .button--dark:hover {
      background-color: #487a7b; }
    .button:hover.theme--blog, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--blog,
    .theme--blog .button:hover,
    .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--blog .commento-button.commento-submit-button:hover,
    .theme .theme--blog .button:hover,
    .theme .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--blog .commento-button.commento-submit-button:hover, .button:active.theme--blog, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--blog,
    .theme--blog .button:active,
    .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--blog .commento-button.commento-submit-button:active,
    .theme .theme--blog .button:active,
    .theme .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--blog .commento-button.commento-submit-button:active, .button:focus.theme--blog, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--blog,
    .theme--blog .button:focus,
    .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--blog .commento-button.commento-submit-button:focus,
    .theme .theme--blog .button:focus,
    .theme .theme--blog [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--blog .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--blog,
    .theme--blog
    .well.well .button--dark:hover,
    .theme .theme--blog
    .well.well .button--dark:hover {
      background-color: #FFA300; }
    .button:hover.theme--spore-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-blue,
    .theme--spore-blue .button:hover,
    .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-blue .button:hover,
    .theme .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-blue,
    .theme--spore-blue .button:active,
    .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-blue .button:active,
    .theme .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-blue,
    .theme--spore-blue .button:focus,
    .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-blue .button:focus,
    .theme .theme--spore-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-blue,
    .theme--spore-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-blue
    .well.well .button--dark:hover {
      background-color: #3f68b1; }
    .button:hover.theme--spore-brown, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-brown,
    .theme--spore-brown .button:hover,
    .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-brown .commento-button.commento-submit-button:hover,
    .theme .theme--spore-brown .button:hover,
    .theme .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-brown .commento-button.commento-submit-button:hover, .button:active.theme--spore-brown, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-brown,
    .theme--spore-brown .button:active,
    .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-brown .commento-button.commento-submit-button:active,
    .theme .theme--spore-brown .button:active,
    .theme .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-brown .commento-button.commento-submit-button:active, .button:focus.theme--spore-brown, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-brown,
    .theme--spore-brown .button:focus,
    .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-brown .commento-button.commento-submit-button:focus,
    .theme .theme--spore-brown .button:focus,
    .theme .theme--spore-brown [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-brown .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-brown,
    .theme--spore-brown
    .well.well .button--dark:hover,
    .theme .theme--spore-brown
    .well.well .button--dark:hover {
      background-color: #774b04; }
    .button:hover.theme--spore-dark-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-dark-blue,
    .theme--spore-dark-blue .button:hover,
    .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-dark-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-dark-blue .button:hover,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-dark-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-dark-blue,
    .theme--spore-dark-blue .button:active,
    .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-dark-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-dark-blue .button:active,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-dark-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-dark-blue,
    .theme--spore-dark-blue .button:focus,
    .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-dark-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-dark-blue .button:focus,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-dark-blue,
    .theme--spore-dark-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-dark-blue
    .well.well .button--dark:hover {
      background-color: #044e7e; }
    .button:hover.theme--spore-forest-green, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-forest-green,
    .theme--spore-forest-green .button:hover,
    .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-forest-green .commento-button.commento-submit-button:hover,
    .theme .theme--spore-forest-green .button:hover,
    .theme .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-forest-green .commento-button.commento-submit-button:hover, .button:active.theme--spore-forest-green, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-forest-green,
    .theme--spore-forest-green .button:active,
    .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-forest-green .commento-button.commento-submit-button:active,
    .theme .theme--spore-forest-green .button:active,
    .theme .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-forest-green .commento-button.commento-submit-button:active, .button:focus.theme--spore-forest-green, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-forest-green,
    .theme--spore-forest-green .button:focus,
    .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-forest-green .commento-button.commento-submit-button:focus,
    .theme .theme--spore-forest-green .button:focus,
    .theme .theme--spore-forest-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-forest-green .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-forest-green,
    .theme--spore-forest-green
    .well.well .button--dark:hover,
    .theme .theme--spore-forest-green
    .well.well .button--dark:hover {
      background-color: #5f810a; }
    .button:hover.theme--spore-grey-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-grey-blue,
    .theme--spore-grey-blue .button:hover,
    .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-grey-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-grey-blue .button:hover,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-grey-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-grey-blue,
    .theme--spore-grey-blue .button:active,
    .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-grey-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-grey-blue .button:active,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-grey-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-grey-blue,
    .theme--spore-grey-blue .button:focus,
    .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-grey-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-grey-blue .button:focus,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-grey-blue,
    .theme--spore-grey-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-grey-blue
    .well.well .button--dark:hover {
      background-color: #6d8c9f; }
    .button:hover.theme--spore-light-blue, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-light-blue,
    .theme--spore-light-blue .button:hover,
    .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-light-blue .commento-button.commento-submit-button:hover,
    .theme .theme--spore-light-blue .button:hover,
    .theme .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-light-blue .commento-button.commento-submit-button:hover, .button:active.theme--spore-light-blue, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-light-blue,
    .theme--spore-light-blue .button:active,
    .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-light-blue .commento-button.commento-submit-button:active,
    .theme .theme--spore-light-blue .button:active,
    .theme .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-light-blue .commento-button.commento-submit-button:active, .button:focus.theme--spore-light-blue, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-light-blue,
    .theme--spore-light-blue .button:focus,
    .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-light-blue .commento-button.commento-submit-button:focus,
    .theme .theme--spore-light-blue .button:focus,
    .theme .theme--spore-light-blue [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-light-blue .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-light-blue,
    .theme--spore-light-blue
    .well.well .button--dark:hover,
    .theme .theme--spore-light-blue
    .well.well .button--dark:hover {
      background-color: #79accf; }
    .button:hover.theme--spore-lime, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-lime,
    .theme--spore-lime .button:hover,
    .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-lime .commento-button.commento-submit-button:hover,
    .theme .theme--spore-lime .button:hover,
    .theme .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-lime .commento-button.commento-submit-button:hover, .button:active.theme--spore-lime, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-lime,
    .theme--spore-lime .button:active,
    .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-lime .commento-button.commento-submit-button:active,
    .theme .theme--spore-lime .button:active,
    .theme .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-lime .commento-button.commento-submit-button:active, .button:focus.theme--spore-lime, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-lime,
    .theme--spore-lime .button:focus,
    .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-lime .commento-button.commento-submit-button:focus,
    .theme .theme--spore-lime .button:focus,
    .theme .theme--spore-lime [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-lime .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-lime,
    .theme--spore-lime
    .well.well .button--dark:hover,
    .theme .theme--spore-lime
    .well.well .button--dark:hover {
      background-color: #bbae03; }
    .button:hover.theme--spore-ochre, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-ochre,
    .theme--spore-ochre .button:hover,
    .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-ochre .commento-button.commento-submit-button:hover,
    .theme .theme--spore-ochre .button:hover,
    .theme .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-ochre .commento-button.commento-submit-button:hover, .button:active.theme--spore-ochre, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-ochre,
    .theme--spore-ochre .button:active,
    .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-ochre .commento-button.commento-submit-button:active,
    .theme .theme--spore-ochre .button:active,
    .theme .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-ochre .commento-button.commento-submit-button:active, .button:focus.theme--spore-ochre, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-ochre,
    .theme--spore-ochre .button:focus,
    .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-ochre .commento-button.commento-submit-button:focus,
    .theme .theme--spore-ochre .button:focus,
    .theme .theme--spore-ochre [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-ochre .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-ochre,
    .theme--spore-ochre
    .well.well .button--dark:hover,
    .theme .theme--spore-ochre
    .well.well .button--dark:hover {
      background-color: #db9623; }
    .button:hover.theme--spore-olive-green, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-olive-green,
    .theme--spore-olive-green .button:hover,
    .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-olive-green .commento-button.commento-submit-button:hover,
    .theme .theme--spore-olive-green .button:hover,
    .theme .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-olive-green .commento-button.commento-submit-button:hover, .button:active.theme--spore-olive-green, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-olive-green,
    .theme--spore-olive-green .button:active,
    .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-olive-green .commento-button.commento-submit-button:active,
    .theme .theme--spore-olive-green .button:active,
    .theme .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-olive-green .commento-button.commento-submit-button:active, .button:focus.theme--spore-olive-green, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-olive-green,
    .theme--spore-olive-green .button:focus,
    .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-olive-green .commento-button.commento-submit-button:focus,
    .theme .theme--spore-olive-green .button:focus,
    .theme .theme--spore-olive-green [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-olive-green .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-olive-green,
    .theme--spore-olive-green
    .well.well .button--dark:hover,
    .theme .theme--spore-olive-green
    .well.well .button--dark:hover {
      background-color: #778d3e; }
    .button:hover.theme--spore-red, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-red,
    .theme--spore-red .button:hover,
    .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-red .commento-button.commento-submit-button:hover,
    .theme .theme--spore-red .button:hover,
    .theme .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-red .commento-button.commento-submit-button:hover, .button:active.theme--spore-red, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-red,
    .theme--spore-red .button:active,
    .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-red .commento-button.commento-submit-button:active,
    .theme .theme--spore-red .button:active,
    .theme .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-red .commento-button.commento-submit-button:active, .button:focus.theme--spore-red, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-red,
    .theme--spore-red .button:focus,
    .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-red .commento-button.commento-submit-button:focus,
    .theme .theme--spore-red .button:focus,
    .theme .theme--spore-red [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-red .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-red,
    .theme--spore-red
    .well.well .button--dark:hover,
    .theme .theme--spore-red
    .well.well .button--dark:hover {
      background-color: #f54c23; }
    .button:hover.theme--spore-taupe, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-taupe,
    .theme--spore-taupe .button:hover,
    .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-taupe .commento-button.commento-submit-button:hover,
    .theme .theme--spore-taupe .button:hover,
    .theme .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-taupe .commento-button.commento-submit-button:hover, .button:active.theme--spore-taupe, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-taupe,
    .theme--spore-taupe .button:active,
    .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-taupe .commento-button.commento-submit-button:active,
    .theme .theme--spore-taupe .button:active,
    .theme .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-taupe .commento-button.commento-submit-button:active, .button:focus.theme--spore-taupe, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-taupe,
    .theme--spore-taupe .button:focus,
    .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-taupe .commento-button.commento-submit-button:focus,
    .theme .theme--spore-taupe .button:focus,
    .theme .theme--spore-taupe [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-taupe .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-taupe,
    .theme--spore-taupe
    .well.well .button--dark:hover,
    .theme .theme--spore-taupe
    .well.well .button--dark:hover {
      background-color: #7b6d65; }
    .button:hover.theme--spore-teal, [data-vendor="commento"] .commento-button.commento-submit-button:hover.theme--spore-teal,
    .theme--spore-teal .button:hover,
    .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme--spore-teal .commento-button.commento-submit-button:hover,
    .theme .theme--spore-teal .button:hover,
    .theme .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:hover,
    [data-vendor="commento"] .theme .theme--spore-teal .commento-button.commento-submit-button:hover, .button:active.theme--spore-teal, [data-vendor="commento"] .commento-button.commento-submit-button:active.theme--spore-teal,
    .theme--spore-teal .button:active,
    .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme--spore-teal .commento-button.commento-submit-button:active,
    .theme .theme--spore-teal .button:active,
    .theme .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:active,
    [data-vendor="commento"] .theme .theme--spore-teal .commento-button.commento-submit-button:active, .button:focus.theme--spore-teal, [data-vendor="commento"] .commento-button.commento-submit-button:focus.theme--spore-teal,
    .theme--spore-teal .button:focus,
    .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme--spore-teal .commento-button.commento-submit-button:focus,
    .theme .theme--spore-teal .button:focus,
    .theme .theme--spore-teal [data-vendor="commento"] .commento-button.commento-submit-button:focus,
    [data-vendor="commento"] .theme .theme--spore-teal .commento-button.commento-submit-button:focus,
    .well.well .button--dark:hover.theme--spore-teal,
    .theme--spore-teal
    .well.well .button--dark:hover,
    .theme .theme--spore-teal
    .well.well .button--dark:hover {
      background-color: #077fc1; }
  .button--wide {
    padding: 9px 45px; }
  .button--stretch {
    width: 100%;
    text-align: center; }
  .button--shy {
    border: 0; }
    .button--shy:hover {
      color: #fff; }
    .button--shy:visited {
      color: #67ab43; }
      .theme--blue .button--shy:visited {
        color: #56c0dd; }
      .theme--lime .button--shy:visited {
        color: #c1d435; }
      .theme--yellow .button--shy:visited {
        color: #facf21; }
      .theme--gold .button--shy:visited {
        color: #eb942c; }
      .theme--orange .button--shy:visited {
        color: #e26435; }
      .theme--salmon .button--shy:visited {
        color: #eb735d; }
      .theme--red .button--shy:visited {
        color: #ec2d10; }
      .theme--burgundy .button--shy:visited {
        color: #ba222a; }
      .theme--purple .button--shy:visited {
        color: #9b3381; }
  .teaser .button, .teaser [data-vendor="commento"] .commento-button.commento-submit-button, [data-vendor="commento"] .teaser .commento-button.commento-submit-button,
  .well .button,
  .well [data-vendor="commento"] .commento-button.commento-submit-button,
  [data-vendor="commento"] .well .commento-button.commento-submit-button, .button--inverse, .button--dark {
    background: transparent; }
  .teaser .button, .teaser [data-vendor="commento"] .commento-button.commento-submit-button, [data-vendor="commento"] .teaser .commento-button.commento-submit-button,
  .well--full .button,
  .well--full [data-vendor="commento"] .commento-button.commento-submit-button,
  [data-vendor="commento"] .well--full .commento-button.commento-submit-button, .button--inverse {
    border-color: #fff !important;
    background: transparent !important; }
    .teaser .button, .teaser [data-vendor="commento"] .commento-button.commento-submit-button, [data-vendor="commento"] .teaser .commento-button.commento-submit-button, .teaser .button:visited, .teaser [data-vendor="commento"] .commento-button.commento-submit-button:visited, [data-vendor="commento"] .teaser .commento-button.commento-submit-button:visited,
    .well--full .button,
    .well--full [data-vendor="commento"] .commento-button.commento-submit-button,
    [data-vendor="commento"] .well--full .commento-button.commento-submit-button,
    .well--full .button:visited,
    .well--full [data-vendor="commento"] .commento-button.commento-submit-button:visited,
    [data-vendor="commento"] .well--full .commento-button.commento-submit-button:visited, .button--inverse, .button--inverse:visited {
      color: #fff !important; }
  .button.is-disabled, [data-vendor="commento"] .is-disabled.commento-button.commento-submit-button {
    color: #cdcdcd;
    border-color: #cdcdcd; }
    .button.is-disabled:hover, [data-vendor="commento"] .is-disabled.commento-button.commento-submit-button:hover, .button.is-disabled:active, [data-vendor="commento"] .is-disabled.commento-button.commento-submit-button:active {
      cursor: not-allowed;
      background: transparent; }
  .button.is-current, [data-vendor="commento"] .is-current.commento-button.commento-submit-button {
    color: #fff;
    border-color: #67ab43;
    background-color: #67ab43; }
    .button.is-current.theme--dark, [data-vendor="commento"] .is-current.theme--dark.commento-button.commento-submit-button,
    .theme--dark .button.is-current,
    .theme--dark [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--dark .is-current.commento-button.commento-submit-button,
    .theme .theme--dark .button.is-current,
    .theme .theme--dark [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--dark .is-current.commento-button.commento-submit-button {
      border-color: #3d3d3d; }
    .button.is-current.theme--green, [data-vendor="commento"] .is-current.theme--green.commento-button.commento-submit-button,
    .theme--green .button.is-current,
    .theme--green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--green .is-current.commento-button.commento-submit-button,
    .theme .theme--green .button.is-current,
    .theme .theme--green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--green .is-current.commento-button.commento-submit-button {
      border-color: #67ab43; }
    .button.is-current.theme--blue, [data-vendor="commento"] .is-current.theme--blue.commento-button.commento-submit-button,
    .theme--blue .button.is-current,
    .theme--blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--blue .is-current.commento-button.commento-submit-button,
    .theme .theme--blue .button.is-current,
    .theme .theme--blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--blue .is-current.commento-button.commento-submit-button {
      border-color: #56c0dd; }
    .button.is-current.theme--lime, [data-vendor="commento"] .is-current.theme--lime.commento-button.commento-submit-button,
    .theme--lime .button.is-current,
    .theme--lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--lime .is-current.commento-button.commento-submit-button,
    .theme .theme--lime .button.is-current,
    .theme .theme--lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--lime .is-current.commento-button.commento-submit-button {
      border-color: #c1d435; }
    .button.is-current.theme--yellow, [data-vendor="commento"] .is-current.theme--yellow.commento-button.commento-submit-button,
    .theme--yellow .button.is-current,
    .theme--yellow [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--yellow .is-current.commento-button.commento-submit-button,
    .theme .theme--yellow .button.is-current,
    .theme .theme--yellow [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--yellow .is-current.commento-button.commento-submit-button {
      border-color: #facf21; }
    .button.is-current.theme--gold, [data-vendor="commento"] .is-current.theme--gold.commento-button.commento-submit-button,
    .theme--gold .button.is-current,
    .theme--gold [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--gold .is-current.commento-button.commento-submit-button,
    .theme .theme--gold .button.is-current,
    .theme .theme--gold [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--gold .is-current.commento-button.commento-submit-button {
      border-color: #eb942c; }
    .button.is-current.theme--orange, [data-vendor="commento"] .is-current.theme--orange.commento-button.commento-submit-button,
    .theme--orange .button.is-current,
    .theme--orange [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--orange .is-current.commento-button.commento-submit-button,
    .theme .theme--orange .button.is-current,
    .theme .theme--orange [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--orange .is-current.commento-button.commento-submit-button {
      border-color: #e26435; }
    .button.is-current.theme--salmon, [data-vendor="commento"] .is-current.theme--salmon.commento-button.commento-submit-button,
    .theme--salmon .button.is-current,
    .theme--salmon [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--salmon .is-current.commento-button.commento-submit-button,
    .theme .theme--salmon .button.is-current,
    .theme .theme--salmon [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--salmon .is-current.commento-button.commento-submit-button {
      border-color: #eb735d; }
    .button.is-current.theme--red, [data-vendor="commento"] .is-current.theme--red.commento-button.commento-submit-button,
    .theme--red .button.is-current,
    .theme--red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--red .is-current.commento-button.commento-submit-button,
    .theme .theme--red .button.is-current,
    .theme .theme--red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--red .is-current.commento-button.commento-submit-button {
      border-color: #ec2d10; }
    .button.is-current.theme--burgundy, [data-vendor="commento"] .is-current.theme--burgundy.commento-button.commento-submit-button,
    .theme--burgundy .button.is-current,
    .theme--burgundy [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--burgundy .is-current.commento-button.commento-submit-button,
    .theme .theme--burgundy .button.is-current,
    .theme .theme--burgundy [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--burgundy .is-current.commento-button.commento-submit-button {
      border-color: #ba222a; }
    .button.is-current.theme--purple, [data-vendor="commento"] .is-current.theme--purple.commento-button.commento-submit-button,
    .theme--purple .button.is-current,
    .theme--purple [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--purple .is-current.commento-button.commento-submit-button,
    .theme .theme--purple .button.is-current,
    .theme .theme--purple [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--purple .is-current.commento-button.commento-submit-button {
      border-color: #9b3381; }
    .button.is-current.theme--youth, [data-vendor="commento"] .is-current.theme--youth.commento-button.commento-submit-button,
    .theme--youth .button.is-current,
    .theme--youth [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--youth .is-current.commento-button.commento-submit-button,
    .theme .theme--youth .button.is-current,
    .theme .theme--youth [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--youth .is-current.commento-button.commento-submit-button {
      border-color: #d57800; }
    .button.is-current.theme--digitalisation, [data-vendor="commento"] .is-current.theme--digitalisation.commento-button.commento-submit-button,
    .theme--digitalisation .button.is-current,
    .theme--digitalisation [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--digitalisation .is-current.commento-button.commento-submit-button,
    .theme .theme--digitalisation .button.is-current,
    .theme .theme--digitalisation [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--digitalisation .is-current.commento-button.commento-submit-button {
      border-color: #9a3324; }
    .button.is-current.theme--climate, [data-vendor="commento"] .is-current.theme--climate.commento-button.commento-submit-button,
    .theme--climate .button.is-current,
    .theme--climate [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--climate .is-current.commento-button.commento-submit-button,
    .theme .theme--climate .button.is-current,
    .theme .theme--climate [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--climate .is-current.commento-button.commento-submit-button {
      border-color: #693c5e; }
    .button.is-current.theme--gender, [data-vendor="commento"] .is-current.theme--gender.commento-button.commento-submit-button,
    .theme--gender .button.is-current,
    .theme--gender [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--gender .is-current.commento-button.commento-submit-button,
    .theme .theme--gender .button.is-current,
    .theme .theme--gender [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--gender .is-current.commento-button.commento-submit-button {
      border-color: #046a38; }
    .button.is-current.theme--nutrition, [data-vendor="commento"] .is-current.theme--nutrition.commento-button.commento-submit-button,
    .theme--nutrition .button.is-current,
    .theme--nutrition [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--nutrition .is-current.commento-button.commento-submit-button,
    .theme .theme--nutrition .button.is-current,
    .theme .theme--nutrition [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--nutrition .is-current.commento-button.commento-submit-button {
      border-color: #487a7b; }
    .button.is-current.theme--blog, [data-vendor="commento"] .is-current.theme--blog.commento-button.commento-submit-button,
    .theme--blog .button.is-current,
    .theme--blog [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--blog .is-current.commento-button.commento-submit-button,
    .theme .theme--blog .button.is-current,
    .theme .theme--blog [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--blog .is-current.commento-button.commento-submit-button {
      border-color: #ffa300; }
    .button.is-current.theme--spore-blue, [data-vendor="commento"] .is-current.theme--spore-blue.commento-button.commento-submit-button,
    .theme--spore-blue .button.is-current,
    .theme--spore-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-blue .button.is-current,
    .theme .theme--spore-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-blue .is-current.commento-button.commento-submit-button {
      border-color: #3f68b1; }
    .button.is-current.theme--spore-brown, [data-vendor="commento"] .is-current.theme--spore-brown.commento-button.commento-submit-button,
    .theme--spore-brown .button.is-current,
    .theme--spore-brown [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-brown .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-brown .button.is-current,
    .theme .theme--spore-brown [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-brown .is-current.commento-button.commento-submit-button {
      border-color: #774b04; }
    .button.is-current.theme--spore-dark-blue, [data-vendor="commento"] .is-current.theme--spore-dark-blue.commento-button.commento-submit-button,
    .theme--spore-dark-blue .button.is-current,
    .theme--spore-dark-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-dark-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-dark-blue .button.is-current,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .is-current.commento-button.commento-submit-button {
      border-color: #044e7e; }
    .button.is-current.theme--spore-forest-green, [data-vendor="commento"] .is-current.theme--spore-forest-green.commento-button.commento-submit-button,
    .theme--spore-forest-green .button.is-current,
    .theme--spore-forest-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-forest-green .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-forest-green .button.is-current,
    .theme .theme--spore-forest-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-forest-green .is-current.commento-button.commento-submit-button {
      border-color: #5f810a; }
    .button.is-current.theme--spore-grey-blue, [data-vendor="commento"] .is-current.theme--spore-grey-blue.commento-button.commento-submit-button,
    .theme--spore-grey-blue .button.is-current,
    .theme--spore-grey-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-grey-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-grey-blue .button.is-current,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .is-current.commento-button.commento-submit-button {
      border-color: #6d8c9f; }
    .button.is-current.theme--spore-light-blue, [data-vendor="commento"] .is-current.theme--spore-light-blue.commento-button.commento-submit-button,
    .theme--spore-light-blue .button.is-current,
    .theme--spore-light-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-light-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-light-blue .button.is-current,
    .theme .theme--spore-light-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-light-blue .is-current.commento-button.commento-submit-button {
      border-color: #79accf; }
    .button.is-current.theme--spore-lime, [data-vendor="commento"] .is-current.theme--spore-lime.commento-button.commento-submit-button,
    .theme--spore-lime .button.is-current,
    .theme--spore-lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-lime .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-lime .button.is-current,
    .theme .theme--spore-lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-lime .is-current.commento-button.commento-submit-button {
      border-color: #bbae03; }
    .button.is-current.theme--spore-ochre, [data-vendor="commento"] .is-current.theme--spore-ochre.commento-button.commento-submit-button,
    .theme--spore-ochre .button.is-current,
    .theme--spore-ochre [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-ochre .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-ochre .button.is-current,
    .theme .theme--spore-ochre [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-ochre .is-current.commento-button.commento-submit-button {
      border-color: #db9623; }
    .button.is-current.theme--spore-olive-green, [data-vendor="commento"] .is-current.theme--spore-olive-green.commento-button.commento-submit-button,
    .theme--spore-olive-green .button.is-current,
    .theme--spore-olive-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-olive-green .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-olive-green .button.is-current,
    .theme .theme--spore-olive-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-olive-green .is-current.commento-button.commento-submit-button {
      border-color: #778d3e; }
    .button.is-current.theme--spore-red, [data-vendor="commento"] .is-current.theme--spore-red.commento-button.commento-submit-button,
    .theme--spore-red .button.is-current,
    .theme--spore-red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-red .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-red .button.is-current,
    .theme .theme--spore-red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-red .is-current.commento-button.commento-submit-button {
      border-color: #f54c23; }
    .button.is-current.theme--spore-taupe, [data-vendor="commento"] .is-current.theme--spore-taupe.commento-button.commento-submit-button,
    .theme--spore-taupe .button.is-current,
    .theme--spore-taupe [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-taupe .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-taupe .button.is-current,
    .theme .theme--spore-taupe [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-taupe .is-current.commento-button.commento-submit-button {
      border-color: #7b6d65; }
    .button.is-current.theme--spore-teal, [data-vendor="commento"] .is-current.theme--spore-teal.commento-button.commento-submit-button,
    .theme--spore-teal .button.is-current,
    .theme--spore-teal [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-teal .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-teal .button.is-current,
    .theme .theme--spore-teal [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-teal .is-current.commento-button.commento-submit-button {
      border-color: #077fc1; }
    .button.is-current.theme--dark, [data-vendor="commento"] .is-current.theme--dark.commento-button.commento-submit-button,
    .theme--dark .button.is-current,
    .theme--dark [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--dark .is-current.commento-button.commento-submit-button,
    .theme .theme--dark .button.is-current,
    .theme .theme--dark [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--dark .is-current.commento-button.commento-submit-button {
      background-color: #3d3d3d; }
    .button.is-current.theme--green, [data-vendor="commento"] .is-current.theme--green.commento-button.commento-submit-button,
    .theme--green .button.is-current,
    .theme--green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--green .is-current.commento-button.commento-submit-button,
    .theme .theme--green .button.is-current,
    .theme .theme--green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--green .is-current.commento-button.commento-submit-button {
      background-color: #67ab43; }
    .button.is-current.theme--blue, [data-vendor="commento"] .is-current.theme--blue.commento-button.commento-submit-button,
    .theme--blue .button.is-current,
    .theme--blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--blue .is-current.commento-button.commento-submit-button,
    .theme .theme--blue .button.is-current,
    .theme .theme--blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--blue .is-current.commento-button.commento-submit-button {
      background-color: #56c0dd; }
    .button.is-current.theme--lime, [data-vendor="commento"] .is-current.theme--lime.commento-button.commento-submit-button,
    .theme--lime .button.is-current,
    .theme--lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--lime .is-current.commento-button.commento-submit-button,
    .theme .theme--lime .button.is-current,
    .theme .theme--lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--lime .is-current.commento-button.commento-submit-button {
      background-color: #c1d435; }
    .button.is-current.theme--yellow, [data-vendor="commento"] .is-current.theme--yellow.commento-button.commento-submit-button,
    .theme--yellow .button.is-current,
    .theme--yellow [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--yellow .is-current.commento-button.commento-submit-button,
    .theme .theme--yellow .button.is-current,
    .theme .theme--yellow [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--yellow .is-current.commento-button.commento-submit-button {
      background-color: #facf21; }
    .button.is-current.theme--gold, [data-vendor="commento"] .is-current.theme--gold.commento-button.commento-submit-button,
    .theme--gold .button.is-current,
    .theme--gold [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--gold .is-current.commento-button.commento-submit-button,
    .theme .theme--gold .button.is-current,
    .theme .theme--gold [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--gold .is-current.commento-button.commento-submit-button {
      background-color: #eb942c; }
    .button.is-current.theme--orange, [data-vendor="commento"] .is-current.theme--orange.commento-button.commento-submit-button,
    .theme--orange .button.is-current,
    .theme--orange [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--orange .is-current.commento-button.commento-submit-button,
    .theme .theme--orange .button.is-current,
    .theme .theme--orange [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--orange .is-current.commento-button.commento-submit-button {
      background-color: #e26435; }
    .button.is-current.theme--salmon, [data-vendor="commento"] .is-current.theme--salmon.commento-button.commento-submit-button,
    .theme--salmon .button.is-current,
    .theme--salmon [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--salmon .is-current.commento-button.commento-submit-button,
    .theme .theme--salmon .button.is-current,
    .theme .theme--salmon [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--salmon .is-current.commento-button.commento-submit-button {
      background-color: #eb735d; }
    .button.is-current.theme--red, [data-vendor="commento"] .is-current.theme--red.commento-button.commento-submit-button,
    .theme--red .button.is-current,
    .theme--red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--red .is-current.commento-button.commento-submit-button,
    .theme .theme--red .button.is-current,
    .theme .theme--red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--red .is-current.commento-button.commento-submit-button {
      background-color: #ec2d10; }
    .button.is-current.theme--burgundy, [data-vendor="commento"] .is-current.theme--burgundy.commento-button.commento-submit-button,
    .theme--burgundy .button.is-current,
    .theme--burgundy [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--burgundy .is-current.commento-button.commento-submit-button,
    .theme .theme--burgundy .button.is-current,
    .theme .theme--burgundy [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--burgundy .is-current.commento-button.commento-submit-button {
      background-color: #ba222a; }
    .button.is-current.theme--purple, [data-vendor="commento"] .is-current.theme--purple.commento-button.commento-submit-button,
    .theme--purple .button.is-current,
    .theme--purple [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--purple .is-current.commento-button.commento-submit-button,
    .theme .theme--purple .button.is-current,
    .theme .theme--purple [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--purple .is-current.commento-button.commento-submit-button {
      background-color: #9b3381; }
    .button.is-current.theme--youth, [data-vendor="commento"] .is-current.theme--youth.commento-button.commento-submit-button,
    .theme--youth .button.is-current,
    .theme--youth [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--youth .is-current.commento-button.commento-submit-button,
    .theme .theme--youth .button.is-current,
    .theme .theme--youth [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--youth .is-current.commento-button.commento-submit-button {
      background-color: #d57800; }
    .button.is-current.theme--digitalisation, [data-vendor="commento"] .is-current.theme--digitalisation.commento-button.commento-submit-button,
    .theme--digitalisation .button.is-current,
    .theme--digitalisation [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--digitalisation .is-current.commento-button.commento-submit-button,
    .theme .theme--digitalisation .button.is-current,
    .theme .theme--digitalisation [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--digitalisation .is-current.commento-button.commento-submit-button {
      background-color: #9a3324; }
    .button.is-current.theme--climate, [data-vendor="commento"] .is-current.theme--climate.commento-button.commento-submit-button,
    .theme--climate .button.is-current,
    .theme--climate [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--climate .is-current.commento-button.commento-submit-button,
    .theme .theme--climate .button.is-current,
    .theme .theme--climate [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--climate .is-current.commento-button.commento-submit-button {
      background-color: #693c5e; }
    .button.is-current.theme--gender, [data-vendor="commento"] .is-current.theme--gender.commento-button.commento-submit-button,
    .theme--gender .button.is-current,
    .theme--gender [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--gender .is-current.commento-button.commento-submit-button,
    .theme .theme--gender .button.is-current,
    .theme .theme--gender [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--gender .is-current.commento-button.commento-submit-button {
      background-color: #046a38; }
    .button.is-current.theme--nutrition, [data-vendor="commento"] .is-current.theme--nutrition.commento-button.commento-submit-button,
    .theme--nutrition .button.is-current,
    .theme--nutrition [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--nutrition .is-current.commento-button.commento-submit-button,
    .theme .theme--nutrition .button.is-current,
    .theme .theme--nutrition [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--nutrition .is-current.commento-button.commento-submit-button {
      background-color: #487a7b; }
    .button.is-current.theme--blog, [data-vendor="commento"] .is-current.theme--blog.commento-button.commento-submit-button,
    .theme--blog .button.is-current,
    .theme--blog [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--blog .is-current.commento-button.commento-submit-button,
    .theme .theme--blog .button.is-current,
    .theme .theme--blog [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--blog .is-current.commento-button.commento-submit-button {
      background-color: #FFA300; }
    .button.is-current.theme--spore-blue, [data-vendor="commento"] .is-current.theme--spore-blue.commento-button.commento-submit-button,
    .theme--spore-blue .button.is-current,
    .theme--spore-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-blue .button.is-current,
    .theme .theme--spore-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-blue .is-current.commento-button.commento-submit-button {
      background-color: #3f68b1; }
    .button.is-current.theme--spore-brown, [data-vendor="commento"] .is-current.theme--spore-brown.commento-button.commento-submit-button,
    .theme--spore-brown .button.is-current,
    .theme--spore-brown [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-brown .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-brown .button.is-current,
    .theme .theme--spore-brown [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-brown .is-current.commento-button.commento-submit-button {
      background-color: #774b04; }
    .button.is-current.theme--spore-dark-blue, [data-vendor="commento"] .is-current.theme--spore-dark-blue.commento-button.commento-submit-button,
    .theme--spore-dark-blue .button.is-current,
    .theme--spore-dark-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-dark-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-dark-blue .button.is-current,
    .theme .theme--spore-dark-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-dark-blue .is-current.commento-button.commento-submit-button {
      background-color: #044e7e; }
    .button.is-current.theme--spore-forest-green, [data-vendor="commento"] .is-current.theme--spore-forest-green.commento-button.commento-submit-button,
    .theme--spore-forest-green .button.is-current,
    .theme--spore-forest-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-forest-green .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-forest-green .button.is-current,
    .theme .theme--spore-forest-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-forest-green .is-current.commento-button.commento-submit-button {
      background-color: #5f810a; }
    .button.is-current.theme--spore-grey-blue, [data-vendor="commento"] .is-current.theme--spore-grey-blue.commento-button.commento-submit-button,
    .theme--spore-grey-blue .button.is-current,
    .theme--spore-grey-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-grey-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-grey-blue .button.is-current,
    .theme .theme--spore-grey-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-grey-blue .is-current.commento-button.commento-submit-button {
      background-color: #6d8c9f; }
    .button.is-current.theme--spore-light-blue, [data-vendor="commento"] .is-current.theme--spore-light-blue.commento-button.commento-submit-button,
    .theme--spore-light-blue .button.is-current,
    .theme--spore-light-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-light-blue .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-light-blue .button.is-current,
    .theme .theme--spore-light-blue [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-light-blue .is-current.commento-button.commento-submit-button {
      background-color: #79accf; }
    .button.is-current.theme--spore-lime, [data-vendor="commento"] .is-current.theme--spore-lime.commento-button.commento-submit-button,
    .theme--spore-lime .button.is-current,
    .theme--spore-lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-lime .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-lime .button.is-current,
    .theme .theme--spore-lime [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-lime .is-current.commento-button.commento-submit-button {
      background-color: #bbae03; }
    .button.is-current.theme--spore-ochre, [data-vendor="commento"] .is-current.theme--spore-ochre.commento-button.commento-submit-button,
    .theme--spore-ochre .button.is-current,
    .theme--spore-ochre [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-ochre .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-ochre .button.is-current,
    .theme .theme--spore-ochre [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-ochre .is-current.commento-button.commento-submit-button {
      background-color: #db9623; }
    .button.is-current.theme--spore-olive-green, [data-vendor="commento"] .is-current.theme--spore-olive-green.commento-button.commento-submit-button,
    .theme--spore-olive-green .button.is-current,
    .theme--spore-olive-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-olive-green .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-olive-green .button.is-current,
    .theme .theme--spore-olive-green [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-olive-green .is-current.commento-button.commento-submit-button {
      background-color: #778d3e; }
    .button.is-current.theme--spore-red, [data-vendor="commento"] .is-current.theme--spore-red.commento-button.commento-submit-button,
    .theme--spore-red .button.is-current,
    .theme--spore-red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-red .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-red .button.is-current,
    .theme .theme--spore-red [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-red .is-current.commento-button.commento-submit-button {
      background-color: #f54c23; }
    .button.is-current.theme--spore-taupe, [data-vendor="commento"] .is-current.theme--spore-taupe.commento-button.commento-submit-button,
    .theme--spore-taupe .button.is-current,
    .theme--spore-taupe [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-taupe .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-taupe .button.is-current,
    .theme .theme--spore-taupe [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-taupe .is-current.commento-button.commento-submit-button {
      background-color: #7b6d65; }
    .button.is-current.theme--spore-teal, [data-vendor="commento"] .is-current.theme--spore-teal.commento-button.commento-submit-button,
    .theme--spore-teal .button.is-current,
    .theme--spore-teal [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme--spore-teal .is-current.commento-button.commento-submit-button,
    .theme .theme--spore-teal .button.is-current,
    .theme .theme--spore-teal [data-vendor="commento"] .is-current.commento-button.commento-submit-button,
    [data-vendor="commento"] .theme .theme--spore-teal .is-current.commento-button.commento-submit-button {
      background-color: #077fc1; }
  .button-bar {
    text-align: center; }
    .button-bar {
      display: inline-block; }
    .button-bar--center {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: distribute;
          justify-content: space-around; }

/* 3.6 Form */
/*
Form fields

Styleguide 3.6
*/
/*
Text Input

.fld - Bas field selector
.fld:hover - Hover state
.fld:focus - Focus state
.fld:empty - Empty state

markup:
<input class="fld" type="text"/>
<input class="fld" type="text"/>
<input class="fld" type="text"/>

Styleguide 3.6.1
*/
.fld {
  border: 0;
  border-bottom: 1px dashed;
  background: transparent;
  margin: 0;
  padding: 0 3px; }
  .fld:focus {
    -moz-box-shadow: none;
         box-shadow: none;
    outline: 1px solid #e1eed9;
    background: #e1eed9; }
    .well .fld:focus {
      outline-color: #fff;
      outline-color: white;
      background: #fff;
      background: white; }
  .theme--blue .fld:focus {
    outline: 1px solid #ddf2f8;
    background: #ddf2f8; }
  .theme--lime .fld:focus {
    outline: 1px solid #f3f6d7;
    background: #f3f6d7; }
  .theme--yellow .fld:focus {
    outline: 1px solid #fef5d3;
    background: #fef5d3; }
  .theme--gold .fld:focus {
    outline: 1px solid #fbead5;
    background: #fbead5; }
  .theme--orange .fld:focus {
    outline: 1px solid #f9e0d7;
    background: #f9e0d7; }
  .theme--salmon .fld:focus {
    outline: 1px solid #fbe3df;
    background: #fbe3df; }
  .theme--red .fld:focus {
    outline: 1px solid #fbd5cf;
    background: #fbd5cf; }
  .theme--burgundy .fld:focus {
    outline: 1px solid #f1d3d4;
    background: #f1d3d4; }
  .theme--purple .fld:focus {
    outline: 1px solid #ebd6e6;
    background: #ebd6e6; }
  .fld--l .selectize-control input {
    font-size: 2.4375em;
    text-transform: uppercase;
    font-weight: bold; }
    .fld--l .selectize-control input::-webkit-input-placeholder {
      color: #cdcdcd; }
    .fld--l .selectize-control input::-moz-placeholder {
      color: #cdcdcd; }
    .fld--l .selectize-control input:-ms-input-placeholder {
      color: #cdcdcd; }
    .fld--l .selectize-control input::placeholder {
      color: #cdcdcd; }
  .fld--label {
    color: #cdcdcd;
    font-weight: normal; }
  .ctx-item__search .fld {
    padding-left: 0; }

/*
Textarea Input

Styleguide 3.6.2
*/
/*
Select Input

Styleguide 3.6.3
*/
/*
Checkboxes

Styleguide 3.6.4
*/
.fld-checkbox {
  margin-right: 9px; }

/*
Radio buttons

Styleguide 3.6.5
*/
.fld-radio,
.fld-checkbox {
  width: 21px;
  /* IE11 fallback */ }

/*
Field label

Field labels are assign the title classes.

.fld-label.title - Field label

markup:
<label class="fld-label title">Full name</label>

Styleguide 3.6.6
*/
.fld-label {
  /* small title*/
  font-size: 0.75em;
  line-height: 1.5;
  font-weight: 600;
  margin: 15px 0 0; }

/*
Placeholder

Placeholder default browser opacity reset.

.placeholder-visible - Opacity reset

markup:
<input class="fld {$modifiers}" placeholder="This is a styled placeholder">

Styleguide 3.6.7
*/
::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #6c6c6c; }

::-moz-placeholder {
  /* Firefox 19+ */
  color: #6c6c6c; }

:-ms-input-placeholder {
  /* IE 10+ */
  color: #6c6c6c; }

:-moz-placeholder {
  /* Firefox 18- */
  color: #6c6c6c; }

/* 3.8 Icon */
/*
Icon

Element with a `data-icon` attribute.

more - Thin arrow pointing right icon `more`
facebook - Print icon `facebook`
twitter - Print icon `twitter`
chevron-down - Chevron pointing down icon
chevron-left - Chevron pointing left icon
chevron-right - Chevron pointing right icon
chevron-up - Chevron pointing up icon
chevron-small-down - Small chevron pointing down icon
chevron-small-left - Small chevron pointing left icon
chevron-small-right - Small chevron pointing right icon
chevron-small-up - Small chevron pointing up icon
controller-play - Play icon `play`
download - Download icon `download`
eye - Download icon `eye`
globe - Download icon `world` or `regions`
hand - Download icon `hand`, `donations`, `donate`
heart - Heart icon `real facts`, `love`
home - Home icon `print`
image - Image icon `photo`, `gallery`
leaf - Leaf icon `cta home`, `leaf`
link - Link icon `link`
linkedin - LinkedIn icon `linkedin`
location - Location icon `location`
email - Envelope icon `mail`
map - Map icon `map`
print - Print icon `print`
rss - RSS icon `rss`
users - Users icon `users`

markup:
<span data-icon="{$modifiers}"></span>

Styleguide 3.8
*/
@font-face {
  font-family: 'cta-icons';
  src: url("../fonts/cta-icons.eot?pif7o8");
  src: url("../fonts/cta-icons.eot?pif7o8#iefix") format("embedded-opentype"), url("../fonts/cta-icons.ttf?pif7o8") format("truetype"), url("../fonts/cta-icons.woff?pif7o8") format("woff"), url("../fonts/cta-icons.svg?pif7o8#cta-icons") format("svg");
  font-weight: normal;
  font-style: normal; }

.icon, .list--take-aways li:before, .list--theme li:before, .filter__trigger:after, .block-link--icon:before, .panel.is-inactive .panel__trigger:after, .tail__lengthen:before, .tail__lengthen:after, .tail__shorten:before, .tail__shorten:after,
[data-icon]:before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'cta-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Enable Ligatures ================ */
  letter-spacing: 0;
  -webkit-font-feature-settings: "liga";
  -moz-font-feature-settings: "liga=1";
  -moz-font-feature-settings: "liga";
  -ms-font-feature-settings: "liga" 1;
  font-feature-settings: "liga";
  -webkit-font-variant-ligatures: discretionary-ligatures;
  -moz-font-variant-ligatures: discretionary-ligatures;
       font-variant-ligatures: discretionary-ligatures;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* data-attribute ================ */
  content: attr(data-icon); }

@media only screen and (min-width: 48em) {
  .icon--l {
    font-size: 2em; } }

.icon--drop {
  position: relative;
  top: 0.05em;
  font-size: 1.3em; }

.icon--project {
  top: -3px; }

.icon--theme {
  color: #67ab43; }

.list--concept .label .icon, .list--concept .label .list--take-aways li:before, .list--take-aways .list--concept .label li:before, .list--concept .label .list--theme li:before, .list--theme .list--concept .label li:before, .list--concept .label .filter__trigger:after, .list--concept .label .block-link--icon:before, .list--concept .label .panel.is-inactive .panel__trigger:after, .panel.is-inactive .list--concept .label .panel__trigger:after, .list--concept .label .tail__lengthen:before, .list--concept .label .tail__lengthen:after, .list--concept .label .tail__shorten:before, .list--concept .label .tail__shorten:after {
  vertical-align: middle;
  margin-left: .5em; }

.icon--dark {
  color: #567f41; }
  .theme--blue .icon--dark {
    color: #4c8c9d; }
  .theme--lime .icon--dark {
    color: #8c9838; }
  .theme--yellow .icon--dark {
    color: #ae952c; }
  .theme--gold .icon--dark {
    color: #a57133; }
  .theme--orange .icon--dark {
    color: #a05438; }
  .theme--salmon .icon--dark {
    color: #a55d50; }
  .theme--red .icon--dark {
    color: #a63322; }
  .theme--burgundy .icon--dark {
    color: #882d32; }
  .theme--purple .icon--dark {
    color: #753766; }

.icon--thin-arrow:before {
  content: "9"; }

.icon--thin-arrow:before {
  content: "9"; }

.icon--archive:before {
  content: ""; }

.icon--cross:before {
  content: ""; }

.icon--plus:before {
  content: ""; }

.icon--facebook:before {
  content: ""; }

.icon--twitter:before {
  content: ""; }

.icon--chevron-down:before {
  content: ""; }

.icon--chevron-left:before {
  content: ""; }

.icon--chevron-right:before {
  content: ""; }

.icon--chevron-up:before {
  content: ""; }

.icon--controller-play:before {
  content: ""; }

.icon--download:before {
  content: ""; }

.icon--eye:before {
  content: ""; }

.icon--globe:before {
  content: ""; }

.icon--hand:before {
  content: ""; }

.icon--heart:before {
  content: ""; }

.icon--home:before {
  content: ""; }

.icon--image:before {
  content: ""; }

.icon--leaf:before {
  content: ""; }

.icon--link:before {
  content: ""; }

.icon--linkedin:before {
  content: ""; }

.icon--location:before,
.icon--map-marker:before {
  content: ""; }

.icon--envelope:before {
  content: ""; }

.icon--map:before {
  content: ""; }

.icon--print:before {
  content: ""; }

.icon--rss:before {
  content: ""; }

.icon--users:before {
  content: ""; }

.icon--instagram:before {
  content: ""; }

.icon--vimeo:before {
  content: ""; }

.icon--youtube:before {
  content: ""; }

/*
Icon with icon class

Element with class `icon` and a `data-icon` attribute.

thin-arrow - Thin arrow pointing right `more`
facebook - Print `facebook`
twitter - Print `twitter`
linkedin - Print `linkedin`
chevron-down - Chevron pointing down
chevron-left - Chevron pointing left
chevron-right - Chevron pointing right
chevron-up - Chevron pointing up
chevron-small-down - Small chevron pointing down
chevron-small-left - Small chevron pointing left
chevron-small-right - Small chevron pointing right
chevron-small-up - Small chevron pointing up
controller-play - Play `play`
download - Download `download`
eye - Download `eye`
globe - Download `world` or `regions`
hand - Download `hand`, `donations`, `donate`
heart - Heart `real facts`, `love`
home - Home `print`
image - Image `photo`, `gallery`
leaf - Leaf `cta home`, `leaf`
link - Link `link`
location - Location `location`
envelope - Envelope `mail`
map - Map `map`
print - Print `print`
rss - RSS `rss`
users - Users `users`

markup:
<span class="icon icon--{$modifiers}"></span>

Styleguide 3.8.1
*/
/* 3.7 List */
/*
List

.list--inline - Display set to inline.
.list--float - List items are floated next to eachother
.list--take-aways - List with take-aways
.list--theme - List with leaf icons
.list--footnotes - List of footnotes

markup:
<ul class="{$modifiers}">
  <li>List item 1</li>
  <li>List item 2</li>
  <li>List item 3</li>
</ul>

Styleguide 3.7
*/
.list--inline li, .menu li {
  display: inline; }

.list--float {
  /**
  * For IE 6/7 only
  */ }
  .list--float::before, .list--float::after {
    content: " ";
    display: table; }
  .list--float::after {
    clear: both; }
  .list--float li {
    float: left; }

.list--take-aways {
  padding-left: 15px; }

.list--take-aways, .list--theme {
  list-style-type: none; }
  .list--take-aways li, .list--theme li {
    position: relative;
    padding-left: 2em;
    margin-top: 12px;
    margin-bottom: 12px; }
    .list--take-aways li:before, .list--theme li:before {
      position: absolute;
      top: 0.2em;
      left: 0;
      content: "";
      display: inline;
      color: #1d673b; }
    .theme--blue .list--take-aways li:before, .theme--blue .list--theme li:before {
      color: #56c0dd; }
    .theme--lime .list--take-aways li:before, .theme--lime .list--theme li:before {
      color: #c1d435; }
    .theme--yellow .list--take-aways li:before, .theme--yellow .list--theme li:before {
      color: #facf21; }
    .theme--gold .list--take-aways li:before, .theme--gold .list--theme li:before {
      color: #eb942c; }
    .theme--orange .list--take-aways li:before, .theme--orange .list--theme li:before {
      color: #e26435; }
    .theme--salmon .list--take-aways li:before, .theme--salmon .list--theme li:before {
      color: #eb735d; }
    .theme--red .list--take-aways li:before, .theme--red .list--theme li:before {
      color: #ec2d10; }
    .theme--burgundy .list--take-aways li:before, .theme--burgundy .list--theme li:before {
      color: #ba222a; }
    .theme--purple .list--take-aways li:before, .theme--purple .list--theme li:before {
      color: #9b3381; }

.list--footnotes {
  padding-left: 15px; }
  .list--footnotes li {
    margin-top: 12px;
    margin-bottom: 12px;
    padding-left: 1em;
    color: #67ab43; }
    .list--footnotes li span {
      color: #3d3d3d; }

/*
Wrapped list

This list will be wrapped to use a leader or trailer. This won't work on the list itself cause of it's reset.

.list--inline - Display set to inline.
.list--float - List items are floated next to eachother

markup:
<ul class="{$modifiers}">
  <li>List item 1</li>
  <li>List item 2</li>
  <li>List item 3</li>
</ul>

sg-wrapper:
<div class="leader">
  <sg-wrapper-content/>
</div>

Styleguide 3.7.1
*/
/* 3.8 Definition list */
.dlist,
.dlist + * {
  clear: both; }

.dlist--grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto auto;
      grid-template-columns: auto auto; }

.dlist__label {
  clear: left;
  margin-right: .5em; }

.dlist__value, .dlist__label {
  float: left;
  display: inline-block;
  vertical-align: top; }

.dlist__value + .dlist__label,
.dlist__value + .dlist__label + .dlist__value {
  margin-top: 4.5px; }

/* 3.9 Label */
/*
Label

.label - Label
.label:hover - Label hover state
.label:active - Label active state
.label.label--square - Square label, for use with icon
.label.label--s - Smaller tag
.label.label--stretch - Stretched Label

markup:
<span class="{$modifiers}">Featured Article</span>

Styleguide 3.9
*/
.label {
  display: inline-block;
  padding: 3px 7.5px;
  font-family: "Open Sans", sans-serif;
  text-transform: uppercase;
  background: #67ab43;
  font-size: 0.5em;
  font-weight: 600;
  letter-spacing: .05em;
  line-height: 12px;
  font-style: normal;
  /* In case this is an anchor tag */
  text-decoration: none;
  background-color: #67ab43; }
  .label.theme--dark,
  .theme--dark .label,
  .theme .theme--dark .label {
    background-color: #3d3d3d; }
  .label.theme--green,
  .theme--green .label,
  .theme .theme--green .label {
    background-color: #67ab43; }
  .label.theme--blue,
  .theme--blue .label,
  .theme .theme--blue .label {
    background-color: #56c0dd; }
  .label.theme--lime,
  .theme--lime .label,
  .theme .theme--lime .label {
    background-color: #c1d435; }
  .label.theme--yellow,
  .theme--yellow .label,
  .theme .theme--yellow .label {
    background-color: #facf21; }
  .label.theme--gold,
  .theme--gold .label,
  .theme .theme--gold .label {
    background-color: #eb942c; }
  .label.theme--orange,
  .theme--orange .label,
  .theme .theme--orange .label {
    background-color: #e26435; }
  .label.theme--salmon,
  .theme--salmon .label,
  .theme .theme--salmon .label {
    background-color: #eb735d; }
  .label.theme--red,
  .theme--red .label,
  .theme .theme--red .label {
    background-color: #ec2d10; }
  .label.theme--burgundy,
  .theme--burgundy .label,
  .theme .theme--burgundy .label {
    background-color: #ba222a; }
  .label.theme--purple,
  .theme--purple .label,
  .theme .theme--purple .label {
    background-color: #9b3381; }
  .label.theme--youth,
  .theme--youth .label,
  .theme .theme--youth .label {
    background-color: #d57800; }
  .label.theme--digitalisation,
  .theme--digitalisation .label,
  .theme .theme--digitalisation .label {
    background-color: #9a3324; }
  .label.theme--climate,
  .theme--climate .label,
  .theme .theme--climate .label {
    background-color: #693c5e; }
  .label.theme--gender,
  .theme--gender .label,
  .theme .theme--gender .label {
    background-color: #046a38; }
  .label.theme--nutrition,
  .theme--nutrition .label,
  .theme .theme--nutrition .label {
    background-color: #487a7b; }
  .label.theme--blog,
  .theme--blog .label,
  .theme .theme--blog .label {
    background-color: #ffa300; }
  .label.theme--spore-blue,
  .theme--spore-blue .label,
  .theme .theme--spore-blue .label {
    background-color: #3f68b1; }
  .label.theme--spore-brown,
  .theme--spore-brown .label,
  .theme .theme--spore-brown .label {
    background-color: #774b04; }
  .label.theme--spore-dark-blue,
  .theme--spore-dark-blue .label,
  .theme .theme--spore-dark-blue .label {
    background-color: #044e7e; }
  .label.theme--spore-forest-green,
  .theme--spore-forest-green .label,
  .theme .theme--spore-forest-green .label {
    background-color: #5f810a; }
  .label.theme--spore-grey-blue,
  .theme--spore-grey-blue .label,
  .theme .theme--spore-grey-blue .label {
    background-color: #6d8c9f; }
  .label.theme--spore-light-blue,
  .theme--spore-light-blue .label,
  .theme .theme--spore-light-blue .label {
    background-color: #79accf; }
  .label.theme--spore-lime,
  .theme--spore-lime .label,
  .theme .theme--spore-lime .label {
    background-color: #bbae03; }
  .label.theme--spore-ochre,
  .theme--spore-ochre .label,
  .theme .theme--spore-ochre .label {
    background-color: #db9623; }
  .label.theme--spore-olive-green,
  .theme--spore-olive-green .label,
  .theme .theme--spore-olive-green .label {
    background-color: #778d3e; }
  .label.theme--spore-red,
  .theme--spore-red .label,
  .theme .theme--spore-red .label {
    background-color: #f54c23; }
  .label.theme--spore-taupe,
  .theme--spore-taupe .label,
  .theme .theme--spore-taupe .label {
    background-color: #7b6d65; }
  .label.theme--spore-teal,
  .theme--spore-teal .label,
  .theme .theme--spore-teal .label {
    background-color: #077fc1; }
  .theme .theme--dark .label {
    background-color: #3d3d3d; }
  .theme .theme--green .label {
    background-color: #67ab43; }
  .theme .theme--blue .label {
    background-color: #56c0dd; }
  .theme .theme--lime .label {
    background-color: #c1d435; }
  .theme .theme--yellow .label {
    background-color: #facf21; }
  .theme .theme--gold .label {
    background-color: #eb942c; }
  .theme .theme--orange .label {
    background-color: #e26435; }
  .theme .theme--salmon .label {
    background-color: #eb735d; }
  .theme .theme--red .label {
    background-color: #ec2d10; }
  .theme .theme--burgundy .label {
    background-color: #ba222a; }
  .theme .theme--purple .label {
    background-color: #9b3381; }
  .theme .theme--youth .label {
    background-color: #d57800; }
  .theme .theme--digitalisation .label {
    background-color: #9a3324; }
  .theme .theme--climate .label {
    background-color: #693c5e; }
  .theme .theme--gender .label {
    background-color: #046a38; }
  .theme .theme--nutrition .label {
    background-color: #487a7b; }
  .theme .theme--blog .label {
    background-color: #ffa300; }
  .theme .theme--spore-blue .label {
    background-color: #3f68b1; }
  .theme .theme--spore-brown .label {
    background-color: #774b04; }
  .theme .theme--spore-dark-blue .label {
    background-color: #044e7e; }
  .theme .theme--spore-forest-green .label {
    background-color: #5f810a; }
  .theme .theme--spore-grey-blue .label {
    background-color: #6d8c9f; }
  .theme .theme--spore-light-blue .label {
    background-color: #79accf; }
  .theme .theme--spore-lime .label {
    background-color: #bbae03; }
  .theme .theme--spore-ochre .label {
    background-color: #db9623; }
  .theme .theme--spore-olive-green .label {
    background-color: #778d3e; }
  .theme .theme--spore-red .label {
    background-color: #f54c23; }
  .theme .theme--spore-taupe .label {
    background-color: #7b6d65; }
  .theme .theme--spore-teal .label {
    background-color: #077fc1; }
  .label, .label:hover {
    color: #fff !important; }
  .label:hover {
    -moz-box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.26);
         box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.26); }
  .label:active {
    -moz-box-shadow: -1px -1px 8px rgba(0, 0, 0, 0.26);
         box-shadow: -1px -1px 8px rgba(0, 0, 0, 0.26); }
  .headline__tax .label, .label.headline__tax {
    -moz-box-shadow: none;
         box-shadow: none; }
  .label--dark {
    color: #fff !important; }
  .label--stretch {
    width: 100%; }

a.label, a.label:visited, a.label:hover {
  color: #fff; }

@media only screen and (min-width: 64em) {
  .label {
    padding: 10.5px 30px;
    font-size: 0.875em;
    line-height: 15px;
    font-weight: 400; }
  .label.label--s {
    padding: 4.5px 6px;
    font-size: 0.5625em;
    line-height: 12px; } }

.posting__content .label {
  margin-bottom: 6px; }

.list--float .label {
  padding: 10.5px 30px;
  font-size: 0.875em;
  line-height: 15px; }

.list--float .share {
  padding: 0;
  line-height: 36px; }

/*
Label List

.label-list - Label List

markup:
<ul class="{$modifiers} reset list--inline">
  <li><a class="label label--s" href="javascript:void();">GIS</a></li>
  <li><a class="label label--s" href="javascript:void();">GPS</a></li>
  <li><a class="label label--s" href="javascript:void();">Hardware</a></li>
  <li><a class="label label--s" href="javascript:void();">Internet</a></li>
  <li><a class="label label--s" href="javascript:void();">Measuring</a></li>
  <li><a class="label label--s" href="javascript:void();">Monitoring</a></li>
  <li><a class="label label--s" href="javascript:void();">Radio</a></li>
  <li><a class="label label--s" href="javascript:void();">Software</a></li>
  <li><a class="label label--s" href="javascript:void();">Telehony</a></li>
  <li><a class="label label--s" href="javascript:void();">TV & Video</a></li>
</ul>

Styleguide 3.9.1
*/
.label-list .label {
  float: left;
  margin: 0 6px 3px 0; }

/* 3.10 Date */
/*
Date

.date - Date block
.date.date--inline - Floats date block to the left
.date__project - Project date

markup:
<span class="{$modifiers}">
  <span class="date__head">Dec</span>
  <span class="date__body">31</span>
</span>

Styleguide 3.10
*/
.date {
  width: 33px;
  height: auto;
  background-color: #67ab43;
  display: inline-block;
  background: #67ab43;
  color: #fff; }
  .date__head {
    padding: 3px;
    letter-spacing: .042em;
    font-size: 0.625em; }
  .date__body {
    padding: 0 0 3px 3px;
    font-size: 1.125em; }
  .date.theme--dark,
  .theme--dark .date,
  .theme .theme--dark .date {
    background-color: #3d3d3d; }
  .date.theme--green,
  .theme--green .date,
  .theme .theme--green .date {
    background-color: #67ab43; }
  .date.theme--blue,
  .theme--blue .date,
  .theme .theme--blue .date {
    background-color: #56c0dd; }
  .date.theme--lime,
  .theme--lime .date,
  .theme .theme--lime .date {
    background-color: #c1d435; }
  .date.theme--yellow,
  .theme--yellow .date,
  .theme .theme--yellow .date {
    background-color: #facf21; }
  .date.theme--gold,
  .theme--gold .date,
  .theme .theme--gold .date {
    background-color: #eb942c; }
  .date.theme--orange,
  .theme--orange .date,
  .theme .theme--orange .date {
    background-color: #e26435; }
  .date.theme--salmon,
  .theme--salmon .date,
  .theme .theme--salmon .date {
    background-color: #eb735d; }
  .date.theme--red,
  .theme--red .date,
  .theme .theme--red .date {
    background-color: #ec2d10; }
  .date.theme--burgundy,
  .theme--burgundy .date,
  .theme .theme--burgundy .date {
    background-color: #ba222a; }
  .date.theme--purple,
  .theme--purple .date,
  .theme .theme--purple .date {
    background-color: #9b3381; }
  .date.theme--youth,
  .theme--youth .date,
  .theme .theme--youth .date {
    background-color: #d57800; }
  .date.theme--digitalisation,
  .theme--digitalisation .date,
  .theme .theme--digitalisation .date {
    background-color: #9a3324; }
  .date.theme--climate,
  .theme--climate .date,
  .theme .theme--climate .date {
    background-color: #693c5e; }
  .date.theme--gender,
  .theme--gender .date,
  .theme .theme--gender .date {
    background-color: #046a38; }
  .date.theme--nutrition,
  .theme--nutrition .date,
  .theme .theme--nutrition .date {
    background-color: #487a7b; }
  .date.theme--blog,
  .theme--blog .date,
  .theme .theme--blog .date {
    background-color: #ffa300; }
  .date.theme--spore-blue,
  .theme--spore-blue .date,
  .theme .theme--spore-blue .date {
    background-color: #3f68b1; }
  .date.theme--spore-brown,
  .theme--spore-brown .date,
  .theme .theme--spore-brown .date {
    background-color: #774b04; }
  .date.theme--spore-dark-blue,
  .theme--spore-dark-blue .date,
  .theme .theme--spore-dark-blue .date {
    background-color: #044e7e; }
  .date.theme--spore-forest-green,
  .theme--spore-forest-green .date,
  .theme .theme--spore-forest-green .date {
    background-color: #5f810a; }
  .date.theme--spore-grey-blue,
  .theme--spore-grey-blue .date,
  .theme .theme--spore-grey-blue .date {
    background-color: #6d8c9f; }
  .date.theme--spore-light-blue,
  .theme--spore-light-blue .date,
  .theme .theme--spore-light-blue .date {
    background-color: #79accf; }
  .date.theme--spore-lime,
  .theme--spore-lime .date,
  .theme .theme--spore-lime .date {
    background-color: #bbae03; }
  .date.theme--spore-ochre,
  .theme--spore-ochre .date,
  .theme .theme--spore-ochre .date {
    background-color: #db9623; }
  .date.theme--spore-olive-green,
  .theme--spore-olive-green .date,
  .theme .theme--spore-olive-green .date {
    background-color: #778d3e; }
  .date.theme--spore-red,
  .theme--spore-red .date,
  .theme .theme--spore-red .date {
    background-color: #f54c23; }
  .date.theme--spore-taupe,
  .theme--spore-taupe .date,
  .theme .theme--spore-taupe .date {
    background-color: #7b6d65; }
  .date.theme--spore-teal,
  .theme--spore-teal .date,
  .theme .theme--spore-teal .date {
    background-color: #077fc1; }
  .date__head, .date__body {
    display: block;
    line-height: 1; }
  .date__body {
    font-weight: 600; }
  .date--inline {
    float: left;
    margin-right: 1em; }
  @media only screen and (min-width: 48em) {
    .date {
      width: 63px; }
      .date__head {
        padding: 6px;
        letter-spacing: .058em;
        font-size: 0.875em; }
      .date__body {
        padding: 0 0 6px 6px;
        font-size: 2.25em; } }
  .date__project {
    font-size: 0.75em;
    line-height: 1.25;
    color: #757575; }

/* 3.11 Slogan */
/*
Slogan

markup:
<p class="slogan">
  <em class="is-narrative">Sowing Innovation Harvesting Prosperity</em>
</p>

Styleguide 3.11
*/
@media only screen and (max-width: 47.9375em) {
  .slogan--large .slogan {
    height: auto; } }

@media only screen and (min-width: 48em) {
  .slogan {
    height: 348px; } }

.slogan--backdrop {
  background: rgba(0, 0, 0, 0.2); }

.slogan--twitter {
  font-size: 1.5em;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  font-family: "Open Sans", sans-serif;
  margin-right: 15px; }
  @media only screen and (min-width: 64em) {
    .slogan--twitter {
      font-size: 2em; } }
  .slogan--twitter, .slogan--twitter:visited {
    color: #fff; }

@media only screen and (min-width: 64em) {
  .slogan--large .slogan {
    height: 420px; } }

/* 3.12 Theme */
/*
Theme

The theme class defines which spot colour is used.

.theme--blue - Blue
.theme--lime - Lime
.theme--yellow - Yellow
.theme--gold - Gold
.theme--salmon - Salmon
.theme--orange - Orange
.theme--red - Red
.theme--burgundy - Burgundy
.theme--purple - Purple

markup:
<div class="{$modifiers}">
  <sg-insert>3.4-1</sg-insert>
  <sg-insert>3.9-1</sg-insert>
</div>

Styleguide 3.12
*/
/* 3.13 Well */
/*
Well

Container with themed background

.well - 26%
.well.well--lighter - 10%
.well.well--darker - 54%
.well.well--darkest - 76%
.well.well--full - 100%
.well.well--slim-fit - Without padding
.well.well--neutral - Neutral colour well

markup:
<div class="{$modifiers}">
  Content
</div>

Styleguide 3.13
*/
/*
 * 1. Disable bolding effect of text on a darker background
 */
.well {
  background-color: #d7e9ce; }
  .well.theme--dark,
  .theme--dark .well,
  .theme .theme--dark .well {
    background-color: #cdcdcd; }
  .well.theme--green,
  .theme--green .well,
  .theme .theme--green .well {
    background-color: #d7e9ce; }
  .well.theme--blue,
  .theme--blue .well,
  .theme .theme--blue .well {
    background-color: #d3eff6; }
  .well.theme--lime,
  .theme--lime .well,
  .theme .theme--lime .well {
    background-color: #eff4ca; }
  .well.theme--yellow,
  .theme--yellow .well,
  .theme .theme--yellow .well {
    background-color: #fef3c5; }
  .well.theme--gold,
  .theme--gold .well,
  .theme .theme--gold .well {
    background-color: #fae3c8; }
  .well.theme--orange,
  .theme--orange .well,
  .theme .theme--orange .well {
    background-color: #f7d7ca; }
  .well.theme--salmon,
  .theme--salmon .well,
  .theme .theme--salmon .well {
    background-color: #fadbd5; }
  .well.theme--red,
  .theme--red .well,
  .theme .theme--red .well {
    background-color: #fac8c1; }
  .well.theme--burgundy,
  .theme--burgundy .well,
  .theme .theme--burgundy .well {
    background-color: #edc6c8; }
  .well.theme--purple,
  .theme--purple .well,
  .theme .theme--purple .well {
    background-color: #e5cade; }
  .well.theme--youth,
  .theme--youth .well,
  .theme .theme--youth .well {
    background-color: #f4dcbd; }
  .well.theme--digitalisation,
  .theme--digitalisation .well,
  .theme .theme--digitalisation .well {
    background-color: #e5cac6; }
  .well.theme--climate,
  .theme--climate .well,
  .theme .theme--climate .well {
    background-color: #d8ccd5; }
  .well.theme--gender,
  .theme--gender .well,
  .theme .theme--gender .well {
    background-color: #bed8cb; }
  .well.theme--nutrition,
  .theme--nutrition .well,
  .theme .theme--nutrition .well {
    background-color: #cfdcdd; }
  .well.theme--blog,
  .theme--blog .well,
  .theme .theme--blog .well {
    background-color: #ffe7bd; }
  .well.theme--spore-blue,
  .theme--spore-blue .well,
  .theme .theme--spore-blue .well {
    background-color: #cdd8eb; }
  .well.theme--spore-brown,
  .theme--spore-brown .well,
  .theme .theme--spore-brown .well {
    background-color: #dcd0be; }
  .well.theme--spore-dark-blue,
  .theme--spore-dark-blue .well,
  .theme .theme--spore-dark-blue .well {
    background-color: #bed1dd; }
  .well.theme--spore-forest-green,
  .theme--spore-forest-green .well,
  .theme .theme--spore-forest-green .well {
    background-color: #d5debf; }
  .well.theme--spore-grey-blue,
  .theme--spore-grey-blue .well,
  .theme .theme--spore-grey-blue .well {
    background-color: #d9e1e6; }
  .well.theme--spore-light-blue,
  .theme--spore-light-blue .well,
  .theme .theme--spore-light-blue .well {
    background-color: #dce9f3; }
  .well.theme--spore-lime,
  .theme--spore-lime .well,
  .theme .theme--spore-lime .well {
    background-color: #edeabd; }
  .well.theme--spore-ochre,
  .theme--spore-ochre .well,
  .theme .theme--spore-ochre .well {
    background-color: #f6e4c6; }
  .well.theme--spore-olive-green,
  .theme--spore-olive-green .well,
  .theme .theme--spore-olive-green .well {
    background-color: #dce1cd; }
  .well.theme--spore-red,
  .theme--spore-red .well,
  .theme .theme--spore-red .well {
    background-color: #fcd0c6; }
  .well.theme--spore-taupe,
  .theme--spore-taupe .well,
  .theme .theme--spore-taupe .well {
    background-color: #ddd9d7; }
  .well.theme--spore-teal,
  .theme--spore-teal .well,
  .theme .theme--spore-teal .well {
    background-color: #bfdeef; }
  .well--padded {
    padding-top: 30px;
    padding-bottom: 30px; }
  .well--lighter {
    background-color: #f0f7ec; }
    .well--lighter.theme--dark,
    .theme--dark .well--lighter,
    .theme .theme--dark .well--lighter {
      background-color: #ececec; }
    .well--lighter.theme--green,
    .theme--green .well--lighter,
    .theme .theme--green .well--lighter {
      background-color: #f0f7ec; }
    .well--lighter.theme--blue,
    .theme--blue .well--lighter,
    .theme .theme--blue .well--lighter {
      background-color: #eef9fc; }
    .well--lighter.theme--lime,
    .theme--lime .well--lighter,
    .theme .theme--lime .well--lighter {
      background-color: #f9fbeb; }
    .well--lighter.theme--yellow,
    .theme--yellow .well--lighter,
    .theme .theme--yellow .well--lighter {
      background-color: #fffae9; }
    .well--lighter.theme--gold,
    .theme--gold .well--lighter,
    .theme .theme--gold .well--lighter {
      background-color: #fdf4ea; }
    .well--lighter.theme--orange,
    .theme--orange .well--lighter,
    .theme .theme--orange .well--lighter {
      background-color: #fcf0eb; }
    .well--lighter.theme--salmon,
    .theme--salmon .well--lighter,
    .theme .theme--salmon .well--lighter {
      background-color: #fdf1ef; }
    .well--lighter.theme--red,
    .theme--red .well--lighter,
    .theme .theme--red .well--lighter {
      background-color: #fdeae7; }
    .well--lighter.theme--burgundy,
    .theme--burgundy .well--lighter,
    .theme .theme--burgundy .well--lighter {
      background-color: #f8e9ea; }
    .well--lighter.theme--purple,
    .theme--purple .well--lighter,
    .theme .theme--purple .well--lighter {
      background-color: #f5ebf2; }
    .well--lighter.theme--youth,
    .theme--youth .well--lighter,
    .theme .theme--youth .well--lighter {
      background-color: #fbf2e6; }
    .well--lighter.theme--digitalisation,
    .theme--digitalisation .well--lighter,
    .theme .theme--digitalisation .well--lighter {
      background-color: #f5ebe9; }
    .well--lighter.theme--climate,
    .theme--climate .well--lighter,
    .theme .theme--climate .well--lighter {
      background-color: #f0ecef; }
    .well--lighter.theme--gender,
    .theme--gender .well--lighter,
    .theme .theme--gender .well--lighter {
      background-color: #e6f0eb; }
    .well--lighter.theme--nutrition,
    .theme--nutrition .well--lighter,
    .theme .theme--nutrition .well--lighter {
      background-color: #edf2f2; }
    .well--lighter.theme--blog,
    .theme--blog .well--lighter,
    .theme .theme--blog .well--lighter {
      background-color: #fff6e6; }
    .well--lighter.theme--spore-blue,
    .theme--spore-blue .well--lighter,
    .theme .theme--spore-blue .well--lighter {
      background-color: #ecf0f7; }
    .well--lighter.theme--spore-brown,
    .theme--spore-brown .well--lighter,
    .theme .theme--spore-brown .well--lighter {
      background-color: #f1ede6; }
    .well--lighter.theme--spore-dark-blue,
    .theme--spore-dark-blue .well--lighter,
    .theme .theme--spore-dark-blue .well--lighter {
      background-color: #e6edf2; }
    .well--lighter.theme--spore-forest-green,
    .theme--spore-forest-green .well--lighter,
    .theme .theme--spore-forest-green .well--lighter {
      background-color: #eff2e7; }
    .well--lighter.theme--spore-grey-blue,
    .theme--spore-grey-blue .well--lighter,
    .theme .theme--spore-grey-blue .well--lighter {
      background-color: #f0f4f5; }
    .well--lighter.theme--spore-light-blue,
    .theme--spore-light-blue .well--lighter,
    .theme .theme--spore-light-blue .well--lighter {
      background-color: #f2f7fa; }
    .well--lighter.theme--spore-lime,
    .theme--spore-lime .well--lighter,
    .theme .theme--spore-lime .well--lighter {
      background-color: #f8f7e6; }
    .well--lighter.theme--spore-ochre,
    .theme--spore-ochre .well--lighter,
    .theme .theme--spore-ochre .well--lighter {
      background-color: #fbf5e9; }
    .well--lighter.theme--spore-olive-green,
    .theme--spore-olive-green .well--lighter,
    .theme .theme--spore-olive-green .well--lighter {
      background-color: #f1f4ec; }
    .well--lighter.theme--spore-red,
    .theme--spore-red .well--lighter,
    .theme .theme--spore-red .well--lighter {
      background-color: #feede9; }
    .well--lighter.theme--spore-taupe,
    .theme--spore-taupe .well--lighter,
    .theme .theme--spore-taupe .well--lighter {
      background-color: #f2f0f0; }
    .well--lighter.theme--spore-teal,
    .theme--spore-teal .well--lighter,
    .theme .theme--spore-teal .well--lighter {
      background-color: #e6f2f9; }
  .well--darker {
    background-color: #add299; }
    .well--darker.theme--dark,
    .theme--dark .well--darker,
    .theme .theme--dark .well--darker {
      background-color: #969696; }
    .well--darker.theme--green,
    .theme--green .well--darker,
    .theme .theme--green .well--darker {
      background-color: #add299; }
    .well--darker.theme--blue,
    .theme--blue .well--darker,
    .theme .theme--blue .well--darker {
      background-color: #a4dded; }
    .well--darker.theme--lime,
    .theme--lime .well--darker,
    .theme .theme--lime .well--darker {
      background-color: #dee892; }
    .well--darker.theme--yellow,
    .theme--yellow .well--darker,
    .theme .theme--yellow .well--darker {
      background-color: #fce587; }
    .well--darker.theme--gold,
    .theme--gold .well--darker,
    .theme .theme--gold .well--darker {
      background-color: #f4c58d; }
    .well--darker.theme--orange,
    .theme--orange .well--darker,
    .theme .theme--orange .well--darker {
      background-color: #efab92; }
    .well--darker.theme--salmon,
    .theme--salmon .well--darker,
    .theme .theme--salmon .well--darker {
      background-color: #f4b3a8; }
    .well--darker.theme--red,
    .theme--red .well--darker,
    .theme .theme--red .well--darker {
      background-color: #f58e7e; }
    .well--darker.theme--burgundy,
    .theme--burgundy .well--darker,
    .theme .theme--burgundy .well--darker {
      background-color: #da888c; }
    .well--darker.theme--purple,
    .theme--purple .well--darker,
    .theme .theme--purple .well--darker {
      background-color: #c991bb; }
    .well--darker.theme--youth,
    .theme--youth .well--darker,
    .theme .theme--youth .well--darker {
      background-color: #e8b675; }
    .well--darker.theme--digitalisation,
    .theme--digitalisation .well--darker,
    .theme .theme--digitalisation .well--darker {
      background-color: #c89189; }
    .well--darker.theme--climate,
    .theme--climate .well--darker,
    .theme .theme--climate .well--darker {
      background-color: #ae96a8; }
    .well--darker.theme--gender,
    .theme--gender .well--darker,
    .theme .theme--gender .well--darker {
      background-color: #77af94; }
    .well--darker.theme--nutrition,
    .theme--nutrition .well--darker,
    .theme .theme--nutrition .well--darker {
      background-color: #9cb7b8; }
    .well--darker.theme--blog,
    .theme--blog .well--darker,
    .theme .theme--blog .well--darker {
      background-color: #ffcd75; }
    .well--darker.theme--spore-blue,
    .theme--spore-blue .well--darker,
    .theme .theme--spore-blue .well--darker {
      background-color: #97add5; }
    .well--darker.theme--spore-brown,
    .theme--spore-brown .well--darker,
    .theme .theme--spore-brown .well--darker {
      background-color: #b69e77; }
    .well--darker.theme--spore-dark-blue,
    .theme--spore-dark-blue .well--darker,
    .theme .theme--spore-dark-blue .well--darker {
      background-color: #779fb9; }
    .well--darker.theme--spore-forest-green,
    .theme--spore-forest-green .well--darker,
    .theme .theme--spore-forest-green .well--darker {
      background-color: #a9bb7b; }
    .well--darker.theme--spore-grey-blue,
    .theme--spore-grey-blue .well--darker,
    .theme .theme--spore-grey-blue .well--darker {
      background-color: #b0c1cb; }
    .well--darker.theme--spore-light-blue,
    .theme--spore-light-blue .well--darker,
    .theme .theme--spore-light-blue .well--darker {
      background-color: #b7d2e5; }
    .well--darker.theme--spore-lime,
    .theme--spore-lime .well--darker,
    .theme .theme--spore-lime .well--darker {
      background-color: #dad377; }
    .well--darker.theme--spore-ochre,
    .theme--spore-ochre .well--darker,
    .theme .theme--spore-ochre .well--darker {
      background-color: #ecc688; }
    .well--darker.theme--spore-olive-green,
    .theme--spore-olive-green .well--darker,
    .theme .theme--spore-olive-green .well--darker {
      background-color: #b6c197; }
    .well--darker.theme--spore-red,
    .theme--spore-red .well--darker,
    .theme .theme--spore-red .well--darker {
      background-color: #fa9e88; }
    .well--darker.theme--spore-taupe,
    .theme--spore-taupe .well--darker,
    .theme .theme--spore-taupe .well--darker {
      background-color: #b8b0ac; }
    .well--darker.theme--spore-teal,
    .theme--spore-teal .well--darker,
    .theme .theme--spore-teal .well--darker {
      background-color: #79bade; }
  .well--darkest {
    background-color: #8bbf70; }
    .well--darkest.theme--dark,
    .theme--dark .well--darkest,
    .theme .theme--dark .well--darkest {
      background-color: #6c6c6c; }
    .well--darkest.theme--green,
    .theme--green .well--darkest,
    .theme .theme--green .well--darkest {
      background-color: #8bbf70; }
    .well--darkest.theme--blue,
    .theme--blue .well--darkest,
    .theme .theme--blue .well--darkest {
      background-color: #7fcfe5; }
    .well--darkest.theme--lime,
    .theme--lime .well--darkest,
    .theme .theme--lime .well--darkest {
      background-color: #d0de65; }
    .well--darkest.theme--yellow,
    .theme--yellow .well--darkest,
    .theme .theme--yellow .well--darkest {
      background-color: #fbdb56; }
    .well--darkest.theme--gold,
    .theme--gold .well--darkest,
    .theme .theme--gold .well--darkest {
      background-color: #f0ae5f; }
    .well--darkest.theme--orange,
    .theme--orange .well--darkest,
    .theme .theme--orange .well--darkest {
      background-color: #e98965; }
    .well--darkest.theme--salmon,
    .theme--salmon .well--darkest,
    .theme .theme--salmon .well--darkest {
      background-color: #f09584; }
    .well--darkest.theme--red,
    .theme--red .well--darkest,
    .theme .theme--red .well--darkest {
      background-color: #f15f49; }
    .well--darkest.theme--burgundy,
    .theme--burgundy .well--darkest,
    .theme .theme--burgundy .well--darkest {
      background-color: #cb575d; }
    .well--darkest.theme--purple,
    .theme--purple .well--darkest,
    .theme .theme--purple .well--darkest {
      background-color: #b3649f; }
    .well--darkest.theme--youth,
    .theme--youth .well--darkest,
    .theme .theme--youth .well--darkest {
      background-color: #df983d; }
    .well--darkest.theme--digitalisation,
    .theme--digitalisation .well--darkest,
    .theme .theme--digitalisation .well--darkest {
      background-color: #b26459; }
    .well--darkest.theme--climate,
    .theme--climate .well--darkest,
    .theme .theme--climate .well--darkest {
      background-color: #8d6b85; }
    .well--darkest.theme--gender,
    .theme--gender .well--darkest,
    .theme .theme--gender .well--darkest {
      background-color: #408e68; }
    .well--darkest.theme--nutrition,
    .theme--nutrition .well--darkest,
    .theme .theme--nutrition .well--darkest {
      background-color: #749a9b; }
    .well--darkest.theme--blog,
    .theme--blog .well--darkest,
    .theme .theme--blog .well--darkest {
      background-color: #ffb93d; }
    .well--darkest.theme--spore-blue,
    .theme--spore-blue .well--darkest,
    .theme .theme--spore-blue .well--darkest {
      background-color: #6d8cc4; }
    .well--darkest.theme--spore-brown,
    .theme--spore-brown .well--darkest,
    .theme .theme--spore-brown .well--darkest {
      background-color: #987640; }
    .well--darkest.theme--spore-dark-blue,
    .theme--spore-dark-blue .well--darkest,
    .theme .theme--spore-dark-blue .well--darkest {
      background-color: #40789d; }
    .well--darkest.theme--spore-forest-green,
    .theme--spore-forest-green .well--darkest,
    .theme .theme--spore-forest-green .well--darkest {
      background-color: #859f45; }
    .well--darkest.theme--spore-grey-blue,
    .theme--spore-grey-blue .well--darkest,
    .theme .theme--spore-grey-blue .well--darkest {
      background-color: #90a8b6; }
    .well--darkest.theme--spore-light-blue,
    .theme--spore-light-blue .well--darkest,
    .theme .theme--spore-light-blue .well--darkest {
      background-color: #99c0db; }
    .well--darkest.theme--spore-lime,
    .theme--spore-lime .well--darkest,
    .theme .theme--spore-lime .well--darkest {
      background-color: #cbc13f; }
    .well--darkest.theme--spore-ochre,
    .theme--spore-ochre .well--darkest,
    .theme .theme--spore-ochre .well--darkest {
      background-color: #e4af58; }
    .well--darkest.theme--spore-olive-green,
    .theme--spore-olive-green .well--darkest,
    .theme .theme--spore-olive-green .well--darkest {
      background-color: #98a86c; }
    .well--darkest.theme--spore-red,
    .theme--spore-red .well--darkest,
    .theme .theme--spore-red .well--darkest {
      background-color: #f77758; }
    .well--darkest.theme--spore-taupe,
    .theme--spore-taupe .well--darkest,
    .theme .theme--spore-taupe .well--darkest {
      background-color: #9b908a; }
    .well--darkest.theme--spore-teal,
    .theme--spore-teal .well--darkest,
    .theme .theme--spore-teal .well--darkest {
      background-color: #439ed0; }
  .well--full {
    background-color: #67ab43;
    color: #fff;
    -webkit-font-smoothing: antialiased;
    /* 1 */
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased; }
    .well--full.theme--dark,
    .theme--dark .well--full,
    .theme .theme--dark .well--full {
      background-color: #3d3d3d; }
    .well--full.theme--green,
    .theme--green .well--full,
    .theme .theme--green .well--full {
      background-color: #67ab43; }
    .well--full.theme--blue,
    .theme--blue .well--full,
    .theme .theme--blue .well--full {
      background-color: #56c0dd; }
    .well--full.theme--lime,
    .theme--lime .well--full,
    .theme .theme--lime .well--full {
      background-color: #c1d435; }
    .well--full.theme--yellow,
    .theme--yellow .well--full,
    .theme .theme--yellow .well--full {
      background-color: #facf21; }
    .well--full.theme--gold,
    .theme--gold .well--full,
    .theme .theme--gold .well--full {
      background-color: #eb942c; }
    .well--full.theme--orange,
    .theme--orange .well--full,
    .theme .theme--orange .well--full {
      background-color: #e26435; }
    .well--full.theme--salmon,
    .theme--salmon .well--full,
    .theme .theme--salmon .well--full {
      background-color: #eb735d; }
    .well--full.theme--red,
    .theme--red .well--full,
    .theme .theme--red .well--full {
      background-color: #ec2d10; }
    .well--full.theme--burgundy,
    .theme--burgundy .well--full,
    .theme .theme--burgundy .well--full {
      background-color: #ba222a; }
    .well--full.theme--purple,
    .theme--purple .well--full,
    .theme .theme--purple .well--full {
      background-color: #9b3381; }
    .well--full.theme--youth,
    .theme--youth .well--full,
    .theme .theme--youth .well--full {
      background-color: #d57800; }
    .well--full.theme--digitalisation,
    .theme--digitalisation .well--full,
    .theme .theme--digitalisation .well--full {
      background-color: #9a3324; }
    .well--full.theme--climate,
    .theme--climate .well--full,
    .theme .theme--climate .well--full {
      background-color: #693c5e; }
    .well--full.theme--gender,
    .theme--gender .well--full,
    .theme .theme--gender .well--full {
      background-color: #046a38; }
    .well--full.theme--nutrition,
    .theme--nutrition .well--full,
    .theme .theme--nutrition .well--full {
      background-color: #487a7b; }
    .well--full.theme--blog,
    .theme--blog .well--full,
    .theme .theme--blog .well--full {
      background-color: #ffa300; }
    .well--full.theme--spore-blue,
    .theme--spore-blue .well--full,
    .theme .theme--spore-blue .well--full {
      background-color: #3f68b1; }
    .well--full.theme--spore-brown,
    .theme--spore-brown .well--full,
    .theme .theme--spore-brown .well--full {
      background-color: #774b04; }
    .well--full.theme--spore-dark-blue,
    .theme--spore-dark-blue .well--full,
    .theme .theme--spore-dark-blue .well--full {
      background-color: #044e7e; }
    .well--full.theme--spore-forest-green,
    .theme--spore-forest-green .well--full,
    .theme .theme--spore-forest-green .well--full {
      background-color: #5f810a; }
    .well--full.theme--spore-grey-blue,
    .theme--spore-grey-blue .well--full,
    .theme .theme--spore-grey-blue .well--full {
      background-color: #6d8c9f; }
    .well--full.theme--spore-light-blue,
    .theme--spore-light-blue .well--full,
    .theme .theme--spore-light-blue .well--full {
      background-color: #79accf; }
    .well--full.theme--spore-lime,
    .theme--spore-lime .well--full,
    .theme .theme--spore-lime .well--full {
      background-color: #bbae03; }
    .well--full.theme--spore-ochre,
    .theme--spore-ochre .well--full,
    .theme .theme--spore-ochre .well--full {
      background-color: #db9623; }
    .well--full.theme--spore-olive-green,
    .theme--spore-olive-green .well--full,
    .theme .theme--spore-olive-green .well--full {
      background-color: #778d3e; }
    .well--full.theme--spore-red,
    .theme--spore-red .well--full,
    .theme .theme--spore-red .well--full {
      background-color: #f54c23; }
    .well--full.theme--spore-taupe,
    .theme--spore-taupe .well--full,
    .theme .theme--spore-taupe .well--full {
      background-color: #7b6d65; }
    .well--full.theme--spore-teal,
    .theme--spore-teal .well--full,
    .theme .theme--spore-teal .well--full {
      background-color: #077fc1; }
    .well--full::after {
      color: #67ab43; }
      .well--full::after.theme--dark,
      .theme--dark .well--full::after,
      .theme .theme.theme--dark .well--full::after {
        color: #3d3d3d; }
      .well--full::after.theme--green,
      .theme--green .well--full::after,
      .theme .theme.theme--green .well--full::after {
        color: #67ab43; }
      .well--full::after.theme--blue,
      .theme--blue .well--full::after,
      .theme .theme.theme--blue .well--full::after {
        color: #56c0dd; }
      .well--full::after.theme--lime,
      .theme--lime .well--full::after,
      .theme .theme.theme--lime .well--full::after {
        color: #c1d435; }
      .well--full::after.theme--yellow,
      .theme--yellow .well--full::after,
      .theme .theme.theme--yellow .well--full::after {
        color: #facf21; }
      .well--full::after.theme--gold,
      .theme--gold .well--full::after,
      .theme .theme.theme--gold .well--full::after {
        color: #eb942c; }
      .well--full::after.theme--orange,
      .theme--orange .well--full::after,
      .theme .theme.theme--orange .well--full::after {
        color: #e26435; }
      .well--full::after.theme--salmon,
      .theme--salmon .well--full::after,
      .theme .theme.theme--salmon .well--full::after {
        color: #eb735d; }
      .well--full::after.theme--red,
      .theme--red .well--full::after,
      .theme .theme.theme--red .well--full::after {
        color: #ec2d10; }
      .well--full::after.theme--burgundy,
      .theme--burgundy .well--full::after,
      .theme .theme.theme--burgundy .well--full::after {
        color: #ba222a; }
      .well--full::after.theme--purple,
      .theme--purple .well--full::after,
      .theme .theme.theme--purple .well--full::after {
        color: #9b3381; }
      .well--full::after.theme--youth,
      .theme--youth .well--full::after,
      .theme .theme.theme--youth .well--full::after {
        color: #d57800; }
      .well--full::after.theme--digitalisation,
      .theme--digitalisation .well--full::after,
      .theme .theme.theme--digitalisation .well--full::after {
        color: #9a3324; }
      .well--full::after.theme--climate,
      .theme--climate .well--full::after,
      .theme .theme.theme--climate .well--full::after {
        color: #693c5e; }
      .well--full::after.theme--gender,
      .theme--gender .well--full::after,
      .theme .theme.theme--gender .well--full::after {
        color: #046a38; }
      .well--full::after.theme--nutrition,
      .theme--nutrition .well--full::after,
      .theme .theme.theme--nutrition .well--full::after {
        color: #487a7b; }
      .well--full::after.theme--blog,
      .theme--blog .well--full::after,
      .theme .theme.theme--blog .well--full::after {
        color: #ffa300; }
      .well--full::after.theme--spore-blue,
      .theme--spore-blue .well--full::after,
      .theme .theme.theme--spore-blue .well--full::after {
        color: #3f68b1; }
      .well--full::after.theme--spore-brown,
      .theme--spore-brown .well--full::after,
      .theme .theme.theme--spore-brown .well--full::after {
        color: #774b04; }
      .well--full::after.theme--spore-dark-blue,
      .theme--spore-dark-blue .well--full::after,
      .theme .theme.theme--spore-dark-blue .well--full::after {
        color: #044e7e; }
      .well--full::after.theme--spore-forest-green,
      .theme--spore-forest-green .well--full::after,
      .theme .theme.theme--spore-forest-green .well--full::after {
        color: #5f810a; }
      .well--full::after.theme--spore-grey-blue,
      .theme--spore-grey-blue .well--full::after,
      .theme .theme.theme--spore-grey-blue .well--full::after {
        color: #6d8c9f; }
      .well--full::after.theme--spore-light-blue,
      .theme--spore-light-blue .well--full::after,
      .theme .theme.theme--spore-light-blue .well--full::after {
        color: #79accf; }
      .well--full::after.theme--spore-lime,
      .theme--spore-lime .well--full::after,
      .theme .theme.theme--spore-lime .well--full::after {
        color: #bbae03; }
      .well--full::after.theme--spore-ochre,
      .theme--spore-ochre .well--full::after,
      .theme .theme.theme--spore-ochre .well--full::after {
        color: #db9623; }
      .well--full::after.theme--spore-olive-green,
      .theme--spore-olive-green .well--full::after,
      .theme .theme.theme--spore-olive-green .well--full::after {
        color: #778d3e; }
      .well--full::after.theme--spore-red,
      .theme--spore-red .well--full::after,
      .theme .theme.theme--spore-red .well--full::after {
        color: #f54c23; }
      .well--full::after.theme--spore-taupe,
      .theme--spore-taupe .well--full::after,
      .theme .theme.theme--spore-taupe .well--full::after {
        color: #7b6d65; }
      .well--full::after.theme--spore-teal,
      .theme--spore-teal .well--full::after,
      .theme .theme.theme--spore-teal .well--full::after {
        color: #077fc1; }
  .well--full::after {
    color: #67ab43; }
    .well--full::after.theme--dark,
    .theme--dark .well--full::after,
    .theme .theme.theme--dark .well--full::after {
      color: #3d3d3d; }
    .well--full::after.theme--green,
    .theme--green .well--full::after,
    .theme .theme.theme--green .well--full::after {
      color: #67ab43; }
    .well--full::after.theme--blue,
    .theme--blue .well--full::after,
    .theme .theme.theme--blue .well--full::after {
      color: #56c0dd; }
    .well--full::after.theme--lime,
    .theme--lime .well--full::after,
    .theme .theme.theme--lime .well--full::after {
      color: #c1d435; }
    .well--full::after.theme--yellow,
    .theme--yellow .well--full::after,
    .theme .theme.theme--yellow .well--full::after {
      color: #facf21; }
    .well--full::after.theme--gold,
    .theme--gold .well--full::after,
    .theme .theme.theme--gold .well--full::after {
      color: #eb942c; }
    .well--full::after.theme--orange,
    .theme--orange .well--full::after,
    .theme .theme.theme--orange .well--full::after {
      color: #e26435; }
    .well--full::after.theme--salmon,
    .theme--salmon .well--full::after,
    .theme .theme.theme--salmon .well--full::after {
      color: #eb735d; }
    .well--full::after.theme--red,
    .theme--red .well--full::after,
    .theme .theme.theme--red .well--full::after {
      color: #ec2d10; }
    .well--full::after.theme--burgundy,
    .theme--burgundy .well--full::after,
    .theme .theme.theme--burgundy .well--full::after {
      color: #ba222a; }
    .well--full::after.theme--purple,
    .theme--purple .well--full::after,
    .theme .theme.theme--purple .well--full::after {
      color: #9b3381; }
    .well--full::after.theme--youth,
    .theme--youth .well--full::after,
    .theme .theme.theme--youth .well--full::after {
      color: #d57800; }
    .well--full::after.theme--digitalisation,
    .theme--digitalisation .well--full::after,
    .theme .theme.theme--digitalisation .well--full::after {
      color: #9a3324; }
    .well--full::after.theme--climate,
    .theme--climate .well--full::after,
    .theme .theme.theme--climate .well--full::after {
      color: #693c5e; }
    .well--full::after.theme--gender,
    .theme--gender .well--full::after,
    .theme .theme.theme--gender .well--full::after {
      color: #046a38; }
    .well--full::after.theme--nutrition,
    .theme--nutrition .well--full::after,
    .theme .theme.theme--nutrition .well--full::after {
      color: #487a7b; }
    .well--full::after.theme--blog,
    .theme--blog .well--full::after,
    .theme .theme.theme--blog .well--full::after {
      color: #ffa300; }
    .well--full::after.theme--spore-blue,
    .theme--spore-blue .well--full::after,
    .theme .theme.theme--spore-blue .well--full::after {
      color: #3f68b1; }
    .well--full::after.theme--spore-brown,
    .theme--spore-brown .well--full::after,
    .theme .theme.theme--spore-brown .well--full::after {
      color: #774b04; }
    .well--full::after.theme--spore-dark-blue,
    .theme--spore-dark-blue .well--full::after,
    .theme .theme.theme--spore-dark-blue .well--full::after {
      color: #044e7e; }
    .well--full::after.theme--spore-forest-green,
    .theme--spore-forest-green .well--full::after,
    .theme .theme.theme--spore-forest-green .well--full::after {
      color: #5f810a; }
    .well--full::after.theme--spore-grey-blue,
    .theme--spore-grey-blue .well--full::after,
    .theme .theme.theme--spore-grey-blue .well--full::after {
      color: #6d8c9f; }
    .well--full::after.theme--spore-light-blue,
    .theme--spore-light-blue .well--full::after,
    .theme .theme.theme--spore-light-blue .well--full::after {
      color: #79accf; }
    .well--full::after.theme--spore-lime,
    .theme--spore-lime .well--full::after,
    .theme .theme.theme--spore-lime .well--full::after {
      color: #bbae03; }
    .well--full::after.theme--spore-ochre,
    .theme--spore-ochre .well--full::after,
    .theme .theme.theme--spore-ochre .well--full::after {
      color: #db9623; }
    .well--full::after.theme--spore-olive-green,
    .theme--spore-olive-green .well--full::after,
    .theme .theme.theme--spore-olive-green .well--full::after {
      color: #778d3e; }
    .well--full::after.theme--spore-red,
    .theme--spore-red .well--full::after,
    .theme .theme.theme--spore-red .well--full::after {
      color: #f54c23; }
    .well--full::after.theme--spore-taupe,
    .theme--spore-taupe .well--full::after,
    .theme .theme.theme--spore-taupe .well--full::after {
      color: #7b6d65; }
    .well--full::after.theme--spore-teal,
    .theme--spore-teal .well--full::after,
    .theme .theme.theme--spore-teal .well--full::after {
      color: #077fc1; }
  .theme .well--neutral, .well--neutral {
    background-color: whitesmoke; }

/* 3.14 Tag */
/*
Tag

.tag - Tag
.tag:hover - Tag with hover state

markup:
<a class="{$modifiers}" href="javascript:void();">UAV</a>

Styleguide 3.14
*/
.tag {
  display: inline-block;
  background: #cdcdcd;
  padding: 6px;
  font-size: 0.5625em;
  line-height: 0.66667;
  font-weight: 600;
  font-style: normal;
  text-decoration: none; }
  .tag,
  .theme--blue .tag,
  .theme--lime .tag,
  .theme--yellow .tag,
  .theme--gold .tag,
  .theme--orange .tag,
  .theme--salmon .tag,
  .theme--red .tag,
  .theme--burgundy .tag,
  .theme--purple .tag {
    color: inherit; }
  .tag:hover {
    background-color: #67ab43;
    color: #fff; }
    .theme--blue .tag:hover {
      background-color: #56c0dd; }
    .theme--lime .tag:hover {
      background-color: #c1d435; }
    .theme--yellow .tag:hover {
      background-color: #facf21; }
    .theme--gold .tag:hover {
      background-color: #eb942c; }
    .theme--orange .tag:hover {
      background-color: #e26435; }
    .theme--salmon .tag:hover {
      background-color: #eb735d; }
    .theme--red .tag:hover {
      background-color: #ec2d10; }
    .theme--burgundy .tag:hover {
      background-color: #ba222a; }
    .theme--purple .tag:hover {
      background-color: #9b3381; }

/*
Tag List

.tag-list - Tag List

markup:
<ul class="{$modifiers} reset list--inline">
  <li><a class="tag" href="javascript:void();">GIS</a></li>
  <li><a class="tag" href="javascript:void();">GPS</a></li>
  <li><a class="tag" href="javascript:void();">Hardware</a></li>
  <li><a class="tag" href="javascript:void();">Internet</a></li>
  <li><a class="tag" href="javascript:void();">Measuring</a></li>
  <li><a class="tag" href="javascript:void();">Monitoring</a></li>
  <li><a class="tag" href="javascript:void();">Radio</a></li>
  <li><a class="tag" href="javascript:void();">Software</a></li>
  <li><a class="tag" href="javascript:void();">Telephony</a></li>
  <li><a class="tag" href="javascript:void();">TV & Video</a></li>
</ul>

Styleguide 3.14.1
*/
/* 3.15 Image */
/*
Image

.image - image
.image--stretch - Stretched image

markup:
<figure data-copyright="&copy; Copyright">
	<img class="{$modifiers}" src="https://images.unsplash.com/photo-1475570978644-983eef8b4f72?dpr=1&auto=format&crop=entropy&fit=crop&w=400&h=300&q=80&cs=tinysrgb" alt="Placeholder image"/>
</figure>

Styleguide 3.15
*/
.image {
  display: block; }
  .image--stretch {
    min-width: 100%;
    height: auto; }
    .slideshow .image--stretch {
      min-width: auto; }

.layout__cell--aside .details-image {
  width: 100%; }

[data-copyright] {
  position: relative; }
  [data-copyright] img {
    display: block; }
  [data-copyright]:after {
    content: attr(data-copyright);
    position: absolute;
    left: -999em;
    bottom: 0;
    display: block;
    padding: 6px;
    background: rgba(0, 0, 0, 0.54);
    color: #fff;
    font-size: 10px;
    line-height: 1; }

@media only screen and (min-width: 32.5em) {
  [data-copyright]:after {
    left: 0; }
  .gutters[data-copyright]:after {
    left: 15px; } }

/* 3.17 Brand */
/*
Brand

The masthead brand

.brand--cta - CTA brand
.brand--cta.brand--extension - Increased size

markup:
<figure class="{$modifiers}">
  <figcaption class="is-narrative">CTA Homepage</figcaption>
</figure>

Styleguide 3.17
*/
.brand {
  display: block;
  max-height: 100%; }
  .brand--cta {
    margin-left: -17px;
    margin-right: -17px;
    background-image: url("data:image/svg+xml;charset=utf8, %3Csvg width='78px' height='78px' viewBox='0 0 156 156' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' d='M33 79.094V123h90V33H33v14.31c-.06.006-.118.01-.176.017C32.827 47.32 24 49 14 45c0 2-.076 20 10.914 29.56 2.957 2.76 5.66 4.084 8.086 4.534z'/%3E%3Cmask id='b' width='115' height='96' x='-3' y='-3'%3E%3Cpath fill='%23fff' d='M11 30h115v96H11z'/%3E%3Cuse xlink:href='%23a'/%3E%3C/mask%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cuse fill='%23fff' xlink:href='%23a'/%3E%3Cuse stroke='%23fff' stroke-width='3px' mask='url(%23b)' xlink:href='%23a'/%3E%3Cpath fill='%237BB010' d='M33 33h90v90H33z'/%3E%3Cpath fill='%2300662F' d='M94.433 45.664s-3.732-.356-5.75-.356c-5.358 0-15.434.828-22.68 6.377C56.895 58.66 54.86 68.662 53.765 74.04c-.18.89-1.236 3.552-1.58 4.015-.27.34-.54.706-.793 1.073-2.772 4.046-4.35 9.347-4.723 15.798-.15 2.04-.15 4.274.01 6.654.24 3.784.73 6.388.84 6.93.99 5.845 2.58 11.867 3.47 14.488h12.03c-.52-1.166-5.62-13.61-7.07-21.045-1.22-6.24-.76-10.746 1.6-15.533 1.75-2.672 4.17-3.397 5.47-3.59 1.09-.163 2.43-.214 3.86-.267 5.34-.203 11.98-.455 17-6.34C94.4 63.898 94.44 48.393 94.434 47.74l-.01-2.076z'/%3E%3Cpath fill='%23fff' d='M53.696 103.483c-1.467-7.755-.478-12.706 1.837-17.51 1.876-3.03 4.612-4.42 6.994-4.788 5.178-.8 13.653.86 19.3-5.97 9.95-12.037 9.88-27.485 9.88-27.485s-15.125-1.597-24.62 5.903c-10.77 8.508-10.79 22.11-12.063 24.61-.318.627-.733 1.234-1.177 1.855-.253.326-.494.663-.724 1.006-2.898 4.365-3.982 9.903-4.265 14.92-.135 1.927-.136 4.056.02 6.435.256 4.09.796 6.79.796 6.79 1.07 6.5 2.697 11.53 3.45 13.74H60c-1.353-3.26-5.013-12.69-6.304-19.52z'/%3E%3Cpath fill='%2300662F' d='M70.04 65.224c-3.573 4.074-4.23 6.416-4.23 6.416s-1.418 2.39-2.26.896c-.956-1.698.46-5.564 5.803-10.21 5.785-5.033 12.633-7.5 12.633-7.5S75.078 59.48 70.04 65.224z'/%3E%3Cpath fill='%23fff' d='M81.335 113.673c-1.528.374-3.227.806-5.96.806-5.36 0-11.552-2.72-11.552-10.33 0-7.01 4.9-10.5 11.522-10.5 2.044 0 4.032.46 5.96 1.04l-.432 4.35c-1.727-.95-3.397-1.42-5.24-1.42-3.8 0-6.28 2.77-6.28 6.52 0 3.95 2.795 6.34 6.71 6.34 1.757 0 3.544-.466 5.013-1.04l.26 4.212zm5.9-15.696h-4.952v-3.98H97.55v3.98h-4.955v16.156h-5.36V97.977zm21.26-3.98h-6.568l-7.633 20.136h5.443l1.585-4.3h7.548l1.497 4.3h5.877l-7.748-20.135zm-5.933 12.03l2.592-7.876h.058l2.39 7.88h-5.04z'/%3E%3Cpath fill='%2300662F' d='M54.1 70.183c-.594-1.314-1.115-3.538-1.115-3.538-.475-2.443-1.392-6.246-2.978-9.677-.41-1.214-1.23-2.616-2.348-3.966-.35-.44-.71-.86-1.09-1.24-2.19-2.142-5.11-3.97-8.31-4.32-2.33-.26-4.02-.25-5.45-.115C32.82 47.32 24 49 14 45c0 2-.076 20 10.914 29.56 3.634 3.39 6.884 4.615 9.708 4.713 3.024.53 6.553.35 10.456-1.258-.004.007 4.534-1.642 6.643-.524.45.43.88.9 1.26 1.43 1.85 2.2 2.68 4.34 2.27 7.45-.37 2.85-1.23 5.38-2.06 8.58l2.76 11.59c1.96-3.8 3.71-8 4.75-12.31 1.29-5.36 1.65-9.54.14-14.19-.78-2.426-6.34-9.43-6.72-9.837zm-6.356 38.998C45.256 114.47 41.108 120.85 40 123h13c-.367-1.47-5.256-13.82-5.256-13.82z'/%3E%3Cpath fill='%23fff' d='M44.924 68.104c-1.742.47-7.812-.54-11.653-2.412C23.03 60.698 20 55 20 55s6.902 5.727 13.385 7.615c6.48 1.89 10.74 2.437 11.362 2.493.622.058 1.255.182 1.617.582.702.767.057 2.008-1.44 2.414z'/%3E%3C/g%3E%3C/svg%3E");
    height: 78px;
    width: 78px; }
    @media only screen and (min-width: 64em) {
      .brand--cta {
        margin-left: -33px;
        margin-right: -33px;
        background-image: url("data:image/svg+xml;charset=utf8, %3Csvg width='156px' height='156px' viewBox='0 0 156 156' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' d='M33 79.094V123h90V33H33v14.31c-.06.006-.118.01-.176.017C32.827 47.32 24 49 14 45c0 2-.076 20 10.914 29.56 2.957 2.76 5.66 4.084 8.086 4.534z'/%3E%3Cmask id='b' width='115' height='96' x='-3' y='-3'%3E%3Cpath fill='%23fff' d='M11 30h115v96H11z'/%3E%3Cuse xlink:href='%23a'/%3E%3C/mask%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cuse fill='%23fff' xlink:href='%23a'/%3E%3Cuse stroke='%23fff' stroke-width='6px' mask='url(%23b)' xlink:href='%23a'/%3E%3Cpath fill='%237BB010' d='M33 33h90v90H33z'/%3E%3Cpath fill='%2300662F' d='M94.433 45.664s-3.732-.356-5.75-.356c-5.358 0-15.434.828-22.68 6.377C56.895 58.66 54.86 68.662 53.765 74.04c-.18.89-1.236 3.552-1.58 4.015-.27.34-.54.706-.793 1.073-2.772 4.046-4.35 9.347-4.723 15.798-.15 2.04-.15 4.274.01 6.654.24 3.784.73 6.388.84 6.93.99 5.845 2.58 11.867 3.47 14.488h12.03c-.52-1.166-5.62-13.61-7.07-21.045-1.22-6.24-.76-10.746 1.6-15.533 1.75-2.672 4.17-3.397 5.47-3.59 1.09-.163 2.43-.214 3.86-.267 5.34-.203 11.98-.455 17-6.34C94.4 63.898 94.44 48.393 94.434 47.74l-.01-2.076z'/%3E%3Cpath fill='%23fff' d='M53.696 103.483c-1.467-7.755-.478-12.706 1.837-17.51 1.876-3.03 4.612-4.42 6.994-4.788 5.178-.8 13.653.86 19.3-5.97 9.95-12.037 9.88-27.485 9.88-27.485s-15.125-1.597-24.62 5.903c-10.77 8.508-10.79 22.11-12.063 24.61-.318.627-.733 1.234-1.177 1.855-.253.326-.494.663-.724 1.006-2.898 4.365-3.982 9.903-4.265 14.92-.135 1.927-.136 4.056.02 6.435.256 4.09.796 6.79.796 6.79 1.07 6.5 2.697 11.53 3.45 13.74H60c-1.353-3.26-5.013-12.69-6.304-19.52z'/%3E%3Cpath fill='%2300662F' d='M70.04 65.224c-3.573 4.074-4.23 6.416-4.23 6.416s-1.418 2.39-2.26.896c-.956-1.698.46-5.564 5.803-10.21 5.785-5.033 12.633-7.5 12.633-7.5S75.078 59.48 70.04 65.224z'/%3E%3Cpath fill='%23fff' d='M81.335 113.673c-1.528.374-3.227.806-5.96.806-5.36 0-11.552-2.72-11.552-10.33 0-7.01 4.9-10.5 11.522-10.5 2.044 0 4.032.46 5.96 1.04l-.432 4.35c-1.727-.95-3.397-1.42-5.24-1.42-3.8 0-6.28 2.77-6.28 6.52 0 3.95 2.795 6.34 6.71 6.34 1.757 0 3.544-.466 5.013-1.04l.26 4.212zm5.9-15.696h-4.952v-3.98H97.55v3.98h-4.955v16.156h-5.36V97.977zm21.26-3.98h-6.568l-7.633 20.136h5.443l1.585-4.3h7.548l1.497 4.3h5.877l-7.748-20.135zm-5.933 12.03l2.592-7.876h.058l2.39 7.88h-5.04z'/%3E%3Cpath fill='%2300662F' d='M54.1 70.183c-.594-1.314-1.115-3.538-1.115-3.538-.475-2.443-1.392-6.246-2.978-9.677-.41-1.214-1.23-2.616-2.348-3.966-.35-.44-.71-.86-1.09-1.24-2.19-2.142-5.11-3.97-8.31-4.32-2.33-.26-4.02-.25-5.45-.115C32.82 47.32 24 49 14 45c0 2-.076 20 10.914 29.56 3.634 3.39 6.884 4.615 9.708 4.713 3.024.53 6.553.35 10.456-1.258-.004.007 4.534-1.642 6.643-.524.45.43.88.9 1.26 1.43 1.85 2.2 2.68 4.34 2.27 7.45-.37 2.85-1.23 5.38-2.06 8.58l2.76 11.59c1.96-3.8 3.71-8 4.75-12.31 1.29-5.36 1.65-9.54.14-14.19-.78-2.426-6.34-9.43-6.72-9.837zm-6.356 38.998C45.256 114.47 41.108 120.85 40 123h13c-.367-1.47-5.256-13.82-5.256-13.82z'/%3E%3Cpath fill='%23fff' d='M44.924 68.104c-1.742.47-7.812-.54-11.653-2.412C23.03 60.698 20 55 20 55s6.902 5.727 13.385 7.615c6.48 1.89 10.74 2.437 11.362 2.493.622.058 1.255.182 1.617.582.702.767.057 2.008-1.44 2.414z'/%3E%3C/g%3E%3C/svg%3E");
        height: 156px;
        width: 156px; } }
  .brand--extension {
    height: 78px;
    position: relative;
    top: 24px; }
    @media only screen and (min-width: 64em) {
      .brand--extension {
        height: 156px;
        top: 48px; } }
  .brand--spore {
    background-color: #67ab43;
    background-color: #67ab43; }
    .brand--spore.theme--dark,
    .theme--dark .brand--spore,
    .theme .theme--dark .brand--spore {
      background-color: #3d3d3d;
      background-color: #3d3d3d; }
    .brand--spore.theme--green,
    .theme--green .brand--spore,
    .theme .theme--green .brand--spore {
      background-color: #67ab43;
      background-color: #67ab43; }
    .brand--spore.theme--blue,
    .theme--blue .brand--spore,
    .theme .theme--blue .brand--spore {
      background-color: #56c0dd;
      background-color: #56c0dd; }
    .brand--spore.theme--lime,
    .theme--lime .brand--spore,
    .theme .theme--lime .brand--spore {
      background-color: #c1d435;
      background-color: #c1d435; }
    .brand--spore.theme--yellow,
    .theme--yellow .brand--spore,
    .theme .theme--yellow .brand--spore {
      background-color: #facf21;
      background-color: #facf21; }
    .brand--spore.theme--gold,
    .theme--gold .brand--spore,
    .theme .theme--gold .brand--spore {
      background-color: #eb942c;
      background-color: #eb942c; }
    .brand--spore.theme--orange,
    .theme--orange .brand--spore,
    .theme .theme--orange .brand--spore {
      background-color: #e26435;
      background-color: #e26435; }
    .brand--spore.theme--salmon,
    .theme--salmon .brand--spore,
    .theme .theme--salmon .brand--spore {
      background-color: #eb735d;
      background-color: #eb735d; }
    .brand--spore.theme--red,
    .theme--red .brand--spore,
    .theme .theme--red .brand--spore {
      background-color: #ec2d10;
      background-color: #ec2d10; }
    .brand--spore.theme--burgundy,
    .theme--burgundy .brand--spore,
    .theme .theme--burgundy .brand--spore {
      background-color: #ba222a;
      background-color: #ba222a; }
    .brand--spore.theme--purple,
    .theme--purple .brand--spore,
    .theme .theme--purple .brand--spore {
      background-color: #9b3381;
      background-color: #9b3381; }
    .brand--spore.theme--youth,
    .theme--youth .brand--spore,
    .theme .theme--youth .brand--spore {
      background-color: #d57800;
      background-color: #d57800; }
    .brand--spore.theme--digitalisation,
    .theme--digitalisation .brand--spore,
    .theme .theme--digitalisation .brand--spore {
      background-color: #9a3324;
      background-color: #9a3324; }
    .brand--spore.theme--climate,
    .theme--climate .brand--spore,
    .theme .theme--climate .brand--spore {
      background-color: #693c5e;
      background-color: #693c5e; }
    .brand--spore.theme--gender,
    .theme--gender .brand--spore,
    .theme .theme--gender .brand--spore {
      background-color: #046a38;
      background-color: #046a38; }
    .brand--spore.theme--nutrition,
    .theme--nutrition .brand--spore,
    .theme .theme--nutrition .brand--spore {
      background-color: #487a7b;
      background-color: #487a7b; }
    .brand--spore.theme--blog,
    .theme--blog .brand--spore,
    .theme .theme--blog .brand--spore {
      background-color: #FFA300;
      background-color: #ffa300; }
    .brand--spore.theme--spore-blue,
    .theme--spore-blue .brand--spore,
    .theme .theme--spore-blue .brand--spore {
      background-color: #3f68b1;
      background-color: #3f68b1; }
    .brand--spore.theme--spore-brown,
    .theme--spore-brown .brand--spore,
    .theme .theme--spore-brown .brand--spore {
      background-color: #774b04;
      background-color: #774b04; }
    .brand--spore.theme--spore-dark-blue,
    .theme--spore-dark-blue .brand--spore,
    .theme .theme--spore-dark-blue .brand--spore {
      background-color: #044e7e;
      background-color: #044e7e; }
    .brand--spore.theme--spore-forest-green,
    .theme--spore-forest-green .brand--spore,
    .theme .theme--spore-forest-green .brand--spore {
      background-color: #5f810a;
      background-color: #5f810a; }
    .brand--spore.theme--spore-grey-blue,
    .theme--spore-grey-blue .brand--spore,
    .theme .theme--spore-grey-blue .brand--spore {
      background-color: #6d8c9f;
      background-color: #6d8c9f; }
    .brand--spore.theme--spore-light-blue,
    .theme--spore-light-blue .brand--spore,
    .theme .theme--spore-light-blue .brand--spore {
      background-color: #79accf;
      background-color: #79accf; }
    .brand--spore.theme--spore-lime,
    .theme--spore-lime .brand--spore,
    .theme .theme--spore-lime .brand--spore {
      background-color: #bbae03;
      background-color: #bbae03; }
    .brand--spore.theme--spore-ochre,
    .theme--spore-ochre .brand--spore,
    .theme .theme--spore-ochre .brand--spore {
      background-color: #db9623;
      background-color: #db9623; }
    .brand--spore.theme--spore-olive-green,
    .theme--spore-olive-green .brand--spore,
    .theme .theme--spore-olive-green .brand--spore {
      background-color: #778d3e;
      background-color: #778d3e; }
    .brand--spore.theme--spore-red,
    .theme--spore-red .brand--spore,
    .theme .theme--spore-red .brand--spore {
      background-color: #f54c23;
      background-color: #f54c23; }
    .brand--spore.theme--spore-taupe,
    .theme--spore-taupe .brand--spore,
    .theme .theme--spore-taupe .brand--spore {
      background-color: #7b6d65;
      background-color: #7b6d65; }
    .brand--spore.theme--spore-teal,
    .theme--spore-teal .brand--spore,
    .theme .theme--spore-teal .brand--spore {
      background-color: #077fc1;
      background-color: #077fc1; }

/* 3.18 Divider */
/*
Divider

1px border to one side of a container

.divider - Border to all sides
.divider.divider--top - Border top
.divider.divider--right - Border right
.divider.divider--bottom - Border bottom
.divider.divider--left - Border left
.divider.divider--inverse - White border

markup:
<div class="{$modifiers}">
  I have borders!
</div>

Styleguide 3.18
*/
.divider {
  border: 0 solid #cdcdcd;
  border: 0 solid rgba(103, 171, 67, 0.26);
  border-color: #d7e9ce; }
  .divider--right {
    border-right-width: 1px; }
  .divider--left {
    border-left-width: 1px; }
  .divider--top.gutters, .divider--bottom.gutters {
    position: relative; }
    .divider--top.gutters::after, .divider--top.gutters::before, .divider--bottom.gutters::after, .divider--bottom.gutters::before {
      content: '';
      display: block;
      position: absolute;
      left: 15px;
      right: 15px;
      height: 0;
      border: inherit; }
  .divider--top {
    border-top-width: 1px; }
    .divider--top.gutters {
      border-top-width: 0; }
      .divider--top.gutters::after {
        top: 0;
        border-top-width: 1px; }
  .divider--bottom {
    border-bottom-width: 1px; }
    .divider--bottom.gutters {
      border-bottom-width: 0; }
      .divider--bottom.gutters::after {
        bottom: 0;
        border-bottom-width: 1px; }
  .divider.theme--dark,
  .theme--dark .divider,
  .theme .theme--dark .divider {
    border-color: #cdcdcd; }
  .divider.theme--green,
  .theme--green .divider,
  .theme .theme--green .divider {
    border-color: #d7e9ce; }
  .divider.theme--blue,
  .theme--blue .divider,
  .theme .theme--blue .divider {
    border-color: #d3eff6; }
  .divider.theme--lime,
  .theme--lime .divider,
  .theme .theme--lime .divider {
    border-color: #eff4ca; }
  .divider.theme--yellow,
  .theme--yellow .divider,
  .theme .theme--yellow .divider {
    border-color: #fef3c5; }
  .divider.theme--gold,
  .theme--gold .divider,
  .theme .theme--gold .divider {
    border-color: #fae3c8; }
  .divider.theme--orange,
  .theme--orange .divider,
  .theme .theme--orange .divider {
    border-color: #f7d7ca; }
  .divider.theme--salmon,
  .theme--salmon .divider,
  .theme .theme--salmon .divider {
    border-color: #fadbd5; }
  .divider.theme--red,
  .theme--red .divider,
  .theme .theme--red .divider {
    border-color: #fac8c1; }
  .divider.theme--burgundy,
  .theme--burgundy .divider,
  .theme .theme--burgundy .divider {
    border-color: #edc6c8; }
  .divider.theme--purple,
  .theme--purple .divider,
  .theme .theme--purple .divider {
    border-color: #e5cade; }
  .divider.theme--youth,
  .theme--youth .divider,
  .theme .theme--youth .divider {
    border-color: #f4dcbd; }
  .divider.theme--digitalisation,
  .theme--digitalisation .divider,
  .theme .theme--digitalisation .divider {
    border-color: #e5cac6; }
  .divider.theme--climate,
  .theme--climate .divider,
  .theme .theme--climate .divider {
    border-color: #d8ccd5; }
  .divider.theme--gender,
  .theme--gender .divider,
  .theme .theme--gender .divider {
    border-color: #bed8cb; }
  .divider.theme--nutrition,
  .theme--nutrition .divider,
  .theme .theme--nutrition .divider {
    border-color: #cfdcdd; }
  .divider.theme--blog,
  .theme--blog .divider,
  .theme .theme--blog .divider {
    border-color: #ffe7bd; }
  .divider.theme--spore-blue,
  .theme--spore-blue .divider,
  .theme .theme--spore-blue .divider {
    border-color: #cdd8eb; }
  .divider.theme--spore-brown,
  .theme--spore-brown .divider,
  .theme .theme--spore-brown .divider {
    border-color: #dcd0be; }
  .divider.theme--spore-dark-blue,
  .theme--spore-dark-blue .divider,
  .theme .theme--spore-dark-blue .divider {
    border-color: #bed1dd; }
  .divider.theme--spore-forest-green,
  .theme--spore-forest-green .divider,
  .theme .theme--spore-forest-green .divider {
    border-color: #d5debf; }
  .divider.theme--spore-grey-blue,
  .theme--spore-grey-blue .divider,
  .theme .theme--spore-grey-blue .divider {
    border-color: #d9e1e6; }
  .divider.theme--spore-light-blue,
  .theme--spore-light-blue .divider,
  .theme .theme--spore-light-blue .divider {
    border-color: #dce9f3; }
  .divider.theme--spore-lime,
  .theme--spore-lime .divider,
  .theme .theme--spore-lime .divider {
    border-color: #edeabd; }
  .divider.theme--spore-ochre,
  .theme--spore-ochre .divider,
  .theme .theme--spore-ochre .divider {
    border-color: #f6e4c6; }
  .divider.theme--spore-olive-green,
  .theme--spore-olive-green .divider,
  .theme .theme--spore-olive-green .divider {
    border-color: #dce1cd; }
  .divider.theme--spore-red,
  .theme--spore-red .divider,
  .theme .theme--spore-red .divider {
    border-color: #fcd0c6; }
  .divider.theme--spore-taupe,
  .theme--spore-taupe .divider,
  .theme .theme--spore-taupe .divider {
    border-color: #ddd9d7; }
  .divider.theme--spore-teal,
  .theme--spore-teal .divider,
  .theme .theme--spore-teal .divider {
    border-color: #bfdeef; }
  .divider--inverse,
  .theme .divider--inverse {
    border-color: #fff;
    border-color: rgba(255, 255, 255, 0.4); }
    .well--neutral .divider--inverse, .well--neutral
    .theme .divider--inverse {
      border-color: #fff; }

/* 3.19 Location */
/*
Location

markup:
<div class="media  |  location">
  <span class="icon icon--theme icon--map-marker"></span>
  <div class="location__body  |  media__content">
    <span class="is-narrative">Location:</span></span> Wageningen, Gelderland, The Netherlands</span>
  </div>
</div>

Styleguide 3.19
*/
.location {
  /* small meta*/
  font-size: 0.75em;
  line-height: 1;
  color: #6c6c6c; }
  .location__marker {
    margin-right: .5em;
    margin-left: -3px; }
  .location .icon, .location .list--take-aways li:before, .list--take-aways .location li:before, .location .list--theme li:before, .list--theme .location li:before, .location .filter__trigger:after, .location .block-link--icon:before, .location .panel.is-inactive .panel__trigger:after, .panel.is-inactive .location .panel__trigger:after, .location .tail__lengthen:before, .location .tail__lengthen:after, .location .tail__shorten:before, .location .tail__shorten:after {
    color: #67ab43; }
    .location .icon.theme--dark, .location .list--take-aways li.theme--dark:before, .list--take-aways .location li.theme--dark:before, .location .list--theme li.theme--dark:before, .list--theme .location li.theme--dark:before, .location .theme--dark.filter__trigger:after, .location .theme--dark.block-link--icon:before, .location .panel.is-inactive .theme--dark.panel__trigger:after, .panel.is-inactive .location .theme--dark.panel__trigger:after, .location .theme--dark.tail__lengthen:before, .location .theme--dark.tail__lengthen:after, .location .theme--dark.tail__shorten:before, .location .theme--dark.tail__shorten:after,
    .theme--dark .location .icon,
    .theme--dark .location .list--take-aways li:before,
    .list--take-aways .theme--dark .location li:before,
    .theme--dark .location .list--theme li:before,
    .list--theme .theme--dark .location li:before,
    .theme--dark .location .filter__trigger:after,
    .theme--dark .location .block-link--icon:before,
    .theme--dark .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--dark .location .panel__trigger:after,
    .theme--dark .location .tail__lengthen:before,
    .theme--dark .location .tail__lengthen:after,
    .theme--dark .location .tail__shorten:before,
    .theme--dark .location .tail__shorten:after,
    .theme .theme.theme--dark .location .icon,
    .theme .theme.theme--dark .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--dark .location li:before,
    .theme .theme.theme--dark .location .list--theme li:before,
    .list--theme .theme .theme.theme--dark .location li:before,
    .theme .theme.theme--dark .location .filter__trigger:after,
    .theme .theme.theme--dark .location .block-link--icon:before,
    .theme .theme.theme--dark .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--dark .location .panel__trigger:after,
    .theme .theme.theme--dark .location .tail__lengthen:before,
    .theme .theme.theme--dark .location .tail__lengthen:after,
    .theme .theme.theme--dark .location .tail__shorten:before,
    .theme .theme.theme--dark .location .tail__shorten:after {
      color: #3d3d3d; }
    .location .icon.theme--green, .location .list--take-aways li.theme--green:before, .list--take-aways .location li.theme--green:before, .location .list--theme li.theme--green:before, .list--theme .location li.theme--green:before, .location .theme--green.filter__trigger:after, .location .theme--green.block-link--icon:before, .location .panel.is-inactive .theme--green.panel__trigger:after, .panel.is-inactive .location .theme--green.panel__trigger:after, .location .theme--green.tail__lengthen:before, .location .theme--green.tail__lengthen:after, .location .theme--green.tail__shorten:before, .location .theme--green.tail__shorten:after,
    .theme--green .location .icon,
    .theme--green .location .list--take-aways li:before,
    .list--take-aways .theme--green .location li:before,
    .theme--green .location .list--theme li:before,
    .list--theme .theme--green .location li:before,
    .theme--green .location .filter__trigger:after,
    .theme--green .location .block-link--icon:before,
    .theme--green .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--green .location .panel__trigger:after,
    .theme--green .location .tail__lengthen:before,
    .theme--green .location .tail__lengthen:after,
    .theme--green .location .tail__shorten:before,
    .theme--green .location .tail__shorten:after,
    .theme .theme.theme--green .location .icon,
    .theme .theme.theme--green .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--green .location li:before,
    .theme .theme.theme--green .location .list--theme li:before,
    .list--theme .theme .theme.theme--green .location li:before,
    .theme .theme.theme--green .location .filter__trigger:after,
    .theme .theme.theme--green .location .block-link--icon:before,
    .theme .theme.theme--green .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--green .location .panel__trigger:after,
    .theme .theme.theme--green .location .tail__lengthen:before,
    .theme .theme.theme--green .location .tail__lengthen:after,
    .theme .theme.theme--green .location .tail__shorten:before,
    .theme .theme.theme--green .location .tail__shorten:after {
      color: #67ab43; }
    .location .icon.theme--blue, .location .list--take-aways li.theme--blue:before, .list--take-aways .location li.theme--blue:before, .location .list--theme li.theme--blue:before, .list--theme .location li.theme--blue:before, .location .theme--blue.filter__trigger:after, .location .theme--blue.block-link--icon:before, .location .panel.is-inactive .theme--blue.panel__trigger:after, .panel.is-inactive .location .theme--blue.panel__trigger:after, .location .theme--blue.tail__lengthen:before, .location .theme--blue.tail__lengthen:after, .location .theme--blue.tail__shorten:before, .location .theme--blue.tail__shorten:after,
    .theme--blue .location .icon,
    .theme--blue .location .list--take-aways li:before,
    .list--take-aways .theme--blue .location li:before,
    .theme--blue .location .list--theme li:before,
    .list--theme .theme--blue .location li:before,
    .theme--blue .location .filter__trigger:after,
    .theme--blue .location .block-link--icon:before,
    .theme--blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--blue .location .panel__trigger:after,
    .theme--blue .location .tail__lengthen:before,
    .theme--blue .location .tail__lengthen:after,
    .theme--blue .location .tail__shorten:before,
    .theme--blue .location .tail__shorten:after,
    .theme .theme.theme--blue .location .icon,
    .theme .theme.theme--blue .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--blue .location li:before,
    .theme .theme.theme--blue .location .list--theme li:before,
    .list--theme .theme .theme.theme--blue .location li:before,
    .theme .theme.theme--blue .location .filter__trigger:after,
    .theme .theme.theme--blue .location .block-link--icon:before,
    .theme .theme.theme--blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--blue .location .panel__trigger:after,
    .theme .theme.theme--blue .location .tail__lengthen:before,
    .theme .theme.theme--blue .location .tail__lengthen:after,
    .theme .theme.theme--blue .location .tail__shorten:before,
    .theme .theme.theme--blue .location .tail__shorten:after {
      color: #56c0dd; }
    .location .icon.theme--lime, .location .list--take-aways li.theme--lime:before, .list--take-aways .location li.theme--lime:before, .location .list--theme li.theme--lime:before, .list--theme .location li.theme--lime:before, .location .theme--lime.filter__trigger:after, .location .theme--lime.block-link--icon:before, .location .panel.is-inactive .theme--lime.panel__trigger:after, .panel.is-inactive .location .theme--lime.panel__trigger:after, .location .theme--lime.tail__lengthen:before, .location .theme--lime.tail__lengthen:after, .location .theme--lime.tail__shorten:before, .location .theme--lime.tail__shorten:after,
    .theme--lime .location .icon,
    .theme--lime .location .list--take-aways li:before,
    .list--take-aways .theme--lime .location li:before,
    .theme--lime .location .list--theme li:before,
    .list--theme .theme--lime .location li:before,
    .theme--lime .location .filter__trigger:after,
    .theme--lime .location .block-link--icon:before,
    .theme--lime .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--lime .location .panel__trigger:after,
    .theme--lime .location .tail__lengthen:before,
    .theme--lime .location .tail__lengthen:after,
    .theme--lime .location .tail__shorten:before,
    .theme--lime .location .tail__shorten:after,
    .theme .theme.theme--lime .location .icon,
    .theme .theme.theme--lime .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--lime .location li:before,
    .theme .theme.theme--lime .location .list--theme li:before,
    .list--theme .theme .theme.theme--lime .location li:before,
    .theme .theme.theme--lime .location .filter__trigger:after,
    .theme .theme.theme--lime .location .block-link--icon:before,
    .theme .theme.theme--lime .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--lime .location .panel__trigger:after,
    .theme .theme.theme--lime .location .tail__lengthen:before,
    .theme .theme.theme--lime .location .tail__lengthen:after,
    .theme .theme.theme--lime .location .tail__shorten:before,
    .theme .theme.theme--lime .location .tail__shorten:after {
      color: #c1d435; }
    .location .icon.theme--yellow, .location .list--take-aways li.theme--yellow:before, .list--take-aways .location li.theme--yellow:before, .location .list--theme li.theme--yellow:before, .list--theme .location li.theme--yellow:before, .location .theme--yellow.filter__trigger:after, .location .theme--yellow.block-link--icon:before, .location .panel.is-inactive .theme--yellow.panel__trigger:after, .panel.is-inactive .location .theme--yellow.panel__trigger:after, .location .theme--yellow.tail__lengthen:before, .location .theme--yellow.tail__lengthen:after, .location .theme--yellow.tail__shorten:before, .location .theme--yellow.tail__shorten:after,
    .theme--yellow .location .icon,
    .theme--yellow .location .list--take-aways li:before,
    .list--take-aways .theme--yellow .location li:before,
    .theme--yellow .location .list--theme li:before,
    .list--theme .theme--yellow .location li:before,
    .theme--yellow .location .filter__trigger:after,
    .theme--yellow .location .block-link--icon:before,
    .theme--yellow .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--yellow .location .panel__trigger:after,
    .theme--yellow .location .tail__lengthen:before,
    .theme--yellow .location .tail__lengthen:after,
    .theme--yellow .location .tail__shorten:before,
    .theme--yellow .location .tail__shorten:after,
    .theme .theme.theme--yellow .location .icon,
    .theme .theme.theme--yellow .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--yellow .location li:before,
    .theme .theme.theme--yellow .location .list--theme li:before,
    .list--theme .theme .theme.theme--yellow .location li:before,
    .theme .theme.theme--yellow .location .filter__trigger:after,
    .theme .theme.theme--yellow .location .block-link--icon:before,
    .theme .theme.theme--yellow .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--yellow .location .panel__trigger:after,
    .theme .theme.theme--yellow .location .tail__lengthen:before,
    .theme .theme.theme--yellow .location .tail__lengthen:after,
    .theme .theme.theme--yellow .location .tail__shorten:before,
    .theme .theme.theme--yellow .location .tail__shorten:after {
      color: #facf21; }
    .location .icon.theme--gold, .location .list--take-aways li.theme--gold:before, .list--take-aways .location li.theme--gold:before, .location .list--theme li.theme--gold:before, .list--theme .location li.theme--gold:before, .location .theme--gold.filter__trigger:after, .location .theme--gold.block-link--icon:before, .location .panel.is-inactive .theme--gold.panel__trigger:after, .panel.is-inactive .location .theme--gold.panel__trigger:after, .location .theme--gold.tail__lengthen:before, .location .theme--gold.tail__lengthen:after, .location .theme--gold.tail__shorten:before, .location .theme--gold.tail__shorten:after,
    .theme--gold .location .icon,
    .theme--gold .location .list--take-aways li:before,
    .list--take-aways .theme--gold .location li:before,
    .theme--gold .location .list--theme li:before,
    .list--theme .theme--gold .location li:before,
    .theme--gold .location .filter__trigger:after,
    .theme--gold .location .block-link--icon:before,
    .theme--gold .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--gold .location .panel__trigger:after,
    .theme--gold .location .tail__lengthen:before,
    .theme--gold .location .tail__lengthen:after,
    .theme--gold .location .tail__shorten:before,
    .theme--gold .location .tail__shorten:after,
    .theme .theme.theme--gold .location .icon,
    .theme .theme.theme--gold .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--gold .location li:before,
    .theme .theme.theme--gold .location .list--theme li:before,
    .list--theme .theme .theme.theme--gold .location li:before,
    .theme .theme.theme--gold .location .filter__trigger:after,
    .theme .theme.theme--gold .location .block-link--icon:before,
    .theme .theme.theme--gold .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--gold .location .panel__trigger:after,
    .theme .theme.theme--gold .location .tail__lengthen:before,
    .theme .theme.theme--gold .location .tail__lengthen:after,
    .theme .theme.theme--gold .location .tail__shorten:before,
    .theme .theme.theme--gold .location .tail__shorten:after {
      color: #eb942c; }
    .location .icon.theme--orange, .location .list--take-aways li.theme--orange:before, .list--take-aways .location li.theme--orange:before, .location .list--theme li.theme--orange:before, .list--theme .location li.theme--orange:before, .location .theme--orange.filter__trigger:after, .location .theme--orange.block-link--icon:before, .location .panel.is-inactive .theme--orange.panel__trigger:after, .panel.is-inactive .location .theme--orange.panel__trigger:after, .location .theme--orange.tail__lengthen:before, .location .theme--orange.tail__lengthen:after, .location .theme--orange.tail__shorten:before, .location .theme--orange.tail__shorten:after,
    .theme--orange .location .icon,
    .theme--orange .location .list--take-aways li:before,
    .list--take-aways .theme--orange .location li:before,
    .theme--orange .location .list--theme li:before,
    .list--theme .theme--orange .location li:before,
    .theme--orange .location .filter__trigger:after,
    .theme--orange .location .block-link--icon:before,
    .theme--orange .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--orange .location .panel__trigger:after,
    .theme--orange .location .tail__lengthen:before,
    .theme--orange .location .tail__lengthen:after,
    .theme--orange .location .tail__shorten:before,
    .theme--orange .location .tail__shorten:after,
    .theme .theme.theme--orange .location .icon,
    .theme .theme.theme--orange .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--orange .location li:before,
    .theme .theme.theme--orange .location .list--theme li:before,
    .list--theme .theme .theme.theme--orange .location li:before,
    .theme .theme.theme--orange .location .filter__trigger:after,
    .theme .theme.theme--orange .location .block-link--icon:before,
    .theme .theme.theme--orange .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--orange .location .panel__trigger:after,
    .theme .theme.theme--orange .location .tail__lengthen:before,
    .theme .theme.theme--orange .location .tail__lengthen:after,
    .theme .theme.theme--orange .location .tail__shorten:before,
    .theme .theme.theme--orange .location .tail__shorten:after {
      color: #e26435; }
    .location .icon.theme--salmon, .location .list--take-aways li.theme--salmon:before, .list--take-aways .location li.theme--salmon:before, .location .list--theme li.theme--salmon:before, .list--theme .location li.theme--salmon:before, .location .theme--salmon.filter__trigger:after, .location .theme--salmon.block-link--icon:before, .location .panel.is-inactive .theme--salmon.panel__trigger:after, .panel.is-inactive .location .theme--salmon.panel__trigger:after, .location .theme--salmon.tail__lengthen:before, .location .theme--salmon.tail__lengthen:after, .location .theme--salmon.tail__shorten:before, .location .theme--salmon.tail__shorten:after,
    .theme--salmon .location .icon,
    .theme--salmon .location .list--take-aways li:before,
    .list--take-aways .theme--salmon .location li:before,
    .theme--salmon .location .list--theme li:before,
    .list--theme .theme--salmon .location li:before,
    .theme--salmon .location .filter__trigger:after,
    .theme--salmon .location .block-link--icon:before,
    .theme--salmon .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--salmon .location .panel__trigger:after,
    .theme--salmon .location .tail__lengthen:before,
    .theme--salmon .location .tail__lengthen:after,
    .theme--salmon .location .tail__shorten:before,
    .theme--salmon .location .tail__shorten:after,
    .theme .theme.theme--salmon .location .icon,
    .theme .theme.theme--salmon .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--salmon .location li:before,
    .theme .theme.theme--salmon .location .list--theme li:before,
    .list--theme .theme .theme.theme--salmon .location li:before,
    .theme .theme.theme--salmon .location .filter__trigger:after,
    .theme .theme.theme--salmon .location .block-link--icon:before,
    .theme .theme.theme--salmon .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--salmon .location .panel__trigger:after,
    .theme .theme.theme--salmon .location .tail__lengthen:before,
    .theme .theme.theme--salmon .location .tail__lengthen:after,
    .theme .theme.theme--salmon .location .tail__shorten:before,
    .theme .theme.theme--salmon .location .tail__shorten:after {
      color: #eb735d; }
    .location .icon.theme--red, .location .list--take-aways li.theme--red:before, .list--take-aways .location li.theme--red:before, .location .list--theme li.theme--red:before, .list--theme .location li.theme--red:before, .location .theme--red.filter__trigger:after, .location .theme--red.block-link--icon:before, .location .panel.is-inactive .theme--red.panel__trigger:after, .panel.is-inactive .location .theme--red.panel__trigger:after, .location .theme--red.tail__lengthen:before, .location .theme--red.tail__lengthen:after, .location .theme--red.tail__shorten:before, .location .theme--red.tail__shorten:after,
    .theme--red .location .icon,
    .theme--red .location .list--take-aways li:before,
    .list--take-aways .theme--red .location li:before,
    .theme--red .location .list--theme li:before,
    .list--theme .theme--red .location li:before,
    .theme--red .location .filter__trigger:after,
    .theme--red .location .block-link--icon:before,
    .theme--red .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--red .location .panel__trigger:after,
    .theme--red .location .tail__lengthen:before,
    .theme--red .location .tail__lengthen:after,
    .theme--red .location .tail__shorten:before,
    .theme--red .location .tail__shorten:after,
    .theme .theme.theme--red .location .icon,
    .theme .theme.theme--red .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--red .location li:before,
    .theme .theme.theme--red .location .list--theme li:before,
    .list--theme .theme .theme.theme--red .location li:before,
    .theme .theme.theme--red .location .filter__trigger:after,
    .theme .theme.theme--red .location .block-link--icon:before,
    .theme .theme.theme--red .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--red .location .panel__trigger:after,
    .theme .theme.theme--red .location .tail__lengthen:before,
    .theme .theme.theme--red .location .tail__lengthen:after,
    .theme .theme.theme--red .location .tail__shorten:before,
    .theme .theme.theme--red .location .tail__shorten:after {
      color: #ec2d10; }
    .location .icon.theme--burgundy, .location .list--take-aways li.theme--burgundy:before, .list--take-aways .location li.theme--burgundy:before, .location .list--theme li.theme--burgundy:before, .list--theme .location li.theme--burgundy:before, .location .theme--burgundy.filter__trigger:after, .location .theme--burgundy.block-link--icon:before, .location .panel.is-inactive .theme--burgundy.panel__trigger:after, .panel.is-inactive .location .theme--burgundy.panel__trigger:after, .location .theme--burgundy.tail__lengthen:before, .location .theme--burgundy.tail__lengthen:after, .location .theme--burgundy.tail__shorten:before, .location .theme--burgundy.tail__shorten:after,
    .theme--burgundy .location .icon,
    .theme--burgundy .location .list--take-aways li:before,
    .list--take-aways .theme--burgundy .location li:before,
    .theme--burgundy .location .list--theme li:before,
    .list--theme .theme--burgundy .location li:before,
    .theme--burgundy .location .filter__trigger:after,
    .theme--burgundy .location .block-link--icon:before,
    .theme--burgundy .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--burgundy .location .panel__trigger:after,
    .theme--burgundy .location .tail__lengthen:before,
    .theme--burgundy .location .tail__lengthen:after,
    .theme--burgundy .location .tail__shorten:before,
    .theme--burgundy .location .tail__shorten:after,
    .theme .theme.theme--burgundy .location .icon,
    .theme .theme.theme--burgundy .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--burgundy .location li:before,
    .theme .theme.theme--burgundy .location .list--theme li:before,
    .list--theme .theme .theme.theme--burgundy .location li:before,
    .theme .theme.theme--burgundy .location .filter__trigger:after,
    .theme .theme.theme--burgundy .location .block-link--icon:before,
    .theme .theme.theme--burgundy .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--burgundy .location .panel__trigger:after,
    .theme .theme.theme--burgundy .location .tail__lengthen:before,
    .theme .theme.theme--burgundy .location .tail__lengthen:after,
    .theme .theme.theme--burgundy .location .tail__shorten:before,
    .theme .theme.theme--burgundy .location .tail__shorten:after {
      color: #ba222a; }
    .location .icon.theme--purple, .location .list--take-aways li.theme--purple:before, .list--take-aways .location li.theme--purple:before, .location .list--theme li.theme--purple:before, .list--theme .location li.theme--purple:before, .location .theme--purple.filter__trigger:after, .location .theme--purple.block-link--icon:before, .location .panel.is-inactive .theme--purple.panel__trigger:after, .panel.is-inactive .location .theme--purple.panel__trigger:after, .location .theme--purple.tail__lengthen:before, .location .theme--purple.tail__lengthen:after, .location .theme--purple.tail__shorten:before, .location .theme--purple.tail__shorten:after,
    .theme--purple .location .icon,
    .theme--purple .location .list--take-aways li:before,
    .list--take-aways .theme--purple .location li:before,
    .theme--purple .location .list--theme li:before,
    .list--theme .theme--purple .location li:before,
    .theme--purple .location .filter__trigger:after,
    .theme--purple .location .block-link--icon:before,
    .theme--purple .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--purple .location .panel__trigger:after,
    .theme--purple .location .tail__lengthen:before,
    .theme--purple .location .tail__lengthen:after,
    .theme--purple .location .tail__shorten:before,
    .theme--purple .location .tail__shorten:after,
    .theme .theme.theme--purple .location .icon,
    .theme .theme.theme--purple .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--purple .location li:before,
    .theme .theme.theme--purple .location .list--theme li:before,
    .list--theme .theme .theme.theme--purple .location li:before,
    .theme .theme.theme--purple .location .filter__trigger:after,
    .theme .theme.theme--purple .location .block-link--icon:before,
    .theme .theme.theme--purple .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--purple .location .panel__trigger:after,
    .theme .theme.theme--purple .location .tail__lengthen:before,
    .theme .theme.theme--purple .location .tail__lengthen:after,
    .theme .theme.theme--purple .location .tail__shorten:before,
    .theme .theme.theme--purple .location .tail__shorten:after {
      color: #9b3381; }
    .location .icon.theme--youth, .location .list--take-aways li.theme--youth:before, .list--take-aways .location li.theme--youth:before, .location .list--theme li.theme--youth:before, .list--theme .location li.theme--youth:before, .location .theme--youth.filter__trigger:after, .location .theme--youth.block-link--icon:before, .location .panel.is-inactive .theme--youth.panel__trigger:after, .panel.is-inactive .location .theme--youth.panel__trigger:after, .location .theme--youth.tail__lengthen:before, .location .theme--youth.tail__lengthen:after, .location .theme--youth.tail__shorten:before, .location .theme--youth.tail__shorten:after,
    .theme--youth .location .icon,
    .theme--youth .location .list--take-aways li:before,
    .list--take-aways .theme--youth .location li:before,
    .theme--youth .location .list--theme li:before,
    .list--theme .theme--youth .location li:before,
    .theme--youth .location .filter__trigger:after,
    .theme--youth .location .block-link--icon:before,
    .theme--youth .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--youth .location .panel__trigger:after,
    .theme--youth .location .tail__lengthen:before,
    .theme--youth .location .tail__lengthen:after,
    .theme--youth .location .tail__shorten:before,
    .theme--youth .location .tail__shorten:after,
    .theme .theme.theme--youth .location .icon,
    .theme .theme.theme--youth .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--youth .location li:before,
    .theme .theme.theme--youth .location .list--theme li:before,
    .list--theme .theme .theme.theme--youth .location li:before,
    .theme .theme.theme--youth .location .filter__trigger:after,
    .theme .theme.theme--youth .location .block-link--icon:before,
    .theme .theme.theme--youth .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--youth .location .panel__trigger:after,
    .theme .theme.theme--youth .location .tail__lengthen:before,
    .theme .theme.theme--youth .location .tail__lengthen:after,
    .theme .theme.theme--youth .location .tail__shorten:before,
    .theme .theme.theme--youth .location .tail__shorten:after {
      color: #d57800; }
    .location .icon.theme--digitalisation, .location .list--take-aways li.theme--digitalisation:before, .list--take-aways .location li.theme--digitalisation:before, .location .list--theme li.theme--digitalisation:before, .list--theme .location li.theme--digitalisation:before, .location .theme--digitalisation.filter__trigger:after, .location .theme--digitalisation.block-link--icon:before, .location .panel.is-inactive .theme--digitalisation.panel__trigger:after, .panel.is-inactive .location .theme--digitalisation.panel__trigger:after, .location .theme--digitalisation.tail__lengthen:before, .location .theme--digitalisation.tail__lengthen:after, .location .theme--digitalisation.tail__shorten:before, .location .theme--digitalisation.tail__shorten:after,
    .theme--digitalisation .location .icon,
    .theme--digitalisation .location .list--take-aways li:before,
    .list--take-aways .theme--digitalisation .location li:before,
    .theme--digitalisation .location .list--theme li:before,
    .list--theme .theme--digitalisation .location li:before,
    .theme--digitalisation .location .filter__trigger:after,
    .theme--digitalisation .location .block-link--icon:before,
    .theme--digitalisation .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--digitalisation .location .panel__trigger:after,
    .theme--digitalisation .location .tail__lengthen:before,
    .theme--digitalisation .location .tail__lengthen:after,
    .theme--digitalisation .location .tail__shorten:before,
    .theme--digitalisation .location .tail__shorten:after,
    .theme .theme.theme--digitalisation .location .icon,
    .theme .theme.theme--digitalisation .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--digitalisation .location li:before,
    .theme .theme.theme--digitalisation .location .list--theme li:before,
    .list--theme .theme .theme.theme--digitalisation .location li:before,
    .theme .theme.theme--digitalisation .location .filter__trigger:after,
    .theme .theme.theme--digitalisation .location .block-link--icon:before,
    .theme .theme.theme--digitalisation .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--digitalisation .location .panel__trigger:after,
    .theme .theme.theme--digitalisation .location .tail__lengthen:before,
    .theme .theme.theme--digitalisation .location .tail__lengthen:after,
    .theme .theme.theme--digitalisation .location .tail__shorten:before,
    .theme .theme.theme--digitalisation .location .tail__shorten:after {
      color: #9a3324; }
    .location .icon.theme--climate, .location .list--take-aways li.theme--climate:before, .list--take-aways .location li.theme--climate:before, .location .list--theme li.theme--climate:before, .list--theme .location li.theme--climate:before, .location .theme--climate.filter__trigger:after, .location .theme--climate.block-link--icon:before, .location .panel.is-inactive .theme--climate.panel__trigger:after, .panel.is-inactive .location .theme--climate.panel__trigger:after, .location .theme--climate.tail__lengthen:before, .location .theme--climate.tail__lengthen:after, .location .theme--climate.tail__shorten:before, .location .theme--climate.tail__shorten:after,
    .theme--climate .location .icon,
    .theme--climate .location .list--take-aways li:before,
    .list--take-aways .theme--climate .location li:before,
    .theme--climate .location .list--theme li:before,
    .list--theme .theme--climate .location li:before,
    .theme--climate .location .filter__trigger:after,
    .theme--climate .location .block-link--icon:before,
    .theme--climate .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--climate .location .panel__trigger:after,
    .theme--climate .location .tail__lengthen:before,
    .theme--climate .location .tail__lengthen:after,
    .theme--climate .location .tail__shorten:before,
    .theme--climate .location .tail__shorten:after,
    .theme .theme.theme--climate .location .icon,
    .theme .theme.theme--climate .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--climate .location li:before,
    .theme .theme.theme--climate .location .list--theme li:before,
    .list--theme .theme .theme.theme--climate .location li:before,
    .theme .theme.theme--climate .location .filter__trigger:after,
    .theme .theme.theme--climate .location .block-link--icon:before,
    .theme .theme.theme--climate .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--climate .location .panel__trigger:after,
    .theme .theme.theme--climate .location .tail__lengthen:before,
    .theme .theme.theme--climate .location .tail__lengthen:after,
    .theme .theme.theme--climate .location .tail__shorten:before,
    .theme .theme.theme--climate .location .tail__shorten:after {
      color: #693c5e; }
    .location .icon.theme--gender, .location .list--take-aways li.theme--gender:before, .list--take-aways .location li.theme--gender:before, .location .list--theme li.theme--gender:before, .list--theme .location li.theme--gender:before, .location .theme--gender.filter__trigger:after, .location .theme--gender.block-link--icon:before, .location .panel.is-inactive .theme--gender.panel__trigger:after, .panel.is-inactive .location .theme--gender.panel__trigger:after, .location .theme--gender.tail__lengthen:before, .location .theme--gender.tail__lengthen:after, .location .theme--gender.tail__shorten:before, .location .theme--gender.tail__shorten:after,
    .theme--gender .location .icon,
    .theme--gender .location .list--take-aways li:before,
    .list--take-aways .theme--gender .location li:before,
    .theme--gender .location .list--theme li:before,
    .list--theme .theme--gender .location li:before,
    .theme--gender .location .filter__trigger:after,
    .theme--gender .location .block-link--icon:before,
    .theme--gender .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--gender .location .panel__trigger:after,
    .theme--gender .location .tail__lengthen:before,
    .theme--gender .location .tail__lengthen:after,
    .theme--gender .location .tail__shorten:before,
    .theme--gender .location .tail__shorten:after,
    .theme .theme.theme--gender .location .icon,
    .theme .theme.theme--gender .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--gender .location li:before,
    .theme .theme.theme--gender .location .list--theme li:before,
    .list--theme .theme .theme.theme--gender .location li:before,
    .theme .theme.theme--gender .location .filter__trigger:after,
    .theme .theme.theme--gender .location .block-link--icon:before,
    .theme .theme.theme--gender .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--gender .location .panel__trigger:after,
    .theme .theme.theme--gender .location .tail__lengthen:before,
    .theme .theme.theme--gender .location .tail__lengthen:after,
    .theme .theme.theme--gender .location .tail__shorten:before,
    .theme .theme.theme--gender .location .tail__shorten:after {
      color: #046a38; }
    .location .icon.theme--nutrition, .location .list--take-aways li.theme--nutrition:before, .list--take-aways .location li.theme--nutrition:before, .location .list--theme li.theme--nutrition:before, .list--theme .location li.theme--nutrition:before, .location .theme--nutrition.filter__trigger:after, .location .theme--nutrition.block-link--icon:before, .location .panel.is-inactive .theme--nutrition.panel__trigger:after, .panel.is-inactive .location .theme--nutrition.panel__trigger:after, .location .theme--nutrition.tail__lengthen:before, .location .theme--nutrition.tail__lengthen:after, .location .theme--nutrition.tail__shorten:before, .location .theme--nutrition.tail__shorten:after,
    .theme--nutrition .location .icon,
    .theme--nutrition .location .list--take-aways li:before,
    .list--take-aways .theme--nutrition .location li:before,
    .theme--nutrition .location .list--theme li:before,
    .list--theme .theme--nutrition .location li:before,
    .theme--nutrition .location .filter__trigger:after,
    .theme--nutrition .location .block-link--icon:before,
    .theme--nutrition .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--nutrition .location .panel__trigger:after,
    .theme--nutrition .location .tail__lengthen:before,
    .theme--nutrition .location .tail__lengthen:after,
    .theme--nutrition .location .tail__shorten:before,
    .theme--nutrition .location .tail__shorten:after,
    .theme .theme.theme--nutrition .location .icon,
    .theme .theme.theme--nutrition .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--nutrition .location li:before,
    .theme .theme.theme--nutrition .location .list--theme li:before,
    .list--theme .theme .theme.theme--nutrition .location li:before,
    .theme .theme.theme--nutrition .location .filter__trigger:after,
    .theme .theme.theme--nutrition .location .block-link--icon:before,
    .theme .theme.theme--nutrition .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--nutrition .location .panel__trigger:after,
    .theme .theme.theme--nutrition .location .tail__lengthen:before,
    .theme .theme.theme--nutrition .location .tail__lengthen:after,
    .theme .theme.theme--nutrition .location .tail__shorten:before,
    .theme .theme.theme--nutrition .location .tail__shorten:after {
      color: #487a7b; }
    .location .icon.theme--blog, .location .list--take-aways li.theme--blog:before, .list--take-aways .location li.theme--blog:before, .location .list--theme li.theme--blog:before, .list--theme .location li.theme--blog:before, .location .theme--blog.filter__trigger:after, .location .theme--blog.block-link--icon:before, .location .panel.is-inactive .theme--blog.panel__trigger:after, .panel.is-inactive .location .theme--blog.panel__trigger:after, .location .theme--blog.tail__lengthen:before, .location .theme--blog.tail__lengthen:after, .location .theme--blog.tail__shorten:before, .location .theme--blog.tail__shorten:after,
    .theme--blog .location .icon,
    .theme--blog .location .list--take-aways li:before,
    .list--take-aways .theme--blog .location li:before,
    .theme--blog .location .list--theme li:before,
    .list--theme .theme--blog .location li:before,
    .theme--blog .location .filter__trigger:after,
    .theme--blog .location .block-link--icon:before,
    .theme--blog .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--blog .location .panel__trigger:after,
    .theme--blog .location .tail__lengthen:before,
    .theme--blog .location .tail__lengthen:after,
    .theme--blog .location .tail__shorten:before,
    .theme--blog .location .tail__shorten:after,
    .theme .theme.theme--blog .location .icon,
    .theme .theme.theme--blog .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--blog .location li:before,
    .theme .theme.theme--blog .location .list--theme li:before,
    .list--theme .theme .theme.theme--blog .location li:before,
    .theme .theme.theme--blog .location .filter__trigger:after,
    .theme .theme.theme--blog .location .block-link--icon:before,
    .theme .theme.theme--blog .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--blog .location .panel__trigger:after,
    .theme .theme.theme--blog .location .tail__lengthen:before,
    .theme .theme.theme--blog .location .tail__lengthen:after,
    .theme .theme.theme--blog .location .tail__shorten:before,
    .theme .theme.theme--blog .location .tail__shorten:after {
      color: #ffa300; }
    .location .icon.theme--spore-blue, .location .list--take-aways li.theme--spore-blue:before, .list--take-aways .location li.theme--spore-blue:before, .location .list--theme li.theme--spore-blue:before, .list--theme .location li.theme--spore-blue:before, .location .theme--spore-blue.filter__trigger:after, .location .theme--spore-blue.block-link--icon:before, .location .panel.is-inactive .theme--spore-blue.panel__trigger:after, .panel.is-inactive .location .theme--spore-blue.panel__trigger:after, .location .theme--spore-blue.tail__lengthen:before, .location .theme--spore-blue.tail__lengthen:after, .location .theme--spore-blue.tail__shorten:before, .location .theme--spore-blue.tail__shorten:after,
    .theme--spore-blue .location .icon,
    .theme--spore-blue .location .list--take-aways li:before,
    .list--take-aways .theme--spore-blue .location li:before,
    .theme--spore-blue .location .list--theme li:before,
    .list--theme .theme--spore-blue .location li:before,
    .theme--spore-blue .location .filter__trigger:after,
    .theme--spore-blue .location .block-link--icon:before,
    .theme--spore-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-blue .location .panel__trigger:after,
    .theme--spore-blue .location .tail__lengthen:before,
    .theme--spore-blue .location .tail__lengthen:after,
    .theme--spore-blue .location .tail__shorten:before,
    .theme--spore-blue .location .tail__shorten:after,
    .theme .theme.theme--spore-blue .location .icon,
    .theme .theme.theme--spore-blue .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-blue .location li:before,
    .theme .theme.theme--spore-blue .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-blue .location li:before,
    .theme .theme.theme--spore-blue .location .filter__trigger:after,
    .theme .theme.theme--spore-blue .location .block-link--icon:before,
    .theme .theme.theme--spore-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-blue .location .panel__trigger:after,
    .theme .theme.theme--spore-blue .location .tail__lengthen:before,
    .theme .theme.theme--spore-blue .location .tail__lengthen:after,
    .theme .theme.theme--spore-blue .location .tail__shorten:before,
    .theme .theme.theme--spore-blue .location .tail__shorten:after {
      color: #3f68b1; }
    .location .icon.theme--spore-brown, .location .list--take-aways li.theme--spore-brown:before, .list--take-aways .location li.theme--spore-brown:before, .location .list--theme li.theme--spore-brown:before, .list--theme .location li.theme--spore-brown:before, .location .theme--spore-brown.filter__trigger:after, .location .theme--spore-brown.block-link--icon:before, .location .panel.is-inactive .theme--spore-brown.panel__trigger:after, .panel.is-inactive .location .theme--spore-brown.panel__trigger:after, .location .theme--spore-brown.tail__lengthen:before, .location .theme--spore-brown.tail__lengthen:after, .location .theme--spore-brown.tail__shorten:before, .location .theme--spore-brown.tail__shorten:after,
    .theme--spore-brown .location .icon,
    .theme--spore-brown .location .list--take-aways li:before,
    .list--take-aways .theme--spore-brown .location li:before,
    .theme--spore-brown .location .list--theme li:before,
    .list--theme .theme--spore-brown .location li:before,
    .theme--spore-brown .location .filter__trigger:after,
    .theme--spore-brown .location .block-link--icon:before,
    .theme--spore-brown .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-brown .location .panel__trigger:after,
    .theme--spore-brown .location .tail__lengthen:before,
    .theme--spore-brown .location .tail__lengthen:after,
    .theme--spore-brown .location .tail__shorten:before,
    .theme--spore-brown .location .tail__shorten:after,
    .theme .theme.theme--spore-brown .location .icon,
    .theme .theme.theme--spore-brown .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-brown .location li:before,
    .theme .theme.theme--spore-brown .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-brown .location li:before,
    .theme .theme.theme--spore-brown .location .filter__trigger:after,
    .theme .theme.theme--spore-brown .location .block-link--icon:before,
    .theme .theme.theme--spore-brown .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-brown .location .panel__trigger:after,
    .theme .theme.theme--spore-brown .location .tail__lengthen:before,
    .theme .theme.theme--spore-brown .location .tail__lengthen:after,
    .theme .theme.theme--spore-brown .location .tail__shorten:before,
    .theme .theme.theme--spore-brown .location .tail__shorten:after {
      color: #774b04; }
    .location .icon.theme--spore-dark-blue, .location .list--take-aways li.theme--spore-dark-blue:before, .list--take-aways .location li.theme--spore-dark-blue:before, .location .list--theme li.theme--spore-dark-blue:before, .list--theme .location li.theme--spore-dark-blue:before, .location .theme--spore-dark-blue.filter__trigger:after, .location .theme--spore-dark-blue.block-link--icon:before, .location .panel.is-inactive .theme--spore-dark-blue.panel__trigger:after, .panel.is-inactive .location .theme--spore-dark-blue.panel__trigger:after, .location .theme--spore-dark-blue.tail__lengthen:before, .location .theme--spore-dark-blue.tail__lengthen:after, .location .theme--spore-dark-blue.tail__shorten:before, .location .theme--spore-dark-blue.tail__shorten:after,
    .theme--spore-dark-blue .location .icon,
    .theme--spore-dark-blue .location .list--take-aways li:before,
    .list--take-aways .theme--spore-dark-blue .location li:before,
    .theme--spore-dark-blue .location .list--theme li:before,
    .list--theme .theme--spore-dark-blue .location li:before,
    .theme--spore-dark-blue .location .filter__trigger:after,
    .theme--spore-dark-blue .location .block-link--icon:before,
    .theme--spore-dark-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-dark-blue .location .panel__trigger:after,
    .theme--spore-dark-blue .location .tail__lengthen:before,
    .theme--spore-dark-blue .location .tail__lengthen:after,
    .theme--spore-dark-blue .location .tail__shorten:before,
    .theme--spore-dark-blue .location .tail__shorten:after,
    .theme .theme.theme--spore-dark-blue .location .icon,
    .theme .theme.theme--spore-dark-blue .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-dark-blue .location li:before,
    .theme .theme.theme--spore-dark-blue .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-dark-blue .location li:before,
    .theme .theme.theme--spore-dark-blue .location .filter__trigger:after,
    .theme .theme.theme--spore-dark-blue .location .block-link--icon:before,
    .theme .theme.theme--spore-dark-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-dark-blue .location .panel__trigger:after,
    .theme .theme.theme--spore-dark-blue .location .tail__lengthen:before,
    .theme .theme.theme--spore-dark-blue .location .tail__lengthen:after,
    .theme .theme.theme--spore-dark-blue .location .tail__shorten:before,
    .theme .theme.theme--spore-dark-blue .location .tail__shorten:after {
      color: #044e7e; }
    .location .icon.theme--spore-forest-green, .location .list--take-aways li.theme--spore-forest-green:before, .list--take-aways .location li.theme--spore-forest-green:before, .location .list--theme li.theme--spore-forest-green:before, .list--theme .location li.theme--spore-forest-green:before, .location .theme--spore-forest-green.filter__trigger:after, .location .theme--spore-forest-green.block-link--icon:before, .location .panel.is-inactive .theme--spore-forest-green.panel__trigger:after, .panel.is-inactive .location .theme--spore-forest-green.panel__trigger:after, .location .theme--spore-forest-green.tail__lengthen:before, .location .theme--spore-forest-green.tail__lengthen:after, .location .theme--spore-forest-green.tail__shorten:before, .location .theme--spore-forest-green.tail__shorten:after,
    .theme--spore-forest-green .location .icon,
    .theme--spore-forest-green .location .list--take-aways li:before,
    .list--take-aways .theme--spore-forest-green .location li:before,
    .theme--spore-forest-green .location .list--theme li:before,
    .list--theme .theme--spore-forest-green .location li:before,
    .theme--spore-forest-green .location .filter__trigger:after,
    .theme--spore-forest-green .location .block-link--icon:before,
    .theme--spore-forest-green .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-forest-green .location .panel__trigger:after,
    .theme--spore-forest-green .location .tail__lengthen:before,
    .theme--spore-forest-green .location .tail__lengthen:after,
    .theme--spore-forest-green .location .tail__shorten:before,
    .theme--spore-forest-green .location .tail__shorten:after,
    .theme .theme.theme--spore-forest-green .location .icon,
    .theme .theme.theme--spore-forest-green .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-forest-green .location li:before,
    .theme .theme.theme--spore-forest-green .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-forest-green .location li:before,
    .theme .theme.theme--spore-forest-green .location .filter__trigger:after,
    .theme .theme.theme--spore-forest-green .location .block-link--icon:before,
    .theme .theme.theme--spore-forest-green .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-forest-green .location .panel__trigger:after,
    .theme .theme.theme--spore-forest-green .location .tail__lengthen:before,
    .theme .theme.theme--spore-forest-green .location .tail__lengthen:after,
    .theme .theme.theme--spore-forest-green .location .tail__shorten:before,
    .theme .theme.theme--spore-forest-green .location .tail__shorten:after {
      color: #5f810a; }
    .location .icon.theme--spore-grey-blue, .location .list--take-aways li.theme--spore-grey-blue:before, .list--take-aways .location li.theme--spore-grey-blue:before, .location .list--theme li.theme--spore-grey-blue:before, .list--theme .location li.theme--spore-grey-blue:before, .location .theme--spore-grey-blue.filter__trigger:after, .location .theme--spore-grey-blue.block-link--icon:before, .location .panel.is-inactive .theme--spore-grey-blue.panel__trigger:after, .panel.is-inactive .location .theme--spore-grey-blue.panel__trigger:after, .location .theme--spore-grey-blue.tail__lengthen:before, .location .theme--spore-grey-blue.tail__lengthen:after, .location .theme--spore-grey-blue.tail__shorten:before, .location .theme--spore-grey-blue.tail__shorten:after,
    .theme--spore-grey-blue .location .icon,
    .theme--spore-grey-blue .location .list--take-aways li:before,
    .list--take-aways .theme--spore-grey-blue .location li:before,
    .theme--spore-grey-blue .location .list--theme li:before,
    .list--theme .theme--spore-grey-blue .location li:before,
    .theme--spore-grey-blue .location .filter__trigger:after,
    .theme--spore-grey-blue .location .block-link--icon:before,
    .theme--spore-grey-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-grey-blue .location .panel__trigger:after,
    .theme--spore-grey-blue .location .tail__lengthen:before,
    .theme--spore-grey-blue .location .tail__lengthen:after,
    .theme--spore-grey-blue .location .tail__shorten:before,
    .theme--spore-grey-blue .location .tail__shorten:after,
    .theme .theme.theme--spore-grey-blue .location .icon,
    .theme .theme.theme--spore-grey-blue .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-grey-blue .location li:before,
    .theme .theme.theme--spore-grey-blue .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-grey-blue .location li:before,
    .theme .theme.theme--spore-grey-blue .location .filter__trigger:after,
    .theme .theme.theme--spore-grey-blue .location .block-link--icon:before,
    .theme .theme.theme--spore-grey-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-grey-blue .location .panel__trigger:after,
    .theme .theme.theme--spore-grey-blue .location .tail__lengthen:before,
    .theme .theme.theme--spore-grey-blue .location .tail__lengthen:after,
    .theme .theme.theme--spore-grey-blue .location .tail__shorten:before,
    .theme .theme.theme--spore-grey-blue .location .tail__shorten:after {
      color: #6d8c9f; }
    .location .icon.theme--spore-light-blue, .location .list--take-aways li.theme--spore-light-blue:before, .list--take-aways .location li.theme--spore-light-blue:before, .location .list--theme li.theme--spore-light-blue:before, .list--theme .location li.theme--spore-light-blue:before, .location .theme--spore-light-blue.filter__trigger:after, .location .theme--spore-light-blue.block-link--icon:before, .location .panel.is-inactive .theme--spore-light-blue.panel__trigger:after, .panel.is-inactive .location .theme--spore-light-blue.panel__trigger:after, .location .theme--spore-light-blue.tail__lengthen:before, .location .theme--spore-light-blue.tail__lengthen:after, .location .theme--spore-light-blue.tail__shorten:before, .location .theme--spore-light-blue.tail__shorten:after,
    .theme--spore-light-blue .location .icon,
    .theme--spore-light-blue .location .list--take-aways li:before,
    .list--take-aways .theme--spore-light-blue .location li:before,
    .theme--spore-light-blue .location .list--theme li:before,
    .list--theme .theme--spore-light-blue .location li:before,
    .theme--spore-light-blue .location .filter__trigger:after,
    .theme--spore-light-blue .location .block-link--icon:before,
    .theme--spore-light-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-light-blue .location .panel__trigger:after,
    .theme--spore-light-blue .location .tail__lengthen:before,
    .theme--spore-light-blue .location .tail__lengthen:after,
    .theme--spore-light-blue .location .tail__shorten:before,
    .theme--spore-light-blue .location .tail__shorten:after,
    .theme .theme.theme--spore-light-blue .location .icon,
    .theme .theme.theme--spore-light-blue .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-light-blue .location li:before,
    .theme .theme.theme--spore-light-blue .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-light-blue .location li:before,
    .theme .theme.theme--spore-light-blue .location .filter__trigger:after,
    .theme .theme.theme--spore-light-blue .location .block-link--icon:before,
    .theme .theme.theme--spore-light-blue .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-light-blue .location .panel__trigger:after,
    .theme .theme.theme--spore-light-blue .location .tail__lengthen:before,
    .theme .theme.theme--spore-light-blue .location .tail__lengthen:after,
    .theme .theme.theme--spore-light-blue .location .tail__shorten:before,
    .theme .theme.theme--spore-light-blue .location .tail__shorten:after {
      color: #79accf; }
    .location .icon.theme--spore-lime, .location .list--take-aways li.theme--spore-lime:before, .list--take-aways .location li.theme--spore-lime:before, .location .list--theme li.theme--spore-lime:before, .list--theme .location li.theme--spore-lime:before, .location .theme--spore-lime.filter__trigger:after, .location .theme--spore-lime.block-link--icon:before, .location .panel.is-inactive .theme--spore-lime.panel__trigger:after, .panel.is-inactive .location .theme--spore-lime.panel__trigger:after, .location .theme--spore-lime.tail__lengthen:before, .location .theme--spore-lime.tail__lengthen:after, .location .theme--spore-lime.tail__shorten:before, .location .theme--spore-lime.tail__shorten:after,
    .theme--spore-lime .location .icon,
    .theme--spore-lime .location .list--take-aways li:before,
    .list--take-aways .theme--spore-lime .location li:before,
    .theme--spore-lime .location .list--theme li:before,
    .list--theme .theme--spore-lime .location li:before,
    .theme--spore-lime .location .filter__trigger:after,
    .theme--spore-lime .location .block-link--icon:before,
    .theme--spore-lime .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-lime .location .panel__trigger:after,
    .theme--spore-lime .location .tail__lengthen:before,
    .theme--spore-lime .location .tail__lengthen:after,
    .theme--spore-lime .location .tail__shorten:before,
    .theme--spore-lime .location .tail__shorten:after,
    .theme .theme.theme--spore-lime .location .icon,
    .theme .theme.theme--spore-lime .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-lime .location li:before,
    .theme .theme.theme--spore-lime .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-lime .location li:before,
    .theme .theme.theme--spore-lime .location .filter__trigger:after,
    .theme .theme.theme--spore-lime .location .block-link--icon:before,
    .theme .theme.theme--spore-lime .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-lime .location .panel__trigger:after,
    .theme .theme.theme--spore-lime .location .tail__lengthen:before,
    .theme .theme.theme--spore-lime .location .tail__lengthen:after,
    .theme .theme.theme--spore-lime .location .tail__shorten:before,
    .theme .theme.theme--spore-lime .location .tail__shorten:after {
      color: #bbae03; }
    .location .icon.theme--spore-ochre, .location .list--take-aways li.theme--spore-ochre:before, .list--take-aways .location li.theme--spore-ochre:before, .location .list--theme li.theme--spore-ochre:before, .list--theme .location li.theme--spore-ochre:before, .location .theme--spore-ochre.filter__trigger:after, .location .theme--spore-ochre.block-link--icon:before, .location .panel.is-inactive .theme--spore-ochre.panel__trigger:after, .panel.is-inactive .location .theme--spore-ochre.panel__trigger:after, .location .theme--spore-ochre.tail__lengthen:before, .location .theme--spore-ochre.tail__lengthen:after, .location .theme--spore-ochre.tail__shorten:before, .location .theme--spore-ochre.tail__shorten:after,
    .theme--spore-ochre .location .icon,
    .theme--spore-ochre .location .list--take-aways li:before,
    .list--take-aways .theme--spore-ochre .location li:before,
    .theme--spore-ochre .location .list--theme li:before,
    .list--theme .theme--spore-ochre .location li:before,
    .theme--spore-ochre .location .filter__trigger:after,
    .theme--spore-ochre .location .block-link--icon:before,
    .theme--spore-ochre .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-ochre .location .panel__trigger:after,
    .theme--spore-ochre .location .tail__lengthen:before,
    .theme--spore-ochre .location .tail__lengthen:after,
    .theme--spore-ochre .location .tail__shorten:before,
    .theme--spore-ochre .location .tail__shorten:after,
    .theme .theme.theme--spore-ochre .location .icon,
    .theme .theme.theme--spore-ochre .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-ochre .location li:before,
    .theme .theme.theme--spore-ochre .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-ochre .location li:before,
    .theme .theme.theme--spore-ochre .location .filter__trigger:after,
    .theme .theme.theme--spore-ochre .location .block-link--icon:before,
    .theme .theme.theme--spore-ochre .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-ochre .location .panel__trigger:after,
    .theme .theme.theme--spore-ochre .location .tail__lengthen:before,
    .theme .theme.theme--spore-ochre .location .tail__lengthen:after,
    .theme .theme.theme--spore-ochre .location .tail__shorten:before,
    .theme .theme.theme--spore-ochre .location .tail__shorten:after {
      color: #db9623; }
    .location .icon.theme--spore-olive-green, .location .list--take-aways li.theme--spore-olive-green:before, .list--take-aways .location li.theme--spore-olive-green:before, .location .list--theme li.theme--spore-olive-green:before, .list--theme .location li.theme--spore-olive-green:before, .location .theme--spore-olive-green.filter__trigger:after, .location .theme--spore-olive-green.block-link--icon:before, .location .panel.is-inactive .theme--spore-olive-green.panel__trigger:after, .panel.is-inactive .location .theme--spore-olive-green.panel__trigger:after, .location .theme--spore-olive-green.tail__lengthen:before, .location .theme--spore-olive-green.tail__lengthen:after, .location .theme--spore-olive-green.tail__shorten:before, .location .theme--spore-olive-green.tail__shorten:after,
    .theme--spore-olive-green .location .icon,
    .theme--spore-olive-green .location .list--take-aways li:before,
    .list--take-aways .theme--spore-olive-green .location li:before,
    .theme--spore-olive-green .location .list--theme li:before,
    .list--theme .theme--spore-olive-green .location li:before,
    .theme--spore-olive-green .location .filter__trigger:after,
    .theme--spore-olive-green .location .block-link--icon:before,
    .theme--spore-olive-green .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-olive-green .location .panel__trigger:after,
    .theme--spore-olive-green .location .tail__lengthen:before,
    .theme--spore-olive-green .location .tail__lengthen:after,
    .theme--spore-olive-green .location .tail__shorten:before,
    .theme--spore-olive-green .location .tail__shorten:after,
    .theme .theme.theme--spore-olive-green .location .icon,
    .theme .theme.theme--spore-olive-green .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-olive-green .location li:before,
    .theme .theme.theme--spore-olive-green .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-olive-green .location li:before,
    .theme .theme.theme--spore-olive-green .location .filter__trigger:after,
    .theme .theme.theme--spore-olive-green .location .block-link--icon:before,
    .theme .theme.theme--spore-olive-green .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-olive-green .location .panel__trigger:after,
    .theme .theme.theme--spore-olive-green .location .tail__lengthen:before,
    .theme .theme.theme--spore-olive-green .location .tail__lengthen:after,
    .theme .theme.theme--spore-olive-green .location .tail__shorten:before,
    .theme .theme.theme--spore-olive-green .location .tail__shorten:after {
      color: #778d3e; }
    .location .icon.theme--spore-red, .location .list--take-aways li.theme--spore-red:before, .list--take-aways .location li.theme--spore-red:before, .location .list--theme li.theme--spore-red:before, .list--theme .location li.theme--spore-red:before, .location .theme--spore-red.filter__trigger:after, .location .theme--spore-red.block-link--icon:before, .location .panel.is-inactive .theme--spore-red.panel__trigger:after, .panel.is-inactive .location .theme--spore-red.panel__trigger:after, .location .theme--spore-red.tail__lengthen:before, .location .theme--spore-red.tail__lengthen:after, .location .theme--spore-red.tail__shorten:before, .location .theme--spore-red.tail__shorten:after,
    .theme--spore-red .location .icon,
    .theme--spore-red .location .list--take-aways li:before,
    .list--take-aways .theme--spore-red .location li:before,
    .theme--spore-red .location .list--theme li:before,
    .list--theme .theme--spore-red .location li:before,
    .theme--spore-red .location .filter__trigger:after,
    .theme--spore-red .location .block-link--icon:before,
    .theme--spore-red .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-red .location .panel__trigger:after,
    .theme--spore-red .location .tail__lengthen:before,
    .theme--spore-red .location .tail__lengthen:after,
    .theme--spore-red .location .tail__shorten:before,
    .theme--spore-red .location .tail__shorten:after,
    .theme .theme.theme--spore-red .location .icon,
    .theme .theme.theme--spore-red .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-red .location li:before,
    .theme .theme.theme--spore-red .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-red .location li:before,
    .theme .theme.theme--spore-red .location .filter__trigger:after,
    .theme .theme.theme--spore-red .location .block-link--icon:before,
    .theme .theme.theme--spore-red .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-red .location .panel__trigger:after,
    .theme .theme.theme--spore-red .location .tail__lengthen:before,
    .theme .theme.theme--spore-red .location .tail__lengthen:after,
    .theme .theme.theme--spore-red .location .tail__shorten:before,
    .theme .theme.theme--spore-red .location .tail__shorten:after {
      color: #f54c23; }
    .location .icon.theme--spore-taupe, .location .list--take-aways li.theme--spore-taupe:before, .list--take-aways .location li.theme--spore-taupe:before, .location .list--theme li.theme--spore-taupe:before, .list--theme .location li.theme--spore-taupe:before, .location .theme--spore-taupe.filter__trigger:after, .location .theme--spore-taupe.block-link--icon:before, .location .panel.is-inactive .theme--spore-taupe.panel__trigger:after, .panel.is-inactive .location .theme--spore-taupe.panel__trigger:after, .location .theme--spore-taupe.tail__lengthen:before, .location .theme--spore-taupe.tail__lengthen:after, .location .theme--spore-taupe.tail__shorten:before, .location .theme--spore-taupe.tail__shorten:after,
    .theme--spore-taupe .location .icon,
    .theme--spore-taupe .location .list--take-aways li:before,
    .list--take-aways .theme--spore-taupe .location li:before,
    .theme--spore-taupe .location .list--theme li:before,
    .list--theme .theme--spore-taupe .location li:before,
    .theme--spore-taupe .location .filter__trigger:after,
    .theme--spore-taupe .location .block-link--icon:before,
    .theme--spore-taupe .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-taupe .location .panel__trigger:after,
    .theme--spore-taupe .location .tail__lengthen:before,
    .theme--spore-taupe .location .tail__lengthen:after,
    .theme--spore-taupe .location .tail__shorten:before,
    .theme--spore-taupe .location .tail__shorten:after,
    .theme .theme.theme--spore-taupe .location .icon,
    .theme .theme.theme--spore-taupe .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-taupe .location li:before,
    .theme .theme.theme--spore-taupe .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-taupe .location li:before,
    .theme .theme.theme--spore-taupe .location .filter__trigger:after,
    .theme .theme.theme--spore-taupe .location .block-link--icon:before,
    .theme .theme.theme--spore-taupe .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-taupe .location .panel__trigger:after,
    .theme .theme.theme--spore-taupe .location .tail__lengthen:before,
    .theme .theme.theme--spore-taupe .location .tail__lengthen:after,
    .theme .theme.theme--spore-taupe .location .tail__shorten:before,
    .theme .theme.theme--spore-taupe .location .tail__shorten:after {
      color: #7b6d65; }
    .location .icon.theme--spore-teal, .location .list--take-aways li.theme--spore-teal:before, .list--take-aways .location li.theme--spore-teal:before, .location .list--theme li.theme--spore-teal:before, .list--theme .location li.theme--spore-teal:before, .location .theme--spore-teal.filter__trigger:after, .location .theme--spore-teal.block-link--icon:before, .location .panel.is-inactive .theme--spore-teal.panel__trigger:after, .panel.is-inactive .location .theme--spore-teal.panel__trigger:after, .location .theme--spore-teal.tail__lengthen:before, .location .theme--spore-teal.tail__lengthen:after, .location .theme--spore-teal.tail__shorten:before, .location .theme--spore-teal.tail__shorten:after,
    .theme--spore-teal .location .icon,
    .theme--spore-teal .location .list--take-aways li:before,
    .list--take-aways .theme--spore-teal .location li:before,
    .theme--spore-teal .location .list--theme li:before,
    .list--theme .theme--spore-teal .location li:before,
    .theme--spore-teal .location .filter__trigger:after,
    .theme--spore-teal .location .block-link--icon:before,
    .theme--spore-teal .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme--spore-teal .location .panel__trigger:after,
    .theme--spore-teal .location .tail__lengthen:before,
    .theme--spore-teal .location .tail__lengthen:after,
    .theme--spore-teal .location .tail__shorten:before,
    .theme--spore-teal .location .tail__shorten:after,
    .theme .theme.theme--spore-teal .location .icon,
    .theme .theme.theme--spore-teal .location .list--take-aways li:before,
    .list--take-aways .theme .theme.theme--spore-teal .location li:before,
    .theme .theme.theme--spore-teal .location .list--theme li:before,
    .list--theme .theme .theme.theme--spore-teal .location li:before,
    .theme .theme.theme--spore-teal .location .filter__trigger:after,
    .theme .theme.theme--spore-teal .location .block-link--icon:before,
    .theme .theme.theme--spore-teal .location .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .theme .theme.theme--spore-teal .location .panel__trigger:after,
    .theme .theme.theme--spore-teal .location .tail__lengthen:before,
    .theme .theme.theme--spore-teal .location .tail__lengthen:after,
    .theme .theme.theme--spore-teal .location .tail__shorten:before,
    .theme .theme.theme--spore-teal .location .tail__shorten:after {
      color: #077fc1; }
  @media only screen and (min-width: 64em) {
    .location {
      /* regular meta */
      font-size: 0.875em;
      line-height: 1.07143; } }

/*
Location map asset

markup:
<div class="media  |  location  |  location__map-asset">
  <span class="icon icon--theme icon--map-marker"></span>
  <div class="location__body  |  media__content">
    <span class="is-narrative">Location:</span></span> Wageningen, Gelderland, The Netherlands</span>
  </div>
</div>

Styleguide 3.19.1
*/
.location.map__asset {
  position: relative;
  padding-left: 2em; }
  .location.map__asset .icon, .location.map__asset .list--take-aways li:before, .list--take-aways .location.map__asset li:before, .location.map__asset .list--theme li:before, .list--theme .location.map__asset li:before, .location.map__asset .filter__trigger:after, .location.map__asset .block-link--icon:before, .location.map__asset .panel.is-inactive .panel__trigger:after, .panel.is-inactive .location.map__asset .panel__trigger:after, .location.map__asset .tail__lengthen:before, .location.map__asset .tail__lengthen:after, .location.map__asset .tail__shorten:before, .location.map__asset .tail__shorten:after {
    position: absolute;
    left: 0;
    top: 0; }

/* 3.20 Datepicker */
/*
Datepicker

markup:
<button class="picker-trigger reset" data-toggle=".picker__holder" data-icon="home"></button>
<div class="picker__holder" tabindex="-1">
    <div class="picker__frame">
        <div class="picker__wrap">
            <div class="picker__box">
                <div class="picker__header">
                    <div class="picker__month">February</div>
                    <div class="picker__year">2017</div>
                    <div class="picker__nav--prev" data-nav="-1" role="button" aria-controls="P572228808_table" title="Previous month"> </div>
                    <div class="picker__nav--next" data-nav="1" role="button" aria-controls="P572228808_table" title="Next month"> </div>
                </div>
                <table class="picker__table" id="P572228808_table" role="grid" aria-controls="P572228808" aria-readonly="true">
                    <thead>
                        <tr>
                            <th class="picker__weekday" scope="col" title="Sunday">M</th>
                            <th class="picker__weekday" scope="col" title="Monday">T</th>
                            <th class="picker__weekday" scope="col" title="Tuesday">W</th>
                            <th class="picker__weekday" scope="col" title="Wednesday">T</th>
                            <th class="picker__weekday" scope="col" title="Thursday">F</th>
                            <th class="picker__weekday" scope="col" title="Friday">S</th>
                            <th class="picker__weekday" scope="col" title="Saturday">S</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td role="presentation">
                                <div class="picker__day picker__day--outfocus" data-pick="1485644400000" role="gridcell" aria-label="29 January, 2017">29</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--outfocus" data-pick="1485730800000" role="gridcell" aria-label="30 January, 2017">30</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--outfocus" data-pick="1485817200000" role="gridcell" aria-label="31 January, 2017">31</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus picker__day--today" data-pick="1485903600000" role="gridcell" aria-label="1 February, 2017">1</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1485990000000" role="gridcell" aria-label="2 February, 2017">2</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486076400000" role="gridcell" aria-label="3 February, 2017">3</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486162800000" role="gridcell" aria-label="4 February, 2017">4</div>
                            </td>
                        </tr>
                        <tr>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486249200000" role="gridcell" aria-label="5 February, 2017">5</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486335600000" role="gridcell" aria-label="6 February, 2017">6</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486422000000" role="gridcell" aria-label="7 February, 2017">7</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486508400000" role="gridcell" aria-label="8 February, 2017">8</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486594800000" role="gridcell" aria-label="9 February, 2017">9</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486681200000" role="gridcell" aria-label="10 February, 2017">10</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486767600000" role="gridcell" aria-label="11 February, 2017">11</div>
                            </td>
                        </tr>
                        <tr>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486854000000" role="gridcell" aria-label="12 February, 2017">12</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1486940400000" role="gridcell" aria-label="13 February, 2017">13</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus picker__day--selected picker__day--highlighted" data-pick="1487026800000" role="gridcell" aria-label="14 February, 2017" aria-selected="true" aria-activedescendant="true">14</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487113200000" role="gridcell" aria-label="15 February, 2017">15</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487199600000" role="gridcell" aria-label="16 February, 2017">16</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487286000000" role="gridcell" aria-label="17 February, 2017">17</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487372400000" role="gridcell" aria-label="18 February, 2017">18</div>
                            </td>
                        </tr>
                        <tr>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487458800000" role="gridcell" aria-label="19 February, 2017">19</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487545200000" role="gridcell" aria-label="20 February, 2017">20</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487631600000" role="gridcell" aria-label="21 February, 2017">21</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487718000000" role="gridcell" aria-label="22 February, 2017">22</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487804400000" role="gridcell" aria-label="23 February, 2017">23</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487890800000" role="gridcell" aria-label="24 February, 2017">24</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1487977200000" role="gridcell" aria-label="25 February, 2017">25</div>
                            </td>
                        </tr>
                        <tr>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1488063600000" role="gridcell" aria-label="26 February, 2017">26</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1488150000000" role="gridcell" aria-label="27 February, 2017">27</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--infocus" data-pick="1488236400000" role="gridcell" aria-label="28 February, 2017">28</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--outfocus" data-pick="1488322800000" role="gridcell" aria-label="1 March, 2017">1</div>
                            </td>
                            <td role="presentation">
                                <div class="picker__day picker__day--outfocus" data-pick="1488409200000" role="gridcell" aria-label="2 March, 2017">2</div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

sg-wrapper:
<div class="layout">
  <div class="layout__cell layout__cell--aside">
    <sg-wrapper-content/>
  </div>
  <div class="layout__cell layout__cell--main layout">
  </div>
</div>

Styleguide 3.20
*/
/*
Datepicker themes

.theme--blue - Blue
.theme--lime - Lime
.theme--yellow - Yellow
.theme--gold - Gold
.theme--salmon - Salmon
.theme--orange - Orange
.theme--red - Red
.theme--burgundy - Burgundy
.theme--purple - Purple

markup:
<div class="{$modifiers}">
  <div class="picker__holder" tabindex="-1">
      <div class="picker__frame">
          <div class="picker__wrap">
              <div class="picker__box">
                  <div class="picker__header">
                      <div class="picker__month">February</div>
                      <div class="picker__year">2017</div>
                      <div class="picker__nav--prev" data-nav="-1" role="button" aria-controls="P572228808_table" title="Previous month"> </div>
                      <div class="picker__nav--next" data-nav="1" role="button" aria-controls="P572228808_table" title="Next month"> </div>
                  </div>
                  <table class="picker__table" id="P572228808_table" role="grid" aria-controls="P572228808" aria-readonly="true">
                      <thead>
                          <tr>
                              <th class="picker__weekday" scope="col" title="Sunday">M</th>
                              <th class="picker__weekday" scope="col" title="Monday">T</th>
                              <th class="picker__weekday" scope="col" title="Tuesday">W</th>
                              <th class="picker__weekday" scope="col" title="Wednesday">T</th>
                              <th class="picker__weekday" scope="col" title="Thursday">F</th>
                              <th class="picker__weekday" scope="col" title="Friday">S</th>
                              <th class="picker__weekday" scope="col" title="Saturday">S</th>
                          </tr>
                      </thead>
                      <tbody>
                          <tr>
                              <td role="presentation">
                                  <div class="picker__day picker__day--outfocus" data-pick="1485644400000" role="gridcell" aria-label="29 January, 2017">29</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--outfocus" data-pick="1485730800000" role="gridcell" aria-label="30 January, 2017">30</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--outfocus" data-pick="1485817200000" role="gridcell" aria-label="31 January, 2017">31</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus picker__day--today" data-pick="1485903600000" role="gridcell" aria-label="1 February, 2017">1</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1485990000000" role="gridcell" aria-label="2 February, 2017">2</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486076400000" role="gridcell" aria-label="3 February, 2017">3</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486162800000" role="gridcell" aria-label="4 February, 2017">4</div>
                              </td>
                          </tr>
                          <tr>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486249200000" role="gridcell" aria-label="5 February, 2017">5</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486335600000" role="gridcell" aria-label="6 February, 2017">6</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486422000000" role="gridcell" aria-label="7 February, 2017">7</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486508400000" role="gridcell" aria-label="8 February, 2017">8</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486594800000" role="gridcell" aria-label="9 February, 2017">9</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486681200000" role="gridcell" aria-label="10 February, 2017">10</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486767600000" role="gridcell" aria-label="11 February, 2017">11</div>
                              </td>
                          </tr>
                          <tr>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486854000000" role="gridcell" aria-label="12 February, 2017">12</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1486940400000" role="gridcell" aria-label="13 February, 2017">13</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus picker__day--selected picker__day--highlighted" data-pick="1487026800000" role="gridcell" aria-label="14 February, 2017" aria-selected="true" aria-activedescendant="true">14</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487113200000" role="gridcell" aria-label="15 February, 2017">15</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487199600000" role="gridcell" aria-label="16 February, 2017">16</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487286000000" role="gridcell" aria-label="17 February, 2017">17</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487372400000" role="gridcell" aria-label="18 February, 2017">18</div>
                              </td>
                          </tr>
                          <tr>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487458800000" role="gridcell" aria-label="19 February, 2017">19</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487545200000" role="gridcell" aria-label="20 February, 2017">20</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487631600000" role="gridcell" aria-label="21 February, 2017">21</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487718000000" role="gridcell" aria-label="22 February, 2017">22</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487804400000" role="gridcell" aria-label="23 February, 2017">23</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487890800000" role="gridcell" aria-label="24 February, 2017">24</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1487977200000" role="gridcell" aria-label="25 February, 2017">25</div>
                              </td>
                          </tr>
                          <tr>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1488063600000" role="gridcell" aria-label="26 February, 2017">26</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1488150000000" role="gridcell" aria-label="27 February, 2017">27</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--infocus" data-pick="1488236400000" role="gridcell" aria-label="28 February, 2017">28</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--outfocus" data-pick="1488322800000" role="gridcell" aria-label="1 March, 2017">1</div>
                              </td>
                              <td role="presentation">
                                  <div class="picker__day picker__day--outfocus" data-pick="1488409200000" role="gridcell" aria-label="2 March, 2017">2</div>
                              </td>
                          </tr>
                      </tbody>
                  </table>
              </div>
          </div>
      </div>
  </div>
</div>

Styleguide 3.20.1
*/
.picker-trigger {
  display: block;
  background: transparent;
  color: #67ab43;
  color: #67ab43; }
  .picker-trigger.theme--dark,
  .theme--dark .picker-trigger,
  .theme .theme.theme--dark .picker-trigger {
    color: #3d3d3d; }
  .picker-trigger.theme--green,
  .theme--green .picker-trigger,
  .theme .theme.theme--green .picker-trigger {
    color: #67ab43; }
  .picker-trigger.theme--blue,
  .theme--blue .picker-trigger,
  .theme .theme.theme--blue .picker-trigger {
    color: #56c0dd; }
  .picker-trigger.theme--lime,
  .theme--lime .picker-trigger,
  .theme .theme.theme--lime .picker-trigger {
    color: #c1d435; }
  .picker-trigger.theme--yellow,
  .theme--yellow .picker-trigger,
  .theme .theme.theme--yellow .picker-trigger {
    color: #facf21; }
  .picker-trigger.theme--gold,
  .theme--gold .picker-trigger,
  .theme .theme.theme--gold .picker-trigger {
    color: #eb942c; }
  .picker-trigger.theme--orange,
  .theme--orange .picker-trigger,
  .theme .theme.theme--orange .picker-trigger {
    color: #e26435; }
  .picker-trigger.theme--salmon,
  .theme--salmon .picker-trigger,
  .theme .theme.theme--salmon .picker-trigger {
    color: #eb735d; }
  .picker-trigger.theme--red,
  .theme--red .picker-trigger,
  .theme .theme.theme--red .picker-trigger {
    color: #ec2d10; }
  .picker-trigger.theme--burgundy,
  .theme--burgundy .picker-trigger,
  .theme .theme.theme--burgundy .picker-trigger {
    color: #ba222a; }
  .picker-trigger.theme--purple,
  .theme--purple .picker-trigger,
  .theme .theme.theme--purple .picker-trigger {
    color: #9b3381; }
  .picker-trigger.theme--youth,
  .theme--youth .picker-trigger,
  .theme .theme.theme--youth .picker-trigger {
    color: #d57800; }
  .picker-trigger.theme--digitalisation,
  .theme--digitalisation .picker-trigger,
  .theme .theme.theme--digitalisation .picker-trigger {
    color: #9a3324; }
  .picker-trigger.theme--climate,
  .theme--climate .picker-trigger,
  .theme .theme.theme--climate .picker-trigger {
    color: #693c5e; }
  .picker-trigger.theme--gender,
  .theme--gender .picker-trigger,
  .theme .theme.theme--gender .picker-trigger {
    color: #046a38; }
  .picker-trigger.theme--nutrition,
  .theme--nutrition .picker-trigger,
  .theme .theme.theme--nutrition .picker-trigger {
    color: #487a7b; }
  .picker-trigger.theme--blog,
  .theme--blog .picker-trigger,
  .theme .theme.theme--blog .picker-trigger {
    color: #ffa300; }
  .picker-trigger.theme--spore-blue,
  .theme--spore-blue .picker-trigger,
  .theme .theme.theme--spore-blue .picker-trigger {
    color: #3f68b1; }
  .picker-trigger.theme--spore-brown,
  .theme--spore-brown .picker-trigger,
  .theme .theme.theme--spore-brown .picker-trigger {
    color: #774b04; }
  .picker-trigger.theme--spore-dark-blue,
  .theme--spore-dark-blue .picker-trigger,
  .theme .theme.theme--spore-dark-blue .picker-trigger {
    color: #044e7e; }
  .picker-trigger.theme--spore-forest-green,
  .theme--spore-forest-green .picker-trigger,
  .theme .theme.theme--spore-forest-green .picker-trigger {
    color: #5f810a; }
  .picker-trigger.theme--spore-grey-blue,
  .theme--spore-grey-blue .picker-trigger,
  .theme .theme.theme--spore-grey-blue .picker-trigger {
    color: #6d8c9f; }
  .picker-trigger.theme--spore-light-blue,
  .theme--spore-light-blue .picker-trigger,
  .theme .theme.theme--spore-light-blue .picker-trigger {
    color: #79accf; }
  .picker-trigger.theme--spore-lime,
  .theme--spore-lime .picker-trigger,
  .theme .theme.theme--spore-lime .picker-trigger {
    color: #bbae03; }
  .picker-trigger.theme--spore-ochre,
  .theme--spore-ochre .picker-trigger,
  .theme .theme.theme--spore-ochre .picker-trigger {
    color: #db9623; }
  .picker-trigger.theme--spore-olive-green,
  .theme--spore-olive-green .picker-trigger,
  .theme .theme.theme--spore-olive-green .picker-trigger {
    color: #778d3e; }
  .picker-trigger.theme--spore-red,
  .theme--spore-red .picker-trigger,
  .theme .theme.theme--spore-red .picker-trigger {
    color: #f54c23; }
  .picker-trigger.theme--spore-taupe,
  .theme--spore-taupe .picker-trigger,
  .theme .theme.theme--spore-taupe .picker-trigger {
    color: #7b6d65; }
  .picker-trigger.theme--spore-teal,
  .theme--spore-teal .picker-trigger,
  .theme .theme.theme--spore-teal .picker-trigger {
    color: #077fc1; }
  .picker-trigger.is-active {
    opacity: 0.7; }
  @media only screen and (min-width: 48em) {
    .picker-trigger {
      display: none; } }

.picker__holder {
  font-weight: 600;
  padding-left: 15px;
  padding-right: 15px;
  font-size: 0.75em;
  position: absolute;
  left: 0;
  width: 100%;
  color: #3d3d3d;
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  max-height: 0;
  background: #fff;
  overflow: hidden;
  z-index: 10; }
  @media only screen and (min-width: 48em) {
    .picker__holder {
      position: relative;
      width: auto;
      left: auto;
      border: none;
      font-size: 0.875em;
      max-height: 31.25em;
      padding-left: 0;
      padding-right: 0; } }
  .picker__holder.is-active {
    max-height: 31.25em; }
  .picker__holder td {
    text-align: center;
    width: 14.28571%;
    border-collapse: collapse;
    padding: 1.5px; }
    @media only screen and (min-width: 48em) {
      .picker__holder td {
        padding: 0px; } }

.picker__frame {
  border: 1px solid #b3b3b3; }
  @media only screen and (min-width: 48em) {
    .picker__frame {
      border: none; } }

.picker__weekday {
  padding-bottom: 9px;
  font-weight: bold;
  text-align: center;
  width: 14.28571%; }

.picker__weekday,
.picker__day--today {
  color: #67ab43;
  color: #67ab43; }
  .picker__weekday.theme--dark,
  .theme--dark .picker__weekday,
  .theme .theme.theme--dark .picker__weekday,
  .picker__day--today.theme--dark,
  .theme--dark
  .picker__day--today,
  .theme .theme.theme--dark
  .picker__day--today {
    color: #3d3d3d; }
  .picker__weekday.theme--green,
  .theme--green .picker__weekday,
  .theme .theme.theme--green .picker__weekday,
  .picker__day--today.theme--green,
  .theme--green
  .picker__day--today,
  .theme .theme.theme--green
  .picker__day--today {
    color: #67ab43; }
  .picker__weekday.theme--blue,
  .theme--blue .picker__weekday,
  .theme .theme.theme--blue .picker__weekday,
  .picker__day--today.theme--blue,
  .theme--blue
  .picker__day--today,
  .theme .theme.theme--blue
  .picker__day--today {
    color: #56c0dd; }
  .picker__weekday.theme--lime,
  .theme--lime .picker__weekday,
  .theme .theme.theme--lime .picker__weekday,
  .picker__day--today.theme--lime,
  .theme--lime
  .picker__day--today,
  .theme .theme.theme--lime
  .picker__day--today {
    color: #c1d435; }
  .picker__weekday.theme--yellow,
  .theme--yellow .picker__weekday,
  .theme .theme.theme--yellow .picker__weekday,
  .picker__day--today.theme--yellow,
  .theme--yellow
  .picker__day--today,
  .theme .theme.theme--yellow
  .picker__day--today {
    color: #facf21; }
  .picker__weekday.theme--gold,
  .theme--gold .picker__weekday,
  .theme .theme.theme--gold .picker__weekday,
  .picker__day--today.theme--gold,
  .theme--gold
  .picker__day--today,
  .theme .theme.theme--gold
  .picker__day--today {
    color: #eb942c; }
  .picker__weekday.theme--orange,
  .theme--orange .picker__weekday,
  .theme .theme.theme--orange .picker__weekday,
  .picker__day--today.theme--orange,
  .theme--orange
  .picker__day--today,
  .theme .theme.theme--orange
  .picker__day--today {
    color: #e26435; }
  .picker__weekday.theme--salmon,
  .theme--salmon .picker__weekday,
  .theme .theme.theme--salmon .picker__weekday,
  .picker__day--today.theme--salmon,
  .theme--salmon
  .picker__day--today,
  .theme .theme.theme--salmon
  .picker__day--today {
    color: #eb735d; }
  .picker__weekday.theme--red,
  .theme--red .picker__weekday,
  .theme .theme.theme--red .picker__weekday,
  .picker__day--today.theme--red,
  .theme--red
  .picker__day--today,
  .theme .theme.theme--red
  .picker__day--today {
    color: #ec2d10; }
  .picker__weekday.theme--burgundy,
  .theme--burgundy .picker__weekday,
  .theme .theme.theme--burgundy .picker__weekday,
  .picker__day--today.theme--burgundy,
  .theme--burgundy
  .picker__day--today,
  .theme .theme.theme--burgundy
  .picker__day--today {
    color: #ba222a; }
  .picker__weekday.theme--purple,
  .theme--purple .picker__weekday,
  .theme .theme.theme--purple .picker__weekday,
  .picker__day--today.theme--purple,
  .theme--purple
  .picker__day--today,
  .theme .theme.theme--purple
  .picker__day--today {
    color: #9b3381; }
  .picker__weekday.theme--youth,
  .theme--youth .picker__weekday,
  .theme .theme.theme--youth .picker__weekday,
  .picker__day--today.theme--youth,
  .theme--youth
  .picker__day--today,
  .theme .theme.theme--youth
  .picker__day--today {
    color: #d57800; }
  .picker__weekday.theme--digitalisation,
  .theme--digitalisation .picker__weekday,
  .theme .theme.theme--digitalisation .picker__weekday,
  .picker__day--today.theme--digitalisation,
  .theme--digitalisation
  .picker__day--today,
  .theme .theme.theme--digitalisation
  .picker__day--today {
    color: #9a3324; }
  .picker__weekday.theme--climate,
  .theme--climate .picker__weekday,
  .theme .theme.theme--climate .picker__weekday,
  .picker__day--today.theme--climate,
  .theme--climate
  .picker__day--today,
  .theme .theme.theme--climate
  .picker__day--today {
    color: #693c5e; }
  .picker__weekday.theme--gender,
  .theme--gender .picker__weekday,
  .theme .theme.theme--gender .picker__weekday,
  .picker__day--today.theme--gender,
  .theme--gender
  .picker__day--today,
  .theme .theme.theme--gender
  .picker__day--today {
    color: #046a38; }
  .picker__weekday.theme--nutrition,
  .theme--nutrition .picker__weekday,
  .theme .theme.theme--nutrition .picker__weekday,
  .picker__day--today.theme--nutrition,
  .theme--nutrition
  .picker__day--today,
  .theme .theme.theme--nutrition
  .picker__day--today {
    color: #487a7b; }
  .picker__weekday.theme--blog,
  .theme--blog .picker__weekday,
  .theme .theme.theme--blog .picker__weekday,
  .picker__day--today.theme--blog,
  .theme--blog
  .picker__day--today,
  .theme .theme.theme--blog
  .picker__day--today {
    color: #ffa300; }
  .picker__weekday.theme--spore-blue,
  .theme--spore-blue .picker__weekday,
  .theme .theme.theme--spore-blue .picker__weekday,
  .picker__day--today.theme--spore-blue,
  .theme--spore-blue
  .picker__day--today,
  .theme .theme.theme--spore-blue
  .picker__day--today {
    color: #3f68b1; }
  .picker__weekday.theme--spore-brown,
  .theme--spore-brown .picker__weekday,
  .theme .theme.theme--spore-brown .picker__weekday,
  .picker__day--today.theme--spore-brown,
  .theme--spore-brown
  .picker__day--today,
  .theme .theme.theme--spore-brown
  .picker__day--today {
    color: #774b04; }
  .picker__weekday.theme--spore-dark-blue,
  .theme--spore-dark-blue .picker__weekday,
  .theme .theme.theme--spore-dark-blue .picker__weekday,
  .picker__day--today.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .picker__day--today,
  .theme .theme.theme--spore-dark-blue
  .picker__day--today {
    color: #044e7e; }
  .picker__weekday.theme--spore-forest-green,
  .theme--spore-forest-green .picker__weekday,
  .theme .theme.theme--spore-forest-green .picker__weekday,
  .picker__day--today.theme--spore-forest-green,
  .theme--spore-forest-green
  .picker__day--today,
  .theme .theme.theme--spore-forest-green
  .picker__day--today {
    color: #5f810a; }
  .picker__weekday.theme--spore-grey-blue,
  .theme--spore-grey-blue .picker__weekday,
  .theme .theme.theme--spore-grey-blue .picker__weekday,
  .picker__day--today.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .picker__day--today,
  .theme .theme.theme--spore-grey-blue
  .picker__day--today {
    color: #6d8c9f; }
  .picker__weekday.theme--spore-light-blue,
  .theme--spore-light-blue .picker__weekday,
  .theme .theme.theme--spore-light-blue .picker__weekday,
  .picker__day--today.theme--spore-light-blue,
  .theme--spore-light-blue
  .picker__day--today,
  .theme .theme.theme--spore-light-blue
  .picker__day--today {
    color: #79accf; }
  .picker__weekday.theme--spore-lime,
  .theme--spore-lime .picker__weekday,
  .theme .theme.theme--spore-lime .picker__weekday,
  .picker__day--today.theme--spore-lime,
  .theme--spore-lime
  .picker__day--today,
  .theme .theme.theme--spore-lime
  .picker__day--today {
    color: #bbae03; }
  .picker__weekday.theme--spore-ochre,
  .theme--spore-ochre .picker__weekday,
  .theme .theme.theme--spore-ochre .picker__weekday,
  .picker__day--today.theme--spore-ochre,
  .theme--spore-ochre
  .picker__day--today,
  .theme .theme.theme--spore-ochre
  .picker__day--today {
    color: #db9623; }
  .picker__weekday.theme--spore-olive-green,
  .theme--spore-olive-green .picker__weekday,
  .theme .theme.theme--spore-olive-green .picker__weekday,
  .picker__day--today.theme--spore-olive-green,
  .theme--spore-olive-green
  .picker__day--today,
  .theme .theme.theme--spore-olive-green
  .picker__day--today {
    color: #778d3e; }
  .picker__weekday.theme--spore-red,
  .theme--spore-red .picker__weekday,
  .theme .theme.theme--spore-red .picker__weekday,
  .picker__day--today.theme--spore-red,
  .theme--spore-red
  .picker__day--today,
  .theme .theme.theme--spore-red
  .picker__day--today {
    color: #f54c23; }
  .picker__weekday.theme--spore-taupe,
  .theme--spore-taupe .picker__weekday,
  .theme .theme.theme--spore-taupe .picker__weekday,
  .picker__day--today.theme--spore-taupe,
  .theme--spore-taupe
  .picker__day--today,
  .theme .theme.theme--spore-taupe
  .picker__day--today {
    color: #7b6d65; }
  .picker__weekday.theme--spore-teal,
  .theme--spore-teal .picker__weekday,
  .theme .theme.theme--spore-teal .picker__weekday,
  .picker__day--today.theme--spore-teal,
  .theme--spore-teal
  .picker__day--today,
  .theme .theme.theme--spore-teal
  .picker__day--today {
    color: #077fc1; }

.picker__day--selected,
.picker__day:hover {
  background: #67ab43;
  color: #fff;
  background-color: #67ab43; }
  .picker__day--selected.theme--dark,
  .theme--dark .picker__day--selected,
  .theme .theme--dark .picker__day--selected,
  .picker__day:hover.theme--dark,
  .theme--dark
  .picker__day:hover,
  .theme .theme--dark
  .picker__day:hover {
    background-color: #3d3d3d; }
  .picker__day--selected.theme--green,
  .theme--green .picker__day--selected,
  .theme .theme--green .picker__day--selected,
  .picker__day:hover.theme--green,
  .theme--green
  .picker__day:hover,
  .theme .theme--green
  .picker__day:hover {
    background-color: #67ab43; }
  .picker__day--selected.theme--blue,
  .theme--blue .picker__day--selected,
  .theme .theme--blue .picker__day--selected,
  .picker__day:hover.theme--blue,
  .theme--blue
  .picker__day:hover,
  .theme .theme--blue
  .picker__day:hover {
    background-color: #56c0dd; }
  .picker__day--selected.theme--lime,
  .theme--lime .picker__day--selected,
  .theme .theme--lime .picker__day--selected,
  .picker__day:hover.theme--lime,
  .theme--lime
  .picker__day:hover,
  .theme .theme--lime
  .picker__day:hover {
    background-color: #c1d435; }
  .picker__day--selected.theme--yellow,
  .theme--yellow .picker__day--selected,
  .theme .theme--yellow .picker__day--selected,
  .picker__day:hover.theme--yellow,
  .theme--yellow
  .picker__day:hover,
  .theme .theme--yellow
  .picker__day:hover {
    background-color: #facf21; }
  .picker__day--selected.theme--gold,
  .theme--gold .picker__day--selected,
  .theme .theme--gold .picker__day--selected,
  .picker__day:hover.theme--gold,
  .theme--gold
  .picker__day:hover,
  .theme .theme--gold
  .picker__day:hover {
    background-color: #eb942c; }
  .picker__day--selected.theme--orange,
  .theme--orange .picker__day--selected,
  .theme .theme--orange .picker__day--selected,
  .picker__day:hover.theme--orange,
  .theme--orange
  .picker__day:hover,
  .theme .theme--orange
  .picker__day:hover {
    background-color: #e26435; }
  .picker__day--selected.theme--salmon,
  .theme--salmon .picker__day--selected,
  .theme .theme--salmon .picker__day--selected,
  .picker__day:hover.theme--salmon,
  .theme--salmon
  .picker__day:hover,
  .theme .theme--salmon
  .picker__day:hover {
    background-color: #eb735d; }
  .picker__day--selected.theme--red,
  .theme--red .picker__day--selected,
  .theme .theme--red .picker__day--selected,
  .picker__day:hover.theme--red,
  .theme--red
  .picker__day:hover,
  .theme .theme--red
  .picker__day:hover {
    background-color: #ec2d10; }
  .picker__day--selected.theme--burgundy,
  .theme--burgundy .picker__day--selected,
  .theme .theme--burgundy .picker__day--selected,
  .picker__day:hover.theme--burgundy,
  .theme--burgundy
  .picker__day:hover,
  .theme .theme--burgundy
  .picker__day:hover {
    background-color: #ba222a; }
  .picker__day--selected.theme--purple,
  .theme--purple .picker__day--selected,
  .theme .theme--purple .picker__day--selected,
  .picker__day:hover.theme--purple,
  .theme--purple
  .picker__day:hover,
  .theme .theme--purple
  .picker__day:hover {
    background-color: #9b3381; }
  .picker__day--selected.theme--youth,
  .theme--youth .picker__day--selected,
  .theme .theme--youth .picker__day--selected,
  .picker__day:hover.theme--youth,
  .theme--youth
  .picker__day:hover,
  .theme .theme--youth
  .picker__day:hover {
    background-color: #d57800; }
  .picker__day--selected.theme--digitalisation,
  .theme--digitalisation .picker__day--selected,
  .theme .theme--digitalisation .picker__day--selected,
  .picker__day:hover.theme--digitalisation,
  .theme--digitalisation
  .picker__day:hover,
  .theme .theme--digitalisation
  .picker__day:hover {
    background-color: #9a3324; }
  .picker__day--selected.theme--climate,
  .theme--climate .picker__day--selected,
  .theme .theme--climate .picker__day--selected,
  .picker__day:hover.theme--climate,
  .theme--climate
  .picker__day:hover,
  .theme .theme--climate
  .picker__day:hover {
    background-color: #693c5e; }
  .picker__day--selected.theme--gender,
  .theme--gender .picker__day--selected,
  .theme .theme--gender .picker__day--selected,
  .picker__day:hover.theme--gender,
  .theme--gender
  .picker__day:hover,
  .theme .theme--gender
  .picker__day:hover {
    background-color: #046a38; }
  .picker__day--selected.theme--nutrition,
  .theme--nutrition .picker__day--selected,
  .theme .theme--nutrition .picker__day--selected,
  .picker__day:hover.theme--nutrition,
  .theme--nutrition
  .picker__day:hover,
  .theme .theme--nutrition
  .picker__day:hover {
    background-color: #487a7b; }
  .picker__day--selected.theme--blog,
  .theme--blog .picker__day--selected,
  .theme .theme--blog .picker__day--selected,
  .picker__day:hover.theme--blog,
  .theme--blog
  .picker__day:hover,
  .theme .theme--blog
  .picker__day:hover {
    background-color: #ffa300; }
  .picker__day--selected.theme--spore-blue,
  .theme--spore-blue .picker__day--selected,
  .theme .theme--spore-blue .picker__day--selected,
  .picker__day:hover.theme--spore-blue,
  .theme--spore-blue
  .picker__day:hover,
  .theme .theme--spore-blue
  .picker__day:hover {
    background-color: #3f68b1; }
  .picker__day--selected.theme--spore-brown,
  .theme--spore-brown .picker__day--selected,
  .theme .theme--spore-brown .picker__day--selected,
  .picker__day:hover.theme--spore-brown,
  .theme--spore-brown
  .picker__day:hover,
  .theme .theme--spore-brown
  .picker__day:hover {
    background-color: #774b04; }
  .picker__day--selected.theme--spore-dark-blue,
  .theme--spore-dark-blue .picker__day--selected,
  .theme .theme--spore-dark-blue .picker__day--selected,
  .picker__day:hover.theme--spore-dark-blue,
  .theme--spore-dark-blue
  .picker__day:hover,
  .theme .theme--spore-dark-blue
  .picker__day:hover {
    background-color: #044e7e; }
  .picker__day--selected.theme--spore-forest-green,
  .theme--spore-forest-green .picker__day--selected,
  .theme .theme--spore-forest-green .picker__day--selected,
  .picker__day:hover.theme--spore-forest-green,
  .theme--spore-forest-green
  .picker__day:hover,
  .theme .theme--spore-forest-green
  .picker__day:hover {
    background-color: #5f810a; }
  .picker__day--selected.theme--spore-grey-blue,
  .theme--spore-grey-blue .picker__day--selected,
  .theme .theme--spore-grey-blue .picker__day--selected,
  .picker__day:hover.theme--spore-grey-blue,
  .theme--spore-grey-blue
  .picker__day:hover,
  .theme .theme--spore-grey-blue
  .picker__day:hover {
    background-color: #6d8c9f; }
  .picker__day--selected.theme--spore-light-blue,
  .theme--spore-light-blue .picker__day--selected,
  .theme .theme--spore-light-blue .picker__day--selected,
  .picker__day:hover.theme--spore-light-blue,
  .theme--spore-light-blue
  .picker__day:hover,
  .theme .theme--spore-light-blue
  .picker__day:hover {
    background-color: #79accf; }
  .picker__day--selected.theme--spore-lime,
  .theme--spore-lime .picker__day--selected,
  .theme .theme--spore-lime .picker__day--selected,
  .picker__day:hover.theme--spore-lime,
  .theme--spore-lime
  .picker__day:hover,
  .theme .theme--spore-lime
  .picker__day:hover {
    background-color: #bbae03; }
  .picker__day--selected.theme--spore-ochre,
  .theme--spore-ochre .picker__day--selected,
  .theme .theme--spore-ochre .picker__day--selected,
  .picker__day:hover.theme--spore-ochre,
  .theme--spore-ochre
  .picker__day:hover,
  .theme .theme--spore-ochre
  .picker__day:hover {
    background-color: #db9623; }
  .picker__day--selected.theme--spore-olive-green,
  .theme--spore-olive-green .picker__day--selected,
  .theme .theme--spore-olive-green .picker__day--selected,
  .picker__day:hover.theme--spore-olive-green,
  .theme--spore-olive-green
  .picker__day:hover,
  .theme .theme--spore-olive-green
  .picker__day:hover {
    background-color: #778d3e; }
  .picker__day--selected.theme--spore-red,
  .theme--spore-red .picker__day--selected,
  .theme .theme--spore-red .picker__day--selected,
  .picker__day:hover.theme--spore-red,
  .theme--spore-red
  .picker__day:hover,
  .theme .theme--spore-red
  .picker__day:hover {
    background-color: #f54c23; }
  .picker__day--selected.theme--spore-taupe,
  .theme--spore-taupe .picker__day--selected,
  .theme .theme--spore-taupe .picker__day--selected,
  .picker__day:hover.theme--spore-taupe,
  .theme--spore-taupe
  .picker__day:hover,
  .theme .theme--spore-taupe
  .picker__day:hover {
    background-color: #7b6d65; }
  .picker__day--selected.theme--spore-teal,
  .theme--spore-teal .picker__day--selected,
  .theme .theme--spore-teal .picker__day--selected,
  .picker__day:hover.theme--spore-teal,
  .theme--spore-teal
  .picker__day:hover,
  .theme .theme--spore-teal
  .picker__day:hover {
    background-color: #077fc1; }

.picker__header {
  position: relative;
  text-align: center;
  font-size: 1.125em;
  margin-bottom: 24px;
  padding-top: 18px; }
  @media only screen and (min-width: 48em) {
    .picker__header {
      padding-top: 0; } }

.picker__month, .picker__year {
  display: inline;
  margin: 0 3px; }

.picker__nav--prev, .picker__nav--next {
  position: absolute;
  font-size: 1.5em;
  top: 12px;
  display: block;
  width: 30px;
  height: 30px;
  cursor: pointer;
  background: #b3b3b3; }
  @media only screen and (min-width: 48em) {
    .picker__nav--prev, .picker__nav--next {
      top: 0;
      width: 27px;
      height: 27px;
      font-size: 1.25em;
      line-height: 1.3125em; } }
  .picker__nav--prev:before, .picker__nav--next:before {
    font-family: "cta-icons";
    color: #fff; }

.picker__nav--prev {
  left: 0; }
  @media only screen and (min-width: 48em) {
    .picker__nav--prev {
      left: 10px; } }
  .picker__nav--prev:before {
    content: ""; }

.picker__nav--next {
  right: 0; }
  @media only screen and (min-width: 48em) {
    .picker__nav--next {
      right: 10px; } }
  .picker__nav--next:before {
    content: ""; }

.picker__table {
  width: 100%; }

.picker__day {
  cursor: pointer;
  display: inline-block;
  padding: 4.5px;
  width: 30px;
  height: 30px; }
  .picker__day--outfocus {
    color: #a6a6a6; }

/* 3.21 Meta */
/*
Meta

.meta - Meta text, dates etc.
.meta.meta--s - Smaller meta text.
.meta.meta--lowercase - Meta text with unset text-transform
.meta.meta--inverse - Inversed meta text
.meta.meta--regular - Regular font-weight
.meta.meta--bold  - Extra bold font-weight
.meta.meta--dark - Darker text colour
.meta.meta--theme - Theme text colour

markup:
<p class="{$modifiers}">Drone technology could help farmers around the world monitor their crops, fend off pests, improve land tenure, and more. But to realise its full potential, regulatory regimes are necessary, while keeping citizens’ safety and privacy rights secure.</p>

Styleguide 3.21
*/
.meta {
  /* small meta*/
  font-size: 0.6875em;
  line-height: 1.09091;
  font-weight: 400;
  opacity: .76; }
  .meta--inverse {
    color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }
    .hero__headline .meta--inverse {
      font-size: 1.125em;
      line-height: 1.33333; }
  .meta--s {
    /* small meta*/
    font-size: 0.625em;
    line-height: 1.2;
    font-weight: 600; }
  .meta--lowercase, .meta--lc {
    text-transform: none; }
  .meta--regular {
    font-weight: 300; }
  .meta--bold {
    font-weight: 600; }
  .meta--dark {
    opacity: 1; }
  .meta--theme {
    color: #67ab43; }
    .meta--theme.theme--dark,
    .theme--dark .meta--theme,
    .theme .theme.theme--dark .meta--theme {
      color: #3d3d3d; }
    .meta--theme.theme--green,
    .theme--green .meta--theme,
    .theme .theme.theme--green .meta--theme {
      color: #67ab43; }
    .meta--theme.theme--blue,
    .theme--blue .meta--theme,
    .theme .theme.theme--blue .meta--theme {
      color: #56c0dd; }
    .meta--theme.theme--lime,
    .theme--lime .meta--theme,
    .theme .theme.theme--lime .meta--theme {
      color: #c1d435; }
    .meta--theme.theme--yellow,
    .theme--yellow .meta--theme,
    .theme .theme.theme--yellow .meta--theme {
      color: #facf21; }
    .meta--theme.theme--gold,
    .theme--gold .meta--theme,
    .theme .theme.theme--gold .meta--theme {
      color: #eb942c; }
    .meta--theme.theme--orange,
    .theme--orange .meta--theme,
    .theme .theme.theme--orange .meta--theme {
      color: #e26435; }
    .meta--theme.theme--salmon,
    .theme--salmon .meta--theme,
    .theme .theme.theme--salmon .meta--theme {
      color: #eb735d; }
    .meta--theme.theme--red,
    .theme--red .meta--theme,
    .theme .theme.theme--red .meta--theme {
      color: #ec2d10; }
    .meta--theme.theme--burgundy,
    .theme--burgundy .meta--theme,
    .theme .theme.theme--burgundy .meta--theme {
      color: #ba222a; }
    .meta--theme.theme--purple,
    .theme--purple .meta--theme,
    .theme .theme.theme--purple .meta--theme {
      color: #9b3381; }
    .meta--theme.theme--youth,
    .theme--youth .meta--theme,
    .theme .theme.theme--youth .meta--theme {
      color: #d57800; }
    .meta--theme.theme--digitalisation,
    .theme--digitalisation .meta--theme,
    .theme .theme.theme--digitalisation .meta--theme {
      color: #9a3324; }
    .meta--theme.theme--climate,
    .theme--climate .meta--theme,
    .theme .theme.theme--climate .meta--theme {
      color: #693c5e; }
    .meta--theme.theme--gender,
    .theme--gender .meta--theme,
    .theme .theme.theme--gender .meta--theme {
      color: #046a38; }
    .meta--theme.theme--nutrition,
    .theme--nutrition .meta--theme,
    .theme .theme.theme--nutrition .meta--theme {
      color: #487a7b; }
    .meta--theme.theme--blog,
    .theme--blog .meta--theme,
    .theme .theme.theme--blog .meta--theme {
      color: #ffa300; }
    .meta--theme.theme--spore-blue,
    .theme--spore-blue .meta--theme,
    .theme .theme.theme--spore-blue .meta--theme {
      color: #3f68b1; }
    .meta--theme.theme--spore-brown,
    .theme--spore-brown .meta--theme,
    .theme .theme.theme--spore-brown .meta--theme {
      color: #774b04; }
    .meta--theme.theme--spore-dark-blue,
    .theme--spore-dark-blue .meta--theme,
    .theme .theme.theme--spore-dark-blue .meta--theme {
      color: #044e7e; }
    .meta--theme.theme--spore-forest-green,
    .theme--spore-forest-green .meta--theme,
    .theme .theme.theme--spore-forest-green .meta--theme {
      color: #5f810a; }
    .meta--theme.theme--spore-grey-blue,
    .theme--spore-grey-blue .meta--theme,
    .theme .theme.theme--spore-grey-blue .meta--theme {
      color: #6d8c9f; }
    .meta--theme.theme--spore-light-blue,
    .theme--spore-light-blue .meta--theme,
    .theme .theme.theme--spore-light-blue .meta--theme {
      color: #79accf; }
    .meta--theme.theme--spore-lime,
    .theme--spore-lime .meta--theme,
    .theme .theme.theme--spore-lime .meta--theme {
      color: #bbae03; }
    .meta--theme.theme--spore-ochre,
    .theme--spore-ochre .meta--theme,
    .theme .theme.theme--spore-ochre .meta--theme {
      color: #db9623; }
    .meta--theme.theme--spore-olive-green,
    .theme--spore-olive-green .meta--theme,
    .theme .theme.theme--spore-olive-green .meta--theme {
      color: #778d3e; }
    .meta--theme.theme--spore-red,
    .theme--spore-red .meta--theme,
    .theme .theme.theme--spore-red .meta--theme {
      color: #f54c23; }
    .meta--theme.theme--spore-taupe,
    .theme--spore-taupe .meta--theme,
    .theme .theme.theme--spore-taupe .meta--theme {
      color: #7b6d65; }
    .meta--theme.theme--spore-teal,
    .theme--spore-teal .meta--theme,
    .theme .theme.theme--spore-teal .meta--theme {
      color: #077fc1; }
  @media only screen and (min-width: 64em) {
    .meta {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25; }
      .meta--s {
        /* small meta*/
        font-size: 0.6875em;
        line-height: 1.09091; } }

/* 3.22 Teaser */
/*
Teaser

A transparent box for use in teaser boxes (used in hero modules)

.teaser - Regular, white transparent box
.teaser.teaser--theme - Color box, matching the curent theme

markup:
<div class="{$modifiers}">
  Teaser
</div>

sg-wrapper:
<div class="hero theme" style="height: 400px; background-image: url('https://images.unsplash.com/reserve/Ceszw9OoQD6rwMhfDl9R_render0006.jpg?dpr=1&auto=format&fit=crop&w=1500&h=1000&q=80&cs=tinysrgb&crop=')">
  <sg-wrapper-content/>
</div>

Styleguide 3.22
*/
.teaser {
  background: #fff;
  background: rgba(255, 255, 255, 0.8); }
  .teaser--theme {
    background-color: #67ab43;
    background-color: rgba(103, 171, 67, 0.76); }
    .teaser--theme.theme--dark,
    .theme--dark .teaser--theme,
    .theme .theme--dark .teaser--theme {
      background-color: #3d3d3d;
      background-color: rgba(61, 61, 61, 0.76); }
    .teaser--theme.theme--green,
    .theme--green .teaser--theme,
    .theme .theme--green .teaser--theme {
      background-color: #67ab43;
      background-color: rgba(103, 171, 67, 0.76); }
    .teaser--theme.theme--blue,
    .theme--blue .teaser--theme,
    .theme .theme--blue .teaser--theme {
      background-color: #56c0dd;
      background-color: rgba(86, 192, 221, 0.76); }
    .teaser--theme.theme--lime,
    .theme--lime .teaser--theme,
    .theme .theme--lime .teaser--theme {
      background-color: #c1d435;
      background-color: rgba(193, 212, 53, 0.76); }
    .teaser--theme.theme--yellow,
    .theme--yellow .teaser--theme,
    .theme .theme--yellow .teaser--theme {
      background-color: #facf21;
      background-color: rgba(250, 207, 33, 0.76); }
    .teaser--theme.theme--gold,
    .theme--gold .teaser--theme,
    .theme .theme--gold .teaser--theme {
      background-color: #eb942c;
      background-color: rgba(235, 148, 44, 0.76); }
    .teaser--theme.theme--orange,
    .theme--orange .teaser--theme,
    .theme .theme--orange .teaser--theme {
      background-color: #e26435;
      background-color: rgba(226, 100, 53, 0.76); }
    .teaser--theme.theme--salmon,
    .theme--salmon .teaser--theme,
    .theme .theme--salmon .teaser--theme {
      background-color: #eb735d;
      background-color: rgba(235, 115, 93, 0.76); }
    .teaser--theme.theme--red,
    .theme--red .teaser--theme,
    .theme .theme--red .teaser--theme {
      background-color: #ec2d10;
      background-color: rgba(236, 45, 16, 0.76); }
    .teaser--theme.theme--burgundy,
    .theme--burgundy .teaser--theme,
    .theme .theme--burgundy .teaser--theme {
      background-color: #ba222a;
      background-color: rgba(186, 34, 42, 0.76); }
    .teaser--theme.theme--purple,
    .theme--purple .teaser--theme,
    .theme .theme--purple .teaser--theme {
      background-color: #9b3381;
      background-color: rgba(155, 51, 129, 0.76); }
    .teaser--theme.theme--youth,
    .theme--youth .teaser--theme,
    .theme .theme--youth .teaser--theme {
      background-color: #d57800;
      background-color: rgba(213, 120, 0, 0.76); }
    .teaser--theme.theme--digitalisation,
    .theme--digitalisation .teaser--theme,
    .theme .theme--digitalisation .teaser--theme {
      background-color: #9a3324;
      background-color: rgba(154, 51, 36, 0.76); }
    .teaser--theme.theme--climate,
    .theme--climate .teaser--theme,
    .theme .theme--climate .teaser--theme {
      background-color: #693c5e;
      background-color: rgba(105, 60, 94, 0.76); }
    .teaser--theme.theme--gender,
    .theme--gender .teaser--theme,
    .theme .theme--gender .teaser--theme {
      background-color: #046a38;
      background-color: rgba(4, 106, 56, 0.76); }
    .teaser--theme.theme--nutrition,
    .theme--nutrition .teaser--theme,
    .theme .theme--nutrition .teaser--theme {
      background-color: #487a7b;
      background-color: rgba(72, 122, 123, 0.76); }
    .teaser--theme.theme--blog,
    .theme--blog .teaser--theme,
    .theme .theme--blog .teaser--theme {
      background-color: #FFA300;
      background-color: rgba(255, 163, 0, 0.76); }
    .teaser--theme.theme--spore-blue,
    .theme--spore-blue .teaser--theme,
    .theme .theme--spore-blue .teaser--theme {
      background-color: #3f68b1;
      background-color: rgba(63, 104, 177, 0.76); }
    .teaser--theme.theme--spore-brown,
    .theme--spore-brown .teaser--theme,
    .theme .theme--spore-brown .teaser--theme {
      background-color: #774b04;
      background-color: rgba(119, 75, 4, 0.76); }
    .teaser--theme.theme--spore-dark-blue,
    .theme--spore-dark-blue .teaser--theme,
    .theme .theme--spore-dark-blue .teaser--theme {
      background-color: #044e7e;
      background-color: rgba(4, 78, 126, 0.76); }
    .teaser--theme.theme--spore-forest-green,
    .theme--spore-forest-green .teaser--theme,
    .theme .theme--spore-forest-green .teaser--theme {
      background-color: #5f810a;
      background-color: rgba(95, 129, 10, 0.76); }
    .teaser--theme.theme--spore-grey-blue,
    .theme--spore-grey-blue .teaser--theme,
    .theme .theme--spore-grey-blue .teaser--theme {
      background-color: #6d8c9f;
      background-color: rgba(109, 140, 159, 0.76); }
    .teaser--theme.theme--spore-light-blue,
    .theme--spore-light-blue .teaser--theme,
    .theme .theme--spore-light-blue .teaser--theme {
      background-color: #79accf;
      background-color: rgba(121, 172, 207, 0.76); }
    .teaser--theme.theme--spore-lime,
    .theme--spore-lime .teaser--theme,
    .theme .theme--spore-lime .teaser--theme {
      background-color: #bbae03;
      background-color: rgba(187, 174, 3, 0.76); }
    .teaser--theme.theme--spore-ochre,
    .theme--spore-ochre .teaser--theme,
    .theme .theme--spore-ochre .teaser--theme {
      background-color: #db9623;
      background-color: rgba(219, 150, 35, 0.76); }
    .teaser--theme.theme--spore-olive-green,
    .theme--spore-olive-green .teaser--theme,
    .theme .theme--spore-olive-green .teaser--theme {
      background-color: #778d3e;
      background-color: rgba(119, 141, 62, 0.76); }
    .teaser--theme.theme--spore-red,
    .theme--spore-red .teaser--theme,
    .theme .theme--spore-red .teaser--theme {
      background-color: #f54c23;
      background-color: rgba(245, 76, 35, 0.76); }
    .teaser--theme.theme--spore-taupe,
    .theme--spore-taupe .teaser--theme,
    .theme .theme--spore-taupe .teaser--theme {
      background-color: #7b6d65;
      background-color: rgba(123, 109, 101, 0.76); }
    .teaser--theme.theme--spore-teal,
    .theme--spore-teal .teaser--theme,
    .theme .theme--spore-teal .teaser--theme {
      background-color: #077fc1;
      background-color: rgba(7, 127, 193, 0.76); }
  .hero--carousel .teaser {
    background: #fff; }
    @media only screen and (min-width: 90em) {
      .hero--carousel .teaser {
        background: rgba(255, 255, 255, 0.8); } }

a.teaser.topic-teaser {
  display: block;
  color: #fff; }

/* 3.23 av */
/*
AV (Audio/Video)

Overlays a play button in the right bottom corner. Place directly below an image.

markup:
<span class="av">
  <span class="icon icon--controller-play"><span class="is-narrative">Play</span></span>
</span>

sg-wrapper:
<div class="gutters" style="width: 200px;">
  <img class="image image--stretch" src="https://images.unsplash.com/reserve/Ceszw9OoQD6rwMhfDl9R_render0006.jpg?dpr=1&auto=format&fit=crop&w=1500&h=1000&q=80&cs=tinysrgb&crop="/>
  <sg-wrapper-content/>
</div>

Styleguide 3.23
*/
.av {
  background-color: #67ab43;
  display: inline-block;
  float: right;
  position: relative;
  top: -36px;
  left: -9px;
  width: 27px;
  height: 27px;
  text-align: center;
  font-size: .75em;
  color: #fff; }
  .av.theme--dark,
  .theme--dark .av,
  .theme .theme--dark .av {
    background-color: #3d3d3d; }
  .av.theme--green,
  .theme--green .av,
  .theme .theme--green .av {
    background-color: #67ab43; }
  .av.theme--blue,
  .theme--blue .av,
  .theme .theme--blue .av {
    background-color: #56c0dd; }
  .av.theme--lime,
  .theme--lime .av,
  .theme .theme--lime .av {
    background-color: #c1d435; }
  .av.theme--yellow,
  .theme--yellow .av,
  .theme .theme--yellow .av {
    background-color: #facf21; }
  .av.theme--gold,
  .theme--gold .av,
  .theme .theme--gold .av {
    background-color: #eb942c; }
  .av.theme--orange,
  .theme--orange .av,
  .theme .theme--orange .av {
    background-color: #e26435; }
  .av.theme--salmon,
  .theme--salmon .av,
  .theme .theme--salmon .av {
    background-color: #eb735d; }
  .av.theme--red,
  .theme--red .av,
  .theme .theme--red .av {
    background-color: #ec2d10; }
  .av.theme--burgundy,
  .theme--burgundy .av,
  .theme .theme--burgundy .av {
    background-color: #ba222a; }
  .av.theme--purple,
  .theme--purple .av,
  .theme .theme--purple .av {
    background-color: #9b3381; }
  .av.theme--youth,
  .theme--youth .av,
  .theme .theme--youth .av {
    background-color: #d57800; }
  .av.theme--digitalisation,
  .theme--digitalisation .av,
  .theme .theme--digitalisation .av {
    background-color: #9a3324; }
  .av.theme--climate,
  .theme--climate .av,
  .theme .theme--climate .av {
    background-color: #693c5e; }
  .av.theme--gender,
  .theme--gender .av,
  .theme .theme--gender .av {
    background-color: #046a38; }
  .av.theme--nutrition,
  .theme--nutrition .av,
  .theme .theme--nutrition .av {
    background-color: #487a7b; }
  .av.theme--blog,
  .theme--blog .av,
  .theme .theme--blog .av {
    background-color: #ffa300; }
  .av.theme--spore-blue,
  .theme--spore-blue .av,
  .theme .theme--spore-blue .av {
    background-color: #3f68b1; }
  .av.theme--spore-brown,
  .theme--spore-brown .av,
  .theme .theme--spore-brown .av {
    background-color: #774b04; }
  .av.theme--spore-dark-blue,
  .theme--spore-dark-blue .av,
  .theme .theme--spore-dark-blue .av {
    background-color: #044e7e; }
  .av.theme--spore-forest-green,
  .theme--spore-forest-green .av,
  .theme .theme--spore-forest-green .av {
    background-color: #5f810a; }
  .av.theme--spore-grey-blue,
  .theme--spore-grey-blue .av,
  .theme .theme--spore-grey-blue .av {
    background-color: #6d8c9f; }
  .av.theme--spore-light-blue,
  .theme--spore-light-blue .av,
  .theme .theme--spore-light-blue .av {
    background-color: #79accf; }
  .av.theme--spore-lime,
  .theme--spore-lime .av,
  .theme .theme--spore-lime .av {
    background-color: #bbae03; }
  .av.theme--spore-ochre,
  .theme--spore-ochre .av,
  .theme .theme--spore-ochre .av {
    background-color: #db9623; }
  .av.theme--spore-olive-green,
  .theme--spore-olive-green .av,
  .theme .theme--spore-olive-green .av {
    background-color: #778d3e; }
  .av.theme--spore-red,
  .theme--spore-red .av,
  .theme .theme--spore-red .av {
    background-color: #f54c23; }
  .av.theme--spore-taupe,
  .theme--spore-taupe .av,
  .theme .theme--spore-taupe .av {
    background-color: #7b6d65; }
  .av.theme--spore-teal,
  .theme--spore-teal .av,
  .theme .theme--spore-teal .av {
    background-color: #077fc1; }
  .av,
  .av .icon,
  .av .list--take-aways li:before,
  .list--take-aways .av li:before,
  .av .list--theme li:before,
  .list--theme .av li:before,
  .av .filter__trigger:after,
  .av .block-link--icon:before,
  .av .panel.is-inactive .panel__trigger:after,
  .panel.is-inactive .av .panel__trigger:after,
  .av .tail__lengthen:before,
  .av .tail__lengthen:after,
  .av .tail__shorten:before,
  .av .tail__shorten:after {
    /* Icon was slightly off-center, added same line-height as parent to ensure that the icon is centered */
    line-height: 27px; }

/* 3.24 Pager */
/*
Pager

Styleguide 3.24

markup:
<div class="pager-container">
  <button class="button pager__previous">Previous events</button>
  <button class="button pager__next">Next events</button>
</div>

*/
.pager__previous {
  float: left; }

.pager__next {
  float: right; }

/* 3.25 Illustrations */
/*
Illustrations

Element with a `data-illustration` attribute.

fish-market - Fish market
fishing-boat - Fishing man from out a boat
fishing-shore - Fishing man from the shore
fish-market-supplier - Fish market with a boat supplier
factory - Fish factory
farmer-presentation - Presentation by a farmer under a tree

markup:
<span data-illustration="{$modifiers}"></span>

Styleguide 3.25
*/
@font-face {
  font-family: 'cta-illustrations';
  src: url("../fonts/cta-illustrations/fonts/cta-illustrations.eot?qfngui");
  src: url("../fonts/cta-illustrations/fonts/cta-illustrations.eot?qfngui#iefix") format("embedded-opentype"), url("../fonts/cta-illustrations/fonts/cta-illustrations.ttf?qfngui") format("truetype"), url("../fonts/cta-illustrations/fonts/cta-illustrations.woff?qfngui") format("woff"), url("../fonts/cta-illustrations/fonts/cta-illustrations.svg?qfngui#cta-illustrations") format("svg");
  font-weight: normal;
  font-style: normal; }

.illustration,
[data-illustration]:before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'cta-illustrations' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Enable Ligatures ================ */
  letter-spacing: 0;
  -webkit-font-feature-settings: "liga";
  -moz-font-feature-settings: "liga=1";
  -moz-font-feature-settings: "liga";
  -ms-font-feature-settings: "liga" 1;
  font-feature-settings: "liga";
  -webkit-font-variant-ligatures: discretionary-ligatures;
  -moz-font-variant-ligatures: discretionary-ligatures;
       font-variant-ligatures: discretionary-ligatures;
  /* Icon ================ */
  content: attr(data-illustration); }

.illustration--fishing-boat:before {
  content: ""; }

.illustration--fishing-shore:before {
  content: ""; }

.illustration--fish-market-supplier:before {
  content: ""; }

.illustration--factory:before {
  content: ""; }

.illustration--farmer-presentation:before {
  content: ""; }

.illustration--fish-market:before,
.illustration--fish-barn:before {
  content: ""; }

/*
Icon with icon class

Element with class `illustration` and a `data-illustration` attribute.

fish-market - Fish market
fishing-boat - Fishing man from out a boat
fishing-shore - Fishing man from the shore
fish-market-supplier - Fish market with a boat supplier
factory - Fish factory
farmer-presentation - Presentation by a farmer under a tree

markup:
<span class="illustration illustration--{$modifiers}"></span>

Styleguide 3.25.1
*/
/* 3.26 Filter */
/*
Filter

Requires: Toggle script

markup:
<div class="filter" id="1234">
  <button class="filter__trigger  |  title" data-toggle="1234">Sort by</button>
  <ul class="filter__options  |  reset">
    <li><a class="filter__item  |  fx" href="javascript:void()">Date (newer-older)</a></li>
    <li><a class="filter__item  filter__item--selected  |  fx" href="javascript:void()">Date (older-newer)</a></li>
    <li><a class="filter__item  |  fx" href="javascript:void()">Alphabetical order (A-Z)</a></li>
    <li><a class="filter__item  |  fx" href="javascript:void()">Alphabetical order (Z-A)</a></li>
  </ul>
</div>
<div class="is-active  |  filter" id="5678">
  <button class="filter__trigger  |  title" data-toggle="5678">Filter by</button>
  <ul class="filter__options  |  reset">
    <li><a class="filter__item filter__item--selected  |  fx" href="javascript:void()">Relevance</a></li>
    <li><a class="filter__item  |  fx" href="javascript:void()">Upcoming</a></li>
    <li><a class="filter__item  |  fx" href="javascript:void()">Passed</a></li>
  </ul>
</div>

Styleguide 3.26
*/
.filter {
  position: relative;
  display: inline-block;
  padding-right: 6px; }
  .filter:last-child, .filter--last {
    padding-right: 0; }
  .filter__trigger {
    /* small meta*/
    font-size: 0.6875em;
    line-height: 1.09091; }
    .filter__trigger:after {
      content: "";
      color: #bdbdbd;
      margin-left: 3px; }
  .filter__options {
    position: absolute;
    z-index: 2;
    opacity: 0;
    visibility: hidden;
    background: #fff;
    border: 1px solid #969696;
    top: 130%;
    top: -moz-calc(100% + rhythm(4));
    top: calc(100% + rhythm(4));
    max-height: 198px;
    overflow-y: scroll; }
    .container-header__filter .filter__options {
      right: 0; }
  .filter__item {
    display: block;
    padding: 9px 15px;
    font-family: "Open Sans", sans-serif;
    font-size: 0.875em;
    line-height: 1.07143;
    white-space: nowrap; }
    .filter__item--selected {
      background: #ececec; }
    .filter__item, .filter__item:hover, .filter__item:focus {
      color: #6c6c6c; }
    .filter__item:hover, .filter__item:focus {
      background: #cdcdcd; }
  .filter.is-active .filter__options {
    opacity: 1;
    visibility: visible; }
  .filter.is-active .filter__trigger:after {
    -webkit-transform: rotate(180deg);
       -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
    /* Psuedo elements are inline by default, it's not possible to rotate an inline element.  */
    display: inline-block; }
  .no-js .filter:hover .filter__options, .no-js
  .filter:focus .filter__options {
    display: inline-block; }
  @media only screen and (min-width: 90em) {
    .filter__trigger {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25; } }

/* 3.27 Profile */
/*
Profile

Profile with name and sub-title

markup:
<div class="grid__cell  |  gutters  |  trailer">
    <div class="profile">
        <div class="profile__image">
            <img src="https://res.cloudinary.com/cta/image/upload/v1493832265/wwihdc4tab5q1jduvr1x.png" alt=" Michael Hailu">
        </div>
        <div class="profile__text">
            <h4 class="profile__name  |  title  |  trailer--small">Michael Hailu</h4>
            <p class="body--whisper">Director of CTA</p>
        </div>
    </div>
</div>

sg-wrapper:
<div class="grid grid--teletubbies">
  <sg-wrapper-content/>
</div>

Styleguide 3.27
*/
/*
Profile, name only

Profile with only the name

markup:
<div class="trellis__cell  |  gutters  |  trailer">
    <div class="profile">
        <div class="profile__image">
            <img src="https://res.cloudinary.com/cta/image/upload/v1493832265/wwihdc4tab5q1jduvr1x.png" alt=" Michael Hailu">
        </div>
        <div class="profile__text">
            <h4 class="profile__name  |  title">Michael Hailu</h4>
        </div>
    </div>
</div>

sg-wrapper:
<div class="trellis">
  <sg-wrapper-content/>
</div>

Styleguide 3.27.1
*/
.profile {
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
  .no-flexbox .profile {
    display: block; }
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .profile {
      display: block; } }
  .profile__text {
    background-color: #67ab43;
    color: #fff; }
    .profile__text.theme--dark,
    .theme--dark .profile__text,
    .theme .theme--dark .profile__text {
      background-color: #3d3d3d; }
    .profile__text.theme--green,
    .theme--green .profile__text,
    .theme .theme--green .profile__text {
      background-color: #67ab43; }
    .profile__text.theme--blue,
    .theme--blue .profile__text,
    .theme .theme--blue .profile__text {
      background-color: #56c0dd; }
    .profile__text.theme--lime,
    .theme--lime .profile__text,
    .theme .theme--lime .profile__text {
      background-color: #c1d435; }
    .profile__text.theme--yellow,
    .theme--yellow .profile__text,
    .theme .theme--yellow .profile__text {
      background-color: #facf21; }
    .profile__text.theme--gold,
    .theme--gold .profile__text,
    .theme .theme--gold .profile__text {
      background-color: #eb942c; }
    .profile__text.theme--orange,
    .theme--orange .profile__text,
    .theme .theme--orange .profile__text {
      background-color: #e26435; }
    .profile__text.theme--salmon,
    .theme--salmon .profile__text,
    .theme .theme--salmon .profile__text {
      background-color: #eb735d; }
    .profile__text.theme--red,
    .theme--red .profile__text,
    .theme .theme--red .profile__text {
      background-color: #ec2d10; }
    .profile__text.theme--burgundy,
    .theme--burgundy .profile__text,
    .theme .theme--burgundy .profile__text {
      background-color: #ba222a; }
    .profile__text.theme--purple,
    .theme--purple .profile__text,
    .theme .theme--purple .profile__text {
      background-color: #9b3381; }
    .profile__text.theme--youth,
    .theme--youth .profile__text,
    .theme .theme--youth .profile__text {
      background-color: #d57800; }
    .profile__text.theme--digitalisation,
    .theme--digitalisation .profile__text,
    .theme .theme--digitalisation .profile__text {
      background-color: #9a3324; }
    .profile__text.theme--climate,
    .theme--climate .profile__text,
    .theme .theme--climate .profile__text {
      background-color: #693c5e; }
    .profile__text.theme--gender,
    .theme--gender .profile__text,
    .theme .theme--gender .profile__text {
      background-color: #046a38; }
    .profile__text.theme--nutrition,
    .theme--nutrition .profile__text,
    .theme .theme--nutrition .profile__text {
      background-color: #487a7b; }
    .profile__text.theme--blog,
    .theme--blog .profile__text,
    .theme .theme--blog .profile__text {
      background-color: #ffa300; }
    .profile__text.theme--spore-blue,
    .theme--spore-blue .profile__text,
    .theme .theme--spore-blue .profile__text {
      background-color: #3f68b1; }
    .profile__text.theme--spore-brown,
    .theme--spore-brown .profile__text,
    .theme .theme--spore-brown .profile__text {
      background-color: #774b04; }
    .profile__text.theme--spore-dark-blue,
    .theme--spore-dark-blue .profile__text,
    .theme .theme--spore-dark-blue .profile__text {
      background-color: #044e7e; }
    .profile__text.theme--spore-forest-green,
    .theme--spore-forest-green .profile__text,
    .theme .theme--spore-forest-green .profile__text {
      background-color: #5f810a; }
    .profile__text.theme--spore-grey-blue,
    .theme--spore-grey-blue .profile__text,
    .theme .theme--spore-grey-blue .profile__text {
      background-color: #6d8c9f; }
    .profile__text.theme--spore-light-blue,
    .theme--spore-light-blue .profile__text,
    .theme .theme--spore-light-blue .profile__text {
      background-color: #79accf; }
    .profile__text.theme--spore-lime,
    .theme--spore-lime .profile__text,
    .theme .theme--spore-lime .profile__text {
      background-color: #bbae03; }
    .profile__text.theme--spore-ochre,
    .theme--spore-ochre .profile__text,
    .theme .theme--spore-ochre .profile__text {
      background-color: #db9623; }
    .profile__text.theme--spore-olive-green,
    .theme--spore-olive-green .profile__text,
    .theme .theme--spore-olive-green .profile__text {
      background-color: #778d3e; }
    .profile__text.theme--spore-red,
    .theme--spore-red .profile__text,
    .theme .theme--spore-red .profile__text {
      background-color: #f54c23; }
    .profile__text.theme--spore-taupe,
    .theme--spore-taupe .profile__text,
    .theme .theme--spore-taupe .profile__text {
      background-color: #7b6d65; }
    .profile__text.theme--spore-teal,
    .theme--spore-teal .profile__text,
    .theme .theme--spore-teal .profile__text {
      background-color: #077fc1; }
    .profile__text a,
    .profile__text a:visited {
      color: inherit !important; }
  .profile__image {
    margin-bottom: -1px;
    overflow: hidden;
    width: 100%;
    line-height: 0; }
    .profile__image img {
      width: 100%; }
  .profile__text {
    padding: 15px;
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1; }
  .profile__name {
    font-weight: 400; }
  .profile--small .profile__text {
    padding: 9px;
    font-size: 0.8125em; }

@media only screen and (min-width: 48em) {
  .profile__text {
    padding: 12px; }
  .profile__name {
    font-size: 0.8125em; } }

/* 3.28 Block link */
/*
Block link

.block-link - Block link
.block-link.block-link--icon - Block link with preceding icon
.block-link.block-link--inverse - Block link with inversed colours
.block-link.block-link--theme - Block link with theme colour

markup:
<a class="{$modifiers}" href="javascript:void()">Visit the website</a>

Styleguide 3.28
*/
.block-link {
  /* small title*/
  font-size: 0.75em;
  line-height: 1.5;
  display: inline-block;
  width: 100%;
  font-weight: 600;
  text-transform: uppercase;
  color: #3d3d3d; }
  .block-link:hover {
    color: #000; }
  .block-link--icon {
    position: relative;
    padding-left: 15px; }
    .block-link--icon:before {
      content: "";
      color: #67ab43;
      position: absolute;
      top: .3em;
      left: -.3em;
      font-size: .9em; }
      .block-link--icon:before.theme--dark,
      .theme--dark .block-link--icon:before,
      .theme .theme.theme--dark .block-link--icon:before {
        color: #3d3d3d; }
      .block-link--icon:before.theme--green,
      .theme--green .block-link--icon:before,
      .theme .theme.theme--green .block-link--icon:before {
        color: #67ab43; }
      .block-link--icon:before.theme--blue,
      .theme--blue .block-link--icon:before,
      .theme .theme.theme--blue .block-link--icon:before {
        color: #56c0dd; }
      .block-link--icon:before.theme--lime,
      .theme--lime .block-link--icon:before,
      .theme .theme.theme--lime .block-link--icon:before {
        color: #c1d435; }
      .block-link--icon:before.theme--yellow,
      .theme--yellow .block-link--icon:before,
      .theme .theme.theme--yellow .block-link--icon:before {
        color: #facf21; }
      .block-link--icon:before.theme--gold,
      .theme--gold .block-link--icon:before,
      .theme .theme.theme--gold .block-link--icon:before {
        color: #eb942c; }
      .block-link--icon:before.theme--orange,
      .theme--orange .block-link--icon:before,
      .theme .theme.theme--orange .block-link--icon:before {
        color: #e26435; }
      .block-link--icon:before.theme--salmon,
      .theme--salmon .block-link--icon:before,
      .theme .theme.theme--salmon .block-link--icon:before {
        color: #eb735d; }
      .block-link--icon:before.theme--red,
      .theme--red .block-link--icon:before,
      .theme .theme.theme--red .block-link--icon:before {
        color: #ec2d10; }
      .block-link--icon:before.theme--burgundy,
      .theme--burgundy .block-link--icon:before,
      .theme .theme.theme--burgundy .block-link--icon:before {
        color: #ba222a; }
      .block-link--icon:before.theme--purple,
      .theme--purple .block-link--icon:before,
      .theme .theme.theme--purple .block-link--icon:before {
        color: #9b3381; }
      .block-link--icon:before.theme--youth,
      .theme--youth .block-link--icon:before,
      .theme .theme.theme--youth .block-link--icon:before {
        color: #d57800; }
      .block-link--icon:before.theme--digitalisation,
      .theme--digitalisation .block-link--icon:before,
      .theme .theme.theme--digitalisation .block-link--icon:before {
        color: #9a3324; }
      .block-link--icon:before.theme--climate,
      .theme--climate .block-link--icon:before,
      .theme .theme.theme--climate .block-link--icon:before {
        color: #693c5e; }
      .block-link--icon:before.theme--gender,
      .theme--gender .block-link--icon:before,
      .theme .theme.theme--gender .block-link--icon:before {
        color: #046a38; }
      .block-link--icon:before.theme--nutrition,
      .theme--nutrition .block-link--icon:before,
      .theme .theme.theme--nutrition .block-link--icon:before {
        color: #487a7b; }
      .block-link--icon:before.theme--blog,
      .theme--blog .block-link--icon:before,
      .theme .theme.theme--blog .block-link--icon:before {
        color: #ffa300; }
      .block-link--icon:before.theme--spore-blue,
      .theme--spore-blue .block-link--icon:before,
      .theme .theme.theme--spore-blue .block-link--icon:before {
        color: #3f68b1; }
      .block-link--icon:before.theme--spore-brown,
      .theme--spore-brown .block-link--icon:before,
      .theme .theme.theme--spore-brown .block-link--icon:before {
        color: #774b04; }
      .block-link--icon:before.theme--spore-dark-blue,
      .theme--spore-dark-blue .block-link--icon:before,
      .theme .theme.theme--spore-dark-blue .block-link--icon:before {
        color: #044e7e; }
      .block-link--icon:before.theme--spore-forest-green,
      .theme--spore-forest-green .block-link--icon:before,
      .theme .theme.theme--spore-forest-green .block-link--icon:before {
        color: #5f810a; }
      .block-link--icon:before.theme--spore-grey-blue,
      .theme--spore-grey-blue .block-link--icon:before,
      .theme .theme.theme--spore-grey-blue .block-link--icon:before {
        color: #6d8c9f; }
      .block-link--icon:before.theme--spore-light-blue,
      .theme--spore-light-blue .block-link--icon:before,
      .theme .theme.theme--spore-light-blue .block-link--icon:before {
        color: #79accf; }
      .block-link--icon:before.theme--spore-lime,
      .theme--spore-lime .block-link--icon:before,
      .theme .theme.theme--spore-lime .block-link--icon:before {
        color: #bbae03; }
      .block-link--icon:before.theme--spore-ochre,
      .theme--spore-ochre .block-link--icon:before,
      .theme .theme.theme--spore-ochre .block-link--icon:before {
        color: #db9623; }
      .block-link--icon:before.theme--spore-olive-green,
      .theme--spore-olive-green .block-link--icon:before,
      .theme .theme.theme--spore-olive-green .block-link--icon:before {
        color: #778d3e; }
      .block-link--icon:before.theme--spore-red,
      .theme--spore-red .block-link--icon:before,
      .theme .theme.theme--spore-red .block-link--icon:before {
        color: #f54c23; }
      .block-link--icon:before.theme--spore-taupe,
      .theme--spore-taupe .block-link--icon:before,
      .theme .theme.theme--spore-taupe .block-link--icon:before {
        color: #7b6d65; }
      .block-link--icon:before.theme--spore-teal,
      .theme--spore-teal .block-link--icon:before,
      .theme .theme.theme--spore-teal .block-link--icon:before {
        color: #077fc1; }
  .block-link--theme {
    color: #67ab43; }
    .block-link--theme.theme--dark,
    .theme--dark .block-link--theme,
    .theme .theme.theme--dark .block-link--theme {
      color: #3d3d3d; }
    .block-link--theme.theme--green,
    .theme--green .block-link--theme,
    .theme .theme.theme--green .block-link--theme {
      color: #67ab43; }
    .block-link--theme.theme--blue,
    .theme--blue .block-link--theme,
    .theme .theme.theme--blue .block-link--theme {
      color: #56c0dd; }
    .block-link--theme.theme--lime,
    .theme--lime .block-link--theme,
    .theme .theme.theme--lime .block-link--theme {
      color: #c1d435; }
    .block-link--theme.theme--yellow,
    .theme--yellow .block-link--theme,
    .theme .theme.theme--yellow .block-link--theme {
      color: #facf21; }
    .block-link--theme.theme--gold,
    .theme--gold .block-link--theme,
    .theme .theme.theme--gold .block-link--theme {
      color: #eb942c; }
    .block-link--theme.theme--orange,
    .theme--orange .block-link--theme,
    .theme .theme.theme--orange .block-link--theme {
      color: #e26435; }
    .block-link--theme.theme--salmon,
    .theme--salmon .block-link--theme,
    .theme .theme.theme--salmon .block-link--theme {
      color: #eb735d; }
    .block-link--theme.theme--red,
    .theme--red .block-link--theme,
    .theme .theme.theme--red .block-link--theme {
      color: #ec2d10; }
    .block-link--theme.theme--burgundy,
    .theme--burgundy .block-link--theme,
    .theme .theme.theme--burgundy .block-link--theme {
      color: #ba222a; }
    .block-link--theme.theme--purple,
    .theme--purple .block-link--theme,
    .theme .theme.theme--purple .block-link--theme {
      color: #9b3381; }
    .block-link--theme.theme--youth,
    .theme--youth .block-link--theme,
    .theme .theme.theme--youth .block-link--theme {
      color: #d57800; }
    .block-link--theme.theme--digitalisation,
    .theme--digitalisation .block-link--theme,
    .theme .theme.theme--digitalisation .block-link--theme {
      color: #9a3324; }
    .block-link--theme.theme--climate,
    .theme--climate .block-link--theme,
    .theme .theme.theme--climate .block-link--theme {
      color: #693c5e; }
    .block-link--theme.theme--gender,
    .theme--gender .block-link--theme,
    .theme .theme.theme--gender .block-link--theme {
      color: #046a38; }
    .block-link--theme.theme--nutrition,
    .theme--nutrition .block-link--theme,
    .theme .theme.theme--nutrition .block-link--theme {
      color: #487a7b; }
    .block-link--theme.theme--blog,
    .theme--blog .block-link--theme,
    .theme .theme.theme--blog .block-link--theme {
      color: #ffa300; }
    .block-link--theme.theme--spore-blue,
    .theme--spore-blue .block-link--theme,
    .theme .theme.theme--spore-blue .block-link--theme {
      color: #3f68b1; }
    .block-link--theme.theme--spore-brown,
    .theme--spore-brown .block-link--theme,
    .theme .theme.theme--spore-brown .block-link--theme {
      color: #774b04; }
    .block-link--theme.theme--spore-dark-blue,
    .theme--spore-dark-blue .block-link--theme,
    .theme .theme.theme--spore-dark-blue .block-link--theme {
      color: #044e7e; }
    .block-link--theme.theme--spore-forest-green,
    .theme--spore-forest-green .block-link--theme,
    .theme .theme.theme--spore-forest-green .block-link--theme {
      color: #5f810a; }
    .block-link--theme.theme--spore-grey-blue,
    .theme--spore-grey-blue .block-link--theme,
    .theme .theme.theme--spore-grey-blue .block-link--theme {
      color: #6d8c9f; }
    .block-link--theme.theme--spore-light-blue,
    .theme--spore-light-blue .block-link--theme,
    .theme .theme.theme--spore-light-blue .block-link--theme {
      color: #79accf; }
    .block-link--theme.theme--spore-lime,
    .theme--spore-lime .block-link--theme,
    .theme .theme.theme--spore-lime .block-link--theme {
      color: #bbae03; }
    .block-link--theme.theme--spore-ochre,
    .theme--spore-ochre .block-link--theme,
    .theme .theme.theme--spore-ochre .block-link--theme {
      color: #db9623; }
    .block-link--theme.theme--spore-olive-green,
    .theme--spore-olive-green .block-link--theme,
    .theme .theme.theme--spore-olive-green .block-link--theme {
      color: #778d3e; }
    .block-link--theme.theme--spore-red,
    .theme--spore-red .block-link--theme,
    .theme .theme.theme--spore-red .block-link--theme {
      color: #f54c23; }
    .block-link--theme.theme--spore-taupe,
    .theme--spore-taupe .block-link--theme,
    .theme .theme.theme--spore-taupe .block-link--theme {
      color: #7b6d65; }
    .block-link--theme.theme--spore-teal,
    .theme--spore-teal .block-link--theme,
    .theme .theme.theme--spore-teal .block-link--theme {
      color: #077fc1; }
  .block-link--inverse, .block-link--inverse:visited {
    color: #fff; }
    .theme--blue .block-link--inverse,
    .theme--lime .block-link--inverse,
    .theme--yellow .block-link--inverse,
    .theme--gold .block-link--inverse,
    .theme--orange .block-link--inverse,
    .theme--salmon .block-link--inverse,
    .theme--red .block-link--inverse,
    .theme--burgundy .block-link--inverse,
    .theme--purple .block-link--inverse, .theme--blue .block-link--inverse:visited,
    .theme--lime .block-link--inverse:visited,
    .theme--yellow .block-link--inverse:visited,
    .theme--gold .block-link--inverse:visited,
    .theme--orange .block-link--inverse:visited,
    .theme--salmon .block-link--inverse:visited,
    .theme--red .block-link--inverse:visited,
    .theme--burgundy .block-link--inverse:visited,
    .theme--purple .block-link--inverse:visited {
      color: #fff; }
  .block-link--inverse:hover {
    color: #3d3d3d; }
  @media only screen and (min-width: 64em) {
    .block-link {
      /* small title*/
      font-size: 0.875em;
      line-height: 1.28571; } }
  .block-link.is-active {
    color: #67ab43; }
    .block-link.is-active.theme--dark,
    .theme--dark .block-link.is-active,
    .theme .theme.theme--dark .block-link.is-active {
      color: #3d3d3d; }
    .block-link.is-active.theme--green,
    .theme--green .block-link.is-active,
    .theme .theme.theme--green .block-link.is-active {
      color: #67ab43; }
    .block-link.is-active.theme--blue,
    .theme--blue .block-link.is-active,
    .theme .theme.theme--blue .block-link.is-active {
      color: #56c0dd; }
    .block-link.is-active.theme--lime,
    .theme--lime .block-link.is-active,
    .theme .theme.theme--lime .block-link.is-active {
      color: #c1d435; }
    .block-link.is-active.theme--yellow,
    .theme--yellow .block-link.is-active,
    .theme .theme.theme--yellow .block-link.is-active {
      color: #facf21; }
    .block-link.is-active.theme--gold,
    .theme--gold .block-link.is-active,
    .theme .theme.theme--gold .block-link.is-active {
      color: #eb942c; }
    .block-link.is-active.theme--orange,
    .theme--orange .block-link.is-active,
    .theme .theme.theme--orange .block-link.is-active {
      color: #e26435; }
    .block-link.is-active.theme--salmon,
    .theme--salmon .block-link.is-active,
    .theme .theme.theme--salmon .block-link.is-active {
      color: #eb735d; }
    .block-link.is-active.theme--red,
    .theme--red .block-link.is-active,
    .theme .theme.theme--red .block-link.is-active {
      color: #ec2d10; }
    .block-link.is-active.theme--burgundy,
    .theme--burgundy .block-link.is-active,
    .theme .theme.theme--burgundy .block-link.is-active {
      color: #ba222a; }
    .block-link.is-active.theme--purple,
    .theme--purple .block-link.is-active,
    .theme .theme.theme--purple .block-link.is-active {
      color: #9b3381; }
    .block-link.is-active.theme--youth,
    .theme--youth .block-link.is-active,
    .theme .theme.theme--youth .block-link.is-active {
      color: #d57800; }
    .block-link.is-active.theme--digitalisation,
    .theme--digitalisation .block-link.is-active,
    .theme .theme.theme--digitalisation .block-link.is-active {
      color: #9a3324; }
    .block-link.is-active.theme--climate,
    .theme--climate .block-link.is-active,
    .theme .theme.theme--climate .block-link.is-active {
      color: #693c5e; }
    .block-link.is-active.theme--gender,
    .theme--gender .block-link.is-active,
    .theme .theme.theme--gender .block-link.is-active {
      color: #046a38; }
    .block-link.is-active.theme--nutrition,
    .theme--nutrition .block-link.is-active,
    .theme .theme.theme--nutrition .block-link.is-active {
      color: #487a7b; }
    .block-link.is-active.theme--blog,
    .theme--blog .block-link.is-active,
    .theme .theme.theme--blog .block-link.is-active {
      color: #ffa300; }
    .block-link.is-active.theme--spore-blue,
    .theme--spore-blue .block-link.is-active,
    .theme .theme.theme--spore-blue .block-link.is-active {
      color: #3f68b1; }
    .block-link.is-active.theme--spore-brown,
    .theme--spore-brown .block-link.is-active,
    .theme .theme.theme--spore-brown .block-link.is-active {
      color: #774b04; }
    .block-link.is-active.theme--spore-dark-blue,
    .theme--spore-dark-blue .block-link.is-active,
    .theme .theme.theme--spore-dark-blue .block-link.is-active {
      color: #044e7e; }
    .block-link.is-active.theme--spore-forest-green,
    .theme--spore-forest-green .block-link.is-active,
    .theme .theme.theme--spore-forest-green .block-link.is-active {
      color: #5f810a; }
    .block-link.is-active.theme--spore-grey-blue,
    .theme--spore-grey-blue .block-link.is-active,
    .theme .theme.theme--spore-grey-blue .block-link.is-active {
      color: #6d8c9f; }
    .block-link.is-active.theme--spore-light-blue,
    .theme--spore-light-blue .block-link.is-active,
    .theme .theme.theme--spore-light-blue .block-link.is-active {
      color: #79accf; }
    .block-link.is-active.theme--spore-lime,
    .theme--spore-lime .block-link.is-active,
    .theme .theme.theme--spore-lime .block-link.is-active {
      color: #bbae03; }
    .block-link.is-active.theme--spore-ochre,
    .theme--spore-ochre .block-link.is-active,
    .theme .theme.theme--spore-ochre .block-link.is-active {
      color: #db9623; }
    .block-link.is-active.theme--spore-olive-green,
    .theme--spore-olive-green .block-link.is-active,
    .theme .theme.theme--spore-olive-green .block-link.is-active {
      color: #778d3e; }
    .block-link.is-active.theme--spore-red,
    .theme--spore-red .block-link.is-active,
    .theme .theme.theme--spore-red .block-link.is-active {
      color: #f54c23; }
    .block-link.is-active.theme--spore-taupe,
    .theme--spore-taupe .block-link.is-active,
    .theme .theme.theme--spore-taupe .block-link.is-active {
      color: #7b6d65; }
    .block-link.is-active.theme--spore-teal,
    .theme--spore-teal .block-link.is-active,
    .theme .theme.theme--spore-teal .block-link.is-active {
      color: #077fc1; }

/* 3.29 Icon tab */
/*
Icon tabs

.icon-tab - Tab
.icon-tab.is-current - Active tab

markup:
<a class="{$modifiers}  |  icon icon--eye" href="#panel1">
  <span class="is-narrative">Project description</span>
</a>

Styleguide 3.29
*/
/*
 * 1.  The after element is transitioning with different timing, so we cancel
 *     the transition that is applied to the anchor element
 */
.icon-tab {
  background-color: #67ab43;
  display: inline-block;
  width: 42px;
  height: 42px;
  line-height: 42px;
  text-align: center;
  font-size: 24px; }
  .icon-tab.theme--dark,
  .theme--dark .icon-tab,
  .theme .theme--dark .icon-tab {
    background-color: #3d3d3d; }
  .icon-tab.theme--green,
  .theme--green .icon-tab,
  .theme .theme--green .icon-tab {
    background-color: #67ab43; }
  .icon-tab.theme--blue,
  .theme--blue .icon-tab,
  .theme .theme--blue .icon-tab {
    background-color: #56c0dd; }
  .icon-tab.theme--lime,
  .theme--lime .icon-tab,
  .theme .theme--lime .icon-tab {
    background-color: #c1d435; }
  .icon-tab.theme--yellow,
  .theme--yellow .icon-tab,
  .theme .theme--yellow .icon-tab {
    background-color: #facf21; }
  .icon-tab.theme--gold,
  .theme--gold .icon-tab,
  .theme .theme--gold .icon-tab {
    background-color: #eb942c; }
  .icon-tab.theme--orange,
  .theme--orange .icon-tab,
  .theme .theme--orange .icon-tab {
    background-color: #e26435; }
  .icon-tab.theme--salmon,
  .theme--salmon .icon-tab,
  .theme .theme--salmon .icon-tab {
    background-color: #eb735d; }
  .icon-tab.theme--red,
  .theme--red .icon-tab,
  .theme .theme--red .icon-tab {
    background-color: #ec2d10; }
  .icon-tab.theme--burgundy,
  .theme--burgundy .icon-tab,
  .theme .theme--burgundy .icon-tab {
    background-color: #ba222a; }
  .icon-tab.theme--purple,
  .theme--purple .icon-tab,
  .theme .theme--purple .icon-tab {
    background-color: #9b3381; }
  .icon-tab.theme--youth,
  .theme--youth .icon-tab,
  .theme .theme--youth .icon-tab {
    background-color: #d57800; }
  .icon-tab.theme--digitalisation,
  .theme--digitalisation .icon-tab,
  .theme .theme--digitalisation .icon-tab {
    background-color: #9a3324; }
  .icon-tab.theme--climate,
  .theme--climate .icon-tab,
  .theme .theme--climate .icon-tab {
    background-color: #693c5e; }
  .icon-tab.theme--gender,
  .theme--gender .icon-tab,
  .theme .theme--gender .icon-tab {
    background-color: #046a38; }
  .icon-tab.theme--nutrition,
  .theme--nutrition .icon-tab,
  .theme .theme--nutrition .icon-tab {
    background-color: #487a7b; }
  .icon-tab.theme--blog,
  .theme--blog .icon-tab,
  .theme .theme--blog .icon-tab {
    background-color: #ffa300; }
  .icon-tab.theme--spore-blue,
  .theme--spore-blue .icon-tab,
  .theme .theme--spore-blue .icon-tab {
    background-color: #3f68b1; }
  .icon-tab.theme--spore-brown,
  .theme--spore-brown .icon-tab,
  .theme .theme--spore-brown .icon-tab {
    background-color: #774b04; }
  .icon-tab.theme--spore-dark-blue,
  .theme--spore-dark-blue .icon-tab,
  .theme .theme--spore-dark-blue .icon-tab {
    background-color: #044e7e; }
  .icon-tab.theme--spore-forest-green,
  .theme--spore-forest-green .icon-tab,
  .theme .theme--spore-forest-green .icon-tab {
    background-color: #5f810a; }
  .icon-tab.theme--spore-grey-blue,
  .theme--spore-grey-blue .icon-tab,
  .theme .theme--spore-grey-blue .icon-tab {
    background-color: #6d8c9f; }
  .icon-tab.theme--spore-light-blue,
  .theme--spore-light-blue .icon-tab,
  .theme .theme--spore-light-blue .icon-tab {
    background-color: #79accf; }
  .icon-tab.theme--spore-lime,
  .theme--spore-lime .icon-tab,
  .theme .theme--spore-lime .icon-tab {
    background-color: #bbae03; }
  .icon-tab.theme--spore-ochre,
  .theme--spore-ochre .icon-tab,
  .theme .theme--spore-ochre .icon-tab {
    background-color: #db9623; }
  .icon-tab.theme--spore-olive-green,
  .theme--spore-olive-green .icon-tab,
  .theme .theme--spore-olive-green .icon-tab {
    background-color: #778d3e; }
  .icon-tab.theme--spore-red,
  .theme--spore-red .icon-tab,
  .theme .theme--spore-red .icon-tab {
    background-color: #f54c23; }
  .icon-tab.theme--spore-taupe,
  .theme--spore-taupe .icon-tab,
  .theme .theme--spore-taupe .icon-tab {
    background-color: #7b6d65; }
  .icon-tab.theme--spore-teal,
  .theme--spore-teal .icon-tab,
  .theme .theme--spore-teal .icon-tab {
    background-color: #077fc1; }
  .icon-tab, .icon-tab:visited, .icon-tab:hover {
    color: #fff !important; }
  .icon-tab:hover {
    background: #3d3d3d; }
  .icon-tab.is-current {
    position: relative;
    -webkit-transition-property: none;
    -moz-transition-property: none;
    transition-property: none;
    /* 1 */
    border-color: #67ab43; }
    .icon-tab.is-current.theme--dark,
    .theme--dark .icon-tab.is-current,
    .theme .theme--dark .icon-tab.is-current {
      border-color: #3d3d3d; }
    .icon-tab.is-current.theme--green,
    .theme--green .icon-tab.is-current,
    .theme .theme--green .icon-tab.is-current {
      border-color: #67ab43; }
    .icon-tab.is-current.theme--blue,
    .theme--blue .icon-tab.is-current,
    .theme .theme--blue .icon-tab.is-current {
      border-color: #56c0dd; }
    .icon-tab.is-current.theme--lime,
    .theme--lime .icon-tab.is-current,
    .theme .theme--lime .icon-tab.is-current {
      border-color: #c1d435; }
    .icon-tab.is-current.theme--yellow,
    .theme--yellow .icon-tab.is-current,
    .theme .theme--yellow .icon-tab.is-current {
      border-color: #facf21; }
    .icon-tab.is-current.theme--gold,
    .theme--gold .icon-tab.is-current,
    .theme .theme--gold .icon-tab.is-current {
      border-color: #eb942c; }
    .icon-tab.is-current.theme--orange,
    .theme--orange .icon-tab.is-current,
    .theme .theme--orange .icon-tab.is-current {
      border-color: #e26435; }
    .icon-tab.is-current.theme--salmon,
    .theme--salmon .icon-tab.is-current,
    .theme .theme--salmon .icon-tab.is-current {
      border-color: #eb735d; }
    .icon-tab.is-current.theme--red,
    .theme--red .icon-tab.is-current,
    .theme .theme--red .icon-tab.is-current {
      border-color: #ec2d10; }
    .icon-tab.is-current.theme--burgundy,
    .theme--burgundy .icon-tab.is-current,
    .theme .theme--burgundy .icon-tab.is-current {
      border-color: #ba222a; }
    .icon-tab.is-current.theme--purple,
    .theme--purple .icon-tab.is-current,
    .theme .theme--purple .icon-tab.is-current {
      border-color: #9b3381; }
    .icon-tab.is-current.theme--youth,
    .theme--youth .icon-tab.is-current,
    .theme .theme--youth .icon-tab.is-current {
      border-color: #d57800; }
    .icon-tab.is-current.theme--digitalisation,
    .theme--digitalisation .icon-tab.is-current,
    .theme .theme--digitalisation .icon-tab.is-current {
      border-color: #9a3324; }
    .icon-tab.is-current.theme--climate,
    .theme--climate .icon-tab.is-current,
    .theme .theme--climate .icon-tab.is-current {
      border-color: #693c5e; }
    .icon-tab.is-current.theme--gender,
    .theme--gender .icon-tab.is-current,
    .theme .theme--gender .icon-tab.is-current {
      border-color: #046a38; }
    .icon-tab.is-current.theme--nutrition,
    .theme--nutrition .icon-tab.is-current,
    .theme .theme--nutrition .icon-tab.is-current {
      border-color: #487a7b; }
    .icon-tab.is-current.theme--blog,
    .theme--blog .icon-tab.is-current,
    .theme .theme--blog .icon-tab.is-current {
      border-color: #ffa300; }
    .icon-tab.is-current.theme--spore-blue,
    .theme--spore-blue .icon-tab.is-current,
    .theme .theme--spore-blue .icon-tab.is-current {
      border-color: #3f68b1; }
    .icon-tab.is-current.theme--spore-brown,
    .theme--spore-brown .icon-tab.is-current,
    .theme .theme--spore-brown .icon-tab.is-current {
      border-color: #774b04; }
    .icon-tab.is-current.theme--spore-dark-blue,
    .theme--spore-dark-blue .icon-tab.is-current,
    .theme .theme--spore-dark-blue .icon-tab.is-current {
      border-color: #044e7e; }
    .icon-tab.is-current.theme--spore-forest-green,
    .theme--spore-forest-green .icon-tab.is-current,
    .theme .theme--spore-forest-green .icon-tab.is-current {
      border-color: #5f810a; }
    .icon-tab.is-current.theme--spore-grey-blue,
    .theme--spore-grey-blue .icon-tab.is-current,
    .theme .theme--spore-grey-blue .icon-tab.is-current {
      border-color: #6d8c9f; }
    .icon-tab.is-current.theme--spore-light-blue,
    .theme--spore-light-blue .icon-tab.is-current,
    .theme .theme--spore-light-blue .icon-tab.is-current {
      border-color: #79accf; }
    .icon-tab.is-current.theme--spore-lime,
    .theme--spore-lime .icon-tab.is-current,
    .theme .theme--spore-lime .icon-tab.is-current {
      border-color: #bbae03; }
    .icon-tab.is-current.theme--spore-ochre,
    .theme--spore-ochre .icon-tab.is-current,
    .theme .theme--spore-ochre .icon-tab.is-current {
      border-color: #db9623; }
    .icon-tab.is-current.theme--spore-olive-green,
    .theme--spore-olive-green .icon-tab.is-current,
    .theme .theme--spore-olive-green .icon-tab.is-current {
      border-color: #778d3e; }
    .icon-tab.is-current.theme--spore-red,
    .theme--spore-red .icon-tab.is-current,
    .theme .theme--spore-red .icon-tab.is-current {
      border-color: #f54c23; }
    .icon-tab.is-current.theme--spore-taupe,
    .theme--spore-taupe .icon-tab.is-current,
    .theme .theme--spore-taupe .icon-tab.is-current {
      border-color: #7b6d65; }
    .icon-tab.is-current.theme--spore-teal,
    .theme--spore-teal .icon-tab.is-current,
    .theme .theme--spore-teal .icon-tab.is-current {
      border-color: #077fc1; }
    .icon-tab.is-current:after {
      position: absolute;
      top: 100%;
      content: "";
      display: block;
      width: 42px;
      height: 21px;
      border: 21px solid;
      border-top-color: inherit;
      border-left-color: transparent;
      border-right-color: transparent;
      border-bottom-color: transparent;
      -webkit-transform: scale(1, 0.5) translate(0, -21px);
         -moz-transform: scale(1, 0.5) translate(0, -21px);
          -ms-transform: scale(1, 0.5) translate(0, -21px);
              transform: scale(1, 0.5) translate(0, -21px); }
    .icon-tab.is-current:hover:after {
      border-top-color: #3d3d3d; }
  @media only screen and (min-width: 48em) {
    .icon-tab {
      font-size: 24px; }
      .icon-tab.is-current:after {
        top: 0;
        right: 100%;
        border-right-color: inherit;
        border-left-color: transparent;
        border-top-color: transparent;
        border-bottom-color: transparent;
        -webkit-transform: scale(0.5, 1) translate(21px, 0);
           -moz-transform: scale(0.5, 1) translate(21px, 0);
            -ms-transform: scale(0.5, 1) translate(21px, 0);
                transform: scale(0.5, 1) translate(21px, 0); }
      .icon-tab.is-current:hover:after {
        border-top-color: transparent;
        border-right-color: #3d3d3d; } }

/* 3.30 Quote */
/*
Quote

Quote is styled slightly different in the context of a hero container

.quote - Quote with quotation marks
.quote--hero - Smaller font-size
.quote__meta - Smallest font-size
.quote.quote--light - Quote without quotation marks

markup:
<blockquote class="{$modifiers}">
  Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing Elit Sed Do Eiusmod
</blockquote>

Styleguide 3.30
*/
.quote {
  font-size: 1.25em;
  line-height: 1.05;
  position: relative;
  padding-top: 18px; }
  .quote:before {
    position: absolute;
    top: -.175em;
    display: block;
    content: open-quote;
    font-size: 2.75em;
    line-height: 1;
    color: #67ab43; }
    .well--full .quote:before {
      color: rgba(0, 0, 0, 0.26); }
  .quote:after {
    content: no-close-quote; }
  .quote.theme--dark:before,
  .theme--dark .quote:before,
  .theme .theme--dark .quote:before {
    color: #3d3d3d; }
  .quote.theme--green:before,
  .theme--green .quote:before,
  .theme .theme--green .quote:before {
    color: #67ab43; }
  .quote.theme--blue:before,
  .theme--blue .quote:before,
  .theme .theme--blue .quote:before {
    color: #56c0dd; }
  .quote.theme--lime:before,
  .theme--lime .quote:before,
  .theme .theme--lime .quote:before {
    color: #c1d435; }
  .quote.theme--yellow:before,
  .theme--yellow .quote:before,
  .theme .theme--yellow .quote:before {
    color: #facf21; }
  .quote.theme--gold:before,
  .theme--gold .quote:before,
  .theme .theme--gold .quote:before {
    color: #eb942c; }
  .quote.theme--orange:before,
  .theme--orange .quote:before,
  .theme .theme--orange .quote:before {
    color: #e26435; }
  .quote.theme--salmon:before,
  .theme--salmon .quote:before,
  .theme .theme--salmon .quote:before {
    color: #eb735d; }
  .quote.theme--red:before,
  .theme--red .quote:before,
  .theme .theme--red .quote:before {
    color: #ec2d10; }
  .quote.theme--burgundy:before,
  .theme--burgundy .quote:before,
  .theme .theme--burgundy .quote:before {
    color: #ba222a; }
  .quote.theme--purple:before,
  .theme--purple .quote:before,
  .theme .theme--purple .quote:before {
    color: #9b3381; }
  .quote.theme--youth:before,
  .theme--youth .quote:before,
  .theme .theme--youth .quote:before {
    color: #d57800; }
  .quote.theme--digitalisation:before,
  .theme--digitalisation .quote:before,
  .theme .theme--digitalisation .quote:before {
    color: #9a3324; }
  .quote.theme--climate:before,
  .theme--climate .quote:before,
  .theme .theme--climate .quote:before {
    color: #693c5e; }
  .quote.theme--gender:before,
  .theme--gender .quote:before,
  .theme .theme--gender .quote:before {
    color: #046a38; }
  .quote.theme--nutrition:before,
  .theme--nutrition .quote:before,
  .theme .theme--nutrition .quote:before {
    color: #487a7b; }
  .quote.theme--blog:before,
  .theme--blog .quote:before,
  .theme .theme--blog .quote:before {
    color: #FFA300; }
  .quote.theme--spore-blue:before,
  .theme--spore-blue .quote:before,
  .theme .theme--spore-blue .quote:before {
    color: #3f68b1; }
  .quote.theme--spore-brown:before,
  .theme--spore-brown .quote:before,
  .theme .theme--spore-brown .quote:before {
    color: #774b04; }
  .quote.theme--spore-dark-blue:before,
  .theme--spore-dark-blue .quote:before,
  .theme .theme--spore-dark-blue .quote:before {
    color: #044e7e; }
  .quote.theme--spore-forest-green:before,
  .theme--spore-forest-green .quote:before,
  .theme .theme--spore-forest-green .quote:before {
    color: #5f810a; }
  .quote.theme--spore-grey-blue:before,
  .theme--spore-grey-blue .quote:before,
  .theme .theme--spore-grey-blue .quote:before {
    color: #6d8c9f; }
  .quote.theme--spore-light-blue:before,
  .theme--spore-light-blue .quote:before,
  .theme .theme--spore-light-blue .quote:before {
    color: #79accf; }
  .quote.theme--spore-lime:before,
  .theme--spore-lime .quote:before,
  .theme .theme--spore-lime .quote:before {
    color: #bbae03; }
  .quote.theme--spore-ochre:before,
  .theme--spore-ochre .quote:before,
  .theme .theme--spore-ochre .quote:before {
    color: #db9623; }
  .quote.theme--spore-olive-green:before,
  .theme--spore-olive-green .quote:before,
  .theme .theme--spore-olive-green .quote:before {
    color: #778d3e; }
  .quote.theme--spore-red:before,
  .theme--spore-red .quote:before,
  .theme .theme--spore-red .quote:before {
    color: #f54c23; }
  .quote.theme--spore-taupe:before,
  .theme--spore-taupe .quote:before,
  .theme .theme--spore-taupe .quote:before {
    color: #7b6d65; }
  .quote.theme--spore-teal:before,
  .theme--spore-teal .quote:before,
  .theme .theme--spore-teal .quote:before {
    color: #077fc1; }
  .quote__meta {
    font-style: normal;
    font-size: 0.5em; }
  .quote--light {
    text-shadow: none; }
    .hero .quote-teaser .quote--light,
    .hero .quote-teaser .quote--light .quote__meta {
      color: #3d3d3d; }
    .quote--light:before {
      content: ""; }
  .hero .quote {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }
    .hero .quote:before {
      top: -.275em;
      color: inherit;
      opacity: .2;
      margin-top: 12px;
      font-size: 10em;
      font-weight: 600;
      left: -3px; }
  .hero .quote,
  .theme--dark .quote, .hero .quote__meta,
  .theme--dark .quote__meta {
    color: #fff; }
  .tab-teaser .quote {
    color: #3d3d3d; }
    .tab-teaser .quote:before {
      font-size: 3.125em;
      font-weight: 400;
      opacity: 1;
      margin-top: 3px;
      color: #67ab43; }
      .tab-teaser .quote:before.theme--dark,
      .theme--dark .tab-teaser .quote:before,
      .theme .theme.theme--dark .tab-teaser .quote:before {
        color: #3d3d3d; }
      .tab-teaser .quote:before.theme--green,
      .theme--green .tab-teaser .quote:before,
      .theme .theme.theme--green .tab-teaser .quote:before {
        color: #67ab43; }
      .tab-teaser .quote:before.theme--blue,
      .theme--blue .tab-teaser .quote:before,
      .theme .theme.theme--blue .tab-teaser .quote:before {
        color: #56c0dd; }
      .tab-teaser .quote:before.theme--lime,
      .theme--lime .tab-teaser .quote:before,
      .theme .theme.theme--lime .tab-teaser .quote:before {
        color: #c1d435; }
      .tab-teaser .quote:before.theme--yellow,
      .theme--yellow .tab-teaser .quote:before,
      .theme .theme.theme--yellow .tab-teaser .quote:before {
        color: #facf21; }
      .tab-teaser .quote:before.theme--gold,
      .theme--gold .tab-teaser .quote:before,
      .theme .theme.theme--gold .tab-teaser .quote:before {
        color: #eb942c; }
      .tab-teaser .quote:before.theme--orange,
      .theme--orange .tab-teaser .quote:before,
      .theme .theme.theme--orange .tab-teaser .quote:before {
        color: #e26435; }
      .tab-teaser .quote:before.theme--salmon,
      .theme--salmon .tab-teaser .quote:before,
      .theme .theme.theme--salmon .tab-teaser .quote:before {
        color: #eb735d; }
      .tab-teaser .quote:before.theme--red,
      .theme--red .tab-teaser .quote:before,
      .theme .theme.theme--red .tab-teaser .quote:before {
        color: #ec2d10; }
      .tab-teaser .quote:before.theme--burgundy,
      .theme--burgundy .tab-teaser .quote:before,
      .theme .theme.theme--burgundy .tab-teaser .quote:before {
        color: #ba222a; }
      .tab-teaser .quote:before.theme--purple,
      .theme--purple .tab-teaser .quote:before,
      .theme .theme.theme--purple .tab-teaser .quote:before {
        color: #9b3381; }
      .tab-teaser .quote:before.theme--youth,
      .theme--youth .tab-teaser .quote:before,
      .theme .theme.theme--youth .tab-teaser .quote:before {
        color: #d57800; }
      .tab-teaser .quote:before.theme--digitalisation,
      .theme--digitalisation .tab-teaser .quote:before,
      .theme .theme.theme--digitalisation .tab-teaser .quote:before {
        color: #9a3324; }
      .tab-teaser .quote:before.theme--climate,
      .theme--climate .tab-teaser .quote:before,
      .theme .theme.theme--climate .tab-teaser .quote:before {
        color: #693c5e; }
      .tab-teaser .quote:before.theme--gender,
      .theme--gender .tab-teaser .quote:before,
      .theme .theme.theme--gender .tab-teaser .quote:before {
        color: #046a38; }
      .tab-teaser .quote:before.theme--nutrition,
      .theme--nutrition .tab-teaser .quote:before,
      .theme .theme.theme--nutrition .tab-teaser .quote:before {
        color: #487a7b; }
      .tab-teaser .quote:before.theme--blog,
      .theme--blog .tab-teaser .quote:before,
      .theme .theme.theme--blog .tab-teaser .quote:before {
        color: #ffa300; }
      .tab-teaser .quote:before.theme--spore-blue,
      .theme--spore-blue .tab-teaser .quote:before,
      .theme .theme.theme--spore-blue .tab-teaser .quote:before {
        color: #3f68b1; }
      .tab-teaser .quote:before.theme--spore-brown,
      .theme--spore-brown .tab-teaser .quote:before,
      .theme .theme.theme--spore-brown .tab-teaser .quote:before {
        color: #774b04; }
      .tab-teaser .quote:before.theme--spore-dark-blue,
      .theme--spore-dark-blue .tab-teaser .quote:before,
      .theme .theme.theme--spore-dark-blue .tab-teaser .quote:before {
        color: #044e7e; }
      .tab-teaser .quote:before.theme--spore-forest-green,
      .theme--spore-forest-green .tab-teaser .quote:before,
      .theme .theme.theme--spore-forest-green .tab-teaser .quote:before {
        color: #5f810a; }
      .tab-teaser .quote:before.theme--spore-grey-blue,
      .theme--spore-grey-blue .tab-teaser .quote:before,
      .theme .theme.theme--spore-grey-blue .tab-teaser .quote:before {
        color: #6d8c9f; }
      .tab-teaser .quote:before.theme--spore-light-blue,
      .theme--spore-light-blue .tab-teaser .quote:before,
      .theme .theme.theme--spore-light-blue .tab-teaser .quote:before {
        color: #79accf; }
      .tab-teaser .quote:before.theme--spore-lime,
      .theme--spore-lime .tab-teaser .quote:before,
      .theme .theme.theme--spore-lime .tab-teaser .quote:before {
        color: #bbae03; }
      .tab-teaser .quote:before.theme--spore-ochre,
      .theme--spore-ochre .tab-teaser .quote:before,
      .theme .theme.theme--spore-ochre .tab-teaser .quote:before {
        color: #db9623; }
      .tab-teaser .quote:before.theme--spore-olive-green,
      .theme--spore-olive-green .tab-teaser .quote:before,
      .theme .theme.theme--spore-olive-green .tab-teaser .quote:before {
        color: #778d3e; }
      .tab-teaser .quote:before.theme--spore-red,
      .theme--spore-red .tab-teaser .quote:before,
      .theme .theme.theme--spore-red .tab-teaser .quote:before {
        color: #f54c23; }
      .tab-teaser .quote:before.theme--spore-taupe,
      .theme--spore-taupe .tab-teaser .quote:before,
      .theme .theme.theme--spore-taupe .tab-teaser .quote:before {
        color: #7b6d65; }
      .tab-teaser .quote:before.theme--spore-teal,
      .theme--spore-teal .tab-teaser .quote:before,
      .theme .theme.theme--spore-teal .tab-teaser .quote:before {
        color: #077fc1; }
  .quote-teaser {
    text-shadow: 0 0 30px black; }
  @media only screen and (min-width: 48em) {
    .quote:before {
      top: -.2em; }
    .hero .quote:before {
      top: -.275em;
      left: -18px; }
    .hero .quote__meta {
      font-size: 0.42857em; }
    .tab-teaser .quote {
      font-size: 1.875em; } }
  @media only screen and (min-width: 64em) {
    .quote {
      font-size: 1.75em;
      line-height: 1.17857; }
      .hero .quote:before {
        left: -18px; }
      .tab-teaser .quote:before {
        left: 0;
        top: -30px; }
      .quote-teaser {
        width: 33.33333vw; } }

/* 3.31 Read more */
/*
Read more

Read more link

markup:
<a class="read-more" href="javascript:void(0);">Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing Elit Sed Do Eiusmod</a>

Styleguide 3.31
*/
.read-more {
  /* regular meta */
  font-size: 0.75em;
  line-height: 1.25;
  color: #67ab43;
  font-weight: 600;
  display: inline-block;
  margin-top: 6px;
  margin-bottom: 6px; }
  .read-more.theme--dark,
  .theme--dark .read-more,
  .theme .theme.theme--dark .read-more {
    color: #3d3d3d; }
  .read-more.theme--green,
  .theme--green .read-more,
  .theme .theme.theme--green .read-more {
    color: #67ab43; }
  .read-more.theme--blue,
  .theme--blue .read-more,
  .theme .theme.theme--blue .read-more {
    color: #56c0dd; }
  .read-more.theme--lime,
  .theme--lime .read-more,
  .theme .theme.theme--lime .read-more {
    color: #c1d435; }
  .read-more.theme--yellow,
  .theme--yellow .read-more,
  .theme .theme.theme--yellow .read-more {
    color: #facf21; }
  .read-more.theme--gold,
  .theme--gold .read-more,
  .theme .theme.theme--gold .read-more {
    color: #eb942c; }
  .read-more.theme--orange,
  .theme--orange .read-more,
  .theme .theme.theme--orange .read-more {
    color: #e26435; }
  .read-more.theme--salmon,
  .theme--salmon .read-more,
  .theme .theme.theme--salmon .read-more {
    color: #eb735d; }
  .read-more.theme--red,
  .theme--red .read-more,
  .theme .theme.theme--red .read-more {
    color: #ec2d10; }
  .read-more.theme--burgundy,
  .theme--burgundy .read-more,
  .theme .theme.theme--burgundy .read-more {
    color: #ba222a; }
  .read-more.theme--purple,
  .theme--purple .read-more,
  .theme .theme.theme--purple .read-more {
    color: #9b3381; }
  .read-more.theme--youth,
  .theme--youth .read-more,
  .theme .theme.theme--youth .read-more {
    color: #d57800; }
  .read-more.theme--digitalisation,
  .theme--digitalisation .read-more,
  .theme .theme.theme--digitalisation .read-more {
    color: #9a3324; }
  .read-more.theme--climate,
  .theme--climate .read-more,
  .theme .theme.theme--climate .read-more {
    color: #693c5e; }
  .read-more.theme--gender,
  .theme--gender .read-more,
  .theme .theme.theme--gender .read-more {
    color: #046a38; }
  .read-more.theme--nutrition,
  .theme--nutrition .read-more,
  .theme .theme.theme--nutrition .read-more {
    color: #487a7b; }
  .read-more.theme--blog,
  .theme--blog .read-more,
  .theme .theme.theme--blog .read-more {
    color: #ffa300; }
  .read-more.theme--spore-blue,
  .theme--spore-blue .read-more,
  .theme .theme.theme--spore-blue .read-more {
    color: #3f68b1; }
  .read-more.theme--spore-brown,
  .theme--spore-brown .read-more,
  .theme .theme.theme--spore-brown .read-more {
    color: #774b04; }
  .read-more.theme--spore-dark-blue,
  .theme--spore-dark-blue .read-more,
  .theme .theme.theme--spore-dark-blue .read-more {
    color: #044e7e; }
  .read-more.theme--spore-forest-green,
  .theme--spore-forest-green .read-more,
  .theme .theme.theme--spore-forest-green .read-more {
    color: #5f810a; }
  .read-more.theme--spore-grey-blue,
  .theme--spore-grey-blue .read-more,
  .theme .theme.theme--spore-grey-blue .read-more {
    color: #6d8c9f; }
  .read-more.theme--spore-light-blue,
  .theme--spore-light-blue .read-more,
  .theme .theme.theme--spore-light-blue .read-more {
    color: #79accf; }
  .read-more.theme--spore-lime,
  .theme--spore-lime .read-more,
  .theme .theme.theme--spore-lime .read-more {
    color: #bbae03; }
  .read-more.theme--spore-ochre,
  .theme--spore-ochre .read-more,
  .theme .theme.theme--spore-ochre .read-more {
    color: #db9623; }
  .read-more.theme--spore-olive-green,
  .theme--spore-olive-green .read-more,
  .theme .theme.theme--spore-olive-green .read-more {
    color: #778d3e; }
  .read-more.theme--spore-red,
  .theme--spore-red .read-more,
  .theme .theme.theme--spore-red .read-more {
    color: #f54c23; }
  .read-more.theme--spore-taupe,
  .theme--spore-taupe .read-more,
  .theme .theme.theme--spore-taupe .read-more {
    color: #7b6d65; }
  .read-more.theme--spore-teal,
  .theme--spore-teal .read-more,
  .theme .theme.theme--spore-teal .read-more {
    color: #077fc1; }

/* 3.32 Globe */
/*
Globe

.globe - Globe

markup:
<img class="{$modifiers}  |  leader  |  trailer  |  gutters-outside" src="/images/globes/western-africa.png" alt="Picture of the globe with Western Africa highlighted." width="214" height="214"/>

Styleguide 3.32
*/
.globe {
  display: block;
  background: #A0DDEC;
  border: 2px solid #fff;
  width: 99px;
  height: 99px;
  -moz-box-shadow: 2px 2px 2px 0 rgba(61, 61, 61, 0.26);
       box-shadow: 2px 2px 2px 0 rgba(61, 61, 61, 0.26); }
  .globe-regions__image {
    width: 99px;
    height: 99px; }
  @media only screen and (min-width: 32.5em) {
    .globe {
      width: 126px;
      height: 126px; } }

/* 3.33 Stats */
/*
Statistic

.stat - Statistic
.stat.stat--s - Small statistic

markup:
<figure class="{$modifiers}">
  <p class="stat__figure">+57%</p>
  <figcaption>
    <h2 class="stat__caption  |  meta meta--s  |  leader--small  |  trailer--small">
        <span class="is-narrative">+57% </span>of people in WESTERN Africa is employed in agriculture
    </h2>
    <p class="stat__title body--quiet">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
    </p>
  </figcaption>
</figure>

Styleguide 3.33
*/
.stat {
  display: block;
  text-align: center; }
  .stat__figure, .stat__caption {
    font-family: "Open Sans", sans-serif;
    font-weight: 600; }
  .article-headline .stat__caption {
    font-weight: 400; }
  .stat__caption, .stat__figure, .stat__title {
    color: inherit; }
  .stat__figure {
    /* hero title*/
    font-size: 1.875em;
    line-height: 1.1; }
  .stat--s .stat__figure {
    font-size: 16px;
    line-height: 1; }
  .stat--padded {
    padding-top: 9px;
    padding-bottom: 9px; }
  @media only screen and (min-width: 48em) {
    .stat__subtitle {
      width: 75%;
      margin: 0 auto; } }
  @media only screen and (min-width: 90em) {
    .stat__subtitle {
      width: 50%; } }
  @media only screen and (min-width: 48em) {
    .stat .stat__figure {
      font-size: 60px;
      line-height: 1; }
    .article-headline .stat__figure {
      font-size: 48px; }
    .stat--s .stat__figure {
      font-size: 30px; }
    .stat--padded {
      padding-top: 15px;
      padding-bottom: 15px; } }

/* 3.34 Download */
/*
Download

markup:
<ul class="reset">
    <li class="trailer--small">
        <div class="media  |  leader--small">
            <div class="media__figure">
                <a class="icon icon--download" href="javascript:void();"></a>
            </div>
            <div class="media__body  |  gutters">
                <a class="block-link" href="javascript:void();">CTA's Strategic Plan 2016-2020</a>
                <p class="download-size">Synthesis version, 622 KB</p>
            </div>
        </div>
    </li>
    <li class="trailer-small">
        <div class="media  |  leader--small">
            <div class="media__figure">
                <a class="icon icon--download" href="javascript:void();"></a>
            </div>
            <div class="media__body  |  gutters">
                <a class="block-link" href="javascript:void();">CTA's Strategic Plan 2016-2020</a>
                <p class="download-size">Full version, 622 KB</p>
            </div>
        </div>
    </li>
</ul>

Styleguide 3.34
*/
.download-size {
  font-size: 0.75em;
  line-height: 1.25; }

/* 3.35 Outline */
/*
Outline

Note: Outline is only visible on mobile viewport

.outline - Adds border system around 4 blocks on mobile viewport
.outline.outline--inverse - Inverted colors
.outline.outline--aside -  Adds additional borders to the side on desktop viewport

markup:
<div class="{$modifiers}  |  grid grid--posts">
	<div class="grid__cell  |  outline__border">
		<div class="outline__side  |  trailer trailer-inside | leader leader-inside">
			Block 1
		</div>
	</div>
	<div class="grid__cell  |  outline__border">
		<div class="outline__side  |  trailer trailer-inside | leader leader-inside">
			Block 2
		</div>
	</div>
	<div class="grid__cell  |  outline__border">
		<div class="outline__side  |  trailer trailer-inside | leader leader-inside">
			Block 3
		</div>
	</div>
	<div class="grid__cell  |  outline__border">
		<div class="outline__side  |  trailer trailer-inside | leader leader-inside">
			Block 4
		</div>
	</div>
</div>

Styleguide 3.35
*/
@media only screen and (max-width: 47.9375em) {
  .outline__border {
    padding: 15px 0; }
    .outline__border:nth-last-child(-n+2) {
      border-top: 1px solid #cdcdcd;
      border-top: 1px solid rgba(103, 171, 67, 0.26); }
    .outline__border:nth-child(odd) .outline__side {
      border-right: 1px solid #cdcdcd;
      border-right: 1px solid rgba(103, 171, 67, 0.26); }
  .outline .outline__border:nth-child(odd) .outline__border,
  .outline .outline__border:nth-last-child(-n+2),
  .outline .outline__side:nth-child(odd) {
    border-color: #d7e9ce; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--dark,
    .theme--dark .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--dark .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--dark,
    .theme--dark
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--dark
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--dark,
    .theme--dark
    .outline .outline__side:nth-child(odd),
    .theme .theme--dark
    .outline .outline__side:nth-child(odd) {
      border-color: #cdcdcd; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--green,
    .theme--green .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--green .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--green,
    .theme--green
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--green
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--green,
    .theme--green
    .outline .outline__side:nth-child(odd),
    .theme .theme--green
    .outline .outline__side:nth-child(odd) {
      border-color: #d7e9ce; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--blue,
    .theme--blue .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--blue .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--blue,
    .theme--blue
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--blue
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--blue,
    .theme--blue
    .outline .outline__side:nth-child(odd),
    .theme .theme--blue
    .outline .outline__side:nth-child(odd) {
      border-color: #d3eff6; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--lime,
    .theme--lime .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--lime .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--lime,
    .theme--lime
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--lime
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--lime,
    .theme--lime
    .outline .outline__side:nth-child(odd),
    .theme .theme--lime
    .outline .outline__side:nth-child(odd) {
      border-color: #eff4ca; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--yellow,
    .theme--yellow .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--yellow .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--yellow,
    .theme--yellow
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--yellow
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--yellow,
    .theme--yellow
    .outline .outline__side:nth-child(odd),
    .theme .theme--yellow
    .outline .outline__side:nth-child(odd) {
      border-color: #fef3c5; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--gold,
    .theme--gold .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--gold .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--gold,
    .theme--gold
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--gold
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--gold,
    .theme--gold
    .outline .outline__side:nth-child(odd),
    .theme .theme--gold
    .outline .outline__side:nth-child(odd) {
      border-color: #fae3c8; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--orange,
    .theme--orange .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--orange .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--orange,
    .theme--orange
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--orange
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--orange,
    .theme--orange
    .outline .outline__side:nth-child(odd),
    .theme .theme--orange
    .outline .outline__side:nth-child(odd) {
      border-color: #f7d7ca; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--salmon,
    .theme--salmon .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--salmon .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--salmon,
    .theme--salmon
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--salmon
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--salmon,
    .theme--salmon
    .outline .outline__side:nth-child(odd),
    .theme .theme--salmon
    .outline .outline__side:nth-child(odd) {
      border-color: #fadbd5; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--red,
    .theme--red .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--red .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--red,
    .theme--red
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--red
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--red,
    .theme--red
    .outline .outline__side:nth-child(odd),
    .theme .theme--red
    .outline .outline__side:nth-child(odd) {
      border-color: #fac8c1; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--burgundy,
    .theme--burgundy .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--burgundy .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--burgundy,
    .theme--burgundy
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--burgundy
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--burgundy,
    .theme--burgundy
    .outline .outline__side:nth-child(odd),
    .theme .theme--burgundy
    .outline .outline__side:nth-child(odd) {
      border-color: #edc6c8; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--purple,
    .theme--purple .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--purple .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--purple,
    .theme--purple
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--purple
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--purple,
    .theme--purple
    .outline .outline__side:nth-child(odd),
    .theme .theme--purple
    .outline .outline__side:nth-child(odd) {
      border-color: #e5cade; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--youth,
    .theme--youth .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--youth .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--youth,
    .theme--youth
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--youth
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--youth,
    .theme--youth
    .outline .outline__side:nth-child(odd),
    .theme .theme--youth
    .outline .outline__side:nth-child(odd) {
      border-color: #f4dcbd; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--digitalisation,
    .theme--digitalisation .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--digitalisation .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--digitalisation,
    .theme--digitalisation
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--digitalisation
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--digitalisation,
    .theme--digitalisation
    .outline .outline__side:nth-child(odd),
    .theme .theme--digitalisation
    .outline .outline__side:nth-child(odd) {
      border-color: #e5cac6; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--climate,
    .theme--climate .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--climate .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--climate,
    .theme--climate
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--climate
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--climate,
    .theme--climate
    .outline .outline__side:nth-child(odd),
    .theme .theme--climate
    .outline .outline__side:nth-child(odd) {
      border-color: #d8ccd5; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--gender,
    .theme--gender .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--gender .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--gender,
    .theme--gender
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--gender
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--gender,
    .theme--gender
    .outline .outline__side:nth-child(odd),
    .theme .theme--gender
    .outline .outline__side:nth-child(odd) {
      border-color: #bed8cb; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--nutrition,
    .theme--nutrition .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--nutrition .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--nutrition,
    .theme--nutrition
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--nutrition
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--nutrition,
    .theme--nutrition
    .outline .outline__side:nth-child(odd),
    .theme .theme--nutrition
    .outline .outline__side:nth-child(odd) {
      border-color: #cfdcdd; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--blog,
    .theme--blog .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--blog .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--blog,
    .theme--blog
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--blog
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--blog,
    .theme--blog
    .outline .outline__side:nth-child(odd),
    .theme .theme--blog
    .outline .outline__side:nth-child(odd) {
      border-color: #ffe7bd; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-blue,
    .theme--spore-blue .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-blue .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-blue,
    .theme--spore-blue
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-blue
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-blue,
    .theme--spore-blue
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-blue
    .outline .outline__side:nth-child(odd) {
      border-color: #cdd8eb; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-brown,
    .theme--spore-brown .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-brown .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-brown,
    .theme--spore-brown
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-brown
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-brown,
    .theme--spore-brown
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-brown
    .outline .outline__side:nth-child(odd) {
      border-color: #dcd0be; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-dark-blue,
    .theme--spore-dark-blue .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-dark-blue .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-dark-blue,
    .theme--spore-dark-blue
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-dark-blue
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-dark-blue,
    .theme--spore-dark-blue
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-dark-blue
    .outline .outline__side:nth-child(odd) {
      border-color: #bed1dd; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-forest-green,
    .theme--spore-forest-green .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-forest-green .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-forest-green,
    .theme--spore-forest-green
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-forest-green
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-forest-green,
    .theme--spore-forest-green
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-forest-green
    .outline .outline__side:nth-child(odd) {
      border-color: #d5debf; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-grey-blue,
    .theme--spore-grey-blue .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-grey-blue .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-grey-blue,
    .theme--spore-grey-blue
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-grey-blue
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-grey-blue,
    .theme--spore-grey-blue
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-grey-blue
    .outline .outline__side:nth-child(odd) {
      border-color: #d9e1e6; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-light-blue,
    .theme--spore-light-blue .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-light-blue .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-light-blue,
    .theme--spore-light-blue
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-light-blue
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-light-blue,
    .theme--spore-light-blue
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-light-blue
    .outline .outline__side:nth-child(odd) {
      border-color: #dce9f3; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-lime,
    .theme--spore-lime .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-lime .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-lime,
    .theme--spore-lime
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-lime
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-lime,
    .theme--spore-lime
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-lime
    .outline .outline__side:nth-child(odd) {
      border-color: #edeabd; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-ochre,
    .theme--spore-ochre .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-ochre .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-ochre,
    .theme--spore-ochre
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-ochre
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-ochre,
    .theme--spore-ochre
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-ochre
    .outline .outline__side:nth-child(odd) {
      border-color: #f6e4c6; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-olive-green,
    .theme--spore-olive-green .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-olive-green .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-olive-green,
    .theme--spore-olive-green
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-olive-green
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-olive-green,
    .theme--spore-olive-green
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-olive-green
    .outline .outline__side:nth-child(odd) {
      border-color: #dce1cd; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-red,
    .theme--spore-red .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-red .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-red,
    .theme--spore-red
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-red
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-red,
    .theme--spore-red
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-red
    .outline .outline__side:nth-child(odd) {
      border-color: #fcd0c6; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-taupe,
    .theme--spore-taupe .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-taupe .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-taupe,
    .theme--spore-taupe
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-taupe
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-taupe,
    .theme--spore-taupe
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-taupe
    .outline .outline__side:nth-child(odd) {
      border-color: #ddd9d7; }
    .outline .outline__border:nth-child(odd) .outline__border.theme--spore-teal,
    .theme--spore-teal .outline .outline__border:nth-child(odd) .outline__border,
    .theme .theme--spore-teal .outline .outline__border:nth-child(odd) .outline__border,
    .outline .outline__border:nth-last-child(-n+2).theme--spore-teal,
    .theme--spore-teal
    .outline .outline__border:nth-last-child(-n+2),
    .theme .theme--spore-teal
    .outline .outline__border:nth-last-child(-n+2),
    .outline .outline__side:nth-child(odd).theme--spore-teal,
    .theme--spore-teal
    .outline .outline__side:nth-child(odd),
    .theme .theme--spore-teal
    .outline .outline__side:nth-child(odd) {
      border-color: #bfdeef; }
  .outline--inverse .outline__border:nth-last-child(-n+2),
  .outline--inverse .outline__border:nth-child(odd) .outline__side,
  .outline--inverse .outline__border:nth-child(odd) .outline__border,
  .outline--inverse .outline__side:nth-child(odd) {
    border-color: rgba(255, 255, 255, 0.8); } }

@media only screen and (min-width: 48em) {
  .outline--aside .outline__border .outline__side {
    border-right: 1px solid rgba(255, 255, 255, 0.8); }
  .outline--aside .outline__border:last-child .outline__side {
    border-right: 0; } }

/* 3.36 Tabs */
/*
Tabs

.tab - Generic tab
.tab.is-active - Active tab with triangle border

markup:
<a class="{$modifiers}  |  meta" href="javascript:void();">Tab</a>

Styleguide 3.36
*/
.tab {
  padding: 6px 18px; }
  .tab.is-active, .tab.is-current {
    position: relative;
    color: #fff;
    background: #67ab43;
    background-color: #67ab43;
    border-color: #67ab43; }
    .tab.is-active.theme--dark,
    .theme--dark .tab.is-active,
    .theme .theme--dark .tab.is-active, .tab.is-current.theme--dark,
    .theme--dark .tab.is-current,
    .theme .theme--dark .tab.is-current {
      background-color: #3d3d3d; }
    .tab.is-active.theme--green,
    .theme--green .tab.is-active,
    .theme .theme--green .tab.is-active, .tab.is-current.theme--green,
    .theme--green .tab.is-current,
    .theme .theme--green .tab.is-current {
      background-color: #67ab43; }
    .tab.is-active.theme--blue,
    .theme--blue .tab.is-active,
    .theme .theme--blue .tab.is-active, .tab.is-current.theme--blue,
    .theme--blue .tab.is-current,
    .theme .theme--blue .tab.is-current {
      background-color: #56c0dd; }
    .tab.is-active.theme--lime,
    .theme--lime .tab.is-active,
    .theme .theme--lime .tab.is-active, .tab.is-current.theme--lime,
    .theme--lime .tab.is-current,
    .theme .theme--lime .tab.is-current {
      background-color: #c1d435; }
    .tab.is-active.theme--yellow,
    .theme--yellow .tab.is-active,
    .theme .theme--yellow .tab.is-active, .tab.is-current.theme--yellow,
    .theme--yellow .tab.is-current,
    .theme .theme--yellow .tab.is-current {
      background-color: #facf21; }
    .tab.is-active.theme--gold,
    .theme--gold .tab.is-active,
    .theme .theme--gold .tab.is-active, .tab.is-current.theme--gold,
    .theme--gold .tab.is-current,
    .theme .theme--gold .tab.is-current {
      background-color: #eb942c; }
    .tab.is-active.theme--orange,
    .theme--orange .tab.is-active,
    .theme .theme--orange .tab.is-active, .tab.is-current.theme--orange,
    .theme--orange .tab.is-current,
    .theme .theme--orange .tab.is-current {
      background-color: #e26435; }
    .tab.is-active.theme--salmon,
    .theme--salmon .tab.is-active,
    .theme .theme--salmon .tab.is-active, .tab.is-current.theme--salmon,
    .theme--salmon .tab.is-current,
    .theme .theme--salmon .tab.is-current {
      background-color: #eb735d; }
    .tab.is-active.theme--red,
    .theme--red .tab.is-active,
    .theme .theme--red .tab.is-active, .tab.is-current.theme--red,
    .theme--red .tab.is-current,
    .theme .theme--red .tab.is-current {
      background-color: #ec2d10; }
    .tab.is-active.theme--burgundy,
    .theme--burgundy .tab.is-active,
    .theme .theme--burgundy .tab.is-active, .tab.is-current.theme--burgundy,
    .theme--burgundy .tab.is-current,
    .theme .theme--burgundy .tab.is-current {
      background-color: #ba222a; }
    .tab.is-active.theme--purple,
    .theme--purple .tab.is-active,
    .theme .theme--purple .tab.is-active, .tab.is-current.theme--purple,
    .theme--purple .tab.is-current,
    .theme .theme--purple .tab.is-current {
      background-color: #9b3381; }
    .tab.is-active.theme--youth,
    .theme--youth .tab.is-active,
    .theme .theme--youth .tab.is-active, .tab.is-current.theme--youth,
    .theme--youth .tab.is-current,
    .theme .theme--youth .tab.is-current {
      background-color: #d57800; }
    .tab.is-active.theme--digitalisation,
    .theme--digitalisation .tab.is-active,
    .theme .theme--digitalisation .tab.is-active, .tab.is-current.theme--digitalisation,
    .theme--digitalisation .tab.is-current,
    .theme .theme--digitalisation .tab.is-current {
      background-color: #9a3324; }
    .tab.is-active.theme--climate,
    .theme--climate .tab.is-active,
    .theme .theme--climate .tab.is-active, .tab.is-current.theme--climate,
    .theme--climate .tab.is-current,
    .theme .theme--climate .tab.is-current {
      background-color: #693c5e; }
    .tab.is-active.theme--gender,
    .theme--gender .tab.is-active,
    .theme .theme--gender .tab.is-active, .tab.is-current.theme--gender,
    .theme--gender .tab.is-current,
    .theme .theme--gender .tab.is-current {
      background-color: #046a38; }
    .tab.is-active.theme--nutrition,
    .theme--nutrition .tab.is-active,
    .theme .theme--nutrition .tab.is-active, .tab.is-current.theme--nutrition,
    .theme--nutrition .tab.is-current,
    .theme .theme--nutrition .tab.is-current {
      background-color: #487a7b; }
    .tab.is-active.theme--blog,
    .theme--blog .tab.is-active,
    .theme .theme--blog .tab.is-active, .tab.is-current.theme--blog,
    .theme--blog .tab.is-current,
    .theme .theme--blog .tab.is-current {
      background-color: #FFA300; }
    .tab.is-active.theme--spore-blue,
    .theme--spore-blue .tab.is-active,
    .theme .theme--spore-blue .tab.is-active, .tab.is-current.theme--spore-blue,
    .theme--spore-blue .tab.is-current,
    .theme .theme--spore-blue .tab.is-current {
      background-color: #3f68b1; }
    .tab.is-active.theme--spore-brown,
    .theme--spore-brown .tab.is-active,
    .theme .theme--spore-brown .tab.is-active, .tab.is-current.theme--spore-brown,
    .theme--spore-brown .tab.is-current,
    .theme .theme--spore-brown .tab.is-current {
      background-color: #774b04; }
    .tab.is-active.theme--spore-dark-blue,
    .theme--spore-dark-blue .tab.is-active,
    .theme .theme--spore-dark-blue .tab.is-active, .tab.is-current.theme--spore-dark-blue,
    .theme--spore-dark-blue .tab.is-current,
    .theme .theme--spore-dark-blue .tab.is-current {
      background-color: #044e7e; }
    .tab.is-active.theme--spore-forest-green,
    .theme--spore-forest-green .tab.is-active,
    .theme .theme--spore-forest-green .tab.is-active, .tab.is-current.theme--spore-forest-green,
    .theme--spore-forest-green .tab.is-current,
    .theme .theme--spore-forest-green .tab.is-current {
      background-color: #5f810a; }
    .tab.is-active.theme--spore-grey-blue,
    .theme--spore-grey-blue .tab.is-active,
    .theme .theme--spore-grey-blue .tab.is-active, .tab.is-current.theme--spore-grey-blue,
    .theme--spore-grey-blue .tab.is-current,
    .theme .theme--spore-grey-blue .tab.is-current {
      background-color: #6d8c9f; }
    .tab.is-active.theme--spore-light-blue,
    .theme--spore-light-blue .tab.is-active,
    .theme .theme--spore-light-blue .tab.is-active, .tab.is-current.theme--spore-light-blue,
    .theme--spore-light-blue .tab.is-current,
    .theme .theme--spore-light-blue .tab.is-current {
      background-color: #79accf; }
    .tab.is-active.theme--spore-lime,
    .theme--spore-lime .tab.is-active,
    .theme .theme--spore-lime .tab.is-active, .tab.is-current.theme--spore-lime,
    .theme--spore-lime .tab.is-current,
    .theme .theme--spore-lime .tab.is-current {
      background-color: #bbae03; }
    .tab.is-active.theme--spore-ochre,
    .theme--spore-ochre .tab.is-active,
    .theme .theme--spore-ochre .tab.is-active, .tab.is-current.theme--spore-ochre,
    .theme--spore-ochre .tab.is-current,
    .theme .theme--spore-ochre .tab.is-current {
      background-color: #db9623; }
    .tab.is-active.theme--spore-olive-green,
    .theme--spore-olive-green .tab.is-active,
    .theme .theme--spore-olive-green .tab.is-active, .tab.is-current.theme--spore-olive-green,
    .theme--spore-olive-green .tab.is-current,
    .theme .theme--spore-olive-green .tab.is-current {
      background-color: #778d3e; }
    .tab.is-active.theme--spore-red,
    .theme--spore-red .tab.is-active,
    .theme .theme--spore-red .tab.is-active, .tab.is-current.theme--spore-red,
    .theme--spore-red .tab.is-current,
    .theme .theme--spore-red .tab.is-current {
      background-color: #f54c23; }
    .tab.is-active.theme--spore-taupe,
    .theme--spore-taupe .tab.is-active,
    .theme .theme--spore-taupe .tab.is-active, .tab.is-current.theme--spore-taupe,
    .theme--spore-taupe .tab.is-current,
    .theme .theme--spore-taupe .tab.is-current {
      background-color: #7b6d65; }
    .tab.is-active.theme--spore-teal,
    .theme--spore-teal .tab.is-active,
    .theme .theme--spore-teal .tab.is-active, .tab.is-current.theme--spore-teal,
    .theme--spore-teal .tab.is-current,
    .theme .theme--spore-teal .tab.is-current {
      background-color: #077fc1; }
    .tab.is-active.theme--dark,
    .theme--dark .tab.is-active,
    .theme .theme--dark .tab.is-active, .tab.is-current.theme--dark,
    .theme--dark .tab.is-current,
    .theme .theme--dark .tab.is-current {
      border-color: #3d3d3d; }
    .tab.is-active.theme--green,
    .theme--green .tab.is-active,
    .theme .theme--green .tab.is-active, .tab.is-current.theme--green,
    .theme--green .tab.is-current,
    .theme .theme--green .tab.is-current {
      border-color: #67ab43; }
    .tab.is-active.theme--blue,
    .theme--blue .tab.is-active,
    .theme .theme--blue .tab.is-active, .tab.is-current.theme--blue,
    .theme--blue .tab.is-current,
    .theme .theme--blue .tab.is-current {
      border-color: #56c0dd; }
    .tab.is-active.theme--lime,
    .theme--lime .tab.is-active,
    .theme .theme--lime .tab.is-active, .tab.is-current.theme--lime,
    .theme--lime .tab.is-current,
    .theme .theme--lime .tab.is-current {
      border-color: #c1d435; }
    .tab.is-active.theme--yellow,
    .theme--yellow .tab.is-active,
    .theme .theme--yellow .tab.is-active, .tab.is-current.theme--yellow,
    .theme--yellow .tab.is-current,
    .theme .theme--yellow .tab.is-current {
      border-color: #facf21; }
    .tab.is-active.theme--gold,
    .theme--gold .tab.is-active,
    .theme .theme--gold .tab.is-active, .tab.is-current.theme--gold,
    .theme--gold .tab.is-current,
    .theme .theme--gold .tab.is-current {
      border-color: #eb942c; }
    .tab.is-active.theme--orange,
    .theme--orange .tab.is-active,
    .theme .theme--orange .tab.is-active, .tab.is-current.theme--orange,
    .theme--orange .tab.is-current,
    .theme .theme--orange .tab.is-current {
      border-color: #e26435; }
    .tab.is-active.theme--salmon,
    .theme--salmon .tab.is-active,
    .theme .theme--salmon .tab.is-active, .tab.is-current.theme--salmon,
    .theme--salmon .tab.is-current,
    .theme .theme--salmon .tab.is-current {
      border-color: #eb735d; }
    .tab.is-active.theme--red,
    .theme--red .tab.is-active,
    .theme .theme--red .tab.is-active, .tab.is-current.theme--red,
    .theme--red .tab.is-current,
    .theme .theme--red .tab.is-current {
      border-color: #ec2d10; }
    .tab.is-active.theme--burgundy,
    .theme--burgundy .tab.is-active,
    .theme .theme--burgundy .tab.is-active, .tab.is-current.theme--burgundy,
    .theme--burgundy .tab.is-current,
    .theme .theme--burgundy .tab.is-current {
      border-color: #ba222a; }
    .tab.is-active.theme--purple,
    .theme--purple .tab.is-active,
    .theme .theme--purple .tab.is-active, .tab.is-current.theme--purple,
    .theme--purple .tab.is-current,
    .theme .theme--purple .tab.is-current {
      border-color: #9b3381; }
    .tab.is-active.theme--youth,
    .theme--youth .tab.is-active,
    .theme .theme--youth .tab.is-active, .tab.is-current.theme--youth,
    .theme--youth .tab.is-current,
    .theme .theme--youth .tab.is-current {
      border-color: #d57800; }
    .tab.is-active.theme--digitalisation,
    .theme--digitalisation .tab.is-active,
    .theme .theme--digitalisation .tab.is-active, .tab.is-current.theme--digitalisation,
    .theme--digitalisation .tab.is-current,
    .theme .theme--digitalisation .tab.is-current {
      border-color: #9a3324; }
    .tab.is-active.theme--climate,
    .theme--climate .tab.is-active,
    .theme .theme--climate .tab.is-active, .tab.is-current.theme--climate,
    .theme--climate .tab.is-current,
    .theme .theme--climate .tab.is-current {
      border-color: #693c5e; }
    .tab.is-active.theme--gender,
    .theme--gender .tab.is-active,
    .theme .theme--gender .tab.is-active, .tab.is-current.theme--gender,
    .theme--gender .tab.is-current,
    .theme .theme--gender .tab.is-current {
      border-color: #046a38; }
    .tab.is-active.theme--nutrition,
    .theme--nutrition .tab.is-active,
    .theme .theme--nutrition .tab.is-active, .tab.is-current.theme--nutrition,
    .theme--nutrition .tab.is-current,
    .theme .theme--nutrition .tab.is-current {
      border-color: #487a7b; }
    .tab.is-active.theme--blog,
    .theme--blog .tab.is-active,
    .theme .theme--blog .tab.is-active, .tab.is-current.theme--blog,
    .theme--blog .tab.is-current,
    .theme .theme--blog .tab.is-current {
      border-color: #ffa300; }
    .tab.is-active.theme--spore-blue,
    .theme--spore-blue .tab.is-active,
    .theme .theme--spore-blue .tab.is-active, .tab.is-current.theme--spore-blue,
    .theme--spore-blue .tab.is-current,
    .theme .theme--spore-blue .tab.is-current {
      border-color: #3f68b1; }
    .tab.is-active.theme--spore-brown,
    .theme--spore-brown .tab.is-active,
    .theme .theme--spore-brown .tab.is-active, .tab.is-current.theme--spore-brown,
    .theme--spore-brown .tab.is-current,
    .theme .theme--spore-brown .tab.is-current {
      border-color: #774b04; }
    .tab.is-active.theme--spore-dark-blue,
    .theme--spore-dark-blue .tab.is-active,
    .theme .theme--spore-dark-blue .tab.is-active, .tab.is-current.theme--spore-dark-blue,
    .theme--spore-dark-blue .tab.is-current,
    .theme .theme--spore-dark-blue .tab.is-current {
      border-color: #044e7e; }
    .tab.is-active.theme--spore-forest-green,
    .theme--spore-forest-green .tab.is-active,
    .theme .theme--spore-forest-green .tab.is-active, .tab.is-current.theme--spore-forest-green,
    .theme--spore-forest-green .tab.is-current,
    .theme .theme--spore-forest-green .tab.is-current {
      border-color: #5f810a; }
    .tab.is-active.theme--spore-grey-blue,
    .theme--spore-grey-blue .tab.is-active,
    .theme .theme--spore-grey-blue .tab.is-active, .tab.is-current.theme--spore-grey-blue,
    .theme--spore-grey-blue .tab.is-current,
    .theme .theme--spore-grey-blue .tab.is-current {
      border-color: #6d8c9f; }
    .tab.is-active.theme--spore-light-blue,
    .theme--spore-light-blue .tab.is-active,
    .theme .theme--spore-light-blue .tab.is-active, .tab.is-current.theme--spore-light-blue,
    .theme--spore-light-blue .tab.is-current,
    .theme .theme--spore-light-blue .tab.is-current {
      border-color: #79accf; }
    .tab.is-active.theme--spore-lime,
    .theme--spore-lime .tab.is-active,
    .theme .theme--spore-lime .tab.is-active, .tab.is-current.theme--spore-lime,
    .theme--spore-lime .tab.is-current,
    .theme .theme--spore-lime .tab.is-current {
      border-color: #bbae03; }
    .tab.is-active.theme--spore-ochre,
    .theme--spore-ochre .tab.is-active,
    .theme .theme--spore-ochre .tab.is-active, .tab.is-current.theme--spore-ochre,
    .theme--spore-ochre .tab.is-current,
    .theme .theme--spore-ochre .tab.is-current {
      border-color: #db9623; }
    .tab.is-active.theme--spore-olive-green,
    .theme--spore-olive-green .tab.is-active,
    .theme .theme--spore-olive-green .tab.is-active, .tab.is-current.theme--spore-olive-green,
    .theme--spore-olive-green .tab.is-current,
    .theme .theme--spore-olive-green .tab.is-current {
      border-color: #778d3e; }
    .tab.is-active.theme--spore-red,
    .theme--spore-red .tab.is-active,
    .theme .theme--spore-red .tab.is-active, .tab.is-current.theme--spore-red,
    .theme--spore-red .tab.is-current,
    .theme .theme--spore-red .tab.is-current {
      border-color: #f54c23; }
    .tab.is-active.theme--spore-taupe,
    .theme--spore-taupe .tab.is-active,
    .theme .theme--spore-taupe .tab.is-active, .tab.is-current.theme--spore-taupe,
    .theme--spore-taupe .tab.is-current,
    .theme .theme--spore-taupe .tab.is-current {
      border-color: #7b6d65; }
    .tab.is-active.theme--spore-teal,
    .theme--spore-teal .tab.is-active,
    .theme .theme--spore-teal .tab.is-active, .tab.is-current.theme--spore-teal,
    .theme--spore-teal .tab.is-current,
    .theme .theme--spore-teal .tab.is-current {
      border-color: #077fc1; }
    .tab.is-active:before, .tab.is-current:before {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      border-color: inherit;
      border-style: solid;
      border-width: 6px;
      margin-left: -6px; }
      .tab.is-active:before,
      .theme .tab.is-active:before, .tab.is-current:before,
      .theme .tab.is-current:before {
        border-left-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent; }

/*
Tabs in different themes

.theme.theme--cta - Standard tab
.theme.theme--blue - Blue tab
.theme.theme--lime - Lime tab
.theme.theme--yellow - Yellow tab
.theme.theme--gold - Gold tab
.theme.theme--orange - Orange tab
.theme.theme--salmon - Salmon tab
.theme.theme--red - Red tab
.theme.theme--burgundy - Burgundy tab
.theme.theme--purple - Purple tab

markup:
<a class="tab  |  is-active  |  meta" href="javascript:void();">Tab</a>

sg-wrapper:
<div class="{$modifiers}">
		<sg-wrapper-content/>
</div>

Styleguide 3.36.1
*/
/* 3.37 Lead paragraph */
/*
Lead paragraph [REVIEW]

.lead - Lead paragraph
.lead.lead--l - Extra large lead paragraph

markup:
<p class="{$modifiers}">Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing Elit Sed Do Eiusmod</p>

Styleguide 3.37
*/
.lead {
  font-size: 1.2em; }
  .lead--l {
    color: rgba(0, 0, 0, 0.64); }
    @media only screen and (min-width: 64em) {
      .lead--l {
        font-size: 1.75em; } }

/* 3.38 Video embed */
/*
Video embed styling

Styleguide 3.38
*/
.video {
  margin-bottom: 15px; }
  .video {
    display: block; }
  .video__frame {
    padding-bottom: 15px; }
  .video__frame {
    position: relative;
    padding-bottom: 56.25%;
    /* 1 */
    height: 0; }
    .video__frame iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

/* 3.39 Stamp */
/*
Stamp

.stamp - Stamp block
.stamp.stamp--expiring - Expired stamp
.stamp.stamp--closed - Closed stamp

markup:
<span class="{$modifiers}">
  <span class="stamp__body">open</span>
</span>

Styleguide 3.39
*/
.stamp {
  background-color: #67ab43;
  /* small meta*/
  font-size: 0.5625em;
  line-height: 0.9;
  width: 42px;
  height: 42px;
  display: block;
  color: #fff; }
  .stamp__body {
    display: block;
    padding: 4px 0 0 2px;
    line-height: 1; }
  .stamp--expiring, .stamp--closing {
    background-color: #e26435; }
  .stamp--closed, .stamp--cancelled {
    background-color: #969696; }
  @media only screen and (min-width: 48em) {
    .stamp {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25;
      width: 63px;
      height: 63px; }
      .stamp__body {
        padding: 9px 0 0 3px; }
      .stamp--cancelled {
        /* small meta*/
        font-size: 0.625em;
        line-height: 1.2; } }

/* 3.40 Grid decoration */
/*
Grid decoration

Grid decoration adds lines between adjacent elements. Grid decoration is to be
used with a `.grid.grid--posts`. It has integrated padding, so no added gutters or
leaders are required between elements.

This currently only supports 2 and 4 items per row, with breakpoints following
the `.grid.grid--posts` rules.

markup:
<div class="grid grid--posts  |  grid-decoration  |  gutters">
  <div class="grid__cell">
    <p>Grid cell 1</p>
  </div>
  <div class="grid__cell">
    <p>Grid cell 2</p>
  </div>
  <div class="grid__cell">
    <p>Grid cell 3</p>
  </div>
  <div class="grid__cell">
    <p>Grid cell 4</p>
  </div>
</div>


Styleguide 3.40
*/
/*
 *    This supports 2 and 4 items per row, but can be adjusted for other setups too.
 *
 * 1. Set initial padding. This wil also serve as a fallback for older browsers.
 * 2. We're setting all borders inside the nth-child selector, when an older
 *    browser doesnt support it, no element gets lines
 * 3. We want vertical lines to not cross horizontal lines, wo we are using a top
 *    and bottom offset equal to the required vertical padding
 * 4. Due to the removed left and right padding on the most outer elements in
 *    each row, we need to recalculate their width so that all elements appear equal
 *    in width. This is only necessary when there are more than 2 items per row.
 * 5. Related to 4. the full container width must also be increased by a full
 *    gutter width.
 */
.grid-decoration .grid__cell {
  position: relative;
  padding: 15px;
  /* 1 */ }
  .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before {
    border-style: solid;
    border-color: #d7e9ce; }
    .grid-decoration .grid__cell:nth-child(n).theme--dark,
    .theme--dark .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--dark .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--dark,
    .theme--dark .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--dark .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #cdcdcd; }
    .grid-decoration .grid__cell:nth-child(n).theme--green,
    .theme--green .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--green .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--green,
    .theme--green .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--green .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #d7e9ce; }
    .grid-decoration .grid__cell:nth-child(n).theme--blue,
    .theme--blue .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--blue .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--blue,
    .theme--blue .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--blue .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #d3eff6; }
    .grid-decoration .grid__cell:nth-child(n).theme--lime,
    .theme--lime .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--lime .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--lime,
    .theme--lime .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--lime .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #eff4ca; }
    .grid-decoration .grid__cell:nth-child(n).theme--yellow,
    .theme--yellow .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--yellow .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--yellow,
    .theme--yellow .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--yellow .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #fef3c5; }
    .grid-decoration .grid__cell:nth-child(n).theme--gold,
    .theme--gold .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--gold .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--gold,
    .theme--gold .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--gold .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #fae3c8; }
    .grid-decoration .grid__cell:nth-child(n).theme--orange,
    .theme--orange .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--orange .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--orange,
    .theme--orange .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--orange .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #f7d7ca; }
    .grid-decoration .grid__cell:nth-child(n).theme--salmon,
    .theme--salmon .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--salmon .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--salmon,
    .theme--salmon .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--salmon .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #fadbd5; }
    .grid-decoration .grid__cell:nth-child(n).theme--red,
    .theme--red .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--red .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--red,
    .theme--red .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--red .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #fac8c1; }
    .grid-decoration .grid__cell:nth-child(n).theme--burgundy,
    .theme--burgundy .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--burgundy .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--burgundy,
    .theme--burgundy .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--burgundy .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #edc6c8; }
    .grid-decoration .grid__cell:nth-child(n).theme--purple,
    .theme--purple .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--purple .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--purple,
    .theme--purple .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--purple .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #e5cade; }
    .grid-decoration .grid__cell:nth-child(n).theme--youth,
    .theme--youth .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--youth .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--youth,
    .theme--youth .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--youth .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #f4dcbd; }
    .grid-decoration .grid__cell:nth-child(n).theme--digitalisation,
    .theme--digitalisation .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--digitalisation .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--digitalisation,
    .theme--digitalisation .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--digitalisation .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #e5cac6; }
    .grid-decoration .grid__cell:nth-child(n).theme--climate,
    .theme--climate .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--climate .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--climate,
    .theme--climate .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--climate .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #d8ccd5; }
    .grid-decoration .grid__cell:nth-child(n).theme--gender,
    .theme--gender .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--gender .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--gender,
    .theme--gender .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--gender .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #bed8cb; }
    .grid-decoration .grid__cell:nth-child(n).theme--nutrition,
    .theme--nutrition .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--nutrition .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--nutrition,
    .theme--nutrition .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--nutrition .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #cfdcdd; }
    .grid-decoration .grid__cell:nth-child(n).theme--blog,
    .theme--blog .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--blog .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--blog,
    .theme--blog .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--blog .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #ffe7bd; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-blue,
    .theme--spore-blue .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-blue .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-blue,
    .theme--spore-blue .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-blue .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #cdd8eb; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-brown,
    .theme--spore-brown .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-brown .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-brown,
    .theme--spore-brown .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-brown .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #dcd0be; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-dark-blue,
    .theme--spore-dark-blue .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-dark-blue .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-dark-blue,
    .theme--spore-dark-blue .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-dark-blue .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #bed1dd; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-forest-green,
    .theme--spore-forest-green .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-forest-green .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-forest-green,
    .theme--spore-forest-green .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-forest-green .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #d5debf; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-grey-blue,
    .theme--spore-grey-blue .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-grey-blue .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-grey-blue,
    .theme--spore-grey-blue .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-grey-blue .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #d9e1e6; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-light-blue,
    .theme--spore-light-blue .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-light-blue .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-light-blue,
    .theme--spore-light-blue .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-light-blue .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #dce9f3; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-lime,
    .theme--spore-lime .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-lime .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-lime,
    .theme--spore-lime .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-lime .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #edeabd; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-ochre,
    .theme--spore-ochre .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-ochre .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-ochre,
    .theme--spore-ochre .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-ochre .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #f6e4c6; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-olive-green,
    .theme--spore-olive-green .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-olive-green .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-olive-green,
    .theme--spore-olive-green .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-olive-green .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #dce1cd; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-red,
    .theme--spore-red .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-red .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-red,
    .theme--spore-red .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-red .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #fcd0c6; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-taupe,
    .theme--spore-taupe .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-taupe .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-taupe,
    .theme--spore-taupe .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-taupe .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #ddd9d7; }
    .grid-decoration .grid__cell:nth-child(n).theme--spore-teal,
    .theme--spore-teal .grid-decoration .grid__cell:nth-child(n),
    .theme .theme--spore-teal .grid-decoration .grid__cell:nth-child(n), .grid-decoration .grid__cell:nth-child(n):before.theme--spore-teal,
    .theme--spore-teal .grid-decoration .grid__cell:nth-child(n):before,
    .theme .theme--spore-teal .grid-decoration .grid__cell:nth-child(n):before {
      border-color: #bfdeef; }
    .well .grid-decoration .grid__cell:nth-child(n), .well .grid-decoration .grid__cell:nth-child(n):before {
      border-color: rgba(255, 255, 255, 0.8); }
  .grid-decoration .grid__cell:nth-child(n) {
    border-width: 1px 0 0;
    /* 2 */ }
    .grid-decoration .grid__cell:nth-child(n):before {
      display: block;
      width: 0;
      position: absolute;
      left: 0;
      top: 15px;
      bottom: 15px;
      content: "";
      border-width: 0 0 0 1px; }
  .grid-decoration .grid__cell:nth-child(-n + 2) {
    border-top: 0;
    padding-top: 0; }
    .grid-decoration .grid__cell:nth-child(-n + 2):before {
      top: 0; }
  .grid-decoration .grid__cell:nth-child(2n) {
    padding-right: 0; }
  .grid-decoration .grid__cell:nth-child(2n + 1) {
    padding-left: 0; }
    .grid-decoration .grid__cell:nth-child(2n + 1):before {
      border-width: 0; }

@media only screen and (min-width: 48em) {
  .grid-decoration .grid__cell:nth-child(-n + 4) {
    border-top: 0;
    padding-top: 0; }
    .grid-decoration .grid__cell:nth-child(-n + 4):before {
      top: 0; }
  .grid-decoration .grid__cell:nth-child(n) {
    padding-left: 15px;
    padding-right: 15px; }
    .grid-decoration .grid__cell:nth-child(n):before {
      border-width: 0 0 0 1px; }
  .grid-decoration .grid__cell:nth-child(4n) {
    padding-right: 0; }
  .grid-decoration .grid__cell:nth-child(4n+1) {
    padding-left: 0;
    -ms-flex-preferred-size: calc(25% - 15px);
        flex-basis: -moz-calc(25% - 15px);
        flex-basis: calc(25% - 15px);
    /* 4 */ }
    .grid-decoration .grid__cell:nth-child(4n+1):before {
      border-width: 0; }
  .grid-decoration .grid__cell:nth-child(4n) {
    padding-right: 0;
    -ms-flex-preferred-size: calc(25% - 15px);
        flex-basis: -moz-calc(25% - 15px);
        flex-basis: calc(25% - 15px);
    /* 4 */ } }

@media only screen and (min-width: 90em) {
  .grid-decoration {
    margin-right: -30px;
    /* 5 */ } }

/* 3.41 Letter */
/*
Letter

.letter - Letter

markup:
<div class="{$modifiers}">A</div>

Styleguide 3.41
*/
.letter {
  background-color: #67ab43;
  font-size: 1.25em;
  line-height: 1.5;
  padding: 6px 3px;
  width: 33px;
  height: 33px;
  color: #fff;
  font-weight: bold; }
  .letter.theme--dark,
  .theme--dark .letter,
  .theme .theme--dark .letter {
    background-color: #3d3d3d; }
  .letter.theme--green,
  .theme--green .letter,
  .theme .theme--green .letter {
    background-color: #67ab43; }
  .letter.theme--blue,
  .theme--blue .letter,
  .theme .theme--blue .letter {
    background-color: #56c0dd; }
  .letter.theme--lime,
  .theme--lime .letter,
  .theme .theme--lime .letter {
    background-color: #c1d435; }
  .letter.theme--yellow,
  .theme--yellow .letter,
  .theme .theme--yellow .letter {
    background-color: #facf21; }
  .letter.theme--gold,
  .theme--gold .letter,
  .theme .theme--gold .letter {
    background-color: #eb942c; }
  .letter.theme--orange,
  .theme--orange .letter,
  .theme .theme--orange .letter {
    background-color: #e26435; }
  .letter.theme--salmon,
  .theme--salmon .letter,
  .theme .theme--salmon .letter {
    background-color: #eb735d; }
  .letter.theme--red,
  .theme--red .letter,
  .theme .theme--red .letter {
    background-color: #ec2d10; }
  .letter.theme--burgundy,
  .theme--burgundy .letter,
  .theme .theme--burgundy .letter {
    background-color: #ba222a; }
  .letter.theme--purple,
  .theme--purple .letter,
  .theme .theme--purple .letter {
    background-color: #9b3381; }
  .letter.theme--youth,
  .theme--youth .letter,
  .theme .theme--youth .letter {
    background-color: #d57800; }
  .letter.theme--digitalisation,
  .theme--digitalisation .letter,
  .theme .theme--digitalisation .letter {
    background-color: #9a3324; }
  .letter.theme--climate,
  .theme--climate .letter,
  .theme .theme--climate .letter {
    background-color: #693c5e; }
  .letter.theme--gender,
  .theme--gender .letter,
  .theme .theme--gender .letter {
    background-color: #046a38; }
  .letter.theme--nutrition,
  .theme--nutrition .letter,
  .theme .theme--nutrition .letter {
    background-color: #487a7b; }
  .letter.theme--blog,
  .theme--blog .letter,
  .theme .theme--blog .letter {
    background-color: #ffa300; }
  .letter.theme--spore-blue,
  .theme--spore-blue .letter,
  .theme .theme--spore-blue .letter {
    background-color: #3f68b1; }
  .letter.theme--spore-brown,
  .theme--spore-brown .letter,
  .theme .theme--spore-brown .letter {
    background-color: #774b04; }
  .letter.theme--spore-dark-blue,
  .theme--spore-dark-blue .letter,
  .theme .theme--spore-dark-blue .letter {
    background-color: #044e7e; }
  .letter.theme--spore-forest-green,
  .theme--spore-forest-green .letter,
  .theme .theme--spore-forest-green .letter {
    background-color: #5f810a; }
  .letter.theme--spore-grey-blue,
  .theme--spore-grey-blue .letter,
  .theme .theme--spore-grey-blue .letter {
    background-color: #6d8c9f; }
  .letter.theme--spore-light-blue,
  .theme--spore-light-blue .letter,
  .theme .theme--spore-light-blue .letter {
    background-color: #79accf; }
  .letter.theme--spore-lime,
  .theme--spore-lime .letter,
  .theme .theme--spore-lime .letter {
    background-color: #bbae03; }
  .letter.theme--spore-ochre,
  .theme--spore-ochre .letter,
  .theme .theme--spore-ochre .letter {
    background-color: #db9623; }
  .letter.theme--spore-olive-green,
  .theme--spore-olive-green .letter,
  .theme .theme--spore-olive-green .letter {
    background-color: #778d3e; }
  .letter.theme--spore-red,
  .theme--spore-red .letter,
  .theme .theme--spore-red .letter {
    background-color: #f54c23; }
  .letter.theme--spore-taupe,
  .theme--spore-taupe .letter,
  .theme .theme--spore-taupe .letter {
    background-color: #7b6d65; }
  .letter.theme--spore-teal,
  .theme--spore-teal .letter,
  .theme .theme--spore-teal .letter {
    background-color: #077fc1; }
  @media only screen and (min-width: 64em) {
    .letter {
      padding: 12px 6px;
      width: 42px;
      height: 42px; } }

/* 3.42 Caption */
/*
Caption

.caption - Caption
.caption.caption--layout - Self aligned center
.caption.caption--right - Text aligned right

markup:
<p class="{$modifiers}">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

Styleguide 3.42
*/
.caption {
  font-size: 0.875em;
  font-family: "Open Sans", sans-serif;
  opacity: .84;
  word-break: break-word;
  font-smooth: auto;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto; }
  .post-body .well .caption {
    padding-left: 9px;
    padding-right: 9px;
    font-weight: 400; }
  .caption--layout {
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center; }
  @media only screen and (min-width: 48em) {
    .caption--right {
      text-align: right; } }

.caption__copyright {
  position: absolute;
  z-index: 2;
  bottom: 24px;
  right: 15px;
  font-size: 0.75em;
  color: rgba(255, 255, 255, 0.6); }
  @media only screen and (min-width: 64em) {
    .caption__copyright {
      bottom: 12px;
      right: 30px; } }

/* 3.43 Credit */
/*
Credit

.credit - Credit

markup:
<p class="{$modifiers}">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

Styleguide 3.43
*/
.credit {
  font-size: 0.75em;
  line-height: 1;
  padding-bottom: 3px;
  opacity: .84;
  font-smooth: auto;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto; }
  .credits-department .credit,
  .credits-department + .credit {
    font-size: 1em;
    line-height: 1.5; }
  .caption + .credit {
    padding-top: 6px; }
  .post-body .well .credit {
    padding-left: 9px;
    padding-right: 9px; }

/* 3.44 Paragraph */
/*
Paragraph

.paragraph - Regular paragraph
paragraph--lead - Lead paragraph
paragraph--lead-xl - Extra large lead paragraph

markup:
<p class="{$modifiers}">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ac velit faucibus, aliquam nunc ut, tempor odio. Cras ultrices eget erat id molestie. Vivamus euismod venenatis neque. Pellentesque mollis eros risus, nec mattis quam laoreet ac.</p>

Styleguide 3.44
*/
.paragraph, .markdown p, .markdown ul {
  margin-top: 18px;
  font-weight: 400;
  font-weight: 400; }
  .paragraph--lead, .paragraph--theorem {
    font-size: 1.25em;
    line-height: 1.35; }
  .paragraph--lead-xl {
    font-size: 1.75em;
    line-height: 1.17857; }
  .post-body .heading + .paragraph, .post-body .markdown .heading + p, .markdown .post-body .heading + p, .post-body .markdown .heading + ul, .markdown .post-body .heading + ul {
    margin-top: 24px; }
  .post-body .paragraph + .heading, .post-body .markdown p + .heading, .markdown .post-body p + .heading, .post-body .markdown ul + .heading, .markdown .post-body ul + .heading {
    margin-top: 48px; }
  .paragraph strong, .markdown p strong, .markdown ul strong {
    font-weight: 600; }
  .paragraph--editorial p:first-of-type {
    font-style: italic; }
  .paragraph--editorial p + p {
    margin-top: 24px; }
  @media only screen and (min-width: 64em) {
    .paragraph--theorem {
      font-size: 1.5em; } }
  @media only screen and (min-width: 90em) {
    .paragraph--theorem {
      font-size: 1.625em; } }

/* 3.45 Story */
/*
Story

This element relies on the picture element for png fallback and requires a picture polyfill for older browsers.

fish-market - Fish market on pavement
fishing-shore - Fisherman fishing from shore
fishing-boat - Fisherman fishing from boat,
farmer-crop - Farmer by his crop
rural-school - Teacher and students under a tree
globe-plane - Half globe with a flying plane
printing-press-publisher - Printing press with publisher character
speakers - Speakers at an event
conversation - Informal conversation
pavement - Pavement, can be used as spacer image
water - Water, can be used as spacer image

markup:
<picture class="story story--{$modifiers}">
  <source type="image/svg+xml" srcset="/images/stories/{$modifiers}.svg">
  <img  src="/images/stories/{$modifiers}.png" alt="">
</picture>

sg-wrapper:
<div class="well well--full well--slim-fit">
  <sg-wrapper-content/>
</div>

Styleguide 3.45
*/
.story {
  vertical-align: bottom;
  background-repeat: no-repeat;
  -moz-background-size: contain;
       background-size: contain;
  max-width: 100%;
  margin-bottom: -1px;
  /* Hack until images are cleaned up*/ }
  .story .story {
    display: inline-block; }
  .story:first-child {
    display: none; }
    @media only screen and (min-width: 32.5em) {
      .story:first-child {
        display: inline-block; } }
  .story:nth-child(even) {
    display: none; }
    @media only screen and (min-width: 90em) {
      .story:nth-child(even) {
        display: inline-block; } }
  .story-line {
    font-size: 0;
    white-space: nowrap;
    text-align: center; }
    .story-line-wrapper {
      max-width: 100vw;
      overflow: hidden; }
    .story-line--horizon {
      border-bottom: 1px solid #fff; }
    @media only screen and (min-width: 32.5em) {
      .story-line .is-gt-medium-handheld {
        display: inline;
        display: initial; } }
    @media only screen and (min-width: 64em) {
      .story-line .is-gt-small-desktop {
        display: inline;
        display: initial; } }
  .story--horizon {
    position: relative;
    bottom: -1px; }
  .story--pavement {
    position: relative;
    top: 26px;
    margin-top: -26px; }
  .story--water {
    position: relative;
    top: 55px;
    margin-top: -55px; }
  .well > .story--bg {
    background-color: inherit; }

/*
Story line-up example

Individual stories may be hidden on smaller browsers using one of the `.is-gt-###` classes (see: elements/state).

Note: the story line needs to be wrapped inside a `.story-line-wrapper` class so exess stories are not causing a scrollbar.

markup:
<div class="story-line  |  well well--full well--slim-fit">
    <picture class="is-gt-small-desktop story">
      <source type="image/svg+xml" srcset="/images/stories/globe-plane.svg">
      <img src="/images/stories/globe-plane.png" alt="" width="">
    </picture>
    <picture class="is-gt-small-desktop story story--pavement">
      <source type="image/svg+xml" srcset="/images/stories/fish-market.svg">
      <img src="/images/stories/fish-market.png" alt="" width="">
    </picture>
    <picture class="is-gt-small-desktop story story--pavement">
      <source type="image/svg+xml" srcset="/images/stories/pavement.svg">
      <img src="/images/stories/pavement.png" alt="">
    </picture>
    <picture class="is-gt-medium-handheld story story--water">
      <source type="image/svg+xml" srcset="/images/stories/fishing-shore.svg">
      <img src="/images/stories/fishing-shore.png" alt="">
    </picture>
    <picture class="is-gt-small-desktop story story--water">
      <source type="image/svg+xml" srcset="/images/stories/water.svg">
      <img src="/images/stories/water.png" alt="">
    </picture>
    <picture class="story story--water">
      <source type="image/svg+xml" srcset="/images/stories/water.svg">
      <img src="/images/stories/water.png" alt="">
    </picture>
    <picture class="is-gt-medium-handheld story story--water">
      <source type="image/svg+xml" srcset="/images/stories/water.svg">
      <img src="/images/stories/water.png" alt="">
    </picture>
    <picture class="story story--water">
      <source type="image/svg+xml" srcset="/images/stories/fishing-boat.svg">
      <img src="/images/stories/fishing-boat.png" alt="">
    </picture>
    <picture class="story story--water">
      <source type="image/svg+xml" srcset="/images/stories/water.svg">
      <img src="/images/stories/water.png" alt="">
    </picture>
    <picture class="is-gt-small-desktop story story--water">
      <source type="image/svg+xml" srcset="/images/stories/water.svg">
      <img src="/images/stories/water.png" alt="">
    </picture>
    <picture class="is-gt-medium-handheld story story--water">
      <source type="image/svg+xml" srcset="/images/stories/water.svg">
      <img src="/images/stories/water.png" alt="">
    </picture>
    <picture class="is-gt-medium-handheld story story--water">
      <source type="image/svg+xml" srcset="/images/stories/water.svg">
      <img src="/images/stories/water.png" alt="">
    </picture>
</div>

sg-wrapper:
<div class="story-line-wrapper" style="background: #3d3d3d; height: 300px">
  <sg-wrapper-content/>
</div>

Styleguide 3.45.2
*/
/* 3.46 Pull-quote */
/*
Pull-quote

markup:
<blockquote class="pull-quote">
  Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing Elit Sed Do Eiusmod
</blockquote>

Styleguide 3.46
*/
.pull-quote {
  position: relative;
  display: block;
  margin-top: 18px;
  padding-left: 9px;
  font-size: 1.375em;
  color: #67ab43;
  color: #67ab43; }
  .pull-quote.theme--dark,
  .theme--dark .pull-quote,
  .theme .theme.theme--dark .pull-quote {
    color: #3d3d3d; }
  .pull-quote.theme--green,
  .theme--green .pull-quote,
  .theme .theme.theme--green .pull-quote {
    color: #67ab43; }
  .pull-quote.theme--blue,
  .theme--blue .pull-quote,
  .theme .theme.theme--blue .pull-quote {
    color: #56c0dd; }
  .pull-quote.theme--lime,
  .theme--lime .pull-quote,
  .theme .theme.theme--lime .pull-quote {
    color: #c1d435; }
  .pull-quote.theme--yellow,
  .theme--yellow .pull-quote,
  .theme .theme.theme--yellow .pull-quote {
    color: #facf21; }
  .pull-quote.theme--gold,
  .theme--gold .pull-quote,
  .theme .theme.theme--gold .pull-quote {
    color: #eb942c; }
  .pull-quote.theme--orange,
  .theme--orange .pull-quote,
  .theme .theme.theme--orange .pull-quote {
    color: #e26435; }
  .pull-quote.theme--salmon,
  .theme--salmon .pull-quote,
  .theme .theme.theme--salmon .pull-quote {
    color: #eb735d; }
  .pull-quote.theme--red,
  .theme--red .pull-quote,
  .theme .theme.theme--red .pull-quote {
    color: #ec2d10; }
  .pull-quote.theme--burgundy,
  .theme--burgundy .pull-quote,
  .theme .theme.theme--burgundy .pull-quote {
    color: #ba222a; }
  .pull-quote.theme--purple,
  .theme--purple .pull-quote,
  .theme .theme.theme--purple .pull-quote {
    color: #9b3381; }
  .pull-quote.theme--youth,
  .theme--youth .pull-quote,
  .theme .theme.theme--youth .pull-quote {
    color: #d57800; }
  .pull-quote.theme--digitalisation,
  .theme--digitalisation .pull-quote,
  .theme .theme.theme--digitalisation .pull-quote {
    color: #9a3324; }
  .pull-quote.theme--climate,
  .theme--climate .pull-quote,
  .theme .theme.theme--climate .pull-quote {
    color: #693c5e; }
  .pull-quote.theme--gender,
  .theme--gender .pull-quote,
  .theme .theme.theme--gender .pull-quote {
    color: #046a38; }
  .pull-quote.theme--nutrition,
  .theme--nutrition .pull-quote,
  .theme .theme.theme--nutrition .pull-quote {
    color: #487a7b; }
  .pull-quote.theme--blog,
  .theme--blog .pull-quote,
  .theme .theme.theme--blog .pull-quote {
    color: #ffa300; }
  .pull-quote.theme--spore-blue,
  .theme--spore-blue .pull-quote,
  .theme .theme.theme--spore-blue .pull-quote {
    color: #3f68b1; }
  .pull-quote.theme--spore-brown,
  .theme--spore-brown .pull-quote,
  .theme .theme.theme--spore-brown .pull-quote {
    color: #774b04; }
  .pull-quote.theme--spore-dark-blue,
  .theme--spore-dark-blue .pull-quote,
  .theme .theme.theme--spore-dark-blue .pull-quote {
    color: #044e7e; }
  .pull-quote.theme--spore-forest-green,
  .theme--spore-forest-green .pull-quote,
  .theme .theme.theme--spore-forest-green .pull-quote {
    color: #5f810a; }
  .pull-quote.theme--spore-grey-blue,
  .theme--spore-grey-blue .pull-quote,
  .theme .theme.theme--spore-grey-blue .pull-quote {
    color: #6d8c9f; }
  .pull-quote.theme--spore-light-blue,
  .theme--spore-light-blue .pull-quote,
  .theme .theme.theme--spore-light-blue .pull-quote {
    color: #79accf; }
  .pull-quote.theme--spore-lime,
  .theme--spore-lime .pull-quote,
  .theme .theme.theme--spore-lime .pull-quote {
    color: #bbae03; }
  .pull-quote.theme--spore-ochre,
  .theme--spore-ochre .pull-quote,
  .theme .theme.theme--spore-ochre .pull-quote {
    color: #db9623; }
  .pull-quote.theme--spore-olive-green,
  .theme--spore-olive-green .pull-quote,
  .theme .theme.theme--spore-olive-green .pull-quote {
    color: #778d3e; }
  .pull-quote.theme--spore-red,
  .theme--spore-red .pull-quote,
  .theme .theme.theme--spore-red .pull-quote {
    color: #f54c23; }
  .pull-quote.theme--spore-taupe,
  .theme--spore-taupe .pull-quote,
  .theme .theme.theme--spore-taupe .pull-quote {
    color: #7b6d65; }
  .pull-quote.theme--spore-teal,
  .theme--spore-teal .pull-quote,
  .theme .theme.theme--spore-teal .pull-quote {
    color: #077fc1; }
  .pull-quote__content {
    color: rgba(0, 0, 0, 0.54); }
  .pull-quote cite::before {
    content: "—";
    padding: 0 1ex 0 0; }
  .pull-quote::before {
    content: "";
    position: absolute;
    right: 100%;
    top: 6px;
    bottom: 6px;
    border-right: 6px solid; }
  @media only screen and (min-width: 48em) {
    .pull-quote {
      float: right;
      width: 50%;
      margin-left: 1em; } }
  @media only screen and (min-width: 64em) {
    .pull-quote {
      width: 16.66667vw; } }

/* 3.47 Rating */
/*
Rating

.rating.rating--10 - Rated 10 out of 100
.rating.rating--20 - Rated 20 out of 100
.rating.rating--30 - Rated 30 out of 100
.rating.rating--40 - Rated 40 out of 100
.rating.rating--50 - Rated 50 out of 100
.rating.rating--60 - Rated 60 out of 100
.rating.rating--70 - Rated 70 out of 100
.rating.rating--80 - Rated 80 out of 100
.rating.rating--90 - Rated 90 out of 100
.rating.rating--100 - Rated 100 out of 100

markup:
<div class="{$modifiers}">
  <span class="rating__stars--inactive">★★★★★</span>
  <span class="rating__stars--active">★★★★★</span>
</div>

Styleguide 3.47
*/
.rating {
  max-width: 0;
  position: relative;
  color: #dedede; }
  .rating--10 {
    max-width: .5em; }
  .rating--20 {
    max-width: 1em; }
  .rating--30 {
    max-width: 1.5em; }
  .rating--40 {
    max-width: 2em; }
  .rating--50 {
    max-width: 2.5em; }
  .rating--60 {
    max-width: 3em; }
  .rating--70 {
    max-width: 3.5em; }
  .rating--80 {
    max-width: 4em; }
  .rating--90 {
    max-width: 4.5em; }
  .rating--100 {
    max-width: 5em; }

.rating__stars--active {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
  color: #EB942C;
  max-width: inherit;
  overflow: hidden; }
  .theme--blue .rating__stars--active {
    color: #56c0dd; }
  .theme--lime .rating__stars--active {
    color: #c1d435; }
  .theme--yellow .rating__stars--active {
    color: #facf21; }
  .theme--gold .rating__stars--active {
    color: #eb942c; }
  .theme--orange .rating__stars--active {
    color: #e26435; }
  .theme--salmon .rating__stars--active {
    color: #eb735d; }
  .theme--red .rating__stars--active {
    color: #ec2d10; }
  .theme--burgundy .rating__stars--active {
    color: #ba222a; }
  .theme--purple .rating__stars--active {
    color: #9b3381; }

/* 3.48 Footnote */
/*
Footnotes

markup:
<h2 class="title title--sub-section  |  trailer">footnotes</h2>
<ol class="list list--footnotes">
	<li class="body--quiet"><span>Footnote 1</span></li>
	<li class="body--quiet"><span>Footnote 2</span></li>
</ol>

Styleguide 3.48
*/
.footNote {
  font-size: 0.75em;
  opacity: .76;
  counter-reset: footnote; }
  .footNote p {
    margin-top: 12px;
    margin-bottom: 12px; }
  .footNote .jumpToElement {
    opacity: 1;
    font-size: 1px;
    color: transparent; }
    .footNote .jumpToElement:before {
      color: #67ab43;
      font-size: 12px;
      padding-right: 1em;
      counter-increment: footnote;
      content: counter(footnote) "."; }

/* 3.49 Highlight */
/*
Highlight

.theme.theme--cta - Standard highlight
.theme.theme--blue - Blue highlight
.theme.theme--lime - Lime highlight
.theme.theme--yellow - Yellow highlight
.theme.theme--gold - Gold highlight
.theme.theme--orange - Orange highlight
.theme.theme--salmon - Salmon highlight
.theme.theme--red - Red highlight
.theme.theme--burgundy - Burgundy highlight
.theme.theme--purple - Purple highlight

markup:
<div class="highlight" style="height: 250px">
	My container is highlighted
</div>

sg-wrapper:
<div class="{$modifiers}">
		<sg-wrapper-content/>
</div>

Styleguide 3.49
*/
.highlight {
  background: #d7e9ce; }
  .theme--blue .highlight {
    background: #d3eff6; }
  .highlight .theme--lime {
    background-color: #eff4ca; }
  .theme--yellow .highlight {
    background-color: #fef3c5; }
  .theme--gold .highlight {
    background-color: #fae3c8; }
  .theme--orange .highlight {
    background-color: #f7d7ca; }
  .theme--salmon .highlight {
    background-color: #fadbd5; }
  .theme--red .highlight {
    background-color: #fac8c1; }
  .theme--burgundy .highlight {
    background-color: #edc6c8; }
  .theme--purple .highlight {
    background-color: #e5cade; }

/* 3.50 ICT Update */
/*
ICT Update Elements

Styleguide 3.50
*/
/* 3.51 Embed */
/*
Embed

Styling for embedded content like iframes

.embed - Default base styling
.embed.embed--hero - Large, like a hero image

markup:
<iframe class="{$modifiers}" src="https://www.google.com/maps/d/u/0/embed?mid=1qCSTiNTKLC4YtF1xlFzT5Dgze3M&hl=en&ll=0.3015388705819431%2C-31.092130699999984&z=3"></iframe>


Styleguide 3.51
*/
.embed {
  display: block;
  padding: 0;
  height: 300px;
  border: 0;
  background-color: #d7e9ce; }
  .embed.theme--dark,
  .theme--dark .embed,
  .theme .theme--dark .embed {
    background-color: #cdcdcd; }
  .embed.theme--green,
  .theme--green .embed,
  .theme .theme--green .embed {
    background-color: #d7e9ce; }
  .embed.theme--blue,
  .theme--blue .embed,
  .theme .theme--blue .embed {
    background-color: #d3eff6; }
  .embed.theme--lime,
  .theme--lime .embed,
  .theme .theme--lime .embed {
    background-color: #eff4ca; }
  .embed.theme--yellow,
  .theme--yellow .embed,
  .theme .theme--yellow .embed {
    background-color: #fef3c5; }
  .embed.theme--gold,
  .theme--gold .embed,
  .theme .theme--gold .embed {
    background-color: #fae3c8; }
  .embed.theme--orange,
  .theme--orange .embed,
  .theme .theme--orange .embed {
    background-color: #f7d7ca; }
  .embed.theme--salmon,
  .theme--salmon .embed,
  .theme .theme--salmon .embed {
    background-color: #fadbd5; }
  .embed.theme--red,
  .theme--red .embed,
  .theme .theme--red .embed {
    background-color: #fac8c1; }
  .embed.theme--burgundy,
  .theme--burgundy .embed,
  .theme .theme--burgundy .embed {
    background-color: #edc6c8; }
  .embed.theme--purple,
  .theme--purple .embed,
  .theme .theme--purple .embed {
    background-color: #e5cade; }
  .embed.theme--youth,
  .theme--youth .embed,
  .theme .theme--youth .embed {
    background-color: #f4dcbd; }
  .embed.theme--digitalisation,
  .theme--digitalisation .embed,
  .theme .theme--digitalisation .embed {
    background-color: #e5cac6; }
  .embed.theme--climate,
  .theme--climate .embed,
  .theme .theme--climate .embed {
    background-color: #d8ccd5; }
  .embed.theme--gender,
  .theme--gender .embed,
  .theme .theme--gender .embed {
    background-color: #bed8cb; }
  .embed.theme--nutrition,
  .theme--nutrition .embed,
  .theme .theme--nutrition .embed {
    background-color: #cfdcdd; }
  .embed.theme--blog,
  .theme--blog .embed,
  .theme .theme--blog .embed {
    background-color: #ffe7bd; }
  .embed.theme--spore-blue,
  .theme--spore-blue .embed,
  .theme .theme--spore-blue .embed {
    background-color: #cdd8eb; }
  .embed.theme--spore-brown,
  .theme--spore-brown .embed,
  .theme .theme--spore-brown .embed {
    background-color: #dcd0be; }
  .embed.theme--spore-dark-blue,
  .theme--spore-dark-blue .embed,
  .theme .theme--spore-dark-blue .embed {
    background-color: #bed1dd; }
  .embed.theme--spore-forest-green,
  .theme--spore-forest-green .embed,
  .theme .theme--spore-forest-green .embed {
    background-color: #d5debf; }
  .embed.theme--spore-grey-blue,
  .theme--spore-grey-blue .embed,
  .theme .theme--spore-grey-blue .embed {
    background-color: #d9e1e6; }
  .embed.theme--spore-light-blue,
  .theme--spore-light-blue .embed,
  .theme .theme--spore-light-blue .embed {
    background-color: #dce9f3; }
  .embed.theme--spore-lime,
  .theme--spore-lime .embed,
  .theme .theme--spore-lime .embed {
    background-color: #edeabd; }
  .embed.theme--spore-ochre,
  .theme--spore-ochre .embed,
  .theme .theme--spore-ochre .embed {
    background-color: #f6e4c6; }
  .embed.theme--spore-olive-green,
  .theme--spore-olive-green .embed,
  .theme .theme--spore-olive-green .embed {
    background-color: #dce1cd; }
  .embed.theme--spore-red,
  .theme--spore-red .embed,
  .theme .theme--spore-red .embed {
    background-color: #fcd0c6; }
  .embed.theme--spore-taupe,
  .theme--spore-taupe .embed,
  .theme .theme--spore-taupe .embed {
    background-color: #ddd9d7; }
  .embed.theme--spore-teal,
  .theme--spore-teal .embed,
  .theme .theme--spore-teal .embed {
    background-color: #bfdeef; }
  .embed--hero {
    height: 600px; }

/* 3.52 Loading */
/*
Loading

.loading - Loading spinner

markup:
<a class="reset  |  button button--wide  |  pagination-pager  |  {$modifiers}">
    Show more
</a>

Styleguide 3.52
*/
.loading {
  position: relative; }
  .loading, .loading:hover, .loading:active, .loading:focus {
    color: rgba(0, 0, 0, 0.7);
    background: rgba(0, 0, 0, 0.7);
    border-color: transparent; }
  .loading:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url("/assets/images/loaders/spinner.svg") no-repeat center;
    display: block; }

/* 3.53 Contact form */
/*
Contact form

markup:
<div class="layout layout--reverse">
    <div class="layout__cell layout__cell--main  |  wing--right">
        <div class="wing--right  |  trailer">
            <h2 class="title title--section  |  gutters">How can we help?</h2>
            <p class="gutters  |  title--apropos  |  trailer">We are here to answer any questions you may have about our organisation. Reach out to us and we'll respond as soon as we can.</p>
            <form class="contact-form">
                <div class="layout layout--even">
                    <div class="layout__cell  |  gutters">
                        <label class="fld-label  |  leader">Name<span class="contact--required">*</span></label>
                        <input class="fld">
                        <label class="fld-label  |  leader">E-mail address<span class="contact--required">*</span></label>
                        <input class="fld">
                    </div>
                    <div class="layout__cell  |  gutters">
                        <label class="fld-label  |  leader">Surname<span class="contact--required">*</span></label>
                        <input class="fld">
                        <label class="fld-label  |  leader">Phone</label>
                        <input class="fld">
                    </div>
                </div>
                <div class="gutters">
                    <label class="fld-label  |  leader">Subject<span class="contact--required">*</span></label>
                    <input placeholder="General enquiries" class="fld">
                    <label class="fld-label  |  leader">Your message<span class="contact--required">*</span></label>
                    <textarea class="fld" rows="4"></textarea>
                </div>
                <div class="layout layout--even  |  leader">
                    <div class="layout__cell  |  gutters  |  trailer">
                        <label><input class="fld-checkbox" name="Field10" type="checkbox" value="Yes, I would like to receive the CTA newsletter on a regular basis"><span class="fld-radio  |  title--apropos">Yes, I would like to receive the CTA newsletter on a regular basis.</span></label>
                        <label><input class="fld-checkbox" name="Field10" type="checkbox" value="I'm interested in other CTA publications."><span class="fld-radio  |  title--apropos">I'm interested in other CTA publications.</span></label>
                    </div>
                    <div class="layout__cell  |  gutters  |  caption--right">
                        <button class="button button--wide">Submit</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="layout__cell layout__cell--aside |  wings">
        <div class="gutters">
            <h2 class="title title--apropos  |  trailer--small">Do you want to send a paper copy?</h2>
            <div class="title--apropos">
                <address class="leader--small">
              			CTA<br>
              			PO Box 380<br>
              			6700 AJ Wageningen<br>
              			The Netherlands<br>
            		</address>
            </div>
        </div>
    </div>
</div>

Styleguide 3.53
*/
.contact__address {
  background: #67ab43;
  color: #fff; }
  .contact__address .meta {
    opacity: 1;
    text-transform: capitalize; }
  .contact__address + .contact__address {
    margin-bottom: 0; }

.contact-form .leader {
  margin-top: 45px; }

.contact-form .fld {
  font-size: 0.75em; }
  .contact-form .fld:hover, .contact-form .fld:active, .contact-form .fld:focus {
    background: none; }

.contact--required {
  color: #67ab43;
  padding-left: 3px; }

@media only screen and (max-width: 63.9375em) {
  .contact--column {
    width: 100%; } }

@media only screen and (min-width: 64em) {
  .contact {
    padding-left: 11.11111vw;
    padding-right: 5.55556vw; }
    .contact--column {
      position: absolute;
      left: 50%;
      top: 50%;
      -webkit-transform: translateX(-50%) translateY(-50%);
         -moz-transform: translateX(-50%) translateY(-50%);
          -ms-transform: translateX(-50%) translateY(-50%);
              transform: translateX(-50%) translateY(-50%); }
    .contact__address {
      width: 16.66667vw; } }

@media only screen and (min-width: 90em) {
  .contact__address {
    width: 16.66667vw;
    padding-left: 15px;
    padding-right: 15px; } }

.contact .layout--even {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .no-flexbox .contact .layout--even {
    display: inline-block; }
    .no-flexbox .contact .layout--even .layout__cell {
      display: inline-block;
      float: left; }

/* 3.54 Contact hero */
/*
Contact hero

markup:
<div class="trailer--hero layout layout--split  |  is-root">
    <div class="layout__cell  |  contact--hero" style="background: url(http://res.cloudinary.com/cta/image/upload/h_900,w_1200,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg.png) center center; background-size: cover;"></div>
    <div class="layout__cell  |  well--neutral">
        <div class="contact  |  leader--hero  |  trailer--hero">
            <h2 class="title title--section  |  trailer  |  gutters"></h2>
            <div class="layout layout--even">
                <div class="layout__cell  |  trailer--hero  |  gutters">
                    <h2 class="title title--apropos  |  trailer--small">General enquiries</h2>
                    <p class="trailer--small  |   title--apropos">Nam elit arcu, tristique non vestibu, iaculis quis leo. Duis consequat dolor nec sem sagittis aliquet..</p>
                    <a class="title--apropos" href="">info@cta.int</a>
                </div>
                <div class="layout__cell  |  trailer--hero  |  gutters">
                    <h2 class="title title--apropos  |  trailer--small">MEDIA AND PRESS</h2>
                    <p class="trailer--small  |   title--apropos">Nam elit arcu, tristique non vestibu, iaculis quis leo. Duis consequat dolor nec sem sagittis aliquet..</p>
                    <a class="title--apropos" href="">stéphane.gambier@cta.int</a>
                </div>
                <div class="layout__cell  |  trailer--hero  |  gutters">
                    <h2 class="title title--apropos  |  trailer--small">Partnerships</h2>
                    <p class="trailer--small  |   title--apropos">Nam elit arcu, tristique non vestibu, iaculis quis leo. Duis consequat dolor nec sem sagittis aliquet..</p>
                    <a class="title--apropos" href="">deborah.kleinbussink@cta.int</a>
                </div>
            </div>
        </div>
    </div>
    <div class="contact--column">
        <div class="contact__address  |  trailer trailer-inside  |  leader-inside">
            <div class="gutters">
                <h2 class="title  |  trailer--normal">Head office</h2>
                <p class="meta">Agro Business Park 2</p>
                <p class="meta">6708 PW Wageningen</p>
                <p class="meta  |  trailer--small">The Netherlands</p>
                <p class="meta">Tel: +31 (0)317 467100</p>
                <p class="meta">Fax: +31 (0)317 460067</p>
                <a class="block-link block-link--inverse  |  leader--normal" href="" target="_blank">Get directions</a>
            </div>
        </div>
        <div class="contact__address  |  trailer trailer-inside  |  leader-inside">
            <div class="gutters">
                <h2 class="title  |  trailer--normal">Brussels office</h2>
                <p class="meta">39 Rue Montoyer</p>
                <p class="meta">1000 Brussels</p>
                <p class="meta  |  trailer--small">Belgium</p>
                <p class="meta">Tel: +32 (0) 2 5137436</p>
                <p class="meta">Fax: +32 (0) 2 5113868</p>
                <a class="block-link block-link--inverse  |  leader--normal" href="" target="_blank">Get directions</a>
            </div>
        </div>
    </div>
</div>

Styleguide 3.54
*/
.contact--hero {
  padding-bottom: 300px; }
  @media only screen and (min-width: 64em) {
    .contact--hero {
      padding-bottom: 525px; } }

/* 3.55 Bubble */
.bubble {
  position: relative;
  background-color: #d7e9ce; }
  .bubble::after {
    color: #d7e9ce; }
  .theme--dark .bubble,
  .theme .theme--dark .bubble {
    background-color: #cdcdcd; }
  .theme--dark .bubble::after,
  .theme .theme--dark .bubble::after {
    color: #cdcdcd; }
  .theme--dark .bubble--heavy,
  .theme .theme--dark .bubble--heavy {
    background-color: #3d3d3d;
    color: #fff; }
  .theme--dark .bubble--heavy::after,
  .theme .theme--dark .bubble--heavy::after {
    color: #3d3d3d; }
  .theme--green .bubble,
  .theme .theme--green .bubble {
    background-color: #d7e9ce; }
  .theme--green .bubble::after,
  .theme .theme--green .bubble::after {
    color: #d7e9ce; }
  .theme--green .bubble--heavy,
  .theme .theme--green .bubble--heavy {
    background-color: #67ab43;
    color: #fff; }
  .theme--green .bubble--heavy::after,
  .theme .theme--green .bubble--heavy::after {
    color: #67ab43; }
  .theme--blue .bubble,
  .theme .theme--blue .bubble {
    background-color: #d3eff6; }
  .theme--blue .bubble::after,
  .theme .theme--blue .bubble::after {
    color: #d3eff6; }
  .theme--blue .bubble--heavy,
  .theme .theme--blue .bubble--heavy {
    background-color: #56c0dd;
    color: #fff; }
  .theme--blue .bubble--heavy::after,
  .theme .theme--blue .bubble--heavy::after {
    color: #56c0dd; }
  .theme--lime .bubble,
  .theme .theme--lime .bubble {
    background-color: #eff4ca; }
  .theme--lime .bubble::after,
  .theme .theme--lime .bubble::after {
    color: #eff4ca; }
  .theme--lime .bubble--heavy,
  .theme .theme--lime .bubble--heavy {
    background-color: #c1d435;
    color: #fff; }
  .theme--lime .bubble--heavy::after,
  .theme .theme--lime .bubble--heavy::after {
    color: #c1d435; }
  .theme--yellow .bubble,
  .theme .theme--yellow .bubble {
    background-color: #fef3c5; }
  .theme--yellow .bubble::after,
  .theme .theme--yellow .bubble::after {
    color: #fef3c5; }
  .theme--yellow .bubble--heavy,
  .theme .theme--yellow .bubble--heavy {
    background-color: #facf21;
    color: #fff; }
  .theme--yellow .bubble--heavy::after,
  .theme .theme--yellow .bubble--heavy::after {
    color: #facf21; }
  .theme--gold .bubble,
  .theme .theme--gold .bubble {
    background-color: #fae3c8; }
  .theme--gold .bubble::after,
  .theme .theme--gold .bubble::after {
    color: #fae3c8; }
  .theme--gold .bubble--heavy,
  .theme .theme--gold .bubble--heavy {
    background-color: #eb942c;
    color: #fff; }
  .theme--gold .bubble--heavy::after,
  .theme .theme--gold .bubble--heavy::after {
    color: #eb942c; }
  .theme--orange .bubble,
  .theme .theme--orange .bubble {
    background-color: #f7d7ca; }
  .theme--orange .bubble::after,
  .theme .theme--orange .bubble::after {
    color: #f7d7ca; }
  .theme--orange .bubble--heavy,
  .theme .theme--orange .bubble--heavy {
    background-color: #e26435;
    color: #fff; }
  .theme--orange .bubble--heavy::after,
  .theme .theme--orange .bubble--heavy::after {
    color: #e26435; }
  .theme--salmon .bubble,
  .theme .theme--salmon .bubble {
    background-color: #fadbd5; }
  .theme--salmon .bubble::after,
  .theme .theme--salmon .bubble::after {
    color: #fadbd5; }
  .theme--salmon .bubble--heavy,
  .theme .theme--salmon .bubble--heavy {
    background-color: #eb735d;
    color: #fff; }
  .theme--salmon .bubble--heavy::after,
  .theme .theme--salmon .bubble--heavy::after {
    color: #eb735d; }
  .theme--red .bubble,
  .theme .theme--red .bubble {
    background-color: #fac8c1; }
  .theme--red .bubble::after,
  .theme .theme--red .bubble::after {
    color: #fac8c1; }
  .theme--red .bubble--heavy,
  .theme .theme--red .bubble--heavy {
    background-color: #ec2d10;
    color: #fff; }
  .theme--red .bubble--heavy::after,
  .theme .theme--red .bubble--heavy::after {
    color: #ec2d10; }
  .theme--burgundy .bubble,
  .theme .theme--burgundy .bubble {
    background-color: #edc6c8; }
  .theme--burgundy .bubble::after,
  .theme .theme--burgundy .bubble::after {
    color: #edc6c8; }
  .theme--burgundy .bubble--heavy,
  .theme .theme--burgundy .bubble--heavy {
    background-color: #ba222a;
    color: #fff; }
  .theme--burgundy .bubble--heavy::after,
  .theme .theme--burgundy .bubble--heavy::after {
    color: #ba222a; }
  .theme--purple .bubble,
  .theme .theme--purple .bubble {
    background-color: #e5cade; }
  .theme--purple .bubble::after,
  .theme .theme--purple .bubble::after {
    color: #e5cade; }
  .theme--purple .bubble--heavy,
  .theme .theme--purple .bubble--heavy {
    background-color: #9b3381;
    color: #fff; }
  .theme--purple .bubble--heavy::after,
  .theme .theme--purple .bubble--heavy::after {
    color: #9b3381; }
  .theme--youth .bubble,
  .theme .theme--youth .bubble {
    background-color: #f4dcbd; }
  .theme--youth .bubble::after,
  .theme .theme--youth .bubble::after {
    color: #f4dcbd; }
  .theme--youth .bubble--heavy,
  .theme .theme--youth .bubble--heavy {
    background-color: #d57800;
    color: #fff; }
  .theme--youth .bubble--heavy::after,
  .theme .theme--youth .bubble--heavy::after {
    color: #d57800; }
  .theme--digitalisation .bubble,
  .theme .theme--digitalisation .bubble {
    background-color: #e5cac6; }
  .theme--digitalisation .bubble::after,
  .theme .theme--digitalisation .bubble::after {
    color: #e5cac6; }
  .theme--digitalisation .bubble--heavy,
  .theme .theme--digitalisation .bubble--heavy {
    background-color: #9a3324;
    color: #fff; }
  .theme--digitalisation .bubble--heavy::after,
  .theme .theme--digitalisation .bubble--heavy::after {
    color: #9a3324; }
  .theme--climate .bubble,
  .theme .theme--climate .bubble {
    background-color: #d8ccd5; }
  .theme--climate .bubble::after,
  .theme .theme--climate .bubble::after {
    color: #d8ccd5; }
  .theme--climate .bubble--heavy,
  .theme .theme--climate .bubble--heavy {
    background-color: #693c5e;
    color: #fff; }
  .theme--climate .bubble--heavy::after,
  .theme .theme--climate .bubble--heavy::after {
    color: #693c5e; }
  .theme--gender .bubble,
  .theme .theme--gender .bubble {
    background-color: #bed8cb; }
  .theme--gender .bubble::after,
  .theme .theme--gender .bubble::after {
    color: #bed8cb; }
  .theme--gender .bubble--heavy,
  .theme .theme--gender .bubble--heavy {
    background-color: #046a38;
    color: #fff; }
  .theme--gender .bubble--heavy::after,
  .theme .theme--gender .bubble--heavy::after {
    color: #046a38; }
  .theme--nutrition .bubble,
  .theme .theme--nutrition .bubble {
    background-color: #cfdcdd; }
  .theme--nutrition .bubble::after,
  .theme .theme--nutrition .bubble::after {
    color: #cfdcdd; }
  .theme--nutrition .bubble--heavy,
  .theme .theme--nutrition .bubble--heavy {
    background-color: #487a7b;
    color: #fff; }
  .theme--nutrition .bubble--heavy::after,
  .theme .theme--nutrition .bubble--heavy::after {
    color: #487a7b; }
  .theme--blog .bubble,
  .theme .theme--blog .bubble {
    background-color: #ffe7bd; }
  .theme--blog .bubble::after,
  .theme .theme--blog .bubble::after {
    color: #ffe7bd; }
  .theme--blog .bubble--heavy,
  .theme .theme--blog .bubble--heavy {
    background-color: #ffa300;
    color: #fff; }
  .theme--blog .bubble--heavy::after,
  .theme .theme--blog .bubble--heavy::after {
    color: #ffa300; }
  .theme--spore-blue .bubble,
  .theme .theme--spore-blue .bubble {
    background-color: #cdd8eb; }
  .theme--spore-blue .bubble::after,
  .theme .theme--spore-blue .bubble::after {
    color: #cdd8eb; }
  .theme--spore-blue .bubble--heavy,
  .theme .theme--spore-blue .bubble--heavy {
    background-color: #3f68b1;
    color: #fff; }
  .theme--spore-blue .bubble--heavy::after,
  .theme .theme--spore-blue .bubble--heavy::after {
    color: #3f68b1; }
  .theme--spore-brown .bubble,
  .theme .theme--spore-brown .bubble {
    background-color: #dcd0be; }
  .theme--spore-brown .bubble::after,
  .theme .theme--spore-brown .bubble::after {
    color: #dcd0be; }
  .theme--spore-brown .bubble--heavy,
  .theme .theme--spore-brown .bubble--heavy {
    background-color: #774b04;
    color: #fff; }
  .theme--spore-brown .bubble--heavy::after,
  .theme .theme--spore-brown .bubble--heavy::after {
    color: #774b04; }
  .theme--spore-dark-blue .bubble,
  .theme .theme--spore-dark-blue .bubble {
    background-color: #bed1dd; }
  .theme--spore-dark-blue .bubble::after,
  .theme .theme--spore-dark-blue .bubble::after {
    color: #bed1dd; }
  .theme--spore-dark-blue .bubble--heavy,
  .theme .theme--spore-dark-blue .bubble--heavy {
    background-color: #044e7e;
    color: #fff; }
  .theme--spore-dark-blue .bubble--heavy::after,
  .theme .theme--spore-dark-blue .bubble--heavy::after {
    color: #044e7e; }
  .theme--spore-forest-green .bubble,
  .theme .theme--spore-forest-green .bubble {
    background-color: #d5debf; }
  .theme--spore-forest-green .bubble::after,
  .theme .theme--spore-forest-green .bubble::after {
    color: #d5debf; }
  .theme--spore-forest-green .bubble--heavy,
  .theme .theme--spore-forest-green .bubble--heavy {
    background-color: #5f810a;
    color: #fff; }
  .theme--spore-forest-green .bubble--heavy::after,
  .theme .theme--spore-forest-green .bubble--heavy::after {
    color: #5f810a; }
  .theme--spore-grey-blue .bubble,
  .theme .theme--spore-grey-blue .bubble {
    background-color: #d9e1e6; }
  .theme--spore-grey-blue .bubble::after,
  .theme .theme--spore-grey-blue .bubble::after {
    color: #d9e1e6; }
  .theme--spore-grey-blue .bubble--heavy,
  .theme .theme--spore-grey-blue .bubble--heavy {
    background-color: #6d8c9f;
    color: #fff; }
  .theme--spore-grey-blue .bubble--heavy::after,
  .theme .theme--spore-grey-blue .bubble--heavy::after {
    color: #6d8c9f; }
  .theme--spore-light-blue .bubble,
  .theme .theme--spore-light-blue .bubble {
    background-color: #dce9f3; }
  .theme--spore-light-blue .bubble::after,
  .theme .theme--spore-light-blue .bubble::after {
    color: #dce9f3; }
  .theme--spore-light-blue .bubble--heavy,
  .theme .theme--spore-light-blue .bubble--heavy {
    background-color: #79accf;
    color: #fff; }
  .theme--spore-light-blue .bubble--heavy::after,
  .theme .theme--spore-light-blue .bubble--heavy::after {
    color: #79accf; }
  .theme--spore-lime .bubble,
  .theme .theme--spore-lime .bubble {
    background-color: #edeabd; }
  .theme--spore-lime .bubble::after,
  .theme .theme--spore-lime .bubble::after {
    color: #edeabd; }
  .theme--spore-lime .bubble--heavy,
  .theme .theme--spore-lime .bubble--heavy {
    background-color: #bbae03;
    color: #fff; }
  .theme--spore-lime .bubble--heavy::after,
  .theme .theme--spore-lime .bubble--heavy::after {
    color: #bbae03; }
  .theme--spore-ochre .bubble,
  .theme .theme--spore-ochre .bubble {
    background-color: #f6e4c6; }
  .theme--spore-ochre .bubble::after,
  .theme .theme--spore-ochre .bubble::after {
    color: #f6e4c6; }
  .theme--spore-ochre .bubble--heavy,
  .theme .theme--spore-ochre .bubble--heavy {
    background-color: #db9623;
    color: #fff; }
  .theme--spore-ochre .bubble--heavy::after,
  .theme .theme--spore-ochre .bubble--heavy::after {
    color: #db9623; }
  .theme--spore-olive-green .bubble,
  .theme .theme--spore-olive-green .bubble {
    background-color: #dce1cd; }
  .theme--spore-olive-green .bubble::after,
  .theme .theme--spore-olive-green .bubble::after {
    color: #dce1cd; }
  .theme--spore-olive-green .bubble--heavy,
  .theme .theme--spore-olive-green .bubble--heavy {
    background-color: #778d3e;
    color: #fff; }
  .theme--spore-olive-green .bubble--heavy::after,
  .theme .theme--spore-olive-green .bubble--heavy::after {
    color: #778d3e; }
  .theme--spore-red .bubble,
  .theme .theme--spore-red .bubble {
    background-color: #fcd0c6; }
  .theme--spore-red .bubble::after,
  .theme .theme--spore-red .bubble::after {
    color: #fcd0c6; }
  .theme--spore-red .bubble--heavy,
  .theme .theme--spore-red .bubble--heavy {
    background-color: #f54c23;
    color: #fff; }
  .theme--spore-red .bubble--heavy::after,
  .theme .theme--spore-red .bubble--heavy::after {
    color: #f54c23; }
  .theme--spore-taupe .bubble,
  .theme .theme--spore-taupe .bubble {
    background-color: #ddd9d7; }
  .theme--spore-taupe .bubble::after,
  .theme .theme--spore-taupe .bubble::after {
    color: #ddd9d7; }
  .theme--spore-taupe .bubble--heavy,
  .theme .theme--spore-taupe .bubble--heavy {
    background-color: #7b6d65;
    color: #fff; }
  .theme--spore-taupe .bubble--heavy::after,
  .theme .theme--spore-taupe .bubble--heavy::after {
    color: #7b6d65; }
  .theme--spore-teal .bubble,
  .theme .theme--spore-teal .bubble {
    background-color: #bfdeef; }
  .theme--spore-teal .bubble::after,
  .theme .theme--spore-teal .bubble::after {
    color: #bfdeef; }
  .theme--spore-teal .bubble--heavy,
  .theme .theme--spore-teal .bubble--heavy {
    background-color: #077fc1;
    color: #fff; }
  .theme--spore-teal .bubble--heavy::after,
  .theme .theme--spore-teal .bubble--heavy::after {
    color: #077fc1; }
  .theme .bubble--clear,
  .theme .theme .bubble--clear {
    background: #fff; }
    .theme .bubble--clear::after,
    .theme .theme .bubble--clear::after {
      color: #fff; }
  .bubble--up::after, .bubble--down::after {
    content: "";
    display: block;
    position: absolute;
    left: 15px;
    width: 15px;
    height: 15px;
    border: 15px solid;
    border-left-color: transparent;
    border-right-color: transparent;
    -webkit-transform: scale(0.75, 1);
       -moz-transform: scale(0.75, 1);
        -ms-transform: scale(0.75, 1);
            transform: scale(0.75, 1); }
  .bubble--padded {
    padding: 22.5px 30px; }
  .bubble--slim-fit {
    display: inline-block; }
  .bubble--down::after {
    top: 100%;
    border-bottom-color: transparent; }
  .bubble--up::after {
    bottom: 100%;
    border-top-color: transparent; }
  .bubble--center {
    left: 50%;
    margin-left: -30px; }
  .bubble-cite {
    display: inline-block;
    padding: 22.5px 10% 0 22.5px;
    font-style: normal;
    font-size: 0.75em; }

.interview__interview {
  margin: -42px 15px 0; }
  .interview__interview.well--full, .interview__interview.well--full:visited {
    color: #fff; }

.interview__body {
  padding: 7.5px 15px 30px; }
  .interview__body .title {
    margin-bottom: 2em; }

.interview__interview, .interview__link {
  display: block; }

.interview__image {
  background-color: inherit; }

@media only screen and (min-width: 48em) {
  .interview__interview, .interview__footer {
    width: 66.66667vw; }
  .interview__footer {
    margin-left: -15px;
    margin-right: -15px; } }

@media only screen and (min-width: 64em) {
  .interview__interview {
    margin: 30px 0 0;
    padding: 0;
    position: relative;
    left: -8.33333vw;
    width: 58.33333vw;
    padding-left: 8.33333vw; }
  .interview__footer {
    width: 50vw; }
  .interview__body, .interview__footer {
    position: relative;
    left: -30px;
    padding-left: 0; }
  .interview__image {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    position: relative;
    -moz-background-size: cover;
         background-size: cover;
    background-position: center;
    background-color: inherit; }
    .layout.layout .interview__image {
      -ms-flex-preferred-size: 50vw;
          flex-basis: 50vw;
      width: 50vw;
      max-width: 50vw; }
    .interview__image::after {
      content: "";
      position: absolute;
      right: 0;
      top: 0;
      bottom: 0;
      width: 30px;
      background-color: inherit; } }

@media only screen and (min-width: 90em) {
  .interview__interview {
    margin: 60px 0 0;
    left: -5.55556vw;
    padding-left: 5.55556vw; }
  .interview__interview, .interview__footer {
    width: 44.44444vw; }
  .layout.layout .interview__image {
    -ms-flex-preferred-size: 50vw;
        flex-basis: 50vw;
    width: 50vw;
    max-width: 50vw; }
  .interview .quote {
    padding-top: 51px;
    font-size: 2.125em; }
  .interview .quote:before {
    top: 0;
    color: inherit; } }

.dossier__gallery {
  position: relative; }

.dossier__image {
  position: absolute;
  width: 100%; }

.dossier__image.is-active {
  position: static;
  -webkit-transition: opacity ease 400;
  -moz-transition: opacity ease 400;
  transition: opacity ease 400;
  opacity: 1; }

.dossier__image.is-inactive {
  -webkit-transition: opacity ease 400;
  -moz-transition: opacity ease 400;
  transition: opacity ease 400;
  opacity: 0;
  /* inactive images are still clickable without setting a negative z-index */
  z-index: -1; }

.dossier__item {
  border: 0 solid;
  border-bottom-width: 1px;
  border-color: #d7e9ce;
  padding: 15px 0; }
  .dossier__item.theme--dark,
  .theme--dark .dossier__item,
  .theme .theme--dark .dossier__item {
    border-color: #cdcdcd; }
  .dossier__item.theme--green,
  .theme--green .dossier__item,
  .theme .theme--green .dossier__item {
    border-color: #d7e9ce; }
  .dossier__item.theme--blue,
  .theme--blue .dossier__item,
  .theme .theme--blue .dossier__item {
    border-color: #d3eff6; }
  .dossier__item.theme--lime,
  .theme--lime .dossier__item,
  .theme .theme--lime .dossier__item {
    border-color: #eff4ca; }
  .dossier__item.theme--yellow,
  .theme--yellow .dossier__item,
  .theme .theme--yellow .dossier__item {
    border-color: #fef3c5; }
  .dossier__item.theme--gold,
  .theme--gold .dossier__item,
  .theme .theme--gold .dossier__item {
    border-color: #fae3c8; }
  .dossier__item.theme--orange,
  .theme--orange .dossier__item,
  .theme .theme--orange .dossier__item {
    border-color: #f7d7ca; }
  .dossier__item.theme--salmon,
  .theme--salmon .dossier__item,
  .theme .theme--salmon .dossier__item {
    border-color: #fadbd5; }
  .dossier__item.theme--red,
  .theme--red .dossier__item,
  .theme .theme--red .dossier__item {
    border-color: #fac8c1; }
  .dossier__item.theme--burgundy,
  .theme--burgundy .dossier__item,
  .theme .theme--burgundy .dossier__item {
    border-color: #edc6c8; }
  .dossier__item.theme--purple,
  .theme--purple .dossier__item,
  .theme .theme--purple .dossier__item {
    border-color: #e5cade; }
  .dossier__item.theme--youth,
  .theme--youth .dossier__item,
  .theme .theme--youth .dossier__item {
    border-color: #f4dcbd; }
  .dossier__item.theme--digitalisation,
  .theme--digitalisation .dossier__item,
  .theme .theme--digitalisation .dossier__item {
    border-color: #e5cac6; }
  .dossier__item.theme--climate,
  .theme--climate .dossier__item,
  .theme .theme--climate .dossier__item {
    border-color: #d8ccd5; }
  .dossier__item.theme--gender,
  .theme--gender .dossier__item,
  .theme .theme--gender .dossier__item {
    border-color: #bed8cb; }
  .dossier__item.theme--nutrition,
  .theme--nutrition .dossier__item,
  .theme .theme--nutrition .dossier__item {
    border-color: #cfdcdd; }
  .dossier__item.theme--blog,
  .theme--blog .dossier__item,
  .theme .theme--blog .dossier__item {
    border-color: #ffe7bd; }
  .dossier__item.theme--spore-blue,
  .theme--spore-blue .dossier__item,
  .theme .theme--spore-blue .dossier__item {
    border-color: #cdd8eb; }
  .dossier__item.theme--spore-brown,
  .theme--spore-brown .dossier__item,
  .theme .theme--spore-brown .dossier__item {
    border-color: #dcd0be; }
  .dossier__item.theme--spore-dark-blue,
  .theme--spore-dark-blue .dossier__item,
  .theme .theme--spore-dark-blue .dossier__item {
    border-color: #bed1dd; }
  .dossier__item.theme--spore-forest-green,
  .theme--spore-forest-green .dossier__item,
  .theme .theme--spore-forest-green .dossier__item {
    border-color: #d5debf; }
  .dossier__item.theme--spore-grey-blue,
  .theme--spore-grey-blue .dossier__item,
  .theme .theme--spore-grey-blue .dossier__item {
    border-color: #d9e1e6; }
  .dossier__item.theme--spore-light-blue,
  .theme--spore-light-blue .dossier__item,
  .theme .theme--spore-light-blue .dossier__item {
    border-color: #dce9f3; }
  .dossier__item.theme--spore-lime,
  .theme--spore-lime .dossier__item,
  .theme .theme--spore-lime .dossier__item {
    border-color: #edeabd; }
  .dossier__item.theme--spore-ochre,
  .theme--spore-ochre .dossier__item,
  .theme .theme--spore-ochre .dossier__item {
    border-color: #f6e4c6; }
  .dossier__item.theme--spore-olive-green,
  .theme--spore-olive-green .dossier__item,
  .theme .theme--spore-olive-green .dossier__item {
    border-color: #dce1cd; }
  .dossier__item.theme--spore-red,
  .theme--spore-red .dossier__item,
  .theme .theme--spore-red .dossier__item {
    border-color: #fcd0c6; }
  .dossier__item.theme--spore-taupe,
  .theme--spore-taupe .dossier__item,
  .theme .theme--spore-taupe .dossier__item {
    border-color: #ddd9d7; }
  .dossier__item.theme--spore-teal,
  .theme--spore-teal .dossier__item,
  .theme .theme--spore-teal .dossier__item {
    border-color: #bfdeef; }

.dossier__item:first-child {
  border-top-width: 1px; }

@media only screen and (min-width: 64em) {
  .dossier, .dossier__gallery, .dossier__documents {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; }
  .dossier__documents {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between; }
  .dossier__item {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 0; }
  .dossier__item.is-active, .dossier__item.is-current {
    position: relative; }
    .dossier__item.is-active:after, .dossier__item.is-current:after {
      content: "";
      position: absolute;
      left: -45px;
      width: 30px;
      height: 30px;
      top: 50%;
      -webkit-transform: translateY(-50%) rotate(45deg);
         -moz-transform: translateY(-50%) rotate(45deg);
          -ms-transform: translateY(-50%) rotate(45deg);
              transform: translateY(-50%) rotate(45deg);
      background: #fff; } }

/* 3.x Label */
/* 3.x Alert */
/* 3.x Tooltip */
/* 3.x Media */
/* 3.x Issue */
/* 3.x Box */
/* 3.x State */
/* 3.50.1 Issue-label */
/*
ICT Update – Issue Label

**@TODO - Breakpoints**

The issue publication number

.issue-label - Issue tag
.issue-label.issue-label--s - Smaller issue tag
.issue-label.issue-label--l - Larger Issue tag
.issue-label.issue-label--offset-left - Float to left
.issue-label.issue-label--offset-right - Float to right
.issue-label.issue-label--offset-top - Float on top

markup:
<div class="{$modifiers} media">
  <div class="issue-label__nr" data-issue-nr="80"></div>
  <div class="issue-label__caption">
    <p>
      <strong>More than Mobile</strong><br/>
      <span>Issue 80 August 2015</span>
    </p>
  </div>
</div>

Styleguide 3.50.1
*/
/*
 * 1. IE Fallback
 */
.issue-label {
  font-weight: 600;
  font-size: 12px;
  line-height: 12px; }
  .issue-label__nr:before {
    content: attr(data-issue-nr);
    display: inline-block;
    width: 36px;
    height: 36px;
    background: #67ab43;
    font-size: 1.6em;
    line-height: 36px;
    text-align: center;
    color: #fff;
    font-weight: bold; }
    .theme--blue .issue-label__nr:before {
      background-color: #56c0dd; }
    .theme--lime .issue-label__nr:before {
      background-color: #c1d435; }
    .theme--yellow .issue-label__nr:before {
      background-color: #facf21; }
    .theme--gold .issue-label__nr:before {
      background-color: #eb942c; }
    .theme--orange .issue-label__nr:before {
      background-color: #e26435; }
    .theme--salmon .issue-label__nr:before {
      background-color: #eb735d; }
    .theme--red .issue-label__nr:before {
      background-color: #ec2d10; }
    .theme--burgundy .issue-label__nr:before {
      background-color: #ba222a; }
    .theme--purple .issue-label__nr:before {
      background-color: #9b3381; }
    .post-header .issue-label__nr:before {
      background-color: #fff;
      color: #67ab43; }
      .theme--blue .post-header .issue-label__nr:before {
        color: #56c0dd; }
      .theme--lime .post-header .issue-label__nr:before {
        color: #c1d435; }
      .theme--yellow .post-header .issue-label__nr:before {
        color: #facf21; }
      .theme--gold .post-header .issue-label__nr:before {
        color: #eb942c; }
      .theme--orange .post-header .issue-label__nr:before {
        color: #e26435; }
      .theme--salmon .post-header .issue-label__nr:before {
        color: #eb735d; }
      .theme--red .post-header .issue-label__nr:before {
        color: #ec2d10; }
      .theme--burgundy .post-header .issue-label__nr:before {
        color: #ba222a; }
      .theme--purple .post-header .issue-label__nr:before {
        color: #9b3381; }
  .issue-label__caption {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
    .issue-label__caption * {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 1 auto;
              flex: 0 1 auto;
      width: 100%;
      /* 1 */ }
    .issue-label__caption--s {
      margin-bottom: 7px;
      /* why is this vertical margin not in line with the rhythm? */
      font-weight: 400;
      text-transform: none; }
    .post-header .issue-label__caption {
      color: #fff; }
  .issue-label__nr, .issue-label__caption {
    display: inline-block;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; }
  .issue-label__nr + .issue-label__caption,
  .issue-label__caption + .issue-label__nr {
    padding-left: 1em; }
  .issue-label--offset-top .issue-label__caption, .issue-label--s {
    font-size: 11px;
    line-height: 12px; }
  .issue-label--s .issue-label__nr:before {
    font-size: 1.2em;
    width: 30px;
    height: 30px;
    line-height: 30px; }
  .issue-label--l {
    font-size: 14px;
    line-height: 15px; }
    .issue-label--l .issue-label__nr:before {
      top: -78px; }
  .issue-label--l .issue-label__nr:before {
    width: 48px;
    height: 48px;
    line-height: 48px; }
  .issue-label--offset-left, .issue-label--offset-right, .issue-label--offset-top {
    position: relative; }
  .issue-label--offset-left .issue-label__nr:before,
  .issue-label--offset-right .issue-label__nr:before {
    position: absolute; }
  .issue-label--offset-left .issue-label__nr:before {
    right: 100%; }
  .issue-label--offset-right .issue-label__nr:before {
    left: 100%; }
  .issue-label--offset-top .issue-label__nr:before {
    position: absolute;
    bottom: 100%; }
  .issue-label--offset-top .issue-label--s {
    margin-top: 30px; }
  .issue-label--offset-right > .issue-label__nr + .issue-label__caption,
  .issue-label--offset-right > .issue-label__caption + .issue-label__nr,
  .issue-label--offset-top > .issue-label__nr + .issue-label__caption,
  .issue-label--offset-top > .issue-label__caption + .issue-label__nr {
    padding-left: 0; }

@media only screen and (min-width: 64em) {
  .issue-label--l .issue-label__nr:before {
    position: initial;
    margin-right: 6px; } }

@media only screen and (max-width: 47.9375em) {
  .issue-label--l .issue-label__nr:before {
    top: 27px; } }

/* 3.98 Effects */
/*
Effects

.fx - Transition all properties

Styleguide 3.98
*/
a,
.anchor, .picker__holder, .picker__day, .fx, .selectize-control .option, .selectize-control .optgroup-header {
  -webkit-transition-duration: .2s;
     -moz-transition-duration: .2s;
          transition-duration: .2s;
  -webkit-transition-timing-function: ease-in-out;
     -moz-transition-timing-function: ease-in-out;
          transition-timing-function: ease-in-out;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all; }

/* 3.99 States */
/*
State

.is-narrative - Hidden label, but is used as narrative for visually impaired users
.is-heir - Passes on parent's color and background properties
.is-crowned - When assigned to an element directly following the `masthead`, it pulls that item up so the masthead sits on top (like a crown).
.is-rooted - Adds position relative.
.is-clear - Clearfix
.is-center - Flex align self center
.is-gt-small-handheld - Hidden on small handheld
.is-gt-medium-handheld - Hidden on medium handheld and smaller
.is-gt-large-handheld - Hidden on large handheld and smaller
.is-gt-small-desktop - Hidden on small desktop and smaller
.is-lt-small-desktop - Only visible on mobile viewports
.is-gt-medium-desktop - Hidden on medium desktop and smaller
.is-gt-large-desktop - Hidden on large desktop and smaller

markup:
<p class="{$modifiers}">{$modifiers}</p>

Styleguide 3.99
*/
.is-narrative {
  position: absolute;
  left: -999em;
  top: -999em;
  /* IE pushed the text to the bottom of the page without this */ }

.is-silent {
  speak: none; }

.is-heir.is-heir.is-heir.is-heir.is-heir {
  color: inherit;
  background: inherit;
  text-decoration: inherit; }

.masthead + .is-crowned {
  margin-top: -78px; }
  @media only screen and (min-width: 64em) {
    .masthead + .is-crowned {
      margin-top: -156px; } }

.is-rooted,
.is-root {
  position: relative; }

.is-clear {
  overflow: auto; }

.is-center {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center; }

.is-lt-small-handheld.is-lt-small-handheld,
.is-lt-medium-handheld.is-lt-medium-handheld,
.is-lt-large-handheld.is-lt-large-handheld,
.is-lt-small-desktop.is-lt-small-desktop,
.is-lt-medium-desktop.is-lt-medium-desktop,
.is-lt-large-desktop.is-lt-large-desktop,
.is-gt-small-handheld.is-gt-small-handheld,
.is-gt-medium-handheld.is-gt-medium-handheld,
.is-gt-large-handheld.is-gt-large-handheld,
.is-gt-small-desktop.is-gt-small-desktop,
.is-gt-medium-desktop.is-gt-medium-desktop,
.is-gt-large-desktop.is-gt-large-desktop {
  display: none; }

@media only screen and (max-width: 19.9375em) {
  .is-lt-small-handheld.is-lt-small-handheld {
    display: inherit; } }

@media only screen and (max-width: 32.4375em) {
  .is-lt-medium-handheld.is-lt-medium-handheld {
    display: inherit; } }

@media only screen and (max-width: 47.9375em) {
  .is-lt-large-handheld.is-lt-large-handheld {
    display: inherit; } }

@media only screen and (max-width: 63.9375em) {
  .is-lt-small-desktop.is-lt-small-desktop {
    display: inherit; } }

@media only screen and (max-width: 89.9375em) {
  .is-lt-medium-desktop.is-lt-medium-desktop {
    display: inherit; } }

@media only screen and (max-width: 99.9375em) {
  .is-lt-large-desktop.is-lt-large-desktop {
    display: inherit; } }

@media only screen and (min-width: 20em) {
  .is-gt-small-handheld.is-gt-small-handheld {
    display: inherit; } }

@media only screen and (min-width: 32.5em) {
  .is-gt-medium-handheld.is-gt-medium-handheld {
    display: inherit; } }

@media only screen and (min-width: 48em) {
  .is-gt-large-handheld.is-gt-large-handheld {
    display: inherit; } }

@media only screen and (min-width: 64em) {
  .is-gt-small-desktop.is-gt-small-desktop {
    display: inherit; } }

@media only screen and (min-width: 90em) {
  .is-gt-medium-desktop.is-gt-medium-desktop {
    display: inherit; } }

@media only screen and (min-width: 100em) {
  .is-gt-large-desktop.is-gt-large-desktop {
    display: inherit; } }

/* 3. */
/*
Layout

Styleguide 2.0
*/
/* 2.1 Layout */
/*
Layout

Two- or three-column layout – |Aside|Main|Aside. Aside columns are optional and can be omitted for a two- or single-column layout.

.layout - Full width accross viewports
.layout.layout--reverse - Reverses container ordering on smallest viewports, is used for source ordering
.layout.layout--even - Spreads columns evenly
.layout.layout--split - A larger left and smaller right column
.layout.layout--align-middle - Align content vertically centered
.layout.layout--align-end - Align content to flex end (bottom or right depending on flex direction)
.layout.layout--narrow - Narrows the content

markup:
<div class="{$modifiers}">
  <div class="layout__cell layout__cell--aside">
    Sidebar 1
  </div>
  <div class="layout__cell">
    Main ({$modifiers})
  </div>
  <div class="layout__cell layout__cell--aside">
    Sidebar 2
  </div>
</div>

Styleguide 2.1
*/
/*
 * 1. Allow containers to shrink and grow
 */
.layout {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .no-flexbox .layout {
    display: block; }
  .layout__cell {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    max-width: 100%; }
    .no-flexbox .layout__cell {
      width: 100%; }
  .layout--reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
       -moz-box-orient: horizontal;
       -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse; }
  .layout--wide, .layout__stretch {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%; }
    .no-flexbox .layout--wide, .no-flexbox .layout__stretch {
      width: 100%; }
  .layout--even {
    /* No styling until gt-medium-handheld */ }
  .layout--split {
    /* No styling until gt-medium-handheld */ }
  .layout--align-middle {
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  .layout--align-end {
    -webkit-box-align: end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end; }
  @media only screen and (min-width: 32.5em) {
    .layout--even .layout__cell {
      -webkit-box-flex: 0 !important;
         -moz-box-flex: 0 !important;
          -ms-flex: 0 0 50% !important;
              flex: 0 0 50% !important;
      max-width: 50% !important; }
      .no-flexbox .layout--even .layout__cell {
        width: 50% !important; }
    .no-flexbox .layout__cell {
      float: left; }
    .no-flexbox .layout--reverse > .layout__cell:first-child {
      float: right;
      width: 72.22222%; }
    .no-flexbox .layout > .layout__cell:first-child:not(:last-child) {
      width: 72.22222%; }
    .no-flexbox .layout > .layout__cell--aside:first-child:not(:last-child) {
      width: 27.77778%; } }
  @media only screen and (min-width: 48em) {
    .layout--narrow {
      margin-left: 16.66667%;
      margin-left: 16.66667vw;
      margin-right: 16.66667%;
      margin-right: 16.66667vw; } }
  @media only screen and (min-width: 64em) {
    .layout {
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap; }
      .layout--even {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
      .layout--narrow {
        margin-left: 16.66667%;
        margin-left: 16.66667vw;
        margin-right: 16.66667%;
        margin-right: 16.66667vw; }
        .layout--narrow-s {
          margin-left: 11.11111%;
          margin-left: 11.11111vw;
          margin-right: 11.11111%;
          margin-right: 11.11111vw; }
      .no-flexbox .layout__cell .layout__cell:first-child:not(:last-child) {
        width: 61.53846%; }
      .no-flexbox .layout__cell .layout__cell--aside {
        width: 38.46154%; }
      .no-flexbox .layout--split {
        display: table; }
        .no-flexbox .layout--split .layout__cell:first-child:not(:last-child) {
          width: 50%; }
        .no-flexbox .layout--split .layout__cell {
          display: table-cell;
          float: none;
          width: 50%; }
      .layout__cell--aside {
        -webkit-box-flex: 0;
           -moz-box-flex: 0;
            -ms-flex: 0 0 27.77778vw;
                flex: 0 0 27.77778vw;
        max-width: 27.77778vw; }
        .layout--narrow .layout__cell--aside {
          -ms-flex-preferred-size: 16.66667vw;
              flex-basis: 16.66667vw;
          max-width: 16.66667vw; }
        .panel__body .layout .layout__cell--aside {
          -webkit-box-flex: 0;
             -moz-box-flex: 0;
              -ms-flex: 0 0 27.77778%;
                  flex: 0 0 27.77778%;
          max-width: 27.77778%; }
        .no-flexbox .layout__cell--aside {
          width: 27.77778%; }
      .no-flexbox .layout--split > .layout__cell:first-child:not(:last-child) {
        width: 55.55556%; }
      .layout--split .layout__cell--aside {
        -ms-flex-preferred-size: 44.44444vw;
            flex-basis: 44.44444vw;
        max-width: 44.44444vw; }
        .layout--narrow .layout--split .layout__cell--aside {
          -ms-flex-preferred-size: 22.22222vw;
              flex-basis: 22.22222vw;
          max-width: 22.22222vw; }
        .no-flexbox .layout--split .layout__cell--aside {
          width: 44.44444%; }
      .layout__cell--aside + .layout__cell, .layout__cell:first-child:last-child {
        -ms-flex-preferred-size: 44.44444vw;
            flex-basis: 44.44444vw;
        max-width: 44.44444vw; }
        .no-flexbox .layout__cell--aside + .layout__cell, .no-flexbox .layout__cell:first-child:last-child {
          width: 44.44444%; }
      .layout__cell:first-child:last-child {
        margin-left: auto;
        margin-right: auto; }
        .no-flexbox .layout__cell:first-child:last-child {
          position: relative;
          left: 27.77778%; }
      .layout__cell--aside + .layout__cell:last-child {
        -ms-flex-preferred-size: 72.22222vw;
            flex-basis: 72.22222vw;
        max-width: 72.22222vw; }
        .no-flexbox .layout__cell--aside + .layout__cell:last-child {
          width: 72.22222%; }
      .layout__cell .layout__cell--aside {
        -ms-flex-preferred-size: 27.77778vw;
            flex-basis: 27.77778vw;
        max-width: 27.77778vw; }
        .panel__body .layout__cell .layout__cell--aside {
          -webkit-box-flex: 0;
             -moz-box-flex: 0;
              -ms-flex: 0 0 27.77778%;
                  flex: 0 0 27.77778%;
          max-width: 27.77778%; }
        .no-flexbox .layout__cell .layout__cell--aside {
          width: 38.46154%; }
      .no-flexbox .layout__cell .layout__cell--aside, .no-flexbox .layout__cell--aside, .no-flexbox
      .layout__cell--aside + .layout__cell, .no-flexbox
      .layout__cell--aside + .layout__cell:last-child, .no-flexbox .layout__cell:first-child:last-child, .no-flexbox .layout__cell:first-child:last-child {
        display: inline-block;
        float: left; }
      .layout__cell--divider, .layout__cell--divider-outside, .layout__cell--divider-inside, .layout__cell--divider-middle {
        position: relative; }
        .layout__cell--divider::after, .layout__cell--divider-outside::after, .layout__cell--divider-inside::after, .layout__cell--divider-middle::after {
          content: "";
          display: block;
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          width: 1px;
          background-color: #d7e9ce; }
        .theme--dark .layout__cell--divider::after, .theme--dark .layout__cell--divider-outside::after, .theme--dark .layout__cell--divider-inside::after, .theme--dark .layout__cell--divider-middle::after {
          background-color: #cdcdcd; }
        .theme--green .layout__cell--divider::after, .theme--green .layout__cell--divider-outside::after, .theme--green .layout__cell--divider-inside::after, .theme--green .layout__cell--divider-middle::after {
          background-color: #d7e9ce; }
        .theme--blue .layout__cell--divider::after, .theme--blue .layout__cell--divider-outside::after, .theme--blue .layout__cell--divider-inside::after, .theme--blue .layout__cell--divider-middle::after {
          background-color: #d3eff6; }
        .theme--lime .layout__cell--divider::after, .theme--lime .layout__cell--divider-outside::after, .theme--lime .layout__cell--divider-inside::after, .theme--lime .layout__cell--divider-middle::after {
          background-color: #eff4ca; }
        .theme--yellow .layout__cell--divider::after, .theme--yellow .layout__cell--divider-outside::after, .theme--yellow .layout__cell--divider-inside::after, .theme--yellow .layout__cell--divider-middle::after {
          background-color: #fef3c5; }
        .theme--gold .layout__cell--divider::after, .theme--gold .layout__cell--divider-outside::after, .theme--gold .layout__cell--divider-inside::after, .theme--gold .layout__cell--divider-middle::after {
          background-color: #fae3c8; }
        .theme--orange .layout__cell--divider::after, .theme--orange .layout__cell--divider-outside::after, .theme--orange .layout__cell--divider-inside::after, .theme--orange .layout__cell--divider-middle::after {
          background-color: #f7d7ca; }
        .theme--salmon .layout__cell--divider::after, .theme--salmon .layout__cell--divider-outside::after, .theme--salmon .layout__cell--divider-inside::after, .theme--salmon .layout__cell--divider-middle::after {
          background-color: #fadbd5; }
        .theme--red .layout__cell--divider::after, .theme--red .layout__cell--divider-outside::after, .theme--red .layout__cell--divider-inside::after, .theme--red .layout__cell--divider-middle::after {
          background-color: #fac8c1; }
        .theme--burgundy .layout__cell--divider::after, .theme--burgundy .layout__cell--divider-outside::after, .theme--burgundy .layout__cell--divider-inside::after, .theme--burgundy .layout__cell--divider-middle::after {
          background-color: #edc6c8; }
        .theme--purple .layout__cell--divider::after, .theme--purple .layout__cell--divider-outside::after, .theme--purple .layout__cell--divider-inside::after, .theme--purple .layout__cell--divider-middle::after {
          background-color: #e5cade; }
        .theme--youth .layout__cell--divider::after, .theme--youth .layout__cell--divider-outside::after, .theme--youth .layout__cell--divider-inside::after, .theme--youth .layout__cell--divider-middle::after {
          background-color: #f4dcbd; }
        .theme--digitalisation .layout__cell--divider::after, .theme--digitalisation .layout__cell--divider-outside::after, .theme--digitalisation .layout__cell--divider-inside::after, .theme--digitalisation .layout__cell--divider-middle::after {
          background-color: #e5cac6; }
        .theme--climate .layout__cell--divider::after, .theme--climate .layout__cell--divider-outside::after, .theme--climate .layout__cell--divider-inside::after, .theme--climate .layout__cell--divider-middle::after {
          background-color: #d8ccd5; }
        .theme--gender .layout__cell--divider::after, .theme--gender .layout__cell--divider-outside::after, .theme--gender .layout__cell--divider-inside::after, .theme--gender .layout__cell--divider-middle::after {
          background-color: #bed8cb; }
        .theme--nutrition .layout__cell--divider::after, .theme--nutrition .layout__cell--divider-outside::after, .theme--nutrition .layout__cell--divider-inside::after, .theme--nutrition .layout__cell--divider-middle::after {
          background-color: #cfdcdd; }
        .theme--blog .layout__cell--divider::after, .theme--blog .layout__cell--divider-outside::after, .theme--blog .layout__cell--divider-inside::after, .theme--blog .layout__cell--divider-middle::after {
          background-color: #ffe7bd; }
        .theme--spore-blue .layout__cell--divider::after, .theme--spore-blue .layout__cell--divider-outside::after, .theme--spore-blue .layout__cell--divider-inside::after, .theme--spore-blue .layout__cell--divider-middle::after {
          background-color: #cdd8eb; }
        .theme--spore-brown .layout__cell--divider::after, .theme--spore-brown .layout__cell--divider-outside::after, .theme--spore-brown .layout__cell--divider-inside::after, .theme--spore-brown .layout__cell--divider-middle::after {
          background-color: #dcd0be; }
        .theme--spore-dark-blue .layout__cell--divider::after, .theme--spore-dark-blue .layout__cell--divider-outside::after, .theme--spore-dark-blue .layout__cell--divider-inside::after, .theme--spore-dark-blue .layout__cell--divider-middle::after {
          background-color: #bed1dd; }
        .theme--spore-forest-green .layout__cell--divider::after, .theme--spore-forest-green .layout__cell--divider-outside::after, .theme--spore-forest-green .layout__cell--divider-inside::after, .theme--spore-forest-green .layout__cell--divider-middle::after {
          background-color: #d5debf; }
        .theme--spore-grey-blue .layout__cell--divider::after, .theme--spore-grey-blue .layout__cell--divider-outside::after, .theme--spore-grey-blue .layout__cell--divider-inside::after, .theme--spore-grey-blue .layout__cell--divider-middle::after {
          background-color: #d9e1e6; }
        .theme--spore-light-blue .layout__cell--divider::after, .theme--spore-light-blue .layout__cell--divider-outside::after, .theme--spore-light-blue .layout__cell--divider-inside::after, .theme--spore-light-blue .layout__cell--divider-middle::after {
          background-color: #dce9f3; }
        .theme--spore-lime .layout__cell--divider::after, .theme--spore-lime .layout__cell--divider-outside::after, .theme--spore-lime .layout__cell--divider-inside::after, .theme--spore-lime .layout__cell--divider-middle::after {
          background-color: #edeabd; }
        .theme--spore-ochre .layout__cell--divider::after, .theme--spore-ochre .layout__cell--divider-outside::after, .theme--spore-ochre .layout__cell--divider-inside::after, .theme--spore-ochre .layout__cell--divider-middle::after {
          background-color: #f6e4c6; }
        .theme--spore-olive-green .layout__cell--divider::after, .theme--spore-olive-green .layout__cell--divider-outside::after, .theme--spore-olive-green .layout__cell--divider-inside::after, .theme--spore-olive-green .layout__cell--divider-middle::after {
          background-color: #dce1cd; }
        .theme--spore-red .layout__cell--divider::after, .theme--spore-red .layout__cell--divider-outside::after, .theme--spore-red .layout__cell--divider-inside::after, .theme--spore-red .layout__cell--divider-middle::after {
          background-color: #fcd0c6; }
        .theme--spore-taupe .layout__cell--divider::after, .theme--spore-taupe .layout__cell--divider-outside::after, .theme--spore-taupe .layout__cell--divider-inside::after, .theme--spore-taupe .layout__cell--divider-middle::after {
          background-color: #ddd9d7; }
        .theme--spore-teal .layout__cell--divider::after, .theme--spore-teal .layout__cell--divider-outside::after, .theme--spore-teal .layout__cell--divider-inside::after, .theme--spore-teal .layout__cell--divider-middle::after {
          background-color: #bfdeef; }
        .theme .layout__cell--divider.well:not(.well--full)::after, .layout__cell--divider.well:not(.well--full)::after, .theme
        .well:not(.well--full) .layout__cell--divider::after,
        .well:not(.well--full) .layout__cell--divider::after, .theme .layout__cell--divider-outside.well:not(.well--full)::after, .layout__cell--divider-outside.well:not(.well--full)::after, .theme
        .well:not(.well--full) .layout__cell--divider-outside::after,
        .well:not(.well--full) .layout__cell--divider-outside::after, .theme .layout__cell--divider-inside.well:not(.well--full)::after, .layout__cell--divider-inside.well:not(.well--full)::after, .theme
        .well:not(.well--full) .layout__cell--divider-inside::after,
        .well:not(.well--full) .layout__cell--divider-inside::after, .theme .layout__cell--divider-middle.well:not(.well--full)::after, .layout__cell--divider-middle.well:not(.well--full)::after, .theme
        .well:not(.well--full) .layout__cell--divider-middle::after,
        .well:not(.well--full) .layout__cell--divider-middle::after {
          background-color: #fff; } }
  @media only screen and (min-width: 90em) {
    .layout__cell--divider::after, .layout__cell--divider-inside::after {
      -webkit-transform: translateX(-15px);
         -moz-transform: translateX(-15px);
          -ms-transform: translateX(-15px);
              transform: translateX(-15px); }
    .layout__cell--divider-outside::after {
      -webkit-transform: translateX(15px);
         -moz-transform: translateX(15px);
          -ms-transform: translateX(15px);
              transform: translateX(15px); }
    .layout__cell--divider-middle::after,
    .layout--even .layout__cell--divider::after {
      -webkit-transform: none;
         -moz-transform: none;
          -ms-transform: none;
              transform: none; } }

/*
Layout example, two-column with left sidebar

| Sidebar | Main |

.layout - Full width accross viewports
.layout.layout--reverse - Reverses container ordering on smallest viewports, is used for source ordering

markup:
<div class="{$modifiers}">
  <div class="layout__cell layout__cell--aside">
    Sidebar
  </div>
  <div class="layout__cell">
    Main
  </div>
</div>

Styleguide 2.1.1
*/
/*
Layout example, two-column with right sidebar

| Main | Sidebar |

.layout - Full width accross viewports
.layout.layout--reverse - Reverses container ordering on smallest viewports, is used for source ordering

markup:
<div class="{$modifiers}">
  <div class="layout__cell">
    Main
  </div>
  <div class="layout__cell layout__cell--aside">
    Sidebar
  </div>
</div>

Styleguide 2.1.2
*/
/*
Layout example, narrow single-column

| Main |

.layout - Full width accross viewports (added well class to cell for visibility in this example)

markup:
<div class="{$modifiers}">
  <div class="layout__cell well">
    Main
  </div>
</div>

Styleguide 2.1.3
*/
/*
Example of a nested Layout

Layouts can be nested for more complex layouts

markup:
<div class="layout layout--reverse">
  <div class="layout__cell layout__cell--aside">
    Sidebar
  </div>
  <div class="layout__cell layout__cell--main layout layout--reverse">
    <div class="layout__cell layout__cell--main">
      Main
    </div>
    <div class="layout__cell layout__cell--aside">
      Sidebar
    </div>
  </div>
</div>

Styleguide 2.1.4
*/
/* 2.2 Gutter */
/*
Gutter

.gutter - Full gutter-width to right side on all viewports
.gutters - Half gutter-width to either side
.gutter--left - Half gutter-width to left side
.gutter--right - Half gutter-width to right side
.gutter-outside - Full gutter-width to right side
.gutters-outside - Half gutter-width to either side
.gutter-outside--left - Half gutter-width to left side
.gutter-outside--right - Half gutter-width to right side
.gutters-hero - Full gutter-width to either side on larger
.gutter-hero--left - Full gutter-width to left side
.gutter-hero--right - Full gutter-width to right side



markup:
<div class="{$modifiers}">{$modifiers}</div>

Styleguide 2.2
*/
.gutter, .gutter-right {
  padding-right: 30px; }

.gutter-left {
  padding-left: 30px; }

.gutter-outside {
  margin-right: 30px; }

.gutters, .gutter--left {
  padding-left: 15px; }

.gutters, .gutter--right {
  padding-right: 15px; }

.gutters-outside, .gutter-outside--left {
  margin-left: 15px; }

.gutters-outside, .gutter-outside--right {
  margin-right: 15px; }

@media only screen and (max-width: 47.9375em) {
  .gutter-mobile--right {
    padding-right: 0; }
  .gutter-mobile--left {
    padding-left: 0; } }

@media only screen and (min-width: 90em) {
  .gutters-hero, .gutter-hero--left {
    padding-left: 30px; }
  .gutters-hero, .gutter-hero--right {
    padding-right: 30px; }
  .gutters-hero-outside, .gutter-hero-outside--left {
    margin-left: 30px; }
  .gutters-hero-outside, .gutter-hero-outside--right {
    margin-right: 30px; } }

/* 2.3 Wing */
/*
Wing

A single-column whitespace (left, right, or both).
Wings may only be applied to the sidebar. Don't apply the wings to the layout
parent container, as this will distort the layout.


.wings - Left and right column padding
.wing--left - Left column padding
.wing--right - Right column padding

markup:
<div class="{$modifiers}">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris pharetra
  pellentesque ligula ut feugiat. Nullam elit libero, rutrum eu odio sed, tempus
  iaculis lectus. Phasellus felis ex, malesuada vitae libero ac, auctor finibus
  sapien. Sed odio enim, molestie eu pretium sit amet, commodo ut enim. Praesent
  eget mi eget enim hendrerit interdum. Ut sit amet orci libero. Vestibulum et
  leo pretium, semper nisl non, aliquam arcu. Pellentesque malesuada eros a elit
  imperdiet, sed tempor enim malesuada. Praesent accumsan malesuada eros, in
  sodales tortor sagittis at. Duis sollicitudin, est sed lobortis semper, felis
  est hendrerit massa, a tincidunt nulla risus in lectus. Praesent eleifend
  vestibulum nunc sed mollis. Ut dapibus nisi turpis, id lobortis justo
  scelerisque vitae. Morbi vel augue in ipsum dignissim aliquet. Vestibulum
  justo est, venenatis ut massa eu, dignissim vulputate lorem. Morbi porta est
  quis erat vulputate tristique.
</div>

Styleguide 2.3
*/
@media only screen and (min-width: 90em) {
  .wings, .wing--left {
    padding-left: 79.94444px;
    padding-left: 5.55556vw; }
  .wings, .wing--right {
    padding-right: 79.94444px;
    padding-right: 5.55556vw; } }

@media only screen and (min-width: 100em) {
  .wings, .wing--left {
    padding-left: 88.83333px;
    padding-left: 5.55556vw; }
  .wings, .wing--right {
    padding-right: 88.83333px;
    padding-right: 5.55556vw; } }

/*
Wings in a layout setup

Wings may only be applied to the sidebar. Don't apply the wings to the layout parent container, as this will distort the layout.

.wings - Left and right column padding
.wing--left - Left column padding
.wing--right - Right column padding

markup:
<div class="layout">
  <div class="layout__cell layout__cell--aside {$modifiers}">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris pharetra pellentesque ligula ut feugiat. Nullam elit libero, rutrum eu odio sed, tempus iaculis lectus. Phasellus felis ex, malesuada vitae libero ac, auctor finibus sapien. Sed odio enim, molestie eu pretium sit amet, commodo ut enim. Praesent eget mi eget enim hendrerit interdum. Ut sit amet orci libero. Vestibulum et leo pretium, semper nisl non, aliquam arcu. Pellentesque malesuada eros a elit imperdiet, sed tempor enim malesuada. Praesent accumsan malesuada eros, in sodales tortor sagittis at. Duis sollicitudin, est sed lobortis semper, felis est hendrerit massa, a tincidunt nulla risus in lectus. Praesent eleifend vestibulum nunc sed mollis. Ut dapibus nisi turpis, id lobortis justo scelerisque vitae. Morbi vel augue in ipsum dignissim aliquet. Vestibulum justo est, venenatis ut massa eu, dignissim vulputate lorem. Morbi porta est quis erat vulputate tristique.
  </div>
  <div class="layout__cell">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris pharetra pellentesque ligula ut feugiat. Nullam elit libero, rutrum eu odio sed, tempus iaculis lectus. Phasellus felis ex, malesuada vitae libero ac, auctor finibus sapien. Sed odio enim, molestie eu pretium sit amet, commodo ut enim. Praesent eget mi eget enim hendrerit interdum. Ut sit amet orci libero. Vestibulum et leo pretium, semper nisl non, aliquam arcu. Pellentesque malesuada eros a elit imperdiet, sed tempor enim malesuada. Praesent accumsan malesuada eros, in sodales tortor sagittis at. Duis sollicitudin, est sed lobortis semper, felis est hendrerit massa, a tincidunt nulla risus in lectus. Praesent eleifend vestibulum nunc sed mollis. Ut dapibus nisi turpis, id lobortis justo scelerisque vitae. Morbi vel augue in ipsum dignissim aliquet. Vestibulum justo est, venenatis ut massa eu, dignissim vulputate lorem. Morbi porta est quis erat vulputate tristique.
  </div>
  <div class="layout__cell layout__cell--aside {$modifiers}">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris pharetra pellentesque ligula ut feugiat. Nullam elit libero, rutrum eu odio sed, tempus iaculis lectus. Phasellus felis ex, malesuada vitae libero ac, auctor finibus sapien. Sed odio enim, molestie eu pretium sit amet, commodo ut enim. Praesent eget mi eget enim hendrerit interdum. Ut sit amet orci libero. Vestibulum et leo pretium, semper nisl non, aliquam arcu. Pellentesque malesuada eros a elit imperdiet, sed tempor enim malesuada. Praesent accumsan malesuada eros, in sodales tortor sagittis at. Duis sollicitudin, est sed lobortis semper, felis est hendrerit massa, a tincidunt nulla risus in lectus. Praesent eleifend vestibulum nunc sed mollis. Ut dapibus nisi turpis, id lobortis justo scelerisque vitae. Morbi vel augue in ipsum dignissim aliquet. Vestibulum justo est, venenatis ut massa eu, dignissim vulputate lorem. Morbi porta est quis erat vulputate tristique.
  </div>
</div>

Styleguide 2.3.1
*/
/* 2.4 Leader */
/*
Leader

Styleguide 2.4
*/
/*
Leader

Adds a margin to the top

.leader - Single default line-heigt top-margin (7 rhythms)
.leader--mobile - 12 rhythms top-margin, mobile view only
.leader--tiny - 1 rhythm top-margin
.leader--small - 3 rhythms top-margin
.leader--hero - 20 rhythms top-margin
.leader--giant - 40 rhythms top-margin

markup:
<div class="{$modifiers}">{$modifiers}</div>

Styleguide 2.4.1
*/
.leader--tiny {
  margin-top: 3px; }

.leader--small {
  margin-top: 9px; }

.leader--normal {
  margin-top: 15px; }

.leader, .leader--hero, .leader--giant {
  margin-top: 18px; }

.no-flexbox .leader--ie {
  margin-top: 15px; }

.no-flexbox .leader--ie-l {
  margin-top: 30px; }

@media only screen and (min-width: 64em) {
  .leader {
    margin-top: 30px; }
    .leader--hero {
      margin-top: 60px; }
    .leader--giant {
      margin-top: 120px; }
    .no-flexbox .leader--ie {
      margin-top: 30px; }
    .no-flexbox .leader--ie-l {
      margin-top: 60px; } }

@media only screen and (max-width: 63.9375em) {
  .leader--mobile {
    margin-top: 36px; } }

/*
Leader inside

Adds padding to the top

.leader-inside - Single default line-heigt top-margin (7 rhythms)
.leader-inside--tiny - 1 rhythm top-margin
.leader-inside--small - 3 rhythms top-margin
.leader-inside--hero - 20 rhythms top-margin
.leader-inside--giant - 40 rhythms top-margin

markup:
<div class="{$modifiers}">{$modifiers}</div>

Styleguide 2.4.2
*/
.leader-inside--tiny {
  padding-top: 3px; }

.leader-inside--small {
  padding-top: 9px; }

.leader-inside--normal {
  padding-top: 15px; }

.leader-inside, .leader-inside--hero, .leader-inside--giant {
  padding-top: 18px; }

@media only screen and (min-width: 64em) {
  .leader-inside {
    padding-top: 30px; }
    .leader-inside--hero {
      padding-top: 60px; }
    .leader-inside--giant {
      padding-top: 120px; } }

/* 2.5 Trailer */
/*
Trailer

Styleguide 2.5
*/
/*
Trailer

Adds a bottom margin

.trailer - Ten rhythms bottom-margin
.trailer--tiny - Single rhythm bottom-margin
.trailer--small - Triple rhythms bottom-margin
.trailer--normal - Four rhythms bottom-margin
.trailer--hero - Six rhythms bottom-margin
.trailer--giant - Fourthy rhythm bottom-margin

markup:
<div class="{$modifiers}">{$modifiers}</div>

Styleguide 2.5.1
*/
.trailer--tiny {
  margin-bottom: 3px; }

.trailer--small {
  margin-bottom: 9px; }

.trailer--normal {
  margin-bottom: 15px; }

.trailer, .trailer--hero, .trailer--giant {
  margin-bottom: 18px; }

@media only screen and (min-width: 64em) {
  .trailer {
    margin-bottom: 30px; }
    .trailer--hero {
      margin-bottom: 60px; }
    .trailer--giant {
      margin-bottom: 120px; } }

/*
Trailer inside

Adds bottom padding

.trailer-inside - Single rhythm top-margin
.trailer-inside--tiny - Half rhythm top-margin
.trailer-inside--hero - Double rhythm top-margin
.trailer-inside--giant - Triple rhythm top-margin

markup:
<div class="{$modifiers}">{$modifiers}</div>

Styleguide 2.5.2
*/
.trailer-inside--tiny {
  padding-bottom: 3px; }

.trailer-inside--small {
  padding-bottom: 9px; }

.trailer-inside--normal {
  padding-bottom: 15px; }

.trailer-inside, .trailer-inside--hero, .trailer-inside--giant {
  padding-bottom: 18px; }

@media only screen and (min-width: 64em) {
  .trailer-inside {
    padding-bottom: 30px; }
    .trailer-inside--hero {
      padding-bottom: 60px; }
    .trailer-inside--giant {
      padding-bottom: 120px; } }

/* 2.6 Bleed */
/*
Bleed

Pulls container into its parent's gutter space

.bleed - Negative half gutter-width to either side
.bleed--left - Negative half gutter-width to left side
.bleed--right - Negative half gutter-width to right side

markup:
<div class="{$modifiers}">{$modifiers}</div>

Styleguide 2.6
*/
.bleed {
  margin-left: -15px;
  margin-right: -15px; }
  .bleed--left {
    margin-left: -15px; }
  .bleed--right {
    margin-right: -15px; }

/* 2.7 Grid */
/*
Grid

### Flexbox with inline-block fallback

Display: inline-block; mimics the behaviour of flexbox a bit better than floating elements when you have alternating widths of your grid cells and you want them to stay in line.

If you require your columns to stretch to the full height of your container, use the table and table-cell properties. This will not be a good solution if you want to wrap grid cells on multiple rows but is a good fit if you can control the number of grid cells in a row.

.grid - If flexbox is supported, all children will behave like flex items. If not, children are required to have a `.grid__cell class declared on them.
.grid.grid--stories - When wide enough, the cells will be half the available width.
.grid.grid--musketeers - Stacked on mobile, three on larger breakpoints
.grid.grid--teletubbies - Smaller containers
.grid.grid--posts - Two columns on mobile, four on larger breakpoints
.grid.grid--even - Always 2 columns
.grid.grid--rows - Stacked on mobile, two on larger breakpoints, each row divided with border
.grid.grid--tiles - Stacked on mobile, two on larger breakpoints, three on largest breakpoints
.grid.grid--align-middle - Align content vertically centered
.grid.grid--align-end - Align content to flex end (bottom or right depending on flex direction)
.grid.grid--wide - ?

markup:
<div class="{$modifiers}">
	 <div class="grid__cell">1</div><!--
  --><div class="grid__cell">2<br>lines</div><!--
  --><div class="grid__cell">3</div><!--
  --><div class="grid__cell">4</div><!--
  --><div class="grid__cell">5</div>
</div>

Styleguide 2.7
*/
/*
 * 1. IE Fallback
 */
.grid {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .no-flexbox .grid {
    display: block; }
  .grid__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 100%;
            flex: 0 1 100%;
    max-width: 100%; }
    .grid__cell--stretcher {
      -webkit-box-flex: 0 !important;
         -moz-box-flex: 0 !important;
          -ms-flex: 0 1 100% !important;
              flex: 0 1 100% !important;
      max-width: 100% !important;
      width: 100% !important; }
    .no-flexbox .grid__cell {
      float: left;
      width: 100%; }
  .grid--posts .grid__cell,
  .grid--even .grid__cell {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    max-width: 50%; }
    .no-flexbox .grid--posts .grid__cell, .no-flexbox
    .grid--even .grid__cell {
      width: 50%; }
  .grid--align-middle {
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  .grid--align-end {
    -webkit-box-align: end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end; }
  @media only screen and (min-width: 32.5em) {
    .grid--musketeers .grid__cell,
    .grid--teletubbies .grid__cell {
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%;
      max-width: 50%;
      margin-bottom: 18px; }
      .no-flexbox .grid--musketeers .grid__cell, .no-flexbox
      .grid--teletubbies .grid__cell {
        width: 50%; } }
  @media only screen and (min-width: 37.5em) {
    .grid--tiles .grid__cell {
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%;
      max-width: 50%; }
      .no-flexbox .grid--tiles .grid__cell {
        width: 50%; }
    .grid--rows .grid__cell {
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%;
      max-width: 50%; }
      .no-flexbox .grid--rows .grid__cell {
        width: 50%; }
      .grid--rows .grid__cell .post {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
           -moz-box-orient: vertical;
           -moz-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse; }
        .grid--rows .grid__cell .post .media__figure {
          width: 100%; } }
  @media only screen and (min-width: 48em) {
    .grid--musketeers .grid__cell {
      -ms-flex-preferred-size: 33.33333%;
          flex-basis: 33.33333%;
      max-width: 33.33333%;
      margin-bottom: 0; }
      .no-flexbox .grid--musketeers .grid__cell {
        width: 33.33333%;
        display: inline-block;
        vertical-align: top;
        font-size: 16px;
        float: none; }
    .grid--posts .grid__cell {
      -ms-flex-preferred-size: 25%;
          flex-basis: 25%;
      max-width: 25%; }
      .no-flexbox .grid--posts .grid__cell {
        width: 25%; }
    .grid--ctx .grid__cell {
      -webkit-box-flex: 1;
         -moz-box-flex: 1;
          -ms-flex: 1 0 33.33333%;
              flex: 1 0 33.33333%; } }
  @media only screen and (min-width: 64em) {
    .grid--teletubbies .grid__cell {
      -ms-flex-preferred-size: 25%;
          flex-basis: 25%;
      max-width: 25%;
      margin-bottom: 0; }
      .no-flexbox .grid--teletubbies .grid__cell {
        width: 25%;
        display: inline-block;
        vertical-align: top;
        font-size: 16px;
        float: none; }
      .layout .grid--teletubbies .grid__cell {
        -ms-flex-preferred-size: 50%;
            flex-basis: 50%;
        max-width: 50%;
        margin-bottom: 18px; }
      .no-flexbox .grid--teletubbies .grid__cell {
        width: 50%; }
    .no-flexbox .grid--musketeers {
      font-size: 0; }
    .grid--tiles .grid__cell,
    .grid--stories .grid__cell {
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%;
      max-width: 50%; }
      .no-flexbox .grid--tiles .grid__cell, .no-flexbox
      .grid--stories .grid__cell {
        width: 50%; }
    .grid--rows .grid__cell {
      position: relative;
      margin-top: 45px;
      padding-top: 45px; }
    .grid--rows .grid__cell::before {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 1px;
      background-color: #d7e9ce; }
      .theme--dark .grid--rows .grid__cell::before {
        background-color: #cdcdcd; }
      .theme--green .grid--rows .grid__cell::before {
        background-color: #d7e9ce; }
      .theme--blue .grid--rows .grid__cell::before {
        background-color: #d3eff6; }
      .theme--lime .grid--rows .grid__cell::before {
        background-color: #eff4ca; }
      .theme--yellow .grid--rows .grid__cell::before {
        background-color: #fef3c5; }
      .theme--gold .grid--rows .grid__cell::before {
        background-color: #fae3c8; }
      .theme--orange .grid--rows .grid__cell::before {
        background-color: #f7d7ca; }
      .theme--salmon .grid--rows .grid__cell::before {
        background-color: #fadbd5; }
      .theme--red .grid--rows .grid__cell::before {
        background-color: #fac8c1; }
      .theme--burgundy .grid--rows .grid__cell::before {
        background-color: #edc6c8; }
      .theme--purple .grid--rows .grid__cell::before {
        background-color: #e5cade; }
      .theme--youth .grid--rows .grid__cell::before {
        background-color: #f4dcbd; }
      .theme--digitalisation .grid--rows .grid__cell::before {
        background-color: #e5cac6; }
      .theme--climate .grid--rows .grid__cell::before {
        background-color: #d8ccd5; }
      .theme--gender .grid--rows .grid__cell::before {
        background-color: #bed8cb; }
      .theme--nutrition .grid--rows .grid__cell::before {
        background-color: #cfdcdd; }
      .theme--blog .grid--rows .grid__cell::before {
        background-color: #ffe7bd; }
      .theme--spore-blue .grid--rows .grid__cell::before {
        background-color: #cdd8eb; }
      .theme--spore-brown .grid--rows .grid__cell::before {
        background-color: #dcd0be; }
      .theme--spore-dark-blue .grid--rows .grid__cell::before {
        background-color: #bed1dd; }
      .theme--spore-forest-green .grid--rows .grid__cell::before {
        background-color: #d5debf; }
      .theme--spore-grey-blue .grid--rows .grid__cell::before {
        background-color: #d9e1e6; }
      .theme--spore-light-blue .grid--rows .grid__cell::before {
        background-color: #dce9f3; }
      .theme--spore-lime .grid--rows .grid__cell::before {
        background-color: #edeabd; }
      .theme--spore-ochre .grid--rows .grid__cell::before {
        background-color: #f6e4c6; }
      .theme--spore-olive-green .grid--rows .grid__cell::before {
        background-color: #dce1cd; }
      .theme--spore-red .grid--rows .grid__cell::before {
        background-color: #fcd0c6; }
      .theme--spore-taupe .grid--rows .grid__cell::before {
        background-color: #ddd9d7; }
      .theme--spore-teal .grid--rows .grid__cell::before {
        background-color: #bfdeef; }
    .grid--rows .grid__cell.gutters:nth-child(odd)::before {
      left: 15px; }
    .grid--rows .grid__cell.gutters:nth-child(even)::before {
      right: 15px; } }
  @media only screen and (min-width: 90em) {
    .layout .grid--teletubbies .grid__cell {
      -ms-flex-preferred-size: 25%;
          flex-basis: 25%;
      max-width: 25%;
      margin-bottom: 0; }
    .no-flexbox .grid--teletubbies .grid__cell {
      width: 25%; }
    .grid--wide .grid__cell {
      -ms-flex-preferred-size: 100%;
          flex-basis: 100%;
      width: 100%;
      max-width: 100%; }
      .no-flexbox .grid--wide .grid__cell {
        width: 100%; } }
  @media only screen and (min-width: 100em) {
    .grid--tiles .grid__cell {
      -ms-flex-preferred-size: 33.33333%;
          flex-basis: 33.33333%;
      max-width: 33.33333%; }
      .no-flexbox .grid--tiles .grid__cell {
        width: 33.33333%;
        display: inline-block;
        vertical-align: top;
        font-size: 16px;
        float: none; } }

/* 2.8 Media */
/*
Media Object

Flexbox implementation of Nicole Sullivan's Media Object

.media - Regular media
.media.media--middle - Vertically centered
.media.media--unfold - Folded (stacked) on lt-large-handheld

markup:
<div class="{$modifiers}">
	<div class="media__figure">
		<img src="https://images.unsplash.com/reserve/Lt0DwxdqRKSQkX7439ey_Chaz_fisheye-11.jpg?q=80&fm=jpg&w=50&h=50&fit=crop"/>
	</div>
  <div class="media__body">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris pharetra pellentesque ligula ut feugiat. Nullam elit libero, rutrum eu odio sed, tempus iaculis lectus. Phasellus felis ex, malesuada vitae libero ac, auctor finibus sapien. Sed odio enim, molestie eu pretium sit amet, commodo ut enim. Praesent eget mi eget enim hendrerit interdum. Ut sit amet orci libero. Vestibulum et leo pretium, semper nisl non, aliquam arcu. Pellentesque malesuada eros a elit imperdiet, sed tempor enim malesuada. Praesent accumsan malesuada eros, in sodales tortor sagittis at. Duis sollicitudin, est sed lobortis semper, felis est hendrerit massa, a tincidunt nulla risus in lectus. Praesent eleifend vestibulum nunc sed mollis. Ut dapibus nisi turpis, id lobortis justo scelerisque vitae. Morbi vel augue in ipsum dignissim aliquet. Vestibulum justo est, venenatis ut massa eu, dignissim vulputate lorem. Morbi porta est quis erat vulputate tristique.
	</div>
</div>

Styleguide 2.8
*/
/*
 *
 * 1. IE 10-11 requires a flex-basis value
 *
 */
.media {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%; }
  .no-flexbox .media {
    display: table;
    width: 100%; }
  .media--end {
    -webkit-box-align: end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end; }
  .media__figure {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    /* 1 */ }
  .media__body {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 0 0px;
            flex: 1 0 0;
    /* 1 */
    max-width: 100%;
    /* 1 */ }
    .no-flexbox .media__body {
      overflow: hidden; }
  .no-flexbox .media__figure, .no-flexbox .media__body {
    display: table-cell;
    vertical-align: top; }
  .media__stretcher {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%; }
  .no-flexbox .media__content.media__stretcher {
    float: left; }
  .no-flexbox .media__image {
    float: right; }
  .media--middle {
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
  .media--middle .media__figure,
  .media--middle .media__body {
    vertical-align: middle; }
  .media--reverse .media__figure,
  .media--reverse .media__body {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
       -moz-box-orient: horizontal;
       -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse; }
    .no-flexbox .media--reverse .media__figure, .no-flexbox
    .media--reverse .media__body {
      float: right; }
  .media__content {
    width: 100%; }
    .no-flexbox .media__content {
      display: table-cell; }
  @media only screen and (max-width: 63.9375em) {
    .media--unfold {
      display: block; } }
  @media only screen and (min-width: 48em) {
    .media__aside {
      -ms-flex-preferred-size: 27.77778vw;
          flex-basis: 27.77778vw;
      max-width: 27.77778vw; } }

/* 2.9 Tier */
/*
Tier Group

~DISCONTINUED~
A tier group allows content to be aligned vertically. This implementation relies on Flex, the fallback is a naturally stacked group of elements.
A tier is used in the [`Hero` module - Styleguide 6.9](/#/section/6.9)

markup:
<div class="tier-group">
	<div class="tier">
		I am a top-aligned tier.
	</div>
	<div class="tier tier--align-bottom">
		I am a bottom-aligned tier.
	</div>
</div>

Styleguide 2.9
*/
.tier {
  -webkit-box-flex: 1;
     -moz-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1; }
  .tier--align-bottom {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex-positive: 0;
            flex-grow: 0; }
  .tier-group {
    height: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }

/* 2.10 Stack */
/*
Stack

markup:
<div class="stack">
  <div class="stack__unit">
    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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Donec elementum ligula eu sapien consequat eleifend.  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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Donec elementum ligula eu sapien consequat eleifend. Donec nec
  </div>
  <div class="stack__unit stack stack--stacked">
      <div class="stack__unit">
        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 nisi ut aliquip ex ea commodo consequat.
      </div>
      <div class="stack__unit stack__pin">
        Sec
      </div>
  </div>
</div>

Styleguide 2.10
*/
/*
 *
 * 1. IE 10-11 requires a flex-basis value
 *
 */
.stack {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
     -moz-box-orient: horizontal;
     -moz-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row; }
  .stack--left-25 {
    margin-left: 25%; }
  .no-flexbox .stack {
    display: table; }
  .stack__unit {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto; }
    .no-flexbox .stack__unit {
      display: table-cell;
      vertical-align: top; }
  .stack__pin {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    /* 1 */
    -ms-flex-line-pack: end;
        align-content: flex-end; }
  .stack__pin + .stack__pin {
    margin-left: 20px; }
  .stack--stacked,
  .stack--stacked > .stack__unit {
    width: 100%; }
  .stack--stacked {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
  .no-flexbox .stack--stacked > .stack__unit {
    display: table-row; }

/* 2.11 Clear */
/*
Clear

Clearfix reloaded (http://cssmojo.com/the-very-latest-clearfix-reloaded/)

Styleguide 2.11
*/
.clear, .no-flexbox .layout, .no-flexbox .grid, .no-flexbox .media, .no-flexbox .publication-grid {
  /**
  * For IE 6/7 only
  */ }
  .clear::before, .no-flexbox .layout::before, .no-flexbox .grid::before, .no-flexbox .media::before, .no-flexbox .publication-grid::before, .clear::after, .no-flexbox .layout::after, .no-flexbox .grid::after, .no-flexbox .media::after, .no-flexbox .publication-grid::after {
    content: " ";
    display: table; }
  .clear::after, .no-flexbox .layout::after, .no-flexbox .grid::after, .no-flexbox .media::after, .no-flexbox .publication-grid::after {
    clear: both; }

/* 2.12 Debug */
/*
Debug

Styleguide 2.12
*/
.debug-grid,
.debug-layout {
  position: relative; }
  .debug-grid::before,
  .debug-layout::before {
    pointer-events: none;
    content: "";
    display: block;
    position: absolute;
    z-index: 10;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    background-repeat: repeat-x;
    background-position: 0 0;
    -moz-background-size: 16.66667vw 100%;
         background-size: 16.66667vw 100%;
    background-image: -webkit-linear-gradient(left, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 15px, transparent 15px, transparent 100vw), -webkit-linear-gradient(right, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 15px, transparent 15px, transparent 100vw), -webkit-linear-gradient(right, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw);
    background-image: -moz- oldlinear-gradient(left, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 15px, transparent 15px, transparent 100vw), -moz- oldlinear-gradient(right, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 15px, transparent 15px, transparent 100vw), -moz- oldlinear-gradient(right, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw);
    background-image: linear-gradient(to right, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 15px, transparent 15px, transparent 100vw), linear-gradient(to left, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 15px, transparent 15px, transparent 100vw), linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw); }
  @media only screen and (min-width: 48em) {
    .debug-grid::before,
    .debug-layout::before {
      -moz-background-size: 8.33333vw 100%;
           background-size: 8.33333vw 100%;
      background-image: -webkit-linear-gradient(left, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 15px, transparent 15px, transparent 100vw), -webkit-linear-gradient(right, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 15px, transparent 15px, transparent 100vw), -webkit-linear-gradient(right, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw);
      background-image: -moz- oldlinear-gradient(left, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 15px, transparent 15px, transparent 100vw), -moz- oldlinear-gradient(right, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 15px, transparent 15px, transparent 100vw), -moz- oldlinear-gradient(right, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw);
      background-image: linear-gradient(to right, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 15px, transparent 15px, transparent 100vw), linear-gradient(to left, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 15px, transparent 15px, transparent 100vw), linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw); } }
  @media only screen and (min-width: 64em) {
    .debug-grid::before,
    .debug-layout::before {
      -moz-background-size: 5.55556vw 100%;
           background-size: 5.55556vw 100%;
      background-image: -webkit-linear-gradient(left, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 15px, transparent 15px, transparent 100vw), -webkit-linear-gradient(right, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 15px, transparent 15px, transparent 100vw), -webkit-linear-gradient(right, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw);
      background-image: -moz- oldlinear-gradient(left, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 15px, transparent 15px, transparent 100vw), -moz- oldlinear-gradient(right, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 15px, transparent 15px, transparent 100vw), -moz- oldlinear-gradient(right, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw);
      background-image: linear-gradient(to right, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 15px, transparent 15px, transparent 100vw), linear-gradient(to left, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 15px, transparent 15px, transparent 100vw), linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100vw); } }

@media only screen and (min-width: 48em) {
  .debug-grid,
  .debug-rhythm {
    background-image: -webkit-linear-gradient(rgba(61, 61, 61, 0.05) 50%, transparent 50%);
    background-image: -moz- oldlinear-gradient(rgba(61, 61, 61, 0.05) 50%, transparent 50%);
    background-image: linear-gradient(rgba(61, 61, 61, 0.05) 50%, transparent 50%);
    -moz-background-size: 6px 6px;
         background-size: 6px 6px; } }

@media only screen and (min-width: 64em) {
  .debug-grid,
  .debug-rhythm {
    background-image: -webkit-linear-gradient(rgba(61, 61, 61, 0.05) 50%, transparent 50%);
    background-image: -moz- oldlinear-gradient(rgba(61, 61, 61, 0.05) 50%, transparent 50%);
    background-image: linear-gradient(rgba(61, 61, 61, 0.05) 50%, transparent 50%);
    -moz-background-size: 6px 6px;
         background-size: 6px 6px; } }

.debug-grid,
.debug-breakpoint {
  position: relative; }
  .debug-grid::after,
  .debug-breakpoint::after {
    position: fixed;
    z-index: 10;
    top: 6px;
    left: 6px;
    display: inline-block;
    padding: 6px;
    background: rgba(255, 255, 255, 0.9);
    color: #3d3d3d;
    font-size: small;
    content: "no breakpoint, columns: 6";
    border: 2px solid #e61284; }
  @media only screen and (min-width: 48em) {
    .debug-grid::after,
    .debug-breakpoint::after {
      content: "(min-width: 48em), columns: 12";
      border: 2px solid #00e6e6; } }
  @media only screen and (min-width: 64em) {
    .debug-grid::after,
    .debug-breakpoint::after {
      content: "(min-width: 64em), columns: 18";
      border: 2px solid #5c2e8a; } }

.debug-grid::before, .debug-layout::before, .section-markup-wrapper::before {
  position: fixed; }

/* 2.13 Spreader */
/*
 * Spreads elements across available space
 */
@media only screen and (min-width: 48em) {
  .spreader {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start; }
    .spreader__item {
      position: relative;
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 50%;
              flex: 0 50%; } }

@media only screen and (min-width: 64em) {
  .spreader--3 .spreader__item:nth-child(odd),
  .spreader--4 .spreader__item:nth-child(odd) {
    top: -15px; }
  .spreader--3 .spreader__item:nth-child(even),
  .spreader--4 .spreader__item:nth-child(even) {
    top: 45px; } }

@media only screen and (min-width: 64em) and (min-width: 0\0) {
  .spreader--3 .spreader__item:nth-child(even), .spreader--3 .spreader__item:nth-child(odd),
  .spreader--4 .spreader__item:nth-child(even),
  .spreader--4 .spreader__item:nth-child(odd) {
    top: 0\0; } }

@media only screen and (min-width: 64em) {
  .spreader--5 .spreader__item:nth-child(odd) {
    top: -52.5px; }
  .spreader--5 .spreader__item:nth-child(even) {
    top: 52.5px; } }

@media only screen and (min-width: 64em) and (min-width: 0\0) {
  .spreader--5 .spreader__item:nth-child(even), .spreader--5 .spreader__item:nth-child(odd) {
    top: 0\0; } }

/* 2.14 Trellis */
/*
Trellis

.trellis - Flex layout with 6 containers
.trellis.trellis--l - Flex layout with 3 containers

markup:
<div class="{$modifiers}">
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
	<div class="trellis__cell  |  gutters">
		<img src="https://source.unsplash.com/random" />
	</div>
</div>

Styleguide 2.14
*/
.trellis {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .trellis__cell,
  .trellis--l .trellis__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 33.33333%;
            flex: 0 1 33.33333%;
    max-width: 33.33333%; }
    .no-flexbox .trellis__cell, .no-flexbox
    .trellis--l .trellis__cell {
      float: left;
      width: 33.33333%; }
  .trellis__topic .trellis__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 50%;
            flex: 0 1 50%;
    max-width: 50%; }
    .no-flexbox .trellis__topic .trellis__cell {
      float: left;
      width: 50%; }
  @media only screen and (min-width: 48em) {
    .trellis__cell {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 1 16.66667%;
              flex: 0 1 16.66667%;
      max-width: 16.66667%; }
      .no-flexbox .trellis__cell {
        width: 16.66667%; }
    .trellis--l .trellis__cell trellis__cell {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 1 33.33333%;
              flex: 0 1 33.33333%;
      max-width: 33.33333%; }
      .no-flexbox .trellis--l .trellis__cell trellis__cell {
        width: 33.33333%; } }
  @media only screen and (min-width: 64em) {
    .trellis--l .trellis__cell {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 1 25%;
              flex: 0 1 25%;
      max-width: 25%; }
      .no-flexbox .trellis--l .trellis__cell {
        width: 25%; } }

/* 4. */
/*
Blocks

Styleguide 4.0
*/
/* 4.1 Menu */
/*
Menu

The *Menu* block is used in navigational elements.

When used with a list element, the list element will need to be reset using the reset class.

.menu.menu--responsive - Horizontal menu
.menu.menu--stacked.menu--responsive - Vertical menu
.menu.menu--secondary.menu--responsive - Vertical menu

markup:
<ul class="{$modifiers}">
  <li><a class="menu__item" href="javascript:void();">Agribusiness</a></li>
  <li><a class="menu__item" href="javascript:void();">ICTS for agriculture</a></li>
  <li><a class="menu__item" href="javascript:void();">Climate resilient agriculture</a></li>
  <li><a class="menu__item" href="javascript:void();">Events</a></li>
  <li><a class="menu__item" href="javascript:void();">Projects</a></li>
</ul>

sg-wrapper:
<div style="height: 250px";>
  <sg-wrapper-content/>
</div>

Styleguide 4.1
*/
.menu__item, .menu-toggle {
  display: inline-block;
  padding: 6px 15px;
  font-size: 12px;
  line-height: 18px;
  text-decoration: none;
  color: #3d3d3d; }

.menu__social-icons {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: inherit;
  text-align: center; }
  .menu__social-icons .icon, .menu__social-icons .list--take-aways li:before, .list--take-aways .menu__social-icons li:before, .menu__social-icons .list--theme li:before, .list--theme .menu__social-icons li:before, .menu__social-icons .filter__trigger:after, .menu__social-icons .block-link--icon:before, .menu__social-icons .panel.is-inactive .panel__trigger:after, .panel.is-inactive .menu__social-icons .panel__trigger:after, .menu__social-icons .tail__lengthen:before, .menu__social-icons .tail__lengthen:after, .menu__social-icons .tail__shorten:before, .menu__social-icons .tail__shorten:after {
    vertical-align: baseline;
    line-height: 36px;
    font-size: 1.5em;
    padding: 0 15px; }

.menu--stacked .menu__item, .menu--stacked .menu-toggle {
  display: block; }

.menu--footer {
  text-align: right; }

.menu--footer .menu__item, .menu--footer .menu-toggle {
  border-right: 1px solid #3d3d3d; }
  .menu--footer .menu__item:hover, .menu--footer .menu-toggle:hover {
    color: #95c47b; }

.menu--footer li:last-child .menu__item, .menu--footer li:last-child .menu-toggle {
  border-right: 0; }

@media only screen and (min-width: 64em) {
  .menu__item, .menu-toggle {
    padding: 10.5px 15px;
    font-size: 0.875em;
    line-height: 18px;
    color: #fff; }
  .menu--secondary .menu__item, .menu--secondary .menu-toggle {
    padding: 0 15px; }
  .menu__social-icons {
    display: none; } }

@media only screen and (min-width: 90em) {
  .network-navigation .menu,
  .network-navigation .menu__social-icons {
    display: inline-block; }
  .menu__social-icons {
    position: static;
    vertical-align: top;
    padding: 0 2em;
    float: right; }
    .menu__social-icons .icon, .menu__social-icons .list--take-aways li:before, .list--take-aways .menu__social-icons li:before, .menu__social-icons .list--theme li:before, .list--theme .menu__social-icons li:before, .menu__social-icons .filter__trigger:after, .menu__social-icons .block-link--icon:before, .menu__social-icons .panel.is-inactive .panel__trigger:after, .panel.is-inactive .menu__social-icons .panel__trigger:after, .menu__social-icons .tail__lengthen:before, .menu__social-icons .tail__lengthen:after, .menu__social-icons .tail__shorten:before, .menu__social-icons .tail__shorten:after {
      vertical-align: middle;
      padding: 0 6px;
      font-size: 15px;
      line-height: 39px; } }

/*
Menu

The *Menu* block is used in navigational elements.

When used with a list element, the list element will need to be reset using the reset class.

markup:
<div class="is-heir is-inactive is-conducive media__stretcher" id="network-navigation">
  <button class="menu-toggle" data-toggle="network-navigation">CTA <span data-icon=""></span></button>
  <ul class="fx menu menu--responsive">
    <li><a class="menu__item" href="javascript:void();">Home</a></li>
    <li><a class="menu__item" href="javascript:void();">About CTA</a></li>
    <li><a class="menu__item" href="javascript:void();">Contact</a></li>
    <li><a class="menu__item" href="javascript:void();">Working with CTA</a></li>
    <li><a class="menu__item" href="javascript:void();">Publications</a></li>
    <li><a class="menu__item" href="javascript:void();">Spore</a></li>
    <li><a class="menu__item" href="javascript:void();">ICT Update</a></li>
    <li><a class="menu__item" href="javascript:void();">Press</a></li>
  </ul>
</div>

sg-wrapper:
<nav class="network-navigation">
<sg-wrapper-content/>
</nav>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris pharetra pellentesque ligula ut feugiat. Nullam elit libero, rutrum eu odio sed, tempus iaculis lectus. Phasellus felis ex, malesuada vitae libero ac, auctor finibus sapien. Sed odio enim, molestie eu pretium sit amet, commodo ut enim. Praesent eget mi eget enim hendrerit interdum. Ut sit amet orci libero. Vestibulum et leo pretium, semper nisl non, aliquam arcu. Pellentesque malesuada eros a elit imperdiet, sed tempor enim malesuada. Praesent accumsan malesuada eros, in sodales tortor sagittis at. Duis sollicitudin, est sed lobortis semper, felis est hendrerit massa, a tincidunt nulla risus in lectus. Praesent eleifend vestibulum nunc sed mollis. Ut dapibus nisi turpis, id lobortis justo scelerisque vitae. Morbi vel augue in ipsum dignissim aliquet. Vestibulum justo est, venenatis ut massa eu, dignissim vulputate lorem. Morbi porta est quis erat vulputate tristique.</p>
<script>
jQuery("document").ready(function($){
    $("[data-toggle]").toggle();
});
</script>

Styleguide 4.1.1
*/
.menu-toggle {
  position: relative;
  padding: 6px 15px;
  border: 0;
  background-color: #3d3d3d; }

.menu:hover .menu-toggle:after {
  display: none; }

.menu--responsive {
  position: absolute;
  z-index: 3;
  background: #3d3d3d; }

.is-inactive .menu--responsive .menu__item, .is-inactive .menu--responsive .menu-toggle,
.is-active .menu--responsive .menu__item,
.is-active .menu--responsive .menu-toggle,
.is-current .menu--responsive .menu__item,
.is-current .menu--responsive .menu-toggle {
  display: block; }

.is-inactive .menu--responsive {
  min-height: 0;
  height: 0;
  overflow: hidden; }

.is-active .menu--responsive,
.is-current .menu--responsive, .menu--responsive:hover, .menu-toggle:hover + .menu--responsive {
  min-height: 30px;
  height: auto; }

@media only screen and (min-width: 64em) {
  .menu-toggle {
    display: none; }
  .is-inactive .menu--responsive .menu__item, .is-inactive .menu--responsive .menu-toggle,
  .is-active .menu--responsive .menu__item,
  .is-active .menu--responsive .menu-toggle,
  .is-current .menu--responsivie .menu__item,
  .is-current .menu--responsivie .menu-toggle {
    display: inline-block; }
  .is-inactive .menu--responsive,
  .is-active .menu--responsive,
  .is-current .menu--responsive {
    position: static;
    height: auto; } }

/* 4.2 Network Navigation */
/*
Network Navigation

A navigation bar that holds CTA-wide navigation. The Networks Navigation bar is the smame accross all websites.

Add .is-active class to current page

markup:
<nav class="network-navigation media wings">
  <sg-insert>4.1.1-1</sg-insert>
  <sg-insert>4.5-1</sg-insert>
</nav>

Styleguide 4.2
*/
.network-navigation {
  position: relative;
  color: rgba(255, 255, 255, 0.8);
  background-color: #3d3d3d;
  letter-spacing: .1em; }
  .network-navigation a,
  .network-navigation button {
    font-weight: 300;
    font-size: 0.75em;
    color: rgba(255, 255, 255, 0.8); }
  .network-navigation .menu__item.is-active, .network-navigation .is-active.menu-toggle,
  .network-navigation .menu__item.is-current,
  .network-navigation .is-current.menu-toggle {
    color: #fff;
    font-weight: 600; }
  .network-navigation .menu__item.is-active:hover, .network-navigation .is-active.menu-toggle:hover,
  .network-navigation .menu__item.is-active:active,
  .network-navigation .is-active.menu-toggle:active,
  .network-navigation .menu__item.is-current:hover,
  .network-navigation .is-current.menu-toggle:hover,
  .network-navigation .menu__item.is-current:active,
  .network-navigation .is-current.menu-toggle:active,
  .network-navigation a:hover,
  .network-navigation a:active,
  .network-navigation a:visited {
    color: #fff; }
  @media only screen and (min-width: 64em) {
    .network-navigation,
    .network-navigation > div {
      height: 39px; } }

/* 4.3 Site Navigation */
/*
Site Navigation

The website's primary navigation. This navigation bar is contextual to the website.

.site-navigation - Fallback state, menu items are all visible but floated
.site-navigation.is-inactive - Rested state, applies to smallest viewports only
.site-navigation.is-active - Active state, applies to smallest viewports only
.site-navigation.site-navigation--network - Hidden menu items, only shows brand icon

markup:
<nav class="{$modifiers} wings">
  <a class="site-navigation__brand--cta gutters" href="javascript:void();">
    <figure class="brand--cta"><figcaption class="is-narrative">CTA Homepage</figcaption></figure>
  </a>
  <div class="site-navigation__nav">
    <ul class="list--inline menu site-navigation__menu">
      <li><a class="menu__item" href="javascript:void();">Agribusiness</a></li>
      <li><a class="menu__item" href="javascript:void();">ICTS for agriculture</a></li>
      <li><a class="menu__item" href="javascript:void();">Climate resilient agriculture</a></li>
      <li><a class="menu__item" href="javascript:void();">Events</a></li>
      <li><a class="menu__item" href="javascript:void();">Projects</a></li>
    </ul>
    <div class="site-navigation__browse gutters">
      <sg-insert>4.4-1</sg-insert>
      <ul class="list--inline menu menu--secondary site-navigation__menu">
        <li><a class="menu__item" href="javascript:void();">Programmes</a></li>
        <li><a class="menu__item" href="javascript:void();">Regions</a></li>
        <li><a class="menu__item" href="javascript:void();">Topics</a></li>
      </ul>
    </div>
  </div>
</nav>

Styleguide 4.3
*/
.site-navigation {
  position: relative;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.8);
  padding-top: 30px;
  font-weight: 600;
  letter-spacing: .01em; }
  .site-navigation--network {
    margin-bottom: -108px;
    background: transparent; }
  .site-navigation--network .site-navigation__nav {
    visibility: hidden; }
  .site-navigation, .site-navigation__nav {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; }
    .no-flexbox .site-navigation, .no-flexbox .site-navigation__nav {
      /**
  * For IE 6/7 only
  */ }
      .no-flexbox .site-navigation::before, .no-flexbox .site-navigation::after, .no-flexbox .site-navigation__nav::before, .no-flexbox .site-navigation__nav::after {
        content: " ";
        display: table; }
      .no-flexbox .site-navigation::after, .no-flexbox .site-navigation__nav::after {
        clear: both; }
  .site-navigation__nav {
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    overflow: hidden; }
  .site-navigation__nav, .site-navigation__menu {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
    white-space: nowrap; }
    .site-navigation__nav li, .site-navigation__menu li {
      display: inline-block; }
  .no-flexbox .site-navigation__brand--cta {
    float: left; }
  .site-navigation__brand--spore {
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .site-navigation__brand--cta,
  .site-navigation .menu__item,
  .site-navigation .menu-toggle {
    position: relative;
    z-index: 1; }
  .site-navigation__menu a, .site-navigation__browse a {
    font-weight: 600; }
    .site-navigation__menu a, .site-navigation__menu a:visited, .site-navigation__browse a, .site-navigation__browse a:visited {
      color: #575757; }
    .site-navigation__menu a:hover, .site-navigation__menu a:active, .site-navigation__browse a:hover, .site-navigation__browse a:active {
      color: #000; }
    .site-navigation__menu a.is-current, .site-navigation__menu a.is-active, .site-navigation__browse a.is-current, .site-navigation__browse a.is-active {
      color: #67ab43; }
      .site-navigation__menu a.is-current.theme--dark,
      .theme--dark .site-navigation__menu a.is-current,
      .theme .theme.theme--dark .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--dark,
      .theme--dark .site-navigation__menu a.is-active,
      .theme .theme.theme--dark .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--dark,
      .theme--dark .site-navigation__browse a.is-current,
      .theme .theme.theme--dark .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--dark,
      .theme--dark .site-navigation__browse a.is-active,
      .theme .theme.theme--dark .site-navigation__browse a.is-active {
        color: #3d3d3d; }
      .site-navigation__menu a.is-current.theme--green,
      .theme--green .site-navigation__menu a.is-current,
      .theme .theme.theme--green .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--green,
      .theme--green .site-navigation__menu a.is-active,
      .theme .theme.theme--green .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--green,
      .theme--green .site-navigation__browse a.is-current,
      .theme .theme.theme--green .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--green,
      .theme--green .site-navigation__browse a.is-active,
      .theme .theme.theme--green .site-navigation__browse a.is-active {
        color: #67ab43; }
      .site-navigation__menu a.is-current.theme--blue,
      .theme--blue .site-navigation__menu a.is-current,
      .theme .theme.theme--blue .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--blue,
      .theme--blue .site-navigation__menu a.is-active,
      .theme .theme.theme--blue .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--blue,
      .theme--blue .site-navigation__browse a.is-current,
      .theme .theme.theme--blue .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--blue,
      .theme--blue .site-navigation__browse a.is-active,
      .theme .theme.theme--blue .site-navigation__browse a.is-active {
        color: #56c0dd; }
      .site-navigation__menu a.is-current.theme--lime,
      .theme--lime .site-navigation__menu a.is-current,
      .theme .theme.theme--lime .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--lime,
      .theme--lime .site-navigation__menu a.is-active,
      .theme .theme.theme--lime .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--lime,
      .theme--lime .site-navigation__browse a.is-current,
      .theme .theme.theme--lime .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--lime,
      .theme--lime .site-navigation__browse a.is-active,
      .theme .theme.theme--lime .site-navigation__browse a.is-active {
        color: #c1d435; }
      .site-navigation__menu a.is-current.theme--yellow,
      .theme--yellow .site-navigation__menu a.is-current,
      .theme .theme.theme--yellow .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--yellow,
      .theme--yellow .site-navigation__menu a.is-active,
      .theme .theme.theme--yellow .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--yellow,
      .theme--yellow .site-navigation__browse a.is-current,
      .theme .theme.theme--yellow .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--yellow,
      .theme--yellow .site-navigation__browse a.is-active,
      .theme .theme.theme--yellow .site-navigation__browse a.is-active {
        color: #facf21; }
      .site-navigation__menu a.is-current.theme--gold,
      .theme--gold .site-navigation__menu a.is-current,
      .theme .theme.theme--gold .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--gold,
      .theme--gold .site-navigation__menu a.is-active,
      .theme .theme.theme--gold .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--gold,
      .theme--gold .site-navigation__browse a.is-current,
      .theme .theme.theme--gold .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--gold,
      .theme--gold .site-navigation__browse a.is-active,
      .theme .theme.theme--gold .site-navigation__browse a.is-active {
        color: #eb942c; }
      .site-navigation__menu a.is-current.theme--orange,
      .theme--orange .site-navigation__menu a.is-current,
      .theme .theme.theme--orange .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--orange,
      .theme--orange .site-navigation__menu a.is-active,
      .theme .theme.theme--orange .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--orange,
      .theme--orange .site-navigation__browse a.is-current,
      .theme .theme.theme--orange .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--orange,
      .theme--orange .site-navigation__browse a.is-active,
      .theme .theme.theme--orange .site-navigation__browse a.is-active {
        color: #e26435; }
      .site-navigation__menu a.is-current.theme--salmon,
      .theme--salmon .site-navigation__menu a.is-current,
      .theme .theme.theme--salmon .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--salmon,
      .theme--salmon .site-navigation__menu a.is-active,
      .theme .theme.theme--salmon .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--salmon,
      .theme--salmon .site-navigation__browse a.is-current,
      .theme .theme.theme--salmon .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--salmon,
      .theme--salmon .site-navigation__browse a.is-active,
      .theme .theme.theme--salmon .site-navigation__browse a.is-active {
        color: #eb735d; }
      .site-navigation__menu a.is-current.theme--red,
      .theme--red .site-navigation__menu a.is-current,
      .theme .theme.theme--red .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--red,
      .theme--red .site-navigation__menu a.is-active,
      .theme .theme.theme--red .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--red,
      .theme--red .site-navigation__browse a.is-current,
      .theme .theme.theme--red .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--red,
      .theme--red .site-navigation__browse a.is-active,
      .theme .theme.theme--red .site-navigation__browse a.is-active {
        color: #ec2d10; }
      .site-navigation__menu a.is-current.theme--burgundy,
      .theme--burgundy .site-navigation__menu a.is-current,
      .theme .theme.theme--burgundy .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--burgundy,
      .theme--burgundy .site-navigation__menu a.is-active,
      .theme .theme.theme--burgundy .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--burgundy,
      .theme--burgundy .site-navigation__browse a.is-current,
      .theme .theme.theme--burgundy .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--burgundy,
      .theme--burgundy .site-navigation__browse a.is-active,
      .theme .theme.theme--burgundy .site-navigation__browse a.is-active {
        color: #ba222a; }
      .site-navigation__menu a.is-current.theme--purple,
      .theme--purple .site-navigation__menu a.is-current,
      .theme .theme.theme--purple .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--purple,
      .theme--purple .site-navigation__menu a.is-active,
      .theme .theme.theme--purple .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--purple,
      .theme--purple .site-navigation__browse a.is-current,
      .theme .theme.theme--purple .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--purple,
      .theme--purple .site-navigation__browse a.is-active,
      .theme .theme.theme--purple .site-navigation__browse a.is-active {
        color: #9b3381; }
      .site-navigation__menu a.is-current.theme--youth,
      .theme--youth .site-navigation__menu a.is-current,
      .theme .theme.theme--youth .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--youth,
      .theme--youth .site-navigation__menu a.is-active,
      .theme .theme.theme--youth .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--youth,
      .theme--youth .site-navigation__browse a.is-current,
      .theme .theme.theme--youth .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--youth,
      .theme--youth .site-navigation__browse a.is-active,
      .theme .theme.theme--youth .site-navigation__browse a.is-active {
        color: #d57800; }
      .site-navigation__menu a.is-current.theme--digitalisation,
      .theme--digitalisation .site-navigation__menu a.is-current,
      .theme .theme.theme--digitalisation .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--digitalisation,
      .theme--digitalisation .site-navigation__menu a.is-active,
      .theme .theme.theme--digitalisation .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--digitalisation,
      .theme--digitalisation .site-navigation__browse a.is-current,
      .theme .theme.theme--digitalisation .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--digitalisation,
      .theme--digitalisation .site-navigation__browse a.is-active,
      .theme .theme.theme--digitalisation .site-navigation__browse a.is-active {
        color: #9a3324; }
      .site-navigation__menu a.is-current.theme--climate,
      .theme--climate .site-navigation__menu a.is-current,
      .theme .theme.theme--climate .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--climate,
      .theme--climate .site-navigation__menu a.is-active,
      .theme .theme.theme--climate .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--climate,
      .theme--climate .site-navigation__browse a.is-current,
      .theme .theme.theme--climate .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--climate,
      .theme--climate .site-navigation__browse a.is-active,
      .theme .theme.theme--climate .site-navigation__browse a.is-active {
        color: #693c5e; }
      .site-navigation__menu a.is-current.theme--gender,
      .theme--gender .site-navigation__menu a.is-current,
      .theme .theme.theme--gender .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--gender,
      .theme--gender .site-navigation__menu a.is-active,
      .theme .theme.theme--gender .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--gender,
      .theme--gender .site-navigation__browse a.is-current,
      .theme .theme.theme--gender .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--gender,
      .theme--gender .site-navigation__browse a.is-active,
      .theme .theme.theme--gender .site-navigation__browse a.is-active {
        color: #046a38; }
      .site-navigation__menu a.is-current.theme--nutrition,
      .theme--nutrition .site-navigation__menu a.is-current,
      .theme .theme.theme--nutrition .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--nutrition,
      .theme--nutrition .site-navigation__menu a.is-active,
      .theme .theme.theme--nutrition .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--nutrition,
      .theme--nutrition .site-navigation__browse a.is-current,
      .theme .theme.theme--nutrition .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--nutrition,
      .theme--nutrition .site-navigation__browse a.is-active,
      .theme .theme.theme--nutrition .site-navigation__browse a.is-active {
        color: #487a7b; }
      .site-navigation__menu a.is-current.theme--blog,
      .theme--blog .site-navigation__menu a.is-current,
      .theme .theme.theme--blog .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--blog,
      .theme--blog .site-navigation__menu a.is-active,
      .theme .theme.theme--blog .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--blog,
      .theme--blog .site-navigation__browse a.is-current,
      .theme .theme.theme--blog .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--blog,
      .theme--blog .site-navigation__browse a.is-active,
      .theme .theme.theme--blog .site-navigation__browse a.is-active {
        color: #ffa300; }
      .site-navigation__menu a.is-current.theme--spore-blue,
      .theme--spore-blue .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-blue .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-blue,
      .theme--spore-blue .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-blue .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-blue,
      .theme--spore-blue .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-blue .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-blue,
      .theme--spore-blue .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-blue .site-navigation__browse a.is-active {
        color: #3f68b1; }
      .site-navigation__menu a.is-current.theme--spore-brown,
      .theme--spore-brown .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-brown .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-brown,
      .theme--spore-brown .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-brown .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-brown,
      .theme--spore-brown .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-brown .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-brown,
      .theme--spore-brown .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-brown .site-navigation__browse a.is-active {
        color: #774b04; }
      .site-navigation__menu a.is-current.theme--spore-dark-blue,
      .theme--spore-dark-blue .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-dark-blue .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-dark-blue,
      .theme--spore-dark-blue .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-dark-blue .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-dark-blue,
      .theme--spore-dark-blue .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-dark-blue .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-dark-blue,
      .theme--spore-dark-blue .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-dark-blue .site-navigation__browse a.is-active {
        color: #044e7e; }
      .site-navigation__menu a.is-current.theme--spore-forest-green,
      .theme--spore-forest-green .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-forest-green .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-forest-green,
      .theme--spore-forest-green .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-forest-green .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-forest-green,
      .theme--spore-forest-green .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-forest-green .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-forest-green,
      .theme--spore-forest-green .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-forest-green .site-navigation__browse a.is-active {
        color: #5f810a; }
      .site-navigation__menu a.is-current.theme--spore-grey-blue,
      .theme--spore-grey-blue .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-grey-blue .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-grey-blue,
      .theme--spore-grey-blue .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-grey-blue .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-grey-blue,
      .theme--spore-grey-blue .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-grey-blue .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-grey-blue,
      .theme--spore-grey-blue .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-grey-blue .site-navigation__browse a.is-active {
        color: #6d8c9f; }
      .site-navigation__menu a.is-current.theme--spore-light-blue,
      .theme--spore-light-blue .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-light-blue .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-light-blue,
      .theme--spore-light-blue .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-light-blue .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-light-blue,
      .theme--spore-light-blue .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-light-blue .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-light-blue,
      .theme--spore-light-blue .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-light-blue .site-navigation__browse a.is-active {
        color: #79accf; }
      .site-navigation__menu a.is-current.theme--spore-lime,
      .theme--spore-lime .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-lime .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-lime,
      .theme--spore-lime .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-lime .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-lime,
      .theme--spore-lime .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-lime .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-lime,
      .theme--spore-lime .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-lime .site-navigation__browse a.is-active {
        color: #bbae03; }
      .site-navigation__menu a.is-current.theme--spore-ochre,
      .theme--spore-ochre .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-ochre .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-ochre,
      .theme--spore-ochre .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-ochre .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-ochre,
      .theme--spore-ochre .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-ochre .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-ochre,
      .theme--spore-ochre .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-ochre .site-navigation__browse a.is-active {
        color: #db9623; }
      .site-navigation__menu a.is-current.theme--spore-olive-green,
      .theme--spore-olive-green .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-olive-green .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-olive-green,
      .theme--spore-olive-green .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-olive-green .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-olive-green,
      .theme--spore-olive-green .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-olive-green .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-olive-green,
      .theme--spore-olive-green .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-olive-green .site-navigation__browse a.is-active {
        color: #778d3e; }
      .site-navigation__menu a.is-current.theme--spore-red,
      .theme--spore-red .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-red .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-red,
      .theme--spore-red .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-red .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-red,
      .theme--spore-red .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-red .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-red,
      .theme--spore-red .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-red .site-navigation__browse a.is-active {
        color: #f54c23; }
      .site-navigation__menu a.is-current.theme--spore-taupe,
      .theme--spore-taupe .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-taupe .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-taupe,
      .theme--spore-taupe .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-taupe .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-taupe,
      .theme--spore-taupe .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-taupe .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-taupe,
      .theme--spore-taupe .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-taupe .site-navigation__browse a.is-active {
        color: #7b6d65; }
      .site-navigation__menu a.is-current.theme--spore-teal,
      .theme--spore-teal .site-navigation__menu a.is-current,
      .theme .theme.theme--spore-teal .site-navigation__menu a.is-current, .site-navigation__menu a.is-active.theme--spore-teal,
      .theme--spore-teal .site-navigation__menu a.is-active,
      .theme .theme.theme--spore-teal .site-navigation__menu a.is-active, .site-navigation__browse a.is-current.theme--spore-teal,
      .theme--spore-teal .site-navigation__browse a.is-current,
      .theme .theme.theme--spore-teal .site-navigation__browse a.is-current, .site-navigation__browse a.is-active.theme--spore-teal,
      .theme--spore-teal .site-navigation__browse a.is-active,
      .theme .theme.theme--spore-teal .site-navigation__browse a.is-active {
        color: #077fc1; }
  .site-navigation__demoted {
    position: relative; }
    .site-navigation__demoted ul {
      position: absolute;
      right: 0;
      height: 0;
      max-height: 0;
      overflow: hidden; }
      @media only screen and (max-width: 32.4375em) {
        .site-navigation__demoted ul {
          right: 9px; } }
  .site-navigation__demoted.is-active .icon, .site-navigation__demoted.is-active .list--take-aways li:before, .list--take-aways .site-navigation__demoted.is-active li:before, .site-navigation__demoted.is-active .list--theme li:before, .list--theme .site-navigation__demoted.is-active li:before, .site-navigation__demoted.is-active .filter__trigger:after, .site-navigation__demoted.is-active .block-link--icon:before, .site-navigation__demoted.is-active .panel.is-inactive .panel__trigger:after, .panel.is-inactive .site-navigation__demoted.is-active .panel__trigger:after, .site-navigation__demoted.is-active .tail__lengthen:before, .site-navigation__demoted.is-active .tail__lengthen:after, .site-navigation__demoted.is-active .tail__shorten:before, .site-navigation__demoted.is-active .tail__shorten:after, .site-navigation__demoted.is-current .icon, .site-navigation__demoted.is-current .list--take-aways li:before, .list--take-aways .site-navigation__demoted.is-current li:before, .site-navigation__demoted.is-current .list--theme li:before, .list--theme .site-navigation__demoted.is-current li:before, .site-navigation__demoted.is-current .filter__trigger:after, .site-navigation__demoted.is-current .block-link--icon:before, .site-navigation__demoted.is-current .panel.is-inactive .panel__trigger:after, .panel.is-inactive .site-navigation__demoted.is-current .panel__trigger:after, .site-navigation__demoted.is-current .tail__lengthen:before, .site-navigation__demoted.is-current .tail__lengthen:after, .site-navigation__demoted.is-current .tail__shorten:before, .site-navigation__demoted.is-current .tail__shorten:after, .site-navigation__demoted:target .icon, .site-navigation__demoted:target .list--take-aways li:before, .list--take-aways .site-navigation__demoted:target li:before, .site-navigation__demoted:target .list--theme li:before, .list--theme .site-navigation__demoted:target li:before, .site-navigation__demoted:target .filter__trigger:after, .site-navigation__demoted:target .block-link--icon:before, .site-navigation__demoted:target .panel.is-inactive .panel__trigger:after, .panel.is-inactive .site-navigation__demoted:target .panel__trigger:after, .site-navigation__demoted:target .tail__lengthen:before, .site-navigation__demoted:target .tail__lengthen:after, .site-navigation__demoted:target .tail__shorten:before, .site-navigation__demoted:target .tail__shorten:after {
    -webkit-transform: rotate(180deg);
       -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg); }
  .site-navigation__demoted.is-active ul, .site-navigation__demoted.is-current ul, .site-navigation__demoted:target ul {
    margin: 0;
    padding: 0;
    height: auto;
    max-height: 50vh;
    background: #fff;
    border: 1px solid #3d3d3d; }
  .site-navigation__demoted.is-active li .menu__item, .site-navigation__demoted.is-active li .menu-toggle, .site-navigation__demoted.is-current li .menu__item, .site-navigation__demoted.is-current li .menu-toggle, .site-navigation__demoted:target li .menu__item, .site-navigation__demoted:target li .menu-toggle {
    display: block;
    border: inherit;
    border-bottom: 1px solid #cdcdcd; }
  .site-navigation__demoted.is-active li:last-child .menu__item, .site-navigation__demoted.is-active li:last-child .menu-toggle, .site-navigation__demoted.is-current li:last-child .menu__item, .site-navigation__demoted.is-current li:last-child .menu-toggle, .site-navigation__demoted:target li:last-child .menu__item, .site-navigation__demoted:target li:last-child .menu-toggle {
    border-bottom: 0; }
  .site-navigation__brand {
    margin-top: -18px; }
    .no-flexbox .site-navigation__brand {
      float: left; }
  .site-navigation__search {
    position: absolute;
    top: 0;
    left: 0;
    right: 0; }

/*
 * 1. Move below dropped extension brand
 */
@media only screen and (max-width: 63.9375em) {
  .menu__toggle {
    padding: 9px; }
  .site-navigation.is-inactive .site-navigation__browse .menu {
    position: absolute;
    left: -999em; }
    .site-navigation.is-inactive .site-navigation__browse .menu li {
      float: none;
      /* 1 */ }
  .no-flexbox .site-navigation__menu {
    width: 1px; }
  .site-navigation__menu .is-inactive .menu {
    height: 0;
    overflow: hidden; }
  .site-navigation__menu .is-active .menu,
  .site-navigation__menu .is-current .menu {
    position: absolute;
    top: 100%;
    margin-left: -15px;
    margin-right: -15px;
    padding-bottom: 9px;
    height: auto; }
    .site-navigation__menu .is-active .menu, .site-navigation__menu .is-active .menu::before, .site-navigation__menu .is-active .menu::after,
    .site-navigation__menu .is-current .menu,
    .site-navigation__menu .is-current .menu::before,
    .site-navigation__menu .is-current .menu::after {
      background: #fff;
      -moz-box-shadow: inset 0 -3px;
           box-shadow: inset 0 -3px; }
    .site-navigation__menu .is-active .menu::before, .site-navigation__menu .is-active .menu::after,
    .site-navigation__menu .is-current .menu::before,
    .site-navigation__menu .is-current .menu::after {
      z-index: -1;
      /* 1 */
      position: absolute;
      top: 0;
      content: "";
      height: 100%;
      width: 100vw; }
    .site-navigation__menu .is-active .menu::before,
    .site-navigation__menu .is-current .menu::before {
      right: 100%; }
    .site-navigation__menu .is-active .menu::after,
    .site-navigation__menu .is-current .menu::after {
      left: 0; }
  .site-navigation__menu .is-active li,
  .site-navigation__menu .is-current li {
    float: none;
    display: block; } }

@media only screen and (min-width: 64em) {
  .site-navigation--network {
    margin-bottom: -156px; }
  .menu__toggle {
    display: none; }
  .site-navigation {
    padding-top: 0; }
    .no-flexbox .site-navigation__nav {
      position: relative;
      top: 60px; }
    .site-navigation__menu, .site-navigation__browse {
      -ms-flex-item-align: center;
          -ms-grid-row-align: center;
          align-self: center; }
      .no-flexbox .site-navigation__menu, .no-flexbox .site-navigation__browse {
        float: left; }
    .no-flexbox .site-navigation__menu {
      width: 66.66667%; }
    .no-flexbox .site-navigation__browse {
      width: 33.33333%; }
    .site-navigation__search {
      position: relative;
      top: auto;
      left: auto;
      right: auto;
      padding-left: 15px;
      padding-right: 15px; }
    .site-navigation__brand {
      margin-top: 0; }
    .site-navigation__menu .is-inactive .menu__item, .site-navigation__menu .is-inactive .menu-toggle {
      display: inline; }
    .site-navigation__browse {
      -ms-flex-preferred-size: auto;
          flex-basis: auto;
      padding-left: 48px; }
    .site-navigation__brand--cta {
      margin-left: 18px;
      /* Make sure leaf does not fall off the page */ } }

@media only screen and (min-width: 64em) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .no-flexbox .site-navigation__nav {
    top: 0; } }

@media only screen and (min-width: 90em) {
  .site-navigation__brand--cta {
    margin-left: 0;
    /* Make sure leaf does not fall off the page */ } }

/*
Site Navigation Brand Extension

.site-navigation - Fallback state, menu items are all visible but floated
.site-navigation.is-inactive - Rested state, applies to smallest viewports only
.site-navigation.is-active - Active state, applies to smallest viewports only

markup:
<nav class="{$modifiers} wings">
  <a class="site-navigation__brand gutters" href="javascript:void();">
    <img class="image brand--extension" alt="ICT Update" src="/images/logos/logo-ict_update.png"/>
  </a>
  <div class="site-navigation__nav">
    <ul class="list--inline menu site-navigation__menu">
      <li><a class="menu__item" href="javascript:void();">Agribusiness</a></li>
      <li><a class="menu__item" href="javascript:void();">ICTS for agriculture</a></li>
      <li><a class="menu__item" href="javascript:void();">Climate resilient agriculture</a></li>
      <li><a class="menu__item" href="javascript:void();">Events</a></li>
      <li><a class="menu__item" href="javascript:void();">Projects</a></li>
    </ul>
    <div class="site-navigation__browse gutters">
      <sg-insert>4.4.1-1</sg-insert>
      <ul class="list--inline menu menu--secondary site-navigation__menu">
        <li><a class="menu__item" href="javascript:void();">Programmes</a></li>
        <li><a class="menu__item" href="javascript:void();">Regions</a></li>
        <li><a class="menu__item" href="javascript:void();">Topics</a></li>
      </ul>
    </div>
  </div>
</nav>

Styleguide 4.3.1
*/
/*
Site Navigation Brand Extension for version 1 release

.site-navigation - Fallback state, menu items are all visible but floated
.site-navigation.is-inactive - Rested state, applies to smallest viewports only
.site-navigation.is-active - Active state, applies to smallest viewports only

markup:
<nav class="{$modifiers} wings">
  <a class="site-navigation__brand gutters" href="javascript:void();">
    <img class="image brand--extension" alt="ICT Update" src="/images/logos/logo-ict_update.png"/>
  </a>
  <div class="site-navigation__nav">
    <ul class="list--inline menu site-navigation__menu">
      <li><a class="menu__item" href="javascript:void();">Agribusiness</a></li>
      <li><a class="menu__item" href="javascript:void();">ICTS for agriculture</a></li>
      <li><a class="menu__item" href="javascript:void();">Climate resilient agriculture</a></li>
      <li><a class="menu__item" href="javascript:void();">Events</a></li>
      <li><a class="menu__item" href="javascript:void();">Projects</a></li>
    </ul>
    <div class="site-navigation__browse gutters">
      <sg-insert>4.4.1-1</sg-insert>
    </div>
  </div>
</nav>

Styleguide 4.3.2
*/
/* 4.4 Site Search */
/*
Site Search

The website's primary navigation. This navigation bar is contextual to the website.

markup:
<form class="site-navigation__search site-search wings">
  <label class="is-narrative" for="site-search">Search</label>
  <input class="site-search__input" id="site-search" placeholder="Search CTA &hellip;" type="text" />
  <button class="is-narrative" type="submit">Search</button>
</form>

Styleguide 4.4
*/
/*
 * 1. Remove rounded corners on search box in ios
 * 2. Reset input box
 */
.site-search {
  background: #fff; }
  .site-search__input {
    /* small meta*/
    font-size: 0.6875em;
    line-height: 1.09091;
    font-family: "Open Sans", sans-serif;
    padding: 0 39px 0 15px;
    width: 100%;
    border: 0 solid;
    /* 2*/
    border-width: 0 0 1px;
    border-color: #cdcdcd;
    border-color: rgba(61, 61, 61, 0.26);
    -moz-border-radius: 0;
         border-radius: 0;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    /* 1 */
    line-height: 30px;
    height: 30px;
    /* IE doesn't display placeholder text without fixed height */ }
    .site-search__input:focus {
      outline: 1px solid #fff; }
  .site-search__brand {
    position: absolute;
    right: 0;
    top: 0; }
    .site-search__brand svg {
      height: 30px;
      width: 30px; }

@media only screen and (min-width: 20em) {
  .site-search__input {
    padding: 0 39px 0 18px; } }

@media only screen and (min-width: 64em) {
  .site-search {
    background: none;
    margin-bottom: 6px; }
    .site-search__input {
      height: 36px;
      width: 100%;
      padding: 0 12px;
      background: #fff;
      border: 2px solid #3d3d3d;
      border-color: #3d3d3d;
      font-size: 12px;
      line-height: 30px; }
      .site-search__input:focus {
        outline: 2px solid #3d3d3d; }
    .site-search__brand {
      right: 100%;
      top: -12px;
      margin-right: -9px; }
      .site-search__brand svg {
        width: 62px;
        height: 62px; } }

/*
Site Search for Brand Extension

The website's primary navigation. This navigation bar is contextual to the website.

markup:
<form class="site-navigation__search site-search wings">
  <a class="site-search__brand" href="javascript:void();">
  <svg width="36" height="36" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><title>CTA</title><g fill="none" fill-rule="evenodd"><path d="M3 12.923c.256 2.334 2 5.077 4 5.75C7.016 18.994 7 29 7 29h22.02V7H7s.016 3.236 0 3c-3 0-3.14-.635-4.2-.93 0 0-.15 2.063.2 3.853z" fill="#FFF"></path><path fill="#7BB010" d="M8 8h20v20H8"></path><path d="M21.933 10.594l-.226-.023-.23-.022c-.084-.007-.39-.032-.85-.032-1.215 0-3.502.182-5.147 1.4-2.067 1.534-2.53 3.732-2.777 4.913-.04.195-.104.49-.136.555-.058.107-.145.225-.223.327-.06.075-.122.155-.18.236-.63.89-.987 2.054-1.072 3.472-.033.448-.032.94.004 1.462.056.832.166 1.404.19 1.523.227 1.284.805 3.595.805 3.595h2.715s-1.276-3.402-1.605-5.036c-.276-1.37-.17-2.36.363-3.413.397-.587.948-.746 1.242-.788.25-.036.552-.047.876-.06 1.213-.044 2.722-.1 3.86-1.392 2.388-2.71 2.397-6.116 2.396-6.26l-.002-.228v-.228z" fill="#00662F"></path><path d="M12.687 23.3c-.333-1.704-.108-2.792.417-3.848.426-.666 1.047-.972 1.587-1.052 1.177-.176 3.1.19 4.382-1.312 2.258-2.645 2.242-6.04 2.242-6.04s-3.433-.35-5.587 1.297c-2.445 1.87-2.45 4.86-2.74 5.408-.07.138-.165.27-.266.408-.056.073-.11.147-.163.222-.658.96-.904 2.176-.968 3.28-.032.422-.032.89.003 1.413.06.9.18 1.494.18 1.494.04.233.085.46.13.682.03.146.063.288.095.428.215.94.456 1.735.58 2.32h1.606c-.307-1.034-1.205-3.2-1.498-4.7z" fill="#FFF"></path><path d="M16.396 14.892c-.81.896-.96 1.41-.96 1.41s-.32.525-.512.197c-.217-.374.104-1.224 1.317-2.245 1.314-1.106 2.868-1.648 2.868-1.648s-1.568 1.023-2.712 2.285z" fill="#00662F"></path><path d="M11.385 14.515l-1.3-.497-2.537-.807L6 12.343H4.948v1.8l2.228 2.236s2.043.187 2.228 0c.186-.186 1.176-.186 1.176-.186h.68l.125-1.677zM18.96 25.54c-.347.08-.732.176-1.353.176-1.216 0-2.62-.596-2.62-2.27 0-1.54 1.11-2.307 2.614-2.307.465 0 .916.1 1.353.228l-.098.957c-.392-.21-.77-.31-1.19-.31-.862 0-1.424.607-1.424 1.432 0 .868.635 1.394 1.524 1.394.398 0 .804-.1 1.137-.227l.06.926zM20.3 22.09h-1.125v-.874h3.465v.874h-1.124v3.55H20.3M23.778 23.86l.588-1.732h.014l.542 1.73h-1.144zm1.347-2.644h-1.49L21.9 25.64h1.237l.36-.945h1.713l.34.945h1.333l-1.758-4.424z" fill="#FFF"></path><path d="M10.68 15.584c-.395.104-1.773-.12-2.644-.53-2.325-1.097-3.012-2.35-3.012-2.35s1.566 1.26 3.038 1.674c1.47.415 2.437.536 2.578.548.142.012.285.04.367.128.16.168.013.44-.326.53zm3.625 2.56c-.178-.533-.462-.935-.727-1.254l.004-.003c-.174-.23-.358-.437-.533-.623h-.002c-.093-.1-.183-.193-.27-.282-.134-.29-.252-.777-.252-.777-.108-.537-.316-1.373-.676-2.127-.094-.267-.28-.575-.533-.87-.078-.098-.16-.19-.246-.274l-.003.007c-.49-.477-1.155-.878-1.88-.956-.53-.056-.914-.054-1.237-.025v-.002s-2.616.302-4.203-.39l-.087-.048s-.307 3.558 2.17 6.11h-.013s.118.132.337.314c.825.745 1.563 1.014 2.204 1.036.686.116 1.487.076 2.373-.277v.002s1.03-.363 1.51-.117c.1.093.198.197.284.314.42.483.608.953.515 1.636-.086.625-.28 1.18-.47 1.884l.166 1.16.137.477.02-.044.303.952c.443-.836.842-1.757 1.077-2.705.293-1.18.375-2.097.032-3.12zm-2.97 6.408C10.772 25.8 10.166 28 10.166 28h2.092c0-.81-.392-1.336-.467-1.853l-.454-1.595z" fill="#00662F"></path></g></svg>  
  </a>
  <label class="is-narrative" for="site-search">Search</label>
  <input class="site-search__input" id="site-search" placeholder="Search CTA &hellip;" type="text" />
  <button class="is-narrative" type="submit">Search</button>
</form>

Styleguide 4.4.1
*/
/* 4.5 Language */
/*
Language Switch

The website's primary navigation. This navigation bar is contextual to the website.

markup:
<ul class="menu language-switch">
  <li class="language is-active"><a class="menu__item" href="javascript:void();">EN</a></li>
  <li class="language"><a class="menu__item" href="javascript:void();">FR</a></li>
</ul>

sg-wrapper:
<nav class="network-navigation">
  <sg-wrapper-content/>
</nav>

Styleguide 4.5
*/
.language {
  left: -9999em;
  text-align: center; }
  .language, .language-switch {
    position: absolute;
    background: inherit;
    z-index: 2;
    white-space: nowrap; }
  .language-switch {
    top: 0;
    right: 0; }
  .language-switch:hover .language, .language.is-active {
    display: block;
    position: static; }
  .language.is-active {
    position: static; }
  .language .menu__item, .language .menu-toggle {
    padding: 6px 15px; }
  .language.is-active:hover .menu__item, .language.is-active:hover .menu-toggle {
    outline: 2px solid;
    outline-offset: -2px;
    color: #fff;
    border-color: #fff; }

@media only screen and (min-width: 64em) {
  .language, .language-switch {
    position: static; }
  .no-flexbox .language-switch {
    position: absolute; }
  .language-switch:hover .language, .language.is-active {
    display: inline-block; }
  .language .menu__item, .language .menu-toggle {
    padding: 10.5px 15px; }
  .language-switch:hover .language.is-active .menu__item, .language-switch:hover .language.is-active .menu-toggle, .language.is-active .menu__item, .language.is-active .menu-toggle {
    outline: 2px solid;
    outline-offset: -6px; }
  .language:last-child.is-active {
    margin-right: 15px; } }

/* 4.6 Author */
/*
Author

markup:
<aside class="author gutters">
  <h3 class="media media--middle trailer--tiny">
    <span class="media__image">
      <img class="image" alt="Julia Bello-Bravo" height="48" width="48" src="/images/content/authors/Julia_Bello-Bravo.jpg">
    </span>
    <span class="gutters media__content media__stretcher title title--meta">About the authors</span>
  </h3>
  <p class="body--whisper"><a href="javascript:void();">Julia Bello-Bravo</a> and <a href="javascript:void();">Barry Robert Pittendrigh</a> are co-director and director, respectively, of Scientific Animations Without Borders at the University of Illinois at Urbana-Champaign, United States.</p>
</aside>

Styleguide 4.6
*/
.author {
  /* small meta*/
  font-size: 0.75em;
  line-height: 1; }
  @media only screen and (min-width: 64em) {
    .author {
      /* regular meta */
      font-size: 0.875em;
      line-height: 1.07143; } }

/* 4.7 Headline */
/*
Headline (Post hero)

Main callout

.headline - Headline callout

markup:
<div class="{$modifiers} wings">
  <div>
    <p class="gutters meta trailer--tiny">April 2016</p>
    <h1 class="title title--headline anchor gutters">Scientific animation without borders</h1>
    <p class="posting__intro gutters leader--small">Small intro regarding post</p>
    <p class="gutters read-more">Read more...</p>
  </div>
  <em class="headline__tax"><span class="label">Issue 82</span></em>
</div>

sg-wrapper:
<div style="padding-top: 36px;">
<sg-wrapper-content/>
</div>

Styleguide 4.7
*/
/*
 * 1. Fallback
 * 2. Set root for tag positioning
 * 3. Hack to force to full width on Chrome
 * 4. Allow more horizontal space for longer headlines
 */
.headline {
  position: relative;
  /* 2 */
  width: 1%;
  /* 3 */
  min-width: 100%;
  /* 3 */
  padding-top: 42px;
  padding-bottom: 15px;
  background: #fff;
  /* 1 */
  background: rgba(255, 255, 255, 0.8); }
  .headline,
  .headline > * {
    padding-right: 0 !important;
    /* 4 */ }
  .headline__cover {
    background: rgba(255, 255, 255, 0.8); }
  .headline__tax {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: auto;
    background: #67ab43; }
    .theme--blue .headline__tax {
      background: #56c0dd; }
    .theme--lime .headline__tax {
      background-color: #c1d435; }
    .theme--yellow .headline__tax {
      background-color: #facf21; }
    .theme--gold .headline__tax {
      background-color: #eb942c; }
    .theme--orange .headline__tax {
      background-color: #e26435; }
    .theme--salmon .headline__tax {
      background-color: #eb735d; }
    .theme--red .headline__tax {
      background-color: #ec2d10; }
    .theme--burgundy .headline__tax {
      background-color: #ba222a; }
    .theme--purple .headline__tax {
      background-color: #9b3381; }
  .headline .posting__anchor {
    margin-bottom: 0;
    margin-top: 18px; }
  .headline:hover .posting__anchor {
    visibility: visible;
    opacity: 1; }

@media only screen and (min-width: 100em) {
  .headline__tax {
    width: 100%; } }

/* 4.8 Posting */
/*
Post

@todo - extract post__anchor into a new element: `read-more`

Styleguide 4.8
*/
.post {
  position: relative;
  width: 100%; }
  .grid--posts .post {
    margin-bottom: 54px; }
  .post__meta {
    line-height: 1; }
  .post__title {
    margin: 3px 0 6px; }
  .post__intro {
    font-size: 0.875em;
    line-height: 1.28571;
    margin: 9px 0; }
  .post:hover .post__anchor {
    visibility: visible;
    opacity: 1; }
  .post .pin-box {
    margin-top: 36px; }
    .post .pin-box .title {
      /* small title*/
      font-size: 0.75em;
      line-height: 1.5;
      margin-top: 0;
      margin-bottom: 6px; }
  .post__content {
    padding-top: 3px; }
  .grid--posts .post--hero {
    margin-bottom: 36px; }
  .post--hero .pin-box {
    margin-top: 24px; }
  .post .title {
    margin-top: 3px;
    margin-bottom: 6px; }
  .post--half-width {
    width: 50%; }
  .post--hero .post__content {
    padding-top: 6px; }
  .post--hero .post__media {
    margin-bottom: 12px; }
  .post--hero .title {
    margin-bottom: 12px; }
  .post__author {
    padding-top: 6px; }
  @media only screen and (min-width: 48em) {
    .grid--posts .post, .grid--posts .post--hero {
      margin-bottom: 0px; }
    .post--hero .post__intro {
      font-size: 0.75em;
      line-height: 1.25; } }
  @media only screen and (min-width: 64em) {
    .post__media {
      margin-bottom: 6px; }
    .post--hero .post__content {
      padding-top: 0; }
    .post--hero .post__media {
      margin-bottom: 0; }
    .post--hero .post__intro {
      padding-top: 12px;
      font-size: 1em;
      line-height: 1.5; }
    .post--hero .title {
      /* large title*/
      font-size: 1.625em;
      line-height: 1.03846;
      margin-top: 12px;
      margin-bottom: 6px; }
    .post-body .publication-tile__cover {
      width: 50%;
      max-width: 11.11111vw; } }

@media only screen and (min-width: 64em) {
  .no-flexbox .post__media.layout__cell {
    max-width: 61.53846%;
    display: inline-block;
    float: left; } }

/*
Post

markup:
<div class="post">
  <div class="post__media">
    <a class="anchor anchor--shy" href="javascript:void();">
      <img class="image image--stretch" width="767" height="512" alt="" src="https://images.unsplash.com/photo-1477240381028-271008c7415c?&fit=crop&w=767&h=512">
    </a>
  </div>
  <div class="post__content  |  leader-inside">
    <time class="meta" datetime="">19 October 2016</time>
    <h3 class="title  |  anchor--reset">
      <a class="anchor anchor--shy" href="javascript:void();">
        Sri Lanka's drone pioneers
      </a>
    </h3>
    <p class="post__author  |  author">
      by <a href="javascript:void();">Clayton Wilson</a>
    </p>
    <p class="is-gt-small-desktop  |  post__intro">Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?</p>
    <div class="pin-box  | leader-inside--small">
      <div class="title">CTA-ECOWAS Regional Conference on grain trade in West Africa</div>
      <div class="location">16 October 2016, Ghana, West Africa</div>
    </div>
  </div>
</div>

Styleguide 4.8.1
*/
/*
Post - Hero

markup:
<div class="post post--hero  |  layout">
  <div class="post__media  |  layout__cell  |  gutters">
    <a class="anchor anchor--shy" href="javascript:void();">
      <img class="image image--stretch" width="811" height="512" alt="" src="https://images.unsplash.com/photo-1477240381028-271008c7415c?&fit=crop&w=811&h=512">
    </a>
  </div>
  <div class="post__content  |  layout__cell layout__cell--aside  |  stack stack--stacked  |  wing--right">
    <div class="stack__unit  |  gutters">
      <time class="meta" datetime="">19 October 2016</time>
      <h3 class="title title--tile anchor--reset">
        <a class="anchor anchor--shy" href="javascript:void();">
          Sri Lanka's drone pioneers
        </a>
      </h3>
      <div class="media media--middle  |  bleed">
        <div class="media__image  |  gutters">
          <img class="image image--stretch" width="30" height="30" alt="Sri Lanka's drone pioneers" src="https://images.unsplash.com/photo-1444146644393-241099c1593d?&fit=crop&w=30&h=30">
        </div>
        <div class="media__content  |  body--whisper">
          by <a href="javascript:void();">Clayton Wilson</a>
        </div>
      </div>
      <p class="post__intro">Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?</p>
    </div>
    <div class="stack__unit stack__pin  |  gutters">
      <div class="pin-box  |  leader-inside--small">
        <div class="title">CTA-ECOWAS Regional Conference on grain trade in West Africa</div>
        <div class="location">16 October 2016, Ghana, West Africa</div>
      </div>
    </div>
  </div>
</div>

Styleguide 4.8.2
*/
/*
Post-tile

.post-tile - Post info
.post-tile.post-tile--s - Post info smaller

markup:
<div class="{$modifiers}">
	<img class="image image--stretch" src="https://source.unsplash.com/random" />
	<div class="post-tile__body">
		<div class="title  |  trailer--small">
			<a class="is-heir" href="javascript:void();">Growing cassava in Grenada: Bernadette's story</a>
		</div>
		<div class="media  |  location">
		  <span class="location__marker  |  media__figure">
		    <span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">Location:</span></span>
		  </span>
		  <div class="location__body  |  media__content">
		    Addis Ababa, Ethiopia
		  </div>
		</div>
	</div>
	<div class="post-tile-triangle"></div>
</div>

Styleguide 4.8.6
*/
.post-tile {
  position: relative; }
  .post-tile__body {
    position: absolute;
    left: -999em;
    right: 999em;
    background: transparent; }
  .post-tile-triangle {
    position: absolute;
    bottom: 9px;
    left: 9px;
    width: 0;
    height: 0;
    border-bottom: 21px solid rgba(255, 255, 255, 0.8);
    border-right: 21px solid transparent; }
    .post-tile-triangle::before {
      content: "+";
      font-size: 0.75em;
      line-height: 1.25;
      color: #67ab43;
      position: relative;
      top: 3px;
      left: 3px; }
      .post-tile-triangle::before.theme--dark,
      .theme--dark .post-tile-triangle::before,
      .theme .theme.theme--dark .post-tile-triangle::before {
        color: #3d3d3d; }
      .post-tile-triangle::before.theme--green,
      .theme--green .post-tile-triangle::before,
      .theme .theme.theme--green .post-tile-triangle::before {
        color: #67ab43; }
      .post-tile-triangle::before.theme--blue,
      .theme--blue .post-tile-triangle::before,
      .theme .theme.theme--blue .post-tile-triangle::before {
        color: #56c0dd; }
      .post-tile-triangle::before.theme--lime,
      .theme--lime .post-tile-triangle::before,
      .theme .theme.theme--lime .post-tile-triangle::before {
        color: #c1d435; }
      .post-tile-triangle::before.theme--yellow,
      .theme--yellow .post-tile-triangle::before,
      .theme .theme.theme--yellow .post-tile-triangle::before {
        color: #facf21; }
      .post-tile-triangle::before.theme--gold,
      .theme--gold .post-tile-triangle::before,
      .theme .theme.theme--gold .post-tile-triangle::before {
        color: #eb942c; }
      .post-tile-triangle::before.theme--orange,
      .theme--orange .post-tile-triangle::before,
      .theme .theme.theme--orange .post-tile-triangle::before {
        color: #e26435; }
      .post-tile-triangle::before.theme--salmon,
      .theme--salmon .post-tile-triangle::before,
      .theme .theme.theme--salmon .post-tile-triangle::before {
        color: #eb735d; }
      .post-tile-triangle::before.theme--red,
      .theme--red .post-tile-triangle::before,
      .theme .theme.theme--red .post-tile-triangle::before {
        color: #ec2d10; }
      .post-tile-triangle::before.theme--burgundy,
      .theme--burgundy .post-tile-triangle::before,
      .theme .theme.theme--burgundy .post-tile-triangle::before {
        color: #ba222a; }
      .post-tile-triangle::before.theme--purple,
      .theme--purple .post-tile-triangle::before,
      .theme .theme.theme--purple .post-tile-triangle::before {
        color: #9b3381; }
      .post-tile-triangle::before.theme--youth,
      .theme--youth .post-tile-triangle::before,
      .theme .theme.theme--youth .post-tile-triangle::before {
        color: #d57800; }
      .post-tile-triangle::before.theme--digitalisation,
      .theme--digitalisation .post-tile-triangle::before,
      .theme .theme.theme--digitalisation .post-tile-triangle::before {
        color: #9a3324; }
      .post-tile-triangle::before.theme--climate,
      .theme--climate .post-tile-triangle::before,
      .theme .theme.theme--climate .post-tile-triangle::before {
        color: #693c5e; }
      .post-tile-triangle::before.theme--gender,
      .theme--gender .post-tile-triangle::before,
      .theme .theme.theme--gender .post-tile-triangle::before {
        color: #046a38; }
      .post-tile-triangle::before.theme--nutrition,
      .theme--nutrition .post-tile-triangle::before,
      .theme .theme.theme--nutrition .post-tile-triangle::before {
        color: #487a7b; }
      .post-tile-triangle::before.theme--blog,
      .theme--blog .post-tile-triangle::before,
      .theme .theme.theme--blog .post-tile-triangle::before {
        color: #ffa300; }
      .post-tile-triangle::before.theme--spore-blue,
      .theme--spore-blue .post-tile-triangle::before,
      .theme .theme.theme--spore-blue .post-tile-triangle::before {
        color: #3f68b1; }
      .post-tile-triangle::before.theme--spore-brown,
      .theme--spore-brown .post-tile-triangle::before,
      .theme .theme.theme--spore-brown .post-tile-triangle::before {
        color: #774b04; }
      .post-tile-triangle::before.theme--spore-dark-blue,
      .theme--spore-dark-blue .post-tile-triangle::before,
      .theme .theme.theme--spore-dark-blue .post-tile-triangle::before {
        color: #044e7e; }
      .post-tile-triangle::before.theme--spore-forest-green,
      .theme--spore-forest-green .post-tile-triangle::before,
      .theme .theme.theme--spore-forest-green .post-tile-triangle::before {
        color: #5f810a; }
      .post-tile-triangle::before.theme--spore-grey-blue,
      .theme--spore-grey-blue .post-tile-triangle::before,
      .theme .theme.theme--spore-grey-blue .post-tile-triangle::before {
        color: #6d8c9f; }
      .post-tile-triangle::before.theme--spore-light-blue,
      .theme--spore-light-blue .post-tile-triangle::before,
      .theme .theme.theme--spore-light-blue .post-tile-triangle::before {
        color: #79accf; }
      .post-tile-triangle::before.theme--spore-lime,
      .theme--spore-lime .post-tile-triangle::before,
      .theme .theme.theme--spore-lime .post-tile-triangle::before {
        color: #bbae03; }
      .post-tile-triangle::before.theme--spore-ochre,
      .theme--spore-ochre .post-tile-triangle::before,
      .theme .theme.theme--spore-ochre .post-tile-triangle::before {
        color: #db9623; }
      .post-tile-triangle::before.theme--spore-olive-green,
      .theme--spore-olive-green .post-tile-triangle::before,
      .theme .theme.theme--spore-olive-green .post-tile-triangle::before {
        color: #778d3e; }
      .post-tile-triangle::before.theme--spore-red,
      .theme--spore-red .post-tile-triangle::before,
      .theme .theme.theme--spore-red .post-tile-triangle::before {
        color: #f54c23; }
      .post-tile-triangle::before.theme--spore-taupe,
      .theme--spore-taupe .post-tile-triangle::before,
      .theme .theme.theme--spore-taupe .post-tile-triangle::before {
        color: #7b6d65; }
      .post-tile-triangle::before.theme--spore-teal,
      .theme--spore-teal .post-tile-triangle::before,
      .theme .theme.theme--spore-teal .post-tile-triangle::before {
        color: #077fc1; }
  .post-tile:hover .post-tile__body {
    left: 9px;
    right: 9px;
    right: -moz-calc((2 / 18 * 100vw) - 30px);
    right: calc((2 / 18 * 100vw) - 30px);
    bottom: 9px;
    padding: 30px;
    background: #fff;
    background: rgba(255, 255, 255, 0.8); }
  .post-tile:hover .post-tile-triangle {
    border-bottom-color: #67ab43; }
    .theme--blue .post-tile:hover .post-tile-triangle {
      border-bottom-color: #56c0dd; }
    .theme--lime .post-tile:hover .post-tile-triangle {
      border-bottom-color: #c1d435; }
    .theme--yellow .post-tile:hover .post-tile-triangle {
      border-bottom-color: #facf21; }
    .theme--gold .post-tile:hover .post-tile-triangle {
      border-bottom-color: #eb942c; }
    .theme--orange .post-tile:hover .post-tile-triangle {
      border-bottom-color: #e26435; }
    .theme--salmon .post-tile:hover .post-tile-triangle {
      border-bottom-color: #eb735d; }
    .theme--red .post-tile:hover .post-tile-triangle {
      border-bottom-color: #ec2d10; }
    .theme--burgundy .post-tile:hover .post-tile-triangle {
      border-bottom-color: #ba222a; }
    .theme--purple .post-tile:hover .post-tile-triangle {
      border-bottom-color: #9b3381; }
    .post-tile:hover .post-tile-triangle:before {
      content: "-";
      color: #fff; }
  .post-tile--s:hover .post-tile__body {
    right: 9px;
    padding: 18px; }
  .post-tile--s .post-tile__body .title {
    /* small title*/
    font-size: 0.875em;
    line-height: 1.28571; }

/*
Posting - Row

markup:
<div class="post post--issue post--row trailer">
    <div class="post__image gutter">
        <img class="image image--stretch" width="899" height="506" alt="Decision support systems for family farmers" src="https://source.unsplash.com/random/300x200">
    </div><!--
    --><div class="post__content media">
        <div class="media__stretcher">
            <h3 class="title">Decision support systems for family farmers</h3>
            <p class="post__intro">
                How would you describe the role of ‘decision support systems’ in the context of their use for family farming?
            </p>
            <a class="post__anchor" href="javascript:void();">Read more</a>
        </div><!--
        --><div class="media__stretcher">
            <div class="issue-label issue-label--s media">
                <div class="issue-label__caption">
                    <span>September 2014</span>
                </div>
                <div class="issue-label__nr" data-issue-nr="78"></div>
            </div>
        </div>
    </div>
</div>

Styleguide 4.8.3
*/
/*
 * 1. IE Fallback
 */
.post--row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap-reverse;
      flex-wrap: wrap-reverse; }
  .no-flexbox .post--row {
    /**
  * For IE 6/7 only
  */
    display: block;
    width: 100%; }
    .no-flexbox .post--row::before, .no-flexbox .post--row::after {
      content: " ";
      display: table; }
    .no-flexbox .post--row::after {
      clear: both; }

.no-flexbox .post--row .post__image, .no-flexbox
.post--row .post__content {
  float: left;
  /* 1. */ }

.post--row .post__image {
  -ms-flex-preferred-size: 25%;
      flex-basis: 25%; }
  .no-flexbox .post--row .post__image {
    width: 25%;
    /* Fallback when there is no image uploaded */ }

.post--row .post__content {
  -ms-flex-preferred-size: 75%;
      flex-basis: 75%; }
  .no-flexbox .post--row .post__content {
    width: 75%;
    /* Fallback when there is no image uploaded */ }

.post--wide .post__image {
  -ms-flex-preferred-size: 37.5%;
      flex-basis: 37.5%; }
  .no-flexbox .post--wide .post__image {
    width: 37.5%;
    /* Fallback when there is no image uploaded */ }

.post--wide .post__content {
  -ms-flex-preferred-size: 62.5%;
      flex-basis: 62.5%; }
  .no-flexbox .post--wide .post__content {
    width: 62.5%;
    /* Fallback when there is no image uploaded */ }

.post--row .title {
  padding-bottom: 4.5px; }

@media only screen and (max-width: 63.9375em) {
  .post--row {
    -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse; }
  .layout--even .post--row .post__content,
  .layout--even .post--row .post__image {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%; }
    .no-flexbox .layout--even .post--row .post__content, .no-flexbox
    .layout--even .post--row .post__image {
      width: 100%; } }

@media only screen and (max-width: 63.9375em) {
  .post:not(:first-of-type) {
    display: none; }
  .post + .divider {
    display: none; } }

/* 4.9 Cover */
/*
Cover

Full-bleed image with a vertically centered layover.

markup:
<figure class="ie9-hero hero hero--slogan" data-fe-id="0759765696892ee8">
    <picture class="not-crown hero__figure  |  image image--stretch">
        <source media="(max-width: 767px) and (orientation: portrait)" srcset="https://res.cloudinary.com/cta/image/upload/w_1536,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1536w,https://res.cloudinary.com/cta/image/upload/w_1334,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1334w,https://res.cloudinary.com/cta/image/upload/w_1136,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1136w,https://res.cloudinary.com/cta/image/upload/w_960,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 960w,https://res.cloudinary.com/cta/image/upload/w_768,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 768w,https://res.cloudinary.com/cta/image/upload/w_667,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 667w,https://res.cloudinary.com/cta/image/upload/w_568,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 568w,https://res.cloudinary.com/cta/image/upload/w_480,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 480w" sizes="100vw">
        <source media="(max-width: 767px) and (orientation: landscape)" srcset="https://res.cloudinary.com/cta/image/upload/w_1536,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1536w,https://res.cloudinary.com/cta/image/upload/w_1334,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1334w,https://res.cloudinary.com/cta/image/upload/w_1136,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1136w,https://res.cloudinary.com/cta/image/upload/w_960,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 960w,https://res.cloudinary.com/cta/image/upload/w_768,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 768w,https://res.cloudinary.com/cta/image/upload/w_667,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 667w,https://res.cloudinary.com/cta/image/upload/w_568,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 568w,https://res.cloudinary.com/cta/image/upload/w_480,ar_3:2,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 480w" sizes="100vw">
        <source media="(min-width: 768px) and (max-width: 1024px)" srcset="https://res.cloudinary.com/cta/image/upload/w_2048,ar_2:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 2048w,https://res.cloudinary.com/cta/image/upload/w_1536,ar_2:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1536w,https://res.cloudinary.com/cta/image/upload/w_1024,ar_2:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1024w,https://res.cloudinary.com/cta/image/upload/w_768,ar_2:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 768w" sizes="100vw">
        <source media="(min-height: 800px) and (max-height: 1280px) and (min-width: 800px) and (max-width: 1280px) and (orientation: portrait)" srcset="https://res.cloudinary.com/cta/image/upload/w_1600,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1600w,https://res.cloudinary.com/cta/image/upload/w_800,ar_2:3,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 800w" sizes="100vw">
        <source media="(min-width: 1280px) and (max-width: 600px) and (orientation: landscape)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_3:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 2560w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_3:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1280w" sizes="100vw">
        <source media="(min-aspect-ratio: 16/9) and (min-width: 1800px)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:5,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:5,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:5,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:5,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:5,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1280w" sizes="100vw">
        <source media="(min-aspect-ratio: 1/1)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:6,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:6,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:6,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:6,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:6,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1280w" sizes="100vw">
        <source media="(max-aspect-ratio: 1/1)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:8,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:8,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:8,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:8,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:8,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 1280w" sizes="100vw">
        <img class="hero__figure  |  image image--stretch" src="https://res.cloudinary.com/cta/image/upload/w_480,ar_1:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg" srcset="https://res.cloudinary.com/cta/image/upload/w_960,ar_1:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 960w,https://res.cloudinary.com/cta/image/upload/w_480,ar_1:1,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg 480w" sizes="100vw" alt="Leading image">
    </picture>
    <figcaption class="hero__headline">
        <img src="/images/slogan.svg" alt="Seeding Innovation, Harvesting Prosperity">
    </figcaption>
</figure>

Styleguide 4.9
*/
.cover {
  position: relative;
  background: no-repeat center;
  -moz-background-size: cover;
       background-size: cover; }

@media only screen and (max-width: 32.4375em) {
  .cover {
    max-height: 480px; } }

@media only screen and (min-width: 32.5em) {
  .cover.cover {
    height: 100vh;
    max-height: 100vh;
    min-height: -moz-calc(100vh - 192px);
    min-height: calc(100vh - 192px); }
    .cover.cover.is-crowned {
      min-height: 100vh; } }

/* 4.10 Sharing */
/*
Share

.label.share - Share button
.label.share.share--whisper - Subdued button
.label.share.share--facebook - Facebook share button
.label.share.share--twitter - Twitter share button
.label.share.share--instagram - Instagram share button
.label.share.share--print - Print share button
.label.share.share--email - Email share button

markup:
<a class="{$modifiers}" href="javascript:void();" title="Share on Facebook"><span data-icon="facebook"><span><span class="is-narrative">Share on Facebook</span></a>

Styleguide 4.10
*/
.share {
  width: 36px;
  height: 36px;
  padding: 0;
  text-align: center;
  line-height: 36px;
  text-decoration: none; }
  .share .icon, .share .list--take-aways li:before, .list--take-aways .share li:before, .share .list--theme li:before, .list--theme .share li:before, .share .filter__trigger:after, .share .block-link--icon:before, .share .panel.is-inactive .panel__trigger:after, .panel.is-inactive .share .panel__trigger:after, .share .tail__lengthen:before, .share .tail__lengthen:after, .share .tail__shorten:before, .share .tail__shorten:after,
  .share [data-icon]:before {
    font-size: 24px;
    text-align: center;
    line-height: inherit; }
  .share:hover, .share:visited {
    color: #fff !important; }
  .share--whisper {
    opacity: .50; }
  .share--whisper:hover {
    opacity: 1; }
  .share--facebook:hover, .share--facebook-branded {
    background-color: #3b5998 !important; }
  .share--twitter:hover, .share--twitter-branded {
    background: #55acee !important; }
  .share--linkedin:hover, .share--linkedin-branded {
    background: #0077b5 !important; }
  .share--instagram:hover, .share--instagram-branded {
    background: #fcaf45 !important; }
  .share--vimeo:hover, .share--vimeo-branded {
    background: #162221 !important; }
  .share--youtube:hover, .share--youtube-branded {
    background: #e52d27 !important; }
  .share--print:hover, .share--email:hover, .share--print-branded, .share--email-branded {
    background: #3d3d3d; }

/*
Share List

.well.well--slim-fit - Share list as used below content

markup:
<ul class="{$modifiers} reset list--float">
  <li class="divider  divider--left">
    <a class="label share share--facebook" title="Share on Facebook" href="javascript:void();"><span data-icon="facebook"><span><span class="is-narrative">Share on Facebook</span></a>
  </li>
  <li class="divider  divider--left">
    <a class="label share share--twitter" title="Share on Twitter" href="javascript:void();"><span data-icon="twitter"><span><span class="is-narrative">Share on Twitter</span></a>
  </li>
  <li class="divider  divider--left">
    <a class="label share share--print" title="Print" href="javascript:void();"><span data-icon="print"><span><span class="is-narrative">Print</span></a>
  </li>
  <li class="divider  divider--left">
    <a class="label share share--email" title="Send link via E-mail" href="javascript:void();"><span data-icon="email"><span><span class="is-narrative">Send link via E-mail</span></a>
  </li>
</ul>

Styleguide 4.10.1
*/
/*
Share List colourful

markup:
<div class="well well--slim-fit  |  gutters-outside  |  leader  |  trailer  |  is-gt-small-desktop">
    <ul class="share-list reset list--float">
        <li class="share-list__item divider  divider--left">
            <a class="label share share--facebook share--facebook-branded" title="Share on Facebook" href="javascript:void()" target="_blank">
                <span data-icon="facebook" class="icon icon--facebook"><span class="is-narrative">Share on Facebook</span></span>
            </a>
        </li>
        <li class="share-list__item divider  divider--left">
            <a class="label share share--twitter share--twitter-branded" title="Share on Twitter" href="javascript:void()"
              target="_blank">
                <span data-icon="twitter" class="icon icon--twitter"><span class="is-narrative">Share on Twitter</span></span>
            </a>
        </li>
        <li class="share-list__item divider  divider--left">
            <a class="label share share--print" title="Print" href="javascript:void()">
                <span data-icon="print" class="icon icon--print"><span class="is-narrative">Print</span></span>
            </a>
        </li>
        <li class="share-list__item divider  divider--left">
            <a class="label share share--email" title="Send link via E-mail" href="javascript:void()">
                <span data-icon="email" class="icon icon--envelope"><span class="is-narrative">Send link via E-mail</span></span>
            </a>
        </li>
    </ul>
</div>

Styleguide 4.10.2
*/
.share-list__item:first-child {
  border-left: 0; }

/*
Share List, with a section or category label

.share-list.well.well--slim-fit - Share list as used above content

markup:
<ul class="{$modifiers} reset list--float">
  <li class="share-list__item">
    <a class="label" title="View other posts in this section" href="http://localhost:3000/#/section/4.10;">Category</a>
  </li>
  <li class="share-list__item">
    <a class="label share share--facebook" title="Share on Facebook" href="javascript:void();"><span data-icon="facebook"><span><span class="is-narrative">Share on Facebook</span></a>
  </li>
  <li class="share-list__item">
    <a class="label share share--twitter" title="Share on Twitter" href="javascript:void();"><span data-icon="twitter"><span><span class="is-narrative">Share on Twitter</span></a>
  </li>
  <li class="share-list__item">
    <a class="label share share--print" title="Print" href="javascript:void();"><span data-icon="print"><span><span class="is-narrative">Print</span></a>
  </li>
  <li class="share-list__item">
    <a class="label share share--email" title="Send link via E-mail" href="javascript:void();"><span data-icon="email"><span><span class="is-narrative">Send link via E-mail</span></a>
  </li>
</ul>

Styleguide 4.10.3
*/
/*
Share List, with a section or category

.share-list.share-list--s - Share list as used above content

markup:
<ul class="share--list share-list--whisper share-list--s reset list--float">
  <li class="share-list__item">
      <a class="label" title="View other posts in this section" href="javascript:void();">Issue 82</a>
  </li>
  <li class="share-list__item">
      <a class="label share share--facebook" title="Share on Facebook" href="http://facebook.com/dialog/feed?app_id=1761136020833792&amp;display=popup&amp;redirect_uri=http://ictupdate.cta.int.dev/2016/04/21/drones-on-the-horizon-new-frontier-in-agricultural-innovation/&amp;link=http://ictupdate.cta.int.dev/2016/04/21/drones-on-the-horizon-new-frontier-in-agricultural-innovation/" target="_blank" onclick="window.open('http://facebook.com/dialog/feed?app_id=1761136020833792&amp;display=popup&amp;redirect_uri=http://ictupdate.cta.int.dev/2016/04/21/drones-on-the-horizon-new-frontier-in-agricultural-innovation/&amp;link=http://ictupdate.cta.int.dev/2016/04/21/drones-on-the-horizon-new-frontier-in-agricultural-innovation/', '', 'width=715,height=450');return false;"><span data-icon="facebook"><span><span class="is-narrative">Share on Facebook</span></span></span></a>
  </li>
  <li class="share-list__item">
      <a class="label share share--twitter" title="Share on Twitter" href="https://twitter.com/intent/tweet?url=http://ictupdate.cta.int.dev/2016/04/21/drones-on-the-horizon-new-frontier-in-agricultural-innovation/" target="_blank" onclick="window.open('https://twitter.com/intent/tweet?url=http://ictupdate.cta.int.dev/2016/04/21/drones-on-the-horizon-new-frontier-in-agricultural-innovation/', '', 'width=715,height=450');return false;"><span data-icon="twitter"><span><span class="is-narrative">Share on Twitter</span></span></span></a>
  </li>
  <li class="share-list__item">
      <a class="label share share--print" title="Print" href="javascript:window.print();"><span data-icon="print"><span><span class="is-narrative">Print</span></span></span></a>
  </li>
  <li class="share-list__item">
      <a class="label share share--email" title="Send link via E-mail" href="mailto:?Subject=Drones on the horizon: new frontier in agricultural innovation&amp;body=http://ictupdate.cta.int.dev/2016/04/21/drones-on-the-horizon-new-frontier-in-agricultural-innovation/"><span data-icon="email"><span><span class="is-narrative">Send link via E-mail</span></span></span></a>
  </li>
</ul>

Styleguide 4.10.4
*/
/*
Share List colourful without well

markup:
<div class="gutters-outside  |  leader  |  trailer  |  is-gt-small-desktop">
    <ul class="share-list reset list--float">
        <li class="share-list__item divider  divider--left">
            <a class="label share share--facebook share--facebook-branded" title="Share on Facebook" href="javascript:void()" target="_blank">
                <span data-icon="facebook" class="icon icon--facebook"><span class="is-narrative">Share on Facebook</span></span>
            </a>
        </li>
        <li class="share-list__item divider  divider--left">
            <a class="label share share--twitter share--twitter-branded" title="Share on Twitter" href="javascript:void()"
              target="_blank">
                <span data-icon="twitter" class="icon icon--twitter"><span class="is-narrative">Share on Twitter</span></span>
            </a>
        </li>
        <li class="share-list__item divider  divider--left">
            <a class="label share share--print" title="Print" href="javascript:void()">
                <span data-icon="print" class="icon icon--print"><span class="is-narrative">Print</span></span>
            </a>
        </li>
        <li class="share-list__item divider  divider--left">
            <a class="label share share--email" title="Send link via E-mail" href="javascript:void()">
                <span data-icon="email" class="icon icon--envelope"><span class="is-narrative">Send link via E-mail</span></span>
            </a>
        </li>
    </ul>
</div>

Styleguide 4.10.5
*/
/* 4.11 Event hero */
/*
Event teaser

.event-teaser - Teaser block for events

markup:
<div class="{$modifiers}  |  teaser  |  stack">
    <div class="event-teaser__date  |  stack__unit stack__pin">
        <span class="date">
            <span class="date__head">Oct</span>
            <span class="date__body">16</span>
        </span>
    </div>
    <div class="stack__unit  |  stack stack--stacked">
        <div class="stack__unit">
            <h2 class="anchor  |  title  |  gutters gutter-hero--left">
                <a href="javascript:void(0);">Pacific Week of Agriculture 2017</a>
            </h2>
            <p class="gutters gutter-hero--left">
                <time class="meta" datetime="2017-10-16T00:00:00+11:00">Monday, 16 October 2017</time>
                <time class="meta" datetime="2017-10-20T23:59:59+11:00"> – Friday, 20 October 2017</time>
            </p>
        </div>
        <div class="pin-box  |  stack__unit  |  stack  |  leader">
            <div class="pin-box__cell  |  stack__unit  |  leader-inside  |  trailer-inside  |  gutters gutter-hero--left">
                <div class="media media--middle  |  location">
                    <span class="location__marker  |  media__figure">
                        <span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">Location:</span></span>
                    </span>
                    <div class="location__body  |  media__content">Port Vila, Vanuatu</div>
                </div>
            </div>
            <div class="pin-box__cell  |  stack__unit  |  leader-inside  |  trailer-inside  |  gutters gutter-hero--left">
                <ul class="reset  |  label-list  |  list--inline">
                    <li><a class="label label--s" href="/en/search?concepts[]=c_8692">agrotourism</a></li>
                    <li><a class="label label--s" href="/en/search?concepts[]=c_5487">Pacific Islands</a></li>
                    <li><a class="label label--s" href="/en/search?concepts[]=c_37887">entrepreneurship</a></li>
                </ul>
            </div>
        </div>
    </div>
</div>

Styleguide 4.11
*/
/*
 * 1. Align top of date with title
 */
.event-teaser__date {
  background-color: #67ab43;
  padding-top: 6px;
  /* 1 */ }
  .event-teaser__date.theme--dark,
  .theme--dark .event-teaser__date,
  .theme .theme--dark .event-teaser__date {
    background-color: #3d3d3d; }
  .event-teaser__date.theme--green,
  .theme--green .event-teaser__date,
  .theme .theme--green .event-teaser__date {
    background-color: #67ab43; }
  .event-teaser__date.theme--blue,
  .theme--blue .event-teaser__date,
  .theme .theme--blue .event-teaser__date {
    background-color: #56c0dd; }
  .event-teaser__date.theme--lime,
  .theme--lime .event-teaser__date,
  .theme .theme--lime .event-teaser__date {
    background-color: #c1d435; }
  .event-teaser__date.theme--yellow,
  .theme--yellow .event-teaser__date,
  .theme .theme--yellow .event-teaser__date {
    background-color: #facf21; }
  .event-teaser__date.theme--gold,
  .theme--gold .event-teaser__date,
  .theme .theme--gold .event-teaser__date {
    background-color: #eb942c; }
  .event-teaser__date.theme--orange,
  .theme--orange .event-teaser__date,
  .theme .theme--orange .event-teaser__date {
    background-color: #e26435; }
  .event-teaser__date.theme--salmon,
  .theme--salmon .event-teaser__date,
  .theme .theme--salmon .event-teaser__date {
    background-color: #eb735d; }
  .event-teaser__date.theme--red,
  .theme--red .event-teaser__date,
  .theme .theme--red .event-teaser__date {
    background-color: #ec2d10; }
  .event-teaser__date.theme--burgundy,
  .theme--burgundy .event-teaser__date,
  .theme .theme--burgundy .event-teaser__date {
    background-color: #ba222a; }
  .event-teaser__date.theme--purple,
  .theme--purple .event-teaser__date,
  .theme .theme--purple .event-teaser__date {
    background-color: #9b3381; }
  .event-teaser__date.theme--youth,
  .theme--youth .event-teaser__date,
  .theme .theme--youth .event-teaser__date {
    background-color: #d57800; }
  .event-teaser__date.theme--digitalisation,
  .theme--digitalisation .event-teaser__date,
  .theme .theme--digitalisation .event-teaser__date {
    background-color: #9a3324; }
  .event-teaser__date.theme--climate,
  .theme--climate .event-teaser__date,
  .theme .theme--climate .event-teaser__date {
    background-color: #693c5e; }
  .event-teaser__date.theme--gender,
  .theme--gender .event-teaser__date,
  .theme .theme--gender .event-teaser__date {
    background-color: #046a38; }
  .event-teaser__date.theme--nutrition,
  .theme--nutrition .event-teaser__date,
  .theme .theme--nutrition .event-teaser__date {
    background-color: #487a7b; }
  .event-teaser__date.theme--blog,
  .theme--blog .event-teaser__date,
  .theme .theme--blog .event-teaser__date {
    background-color: #ffa300; }
  .event-teaser__date.theme--spore-blue,
  .theme--spore-blue .event-teaser__date,
  .theme .theme--spore-blue .event-teaser__date {
    background-color: #3f68b1; }
  .event-teaser__date.theme--spore-brown,
  .theme--spore-brown .event-teaser__date,
  .theme .theme--spore-brown .event-teaser__date {
    background-color: #774b04; }
  .event-teaser__date.theme--spore-dark-blue,
  .theme--spore-dark-blue .event-teaser__date,
  .theme .theme--spore-dark-blue .event-teaser__date {
    background-color: #044e7e; }
  .event-teaser__date.theme--spore-forest-green,
  .theme--spore-forest-green .event-teaser__date,
  .theme .theme--spore-forest-green .event-teaser__date {
    background-color: #5f810a; }
  .event-teaser__date.theme--spore-grey-blue,
  .theme--spore-grey-blue .event-teaser__date,
  .theme .theme--spore-grey-blue .event-teaser__date {
    background-color: #6d8c9f; }
  .event-teaser__date.theme--spore-light-blue,
  .theme--spore-light-blue .event-teaser__date,
  .theme .theme--spore-light-blue .event-teaser__date {
    background-color: #79accf; }
  .event-teaser__date.theme--spore-lime,
  .theme--spore-lime .event-teaser__date,
  .theme .theme--spore-lime .event-teaser__date {
    background-color: #bbae03; }
  .event-teaser__date.theme--spore-ochre,
  .theme--spore-ochre .event-teaser__date,
  .theme .theme--spore-ochre .event-teaser__date {
    background-color: #db9623; }
  .event-teaser__date.theme--spore-olive-green,
  .theme--spore-olive-green .event-teaser__date,
  .theme .theme--spore-olive-green .event-teaser__date {
    background-color: #778d3e; }
  .event-teaser__date.theme--spore-red,
  .theme--spore-red .event-teaser__date,
  .theme .theme--spore-red .event-teaser__date {
    background-color: #f54c23; }
  .event-teaser__date.theme--spore-taupe,
  .theme--spore-taupe .event-teaser__date,
  .theme .theme--spore-taupe .event-teaser__date {
    background-color: #7b6d65; }
  .event-teaser__date.theme--spore-teal,
  .theme--spore-teal .event-teaser__date,
  .theme .theme--spore-teal .event-teaser__date {
    background-color: #077fc1; }

.event-teaser .title {
  /* regular title*/
  font-size: 1em;
  line-height: 1.3125;
  padding-top: 9px;
  margin-bottom: 6px; }

@media only screen and (min-width: 48em) {
  .event-teaser {
    min-height: 165px; }
    .event-teaser .title {
      /* large title*/
      font-size: 1.5em;
      line-height: 1.125; } }

@media only screen and (min-width: 64em) {
  .event-teaser .date {
    padding-top: 24px;
    /* 1 */ }
  .event-teaser .title {
    /* large title*/
    font-size: 1.5em;
    line-height: 1.125;
    padding-top: 33px;
    /* 1 */
    margin-bottom: 18px; } }

@media only screen and (min-width: 90em) {
  .event-teaser .meta {
    /* regular meta */
    font-size: 0.75em;
    line-height: 1.25; }
  .event-teaser .location {
    /* regular meta */
    font-size: 0.875em;
    line-height: 1.07143; } }

/* 4.12 Pin box */
/*
Pin box

.pin-box - Default
.pin-box.pin-box--hero - More whitespace

markup:
<div class="{$modifiers}  |  stack  |  leader">
  <div class="pin-box__cell  |  stack__unit  |  leader-inside  |  trailer-inside  | gutters">
    <sg-insert>3.19</sg-insert>
  </div>
  <div class="pin-box__cell  |  stack__unit  |  leader-inside  |  trailer-inside  | gutters">
    <sg-insert>3.9.1-1</sg-insert>
  </div>
</div>

Styleguide 4.12
*/
.pin-box {
  border: 1px solid #cdcdcd;
  border: 1px solid rgba(103, 171, 67, 0.26);
  border-width: 1px 0 0; }
  .well .pin-box {
    border-color: #fff !important;
    border-color: rgba(255, 255, 255, 0.4) !important; }
  .well--neutral .pin-box {
    border-color: #fff !important; }
  .theme--blue .pin-box {
    border-color: rgba(86, 192, 221, 0.26); }
  .theme--lime .pin-box {
    border-color: rgba(193, 212, 53, 0.26); }
  .theme--yellow .pin-box {
    border-color: rgba(250, 207, 33, 0.26); }
  .theme--gold .pin-box {
    border-color: rgba(235, 148, 44, 0.26); }
  .theme--orange .pin-box {
    border-color: rgba(226, 100, 53, 0.26); }
  .theme--salmon .pin-box {
    border-color: rgba(235, 115, 93, 0.26); }
  .theme--red .pin-box {
    border-color: rgba(236, 45, 16, 0.26); }
  .theme--burgundy .pin-box {
    border-color: rgba(186, 34, 42, 0.26); }
  .theme--purple .pin-box {
    border-color: rgba(155, 51, 129, 0.26); }
  .theme--youth .pin-box {
    border-color: rgba(213, 120, 0, 0.26); }
  .theme--digitalisation .pin-box {
    border-color: rgba(154, 51, 36, 0.26); }
  .theme--climate .pin-box {
    border-color: rgba(105, 60, 94, 0.26); }
  .theme--gender .pin-box {
    border-color: rgba(4, 106, 56, 0.26); }
  .theme--nutrition .pin-box {
    border-color: rgba(72, 122, 123, 0.26); }
  .pin-box__cell {
    padding-top: 12px;
    padding-bottom: 12px;
    border: inherit;
    border-width: 0 0 0 1px; }
    .no-flexbox .pin-box__cell {
      border-width: 1px 0 0 1px; }
    .pin-box__cell:first-child {
      border-width: 0;
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 1 100%;
              flex: 0 1 100%; }
      .no-flexbox .pin-box__cell:first-child {
        border-width: 1px 0 0 0; }
  .pin-box--hero .pin-box__cell {
    padding-top: 30px; }
  @media only screen and (min-width: 48em) {
    .pin-box {
      margin-top: 18px; } }
  @media only screen and (min-width: 64em) {
    .pin-box {
      margin-top: 30px; }
      .pin-box__cell {
        padding-top: 15px;
        padding-bottom: 15px; } }
  @media only screen and (min-width: 90em) {
    .pin-box__cell {
      padding-top: 30px;
      padding-bottom: 30px; } }
  .no-flexbox .pin-box.stack {
    width: 100%; }

/* 4.13 Short list */
/*
Short List

A short list is used for title lists. The divider line is optional and can be set with a class on each list item (divider divider--bottom).

Styleguide 4.13
*/
.short-list__item {
  display: inline-block;
  width: 100%;
  padding-bottom: 24px; }
  .short-list__item:last-child {
    padding-bottom: 0; }

.short-list .meta {
  /* small meta*/
  font-size: 0.6875em;
  line-height: 1.09091; }

.short-list .location {
  /* small meta*/
  font-size: 0.75em;
  line-height: 1; }

.short-list .date {
  width: 33px;
  height: auto; }
  .short-list .date__head {
    padding: 3px;
    letter-spacing: .042em;
    font-size: 0.625em; }
  .short-list .date__body {
    padding: 0 0 3px 3px;
    font-size: 1.125em; }

@media only screen and (min-width: 32.5em) {
  .grid--musketeers .short-list .title {
    /* regular title*/
    font-size: 1em;
    line-height: 1.3125; }
  .grid--musketeers .short-list .meta {
    /* regular meta */
    font-size: 0.75em;
    line-height: 1.25; }
  .grid--musketeers .short-list .location {
    /* regular meta */
    font-size: 0.875em;
    line-height: 1.07143; }
  .grid--musketeers .short-list .date {
    width: 63px; }
    .grid--musketeers .short-list .date__head {
      padding: 6px;
      letter-spacing: .058em;
      font-size: 0.875em; }
    .grid--musketeers .short-list .date__body {
      padding: 0 0 6px 6px;
      font-size: 2.25em; } }

@media only screen and (min-width: 64em) {
  .grid--musketeers .short-list {
    /* Three-columns */ }
    .grid--musketeers .short-list .title {
      /* small title*/
      font-size: 0.75em;
      line-height: 1.5; }
    .grid--musketeers .short-list .meta {
      /* small meta*/
      font-size: 0.6875em;
      line-height: 1.09091; }
    .grid--musketeers .short-list .location {
      /* small meta*/
      font-size: 0.75em;
      line-height: 1; }
    .grid--musketeers .short-list .date {
      width: 33px;
      height: auto; }
      .grid--musketeers .short-list .date__head {
        padding: 3px;
        letter-spacing: .042em;
        font-size: 0.625em; }
      .grid--musketeers .short-list .date__body {
        padding: 0 0 3px 3px;
        font-size: 1.125em; }
  .grid--teletubbies .short-list {
    /* Two-columns */ }
    .grid--teletubbies .short-list .title {
      /* regular title*/
      font-size: 1em;
      line-height: 1.3125; }
    .grid--teletubbies .short-list .meta {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25; }
    .grid--teletubbies .short-list .location {
      /* regular meta */
      font-size: 0.875em;
      line-height: 1.07143; }
    .grid--teletubbies .short-list .date {
      width: 63px; }
      .grid--teletubbies .short-list .date__head {
        padding: 6px;
        letter-spacing: .058em;
        font-size: 0.875em; }
      .grid--teletubbies .short-list .date__body {
        padding: 0 0 6px 6px;
        font-size: 2.25em; } }

@media only screen and (min-width: 90em) {
  .grid--musketeers .short-list {
    /* Three-columns */ }
    .grid--musketeers .short-list .title {
      /* regular title*/
      font-size: 1em;
      line-height: 1.3125; }
    .grid--musketeers .short-list .meta {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25; }
    .grid--musketeers .short-list .location {
      /* regular meta */
      font-size: 0.875em;
      line-height: 1.07143; }
    .grid--musketeers .short-list .date {
      width: 63px; }
      .grid--musketeers .short-list .date__head {
        padding: 6px;
        letter-spacing: .058em;
        font-size: 0.875em; }
      .grid--musketeers .short-list .date__body {
        padding: 0 0 6px 6px;
        font-size: 2.25em; }
  .grid--teletubbies .short-list {
    /* Four-columns */ }
    .grid--teletubbies .short-list .title {
      /* small title*/
      font-size: 0.75em;
      line-height: 1.5; }
    .grid--teletubbies .short-list .meta {
      /* small meta*/
      font-size: 0.6875em;
      line-height: 1.09091; }
    .grid--teletubbies .short-list .location {
      /* small meta*/
      font-size: 0.75em;
      line-height: 1; }
    .grid--teletubbies .short-list .date {
      width: 33px;
      height: auto; }
      .grid--teletubbies .short-list .date__head {
        padding: 3px;
        letter-spacing: .042em;
        font-size: 0.625em; }
      .grid--teletubbies .short-list .date__body {
        padding: 0 0 3px 3px;
        font-size: 1.125em; } }

@media only screen and (min-width: 100em) {
  .grid--teletubbies .short-list {
    /* Four-columns */ }
    .grid--teletubbies .short-list .title {
      /* regular title*/
      font-size: 1em;
      line-height: 1.3125; }
    .grid--teletubbies .short-list .meta {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25; }
    .grid--teletubbies .short-list .location {
      /* regular meta */
      font-size: 0.875em;
      line-height: 1.07143; }
    .grid--teletubbies .short-list .date {
      width: 63px; }
      .grid--teletubbies .short-list .date__head {
        padding: 6px;
        letter-spacing: .058em;
        font-size: 0.875em; }
      .grid--teletubbies .short-list .date__body {
        padding: 0 0 6px 6px;
        font-size: 2.25em; } }

/*
Short List, with articles

markup:
<ul class="reset  |  short-list">
  <li class="short-list__item">
    <div class="meta  |  trailer--tiny"><time datetime="">25</time>-<time datetime="">30 September 2016</time></div>
    <a class="anchor--reset anchor--shy" href="javascript:void();">
      <h2 class="title">Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing</h2>
    </a>
    <p class="author  |  leader--tiny">
      by <a href="javascript:void();">Clayton Wilson</a>
    </p>
  </li>
</ul>

Styleguide 4.13.1
*/
/*
Short List, for events

markup:
<ul class="reset  |  short-list">
  <li class="short-list__item">
    <a class="anchor--reset anchor--shy  |  stack" href="javascript:void();">
      <div class="stack__unit stack__pin">
        <span class="date  |  gutter-outside">
          <span class="date__head">Dec</span>
          <span class="date__body">31</span>
        </span>
      </div>
      <div class="stack__unit">
        <h2 class="title">Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing</h2>
        <div class="meta  |  leader--tiny"><time datetime="">25</time>-<time datetime="">27 September 2017</time></div>
        <div class="location  |  leader--tiny">Brussels, Brussels, BE</div>
      </div>
    </a>
  </li>
</ul>

Styleguide 4.13.2
*/
/* 4.14 Looper */
/*
looper

Two stacked time periods, one active one inactive. Swapping them switches the active and inactive.

markup:
<div class="looper-group">
    <a class="looper looper--active  |  anchor--reset anchor--shy  |  title" href="javascript:void();">This month</a>
    <a class="looper looper--inactive  |  anchor--reset anchor--shy  |  title" href="javascript:void();">Last month</a>
</div>

Styleguide 4.14
*/
.looper {
  display: block;
  /* medium title*/
  font-size: 1.125em;
  line-height: 1.33333; }
  .looper--inactive {
    color: #cdcdcd;
    font-weight: 400; }
  .looper-group {
    margin-bottom: 21px; }
  @media only screen and (min-width: 48em) {
    .looper {
      /* medium title*/
      font-size: 1.25em;
      line-height: 1.35; } }

/* 4.15 Event row */
/*
Event row

markup:
<article class="media  |  trailer">
    <div class="media__figure  |  gutters gutter-mobile--right">
        <span class="date">
            <span class="date__head">Feb</span>
            <span class="date__body"> 4</span>
        </span>
    </div>
    <div class="media__content">
        <div class="media media--unfold">
            <div class="media__body  |  gutters  |  trailer">
                <a class="anchor--reset anchor--shy  |  stack" href="">
                    <h2 class="title title--tile">Capitalization of Experiences for Greater Impact in Rural Development - Senegal</h2>
                </a>
                <div class="leader--small">
                    <time class="meta" datetime="2018-02-04T00:00:00+00:00">Sunday, 4 February 2018</time>
                    <time class="meta" datetime="2018-02-09T23:59:59+00:00"> – Friday, 9 February 2018</time>
                </div>
                <div class="body--whisper  |  leader--small">
                    The “Capitalization of Experiences for Greater Impact in Rural Development” project aims to facilitate the adoption of an experience capitalization process in rural development initiatives, where it can help improve the analysis, documentation, sharing,
                    and the adoption and use of lessons and good practices – as an approach for continuous learning, improvement and scaling up. Representatives…
                </div>
            </div>
            <div class="media__figure  media__aside  |  wings  |  trailer">
                <div class="gutters">
                    <div class="media media--middle  |  location">
                        <span class="location__marker  |  media__figure"><span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">Location:</span></span></span>
                        <div class="location__body  |  media__content">Dakar, Senegal</div>
                    </div>
                    <div class="leader">
                        <ul class="reset label-list reset list--inline">
                            <li> <a class="label label--s" href="">Documentation</a>
                            </li>
                            <li> <a class="label label--s" href="">Rural development</a>
                            </li>
                            <li> <a class="label label--s" href="">organization</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</article>

Styleguide 4.15
*/
.article {
  padding-top: 12px;
  padding-bottom: 12px; }
  .article:first-child {
    padding-top: 0; }
  @media only screen and (max-width: 47.9375em) {
    .article {
      position: relative;
      padding-left: 60px; }
      .article .location {
        margin-top: 18px; } }
  .article .date-container {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto; }
    @media only screen and (max-width: 47.9375em) {
      .article .date-container {
        position: absolute;
        left: 15px; } }
  .article .label-list {
    display: inline-block; }
  @media only screen and (min-width: 64em) {
    .article {
      padding-top: 30px;
      padding-bottom: 30px; } }
  @media only screen and (max-width: 47.9375em) {
    .article .layout__cell--aside .gutters,
    .article .layout__cell:first-child {
      padding-left: 0; } }

/* 4.16 Teleport */
/*
Teleport

markup:
<div class="teleport  |  media">
	<h2 class="teleport__label  |  media__content media__stretcher  |  title  |  gutter">Container title</h2>
	<a class="teleport__trigger  |  media__image  |  icon icon--thin-arrow" href="javascript:void()"><span class="is-narrative">View all in Container title</span></a>
</div>

Styleguide 4.16
*/
.teleport + .teleport {
  margin-top: 12px; }

.teleport__label {
  line-height: 1.125; }

.teleport__trigger {
  line-height: 1em; }

.teleport__trigger:before {
  position: relative;
  top: 0.08em;
  font-size: 2em;
  color: #67ab43; }
  .teleport__trigger:before.theme--dark,
  .theme--dark .teleport__trigger:before,
  .theme .theme.theme--dark .teleport__trigger:before {
    color: #3d3d3d; }
  .teleport__trigger:before.theme--green,
  .theme--green .teleport__trigger:before,
  .theme .theme.theme--green .teleport__trigger:before {
    color: #67ab43; }
  .teleport__trigger:before.theme--blue,
  .theme--blue .teleport__trigger:before,
  .theme .theme.theme--blue .teleport__trigger:before {
    color: #56c0dd; }
  .teleport__trigger:before.theme--lime,
  .theme--lime .teleport__trigger:before,
  .theme .theme.theme--lime .teleport__trigger:before {
    color: #c1d435; }
  .teleport__trigger:before.theme--yellow,
  .theme--yellow .teleport__trigger:before,
  .theme .theme.theme--yellow .teleport__trigger:before {
    color: #facf21; }
  .teleport__trigger:before.theme--gold,
  .theme--gold .teleport__trigger:before,
  .theme .theme.theme--gold .teleport__trigger:before {
    color: #eb942c; }
  .teleport__trigger:before.theme--orange,
  .theme--orange .teleport__trigger:before,
  .theme .theme.theme--orange .teleport__trigger:before {
    color: #e26435; }
  .teleport__trigger:before.theme--salmon,
  .theme--salmon .teleport__trigger:before,
  .theme .theme.theme--salmon .teleport__trigger:before {
    color: #eb735d; }
  .teleport__trigger:before.theme--red,
  .theme--red .teleport__trigger:before,
  .theme .theme.theme--red .teleport__trigger:before {
    color: #ec2d10; }
  .teleport__trigger:before.theme--burgundy,
  .theme--burgundy .teleport__trigger:before,
  .theme .theme.theme--burgundy .teleport__trigger:before {
    color: #ba222a; }
  .teleport__trigger:before.theme--purple,
  .theme--purple .teleport__trigger:before,
  .theme .theme.theme--purple .teleport__trigger:before {
    color: #9b3381; }
  .teleport__trigger:before.theme--youth,
  .theme--youth .teleport__trigger:before,
  .theme .theme.theme--youth .teleport__trigger:before {
    color: #d57800; }
  .teleport__trigger:before.theme--digitalisation,
  .theme--digitalisation .teleport__trigger:before,
  .theme .theme.theme--digitalisation .teleport__trigger:before {
    color: #9a3324; }
  .teleport__trigger:before.theme--climate,
  .theme--climate .teleport__trigger:before,
  .theme .theme.theme--climate .teleport__trigger:before {
    color: #693c5e; }
  .teleport__trigger:before.theme--gender,
  .theme--gender .teleport__trigger:before,
  .theme .theme.theme--gender .teleport__trigger:before {
    color: #046a38; }
  .teleport__trigger:before.theme--nutrition,
  .theme--nutrition .teleport__trigger:before,
  .theme .theme.theme--nutrition .teleport__trigger:before {
    color: #487a7b; }
  .teleport__trigger:before.theme--blog,
  .theme--blog .teleport__trigger:before,
  .theme .theme.theme--blog .teleport__trigger:before {
    color: #ffa300; }
  .teleport__trigger:before.theme--spore-blue,
  .theme--spore-blue .teleport__trigger:before,
  .theme .theme.theme--spore-blue .teleport__trigger:before {
    color: #3f68b1; }
  .teleport__trigger:before.theme--spore-brown,
  .theme--spore-brown .teleport__trigger:before,
  .theme .theme.theme--spore-brown .teleport__trigger:before {
    color: #774b04; }
  .teleport__trigger:before.theme--spore-dark-blue,
  .theme--spore-dark-blue .teleport__trigger:before,
  .theme .theme.theme--spore-dark-blue .teleport__trigger:before {
    color: #044e7e; }
  .teleport__trigger:before.theme--spore-forest-green,
  .theme--spore-forest-green .teleport__trigger:before,
  .theme .theme.theme--spore-forest-green .teleport__trigger:before {
    color: #5f810a; }
  .teleport__trigger:before.theme--spore-grey-blue,
  .theme--spore-grey-blue .teleport__trigger:before,
  .theme .theme.theme--spore-grey-blue .teleport__trigger:before {
    color: #6d8c9f; }
  .teleport__trigger:before.theme--spore-light-blue,
  .theme--spore-light-blue .teleport__trigger:before,
  .theme .theme.theme--spore-light-blue .teleport__trigger:before {
    color: #79accf; }
  .teleport__trigger:before.theme--spore-lime,
  .theme--spore-lime .teleport__trigger:before,
  .theme .theme.theme--spore-lime .teleport__trigger:before {
    color: #bbae03; }
  .teleport__trigger:before.theme--spore-ochre,
  .theme--spore-ochre .teleport__trigger:before,
  .theme .theme.theme--spore-ochre .teleport__trigger:before {
    color: #db9623; }
  .teleport__trigger:before.theme--spore-olive-green,
  .theme--spore-olive-green .teleport__trigger:before,
  .theme .theme.theme--spore-olive-green .teleport__trigger:before {
    color: #778d3e; }
  .teleport__trigger:before.theme--spore-red,
  .theme--spore-red .teleport__trigger:before,
  .theme .theme.theme--spore-red .teleport__trigger:before {
    color: #f54c23; }
  .teleport__trigger:before.theme--spore-taupe,
  .theme--spore-taupe .teleport__trigger:before,
  .theme .theme.theme--spore-taupe .teleport__trigger:before {
    color: #7b6d65; }
  .teleport__trigger:before.theme--spore-teal,
  .theme--spore-teal .teleport__trigger:before,
  .theme .theme.theme--spore-teal .teleport__trigger:before {
    color: #077fc1; }

.no-flexbox .teleport__label {
  width: 75%; }

.teleport--inverse,
.teleport--inverse .teleport__trigger:before {
  color: #fff; }

.teleport--reverse .teleport__trigger {
  -webkit-transform: scaleX(-1);
  -moz-transform: scaleX(-1);
   -ms-transform: scaleX(-1);
       transform: scaleX(-1); }

/* 4.17 Illustration set */
/*
Illustration set

This illustration set is used at the bottom of search elements.

markup:
<div class="search__illustrations-set">
    <span class="search__illustration illustration illustration--fish-market"></span>
    <span class="search__illustration illustration illustration--fishing-shore"></span>
    <span class="search__illustration illustration illustration--fishing-boat"></span>
    <span class="water-illustration"></span>
</div>

sg-wrapper:
<div class="well  |  is-root" style="height: 250px;">
  <sg-wrapper-content/>
</div>

Styleguide 4.17
*/
.search__illustrations-set {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%; }

.search__illustration {
  position: relative;
  vertical-align: bottom;
  display: inline-block;
  color: #fff; }
  .search__illustration.illustration {
    z-index: 10; }
    .search__illustration.illustration--fish-market {
      position: absolute;
      bottom: -1px;
      font-size: 4.375em;
      margin-left: 30px;
      display: none; }
      @media only screen and (min-width: 48em) {
        .search__illustration.illustration--fish-market {
          display: block; } }
    .search__illustration.illustration--fishing-shore, .search__illustration.illustration--fishing-boat {
      position: absolute;
      font-size: 7.5em; }
    .search__illustration.illustration--fish-barn {
      display: none;
      position: absolute;
      font-size: 3.9375em;
      bottom: 0; }
      @media only screen and (min-width: 48em) {
        .search__illustration.illustration--fish-barn {
          display: block;
          left: auto;
          margin-left: 5.55556%; } }
    .search__illustration.illustration--fishing-shore {
      left: -6px;
      bottom: -68px; }
      @media only screen and (min-width: 48em) {
        .search__illustration.illustration--fishing-shore {
          left: auto;
          margin-left: 33.33333%; } }
      @media only screen and (min-width: 64em) {
        .search__illustration.illustration--fishing-shore {
          margin-left: 38.88889%; } }
    .search__illustration.illustration--fishing-boat {
      margin-left: 66.66667%;
      display: none;
      bottom: -66px; }
      @media only screen and (min-width: 48em) {
        .search__illustration.illustration--fishing-boat {
          display: block; } }
      @media only screen and (min-width: 64em) {
        .search__illustration.illustration--fishing-boat {
          margin-left: 72.22222%; } }

.water-illustration {
  -webkit-mask-image: url("/images/line-art/water.svg");
          mask-image: url("/images/line-art/water.svg");
  background-color: #fff;
  background-repeat: repeat-x;
  color: #000;
  position: absolute;
  bottom: -1px;
  right: 0;
  width: 100%;
  height: 5px; }
  @media only screen and (min-width: 48em) {
    .water-illustration {
      width: 55.55556%; } }
  @media only screen and (min-width: 90em) {
    .water-illustration {
      width: 61.11111%; } }

/* 4.19 Panel */
/*
Panel

Used for tabbed content. Can be used in combination with block-links.

markup:
<div class="panel-group">
  <section class="is-inactive  |  panel" id="panel1">
    <h2 class="title">
      <a class="panel__trigger  |  gutters" href="#panel1">Panel 1</a>
    </h2>
    <div class="panel__body  |  gutters">
      Panel 1
    </div>
  </section>
  <section class="is-inactive  |  panel" id="panel2">
    <h2 class="title">
      <a class="panel__trigger  |  gutters" href="#panel2">Panel 2</a>
    </h2>
    <div class="panel__body  |  gutters">
      Panel 2
    </div>
  </section>
  <section class="is-active  |  panel" id="panel3">
    <h2 class="title">
      <a class="panel__trigger  |  gutters" href="#panel3">Panel 3</a>
    </h2>
    <div class="panel__body  |  gutters">
      Panel 3
    </div>
  </section>
  <section class="is-inactive  |  panel" id="panel4">
    <h2 class="title">
      <a class="panel__trigger  |  gutters" href="#panel4">Panel 4</a>
    </h2>
    <div class="panel__body  |  gutters">
      Panel 4
    </div>
  </section>
</div>

Styleguide 4.19
*/
.panel {
  padding-top: 18px;
  padding-bottom: 18px;
  border: 1px solid #67ab43;
  border-width: 1px 0 0;
  border-color: #d7e9ce; }
  .panel.theme--dark,
  .theme--dark .panel,
  .theme .theme--dark .panel {
    border-color: #cdcdcd; }
  .panel.theme--green,
  .theme--green .panel,
  .theme .theme--green .panel {
    border-color: #d7e9ce; }
  .panel.theme--blue,
  .theme--blue .panel,
  .theme .theme--blue .panel {
    border-color: #d3eff6; }
  .panel.theme--lime,
  .theme--lime .panel,
  .theme .theme--lime .panel {
    border-color: #eff4ca; }
  .panel.theme--yellow,
  .theme--yellow .panel,
  .theme .theme--yellow .panel {
    border-color: #fef3c5; }
  .panel.theme--gold,
  .theme--gold .panel,
  .theme .theme--gold .panel {
    border-color: #fae3c8; }
  .panel.theme--orange,
  .theme--orange .panel,
  .theme .theme--orange .panel {
    border-color: #f7d7ca; }
  .panel.theme--salmon,
  .theme--salmon .panel,
  .theme .theme--salmon .panel {
    border-color: #fadbd5; }
  .panel.theme--red,
  .theme--red .panel,
  .theme .theme--red .panel {
    border-color: #fac8c1; }
  .panel.theme--burgundy,
  .theme--burgundy .panel,
  .theme .theme--burgundy .panel {
    border-color: #edc6c8; }
  .panel.theme--purple,
  .theme--purple .panel,
  .theme .theme--purple .panel {
    border-color: #e5cade; }
  .panel.theme--youth,
  .theme--youth .panel,
  .theme .theme--youth .panel {
    border-color: #f4dcbd; }
  .panel.theme--digitalisation,
  .theme--digitalisation .panel,
  .theme .theme--digitalisation .panel {
    border-color: #e5cac6; }
  .panel.theme--climate,
  .theme--climate .panel,
  .theme .theme--climate .panel {
    border-color: #d8ccd5; }
  .panel.theme--gender,
  .theme--gender .panel,
  .theme .theme--gender .panel {
    border-color: #bed8cb; }
  .panel.theme--nutrition,
  .theme--nutrition .panel,
  .theme .theme--nutrition .panel {
    border-color: #cfdcdd; }
  .panel.theme--blog,
  .theme--blog .panel,
  .theme .theme--blog .panel {
    border-color: #ffe7bd; }
  .panel.theme--spore-blue,
  .theme--spore-blue .panel,
  .theme .theme--spore-blue .panel {
    border-color: #cdd8eb; }
  .panel.theme--spore-brown,
  .theme--spore-brown .panel,
  .theme .theme--spore-brown .panel {
    border-color: #dcd0be; }
  .panel.theme--spore-dark-blue,
  .theme--spore-dark-blue .panel,
  .theme .theme--spore-dark-blue .panel {
    border-color: #bed1dd; }
  .panel.theme--spore-forest-green,
  .theme--spore-forest-green .panel,
  .theme .theme--spore-forest-green .panel {
    border-color: #d5debf; }
  .panel.theme--spore-grey-blue,
  .theme--spore-grey-blue .panel,
  .theme .theme--spore-grey-blue .panel {
    border-color: #d9e1e6; }
  .panel.theme--spore-light-blue,
  .theme--spore-light-blue .panel,
  .theme .theme--spore-light-blue .panel {
    border-color: #dce9f3; }
  .panel.theme--spore-lime,
  .theme--spore-lime .panel,
  .theme .theme--spore-lime .panel {
    border-color: #edeabd; }
  .panel.theme--spore-ochre,
  .theme--spore-ochre .panel,
  .theme .theme--spore-ochre .panel {
    border-color: #f6e4c6; }
  .panel.theme--spore-olive-green,
  .theme--spore-olive-green .panel,
  .theme .theme--spore-olive-green .panel {
    border-color: #dce1cd; }
  .panel.theme--spore-red,
  .theme--spore-red .panel,
  .theme .theme--spore-red .panel {
    border-color: #fcd0c6; }
  .panel.theme--spore-taupe,
  .theme--spore-taupe .panel,
  .theme .theme--spore-taupe .panel {
    border-color: #ddd9d7; }
  .panel.theme--spore-teal,
  .theme--spore-teal .panel,
  .theme .theme--spore-teal .panel {
    border-color: #bfdeef; }
  .panel:first-child.is-active {
    padding-top: 0;
    border-top: 0; }
  .panel:last-child {
    border-width: 1px 0; }
  .panel.is-active + .panel.is-active {
    margin-top: 45px; }
  .panel__trigger {
    /* medium title*/
    font-size: 1.125em;
    line-height: 1.33333;
    display: block;
    color: inherit;
    margin-bottom: 15px; }
  .panel.is-inactive .panel__body {
    display: none; }
  .panel.is-inactive .panel__trigger {
    margin-bottom: 0px; }
    .panel.is-inactive .panel__trigger:after {
      float: right;
      content: "";
      color: #67ab43; }
      .panel.is-inactive .panel__trigger:after.theme--dark,
      .theme--dark .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--dark .panel.is-inactive .panel__trigger:after {
        color: #3d3d3d; }
      .panel.is-inactive .panel__trigger:after.theme--green,
      .theme--green .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--green .panel.is-inactive .panel__trigger:after {
        color: #67ab43; }
      .panel.is-inactive .panel__trigger:after.theme--blue,
      .theme--blue .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--blue .panel.is-inactive .panel__trigger:after {
        color: #56c0dd; }
      .panel.is-inactive .panel__trigger:after.theme--lime,
      .theme--lime .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--lime .panel.is-inactive .panel__trigger:after {
        color: #c1d435; }
      .panel.is-inactive .panel__trigger:after.theme--yellow,
      .theme--yellow .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--yellow .panel.is-inactive .panel__trigger:after {
        color: #facf21; }
      .panel.is-inactive .panel__trigger:after.theme--gold,
      .theme--gold .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--gold .panel.is-inactive .panel__trigger:after {
        color: #eb942c; }
      .panel.is-inactive .panel__trigger:after.theme--orange,
      .theme--orange .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--orange .panel.is-inactive .panel__trigger:after {
        color: #e26435; }
      .panel.is-inactive .panel__trigger:after.theme--salmon,
      .theme--salmon .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--salmon .panel.is-inactive .panel__trigger:after {
        color: #eb735d; }
      .panel.is-inactive .panel__trigger:after.theme--red,
      .theme--red .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--red .panel.is-inactive .panel__trigger:after {
        color: #ec2d10; }
      .panel.is-inactive .panel__trigger:after.theme--burgundy,
      .theme--burgundy .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--burgundy .panel.is-inactive .panel__trigger:after {
        color: #ba222a; }
      .panel.is-inactive .panel__trigger:after.theme--purple,
      .theme--purple .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--purple .panel.is-inactive .panel__trigger:after {
        color: #9b3381; }
      .panel.is-inactive .panel__trigger:after.theme--youth,
      .theme--youth .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--youth .panel.is-inactive .panel__trigger:after {
        color: #d57800; }
      .panel.is-inactive .panel__trigger:after.theme--digitalisation,
      .theme--digitalisation .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--digitalisation .panel.is-inactive .panel__trigger:after {
        color: #9a3324; }
      .panel.is-inactive .panel__trigger:after.theme--climate,
      .theme--climate .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--climate .panel.is-inactive .panel__trigger:after {
        color: #693c5e; }
      .panel.is-inactive .panel__trigger:after.theme--gender,
      .theme--gender .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--gender .panel.is-inactive .panel__trigger:after {
        color: #046a38; }
      .panel.is-inactive .panel__trigger:after.theme--nutrition,
      .theme--nutrition .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--nutrition .panel.is-inactive .panel__trigger:after {
        color: #487a7b; }
      .panel.is-inactive .panel__trigger:after.theme--blog,
      .theme--blog .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--blog .panel.is-inactive .panel__trigger:after {
        color: #ffa300; }
      .panel.is-inactive .panel__trigger:after.theme--spore-blue,
      .theme--spore-blue .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-blue .panel.is-inactive .panel__trigger:after {
        color: #3f68b1; }
      .panel.is-inactive .panel__trigger:after.theme--spore-brown,
      .theme--spore-brown .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-brown .panel.is-inactive .panel__trigger:after {
        color: #774b04; }
      .panel.is-inactive .panel__trigger:after.theme--spore-dark-blue,
      .theme--spore-dark-blue .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-dark-blue .panel.is-inactive .panel__trigger:after {
        color: #044e7e; }
      .panel.is-inactive .panel__trigger:after.theme--spore-forest-green,
      .theme--spore-forest-green .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-forest-green .panel.is-inactive .panel__trigger:after {
        color: #5f810a; }
      .panel.is-inactive .panel__trigger:after.theme--spore-grey-blue,
      .theme--spore-grey-blue .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-grey-blue .panel.is-inactive .panel__trigger:after {
        color: #6d8c9f; }
      .panel.is-inactive .panel__trigger:after.theme--spore-light-blue,
      .theme--spore-light-blue .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-light-blue .panel.is-inactive .panel__trigger:after {
        color: #79accf; }
      .panel.is-inactive .panel__trigger:after.theme--spore-lime,
      .theme--spore-lime .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-lime .panel.is-inactive .panel__trigger:after {
        color: #bbae03; }
      .panel.is-inactive .panel__trigger:after.theme--spore-ochre,
      .theme--spore-ochre .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-ochre .panel.is-inactive .panel__trigger:after {
        color: #db9623; }
      .panel.is-inactive .panel__trigger:after.theme--spore-olive-green,
      .theme--spore-olive-green .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-olive-green .panel.is-inactive .panel__trigger:after {
        color: #778d3e; }
      .panel.is-inactive .panel__trigger:after.theme--spore-red,
      .theme--spore-red .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-red .panel.is-inactive .panel__trigger:after {
        color: #f54c23; }
      .panel.is-inactive .panel__trigger:after.theme--spore-taupe,
      .theme--spore-taupe .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-taupe .panel.is-inactive .panel__trigger:after {
        color: #7b6d65; }
      .panel.is-inactive .panel__trigger:after.theme--spore-teal,
      .theme--spore-teal .panel.is-inactive .panel__trigger:after,
      .theme .theme.theme--spore-teal .panel.is-inactive .panel__trigger:after {
        color: #077fc1; }
  @media only screen and (min-width: 64em) {
    .panel {
      border: 0;
      padding-top: 0;
      padding-bottom: 0; }
      .panel.is-active + .panel.is-active {
        margin-top: 105px; }
      .panel__trigger {
        margin-bottom: 30px;
        /* medium title*/
        font-size: 1.25em;
        line-height: 1.35; }
      .panel__title {
        font-family: Georgia, "Times New Roman", Times, serif;
        font-weight: 300;
        /* medium title*/
        font-size: 1.25em;
        line-height: 1.35;
        text-transform: none; }
      .panel.is-inactive .panel__trigger {
        display: none; } }

/* 4.20 Mini-map */
/*
Mini-map

markup:
<div class="mini-map  |  well well--neutral">
  <div class="mini-map__map">
    <div style="height: 224px; background-color: #333;"></div>
  </div>
  <div class="mini-map__asset  |  divider divider--inverse divider--top  |  gutters  |  trailer-inside--small  |  leader-inside--small">
    <sg-insert>3.19.1</sg-insert>
  </div>
  <div class="mini-map__asset  |  divider divider--inverse divider--top  |  gutters  |  trailer-inside--small  |  leader-inside--small">
    <div class="media  |  location">
      <span class="icon icon--theme icon--link"></span>
      <div class="location__body  |  media__content">
        <a class="is-heir" href="javascript:void();">Visit the website</a>
      </div>
    </div>
  </div>
</div>

Styleguide 4.20
*/
.mini-map__map {
  padding: 9px; }
  .mini-map__map .tab-teaser__panel--map {
    overflow: hidden;
    height: 250px; }

/*
Mini-map statistics

markup:
<div class="mini-map-statistics  |  well well--neutral">
  <div class="mini-map__map">
    <div style="height: 224px; background-color: #333;"></div>
  </div>
  <div class="mini-map__asset  |  divider divider--inverse divider--top  |  gutters  |  trailer-inside--small  |  leader-inside--small">
    <span class="icon  icon--download"></span>
    <div class="map-statistic">
      <div class="title title--tile">2,546,133</div>
      <div class="meta">Euros</div>
    </div>
  </div>
  <div class="mini-map__asset  |  divider divider--inverse divider--top  |  gutters  |  trailer-inside--small  |  leader-inside--small">
  </div>
</div>

sg-wrapper:
<div style="width:400px;">
  <sg-wrapper-content/>
</div>

Styleguide 4.20.1
*/
.mini-map-statistics .mini-map__asset {
  display: inline-block;
  width: 100%;
  vertical-align: top; }

.mini-map-statistics .icon, .mini-map-statistics .list--take-aways li:before, .list--take-aways .mini-map-statistics li:before, .mini-map-statistics .list--theme li:before, .list--theme .mini-map-statistics li:before, .mini-map-statistics .filter__trigger:after, .mini-map-statistics .block-link--icon:before, .mini-map-statistics .panel.is-inactive .panel__trigger:after, .panel.is-inactive .mini-map-statistics .panel__trigger:after, .mini-map-statistics .tail__lengthen:before, .mini-map-statistics .tail__lengthen:after, .mini-map-statistics .tail__shorten:before, .mini-map-statistics .tail__shorten:after {
  font-size: 1.5em;
  float: left;
  color: #cdcdcd; }

.mini-map-statistics .map-statistic {
  float: right; }
  .mini-map-statistics .map-statistic > div {
    display: inline; }

/* 4.21 Container header */
/*
Container header

.container-header - Container header
.container-header.container-header--slim-fit - Removes margin from top and bottom

markup:
<header class="wings  |  {$modifiers}">
    <h2 class="container-header__title  |  title title--container trailer-inside--tiny  |  gutters">
        Upcoming events
    </h2>
    <div class="container-header__filter  |  gutters">
        <div class="filter is-inactive" id="event-sort-by3">
            <button class="filter__trigger  |  title" data-toggle="#event-sort-by3">Sort by</button>
            <ul class="filter__options  |  reset  |  fx">
                <li><a class="filter__item  |  fx" href="?sortProperty=startDateUTC&amp;sortDirection=desc" data-action="ajax" data-target="#somecontainer">Date (newer-older)</a></li>
                <li><a class="filter__item  filter__item--selected  |  fx" href="?sortProperty=startDateUTC&amp;sortDirection=asc">Date (older-newer)</a></li>
                <li><a class="filter__item  |  fx" href="?sortProperty=name&amp;sortDirection=desc">Alphabetical order (A-Z)</a></li>
                <li><a class="filter__item  |  fx" href="?sortProperty=name&amp;sortDirection=asc">Alphabetical order (Z-A)</a></li>
            </ul>
        </div>
        <div class="filter is-inactive" id="event-filter-by2">
            <button class="filter__trigger  |  title" data-toggle="#event-filter-by2">Filter by</button>
            <ul class="filter__options  |  reset  |  fx">
                <li><a class="filter__item  |  fx filter__item--selected" href="?upcoming=true">Upcoming</a></li>
                <li><a class="filter__item  |  fx" href="?upcoming=false&amp;sortProperty=startDateUTC&amp;sortDirection=desc">Passed</a></li>
            </ul>
        </div>
    </div>
</header>

Styleguide 4.21
*/
.container-header {
  /**
  * For IE 6/7 only
  */
  margin-top: 33px;
  margin-bottom: 30px; }
  .container-header::before, .container-header::after {
    content: " ";
    display: table; }
  .container-header::after {
    clear: both; }
  .container-header__title, .container-header__filter {
    display: inline-block;
    width: 100%; }
  .container-header__title {
    float: left; }
  .container-header__title + .container-header__filter {
    margin-top: 15px; }
  @media only screen and (min-width: 64em) {
    .container-header {
      margin-top: 45px;
      margin-bottom: 45px; }
      .container-header__title + .container-header__filter {
        margin-top: 9px; }
      .container-header__filter {
        float: right; }
      .container-header__title, .container-header__filter {
        width: auto; } }
  @media only screen and (min-width: 90em) {
    .container-header {
      margin-top: 90px;
      margin-bottom: 81px; } }
  .container-header--slim-fit {
    margin-top: 0;
    margin-bottom: 0; }
  .container-header--filter {
    margin-top: 0; }

/* 4.22 Tail */
/*
Tail

markup:
<div class="tail">
    <ul class="tail__body  |  reset  |  short-list  |  fx">
        <li class="short-list__item">
            <div class="post">
                <div class="post__content  |  leader-inside">
                    <time class="meta" datetime="2017-10-20T04:16:28+00:00">20 October 2017</time>
                    <h3 class="title  |  anchor--reset">
                        <a class="anchor anchor--shy  |  is-heir" href="">
                            Agritourism - a driver for rural incomes in Pacific island states
                        </a>
                    </h3>
                </div>
            </div>
        </li>
        <li class="short-list__item">
            <div class="post">
                <div class="post__content  |  leader-inside">
                    <time class="meta" datetime="2017-10-19T04:32:03+00:00">19 October 2017</time>
                    <h3 class="title  |  anchor--reset">
                        <a class="anchor anchor--shy  |  is-heir" href="">
                            A dynamic future for young agripreneurs
                        </a>
                    </h3>
                </div>
            </div>
        </li>
        <li class="short-list__item">
            <div class="post">
                <div class="post__content  |  leader-inside">
                    <time class="meta" datetime="2017-10-18T04:46:46+00:00">18 October 2017</time>
                    <h3 class="title  |  anchor--reset">
                        <a class="anchor anchor--shy  |  is-heir" href="">
                            A shared journey of learning at the Pacific Week of Agriculture
                        </a>
                    </h3>
                </div>
            </div>
        </li>
    </ul>
</div>

Styleguide 4.22
*/
.tail {
  border-bottom: 1px solid;
  border-color: #d7e9ce;
  padding-bottom: 18px;
  margin-top: 18px;
  margin-bottom: 36px; }
  .tail.theme--dark,
  .theme--dark .tail,
  .theme .theme--dark .tail {
    border-color: #cdcdcd; }
  .tail.theme--green,
  .theme--green .tail,
  .theme .theme--green .tail {
    border-color: #d7e9ce; }
  .tail.theme--blue,
  .theme--blue .tail,
  .theme .theme--blue .tail {
    border-color: #d3eff6; }
  .tail.theme--lime,
  .theme--lime .tail,
  .theme .theme--lime .tail {
    border-color: #eff4ca; }
  .tail.theme--yellow,
  .theme--yellow .tail,
  .theme .theme--yellow .tail {
    border-color: #fef3c5; }
  .tail.theme--gold,
  .theme--gold .tail,
  .theme .theme--gold .tail {
    border-color: #fae3c8; }
  .tail.theme--orange,
  .theme--orange .tail,
  .theme .theme--orange .tail {
    border-color: #f7d7ca; }
  .tail.theme--salmon,
  .theme--salmon .tail,
  .theme .theme--salmon .tail {
    border-color: #fadbd5; }
  .tail.theme--red,
  .theme--red .tail,
  .theme .theme--red .tail {
    border-color: #fac8c1; }
  .tail.theme--burgundy,
  .theme--burgundy .tail,
  .theme .theme--burgundy .tail {
    border-color: #edc6c8; }
  .tail.theme--purple,
  .theme--purple .tail,
  .theme .theme--purple .tail {
    border-color: #e5cade; }
  .tail.theme--youth,
  .theme--youth .tail,
  .theme .theme--youth .tail {
    border-color: #f4dcbd; }
  .tail.theme--digitalisation,
  .theme--digitalisation .tail,
  .theme .theme--digitalisation .tail {
    border-color: #e5cac6; }
  .tail.theme--climate,
  .theme--climate .tail,
  .theme .theme--climate .tail {
    border-color: #d8ccd5; }
  .tail.theme--gender,
  .theme--gender .tail,
  .theme .theme--gender .tail {
    border-color: #bed8cb; }
  .tail.theme--nutrition,
  .theme--nutrition .tail,
  .theme .theme--nutrition .tail {
    border-color: #cfdcdd; }
  .tail.theme--blog,
  .theme--blog .tail,
  .theme .theme--blog .tail {
    border-color: #ffe7bd; }
  .tail.theme--spore-blue,
  .theme--spore-blue .tail,
  .theme .theme--spore-blue .tail {
    border-color: #cdd8eb; }
  .tail.theme--spore-brown,
  .theme--spore-brown .tail,
  .theme .theme--spore-brown .tail {
    border-color: #dcd0be; }
  .tail.theme--spore-dark-blue,
  .theme--spore-dark-blue .tail,
  .theme .theme--spore-dark-blue .tail {
    border-color: #bed1dd; }
  .tail.theme--spore-forest-green,
  .theme--spore-forest-green .tail,
  .theme .theme--spore-forest-green .tail {
    border-color: #d5debf; }
  .tail.theme--spore-grey-blue,
  .theme--spore-grey-blue .tail,
  .theme .theme--spore-grey-blue .tail {
    border-color: #d9e1e6; }
  .tail.theme--spore-light-blue,
  .theme--spore-light-blue .tail,
  .theme .theme--spore-light-blue .tail {
    border-color: #dce9f3; }
  .tail.theme--spore-lime,
  .theme--spore-lime .tail,
  .theme .theme--spore-lime .tail {
    border-color: #edeabd; }
  .tail.theme--spore-ochre,
  .theme--spore-ochre .tail,
  .theme .theme--spore-ochre .tail {
    border-color: #f6e4c6; }
  .tail.theme--spore-olive-green,
  .theme--spore-olive-green .tail,
  .theme .theme--spore-olive-green .tail {
    border-color: #dce1cd; }
  .tail.theme--spore-red,
  .theme--spore-red .tail,
  .theme .theme--spore-red .tail {
    border-color: #fcd0c6; }
  .tail.theme--spore-taupe,
  .theme--spore-taupe .tail,
  .theme .theme--spore-taupe .tail {
    border-color: #ddd9d7; }
  .tail.theme--spore-teal,
  .theme--spore-teal .tail,
  .theme .theme--spore-teal .tail {
    border-color: #bfdeef; }
  .tail__body {
    min-height: 0;
    height: 0;
    overflow: hidden; }
    .is-active .tail__body {
      height: auto;
      min-height: 100px; }
  .tail__lengthen, .tail__shorten {
    color: #67ab43;
    display: inline-block;
    width: 100%;
    text-align: center; }
    .tail__lengthen.theme--dark,
    .theme--dark .tail__lengthen,
    .theme .theme.theme--dark .tail__lengthen, .tail__shorten.theme--dark,
    .theme--dark .tail__shorten,
    .theme .theme.theme--dark .tail__shorten {
      color: #3d3d3d; }
    .tail__lengthen.theme--green,
    .theme--green .tail__lengthen,
    .theme .theme.theme--green .tail__lengthen, .tail__shorten.theme--green,
    .theme--green .tail__shorten,
    .theme .theme.theme--green .tail__shorten {
      color: #67ab43; }
    .tail__lengthen.theme--blue,
    .theme--blue .tail__lengthen,
    .theme .theme.theme--blue .tail__lengthen, .tail__shorten.theme--blue,
    .theme--blue .tail__shorten,
    .theme .theme.theme--blue .tail__shorten {
      color: #56c0dd; }
    .tail__lengthen.theme--lime,
    .theme--lime .tail__lengthen,
    .theme .theme.theme--lime .tail__lengthen, .tail__shorten.theme--lime,
    .theme--lime .tail__shorten,
    .theme .theme.theme--lime .tail__shorten {
      color: #c1d435; }
    .tail__lengthen.theme--yellow,
    .theme--yellow .tail__lengthen,
    .theme .theme.theme--yellow .tail__lengthen, .tail__shorten.theme--yellow,
    .theme--yellow .tail__shorten,
    .theme .theme.theme--yellow .tail__shorten {
      color: #facf21; }
    .tail__lengthen.theme--gold,
    .theme--gold .tail__lengthen,
    .theme .theme.theme--gold .tail__lengthen, .tail__shorten.theme--gold,
    .theme--gold .tail__shorten,
    .theme .theme.theme--gold .tail__shorten {
      color: #eb942c; }
    .tail__lengthen.theme--orange,
    .theme--orange .tail__lengthen,
    .theme .theme.theme--orange .tail__lengthen, .tail__shorten.theme--orange,
    .theme--orange .tail__shorten,
    .theme .theme.theme--orange .tail__shorten {
      color: #e26435; }
    .tail__lengthen.theme--salmon,
    .theme--salmon .tail__lengthen,
    .theme .theme.theme--salmon .tail__lengthen, .tail__shorten.theme--salmon,
    .theme--salmon .tail__shorten,
    .theme .theme.theme--salmon .tail__shorten {
      color: #eb735d; }
    .tail__lengthen.theme--red,
    .theme--red .tail__lengthen,
    .theme .theme.theme--red .tail__lengthen, .tail__shorten.theme--red,
    .theme--red .tail__shorten,
    .theme .theme.theme--red .tail__shorten {
      color: #ec2d10; }
    .tail__lengthen.theme--burgundy,
    .theme--burgundy .tail__lengthen,
    .theme .theme.theme--burgundy .tail__lengthen, .tail__shorten.theme--burgundy,
    .theme--burgundy .tail__shorten,
    .theme .theme.theme--burgundy .tail__shorten {
      color: #ba222a; }
    .tail__lengthen.theme--purple,
    .theme--purple .tail__lengthen,
    .theme .theme.theme--purple .tail__lengthen, .tail__shorten.theme--purple,
    .theme--purple .tail__shorten,
    .theme .theme.theme--purple .tail__shorten {
      color: #9b3381; }
    .tail__lengthen.theme--youth,
    .theme--youth .tail__lengthen,
    .theme .theme.theme--youth .tail__lengthen, .tail__shorten.theme--youth,
    .theme--youth .tail__shorten,
    .theme .theme.theme--youth .tail__shorten {
      color: #d57800; }
    .tail__lengthen.theme--digitalisation,
    .theme--digitalisation .tail__lengthen,
    .theme .theme.theme--digitalisation .tail__lengthen, .tail__shorten.theme--digitalisation,
    .theme--digitalisation .tail__shorten,
    .theme .theme.theme--digitalisation .tail__shorten {
      color: #9a3324; }
    .tail__lengthen.theme--climate,
    .theme--climate .tail__lengthen,
    .theme .theme.theme--climate .tail__lengthen, .tail__shorten.theme--climate,
    .theme--climate .tail__shorten,
    .theme .theme.theme--climate .tail__shorten {
      color: #693c5e; }
    .tail__lengthen.theme--gender,
    .theme--gender .tail__lengthen,
    .theme .theme.theme--gender .tail__lengthen, .tail__shorten.theme--gender,
    .theme--gender .tail__shorten,
    .theme .theme.theme--gender .tail__shorten {
      color: #046a38; }
    .tail__lengthen.theme--nutrition,
    .theme--nutrition .tail__lengthen,
    .theme .theme.theme--nutrition .tail__lengthen, .tail__shorten.theme--nutrition,
    .theme--nutrition .tail__shorten,
    .theme .theme.theme--nutrition .tail__shorten {
      color: #487a7b; }
    .tail__lengthen.theme--blog,
    .theme--blog .tail__lengthen,
    .theme .theme.theme--blog .tail__lengthen, .tail__shorten.theme--blog,
    .theme--blog .tail__shorten,
    .theme .theme.theme--blog .tail__shorten {
      color: #ffa300; }
    .tail__lengthen.theme--spore-blue,
    .theme--spore-blue .tail__lengthen,
    .theme .theme.theme--spore-blue .tail__lengthen, .tail__shorten.theme--spore-blue,
    .theme--spore-blue .tail__shorten,
    .theme .theme.theme--spore-blue .tail__shorten {
      color: #3f68b1; }
    .tail__lengthen.theme--spore-brown,
    .theme--spore-brown .tail__lengthen,
    .theme .theme.theme--spore-brown .tail__lengthen, .tail__shorten.theme--spore-brown,
    .theme--spore-brown .tail__shorten,
    .theme .theme.theme--spore-brown .tail__shorten {
      color: #774b04; }
    .tail__lengthen.theme--spore-dark-blue,
    .theme--spore-dark-blue .tail__lengthen,
    .theme .theme.theme--spore-dark-blue .tail__lengthen, .tail__shorten.theme--spore-dark-blue,
    .theme--spore-dark-blue .tail__shorten,
    .theme .theme.theme--spore-dark-blue .tail__shorten {
      color: #044e7e; }
    .tail__lengthen.theme--spore-forest-green,
    .theme--spore-forest-green .tail__lengthen,
    .theme .theme.theme--spore-forest-green .tail__lengthen, .tail__shorten.theme--spore-forest-green,
    .theme--spore-forest-green .tail__shorten,
    .theme .theme.theme--spore-forest-green .tail__shorten {
      color: #5f810a; }
    .tail__lengthen.theme--spore-grey-blue,
    .theme--spore-grey-blue .tail__lengthen,
    .theme .theme.theme--spore-grey-blue .tail__lengthen, .tail__shorten.theme--spore-grey-blue,
    .theme--spore-grey-blue .tail__shorten,
    .theme .theme.theme--spore-grey-blue .tail__shorten {
      color: #6d8c9f; }
    .tail__lengthen.theme--spore-light-blue,
    .theme--spore-light-blue .tail__lengthen,
    .theme .theme.theme--spore-light-blue .tail__lengthen, .tail__shorten.theme--spore-light-blue,
    .theme--spore-light-blue .tail__shorten,
    .theme .theme.theme--spore-light-blue .tail__shorten {
      color: #79accf; }
    .tail__lengthen.theme--spore-lime,
    .theme--spore-lime .tail__lengthen,
    .theme .theme.theme--spore-lime .tail__lengthen, .tail__shorten.theme--spore-lime,
    .theme--spore-lime .tail__shorten,
    .theme .theme.theme--spore-lime .tail__shorten {
      color: #bbae03; }
    .tail__lengthen.theme--spore-ochre,
    .theme--spore-ochre .tail__lengthen,
    .theme .theme.theme--spore-ochre .tail__lengthen, .tail__shorten.theme--spore-ochre,
    .theme--spore-ochre .tail__shorten,
    .theme .theme.theme--spore-ochre .tail__shorten {
      color: #db9623; }
    .tail__lengthen.theme--spore-olive-green,
    .theme--spore-olive-green .tail__lengthen,
    .theme .theme.theme--spore-olive-green .tail__lengthen, .tail__shorten.theme--spore-olive-green,
    .theme--spore-olive-green .tail__shorten,
    .theme .theme.theme--spore-olive-green .tail__shorten {
      color: #778d3e; }
    .tail__lengthen.theme--spore-red,
    .theme--spore-red .tail__lengthen,
    .theme .theme.theme--spore-red .tail__lengthen, .tail__shorten.theme--spore-red,
    .theme--spore-red .tail__shorten,
    .theme .theme.theme--spore-red .tail__shorten {
      color: #f54c23; }
    .tail__lengthen.theme--spore-taupe,
    .theme--spore-taupe .tail__lengthen,
    .theme .theme.theme--spore-taupe .tail__lengthen, .tail__shorten.theme--spore-taupe,
    .theme--spore-taupe .tail__shorten,
    .theme .theme.theme--spore-taupe .tail__shorten {
      color: #7b6d65; }
    .tail__lengthen.theme--spore-teal,
    .theme--spore-teal .tail__lengthen,
    .theme .theme.theme--spore-teal .tail__lengthen, .tail__shorten.theme--spore-teal,
    .theme--spore-teal .tail__shorten,
    .theme .theme.theme--spore-teal .tail__shorten {
      color: #077fc1; }
    .tail__lengthen:before, .tail__shorten:before {
      padding-right: 15px; }
    .tail__lengthen:after, .tail__shorten:after {
      padding-left: 15px; }
  .tail__lengthen:before, .tail__lengthen:after {
    content: ""; }
  .tail__shorten {
    display: none; }
    .tail__shorten:before, .tail__shorten:after {
      content: ""; }
  .tail.is-active .tail__lengthen {
    display: none; }
  .tail.is-active .tail__shorten {
    display: inline-block; }
  @media only screen and (min-width: 64em) {
    .tail {
      border: 0;
      padding-bottom: 0; }
      .tail__body {
        height: auto; }
      .tail__lengthen, .tail__shorten,
      .tail.is-active .tail__lengthen,
      .tail.is-active .tail__shorten {
        display: none; } }

/* 4.23 Organisers */
/*
Organisers

markup:
<section class="panel  |  wing--right" id="organisers">
    <h2 class="title">
          <a class="panel__trigger  |  gutters  |  is-heir is-current" href="#organisers">Organisers</a>
    </h2>
    <div class="panel__body">
        <ul class="reset">
            <li class="leader  |  trailer">
                <article class="organisation-profile  |  wing--right">
                    <div class="organisation-profile__brand  |  gutters">
                        <img class="image" src="https://res.cloudinary.com/cta/image/upload/v1505810135/piphibjnncz7czpevpiz.png" alt="">
                    </div>
                    <div class="organisation-profile__name  |  gutters">
                        <h3 class="title  |  leader  |  trailer--small">UNDP</h3>
                        <p>UNDP works in some 170 countries and territories, helping to achieve the eradication of poverty, and the reduction of inequalities and exclusion. We help countries to develop policies, leadership skills, partnering abilities, institutional
                            capabilities and build resilience in order to sustain development results. Inclusive growth, better services, environmental sustainability, good governance, and security are fundamental to development progress. We offer our
                            expertise in development thinking and practice, and our decades of experience at country level, to support countries to meet their development aspirations and to bring the voices of the world’s peoples into deliberations. In
                            2016, UNDP is continuing its work to support the 2030 Agenda for Sustainable Development and the 17 new Sustainable Development Goals (SDGs), or Global Goals, as they help shape global sustainable development for the next 15
                            years.
                        </p>
                    </div>
                </article>
            </li>
            <li class="leader  |  trailer">
                <article class="organisation-profile  |  wing--right">
                    <div class="organisation-profile__brand  |  gutters">
                        <img class="image" src="https://res.cloudinary.com/cta/image/upload/v1505810135/piphibjnncz7czpevpiz.png" alt="">
                    </div>
                    <div class="organisation-profile__name  |  gutters">
                        <h3 class="title  |  leader  |  trailer--small">UNDP</h3>
                        <p>UNDP works in some 170 countries and territories, helping to achieve the eradication of poverty, and the reduction of inequalities and exclusion. We help countries to develop policies, leadership skills, partnering abilities, institutional
                            capabilities and build resilience in order to sustain development results. Inclusive growth, better services, environmental sustainability, good governance, and security are fundamental to development progress. We offer our
                            expertise in development thinking and practice, and our decades of experience at country level, to support countries to meet their development aspirations and to bring the voices of the world’s peoples into deliberations. In
                            2016, UNDP is continuing its work to support the 2030 Agenda for Sustainable Development and the 17 new Sustainable Development Goals (SDGs), or Global Goals, as they help shape global sustainable development for the next 15
                            years.
                        </p>
                    </div>
                </article>
            </li>
        </ul>
    </div>
</section>

Styleguide 4.23
*/
/* 4.24 Index */
/*
Index

markup:
<h1 class="title  |  trailer  |  gutters">Attendees</h1>
<div class="trellis trellis--l ">
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">A</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">B</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--large--hero  |  gutters">
    <div class="trailer">
      <div class="letter">C</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">F</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">G</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">H</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">L</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">O</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">P</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--large--large  |  gutters">
    <div class="trailer">
      <div class="letter">T</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
  <div class="trellis__cell  |  trailer--hero  |  gutters">
    <div class="trailer">
      <div class="letter">Z</div>
    </div>
    <ul class="reset">
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
      <li class="trailer--large">
        <div>
          Abhishek Rawat
        </div>
        <div class="body--whisper">
          <p>Landmark Group</p>
          <p>United Arab Emirates</p>
        </div>
      </li>
    </ul>
  </div>
</div>

Styleguide 4.24
*/
/* 4.25 Profile list */
/*
Profile list

markup:
  <div class="profile__list  |  trailer--hero">
    <h1 class="title  |  trailer  |  gutters">Keynotes</h1>
    <div class="grid  grid--teletubbies">
      <sg-insert>3.27</sg-insert>
      <sg-insert>3.27</sg-insert>
      <sg-insert>3.27</sg-insert>
      <sg-insert>3.27</sg-insert>
      <sg-insert>3.27</sg-insert>
      <sg-insert>3.27</sg-insert>
    </div>
  </div>

Styleguide 4.25
*/
.profile__list .grid__cell {
  -webkit-box-flex: 0;
     -moz-box-flex: 0;
      -ms-flex: 0 1 50%;
          flex: 0 1 50%;
  max-width: 50%; }

.profile--small .grid__cell {
  -webkit-box-flex: 0;
     -moz-box-flex: 0;
      -ms-flex: 0 1 33.33333%;
          flex: 0 1 33.33333%;
  max-width: 33.33333%; }

@media only screen and (min-width: 32.5em) {
  .profile__list .grid__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 33.33333%;
            flex: 0 1 33.33333%;
    max-width: 33.33333%; }
  .profile--small .grid__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 25%;
            flex: 0 1 25%;
    max-width: 25%; } }

@media only screen and (min-width: 64em) {
  .profile__list .grid__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 25%;
            flex: 0 1 25%;
    max-width: 25%; }
  .profile--small .grid__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 16.66667%;
            flex: 0 1 16.66667%;
    max-width: 16.66667%; } }

/*
Profile list, name only

markup:
<div class="profile__list  |  profile--small  |  trailer--hero">
  <h1 class="title  |  trailer  |  gutters">Visitors</h1>
  <div class="trellis">
    <sg-insert>3.27.1</sg-insert>
    <sg-insert>3.27.1</sg-insert>
    <sg-insert>3.27.1</sg-insert>
    <sg-insert>3.27.1</sg-insert>
    <sg-insert>3.27.1</sg-insert>
    <sg-insert>3.27.1</sg-insert>
    <sg-insert>3.27.1</sg-insert>
    <sg-insert>3.27.1</sg-insert>
  </div>
</div>

Styleguide 4.25.1
*/
/* 4.26 Organisation profile */
/*
Organisation profile

.organisation-profile - Organisation profile block

markup:
<article class="{$modifiers}  |  wing--right">
    <div class="organisation-profile__brand  |  gutters">
        <img class="image" src="https://res.cloudinary.com/cta/image/upload/v1505810135/piphibjnncz7czpevpiz.png" alt="">
    </div>
    <div class="organisation-profile__name  |  gutters">
        <h3 class="title  |  leader  |  trailer--small">UNDP</h3>
        <p>UNDP works in some 170 countries and territories, helping to achieve the eradication of poverty, and the reduction of inequalities and exclusion. We help countries to develop policies, leadership skills, partnering abilities, institutional
            capabilities and build resilience in order to sustain development results. Inclusive growth, better services, environmental sustainability, good governance, and security are fundamental to development progress. We offer our
            expertise in development thinking and practice, and our decades of experience at country level, to support countries to meet their development aspirations and to bring the voices of the world’s peoples into deliberations. In
            2016, UNDP is continuing its work to support the 2030 Agenda for Sustainable Development and the 17 new Sustainable Development Goals (SDGs), or Global Goals, as they help shape global sustainable development for the next 15
            years.
        </p>
    </div>
</article>

Styleguide 4.26
*/
.organisation-profile {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .organisation-profile__brand {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%; }
  .organisation-profile__name {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 66.66667%;
            flex: 0 0 66.66667%;
    max-width: 66.66667%; }
    .organisation-profile__name .title {
      /* small title*/
      font-size: 0.875em;
      line-height: 1.28571; }
  .organisation-profile__brand, .organisation-profile__name {
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center; }
  @media only screen and (min-width: 32.5em) {
    .organisation-profile__brand {
      text-align: center; }
      .organisation-profile__brand img {
        display: inline-block;
        max-height: 90px; } }
  @media only screen and (min-width: 64em) {
    .organisation-profile__brand {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 0 25%;
              flex: 0 0 25%;
      max-width: 25%; }
      .organisation-profile__brand img {
        max-height: 126px; }
    .organisation-profile__name {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 0 66.66667%;
              flex: 0 0 66.66667%;
      max-width: 66.66667%; }
    .organisation-profile__name .title {
      /* large title*/
      font-size: 1.625em;
      line-height: 1.03846; } }

/* 4.27 Tab teaser */
/*
Tab teaser

markup:
<div class="tab-teaser  |  teaser">
  <ul class="tab-teaser__tabs  |  reset">
    <li>
      <a class="icon-tab  |  icon icon--eye" href="#panel1">
        <span class="is-narrative">Project description</span>
      </a>
    </li>
    <li>
      <a class="icon-tab  |  icon icon--map" href="#panel2">
        <span class="is-narrative">Map</span>
      </a>
    </li>
    <li>
      <a class="is-current  |  icon-tab  |  icon icon--heart" href="#panel3">
        <span class="is-narrative">Impact</span>
      </a>
    </li>
    <li>
      <a class="icon-tab  |  icon icon--hand" href="#panel4">
        <span class="is-narrative">Donate</span>
      </a>
    </li>
    <li>
      <a class="icon-tab  |  icon icon--users" href="#panel5">
        <span class="is-narrative">Sponsors</span>
      </a>
    </li>
  </ul>
  <div class="tab-teaser__panels">
    <sg-insert>4.27.1-1</sg-insert>
    <sg-insert>4.27.2-2</sg-insert>
    <sg-insert>4.27.3-2</sg-insert>
    <sg-insert>4.27.4-2</sg-insert>
    <sg-insert>4.27.5-2</sg-insert>
  </div>
</div>

sg-wrapper:
<div class="">
  <sg-wrapper-content/>
</div>

Styleguide 4.27
*/
/*
 * 1. Limit to four lines (line-height is 15px)
 */
.tab-teaser {
  position: relative;
  display: block;
  margin-top: 42px; }
  .tab-teaser__tabs {
    margin-left: 15px;
    position: absolute;
    bottom: 100%;
    /**
  * For IE 6/7 only
  */ }
    .tab-teaser__tabs::before, .tab-teaser__tabs::after {
      content: " ";
      display: table; }
    .tab-teaser__tabs::after {
      clear: both; }
    .tab-teaser__tabs li {
      float: left;
      margin-right: 2px; }
  .tab-teaser__panel {
    height: 309px;
    overflow-y: scroll; }
    .tab-teaser__panel.is-inactive {
      display: none; }
    .no-flexbox .tab-teaser__panel {
      overflow-x: hidden; }
  .tab-teaser__panel--info .tab-teaser__title {
    /* medium title*/
    font-size: 1.125em;
    line-height: 1.33333;
    color: #67ab43; }
    .tab-teaser__panel--info .tab-teaser__title.theme--dark,
    .theme--dark .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--dark .tab-teaser__panel--info .tab-teaser__title {
      color: #3d3d3d; }
    .tab-teaser__panel--info .tab-teaser__title.theme--green,
    .theme--green .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--green .tab-teaser__panel--info .tab-teaser__title {
      color: #67ab43; }
    .tab-teaser__panel--info .tab-teaser__title.theme--blue,
    .theme--blue .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--blue .tab-teaser__panel--info .tab-teaser__title {
      color: #56c0dd; }
    .tab-teaser__panel--info .tab-teaser__title.theme--lime,
    .theme--lime .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--lime .tab-teaser__panel--info .tab-teaser__title {
      color: #c1d435; }
    .tab-teaser__panel--info .tab-teaser__title.theme--yellow,
    .theme--yellow .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--yellow .tab-teaser__panel--info .tab-teaser__title {
      color: #facf21; }
    .tab-teaser__panel--info .tab-teaser__title.theme--gold,
    .theme--gold .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--gold .tab-teaser__panel--info .tab-teaser__title {
      color: #eb942c; }
    .tab-teaser__panel--info .tab-teaser__title.theme--orange,
    .theme--orange .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--orange .tab-teaser__panel--info .tab-teaser__title {
      color: #e26435; }
    .tab-teaser__panel--info .tab-teaser__title.theme--salmon,
    .theme--salmon .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--salmon .tab-teaser__panel--info .tab-teaser__title {
      color: #eb735d; }
    .tab-teaser__panel--info .tab-teaser__title.theme--red,
    .theme--red .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--red .tab-teaser__panel--info .tab-teaser__title {
      color: #ec2d10; }
    .tab-teaser__panel--info .tab-teaser__title.theme--burgundy,
    .theme--burgundy .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--burgundy .tab-teaser__panel--info .tab-teaser__title {
      color: #ba222a; }
    .tab-teaser__panel--info .tab-teaser__title.theme--purple,
    .theme--purple .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--purple .tab-teaser__panel--info .tab-teaser__title {
      color: #9b3381; }
    .tab-teaser__panel--info .tab-teaser__title.theme--youth,
    .theme--youth .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--youth .tab-teaser__panel--info .tab-teaser__title {
      color: #d57800; }
    .tab-teaser__panel--info .tab-teaser__title.theme--digitalisation,
    .theme--digitalisation .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--digitalisation .tab-teaser__panel--info .tab-teaser__title {
      color: #9a3324; }
    .tab-teaser__panel--info .tab-teaser__title.theme--climate,
    .theme--climate .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--climate .tab-teaser__panel--info .tab-teaser__title {
      color: #693c5e; }
    .tab-teaser__panel--info .tab-teaser__title.theme--gender,
    .theme--gender .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--gender .tab-teaser__panel--info .tab-teaser__title {
      color: #046a38; }
    .tab-teaser__panel--info .tab-teaser__title.theme--nutrition,
    .theme--nutrition .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--nutrition .tab-teaser__panel--info .tab-teaser__title {
      color: #487a7b; }
    .tab-teaser__panel--info .tab-teaser__title.theme--blog,
    .theme--blog .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--blog .tab-teaser__panel--info .tab-teaser__title {
      color: #ffa300; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-blue,
    .theme--spore-blue .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-blue .tab-teaser__panel--info .tab-teaser__title {
      color: #3f68b1; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-brown,
    .theme--spore-brown .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-brown .tab-teaser__panel--info .tab-teaser__title {
      color: #774b04; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-dark-blue,
    .theme--spore-dark-blue .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-dark-blue .tab-teaser__panel--info .tab-teaser__title {
      color: #044e7e; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-forest-green,
    .theme--spore-forest-green .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-forest-green .tab-teaser__panel--info .tab-teaser__title {
      color: #5f810a; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-grey-blue,
    .theme--spore-grey-blue .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-grey-blue .tab-teaser__panel--info .tab-teaser__title {
      color: #6d8c9f; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-light-blue,
    .theme--spore-light-blue .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-light-blue .tab-teaser__panel--info .tab-teaser__title {
      color: #79accf; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-lime,
    .theme--spore-lime .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-lime .tab-teaser__panel--info .tab-teaser__title {
      color: #bbae03; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-ochre,
    .theme--spore-ochre .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-ochre .tab-teaser__panel--info .tab-teaser__title {
      color: #db9623; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-olive-green,
    .theme--spore-olive-green .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-olive-green .tab-teaser__panel--info .tab-teaser__title {
      color: #778d3e; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-red,
    .theme--spore-red .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-red .tab-teaser__panel--info .tab-teaser__title {
      color: #f54c23; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-taupe,
    .theme--spore-taupe .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-taupe .tab-teaser__panel--info .tab-teaser__title {
      color: #7b6d65; }
    .tab-teaser__panel--info .tab-teaser__title.theme--spore-teal,
    .theme--spore-teal .tab-teaser__panel--info .tab-teaser__title,
    .theme .theme.theme--spore-teal .tab-teaser__panel--info .tab-teaser__title {
      color: #077fc1; }
  .tab-teaser__panel--info .tab-teaser__about {
    max-height: 60px;
    /* 1 */ }
  .tab-teaser__panel--map {
    background: no-repeat 0;
    -moz-background-size: cover;
         background-size: cover;
    overflow: hidden; }
    .no-flexbox .tab-teaser__panel--map {
      overflow: hidden; }
  .tab-teaser--logos.is-active {
    background: #fff; }
  @media only screen and (min-width: 48em) {
    .tab-teaser {
      margin-top: 0;
      width: 83.33333%;
      width: 83.33333vw; }
      .tab-teaser__tabs {
        margin-left: 0;
        position: absolute;
        top: 18px;
        left: 100%; }
        .tab-teaser__tabs li {
          display: block;
          margin-bottom: 2px; }
      .tab-teaser__panel {
        height: 405px; } }
  @media only screen and (min-width: 64em) {
    .tab-teaser {
      width: 50%;
      width: 50vw; }
      .tab-teaser__panel-wing {
        padding-left: 11.11111%;
        padding-left: 5.55556vw; }
      .tab-teaser__panel--info .tab-teaser__title {
        /* hero title*/
        font-size: 1.875em;
        line-height: 1.1; } }
  @media only screen and (min-width: 90em) {
    .tab-teaser__panel--info .tab-teaser__title {
      /* hero title*/
      font-size: 2.5em;
      line-height: 1.2; } }

/*
Description

.tab-teaser__panel.tab-teaser__panel--info - Active panel
.tab-teaser__panel.tab-teaser__panel--info.is-inactive - Inactive panel

markup:
<section class="{$modifiers}  |  stack stack--stacked" id="panel1">
  <div class="tab-teaser__panel-wing  |  stack__unit  |  leader-inside">
    <div class="gutters  |  meta">Lorem ipsum</div>
    <h2 class="tab-teaser__title  |  title  |  gutters  |  leader--tiny  |  trailer--tiny" href="javascript:void()">Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing Elit</h2>
    <p class="tab-teaser__about |  body--whisper  |  gutters">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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu</p>
    <a class="read-more  |  gutters" href="javascript:void()">Read more</a>
  </div>
  <div class="stack__unit stack__pin">
    <ul class="reset  |  tab-teaser__panel-wing  |  leader">
      <li class="gutters  |  leader--tiny  |  trailer--tiny">
        <a class="block-link block-link--icon" href="javascript:void()">Lorem Ipsum Dolor Sit Amet Consectetur Adipisicing Elit</a>
      </li>
      <li class="gutters  |  leader--tiny  |  trailer--tiny">
        <a class="block-link block-link--icon" href="javascript:void()">Lorem Ipsum Dolor Sit Amet</a>
      </li>
    </ul>
    <div class="pin-box  |  stack  |  leader  |  tab-teaser__panel-wing">
      <div class="pin-box__cell  |  stack__unit stack__pin  |  leader-inside  |  trailer-inside  | gutters">
        <div class="media  |  location">
          <span class="icon icon--theme icon--map-marker"></span>
          <div class="location__body  |  media__content">
            <span class="is-narrative">Region:</span> Africa
          </div>
        </div>
      </div>
      <div class="pin-box__cell  |  stack__unit  |  leader-inside  |  trailer-inside  | gutters">
        <ul class="label-list reset list--inline">
          <li><a class="label label--s" href="javascript:void();">GIS</a></li>
          <li><a class="label label--s" href="javascript:void();">GPS</a></li>
        </ul>
      </div>
    </div>
  </div>
</section>

Styleguide 4.27.1
*/
/*
Map

.tab-teaser__panel.tab-teaser__panel--map - Active panel
.tab-teaser__panel.tab-teaser__panel--map.is-inactive - Inactive panel

markup:
<section class="{$modifiers}" id="panel2" style="background-image: url(/images/maps/western-africa.png);">
  <img class="is-narrative" src="/images/maps/western-africa.png" alt="Map of Western Africa" width="840" height="406"/>
  <img class="globe leader trailer gutters-outside" src="/images/globes/western-africa.png" alt="Picture of the globe with Western Africa highlighted." width="214" height="214"/>
  <figcaption class="is-narrative">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  </figcaption>
</figure>

Styleguide 4.27.2
*/
/*
Stats

.tab-teaser__panel.tab-teaser__panel--stats - Active panel
.tab-teaser__panel.tab-teaser__panel--stats.is-inactive - Inactive panel

markup:
<section class="{$modifiers}  |  stack stack--stacked" id="panel3">
  <div class="tab-teaser__panel-wing  |  leader-inside  |  stack__unit">
    <div class="stack__unit  |  gutters">
      <sg-insert>3.30</sg-insert>
      <p class="meta meta--s  |  leader--tiny leader-inside--tiny  |  trailer--tiny trailer-inside--tiny">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
      <p class="location">30 March 2017</p>
    </div>
  </div>
  <div class="stack__unit stack__pin">
    <div class="tab-teaser__panel-wing  |  stack__unit  stack__pin  |  pin-box  |  stack  |  leader">
      <div class="pin-box__cell  |  stack__unit  | gutters">
        <sg-insert>3.33-1</sg-insert>
      </div>
      <div class="pin-box__cell  |  stack__unit  | gutters">
        <sg-insert>3.33-2</sg-insert>
      </div>
    </div>
  </div>
</section>

Styleguide 4.27.3
*/
/*
Donate

.tab-teaser__panel.tab-teaser__panel--donate - Active panel
.tab-teaser__panel.tab-teaser__panel--donate.is-inactive - Inactive panel

markup:
<section class="{$modifiers}" id="panel4">
</section>

Styleguide 4.27.4
*/
/*
Impact

.tab-teaser__panel - Active panel
.tab-teaser__panel.is-inactive - Inactive panel

markup:
<section class="{$modifiers}" id="panel5">
  <div class="gutters">
    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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,
  </div>
</section>

Styleguide 4.27.5
*/
/*
Sponsors

.tab-teaser__panel.tab-teaser__panel--sponsors - Active panel
.tab-teaser__panel.tab-teaser__panel--sponsors.is-inactive - Inactive panel

markup:
<section class="{$modifiers}" id="panel6">
  <div class="gutters">
    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 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,
  </div>
</section>

Styleguide 4.27.6
*/
/* 4.28 Alphabet */
/*
Alphabet

.alphabet - Alphabet grid

markup:
<ol class="{$modifiers}  |  reset  |  list list--inline">
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-active" href="javascript:void();">All</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">A</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">B</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">A</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">C</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">D</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">E</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">F</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">G</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">H</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">I</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">J</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">K</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">L</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">M</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">N</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">O</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">P</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">Q</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">R</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">S</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">T</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">U</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">V</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">W</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">X</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">Y</a></li>
	<li class="alphabet__item"><a class="alphabet__trigger  |  is-inactive" href="javascript:void();">Z</a></li>
</ol>

Styleguide 4.28
*/
.alphabet {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .alphabet__item {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 12.5%;
            flex: 0 0 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .alphabet__trigger {
    display: inline-block;
    padding-top: 6px;
    padding-bottom: 6px;
    font-family: "Open Sans", sans-serif;
    text-transform: capitalize;
    /* regular meta */
    font-size: 1em;
    line-height: 1.125; }
  .alphabet__trigger.is-inactive {
    color: #3d3d3d; }
  .no-flexbox .alphabet {
    display: block; }
    .no-flexbox .alphabet__item {
      display: inline-block; }

/* 4.29 Topic Teaser */
/*
Topic Teaser

.topic-teaser - Topic teaser block

markup:
<div class="topic-teaser  |  teaser | ">
    <div class="topic-teaser__label  |  meta meta--inverse">ICT Update Issue 85</div>
    <h1 class="topic-teaser__title  |  title title--headline  |  trailer--normal">Applications for agriculture</h1>
    <p class="topic-teaser__body">Investment in mobile agricultural services is likely to be most effective where the technology is integrated into specific systems and organisational routines that are developed by new or established local innovators. They are the drivers for developing new processes and new networks on the ground that promote scale efficiencies along the value chain.</p>
    <div class="leader leader-inside--normal">
        <a class="button button--inverse" href="/en/ictupdate/issue-85">View issue</a>
    </div>
</div>

Styleguide 4.29
*/
.topic-teaser {
  background-color: #67ab43;
  background-color: rgba(103, 171, 67, 0.76);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding: 15px 30px;
  color: #fff; }
  .topic-teaser.theme--dark,
  .theme--dark .topic-teaser,
  .theme .theme--dark .topic-teaser {
    background-color: #3d3d3d;
    background-color: rgba(61, 61, 61, 0.76); }
  .topic-teaser.theme--green,
  .theme--green .topic-teaser,
  .theme .theme--green .topic-teaser {
    background-color: #67ab43;
    background-color: rgba(103, 171, 67, 0.76); }
  .topic-teaser.theme--blue,
  .theme--blue .topic-teaser,
  .theme .theme--blue .topic-teaser {
    background-color: #56c0dd;
    background-color: rgba(86, 192, 221, 0.76); }
  .topic-teaser.theme--lime,
  .theme--lime .topic-teaser,
  .theme .theme--lime .topic-teaser {
    background-color: #c1d435;
    background-color: rgba(193, 212, 53, 0.76); }
  .topic-teaser.theme--yellow,
  .theme--yellow .topic-teaser,
  .theme .theme--yellow .topic-teaser {
    background-color: #facf21;
    background-color: rgba(250, 207, 33, 0.76); }
  .topic-teaser.theme--gold,
  .theme--gold .topic-teaser,
  .theme .theme--gold .topic-teaser {
    background-color: #eb942c;
    background-color: rgba(235, 148, 44, 0.76); }
  .topic-teaser.theme--orange,
  .theme--orange .topic-teaser,
  .theme .theme--orange .topic-teaser {
    background-color: #e26435;
    background-color: rgba(226, 100, 53, 0.76); }
  .topic-teaser.theme--salmon,
  .theme--salmon .topic-teaser,
  .theme .theme--salmon .topic-teaser {
    background-color: #eb735d;
    background-color: rgba(235, 115, 93, 0.76); }
  .topic-teaser.theme--red,
  .theme--red .topic-teaser,
  .theme .theme--red .topic-teaser {
    background-color: #ec2d10;
    background-color: rgba(236, 45, 16, 0.76); }
  .topic-teaser.theme--burgundy,
  .theme--burgundy .topic-teaser,
  .theme .theme--burgundy .topic-teaser {
    background-color: #ba222a;
    background-color: rgba(186, 34, 42, 0.76); }
  .topic-teaser.theme--purple,
  .theme--purple .topic-teaser,
  .theme .theme--purple .topic-teaser {
    background-color: #9b3381;
    background-color: rgba(155, 51, 129, 0.76); }
  .topic-teaser.theme--youth,
  .theme--youth .topic-teaser,
  .theme .theme--youth .topic-teaser {
    background-color: #d57800;
    background-color: rgba(213, 120, 0, 0.76); }
  .topic-teaser.theme--digitalisation,
  .theme--digitalisation .topic-teaser,
  .theme .theme--digitalisation .topic-teaser {
    background-color: #9a3324;
    background-color: rgba(154, 51, 36, 0.76); }
  .topic-teaser.theme--climate,
  .theme--climate .topic-teaser,
  .theme .theme--climate .topic-teaser {
    background-color: #693c5e;
    background-color: rgba(105, 60, 94, 0.76); }
  .topic-teaser.theme--gender,
  .theme--gender .topic-teaser,
  .theme .theme--gender .topic-teaser {
    background-color: #046a38;
    background-color: rgba(4, 106, 56, 0.76); }
  .topic-teaser.theme--nutrition,
  .theme--nutrition .topic-teaser,
  .theme .theme--nutrition .topic-teaser {
    background-color: #487a7b;
    background-color: rgba(72, 122, 123, 0.76); }
  .topic-teaser.theme--blog,
  .theme--blog .topic-teaser,
  .theme .theme--blog .topic-teaser {
    background-color: #FFA300;
    background-color: rgba(255, 163, 0, 0.76); }
  .topic-teaser.theme--spore-blue,
  .theme--spore-blue .topic-teaser,
  .theme .theme--spore-blue .topic-teaser {
    background-color: #3f68b1;
    background-color: rgba(63, 104, 177, 0.76); }
  .topic-teaser.theme--spore-brown,
  .theme--spore-brown .topic-teaser,
  .theme .theme--spore-brown .topic-teaser {
    background-color: #774b04;
    background-color: rgba(119, 75, 4, 0.76); }
  .topic-teaser.theme--spore-dark-blue,
  .theme--spore-dark-blue .topic-teaser,
  .theme .theme--spore-dark-blue .topic-teaser {
    background-color: #044e7e;
    background-color: rgba(4, 78, 126, 0.76); }
  .topic-teaser.theme--spore-forest-green,
  .theme--spore-forest-green .topic-teaser,
  .theme .theme--spore-forest-green .topic-teaser {
    background-color: #5f810a;
    background-color: rgba(95, 129, 10, 0.76); }
  .topic-teaser.theme--spore-grey-blue,
  .theme--spore-grey-blue .topic-teaser,
  .theme .theme--spore-grey-blue .topic-teaser {
    background-color: #6d8c9f;
    background-color: rgba(109, 140, 159, 0.76); }
  .topic-teaser.theme--spore-light-blue,
  .theme--spore-light-blue .topic-teaser,
  .theme .theme--spore-light-blue .topic-teaser {
    background-color: #79accf;
    background-color: rgba(121, 172, 207, 0.76); }
  .topic-teaser.theme--spore-lime,
  .theme--spore-lime .topic-teaser,
  .theme .theme--spore-lime .topic-teaser {
    background-color: #bbae03;
    background-color: rgba(187, 174, 3, 0.76); }
  .topic-teaser.theme--spore-ochre,
  .theme--spore-ochre .topic-teaser,
  .theme .theme--spore-ochre .topic-teaser {
    background-color: #db9623;
    background-color: rgba(219, 150, 35, 0.76); }
  .topic-teaser.theme--spore-olive-green,
  .theme--spore-olive-green .topic-teaser,
  .theme .theme--spore-olive-green .topic-teaser {
    background-color: #778d3e;
    background-color: rgba(119, 141, 62, 0.76); }
  .topic-teaser.theme--spore-red,
  .theme--spore-red .topic-teaser,
  .theme .theme--spore-red .topic-teaser {
    background-color: #f54c23;
    background-color: rgba(245, 76, 35, 0.76); }
  .topic-teaser.theme--spore-taupe,
  .theme--spore-taupe .topic-teaser,
  .theme .theme--spore-taupe .topic-teaser {
    background-color: #7b6d65;
    background-color: rgba(123, 109, 101, 0.76); }
  .topic-teaser.theme--spore-teal,
  .theme--spore-teal .topic-teaser,
  .theme .theme--spore-teal .topic-teaser {
    background-color: #077fc1;
    background-color: rgba(7, 127, 193, 0.76); }
  @media only screen and (min-width: 48em) {
    .topic-teaser {
      padding: 30px 30px; } }
  .topic-teaser__title {
    /* medium title*/
    font-size: 1.125em;
    line-height: 1.33333; }
    @media only screen and (min-width: 48em) {
      .topic-teaser__title {
        /* large title*/
        font-size: 1.5em;
        line-height: 1.125;
        margin: 6px 0 18px; } }
  .hero--carousel .topic-teaser {
    background-color: #67ab43;
    background-color: #67ab43; }
    .hero--carousel .topic-teaser.theme--dark,
    .theme--dark .hero--carousel .topic-teaser,
    .theme .theme--dark .hero--carousel .topic-teaser {
      background-color: #3d3d3d;
      background-color: #3d3d3d; }
    .hero--carousel .topic-teaser.theme--green,
    .theme--green .hero--carousel .topic-teaser,
    .theme .theme--green .hero--carousel .topic-teaser {
      background-color: #67ab43;
      background-color: #67ab43; }
    .hero--carousel .topic-teaser.theme--blue,
    .theme--blue .hero--carousel .topic-teaser,
    .theme .theme--blue .hero--carousel .topic-teaser {
      background-color: #56c0dd;
      background-color: #56c0dd; }
    .hero--carousel .topic-teaser.theme--lime,
    .theme--lime .hero--carousel .topic-teaser,
    .theme .theme--lime .hero--carousel .topic-teaser {
      background-color: #c1d435;
      background-color: #c1d435; }
    .hero--carousel .topic-teaser.theme--yellow,
    .theme--yellow .hero--carousel .topic-teaser,
    .theme .theme--yellow .hero--carousel .topic-teaser {
      background-color: #facf21;
      background-color: #facf21; }
    .hero--carousel .topic-teaser.theme--gold,
    .theme--gold .hero--carousel .topic-teaser,
    .theme .theme--gold .hero--carousel .topic-teaser {
      background-color: #eb942c;
      background-color: #eb942c; }
    .hero--carousel .topic-teaser.theme--orange,
    .theme--orange .hero--carousel .topic-teaser,
    .theme .theme--orange .hero--carousel .topic-teaser {
      background-color: #e26435;
      background-color: #e26435; }
    .hero--carousel .topic-teaser.theme--salmon,
    .theme--salmon .hero--carousel .topic-teaser,
    .theme .theme--salmon .hero--carousel .topic-teaser {
      background-color: #eb735d;
      background-color: #eb735d; }
    .hero--carousel .topic-teaser.theme--red,
    .theme--red .hero--carousel .topic-teaser,
    .theme .theme--red .hero--carousel .topic-teaser {
      background-color: #ec2d10;
      background-color: #ec2d10; }
    .hero--carousel .topic-teaser.theme--burgundy,
    .theme--burgundy .hero--carousel .topic-teaser,
    .theme .theme--burgundy .hero--carousel .topic-teaser {
      background-color: #ba222a;
      background-color: #ba222a; }
    .hero--carousel .topic-teaser.theme--purple,
    .theme--purple .hero--carousel .topic-teaser,
    .theme .theme--purple .hero--carousel .topic-teaser {
      background-color: #9b3381;
      background-color: #9b3381; }
    .hero--carousel .topic-teaser.theme--youth,
    .theme--youth .hero--carousel .topic-teaser,
    .theme .theme--youth .hero--carousel .topic-teaser {
      background-color: #d57800;
      background-color: #d57800; }
    .hero--carousel .topic-teaser.theme--digitalisation,
    .theme--digitalisation .hero--carousel .topic-teaser,
    .theme .theme--digitalisation .hero--carousel .topic-teaser {
      background-color: #9a3324;
      background-color: #9a3324; }
    .hero--carousel .topic-teaser.theme--climate,
    .theme--climate .hero--carousel .topic-teaser,
    .theme .theme--climate .hero--carousel .topic-teaser {
      background-color: #693c5e;
      background-color: #693c5e; }
    .hero--carousel .topic-teaser.theme--gender,
    .theme--gender .hero--carousel .topic-teaser,
    .theme .theme--gender .hero--carousel .topic-teaser {
      background-color: #046a38;
      background-color: #046a38; }
    .hero--carousel .topic-teaser.theme--nutrition,
    .theme--nutrition .hero--carousel .topic-teaser,
    .theme .theme--nutrition .hero--carousel .topic-teaser {
      background-color: #487a7b;
      background-color: #487a7b; }
    .hero--carousel .topic-teaser.theme--blog,
    .theme--blog .hero--carousel .topic-teaser,
    .theme .theme--blog .hero--carousel .topic-teaser {
      background-color: #FFA300;
      background-color: #ffa300; }
    .hero--carousel .topic-teaser.theme--spore-blue,
    .theme--spore-blue .hero--carousel .topic-teaser,
    .theme .theme--spore-blue .hero--carousel .topic-teaser {
      background-color: #3f68b1;
      background-color: #3f68b1; }
    .hero--carousel .topic-teaser.theme--spore-brown,
    .theme--spore-brown .hero--carousel .topic-teaser,
    .theme .theme--spore-brown .hero--carousel .topic-teaser {
      background-color: #774b04;
      background-color: #774b04; }
    .hero--carousel .topic-teaser.theme--spore-dark-blue,
    .theme--spore-dark-blue .hero--carousel .topic-teaser,
    .theme .theme--spore-dark-blue .hero--carousel .topic-teaser {
      background-color: #044e7e;
      background-color: #044e7e; }
    .hero--carousel .topic-teaser.theme--spore-forest-green,
    .theme--spore-forest-green .hero--carousel .topic-teaser,
    .theme .theme--spore-forest-green .hero--carousel .topic-teaser {
      background-color: #5f810a;
      background-color: #5f810a; }
    .hero--carousel .topic-teaser.theme--spore-grey-blue,
    .theme--spore-grey-blue .hero--carousel .topic-teaser,
    .theme .theme--spore-grey-blue .hero--carousel .topic-teaser {
      background-color: #6d8c9f;
      background-color: #6d8c9f; }
    .hero--carousel .topic-teaser.theme--spore-light-blue,
    .theme--spore-light-blue .hero--carousel .topic-teaser,
    .theme .theme--spore-light-blue .hero--carousel .topic-teaser {
      background-color: #79accf;
      background-color: #79accf; }
    .hero--carousel .topic-teaser.theme--spore-lime,
    .theme--spore-lime .hero--carousel .topic-teaser,
    .theme .theme--spore-lime .hero--carousel .topic-teaser {
      background-color: #bbae03;
      background-color: #bbae03; }
    .hero--carousel .topic-teaser.theme--spore-ochre,
    .theme--spore-ochre .hero--carousel .topic-teaser,
    .theme .theme--spore-ochre .hero--carousel .topic-teaser {
      background-color: #db9623;
      background-color: #db9623; }
    .hero--carousel .topic-teaser.theme--spore-olive-green,
    .theme--spore-olive-green .hero--carousel .topic-teaser,
    .theme .theme--spore-olive-green .hero--carousel .topic-teaser {
      background-color: #778d3e;
      background-color: #778d3e; }
    .hero--carousel .topic-teaser.theme--spore-red,
    .theme--spore-red .hero--carousel .topic-teaser,
    .theme .theme--spore-red .hero--carousel .topic-teaser {
      background-color: #f54c23;
      background-color: #f54c23; }
    .hero--carousel .topic-teaser.theme--spore-taupe,
    .theme--spore-taupe .hero--carousel .topic-teaser,
    .theme .theme--spore-taupe .hero--carousel .topic-teaser {
      background-color: #7b6d65;
      background-color: #7b6d65; }
    .hero--carousel .topic-teaser.theme--spore-teal,
    .theme--spore-teal .hero--carousel .topic-teaser,
    .theme .theme--spore-teal .hero--carousel .topic-teaser {
      background-color: #077fc1;
      background-color: #077fc1; }
    @media only screen and (min-width: 90em) {
      .hero--carousel .topic-teaser {
        background-color: #67ab43;
        background-color: rgba(103, 171, 67, 0.76); }
        .hero--carousel .topic-teaser.theme--dark,
        .theme--dark .hero--carousel .topic-teaser,
        .theme .theme--dark .hero--carousel .topic-teaser {
          background-color: #3d3d3d;
          background-color: rgba(61, 61, 61, 0.76); }
        .hero--carousel .topic-teaser.theme--green,
        .theme--green .hero--carousel .topic-teaser,
        .theme .theme--green .hero--carousel .topic-teaser {
          background-color: #67ab43;
          background-color: rgba(103, 171, 67, 0.76); }
        .hero--carousel .topic-teaser.theme--blue,
        .theme--blue .hero--carousel .topic-teaser,
        .theme .theme--blue .hero--carousel .topic-teaser {
          background-color: #56c0dd;
          background-color: rgba(86, 192, 221, 0.76); }
        .hero--carousel .topic-teaser.theme--lime,
        .theme--lime .hero--carousel .topic-teaser,
        .theme .theme--lime .hero--carousel .topic-teaser {
          background-color: #c1d435;
          background-color: rgba(193, 212, 53, 0.76); }
        .hero--carousel .topic-teaser.theme--yellow,
        .theme--yellow .hero--carousel .topic-teaser,
        .theme .theme--yellow .hero--carousel .topic-teaser {
          background-color: #facf21;
          background-color: rgba(250, 207, 33, 0.76); }
        .hero--carousel .topic-teaser.theme--gold,
        .theme--gold .hero--carousel .topic-teaser,
        .theme .theme--gold .hero--carousel .topic-teaser {
          background-color: #eb942c;
          background-color: rgba(235, 148, 44, 0.76); }
        .hero--carousel .topic-teaser.theme--orange,
        .theme--orange .hero--carousel .topic-teaser,
        .theme .theme--orange .hero--carousel .topic-teaser {
          background-color: #e26435;
          background-color: rgba(226, 100, 53, 0.76); }
        .hero--carousel .topic-teaser.theme--salmon,
        .theme--salmon .hero--carousel .topic-teaser,
        .theme .theme--salmon .hero--carousel .topic-teaser {
          background-color: #eb735d;
          background-color: rgba(235, 115, 93, 0.76); }
        .hero--carousel .topic-teaser.theme--red,
        .theme--red .hero--carousel .topic-teaser,
        .theme .theme--red .hero--carousel .topic-teaser {
          background-color: #ec2d10;
          background-color: rgba(236, 45, 16, 0.76); }
        .hero--carousel .topic-teaser.theme--burgundy,
        .theme--burgundy .hero--carousel .topic-teaser,
        .theme .theme--burgundy .hero--carousel .topic-teaser {
          background-color: #ba222a;
          background-color: rgba(186, 34, 42, 0.76); }
        .hero--carousel .topic-teaser.theme--purple,
        .theme--purple .hero--carousel .topic-teaser,
        .theme .theme--purple .hero--carousel .topic-teaser {
          background-color: #9b3381;
          background-color: rgba(155, 51, 129, 0.76); }
        .hero--carousel .topic-teaser.theme--youth,
        .theme--youth .hero--carousel .topic-teaser,
        .theme .theme--youth .hero--carousel .topic-teaser {
          background-color: #d57800;
          background-color: rgba(213, 120, 0, 0.76); }
        .hero--carousel .topic-teaser.theme--digitalisation,
        .theme--digitalisation .hero--carousel .topic-teaser,
        .theme .theme--digitalisation .hero--carousel .topic-teaser {
          background-color: #9a3324;
          background-color: rgba(154, 51, 36, 0.76); }
        .hero--carousel .topic-teaser.theme--climate,
        .theme--climate .hero--carousel .topic-teaser,
        .theme .theme--climate .hero--carousel .topic-teaser {
          background-color: #693c5e;
          background-color: rgba(105, 60, 94, 0.76); }
        .hero--carousel .topic-teaser.theme--gender,
        .theme--gender .hero--carousel .topic-teaser,
        .theme .theme--gender .hero--carousel .topic-teaser {
          background-color: #046a38;
          background-color: rgba(4, 106, 56, 0.76); }
        .hero--carousel .topic-teaser.theme--nutrition,
        .theme--nutrition .hero--carousel .topic-teaser,
        .theme .theme--nutrition .hero--carousel .topic-teaser {
          background-color: #487a7b;
          background-color: rgba(72, 122, 123, 0.76); }
        .hero--carousel .topic-teaser.theme--blog,
        .theme--blog .hero--carousel .topic-teaser,
        .theme .theme--blog .hero--carousel .topic-teaser {
          background-color: #FFA300;
          background-color: rgba(255, 163, 0, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-blue,
        .theme--spore-blue .hero--carousel .topic-teaser,
        .theme .theme--spore-blue .hero--carousel .topic-teaser {
          background-color: #3f68b1;
          background-color: rgba(63, 104, 177, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-brown,
        .theme--spore-brown .hero--carousel .topic-teaser,
        .theme .theme--spore-brown .hero--carousel .topic-teaser {
          background-color: #774b04;
          background-color: rgba(119, 75, 4, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-dark-blue,
        .theme--spore-dark-blue .hero--carousel .topic-teaser,
        .theme .theme--spore-dark-blue .hero--carousel .topic-teaser {
          background-color: #044e7e;
          background-color: rgba(4, 78, 126, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-forest-green,
        .theme--spore-forest-green .hero--carousel .topic-teaser,
        .theme .theme--spore-forest-green .hero--carousel .topic-teaser {
          background-color: #5f810a;
          background-color: rgba(95, 129, 10, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-grey-blue,
        .theme--spore-grey-blue .hero--carousel .topic-teaser,
        .theme .theme--spore-grey-blue .hero--carousel .topic-teaser {
          background-color: #6d8c9f;
          background-color: rgba(109, 140, 159, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-light-blue,
        .theme--spore-light-blue .hero--carousel .topic-teaser,
        .theme .theme--spore-light-blue .hero--carousel .topic-teaser {
          background-color: #79accf;
          background-color: rgba(121, 172, 207, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-lime,
        .theme--spore-lime .hero--carousel .topic-teaser,
        .theme .theme--spore-lime .hero--carousel .topic-teaser {
          background-color: #bbae03;
          background-color: rgba(187, 174, 3, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-ochre,
        .theme--spore-ochre .hero--carousel .topic-teaser,
        .theme .theme--spore-ochre .hero--carousel .topic-teaser {
          background-color: #db9623;
          background-color: rgba(219, 150, 35, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-olive-green,
        .theme--spore-olive-green .hero--carousel .topic-teaser,
        .theme .theme--spore-olive-green .hero--carousel .topic-teaser {
          background-color: #778d3e;
          background-color: rgba(119, 141, 62, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-red,
        .theme--spore-red .hero--carousel .topic-teaser,
        .theme .theme--spore-red .hero--carousel .topic-teaser {
          background-color: #f54c23;
          background-color: rgba(245, 76, 35, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-taupe,
        .theme--spore-taupe .hero--carousel .topic-teaser,
        .theme .theme--spore-taupe .hero--carousel .topic-teaser {
          background-color: #7b6d65;
          background-color: rgba(123, 109, 101, 0.76); }
        .hero--carousel .topic-teaser.theme--spore-teal,
        .theme--spore-teal .hero--carousel .topic-teaser,
        .theme .theme--spore-teal .hero--carousel .topic-teaser {
          background-color: #077fc1;
          background-color: rgba(7, 127, 193, 0.76); } }
  @media only screen and (min-width: 48em) {
    .topic-teaser__label {
      /* regular meta */
      font-size: 0.875em;
      line-height: 1.07143; }
    .topic-teaser__title {
      /* hero title*/
      font-size: 1.875em;
      line-height: 1.1; }
    .topic-teaser__body {
      font-size: 1.2em; } }
  @media only screen and (min-width: 90em) {
    .topic-teaser {
      padding: 60px 60px; }
      .hero--carousel .topic-teaser {
        padding: 30px 30px 24px; }
      .topic-teaser__label {
        /* regular meta */
        font-size: 1em;
        line-height: 1.125; }
      .topic-teaser__title {
        /* giant title*/
        font-size: 3em;
        line-height: 1.0625;
        margin: 9px 0 24px; }
        .hero--carousel .topic-teaser__title {
          /* hero title*/
          font-size: 2.5em;
          line-height: 1.2;
          margin-top: 0; } }

/* 4.30 Project timeline */
/*
Timeline

Review: do we need different border and type colour on timeline--overlay?

.timeline - Regular timeline
.timeline.timeline--l - Timeline with added padding
.timeline.timeline--overlay - With a transparent light background
.timeline.timeline--10 - 10% Active year
.timeline.timeline--20 - 20% Active year
.timeline.timeline--30 - 30% Active year
.timeline.timeline--40 - 40% Active year
.timeline.timeline--50 - 50% Active year
.timeline.timeline--60 - 60% Active year
.timeline.timeline--70 - 70% Active year
.timeline.timeline--80 - 80% Active year
.timeline.timeline--90 - 90% Active year

markup:
<div class="{$modifiers}  |  stack">
  <div class="stack__unit stack__pin  |  is-gt-small-desktop  |  meta">
    <div class="timeline__label  |  gutters">Project timeline</div>
  </div>
  <div class="stack__unit  |  meta">
    <div class="timeline__item  |  is-complete  |  gutters">
      <span class="timeline__date">2016</span>
    </div>
  </div>
  <div class="stack__unit  |  meta">
    <div class="timeline__item  |  is-active  |  gutters">
      <span class="timeline__date">2017</span>
    </div>
  </div>
  <div class="stack__unit  |  meta">
    <div class="timeline__item  |  gutters">
      <span class="timeline__date">2018</span>
    </div>
  </div>
  <div class="stack__unit  |  meta">
    <div class="timeline__item  |  gutters">
      <span class="timeline__date">2019</span>
    </div>
  </div>
</div>

sg-wrapper:
<div class="theme theme--salmon">
  <sg-wrapper-content/>
</div>

Styleguide 4.30
*/
.timeline__label {
  font-size: 10px; }

.timeline__label, .timeline__item {
  padding-top: 6px;
  padding-bottom: 6px;
  white-space: nowrap;
  text-align: center;
  line-height: 15px; }

.timeline__item {
  border: 1px solid rgba(61, 61, 61, 0.26);
  border-width: 0 0 0 1px; }
  .well--neutral .timeline__item {
    border-color: #fff; }

.timeline__label, .timeline__item.is-complete {
  border-right: 1px solid rgba(255, 255, 255, 0.26); }

.timeline__label, .timeline__item.is-complete {
  background-color: #67ab43;
  white-space: nowrap; }
  .timeline__label.theme--dark,
  .theme--dark .timeline__label,
  .theme .theme--dark .timeline__label, .timeline__item.is-complete.theme--dark,
  .theme--dark .timeline__item.is-complete,
  .theme .theme--dark .timeline__item.is-complete {
    background-color: #3d3d3d; }
  .timeline__label.theme--green,
  .theme--green .timeline__label,
  .theme .theme--green .timeline__label, .timeline__item.is-complete.theme--green,
  .theme--green .timeline__item.is-complete,
  .theme .theme--green .timeline__item.is-complete {
    background-color: #67ab43; }
  .timeline__label.theme--blue,
  .theme--blue .timeline__label,
  .theme .theme--blue .timeline__label, .timeline__item.is-complete.theme--blue,
  .theme--blue .timeline__item.is-complete,
  .theme .theme--blue .timeline__item.is-complete {
    background-color: #56c0dd; }
  .timeline__label.theme--lime,
  .theme--lime .timeline__label,
  .theme .theme--lime .timeline__label, .timeline__item.is-complete.theme--lime,
  .theme--lime .timeline__item.is-complete,
  .theme .theme--lime .timeline__item.is-complete {
    background-color: #c1d435; }
  .timeline__label.theme--yellow,
  .theme--yellow .timeline__label,
  .theme .theme--yellow .timeline__label, .timeline__item.is-complete.theme--yellow,
  .theme--yellow .timeline__item.is-complete,
  .theme .theme--yellow .timeline__item.is-complete {
    background-color: #facf21; }
  .timeline__label.theme--gold,
  .theme--gold .timeline__label,
  .theme .theme--gold .timeline__label, .timeline__item.is-complete.theme--gold,
  .theme--gold .timeline__item.is-complete,
  .theme .theme--gold .timeline__item.is-complete {
    background-color: #eb942c; }
  .timeline__label.theme--orange,
  .theme--orange .timeline__label,
  .theme .theme--orange .timeline__label, .timeline__item.is-complete.theme--orange,
  .theme--orange .timeline__item.is-complete,
  .theme .theme--orange .timeline__item.is-complete {
    background-color: #e26435; }
  .timeline__label.theme--salmon,
  .theme--salmon .timeline__label,
  .theme .theme--salmon .timeline__label, .timeline__item.is-complete.theme--salmon,
  .theme--salmon .timeline__item.is-complete,
  .theme .theme--salmon .timeline__item.is-complete {
    background-color: #eb735d; }
  .timeline__label.theme--red,
  .theme--red .timeline__label,
  .theme .theme--red .timeline__label, .timeline__item.is-complete.theme--red,
  .theme--red .timeline__item.is-complete,
  .theme .theme--red .timeline__item.is-complete {
    background-color: #ec2d10; }
  .timeline__label.theme--burgundy,
  .theme--burgundy .timeline__label,
  .theme .theme--burgundy .timeline__label, .timeline__item.is-complete.theme--burgundy,
  .theme--burgundy .timeline__item.is-complete,
  .theme .theme--burgundy .timeline__item.is-complete {
    background-color: #ba222a; }
  .timeline__label.theme--purple,
  .theme--purple .timeline__label,
  .theme .theme--purple .timeline__label, .timeline__item.is-complete.theme--purple,
  .theme--purple .timeline__item.is-complete,
  .theme .theme--purple .timeline__item.is-complete {
    background-color: #9b3381; }
  .timeline__label.theme--youth,
  .theme--youth .timeline__label,
  .theme .theme--youth .timeline__label, .timeline__item.is-complete.theme--youth,
  .theme--youth .timeline__item.is-complete,
  .theme .theme--youth .timeline__item.is-complete {
    background-color: #d57800; }
  .timeline__label.theme--digitalisation,
  .theme--digitalisation .timeline__label,
  .theme .theme--digitalisation .timeline__label, .timeline__item.is-complete.theme--digitalisation,
  .theme--digitalisation .timeline__item.is-complete,
  .theme .theme--digitalisation .timeline__item.is-complete {
    background-color: #9a3324; }
  .timeline__label.theme--climate,
  .theme--climate .timeline__label,
  .theme .theme--climate .timeline__label, .timeline__item.is-complete.theme--climate,
  .theme--climate .timeline__item.is-complete,
  .theme .theme--climate .timeline__item.is-complete {
    background-color: #693c5e; }
  .timeline__label.theme--gender,
  .theme--gender .timeline__label,
  .theme .theme--gender .timeline__label, .timeline__item.is-complete.theme--gender,
  .theme--gender .timeline__item.is-complete,
  .theme .theme--gender .timeline__item.is-complete {
    background-color: #046a38; }
  .timeline__label.theme--nutrition,
  .theme--nutrition .timeline__label,
  .theme .theme--nutrition .timeline__label, .timeline__item.is-complete.theme--nutrition,
  .theme--nutrition .timeline__item.is-complete,
  .theme .theme--nutrition .timeline__item.is-complete {
    background-color: #487a7b; }
  .timeline__label.theme--blog,
  .theme--blog .timeline__label,
  .theme .theme--blog .timeline__label, .timeline__item.is-complete.theme--blog,
  .theme--blog .timeline__item.is-complete,
  .theme .theme--blog .timeline__item.is-complete {
    background-color: #ffa300; }
  .timeline__label.theme--spore-blue,
  .theme--spore-blue .timeline__label,
  .theme .theme--spore-blue .timeline__label, .timeline__item.is-complete.theme--spore-blue,
  .theme--spore-blue .timeline__item.is-complete,
  .theme .theme--spore-blue .timeline__item.is-complete {
    background-color: #3f68b1; }
  .timeline__label.theme--spore-brown,
  .theme--spore-brown .timeline__label,
  .theme .theme--spore-brown .timeline__label, .timeline__item.is-complete.theme--spore-brown,
  .theme--spore-brown .timeline__item.is-complete,
  .theme .theme--spore-brown .timeline__item.is-complete {
    background-color: #774b04; }
  .timeline__label.theme--spore-dark-blue,
  .theme--spore-dark-blue .timeline__label,
  .theme .theme--spore-dark-blue .timeline__label, .timeline__item.is-complete.theme--spore-dark-blue,
  .theme--spore-dark-blue .timeline__item.is-complete,
  .theme .theme--spore-dark-blue .timeline__item.is-complete {
    background-color: #044e7e; }
  .timeline__label.theme--spore-forest-green,
  .theme--spore-forest-green .timeline__label,
  .theme .theme--spore-forest-green .timeline__label, .timeline__item.is-complete.theme--spore-forest-green,
  .theme--spore-forest-green .timeline__item.is-complete,
  .theme .theme--spore-forest-green .timeline__item.is-complete {
    background-color: #5f810a; }
  .timeline__label.theme--spore-grey-blue,
  .theme--spore-grey-blue .timeline__label,
  .theme .theme--spore-grey-blue .timeline__label, .timeline__item.is-complete.theme--spore-grey-blue,
  .theme--spore-grey-blue .timeline__item.is-complete,
  .theme .theme--spore-grey-blue .timeline__item.is-complete {
    background-color: #6d8c9f; }
  .timeline__label.theme--spore-light-blue,
  .theme--spore-light-blue .timeline__label,
  .theme .theme--spore-light-blue .timeline__label, .timeline__item.is-complete.theme--spore-light-blue,
  .theme--spore-light-blue .timeline__item.is-complete,
  .theme .theme--spore-light-blue .timeline__item.is-complete {
    background-color: #79accf; }
  .timeline__label.theme--spore-lime,
  .theme--spore-lime .timeline__label,
  .theme .theme--spore-lime .timeline__label, .timeline__item.is-complete.theme--spore-lime,
  .theme--spore-lime .timeline__item.is-complete,
  .theme .theme--spore-lime .timeline__item.is-complete {
    background-color: #bbae03; }
  .timeline__label.theme--spore-ochre,
  .theme--spore-ochre .timeline__label,
  .theme .theme--spore-ochre .timeline__label, .timeline__item.is-complete.theme--spore-ochre,
  .theme--spore-ochre .timeline__item.is-complete,
  .theme .theme--spore-ochre .timeline__item.is-complete {
    background-color: #db9623; }
  .timeline__label.theme--spore-olive-green,
  .theme--spore-olive-green .timeline__label,
  .theme .theme--spore-olive-green .timeline__label, .timeline__item.is-complete.theme--spore-olive-green,
  .theme--spore-olive-green .timeline__item.is-complete,
  .theme .theme--spore-olive-green .timeline__item.is-complete {
    background-color: #778d3e; }
  .timeline__label.theme--spore-red,
  .theme--spore-red .timeline__label,
  .theme .theme--spore-red .timeline__label, .timeline__item.is-complete.theme--spore-red,
  .theme--spore-red .timeline__item.is-complete,
  .theme .theme--spore-red .timeline__item.is-complete {
    background-color: #f54c23; }
  .timeline__label.theme--spore-taupe,
  .theme--spore-taupe .timeline__label,
  .theme .theme--spore-taupe .timeline__label, .timeline__item.is-complete.theme--spore-taupe,
  .theme--spore-taupe .timeline__item.is-complete,
  .theme .theme--spore-taupe .timeline__item.is-complete {
    background-color: #7b6d65; }
  .timeline__label.theme--spore-teal,
  .theme--spore-teal .timeline__label,
  .theme .theme--spore-teal .timeline__label, .timeline__item.is-complete.theme--spore-teal,
  .theme--spore-teal .timeline__item.is-complete,
  .theme .theme--spore-teal .timeline__item.is-complete {
    background-color: #077fc1; }

.timeline__date {
  position: relative;
  z-index: 1;
  display: block; }

.timeline__item.is-active {
  position: relative;
  border-color: #67ab43; }
  .timeline__item.is-active.theme--dark,
  .theme--dark .timeline__item.is-active,
  .theme .theme--dark .timeline__item.is-active {
    border-color: #3d3d3d; }
  .timeline__item.is-active.theme--green,
  .theme--green .timeline__item.is-active,
  .theme .theme--green .timeline__item.is-active {
    border-color: #67ab43; }
  .timeline__item.is-active.theme--blue,
  .theme--blue .timeline__item.is-active,
  .theme .theme--blue .timeline__item.is-active {
    border-color: #56c0dd; }
  .timeline__item.is-active.theme--lime,
  .theme--lime .timeline__item.is-active,
  .theme .theme--lime .timeline__item.is-active {
    border-color: #c1d435; }
  .timeline__item.is-active.theme--yellow,
  .theme--yellow .timeline__item.is-active,
  .theme .theme--yellow .timeline__item.is-active {
    border-color: #facf21; }
  .timeline__item.is-active.theme--gold,
  .theme--gold .timeline__item.is-active,
  .theme .theme--gold .timeline__item.is-active {
    border-color: #eb942c; }
  .timeline__item.is-active.theme--orange,
  .theme--orange .timeline__item.is-active,
  .theme .theme--orange .timeline__item.is-active {
    border-color: #e26435; }
  .timeline__item.is-active.theme--salmon,
  .theme--salmon .timeline__item.is-active,
  .theme .theme--salmon .timeline__item.is-active {
    border-color: #eb735d; }
  .timeline__item.is-active.theme--red,
  .theme--red .timeline__item.is-active,
  .theme .theme--red .timeline__item.is-active {
    border-color: #ec2d10; }
  .timeline__item.is-active.theme--burgundy,
  .theme--burgundy .timeline__item.is-active,
  .theme .theme--burgundy .timeline__item.is-active {
    border-color: #ba222a; }
  .timeline__item.is-active.theme--purple,
  .theme--purple .timeline__item.is-active,
  .theme .theme--purple .timeline__item.is-active {
    border-color: #9b3381; }
  .timeline__item.is-active.theme--youth,
  .theme--youth .timeline__item.is-active,
  .theme .theme--youth .timeline__item.is-active {
    border-color: #d57800; }
  .timeline__item.is-active.theme--digitalisation,
  .theme--digitalisation .timeline__item.is-active,
  .theme .theme--digitalisation .timeline__item.is-active {
    border-color: #9a3324; }
  .timeline__item.is-active.theme--climate,
  .theme--climate .timeline__item.is-active,
  .theme .theme--climate .timeline__item.is-active {
    border-color: #693c5e; }
  .timeline__item.is-active.theme--gender,
  .theme--gender .timeline__item.is-active,
  .theme .theme--gender .timeline__item.is-active {
    border-color: #046a38; }
  .timeline__item.is-active.theme--nutrition,
  .theme--nutrition .timeline__item.is-active,
  .theme .theme--nutrition .timeline__item.is-active {
    border-color: #487a7b; }
  .timeline__item.is-active.theme--blog,
  .theme--blog .timeline__item.is-active,
  .theme .theme--blog .timeline__item.is-active {
    border-color: #ffa300; }
  .timeline__item.is-active.theme--spore-blue,
  .theme--spore-blue .timeline__item.is-active,
  .theme .theme--spore-blue .timeline__item.is-active {
    border-color: #3f68b1; }
  .timeline__item.is-active.theme--spore-brown,
  .theme--spore-brown .timeline__item.is-active,
  .theme .theme--spore-brown .timeline__item.is-active {
    border-color: #774b04; }
  .timeline__item.is-active.theme--spore-dark-blue,
  .theme--spore-dark-blue .timeline__item.is-active,
  .theme .theme--spore-dark-blue .timeline__item.is-active {
    border-color: #044e7e; }
  .timeline__item.is-active.theme--spore-forest-green,
  .theme--spore-forest-green .timeline__item.is-active,
  .theme .theme--spore-forest-green .timeline__item.is-active {
    border-color: #5f810a; }
  .timeline__item.is-active.theme--spore-grey-blue,
  .theme--spore-grey-blue .timeline__item.is-active,
  .theme .theme--spore-grey-blue .timeline__item.is-active {
    border-color: #6d8c9f; }
  .timeline__item.is-active.theme--spore-light-blue,
  .theme--spore-light-blue .timeline__item.is-active,
  .theme .theme--spore-light-blue .timeline__item.is-active {
    border-color: #79accf; }
  .timeline__item.is-active.theme--spore-lime,
  .theme--spore-lime .timeline__item.is-active,
  .theme .theme--spore-lime .timeline__item.is-active {
    border-color: #bbae03; }
  .timeline__item.is-active.theme--spore-ochre,
  .theme--spore-ochre .timeline__item.is-active,
  .theme .theme--spore-ochre .timeline__item.is-active {
    border-color: #db9623; }
  .timeline__item.is-active.theme--spore-olive-green,
  .theme--spore-olive-green .timeline__item.is-active,
  .theme .theme--spore-olive-green .timeline__item.is-active {
    border-color: #778d3e; }
  .timeline__item.is-active.theme--spore-red,
  .theme--spore-red .timeline__item.is-active,
  .theme .theme--spore-red .timeline__item.is-active {
    border-color: #f54c23; }
  .timeline__item.is-active.theme--spore-taupe,
  .theme--spore-taupe .timeline__item.is-active,
  .theme .theme--spore-taupe .timeline__item.is-active {
    border-color: #7b6d65; }
  .timeline__item.is-active.theme--spore-teal,
  .theme--spore-teal .timeline__item.is-active,
  .theme .theme--spore-teal .timeline__item.is-active {
    border-color: #077fc1; }
  .timeline__item.is-active:before, .timeline__item.is-active:after {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    content: "";
    display: block; }
  .timeline__item.is-active:after {
    width: 13.5px;
    /* Line-height plus padding*/
    height: 13.5px;
    border: 13.5px solid;
    border-color: transparent;
    border-left-color: inherit;
    -webkit-transform: scale(0.5, 1) translate(-13.5px, 0);
       -moz-transform: scale(0.5, 1) translate(-13.5px, 0);
        -ms-transform: scale(0.5, 1) translate(-13.5px, 0);
            transform: scale(0.5, 1) translate(-13.5px, 0); }
  .timeline__item.is-active:before {
    background-color: #67ab43; }
    .timeline__item.is-active:before.theme--dark,
    .theme--dark .timeline__item.is-active:before,
    .theme .theme--dark .timeline__item.is-active:before {
      background-color: #3d3d3d; }
    .timeline__item.is-active:before.theme--green,
    .theme--green .timeline__item.is-active:before,
    .theme .theme--green .timeline__item.is-active:before {
      background-color: #67ab43; }
    .timeline__item.is-active:before.theme--blue,
    .theme--blue .timeline__item.is-active:before,
    .theme .theme--blue .timeline__item.is-active:before {
      background-color: #56c0dd; }
    .timeline__item.is-active:before.theme--lime,
    .theme--lime .timeline__item.is-active:before,
    .theme .theme--lime .timeline__item.is-active:before {
      background-color: #c1d435; }
    .timeline__item.is-active:before.theme--yellow,
    .theme--yellow .timeline__item.is-active:before,
    .theme .theme--yellow .timeline__item.is-active:before {
      background-color: #facf21; }
    .timeline__item.is-active:before.theme--gold,
    .theme--gold .timeline__item.is-active:before,
    .theme .theme--gold .timeline__item.is-active:before {
      background-color: #eb942c; }
    .timeline__item.is-active:before.theme--orange,
    .theme--orange .timeline__item.is-active:before,
    .theme .theme--orange .timeline__item.is-active:before {
      background-color: #e26435; }
    .timeline__item.is-active:before.theme--salmon,
    .theme--salmon .timeline__item.is-active:before,
    .theme .theme--salmon .timeline__item.is-active:before {
      background-color: #eb735d; }
    .timeline__item.is-active:before.theme--red,
    .theme--red .timeline__item.is-active:before,
    .theme .theme--red .timeline__item.is-active:before {
      background-color: #ec2d10; }
    .timeline__item.is-active:before.theme--burgundy,
    .theme--burgundy .timeline__item.is-active:before,
    .theme .theme--burgundy .timeline__item.is-active:before {
      background-color: #ba222a; }
    .timeline__item.is-active:before.theme--purple,
    .theme--purple .timeline__item.is-active:before,
    .theme .theme--purple .timeline__item.is-active:before {
      background-color: #9b3381; }
    .timeline__item.is-active:before.theme--youth,
    .theme--youth .timeline__item.is-active:before,
    .theme .theme--youth .timeline__item.is-active:before {
      background-color: #d57800; }
    .timeline__item.is-active:before.theme--digitalisation,
    .theme--digitalisation .timeline__item.is-active:before,
    .theme .theme--digitalisation .timeline__item.is-active:before {
      background-color: #9a3324; }
    .timeline__item.is-active:before.theme--climate,
    .theme--climate .timeline__item.is-active:before,
    .theme .theme--climate .timeline__item.is-active:before {
      background-color: #693c5e; }
    .timeline__item.is-active:before.theme--gender,
    .theme--gender .timeline__item.is-active:before,
    .theme .theme--gender .timeline__item.is-active:before {
      background-color: #046a38; }
    .timeline__item.is-active:before.theme--nutrition,
    .theme--nutrition .timeline__item.is-active:before,
    .theme .theme--nutrition .timeline__item.is-active:before {
      background-color: #487a7b; }
    .timeline__item.is-active:before.theme--blog,
    .theme--blog .timeline__item.is-active:before,
    .theme .theme--blog .timeline__item.is-active:before {
      background-color: #ffa300; }
    .timeline__item.is-active:before.theme--spore-blue,
    .theme--spore-blue .timeline__item.is-active:before,
    .theme .theme--spore-blue .timeline__item.is-active:before {
      background-color: #3f68b1; }
    .timeline__item.is-active:before.theme--spore-brown,
    .theme--spore-brown .timeline__item.is-active:before,
    .theme .theme--spore-brown .timeline__item.is-active:before {
      background-color: #774b04; }
    .timeline__item.is-active:before.theme--spore-dark-blue,
    .theme--spore-dark-blue .timeline__item.is-active:before,
    .theme .theme--spore-dark-blue .timeline__item.is-active:before {
      background-color: #044e7e; }
    .timeline__item.is-active:before.theme--spore-forest-green,
    .theme--spore-forest-green .timeline__item.is-active:before,
    .theme .theme--spore-forest-green .timeline__item.is-active:before {
      background-color: #5f810a; }
    .timeline__item.is-active:before.theme--spore-grey-blue,
    .theme--spore-grey-blue .timeline__item.is-active:before,
    .theme .theme--spore-grey-blue .timeline__item.is-active:before {
      background-color: #6d8c9f; }
    .timeline__item.is-active:before.theme--spore-light-blue,
    .theme--spore-light-blue .timeline__item.is-active:before,
    .theme .theme--spore-light-blue .timeline__item.is-active:before {
      background-color: #79accf; }
    .timeline__item.is-active:before.theme--spore-lime,
    .theme--spore-lime .timeline__item.is-active:before,
    .theme .theme--spore-lime .timeline__item.is-active:before {
      background-color: #bbae03; }
    .timeline__item.is-active:before.theme--spore-ochre,
    .theme--spore-ochre .timeline__item.is-active:before,
    .theme .theme--spore-ochre .timeline__item.is-active:before {
      background-color: #db9623; }
    .timeline__item.is-active:before.theme--spore-olive-green,
    .theme--spore-olive-green .timeline__item.is-active:before,
    .theme .theme--spore-olive-green .timeline__item.is-active:before {
      background-color: #778d3e; }
    .timeline__item.is-active:before.theme--spore-red,
    .theme--spore-red .timeline__item.is-active:before,
    .theme .theme--spore-red .timeline__item.is-active:before {
      background-color: #f54c23; }
    .timeline__item.is-active:before.theme--spore-taupe,
    .theme--spore-taupe .timeline__item.is-active:before,
    .theme .theme--spore-taupe .timeline__item.is-active:before {
      background-color: #7b6d65; }
    .timeline__item.is-active:before.theme--spore-teal,
    .theme--spore-teal .timeline__item.is-active:before,
    .theme .theme--spore-teal .timeline__item.is-active:before {
      background-color: #077fc1; }

.timeline--bold .timeline__date {
  font-weight: bold; }

.timeline--l .timeline__label,
.timeline--l .timeline__item {
  padding-top: 12px;
  padding-bottom: 12px; }

.timeline--l .timeline__item.is-active:after {
  width: 19.5px;
  /* Line-height plus padding*/
  height: 19.5px;
  border: 19.5px solid;
  border-color: transparent;
  border-left-color: inherit;
  -webkit-transform: scale(0.5, 1) translate(-19.5px, 0);
     -moz-transform: scale(0.5, 1) translate(-19.5px, 0);
      -ms-transform: scale(0.5, 1) translate(-19.5px, 0);
          transform: scale(0.5, 1) translate(-19.5px, 0); }

.timeline--overlay {
  background: rgba(255, 255, 255, 0.8); }

.timeline--10 .timeline__item.is-active:before {
  width: 10%; }

.timeline--10 .timeline__item.is-active:after {
  left: 10%; }

.timeline__label, .timeline__item.is-complete,
.timeline--50 .timeline__item.is-active,
.timeline--60 .timeline__item.is-active,
.timeline--70 .timeline__item.is-active,
.timeline--80 .timeline__item.is-active,
.timeline--90 .timeline__item.is-active {
  color: #fff; }

.timeline--20 .timeline__item.is-active:before {
  width: 20%; }

.timeline--20 .timeline__item.is-active:after {
  left: 20%; }

.timeline--30 .timeline__item.is-active:before {
  width: 30%; }

.timeline--30 .timeline__item.is-active:after {
  left: 30%; }

.timeline--40 .timeline__item.is-active:before {
  width: 40%; }

.timeline--40 .timeline__item.is-active:after {
  left: 40%; }

.timeline--50 .timeline__item.is-active:before {
  width: 50%; }

.timeline--50 .timeline__item.is-active:after {
  left: 50%; }

.timeline--60 .timeline__item.is-active:before {
  width: 60%; }

.timeline--60 .timeline__item.is-active:after {
  left: 60%; }

.timeline--70 .timeline__item.is-active:before {
  width: 70%; }

.timeline--70 .timeline__item.is-active:after {
  left: 70%; }

.timeline--80 .timeline__item.is-active:before {
  width: 80%; }

.timeline--80 .timeline__item.is-active:after {
  left: 80%; }

.timeline--90 .timeline__item.is-active:before {
  width: 90%; }

.timeline--90 .timeline__item.is-active:after {
  left: 90%; }

.no-flexbox .timeline,
.no-flexbox .timeline--overlay {
  width: 100%; }

@media only screen and (min-width: 48em) {
  .timeline__item {
    text-align: left; }
  .timeline--20 .timeline__item.is-active,
  .timeline--30 .timeline__item.is-active,
  .timeline--40 .timeline__item.is-active {
    color: #fff; } }

.hero .timeline {
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0; }

/* 4.31 Newsletter signup */
/*
Newsletter signup

markup:
<form class="leader trailer gutters" method="post" action="">
    <input type="hidden" name="idstamp" value="Ppma7o+2LxA/UkYd/IPXFAGOYgNad6m5vGqo2v42qFo=">
    <input type="hidden" name="Field10" value="en">
    <h2 class="title">Be sure you don't miss our latest updates.</h2>
    <fieldset class="leader trailer">
        <label class="fld-label title title--meta" for="firstname">Firstname</label>
        <input class="fld" type="text" id="firstname" name="Field6">
        <label class="fld-label title title--meta" for="lastname">Lastname</label>
        <input class="fld" type="text" id="lastname" name="Field7">
        <label class="fld-label title title--meta" for="email">E-mail address</label>
        <input class="fld" type="text" name="Field1" id="email">
    </fieldset>
    <button class="button button--stretch">Subscribe</button>
</form>

sg-wrapper:
<div style="width: 450px;">
    <sg-wrapper-content/>
</div>

Styleguide 4.31
*/
/* 4.32 Site logo */
/*
Site logo

A stand alone site logo

markup:
<div class="site-logo wings">
  <a class="site-logo__brand--cta gutters" href="javascript:void();">
    <figure class="brand--cta"><figcaption class="is-narrative">CTA Homepage</figcaption></figure>
  </a>
</div>

Styleguide 4.32
*/
.site-logo {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }
  .site-logo__brand--cta {
    position: relative;
    margin-left: 18px;
    /* Make sure leaf does not fall off the page */
    z-index: 1; }
    .no-flexbox .site-logo__brand--cta {
      float: left; }

/* 4.33 Vacancies */
/*
Vacancies

markup:
<div class="media">
    <div class="media__figure  |  gutters gutter-mobile--right">
        <span class="stamp stamp--open">
            <span class="stamp__body">open</span>
        </span>
    </div>
    <div class="media__content">
        <div class="media media--unfold">
            <div class="media__body  |  gutters  |  trailer">
                <h1 class="title title--section"><a class="is-heir  anchor--shy" href="">Project Manager, geoPuu</a></h1>
                <p class="meta  |  leader--small  |  trailer--small"><strong>Published on:</strong><br> 18 January 2018</p>
                <p>CTA seeks to recruit a Project Manager for the geoPuu project. The Project Manager will be based in Ghana and coordinate the project on behalf of CTA by working with consortium partners and other third-party service providers.</p>
                <a class="read-more  |  leader--small" href="">Read More</a>
            </div>
            <div class="media__figure  media__aside  |  wings  |  trailer">
                <dl class="meta  |  trailer--normal trailer-inside--tiny  |  gutters">
                    <dt><strong>Closing date for application:</strong></dt>
                    <dd class="trailer--small">15 February 2018</dd>
                    <dt><strong>Type of contract:</strong></dt>
                    <dd class="trailer--small">International staff, short term contract (1 year, renewable until end of the project), full time (40 hours/week)</dd>
                </dl>
                <div class="gutters">
                    <div class="media media--middle  |  location">
                        <span class="location__marker  |  media__figure">
                            <span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">Location:</span></span>
                        </span>
                        <div class="location__body  |  media__content">Wageningen, Netherlands</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Styleguide 4.33
*/
/* Outdated styling? */
/* 4.34 Addendum */
/*
Addendum

.addendum - Addendum

markup:
<div class="{$modifiers}">
    <h3 class="addendum__title  |  title title--sub-section  |  trailer--normal">Our programmes</h3>
    <p class="trailer--small">CTA has organised its activities under two operational programmes:</p>
    <ul class="reset">
        <li class="trailer--small"><a class="anchor" href="javascript:void(0);">Policies, Markets, and Information &amp; Communication Technologies (PMI)</a></li>
        <li class="trailer--small"><a class="anchor" href="javascript:void(0);">Knowledge Management and Communication (KMC)</a></li>
    </ul>
    <p>The PMI and KMC programmes are supported  by a unit devoted to promoting organisational <a class="anchor" href="javascript:void(0);">earning and effective monitoring, evaluation and impact assessment (LME)</a>.</p>
</div>

sg-wrapper:
<div class="theme theme--dark">
    <div class="about-cta  |  leader-inside  |  trailer-inside  |  gutters">
        <sg-wrapper-content/>
    </div>
</div>

Styleguide 4.34
*/
.addendum {
  padding-left: 30px;
  font-size: 0.875em;
  border-width: 0 0 0 7px;
  border-style: solid;
  border-color: #67ab43; }
  .addendum__title {
    font-size: 0.875em;
    color: #fff; }
  .addendum .anchor {
    color: #67ab43; }

/* 4.35 Legenda */
/*
Legend

This legend is used on the About us page as asset for the world map.

markup:
<div class="legenda">
  <ul class="legenda__list  |  reset">
    <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--gold"></span>Caribbean</li>
    <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--orange"></span>Western Africa</li>
    <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--red"></span>Eastern Africa</li>
    <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--purple"></span>Central Africa</li>
    <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--yellow"></span>Southern Africa</li>
    <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--blue"></span>Pacific</li>
  </ul>
</div>

sg-wrapper:
<div class="theme theme--dark">
    <div class="about-cta  |  leader-inside  |  trailer-inside  |  gutters">
        <sg-wrapper-content/>
    </div>
</div>

Styleguide 4.35
*/
.legenda__item {
  color: #fff; }
  .legenda__item--identifier {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 12px; }
    .legenda__item--identifier-l {
      width: 16px;
      height: 16px;
      margin-top: 4px; }
  .legenda__item--gold, .legenda__item--identifier.theme--gold {
    background: #eb942c; }
  .legenda__item--orange, .legenda__item--identifier.theme--orange {
    background: #e26435; }
  .legenda__item--red, .legenda__item--identifier.theme--red {
    background: #ec2d10; }
  .legenda__item--purple, .legenda__item--identifier.theme--purple {
    background: #9b3381; }
  .legenda__item--yellow, .legenda__item--identifier.theme--yellow {
    background: #facf21; }
  .legenda__item--blue, .legenda__item--identifier.theme--blue {
    background: #56c0dd; }
  .legenda__item--lime, .legenda__item--identifier.theme--lime {
    background: #c1d435; }
  .legenda__item--green, .legenda__item--identifier.theme--lime {
    background: #67ab43; }
  .legenda__item--salmon, .legenda__item--identifier.theme--salmon {
    background: #eb735d; }
  .legenda__item--burgundy, .legenda__item--identifier.theme--burgundy {
    background: #ba222a; }

/* 4.36 Goals */
/*
Goals

.goal - General goal styling
.goal.goal--filled - Filled goal background
.goal.goal--outlined - Outlined goal

markup:
<div class="{$modifiers}">
    <h4 class="goal__title  |  title title--sub-section  |  trailer--small">Mission</h4>
    <p class="body--whisper">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam quis risus eget urna mollis ornare vel eu leo.</p>
</div>

sg-wrapper:
<div class="theme theme--dark">
    <div class="about-cta  |  leader-inside  |  trailer-inside  |  gutters">
        <sg-wrapper-content/>
    </div>
</div>

Styleguide 4.36
*/
.goal {
  padding: 39px;
  width: 260px; }
  .goal__title {
    color: #fff; }
  .goal--filled {
    background: rgba(0, 0, 0, 0.26); }
  .goal--outlined {
    border-width: 2px;
    border-style: solid;
    border-color: #67ab43; }
    .goal--outlined.theme--dark,
    .theme--dark .goal--outlined,
    .theme .theme--dark .goal--outlined {
      border-color: #3d3d3d; }
    .goal--outlined.theme--green,
    .theme--green .goal--outlined,
    .theme .theme--green .goal--outlined {
      border-color: #67ab43; }
    .goal--outlined.theme--blue,
    .theme--blue .goal--outlined,
    .theme .theme--blue .goal--outlined {
      border-color: #56c0dd; }
    .goal--outlined.theme--lime,
    .theme--lime .goal--outlined,
    .theme .theme--lime .goal--outlined {
      border-color: #c1d435; }
    .goal--outlined.theme--yellow,
    .theme--yellow .goal--outlined,
    .theme .theme--yellow .goal--outlined {
      border-color: #facf21; }
    .goal--outlined.theme--gold,
    .theme--gold .goal--outlined,
    .theme .theme--gold .goal--outlined {
      border-color: #eb942c; }
    .goal--outlined.theme--orange,
    .theme--orange .goal--outlined,
    .theme .theme--orange .goal--outlined {
      border-color: #e26435; }
    .goal--outlined.theme--salmon,
    .theme--salmon .goal--outlined,
    .theme .theme--salmon .goal--outlined {
      border-color: #eb735d; }
    .goal--outlined.theme--red,
    .theme--red .goal--outlined,
    .theme .theme--red .goal--outlined {
      border-color: #ec2d10; }
    .goal--outlined.theme--burgundy,
    .theme--burgundy .goal--outlined,
    .theme .theme--burgundy .goal--outlined {
      border-color: #ba222a; }
    .goal--outlined.theme--purple,
    .theme--purple .goal--outlined,
    .theme .theme--purple .goal--outlined {
      border-color: #9b3381; }
    .goal--outlined.theme--youth,
    .theme--youth .goal--outlined,
    .theme .theme--youth .goal--outlined {
      border-color: #d57800; }
    .goal--outlined.theme--digitalisation,
    .theme--digitalisation .goal--outlined,
    .theme .theme--digitalisation .goal--outlined {
      border-color: #9a3324; }
    .goal--outlined.theme--climate,
    .theme--climate .goal--outlined,
    .theme .theme--climate .goal--outlined {
      border-color: #693c5e; }
    .goal--outlined.theme--gender,
    .theme--gender .goal--outlined,
    .theme .theme--gender .goal--outlined {
      border-color: #046a38; }
    .goal--outlined.theme--nutrition,
    .theme--nutrition .goal--outlined,
    .theme .theme--nutrition .goal--outlined {
      border-color: #487a7b; }
    .goal--outlined.theme--blog,
    .theme--blog .goal--outlined,
    .theme .theme--blog .goal--outlined {
      border-color: #ffa300; }
    .goal--outlined.theme--spore-blue,
    .theme--spore-blue .goal--outlined,
    .theme .theme--spore-blue .goal--outlined {
      border-color: #3f68b1; }
    .goal--outlined.theme--spore-brown,
    .theme--spore-brown .goal--outlined,
    .theme .theme--spore-brown .goal--outlined {
      border-color: #774b04; }
    .goal--outlined.theme--spore-dark-blue,
    .theme--spore-dark-blue .goal--outlined,
    .theme .theme--spore-dark-blue .goal--outlined {
      border-color: #044e7e; }
    .goal--outlined.theme--spore-forest-green,
    .theme--spore-forest-green .goal--outlined,
    .theme .theme--spore-forest-green .goal--outlined {
      border-color: #5f810a; }
    .goal--outlined.theme--spore-grey-blue,
    .theme--spore-grey-blue .goal--outlined,
    .theme .theme--spore-grey-blue .goal--outlined {
      border-color: #6d8c9f; }
    .goal--outlined.theme--spore-light-blue,
    .theme--spore-light-blue .goal--outlined,
    .theme .theme--spore-light-blue .goal--outlined {
      border-color: #79accf; }
    .goal--outlined.theme--spore-lime,
    .theme--spore-lime .goal--outlined,
    .theme .theme--spore-lime .goal--outlined {
      border-color: #bbae03; }
    .goal--outlined.theme--spore-ochre,
    .theme--spore-ochre .goal--outlined,
    .theme .theme--spore-ochre .goal--outlined {
      border-color: #db9623; }
    .goal--outlined.theme--spore-olive-green,
    .theme--spore-olive-green .goal--outlined,
    .theme .theme--spore-olive-green .goal--outlined {
      border-color: #778d3e; }
    .goal--outlined.theme--spore-red,
    .theme--spore-red .goal--outlined,
    .theme .theme--spore-red .goal--outlined {
      border-color: #f54c23; }
    .goal--outlined.theme--spore-taupe,
    .theme--spore-taupe .goal--outlined,
    .theme .theme--spore-taupe .goal--outlined {
      border-color: #7b6d65; }
    .goal--outlined.theme--spore-teal,
    .theme--spore-teal .goal--outlined,
    .theme .theme--spore-teal .goal--outlined {
      border-color: #077fc1; }
    .theme--dark .goal--outlined {
      border-color: #c2c2c2; }

/* 4.37 Strategic goals */
/*
Strategic goals

markup:
<div class="strategic-goals  |  gutters-outside">
    <div class="grid grid--musketeers">
        <div class="grid__cell  |  strategic-goals__item  |  divider divider--left  |  gutters">
            <div class="title title--sub-section">
                <span class="strategic-goals__number">01</span>
                <div class="strategic-goals__title">Profitable smallholder value chains</div>
            </div>
            <span class="strategic-goals__illustration illustration illustration--fish-market-supplier"></span>
        </div>
        <div class="grid__cell  |  strategic-goals__item  |  divider divider--left  |  gutters">
            <div class="title title--sub-section">
                <span class="strategic-goals__number">02</span>
                <div class="strategic-goals__title">Conducive agricultural policies</div>
            </div>
            <span class="strategic-goals__illustration illustration illustration--factory"></span>
        </div>
        <div class="grid__cell  |  strategic-goals__item  |  divider divider--left  |  gutters">
            <div class="title title--sub-section">
                <span class="strategic-goals__number">03</span>
                <div class="strategic-goals__title">Enhanced capacity for knowledge management</div>
            </div>
            <span class="strategic-goals__illustration illustration illustration--farmer-presentation"></span>
        </div>
    </div>
</div>

sg-wrapper:
<div class="theme theme--dark">
    <div class="about-cta  |  leader-inside  |  trailer-inside--hero  |  gutters">
        <sg-wrapper-content/>
    </div>
</div>

Styleguide 4.37
*/
.strategic-goals {
  background-color: #67ab43;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
  .strategic-goals.theme--dark,
  .theme--dark .strategic-goals,
  .theme .theme--dark .strategic-goals {
    background-color: #3d3d3d; }
  .strategic-goals.theme--green,
  .theme--green .strategic-goals,
  .theme .theme--green .strategic-goals {
    background-color: #67ab43; }
  .strategic-goals.theme--blue,
  .theme--blue .strategic-goals,
  .theme .theme--blue .strategic-goals {
    background-color: #56c0dd; }
  .strategic-goals.theme--lime,
  .theme--lime .strategic-goals,
  .theme .theme--lime .strategic-goals {
    background-color: #c1d435; }
  .strategic-goals.theme--yellow,
  .theme--yellow .strategic-goals,
  .theme .theme--yellow .strategic-goals {
    background-color: #facf21; }
  .strategic-goals.theme--gold,
  .theme--gold .strategic-goals,
  .theme .theme--gold .strategic-goals {
    background-color: #eb942c; }
  .strategic-goals.theme--orange,
  .theme--orange .strategic-goals,
  .theme .theme--orange .strategic-goals {
    background-color: #e26435; }
  .strategic-goals.theme--salmon,
  .theme--salmon .strategic-goals,
  .theme .theme--salmon .strategic-goals {
    background-color: #eb735d; }
  .strategic-goals.theme--red,
  .theme--red .strategic-goals,
  .theme .theme--red .strategic-goals {
    background-color: #ec2d10; }
  .strategic-goals.theme--burgundy,
  .theme--burgundy .strategic-goals,
  .theme .theme--burgundy .strategic-goals {
    background-color: #ba222a; }
  .strategic-goals.theme--purple,
  .theme--purple .strategic-goals,
  .theme .theme--purple .strategic-goals {
    background-color: #9b3381; }
  .strategic-goals.theme--youth,
  .theme--youth .strategic-goals,
  .theme .theme--youth .strategic-goals {
    background-color: #d57800; }
  .strategic-goals.theme--digitalisation,
  .theme--digitalisation .strategic-goals,
  .theme .theme--digitalisation .strategic-goals {
    background-color: #9a3324; }
  .strategic-goals.theme--climate,
  .theme--climate .strategic-goals,
  .theme .theme--climate .strategic-goals {
    background-color: #693c5e; }
  .strategic-goals.theme--gender,
  .theme--gender .strategic-goals,
  .theme .theme--gender .strategic-goals {
    background-color: #046a38; }
  .strategic-goals.theme--nutrition,
  .theme--nutrition .strategic-goals,
  .theme .theme--nutrition .strategic-goals {
    background-color: #487a7b; }
  .strategic-goals.theme--blog,
  .theme--blog .strategic-goals,
  .theme .theme--blog .strategic-goals {
    background-color: #ffa300; }
  .strategic-goals.theme--spore-blue,
  .theme--spore-blue .strategic-goals,
  .theme .theme--spore-blue .strategic-goals {
    background-color: #3f68b1; }
  .strategic-goals.theme--spore-brown,
  .theme--spore-brown .strategic-goals,
  .theme .theme--spore-brown .strategic-goals {
    background-color: #774b04; }
  .strategic-goals.theme--spore-dark-blue,
  .theme--spore-dark-blue .strategic-goals,
  .theme .theme--spore-dark-blue .strategic-goals {
    background-color: #044e7e; }
  .strategic-goals.theme--spore-forest-green,
  .theme--spore-forest-green .strategic-goals,
  .theme .theme--spore-forest-green .strategic-goals {
    background-color: #5f810a; }
  .strategic-goals.theme--spore-grey-blue,
  .theme--spore-grey-blue .strategic-goals,
  .theme .theme--spore-grey-blue .strategic-goals {
    background-color: #6d8c9f; }
  .strategic-goals.theme--spore-light-blue,
  .theme--spore-light-blue .strategic-goals,
  .theme .theme--spore-light-blue .strategic-goals {
    background-color: #79accf; }
  .strategic-goals.theme--spore-lime,
  .theme--spore-lime .strategic-goals,
  .theme .theme--spore-lime .strategic-goals {
    background-color: #bbae03; }
  .strategic-goals.theme--spore-ochre,
  .theme--spore-ochre .strategic-goals,
  .theme .theme--spore-ochre .strategic-goals {
    background-color: #db9623; }
  .strategic-goals.theme--spore-olive-green,
  .theme--spore-olive-green .strategic-goals,
  .theme .theme--spore-olive-green .strategic-goals {
    background-color: #778d3e; }
  .strategic-goals.theme--spore-red,
  .theme--spore-red .strategic-goals,
  .theme .theme--spore-red .strategic-goals {
    background-color: #f54c23; }
  .strategic-goals.theme--spore-taupe,
  .theme--spore-taupe .strategic-goals,
  .theme .theme--spore-taupe .strategic-goals {
    background-color: #7b6d65; }
  .strategic-goals.theme--spore-teal,
  .theme--spore-teal .strategic-goals,
  .theme .theme--spore-teal .strategic-goals {
    background-color: #077fc1; }
  .strategic-goals__item {
    position: relative;
    min-height: 210px;
    border-bottom: 1px solid #485a3f; }
    @media only screen and (min-width: 48em) {
      .strategic-goals__item {
        min-height: 258px; } }
    .strategic-goals__item:before {
      background-color: #67ab43;
      border-color: #485a3f;
      position: absolute;
      content: "";
      width: 14px;
      height: 14px;
      border-width: 1px;
      border-style: solid;
      -moz-border-radius: 50%;
           border-radius: 50%;
      bottom: -7px;
      left: -7px;
      z-index: 1; }
      .strategic-goals__item:before.theme--dark,
      .theme--dark .strategic-goals__item:before,
      .theme .theme--dark .strategic-goals__item:before {
        background-color: #3d3d3d; }
      .strategic-goals__item:before.theme--green,
      .theme--green .strategic-goals__item:before,
      .theme .theme--green .strategic-goals__item:before {
        background-color: #67ab43; }
      .strategic-goals__item:before.theme--blue,
      .theme--blue .strategic-goals__item:before,
      .theme .theme--blue .strategic-goals__item:before {
        background-color: #56c0dd; }
      .strategic-goals__item:before.theme--lime,
      .theme--lime .strategic-goals__item:before,
      .theme .theme--lime .strategic-goals__item:before {
        background-color: #c1d435; }
      .strategic-goals__item:before.theme--yellow,
      .theme--yellow .strategic-goals__item:before,
      .theme .theme--yellow .strategic-goals__item:before {
        background-color: #facf21; }
      .strategic-goals__item:before.theme--gold,
      .theme--gold .strategic-goals__item:before,
      .theme .theme--gold .strategic-goals__item:before {
        background-color: #eb942c; }
      .strategic-goals__item:before.theme--orange,
      .theme--orange .strategic-goals__item:before,
      .theme .theme--orange .strategic-goals__item:before {
        background-color: #e26435; }
      .strategic-goals__item:before.theme--salmon,
      .theme--salmon .strategic-goals__item:before,
      .theme .theme--salmon .strategic-goals__item:before {
        background-color: #eb735d; }
      .strategic-goals__item:before.theme--red,
      .theme--red .strategic-goals__item:before,
      .theme .theme--red .strategic-goals__item:before {
        background-color: #ec2d10; }
      .strategic-goals__item:before.theme--burgundy,
      .theme--burgundy .strategic-goals__item:before,
      .theme .theme--burgundy .strategic-goals__item:before {
        background-color: #ba222a; }
      .strategic-goals__item:before.theme--purple,
      .theme--purple .strategic-goals__item:before,
      .theme .theme--purple .strategic-goals__item:before {
        background-color: #9b3381; }
      .strategic-goals__item:before.theme--youth,
      .theme--youth .strategic-goals__item:before,
      .theme .theme--youth .strategic-goals__item:before {
        background-color: #d57800; }
      .strategic-goals__item:before.theme--digitalisation,
      .theme--digitalisation .strategic-goals__item:before,
      .theme .theme--digitalisation .strategic-goals__item:before {
        background-color: #9a3324; }
      .strategic-goals__item:before.theme--climate,
      .theme--climate .strategic-goals__item:before,
      .theme .theme--climate .strategic-goals__item:before {
        background-color: #693c5e; }
      .strategic-goals__item:before.theme--gender,
      .theme--gender .strategic-goals__item:before,
      .theme .theme--gender .strategic-goals__item:before {
        background-color: #046a38; }
      .strategic-goals__item:before.theme--nutrition,
      .theme--nutrition .strategic-goals__item:before,
      .theme .theme--nutrition .strategic-goals__item:before {
        background-color: #487a7b; }
      .strategic-goals__item:before.theme--blog,
      .theme--blog .strategic-goals__item:before,
      .theme .theme--blog .strategic-goals__item:before {
        background-color: #ffa300; }
      .strategic-goals__item:before.theme--spore-blue,
      .theme--spore-blue .strategic-goals__item:before,
      .theme .theme--spore-blue .strategic-goals__item:before {
        background-color: #3f68b1; }
      .strategic-goals__item:before.theme--spore-brown,
      .theme--spore-brown .strategic-goals__item:before,
      .theme .theme--spore-brown .strategic-goals__item:before {
        background-color: #774b04; }
      .strategic-goals__item:before.theme--spore-dark-blue,
      .theme--spore-dark-blue .strategic-goals__item:before,
      .theme .theme--spore-dark-blue .strategic-goals__item:before {
        background-color: #044e7e; }
      .strategic-goals__item:before.theme--spore-forest-green,
      .theme--spore-forest-green .strategic-goals__item:before,
      .theme .theme--spore-forest-green .strategic-goals__item:before {
        background-color: #5f810a; }
      .strategic-goals__item:before.theme--spore-grey-blue,
      .theme--spore-grey-blue .strategic-goals__item:before,
      .theme .theme--spore-grey-blue .strategic-goals__item:before {
        background-color: #6d8c9f; }
      .strategic-goals__item:before.theme--spore-light-blue,
      .theme--spore-light-blue .strategic-goals__item:before,
      .theme .theme--spore-light-blue .strategic-goals__item:before {
        background-color: #79accf; }
      .strategic-goals__item:before.theme--spore-lime,
      .theme--spore-lime .strategic-goals__item:before,
      .theme .theme--spore-lime .strategic-goals__item:before {
        background-color: #bbae03; }
      .strategic-goals__item:before.theme--spore-ochre,
      .theme--spore-ochre .strategic-goals__item:before,
      .theme .theme--spore-ochre .strategic-goals__item:before {
        background-color: #db9623; }
      .strategic-goals__item:before.theme--spore-olive-green,
      .theme--spore-olive-green .strategic-goals__item:before,
      .theme .theme--spore-olive-green .strategic-goals__item:before {
        background-color: #778d3e; }
      .strategic-goals__item:before.theme--spore-red,
      .theme--spore-red .strategic-goals__item:before,
      .theme .theme--spore-red .strategic-goals__item:before {
        background-color: #f54c23; }
      .strategic-goals__item:before.theme--spore-taupe,
      .theme--spore-taupe .strategic-goals__item:before,
      .theme .theme--spore-taupe .strategic-goals__item:before {
        background-color: #7b6d65; }
      .strategic-goals__item:before.theme--spore-teal,
      .theme--spore-teal .strategic-goals__item:before,
      .theme .theme--spore-teal .strategic-goals__item:before {
        background-color: #077fc1; }
  .strategic-goals__illustration {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center; }

.theme--dark .strategic-goals__item.strategic-goals__item {
  color: #fff; }

.illustration--fish-market-supplier {
  font-size: 6em;
  color: #56c0dd;
  -webkit-transform: translateY(38%);
     -moz-transform: translateY(38%);
      -ms-transform: translateY(38%);
          transform: translateY(38%); }
  @media only screen and (min-width: 48em) {
    .illustration--fish-market-supplier {
      font-size: 6vw; } }

.illustration--factory {
  font-size: 6em;
  color: #eb735d; }
  @media only screen and (min-width: 48em) {
    .illustration--factory {
      font-size: 5vw; } }

.illustration--farmer-presentation {
  font-size: 10em;
  color: #facf21;
  bottom: -1px; }
  @media only screen and (min-width: 48em) {
    .illustration--farmer-presentation {
      font-size: 8vw; } }

/* 4.39 Testimonial */
/*
Testimonial

Image and quote.

markup:
<article class="layout layout--even">
    <div class="layout__cell layout__cell--main  |  wing--right">
        <blockquote class="leader  |  gutters">
            <p class="quote">I gained a lot in terms of self-confidence. I learnt so many tools that make my work more effective. In future I will be able to do more for the young people than I am doing now.</p>
            <footer>
                <p class="meta  |  leader  |  trailer">Yagoub Husna, CTA Data assistant</p>
                <a class="title" href="https://player.vimeo.com/video/91156049">Watch the interview</a>
            </footer>
        </blockquote>
    </div>
    <div class="layout__cell layout__cell--aside">
        <iframe class="gutters  |  iframe-video" src="https://player.vimeo.com/video/91156049?color=ffffff%26byline=0" width="640" height="360" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
    </div>
</article>

Styleguide 4.39
*/
.testimonial__quote {
  margin-top: 30px;
  margin-bottom: 30px; }

@media only screen and (min-width: 48em) {
  .testimonial {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; }
    .testimonial__quote {
      margin-top: 0;
      margin-bottom: 0; }
    .testimonial--align-center {
      -webkit-box-align: center;
         -moz-box-align: center;
          -ms-flex-align: center;
              align-items: center; }
    .no-flexbox .testimonial__tile, .no-flexbox .testimonial__quote {
      display: inline-block;
      vertical-align: middle; }
    .testimonial__tile {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 0 50%;
              flex: 0 0 50%;
      width: 50%;
      margin-bottom: 15px; } }

/* 4.40 Publication */
.publication-banner {
  color: #fff; }
  .publication-banner__meta {
    width: 100%;
    color: #67ab43;
    background-color: #d7e9ce;
    padding-top: 6px;
    padding-bottom: 6px;
    font-family: "Open Sans", sans-serif;
    text-transform: uppercase;
    font-size: 0.75em; }
    .publication-banner__meta.theme--dark,
    .theme--dark .publication-banner__meta,
    .theme .theme.theme--dark .publication-banner__meta {
      color: #3d3d3d; }
    .publication-banner__meta.theme--green,
    .theme--green .publication-banner__meta,
    .theme .theme.theme--green .publication-banner__meta {
      color: #67ab43; }
    .publication-banner__meta.theme--blue,
    .theme--blue .publication-banner__meta,
    .theme .theme.theme--blue .publication-banner__meta {
      color: #56c0dd; }
    .publication-banner__meta.theme--lime,
    .theme--lime .publication-banner__meta,
    .theme .theme.theme--lime .publication-banner__meta {
      color: #c1d435; }
    .publication-banner__meta.theme--yellow,
    .theme--yellow .publication-banner__meta,
    .theme .theme.theme--yellow .publication-banner__meta {
      color: #facf21; }
    .publication-banner__meta.theme--gold,
    .theme--gold .publication-banner__meta,
    .theme .theme.theme--gold .publication-banner__meta {
      color: #eb942c; }
    .publication-banner__meta.theme--orange,
    .theme--orange .publication-banner__meta,
    .theme .theme.theme--orange .publication-banner__meta {
      color: #e26435; }
    .publication-banner__meta.theme--salmon,
    .theme--salmon .publication-banner__meta,
    .theme .theme.theme--salmon .publication-banner__meta {
      color: #eb735d; }
    .publication-banner__meta.theme--red,
    .theme--red .publication-banner__meta,
    .theme .theme.theme--red .publication-banner__meta {
      color: #ec2d10; }
    .publication-banner__meta.theme--burgundy,
    .theme--burgundy .publication-banner__meta,
    .theme .theme.theme--burgundy .publication-banner__meta {
      color: #ba222a; }
    .publication-banner__meta.theme--purple,
    .theme--purple .publication-banner__meta,
    .theme .theme.theme--purple .publication-banner__meta {
      color: #9b3381; }
    .publication-banner__meta.theme--youth,
    .theme--youth .publication-banner__meta,
    .theme .theme.theme--youth .publication-banner__meta {
      color: #d57800; }
    .publication-banner__meta.theme--digitalisation,
    .theme--digitalisation .publication-banner__meta,
    .theme .theme.theme--digitalisation .publication-banner__meta {
      color: #9a3324; }
    .publication-banner__meta.theme--climate,
    .theme--climate .publication-banner__meta,
    .theme .theme.theme--climate .publication-banner__meta {
      color: #693c5e; }
    .publication-banner__meta.theme--gender,
    .theme--gender .publication-banner__meta,
    .theme .theme.theme--gender .publication-banner__meta {
      color: #046a38; }
    .publication-banner__meta.theme--nutrition,
    .theme--nutrition .publication-banner__meta,
    .theme .theme.theme--nutrition .publication-banner__meta {
      color: #487a7b; }
    .publication-banner__meta.theme--blog,
    .theme--blog .publication-banner__meta,
    .theme .theme.theme--blog .publication-banner__meta {
      color: #ffa300; }
    .publication-banner__meta.theme--spore-blue,
    .theme--spore-blue .publication-banner__meta,
    .theme .theme.theme--spore-blue .publication-banner__meta {
      color: #3f68b1; }
    .publication-banner__meta.theme--spore-brown,
    .theme--spore-brown .publication-banner__meta,
    .theme .theme.theme--spore-brown .publication-banner__meta {
      color: #774b04; }
    .publication-banner__meta.theme--spore-dark-blue,
    .theme--spore-dark-blue .publication-banner__meta,
    .theme .theme.theme--spore-dark-blue .publication-banner__meta {
      color: #044e7e; }
    .publication-banner__meta.theme--spore-forest-green,
    .theme--spore-forest-green .publication-banner__meta,
    .theme .theme.theme--spore-forest-green .publication-banner__meta {
      color: #5f810a; }
    .publication-banner__meta.theme--spore-grey-blue,
    .theme--spore-grey-blue .publication-banner__meta,
    .theme .theme.theme--spore-grey-blue .publication-banner__meta {
      color: #6d8c9f; }
    .publication-banner__meta.theme--spore-light-blue,
    .theme--spore-light-blue .publication-banner__meta,
    .theme .theme.theme--spore-light-blue .publication-banner__meta {
      color: #79accf; }
    .publication-banner__meta.theme--spore-lime,
    .theme--spore-lime .publication-banner__meta,
    .theme .theme.theme--spore-lime .publication-banner__meta {
      color: #bbae03; }
    .publication-banner__meta.theme--spore-ochre,
    .theme--spore-ochre .publication-banner__meta,
    .theme .theme.theme--spore-ochre .publication-banner__meta {
      color: #db9623; }
    .publication-banner__meta.theme--spore-olive-green,
    .theme--spore-olive-green .publication-banner__meta,
    .theme .theme.theme--spore-olive-green .publication-banner__meta {
      color: #778d3e; }
    .publication-banner__meta.theme--spore-red,
    .theme--spore-red .publication-banner__meta,
    .theme .theme.theme--spore-red .publication-banner__meta {
      color: #f54c23; }
    .publication-banner__meta.theme--spore-taupe,
    .theme--spore-taupe .publication-banner__meta,
    .theme .theme.theme--spore-taupe .publication-banner__meta {
      color: #7b6d65; }
    .publication-banner__meta.theme--spore-teal,
    .theme--spore-teal .publication-banner__meta,
    .theme .theme.theme--spore-teal .publication-banner__meta {
      color: #077fc1; }
    .publication-banner__meta.theme--dark,
    .theme--dark .publication-banner__meta,
    .theme .theme--dark .publication-banner__meta {
      background-color: #cdcdcd; }
    .publication-banner__meta.theme--green,
    .theme--green .publication-banner__meta,
    .theme .theme--green .publication-banner__meta {
      background-color: #d7e9ce; }
    .publication-banner__meta.theme--blue,
    .theme--blue .publication-banner__meta,
    .theme .theme--blue .publication-banner__meta {
      background-color: #d3eff6; }
    .publication-banner__meta.theme--lime,
    .theme--lime .publication-banner__meta,
    .theme .theme--lime .publication-banner__meta {
      background-color: #eff4ca; }
    .publication-banner__meta.theme--yellow,
    .theme--yellow .publication-banner__meta,
    .theme .theme--yellow .publication-banner__meta {
      background-color: #fef3c5; }
    .publication-banner__meta.theme--gold,
    .theme--gold .publication-banner__meta,
    .theme .theme--gold .publication-banner__meta {
      background-color: #fae3c8; }
    .publication-banner__meta.theme--orange,
    .theme--orange .publication-banner__meta,
    .theme .theme--orange .publication-banner__meta {
      background-color: #f7d7ca; }
    .publication-banner__meta.theme--salmon,
    .theme--salmon .publication-banner__meta,
    .theme .theme--salmon .publication-banner__meta {
      background-color: #fadbd5; }
    .publication-banner__meta.theme--red,
    .theme--red .publication-banner__meta,
    .theme .theme--red .publication-banner__meta {
      background-color: #fac8c1; }
    .publication-banner__meta.theme--burgundy,
    .theme--burgundy .publication-banner__meta,
    .theme .theme--burgundy .publication-banner__meta {
      background-color: #edc6c8; }
    .publication-banner__meta.theme--purple,
    .theme--purple .publication-banner__meta,
    .theme .theme--purple .publication-banner__meta {
      background-color: #e5cade; }
    .publication-banner__meta.theme--youth,
    .theme--youth .publication-banner__meta,
    .theme .theme--youth .publication-banner__meta {
      background-color: #f4dcbd; }
    .publication-banner__meta.theme--digitalisation,
    .theme--digitalisation .publication-banner__meta,
    .theme .theme--digitalisation .publication-banner__meta {
      background-color: #e5cac6; }
    .publication-banner__meta.theme--climate,
    .theme--climate .publication-banner__meta,
    .theme .theme--climate .publication-banner__meta {
      background-color: #d8ccd5; }
    .publication-banner__meta.theme--gender,
    .theme--gender .publication-banner__meta,
    .theme .theme--gender .publication-banner__meta {
      background-color: #bed8cb; }
    .publication-banner__meta.theme--nutrition,
    .theme--nutrition .publication-banner__meta,
    .theme .theme--nutrition .publication-banner__meta {
      background-color: #cfdcdd; }
    .publication-banner__meta.theme--blog,
    .theme--blog .publication-banner__meta,
    .theme .theme--blog .publication-banner__meta {
      background-color: #ffe7bd; }
    .publication-banner__meta.theme--spore-blue,
    .theme--spore-blue .publication-banner__meta,
    .theme .theme--spore-blue .publication-banner__meta {
      background-color: #cdd8eb; }
    .publication-banner__meta.theme--spore-brown,
    .theme--spore-brown .publication-banner__meta,
    .theme .theme--spore-brown .publication-banner__meta {
      background-color: #dcd0be; }
    .publication-banner__meta.theme--spore-dark-blue,
    .theme--spore-dark-blue .publication-banner__meta,
    .theme .theme--spore-dark-blue .publication-banner__meta {
      background-color: #bed1dd; }
    .publication-banner__meta.theme--spore-forest-green,
    .theme--spore-forest-green .publication-banner__meta,
    .theme .theme--spore-forest-green .publication-banner__meta {
      background-color: #d5debf; }
    .publication-banner__meta.theme--spore-grey-blue,
    .theme--spore-grey-blue .publication-banner__meta,
    .theme .theme--spore-grey-blue .publication-banner__meta {
      background-color: #d9e1e6; }
    .publication-banner__meta.theme--spore-light-blue,
    .theme--spore-light-blue .publication-banner__meta,
    .theme .theme--spore-light-blue .publication-banner__meta {
      background-color: #dce9f3; }
    .publication-banner__meta.theme--spore-lime,
    .theme--spore-lime .publication-banner__meta,
    .theme .theme--spore-lime .publication-banner__meta {
      background-color: #edeabd; }
    .publication-banner__meta.theme--spore-ochre,
    .theme--spore-ochre .publication-banner__meta,
    .theme .theme--spore-ochre .publication-banner__meta {
      background-color: #f6e4c6; }
    .publication-banner__meta.theme--spore-olive-green,
    .theme--spore-olive-green .publication-banner__meta,
    .theme .theme--spore-olive-green .publication-banner__meta {
      background-color: #dce1cd; }
    .publication-banner__meta.theme--spore-red,
    .theme--spore-red .publication-banner__meta,
    .theme .theme--spore-red .publication-banner__meta {
      background-color: #fcd0c6; }
    .publication-banner__meta.theme--spore-taupe,
    .theme--spore-taupe .publication-banner__meta,
    .theme .theme--spore-taupe .publication-banner__meta {
      background-color: #ddd9d7; }
    .publication-banner__meta.theme--spore-teal,
    .theme--spore-teal .publication-banner__meta,
    .theme .theme--spore-teal .publication-banner__meta {
      background-color: #bfdeef; }
  .publication-banner__publication, .publication-banner__brand {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
  .publication-banner__cover, .publication-banner__brand {
    padding-top: 15px;
    padding-bottom: 15px; }
  .publication-banner__publication {
    background-color: #add299; }
    .publication-banner__publication.theme--dark,
    .theme--dark .publication-banner__publication,
    .theme .theme--dark .publication-banner__publication {
      background-color: #969696; }
    .publication-banner__publication.theme--green,
    .theme--green .publication-banner__publication,
    .theme .theme--green .publication-banner__publication {
      background-color: #add299; }
    .publication-banner__publication.theme--blue,
    .theme--blue .publication-banner__publication,
    .theme .theme--blue .publication-banner__publication {
      background-color: #a4dded; }
    .publication-banner__publication.theme--lime,
    .theme--lime .publication-banner__publication,
    .theme .theme--lime .publication-banner__publication {
      background-color: #dee892; }
    .publication-banner__publication.theme--yellow,
    .theme--yellow .publication-banner__publication,
    .theme .theme--yellow .publication-banner__publication {
      background-color: #fce587; }
    .publication-banner__publication.theme--gold,
    .theme--gold .publication-banner__publication,
    .theme .theme--gold .publication-banner__publication {
      background-color: #f4c58d; }
    .publication-banner__publication.theme--orange,
    .theme--orange .publication-banner__publication,
    .theme .theme--orange .publication-banner__publication {
      background-color: #efab92; }
    .publication-banner__publication.theme--salmon,
    .theme--salmon .publication-banner__publication,
    .theme .theme--salmon .publication-banner__publication {
      background-color: #f4b3a8; }
    .publication-banner__publication.theme--red,
    .theme--red .publication-banner__publication,
    .theme .theme--red .publication-banner__publication {
      background-color: #f58e7e; }
    .publication-banner__publication.theme--burgundy,
    .theme--burgundy .publication-banner__publication,
    .theme .theme--burgundy .publication-banner__publication {
      background-color: #da888c; }
    .publication-banner__publication.theme--purple,
    .theme--purple .publication-banner__publication,
    .theme .theme--purple .publication-banner__publication {
      background-color: #c991bb; }
    .publication-banner__publication.theme--youth,
    .theme--youth .publication-banner__publication,
    .theme .theme--youth .publication-banner__publication {
      background-color: #e8b675; }
    .publication-banner__publication.theme--digitalisation,
    .theme--digitalisation .publication-banner__publication,
    .theme .theme--digitalisation .publication-banner__publication {
      background-color: #c89189; }
    .publication-banner__publication.theme--climate,
    .theme--climate .publication-banner__publication,
    .theme .theme--climate .publication-banner__publication {
      background-color: #ae96a8; }
    .publication-banner__publication.theme--gender,
    .theme--gender .publication-banner__publication,
    .theme .theme--gender .publication-banner__publication {
      background-color: #77af94; }
    .publication-banner__publication.theme--nutrition,
    .theme--nutrition .publication-banner__publication,
    .theme .theme--nutrition .publication-banner__publication {
      background-color: #9cb7b8; }
    .publication-banner__publication.theme--blog,
    .theme--blog .publication-banner__publication,
    .theme .theme--blog .publication-banner__publication {
      background-color: #ffcd75; }
    .publication-banner__publication.theme--spore-blue,
    .theme--spore-blue .publication-banner__publication,
    .theme .theme--spore-blue .publication-banner__publication {
      background-color: #97add5; }
    .publication-banner__publication.theme--spore-brown,
    .theme--spore-brown .publication-banner__publication,
    .theme .theme--spore-brown .publication-banner__publication {
      background-color: #b69e77; }
    .publication-banner__publication.theme--spore-dark-blue,
    .theme--spore-dark-blue .publication-banner__publication,
    .theme .theme--spore-dark-blue .publication-banner__publication {
      background-color: #779fb9; }
    .publication-banner__publication.theme--spore-forest-green,
    .theme--spore-forest-green .publication-banner__publication,
    .theme .theme--spore-forest-green .publication-banner__publication {
      background-color: #a9bb7b; }
    .publication-banner__publication.theme--spore-grey-blue,
    .theme--spore-grey-blue .publication-banner__publication,
    .theme .theme--spore-grey-blue .publication-banner__publication {
      background-color: #b0c1cb; }
    .publication-banner__publication.theme--spore-light-blue,
    .theme--spore-light-blue .publication-banner__publication,
    .theme .theme--spore-light-blue .publication-banner__publication {
      background-color: #b7d2e5; }
    .publication-banner__publication.theme--spore-lime,
    .theme--spore-lime .publication-banner__publication,
    .theme .theme--spore-lime .publication-banner__publication {
      background-color: #dad377; }
    .publication-banner__publication.theme--spore-ochre,
    .theme--spore-ochre .publication-banner__publication,
    .theme .theme--spore-ochre .publication-banner__publication {
      background-color: #ecc688; }
    .publication-banner__publication.theme--spore-olive-green,
    .theme--spore-olive-green .publication-banner__publication,
    .theme .theme--spore-olive-green .publication-banner__publication {
      background-color: #b6c197; }
    .publication-banner__publication.theme--spore-red,
    .theme--spore-red .publication-banner__publication,
    .theme .theme--spore-red .publication-banner__publication {
      background-color: #fa9e88; }
    .publication-banner__publication.theme--spore-taupe,
    .theme--spore-taupe .publication-banner__publication,
    .theme .theme--spore-taupe .publication-banner__publication {
      background-color: #b8b0ac; }
    .publication-banner__publication.theme--spore-teal,
    .theme--spore-teal .publication-banner__publication,
    .theme .theme--spore-teal .publication-banner__publication {
      background-color: #79bade; }
  .publication-banner__brand,
  .publication-banner__brand .brand {
    background-color: #67ab43; }
    .publication-banner__brand.theme--dark,
    .theme--dark .publication-banner__brand,
    .theme .theme--dark .publication-banner__brand,
    .publication-banner__brand .brand.theme--dark,
    .theme--dark
    .publication-banner__brand .brand,
    .theme .theme--dark
    .publication-banner__brand .brand {
      background-color: #3d3d3d; }
    .publication-banner__brand.theme--green,
    .theme--green .publication-banner__brand,
    .theme .theme--green .publication-banner__brand,
    .publication-banner__brand .brand.theme--green,
    .theme--green
    .publication-banner__brand .brand,
    .theme .theme--green
    .publication-banner__brand .brand {
      background-color: #67ab43; }
    .publication-banner__brand.theme--blue,
    .theme--blue .publication-banner__brand,
    .theme .theme--blue .publication-banner__brand,
    .publication-banner__brand .brand.theme--blue,
    .theme--blue
    .publication-banner__brand .brand,
    .theme .theme--blue
    .publication-banner__brand .brand {
      background-color: #56c0dd; }
    .publication-banner__brand.theme--lime,
    .theme--lime .publication-banner__brand,
    .theme .theme--lime .publication-banner__brand,
    .publication-banner__brand .brand.theme--lime,
    .theme--lime
    .publication-banner__brand .brand,
    .theme .theme--lime
    .publication-banner__brand .brand {
      background-color: #c1d435; }
    .publication-banner__brand.theme--yellow,
    .theme--yellow .publication-banner__brand,
    .theme .theme--yellow .publication-banner__brand,
    .publication-banner__brand .brand.theme--yellow,
    .theme--yellow
    .publication-banner__brand .brand,
    .theme .theme--yellow
    .publication-banner__brand .brand {
      background-color: #facf21; }
    .publication-banner__brand.theme--gold,
    .theme--gold .publication-banner__brand,
    .theme .theme--gold .publication-banner__brand,
    .publication-banner__brand .brand.theme--gold,
    .theme--gold
    .publication-banner__brand .brand,
    .theme .theme--gold
    .publication-banner__brand .brand {
      background-color: #eb942c; }
    .publication-banner__brand.theme--orange,
    .theme--orange .publication-banner__brand,
    .theme .theme--orange .publication-banner__brand,
    .publication-banner__brand .brand.theme--orange,
    .theme--orange
    .publication-banner__brand .brand,
    .theme .theme--orange
    .publication-banner__brand .brand {
      background-color: #e26435; }
    .publication-banner__brand.theme--salmon,
    .theme--salmon .publication-banner__brand,
    .theme .theme--salmon .publication-banner__brand,
    .publication-banner__brand .brand.theme--salmon,
    .theme--salmon
    .publication-banner__brand .brand,
    .theme .theme--salmon
    .publication-banner__brand .brand {
      background-color: #eb735d; }
    .publication-banner__brand.theme--red,
    .theme--red .publication-banner__brand,
    .theme .theme--red .publication-banner__brand,
    .publication-banner__brand .brand.theme--red,
    .theme--red
    .publication-banner__brand .brand,
    .theme .theme--red
    .publication-banner__brand .brand {
      background-color: #ec2d10; }
    .publication-banner__brand.theme--burgundy,
    .theme--burgundy .publication-banner__brand,
    .theme .theme--burgundy .publication-banner__brand,
    .publication-banner__brand .brand.theme--burgundy,
    .theme--burgundy
    .publication-banner__brand .brand,
    .theme .theme--burgundy
    .publication-banner__brand .brand {
      background-color: #ba222a; }
    .publication-banner__brand.theme--purple,
    .theme--purple .publication-banner__brand,
    .theme .theme--purple .publication-banner__brand,
    .publication-banner__brand .brand.theme--purple,
    .theme--purple
    .publication-banner__brand .brand,
    .theme .theme--purple
    .publication-banner__brand .brand {
      background-color: #9b3381; }
    .publication-banner__brand.theme--youth,
    .theme--youth .publication-banner__brand,
    .theme .theme--youth .publication-banner__brand,
    .publication-banner__brand .brand.theme--youth,
    .theme--youth
    .publication-banner__brand .brand,
    .theme .theme--youth
    .publication-banner__brand .brand {
      background-color: #d57800; }
    .publication-banner__brand.theme--digitalisation,
    .theme--digitalisation .publication-banner__brand,
    .theme .theme--digitalisation .publication-banner__brand,
    .publication-banner__brand .brand.theme--digitalisation,
    .theme--digitalisation
    .publication-banner__brand .brand,
    .theme .theme--digitalisation
    .publication-banner__brand .brand {
      background-color: #9a3324; }
    .publication-banner__brand.theme--climate,
    .theme--climate .publication-banner__brand,
    .theme .theme--climate .publication-banner__brand,
    .publication-banner__brand .brand.theme--climate,
    .theme--climate
    .publication-banner__brand .brand,
    .theme .theme--climate
    .publication-banner__brand .brand {
      background-color: #693c5e; }
    .publication-banner__brand.theme--gender,
    .theme--gender .publication-banner__brand,
    .theme .theme--gender .publication-banner__brand,
    .publication-banner__brand .brand.theme--gender,
    .theme--gender
    .publication-banner__brand .brand,
    .theme .theme--gender
    .publication-banner__brand .brand {
      background-color: #046a38; }
    .publication-banner__brand.theme--nutrition,
    .theme--nutrition .publication-banner__brand,
    .theme .theme--nutrition .publication-banner__brand,
    .publication-banner__brand .brand.theme--nutrition,
    .theme--nutrition
    .publication-banner__brand .brand,
    .theme .theme--nutrition
    .publication-banner__brand .brand {
      background-color: #487a7b; }
    .publication-banner__brand.theme--blog,
    .theme--blog .publication-banner__brand,
    .theme .theme--blog .publication-banner__brand,
    .publication-banner__brand .brand.theme--blog,
    .theme--blog
    .publication-banner__brand .brand,
    .theme .theme--blog
    .publication-banner__brand .brand {
      background-color: #ffa300; }
    .publication-banner__brand.theme--spore-blue,
    .theme--spore-blue .publication-banner__brand,
    .theme .theme--spore-blue .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-blue,
    .theme--spore-blue
    .publication-banner__brand .brand,
    .theme .theme--spore-blue
    .publication-banner__brand .brand {
      background-color: #3f68b1; }
    .publication-banner__brand.theme--spore-brown,
    .theme--spore-brown .publication-banner__brand,
    .theme .theme--spore-brown .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-brown,
    .theme--spore-brown
    .publication-banner__brand .brand,
    .theme .theme--spore-brown
    .publication-banner__brand .brand {
      background-color: #774b04; }
    .publication-banner__brand.theme--spore-dark-blue,
    .theme--spore-dark-blue .publication-banner__brand,
    .theme .theme--spore-dark-blue .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-dark-blue,
    .theme--spore-dark-blue
    .publication-banner__brand .brand,
    .theme .theme--spore-dark-blue
    .publication-banner__brand .brand {
      background-color: #044e7e; }
    .publication-banner__brand.theme--spore-forest-green,
    .theme--spore-forest-green .publication-banner__brand,
    .theme .theme--spore-forest-green .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-forest-green,
    .theme--spore-forest-green
    .publication-banner__brand .brand,
    .theme .theme--spore-forest-green
    .publication-banner__brand .brand {
      background-color: #5f810a; }
    .publication-banner__brand.theme--spore-grey-blue,
    .theme--spore-grey-blue .publication-banner__brand,
    .theme .theme--spore-grey-blue .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-grey-blue,
    .theme--spore-grey-blue
    .publication-banner__brand .brand,
    .theme .theme--spore-grey-blue
    .publication-banner__brand .brand {
      background-color: #6d8c9f; }
    .publication-banner__brand.theme--spore-light-blue,
    .theme--spore-light-blue .publication-banner__brand,
    .theme .theme--spore-light-blue .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-light-blue,
    .theme--spore-light-blue
    .publication-banner__brand .brand,
    .theme .theme--spore-light-blue
    .publication-banner__brand .brand {
      background-color: #79accf; }
    .publication-banner__brand.theme--spore-lime,
    .theme--spore-lime .publication-banner__brand,
    .theme .theme--spore-lime .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-lime,
    .theme--spore-lime
    .publication-banner__brand .brand,
    .theme .theme--spore-lime
    .publication-banner__brand .brand {
      background-color: #bbae03; }
    .publication-banner__brand.theme--spore-ochre,
    .theme--spore-ochre .publication-banner__brand,
    .theme .theme--spore-ochre .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-ochre,
    .theme--spore-ochre
    .publication-banner__brand .brand,
    .theme .theme--spore-ochre
    .publication-banner__brand .brand {
      background-color: #db9623; }
    .publication-banner__brand.theme--spore-olive-green,
    .theme--spore-olive-green .publication-banner__brand,
    .theme .theme--spore-olive-green .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-olive-green,
    .theme--spore-olive-green
    .publication-banner__brand .brand,
    .theme .theme--spore-olive-green
    .publication-banner__brand .brand {
      background-color: #778d3e; }
    .publication-banner__brand.theme--spore-red,
    .theme--spore-red .publication-banner__brand,
    .theme .theme--spore-red .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-red,
    .theme--spore-red
    .publication-banner__brand .brand,
    .theme .theme--spore-red
    .publication-banner__brand .brand {
      background-color: #f54c23; }
    .publication-banner__brand.theme--spore-taupe,
    .theme--spore-taupe .publication-banner__brand,
    .theme .theme--spore-taupe .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-taupe,
    .theme--spore-taupe
    .publication-banner__brand .brand,
    .theme .theme--spore-taupe
    .publication-banner__brand .brand {
      background-color: #7b6d65; }
    .publication-banner__brand.theme--spore-teal,
    .theme--spore-teal .publication-banner__brand,
    .theme .theme--spore-teal .publication-banner__brand,
    .publication-banner__brand .brand.theme--spore-teal,
    .theme--spore-teal
    .publication-banner__brand .brand,
    .theme .theme--spore-teal
    .publication-banner__brand .brand {
      background-color: #077fc1; }
  .publication-banner__brand {
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
  .publication-banner__brand-headline, .publication-banner__brand-standfirst {
    font-family: "Open Sans", sans-serif;
    font-weight: 600; }
  .publication-banner__brand-headline + .publication-banner__brand-standfirst {
    margin-top: 9px; }
  .publication-banner__brand-headline {
    background-color: #67ab43;
    /* regular title*/
    font-size: 1em;
    line-height: 1.3125; }
    .publication-banner__brand-headline.theme--dark,
    .theme--dark .publication-banner__brand-headline,
    .theme .theme--dark .publication-banner__brand-headline {
      background-color: #3d3d3d; }
    .publication-banner__brand-headline.theme--green,
    .theme--green .publication-banner__brand-headline,
    .theme .theme--green .publication-banner__brand-headline {
      background-color: #67ab43; }
    .publication-banner__brand-headline.theme--blue,
    .theme--blue .publication-banner__brand-headline,
    .theme .theme--blue .publication-banner__brand-headline {
      background-color: #56c0dd; }
    .publication-banner__brand-headline.theme--lime,
    .theme--lime .publication-banner__brand-headline,
    .theme .theme--lime .publication-banner__brand-headline {
      background-color: #c1d435; }
    .publication-banner__brand-headline.theme--yellow,
    .theme--yellow .publication-banner__brand-headline,
    .theme .theme--yellow .publication-banner__brand-headline {
      background-color: #facf21; }
    .publication-banner__brand-headline.theme--gold,
    .theme--gold .publication-banner__brand-headline,
    .theme .theme--gold .publication-banner__brand-headline {
      background-color: #eb942c; }
    .publication-banner__brand-headline.theme--orange,
    .theme--orange .publication-banner__brand-headline,
    .theme .theme--orange .publication-banner__brand-headline {
      background-color: #e26435; }
    .publication-banner__brand-headline.theme--salmon,
    .theme--salmon .publication-banner__brand-headline,
    .theme .theme--salmon .publication-banner__brand-headline {
      background-color: #eb735d; }
    .publication-banner__brand-headline.theme--red,
    .theme--red .publication-banner__brand-headline,
    .theme .theme--red .publication-banner__brand-headline {
      background-color: #ec2d10; }
    .publication-banner__brand-headline.theme--burgundy,
    .theme--burgundy .publication-banner__brand-headline,
    .theme .theme--burgundy .publication-banner__brand-headline {
      background-color: #ba222a; }
    .publication-banner__brand-headline.theme--purple,
    .theme--purple .publication-banner__brand-headline,
    .theme .theme--purple .publication-banner__brand-headline {
      background-color: #9b3381; }
    .publication-banner__brand-headline.theme--youth,
    .theme--youth .publication-banner__brand-headline,
    .theme .theme--youth .publication-banner__brand-headline {
      background-color: #d57800; }
    .publication-banner__brand-headline.theme--digitalisation,
    .theme--digitalisation .publication-banner__brand-headline,
    .theme .theme--digitalisation .publication-banner__brand-headline {
      background-color: #9a3324; }
    .publication-banner__brand-headline.theme--climate,
    .theme--climate .publication-banner__brand-headline,
    .theme .theme--climate .publication-banner__brand-headline {
      background-color: #693c5e; }
    .publication-banner__brand-headline.theme--gender,
    .theme--gender .publication-banner__brand-headline,
    .theme .theme--gender .publication-banner__brand-headline {
      background-color: #046a38; }
    .publication-banner__brand-headline.theme--nutrition,
    .theme--nutrition .publication-banner__brand-headline,
    .theme .theme--nutrition .publication-banner__brand-headline {
      background-color: #487a7b; }
    .publication-banner__brand-headline.theme--blog,
    .theme--blog .publication-banner__brand-headline,
    .theme .theme--blog .publication-banner__brand-headline {
      background-color: #ffa300; }
    .publication-banner__brand-headline.theme--spore-blue,
    .theme--spore-blue .publication-banner__brand-headline,
    .theme .theme--spore-blue .publication-banner__brand-headline {
      background-color: #3f68b1; }
    .publication-banner__brand-headline.theme--spore-brown,
    .theme--spore-brown .publication-banner__brand-headline,
    .theme .theme--spore-brown .publication-banner__brand-headline {
      background-color: #774b04; }
    .publication-banner__brand-headline.theme--spore-dark-blue,
    .theme--spore-dark-blue .publication-banner__brand-headline,
    .theme .theme--spore-dark-blue .publication-banner__brand-headline {
      background-color: #044e7e; }
    .publication-banner__brand-headline.theme--spore-forest-green,
    .theme--spore-forest-green .publication-banner__brand-headline,
    .theme .theme--spore-forest-green .publication-banner__brand-headline {
      background-color: #5f810a; }
    .publication-banner__brand-headline.theme--spore-grey-blue,
    .theme--spore-grey-blue .publication-banner__brand-headline,
    .theme .theme--spore-grey-blue .publication-banner__brand-headline {
      background-color: #6d8c9f; }
    .publication-banner__brand-headline.theme--spore-light-blue,
    .theme--spore-light-blue .publication-banner__brand-headline,
    .theme .theme--spore-light-blue .publication-banner__brand-headline {
      background-color: #79accf; }
    .publication-banner__brand-headline.theme--spore-lime,
    .theme--spore-lime .publication-banner__brand-headline,
    .theme .theme--spore-lime .publication-banner__brand-headline {
      background-color: #bbae03; }
    .publication-banner__brand-headline.theme--spore-ochre,
    .theme--spore-ochre .publication-banner__brand-headline,
    .theme .theme--spore-ochre .publication-banner__brand-headline {
      background-color: #db9623; }
    .publication-banner__brand-headline.theme--spore-olive-green,
    .theme--spore-olive-green .publication-banner__brand-headline,
    .theme .theme--spore-olive-green .publication-banner__brand-headline {
      background-color: #778d3e; }
    .publication-banner__brand-headline.theme--spore-red,
    .theme--spore-red .publication-banner__brand-headline,
    .theme .theme--spore-red .publication-banner__brand-headline {
      background-color: #f54c23; }
    .publication-banner__brand-headline.theme--spore-taupe,
    .theme--spore-taupe .publication-banner__brand-headline,
    .theme .theme--spore-taupe .publication-banner__brand-headline {
      background-color: #7b6d65; }
    .publication-banner__brand-headline.theme--spore-teal,
    .theme--spore-teal .publication-banner__brand-headline,
    .theme .theme--spore-teal .publication-banner__brand-headline {
      background-color: #077fc1; }
  .publication-banner__brand-standfirst {
    /* small title*/
    font-size: 0.75em;
    line-height: 1.5;
    font-weight: 300; }
  .publication-banner .title, .publication-banner__brand-headline {
    font-weight: 400; }
  @media only screen and (max-width: 63.9375em) {
    .publication-banner__publication, .publication-banner__brand {
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%; } }
  @media only screen and (min-width: 48em) {
    .publication-banner__brand-headline {
      /* medium title*/
      font-size: 1.125em;
      line-height: 1.33333; }
    .publication-banner__brand-standfirst {
      /* small title*/
      font-size: 0.875em;
      line-height: 1.28571; }
    .publication-banner__brand-headline + .publication-banner__brand-standfirst {
      margin-top: 12px; } }
  @media only screen and (min-width: 64em) {
    .publication-banner__meta {
      padding-top: 9px;
      padding-bottom: 9px;
      font-size: 1em;
      padding-left: 16.66667vw; }
    .publication-banner__brand-headline {
      /* large title*/
      font-size: 1.5em;
      line-height: 1.125; }
    .publication-banner__brand-standfirst {
      /* regular title*/
      font-size: 1em;
      line-height: 1.3125; }
    .publication-banner__brand-headline + .publication-banner__brand-standfirst {
      margin-top: 18px; }
    .publication-banner__cover .publication-tile {
      padding-right: 5.55556vw; }
    .publication-banner__cover .publication-tile__cover.publication-tile__cover {
      width: 15.625vw;
      padding-right: 15px; }
    .publication-banner__cover .publication-cover {
      margin-top: -33px; }
    .publication-banner__brand .publication-tile {
      position: relative;
      left: -5.55556vw; } }
  @media only screen and (min-width: 90em) {
    .publication-banner__meta {
      padding-left: 22.22222vw; }
    .publication-banner__brand-headline {
      /* hero title*/
      font-size: 1.875em;
      line-height: 1.1; }
    .publication-banner__cover .publication-tile {
      padding-right: 11.11111vw; }
    .publication-banner__brand .publication-tile {
      position: relative;
      left: -11.11111vw; }
    .publication-banner__brand .publication-tile__body {
      margin-right: -5.55556vw; } }

@media only screen and (max-width: 47.9375em) {
  .publication-channel-hero .publication-cover--pull-top {
    margin-top: 7.5px; }
  .publication-channel-hero .bubble .publication-cover {
    margin-bottom: 6px; } }

@media only screen and (min-width: 48em) {
  .publication-channel-hero__title {
    margin-left: 50%;
    margin-left: 25vw;
    padding-left: 15px;
    padding-left: 0vw;
    padding-right: 15px;
    padding-right: 0vw; }
  .publication-channel-hero .bubble .publication-tile__body {
    padding-left: 0px;
    padding-right: 0px; } }

@media only screen and (min-width: 64em) {
  .publication-channel-hero__title {
    margin-left: 160px;
    margin-left: 16.66667vw; } }
  @media only screen and (min-width: 64em) and (min-width: 0\0) {
    .publication-channel-hero__title {
      margin-left: 50%; } }

@media only screen and (min-width: 90em) {
  .publication-channel-hero__title {
    margin-left: 160px;
    margin-left: 11.11111vw; } }

/*
	* This class is adding a drop shadow.
	* The size of the cover is controlled by its parent element, 
	* the image stretches to full width of the parent container.
	*
	* 1. Account for shadow offset, image must still align
	* 2. Offset so shadow becomes visible
  */
.publication-cover {
  margin-top: 7.5px;
  /* 1 */
  margin-right: 7.5px;
  /* 1 */ }
  .publication-cover, .publication-cover__image {
    display: block;
    position: relative; }
  .publication-cover__image {
    z-index: 1;
    width: 100%;
    bottom: 7.5px;
    /* 2 */
    left: 7.5px;
    /* 2 */ }
  .publication-cover--pull-top {
    margin-top: -45px; }
    .publication-cover--pull-top.publication-cover--s {
      margin-top: -15px; }
  .publication-cover--gutter-right {
    margin-right: 22.5px;
    /* 1 */ }
  .publication-cover--s {
    margin-top: 4px;
    margin-right: 4px; }
  .publication-cover--s .publication-cover__image {
    bottom: 4px;
    left: 4px; }
  .publication-cover::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.1); }
  @media only screen and (min-width: 64em) {
    .publication-cover--pull-bottom {
      margin-bottom: -50%; }
    .publication-cover--l {
      margin-top: 15px;
      margin-right: 15px; }
    .publication-cover--l .publication-cover__image {
      bottom: 15px;
      left: 15px; }
    .publication-cover--pull-top.publication-cover--s {
      margin-top: -30px; } }

/*
 * 1.account for the publication shadow offset
 */
.publication-tile {
  position: relative; }
  .publication-tile__cover {
    width: 160px;
    width: 50vw; }
  .publication-tile--s .publication-tile__cover {
    width: 106px;
    width: 33.33333vw; }
  @media only screen and (min-width: 32.5em) {
    .publication-tile__cover {
      width: 33.33333vw; } }
  @media only screen and (min-width: 37.5em) {
    .publication-tile__cover,
    .publication-tile--s .publication-tile__cover {
      width: 16.66667vw; }
    .publication-tile--hero .publication-tile__cover {
      width: 33.33333vw; }
    .publication-tile--fold {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
    .publication-tile--fold .publication-tile__cover {
      width: 33.33333vw; }
    .publication-tile--fold .publication-tile__body {
      width: 50vw; } }
  @media only screen and (min-width: 48em) {
    .publication-tile__cover,
    .publication-tile--s .publication-tile__cover {
      width: 16.66667vw; }
    .publication-tile--hero .publication-tile__cover,
    .publication-tile--fold .publication-tile__cover {
      width: 25vw; } }
  @media only screen and (min-width: 64em) {
    .publication-tile__cover,
    .publication-tile--hero .publication-tile__cover,
    .publication-tile--s .publication-tile__cover {
      width: 11.11111vw; }
    .publication-tile--fold .publication-tile__cover {
      width: 16.66667vw; } }
  @media only screen and (min-width: 90em) {
    .publication-tile__cover,
    .publication-tile--hero .publication-tile__cover,
    .publication-tile--fold .publication-tile__cover {
      width: 11.11111vw; } }
  @media only screen and (min-width: 90em) and (min-width: 0\0) {
    .publication-tile__cover,
    .publication-tile--hero .publication-tile__cover,
    .publication-tile--fold .publication-tile__cover {
      width: 50%; } }
  @media only screen and (min-width: 90em) {
    .publication-tile--s .publication-tile__cover {
      width: 5.55556vw; } }

.publication-hero .title {
  padding-top: 21px;
  padding-bottom: 21px; }

.publication-hero__body .heading {
  /* medium title*/
  font-size: 1.25em;
  line-height: 1.35; }

@media only screen and (max-width: 32.4375em) {
  .publication-hero__media {
    padding-bottom: 0; } }

@media only screen and (min-width: 32.5em) {
  .publication-hero {
    position: relative; }
    .publication-hero .title, .publication-hero__body, .publication-hero__media {
      position: relative;
      z-index: 1; }
    .publication-hero .layout {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
         -moz-box-orient: horizontal;
         -moz-box-direction: reverse;
          -ms-flex-direction: row-reverse;
              flex-direction: row-reverse; }
    .publication-hero .publication-tile__cover {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
         -moz-box-orient: vertical;
         -moz-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      width: 50%; }
    .publication-hero__body .heading {
      /* large title*/
      font-size: 1.5em;
      line-height: 1.125; }
    .publication-hero::after {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 58.33333%;
      z-index: 0;
      background: rgba(0, 0, 0, 0.26); }
    .no-flexbox .layout--even .publication-hero__media.layout__cell--aside {
      float: right; } }

@media only screen and (min-width: 48em) {
  .publication-hero .title {
    padding-top: 36px; }
  .publication-hero .publication-tile {
    -webkit-box-align: end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end; }
  .publication-hero::after {
    left: 58.33333%; } }

@media only screen and (min-width: 64em) {
  .publication-hero .title {
    padding-top: 42px; }
  .publication-hero__body .heading {
    /* hero title*/
    font-size: 1.875em;
    line-height: 1.1; }
  .publication-hero__media {
    padding-left: 5.55556%;
    padding-left: 5.55556vw; }
  .publication-hero .publication-tile__cover {
    width: 22.22222%;
    width: 22.22222vw; }
  .publication-hero::after {
    left: 66.66667%;
    left: 61.11111vw; } }

@media only screen and (min-width: 90em) {
  .publication-hero .title {
    padding-top: 51px; }
  .publication-hero__body .heading {
    /* hero title*/
    font-size: 2.5em;
    line-height: 1.2; }
  .publication-hero__body {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 44.44444%;
            flex: 1 44.44444%;
    -ms-flex: 1 50vw;
        flex: 1 50vw; }
  .publication-hero__media {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 55.55556%;
            flex: 1 55.55556%;
    -ms-flex: 1 61.11111vw;
        flex: 1 61.11111vw; }
  .publication-hero__body, .publication-hero__media {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 50%;
            flex: 1 50%; }
  .publication-hero .publication-tile__cover {
    width: 16.66667%;
    width: 16.66667vw; }
  .publication-hero::after {
    left: 61.11111%;
    left: 61.11111vw; } }

/*
Publication

markup:
<article class="media  |  publication--wrapper  |  trailer">
	<div class="media__figure  |  gutters">
		<div class="publication">
			<img class="publication--image" src="https://publications.cta.int/media/publications/images/l/1889_Cover_scan_yGcSfhg.png" alt="Africa agriculture status report 2017: Youth and agriculture in Sub-Saharan Africa" />
		</div>
	</div>
	<div class="media__content">
		<div class="media media--unfold">
			<div class="media__body  |  gutters  |  leader--small">
				<h2 class="title  |  trailer--small">Africa agriculture status report 2017: Youth and agriculture in Sub-Saharan Africa</h2>
				<p>Each year, 10 million young Africans enter the continent’s workforce, more than ever before. Although this highlights the great challenge of youth unemployment, it could also be a great opportunity – to encourage youth to be the engine behind the growth of Africa’s agriculture-based economies.</p>
			</div>
			<div class="media__figure  |  gutters  |  leader--small">
				<div class="trailer--small  |  rating rating--60">
					<span class="rating__stars--inactive">★★★★★</span>
					<span class="rating__stars--active">★★★★★</span>
				</div>
				<div class="trailer--small">
					<p class="title title--sub-section">review:</p>
					<p class="meta meta--lowercase">Be the first to review</p>
				</div>
				<p class="title title--sub-section">Published:</p>
				<p class="meta meta--lowercase">2016</p>
			</div>
		</div>
	</div>
</article>

Styleguide 4.40
*/
.publication {
  position: relative;
  background: rgba(0, 0, 0, 0.1); }
  @media only screen and (max-width: 47.9375em) {
    .publication {
      margin-bottom: 15px; } }
  .publication--image {
    position: absolute;
    top: -6px;
    right: -6px; }
  .publication--wrapper {
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(103, 171, 67, 0.26); }
    .theme--blue .publication--wrapper {
      border-color: rgba(86, 192, 221, 0.26); }
    .theme--lime .publication--wrapper {
      border-color: rgba(193, 212, 53, 0.26); }
    .theme--yellow .publication--wrapper {
      border-color: rgba(250, 207, 33, 0.26); }
    .theme--gold .publication--wrapper {
      border-color: rgba(235, 148, 44, 0.26); }
    .theme--orange .publication--wrapper {
      border-color: rgba(226, 100, 53, 0.26); }
    .theme--salmon .publication--wrapper {
      border-color: rgba(235, 115, 93, 0.26); }
    .theme--red .publication--wrapper {
      border-color: rgba(236, 45, 16, 0.26); }
    .theme--burgundy .publication--wrapper {
      border-color: rgba(186, 34, 42, 0.26); }
    .theme--purple .publication--wrapper {
      border-color: rgba(155, 51, 129, 0.26); }
    .publication--wrapper:last-of-type {
      border-bottom: 0; }
    @media only screen and (max-width: 47.9375em) {
      .publication--wrapper .media {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
           -moz-box-orient: vertical;
           -moz-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column; } }
  .publication, .publication--image {
    height: 150px;
    width: 120px; }

.publication-stack {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
  .publication-stack__cover {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: end;
       -moz-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end; }

.publication-layout {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
  @media only screen and (min-width: 32.5em) {
    .publication-layout {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      margin-right: 8.33333vw; } }
  @media only screen and (min-width: 48em) {
    .publication-layout {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      margin-right: 8.33333vw; } }
  @media only screen and (min-width: 64em) {
    .publication-layout {
      margin-right: 0; } }
  @media only screen and (min-width: 90em) {
    .publication-layout {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
         -moz-box-orient: vertical;
         -moz-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      margin-right: 11.11111vw; } }

.publication-grid {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .no-flexbox .publication-grid {
    display: block; }
  .publication-grid__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 1 100%;
            flex: 0 1 100%;
    max-width: 100%; }
    .no-flexbox .publication-grid__cell {
      float: left;
      width: 100%; }
    @media only screen and (min-width: 20em) {
      .publication-grid__cell {
        -ms-flex-preferred-size: 50%;
            flex-basis: 50%;
        max-width: 50%; }
        .no-flexbox .publication-grid__cell {
          width: 50%; } }
    @media only screen and (min-width: 32.5em) {
      .publication-grid__cell {
        -ms-flex-preferred-size: 33.33333%;
            flex-basis: 33.33333%;
        max-width: 33.33333%; }
        .no-flexbox .publication-grid__cell {
          width: 33.33333%; } }
    @media only screen and (min-width: 90em) {
      .publication-grid__cell {
        -ms-flex-preferred-size: 20%;
            flex-basis: 20%;
        max-width: 20%; }
        .no-flexbox .publication-grid__cell {
          width: 20%; } }

.publication-download {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  border: 1px solid;
  color: #67ab43; }
  .publication-download.theme--dark,
  .theme--dark .publication-download,
  .theme .theme.theme--dark .publication-download {
    color: #3d3d3d; }
  .publication-download.theme--green,
  .theme--green .publication-download,
  .theme .theme.theme--green .publication-download {
    color: #67ab43; }
  .publication-download.theme--blue,
  .theme--blue .publication-download,
  .theme .theme.theme--blue .publication-download {
    color: #56c0dd; }
  .publication-download.theme--lime,
  .theme--lime .publication-download,
  .theme .theme.theme--lime .publication-download {
    color: #c1d435; }
  .publication-download.theme--yellow,
  .theme--yellow .publication-download,
  .theme .theme.theme--yellow .publication-download {
    color: #facf21; }
  .publication-download.theme--gold,
  .theme--gold .publication-download,
  .theme .theme.theme--gold .publication-download {
    color: #eb942c; }
  .publication-download.theme--orange,
  .theme--orange .publication-download,
  .theme .theme.theme--orange .publication-download {
    color: #e26435; }
  .publication-download.theme--salmon,
  .theme--salmon .publication-download,
  .theme .theme.theme--salmon .publication-download {
    color: #eb735d; }
  .publication-download.theme--red,
  .theme--red .publication-download,
  .theme .theme.theme--red .publication-download {
    color: #ec2d10; }
  .publication-download.theme--burgundy,
  .theme--burgundy .publication-download,
  .theme .theme.theme--burgundy .publication-download {
    color: #ba222a; }
  .publication-download.theme--purple,
  .theme--purple .publication-download,
  .theme .theme.theme--purple .publication-download {
    color: #9b3381; }
  .publication-download.theme--youth,
  .theme--youth .publication-download,
  .theme .theme.theme--youth .publication-download {
    color: #d57800; }
  .publication-download.theme--digitalisation,
  .theme--digitalisation .publication-download,
  .theme .theme.theme--digitalisation .publication-download {
    color: #9a3324; }
  .publication-download.theme--climate,
  .theme--climate .publication-download,
  .theme .theme.theme--climate .publication-download {
    color: #693c5e; }
  .publication-download.theme--gender,
  .theme--gender .publication-download,
  .theme .theme.theme--gender .publication-download {
    color: #046a38; }
  .publication-download.theme--nutrition,
  .theme--nutrition .publication-download,
  .theme .theme.theme--nutrition .publication-download {
    color: #487a7b; }
  .publication-download.theme--blog,
  .theme--blog .publication-download,
  .theme .theme.theme--blog .publication-download {
    color: #ffa300; }
  .publication-download.theme--spore-blue,
  .theme--spore-blue .publication-download,
  .theme .theme.theme--spore-blue .publication-download {
    color: #3f68b1; }
  .publication-download.theme--spore-brown,
  .theme--spore-brown .publication-download,
  .theme .theme.theme--spore-brown .publication-download {
    color: #774b04; }
  .publication-download.theme--spore-dark-blue,
  .theme--spore-dark-blue .publication-download,
  .theme .theme.theme--spore-dark-blue .publication-download {
    color: #044e7e; }
  .publication-download.theme--spore-forest-green,
  .theme--spore-forest-green .publication-download,
  .theme .theme.theme--spore-forest-green .publication-download {
    color: #5f810a; }
  .publication-download.theme--spore-grey-blue,
  .theme--spore-grey-blue .publication-download,
  .theme .theme.theme--spore-grey-blue .publication-download {
    color: #6d8c9f; }
  .publication-download.theme--spore-light-blue,
  .theme--spore-light-blue .publication-download,
  .theme .theme.theme--spore-light-blue .publication-download {
    color: #79accf; }
  .publication-download.theme--spore-lime,
  .theme--spore-lime .publication-download,
  .theme .theme.theme--spore-lime .publication-download {
    color: #bbae03; }
  .publication-download.theme--spore-ochre,
  .theme--spore-ochre .publication-download,
  .theme .theme.theme--spore-ochre .publication-download {
    color: #db9623; }
  .publication-download.theme--spore-olive-green,
  .theme--spore-olive-green .publication-download,
  .theme .theme.theme--spore-olive-green .publication-download {
    color: #778d3e; }
  .publication-download.theme--spore-red,
  .theme--spore-red .publication-download,
  .theme .theme.theme--spore-red .publication-download {
    color: #f54c23; }
  .publication-download.theme--spore-taupe,
  .theme--spore-taupe .publication-download,
  .theme .theme.theme--spore-taupe .publication-download {
    color: #7b6d65; }
  .publication-download.theme--spore-teal,
  .theme--spore-teal .publication-download,
  .theme .theme.theme--spore-teal .publication-download {
    color: #077fc1; }
  .publication-download__item {
    padding: 9px 15px;
    font-weight: 400;
    border-right: 1px solid; }
  .publication-download--s .publication-download__item {
    font-size: 0.875em;
    padding: 3px 9px; }
  .publication-download__item:last-child {
    border: 0; }
  .publication-download__item + .publication-download__item {
    color: rgba(0, 0, 0, 0.54); }
  .well .publication-download,
  .well .publication-download__item {
    border-color: #fff; }
  .well--full .publication-download,
  .well--full .publication-download:visited {
    color: #fff; }

/* 4.41 Hero */
/*
Hero

The hero unit has modifiers for each teaser type – see sections below.

1. Set background color for when image load is slow
2. Let padding define the initial size of the hero container
3. Move on top of absolutely positioned image
4. Progressive enhancement: Hide the image but retain it's position in the
   flow, use javascript to move it to the background of its parent
5. Progressive enhancement: on small handheld devices, stretch the image to
   the available viewport height (minus the masthead)
6. When the hero sits underneath the navigation, its height is added to the
   hero height


.hero - Hero cover
.hero.is-crowned - Pulls the cover underneath the masthead
.hero.hero--bleed - Full width/height hero (excludes the navigation area)

markup:
<sg-insert>5.1-1</sg-insert>
<figure class="{$modifiers}" style="background-image: url('https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb');">
  <img class="hero__figure  |  image image--stretch" width="1260" height="750" alt="" src="https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb" />
  <figcaption class="hero__headline">
    <sg-insert>4.11-1</sg-insert>
  </figcaption>
</figure>

sg-wrapper:
<div class="js flexbox">
  <sg-wrapper-content/>
</div>

Styleguide 4.41
*/
/*
 * 1. Set background color for when image load is slow
 * 2. Let padding define the initial size of the hero container
 * 3. Move on top of absolutely positioned image
 * 4. Progressive enhancement: Hide the image but retain it's position in the
 *    flow, use javascript to move it to the background of its parent
 * 5. Progressive enhancement: on small handheld devices, stretch the image to
 *    the available viewport height (minus the masthead)
 * 6. When the hero sits underneath the navigation, its height is added to the
 *    hero height
 */
.hero {
  background-color: #67ab43;
  /* 1 */
  position: relative;
  overflow: hidden; }
  .hero.theme--dark,
  .theme--dark .hero,
  .theme .theme--dark .hero {
    background-color: #3d3d3d; }
  .hero.theme--green,
  .theme--green .hero,
  .theme .theme--green .hero {
    background-color: #67ab43; }
  .hero.theme--blue,
  .theme--blue .hero,
  .theme .theme--blue .hero {
    background-color: #56c0dd; }
  .hero.theme--lime,
  .theme--lime .hero,
  .theme .theme--lime .hero {
    background-color: #c1d435; }
  .hero.theme--yellow,
  .theme--yellow .hero,
  .theme .theme--yellow .hero {
    background-color: #facf21; }
  .hero.theme--gold,
  .theme--gold .hero,
  .theme .theme--gold .hero {
    background-color: #eb942c; }
  .hero.theme--orange,
  .theme--orange .hero,
  .theme .theme--orange .hero {
    background-color: #e26435; }
  .hero.theme--salmon,
  .theme--salmon .hero,
  .theme .theme--salmon .hero {
    background-color: #eb735d; }
  .hero.theme--red,
  .theme--red .hero,
  .theme .theme--red .hero {
    background-color: #ec2d10; }
  .hero.theme--burgundy,
  .theme--burgundy .hero,
  .theme .theme--burgundy .hero {
    background-color: #ba222a; }
  .hero.theme--purple,
  .theme--purple .hero,
  .theme .theme--purple .hero {
    background-color: #9b3381; }
  .hero.theme--youth,
  .theme--youth .hero,
  .theme .theme--youth .hero {
    background-color: #d57800; }
  .hero.theme--digitalisation,
  .theme--digitalisation .hero,
  .theme .theme--digitalisation .hero {
    background-color: #9a3324; }
  .hero.theme--climate,
  .theme--climate .hero,
  .theme .theme--climate .hero {
    background-color: #693c5e; }
  .hero.theme--gender,
  .theme--gender .hero,
  .theme .theme--gender .hero {
    background-color: #046a38; }
  .hero.theme--nutrition,
  .theme--nutrition .hero,
  .theme .theme--nutrition .hero {
    background-color: #487a7b; }
  .hero.theme--blog,
  .theme--blog .hero,
  .theme .theme--blog .hero {
    background-color: #ffa300; }
  .hero.theme--spore-blue,
  .theme--spore-blue .hero,
  .theme .theme--spore-blue .hero {
    background-color: #3f68b1; }
  .hero.theme--spore-brown,
  .theme--spore-brown .hero,
  .theme .theme--spore-brown .hero {
    background-color: #774b04; }
  .hero.theme--spore-dark-blue,
  .theme--spore-dark-blue .hero,
  .theme .theme--spore-dark-blue .hero {
    background-color: #044e7e; }
  .hero.theme--spore-forest-green,
  .theme--spore-forest-green .hero,
  .theme .theme--spore-forest-green .hero {
    background-color: #5f810a; }
  .hero.theme--spore-grey-blue,
  .theme--spore-grey-blue .hero,
  .theme .theme--spore-grey-blue .hero {
    background-color: #6d8c9f; }
  .hero.theme--spore-light-blue,
  .theme--spore-light-blue .hero,
  .theme .theme--spore-light-blue .hero {
    background-color: #79accf; }
  .hero.theme--spore-lime,
  .theme--spore-lime .hero,
  .theme .theme--spore-lime .hero {
    background-color: #bbae03; }
  .hero.theme--spore-ochre,
  .theme--spore-ochre .hero,
  .theme .theme--spore-ochre .hero {
    background-color: #db9623; }
  .hero.theme--spore-olive-green,
  .theme--spore-olive-green .hero,
  .theme .theme--spore-olive-green .hero {
    background-color: #778d3e; }
  .hero.theme--spore-red,
  .theme--spore-red .hero,
  .theme .theme--spore-red .hero {
    background-color: #f54c23; }
  .hero.theme--spore-taupe,
  .theme--spore-taupe .hero,
  .theme .theme--spore-taupe .hero {
    background-color: #7b6d65; }
  .hero.theme--spore-teal,
  .theme--spore-teal .hero,
  .theme .theme--spore-teal .hero {
    background-color: #077fc1; }
  .hero__figure {
    display: block;
    width: 100%; }
  .hero--headline {
    height: 100vh;
    -moz-background-size: cover;
         background-size: cover; }
  .hero__headline {
    position: absolute;
    /* 3 */
    right: 30px;
    bottom: 60px;
    left: 0; }
    .hero__headline--left {
      left: 0; }
  .hero--topic-teaser .hero__headline {
    right: 15px;
    left: 15px; }
  .hero--topic-teaser .hero__headline--left {
    left: 0; }
  .hero--slogan .hero__headline {
    top: 50%;
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
       -moz-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%); }
  .hero--carousel .hero__headline {
    position: relative;
    right: 0;
    bottom: 0; }
  .hero--quote-teaser .hero__headline {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.26); }
  .hero--video {
    position: relative;
    padding: 56.25% 0 0 0; }
    .hero--video iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
  @media only screen and (max-width: 47.9375em) {
    .hero--quote-teaser .hero__headline {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
         -moz-box-align: center;
          -ms-flex-align: center;
              align-items: center; }
      .hero--quote-teaser .hero__headline .no-flexbox {
        padding-top: 138px; } }
  @media only screen and (orientation: landscape) {
    .hero--topic-teaser .hero__headline,
    .hero--event-teaser .hero__headline {
      right: 16.66667vw; } }
  @media only screen and (min-width: 32.5em) {
    .hero--event-teaser .hero__headline {
      right: 33.33333vw; } }
  @media only screen and (min-width: 48em) {
    .hero__headline {
      bottom: 60px; }
    .hero--topic-teaser .hero__headline {
      bottom: 9px; }
    .hero--quote-teaser .hero__headline {
      background: none; }
    .hero--tab-teaser .hero__headline {
      bottom: 60px; }
    .hero--quote-teaser .hero__headline {
      top: 60px;
      left: 0; }
    .hero--quote-teaser-end .hero__headline {
      left: auto;
      right: 8.33333vw; }
      .hero--quote-teaser-end .hero__headline.layout--narrow {
        right: -8.33333vw; }
    .hero--quote-teaser.is-crowned .hero__headline {
      top: 108px; }
    .hero--slogan .hero__headline {
      top: 50%;
      bottom: auto;
      left: 8.33333vw;
      -webkit-transform: translateX(0) translateY(-50%);
         -moz-transform: translateX(0) translateY(-50%);
          -ms-transform: translateX(0) translateY(-50%);
              transform: translateX(0) translateY(-50%); }
    .hero--quote-teaser-end .hero__headline,
    .hero--quote-teaser-end.is-crowned .hero__headline {
      top: auto;
      bottom: 60px; } }
  @media only screen and (min-width: 64em) {
    .hero--topic-teaser .hero__headline {
      left: 5.55556vw;
      margin-right: 15px;
      margin-left: 15px; }
    .hero--topic-teaser .hero__headline--left {
      left: 0;
      margin-left: 0; }
    .hero--topic-teaser .hero__headline {
      right: 22.22222%; }
    .hero--event-teaser .hero__headline,
    .hero--feature-teaser .hero__headline {
      right: 44.44444vw; }
    .hero--bleed {
      height: -moz-calc(100vh - 39px);
      height: calc(100vh - 39px); }
    .hero--quote-teaser .hero__headline {
      top: 90px; }
    .hero--quote-teaser-end .hero__headline {
      left: auto;
      right: 5.55556vw; }
      .hero--quote-teaser-end .hero__headline.layout--narrow {
        right: -5.55556vw; }
    .hero--quote-teaser.is-crowned .hero__headline {
      top: 141px; }
    .hero--quote-teaser-end .hero__headline,
    .hero--quote-teaser-end.is-crowned .hero__headline {
      top: auto;
      bottom: 90px; }
    .hero--carousel {
      max-height: 75vh; } }
  @media only screen and (min-width: 90em) {
    .hero--topic-teaser .hero__headline {
      bottom: 30px; }
    .hero--event-teaser .hero__headline {
      right: 55.55556vw; }
    .hero--carousel .hero__headline {
      position: absolute;
      right: 25%;
      left: 5.55556vw;
      top: 60px;
      bottom: auto; }
    .no-flexbox .hero--event-teaser {
      max-height: 600px; }
    .hero--feature-teaser .hero__headline {
      right: 50vw; }
    .hero--slogan .hero__headline {
      left: 11.11111vw; }
    .hero--quote-teaser .hero__headline {
      left: 0; }
    .hero--quote-teaser-end .hero__headline {
      left: auto;
      right: 5.55556vw; }
      .hero--quote-teaser-end .hero__headline.layout--narrow {
        right: -5.55556vw; } }
  @media only screen and (min-width: 100em) {
    .hero--topic-teaser .hero__headline {
      right: 55.55556vw;
      bottom: 60px; }
    .hero--carousel .hero__headline {
      right: 50%; } }

.no-flexbox .ie9-hero {
  max-height: 600px;
  overflow: hidden; }

/*
Hero - event-teaser

.hero.hero--event-teaser - Hero cover
.hero.hero--event-teaser.is-crowned - Pulls the cover underneath the masthead

markup:
<sg-insert>5.1-1</sg-insert>
<figure class="{$modifiers}" style="background-image: url('https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb');">
  <img class="hero__figure  |  image image--stretch" width="1260" height="750" alt="" src="https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb" />
  <figcaption class="hero__headline">
    <sg-insert>4.11-1</sg-insert>
  </figcaption>
</figure>

sg-wrapper:
<div class="js flexbox">
  <sg-wrapper-content/>
</div>

Styleguide 5.4.1
*/
/*
Hero - tab-teaser

.hero.hero--tab-teaser - Hero cover
.hero.hero--tab-teaser.is-crowned - Pulls the cover underneath the masthead

markup:
<sg-insert>5.1-1</sg-insert>
<div class="{$modifiers}" style="background-image: url('https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb');">
  <img class="hero__figure  |  image image--stretch" width="1260" height="750" alt="" src="https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb" />
  <div class="hero__headline">
    <sg-insert>4.27</sg-insert>
  </div>
  <div class="timeline timeline--overlay  |  stack">
    <div class="stack__unit stack__pin  |  is-gt-small-desktop  |  meta">
      <div class="timeline__label  |  gutters">Project timeline</div>
    </div>
    <div class="stack__unit  |  meta">
      <div class="timeline__item  |  is-complete  |  gutters">2016</div>
    </div>
    <div class="stack__unit  |  meta">
      <div class="timeline__item  |  is-active  |  gutters">2017</div>
    </div>
    <div class="stack__unit  |  meta">
      <div class="timeline__item  |  gutters">2018</div>
    </div>
    <div class="stack__unit  |  meta">
      <div class="timeline__item  |  gutters">2019</div>
    </div>
  </div>
</div>

sg-wrapper:
<div class="js flexbox">
  <sg-wrapper-content/>
</div>

Styleguide 5.4.2
*/
/*
Hero - topic-teaser

.hero.hero--topic-teaser - Hero cover
.hero.hero--topic-teaser.is-crowned - Pulls the cover underneath the masthead

markup:
<figure class="ie9-hero hero hero--topic-teaser">
    <picture class="not-crown hero__figure  |  image image--stretch">
        <img class="hero__figure  |  image image--stretch" src="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:5,g_faces:center,f_auto,c_fill/k6pbarwzyazsjddsroeg" alt="Leading image">
    </picture>
    <figcaption class="hero__headline">
        <sg-insert>4.29</sg-insert>
    </figcaption>
</figure>

Styleguide 5.4.3
*/
/*
Hero - feature-teaser

.hero.hero--feature-teaser - Hero cover
.hero.hero--feature-teaser.is-crowned - Pulls the cover underneath the masthead

markup:
<sg-insert>5.1-1</sg-insert>
<figure class="{$modifiers}" style="background-image: url('https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb');">
  <img class="hero__figure  |  image image--stretch" width="1260" height="750" alt="" src="https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb" />
  <figcaption class="hero__headline">
    <sg-insert>4.31</sg-insert>
  </figcaption>
</figure>

sg-wrapper:
<div class="js flexbox">
  <sg-wrapper-content/>
</div>

Styleguide 5.4.4
*/
/*
Hero - poster with quote

markup:
<figure class="ie9-hero hero hero--quote-teaser">
    <picture class="not-crown hero__figure  |  image image--stretch">
        <img class="hero__figure  |  image image--stretch" src="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:5,g_faces:center,f_auto,c_fill/vginbhzfz4usmvi6vrk9" alt="Michail Hailu, Director of CTA">
    </picture>
    <figcaption class="hero__headline">
        <div class="layout ">
            <div class="quote-teaser wings">
                <blockquote class="quote quote--hero  |  gutters">
                    After many years of neglect, agriculture is back on the global agenda as a major vehicle for poverty reduction and economic growth and so this renewed interest bodes well for CTA's work.
                    <footer>
                        <cite class="quote__meta  |  meta  |  leader--tiny">MICHAEL HAILU, CTA DIRECTOR</cite>
                    </footer>
                </blockquote>
            </div>
        </div>
    </figcaption>
</figure>

Styleguide 5.4.5
*/
/*
Hero - Headline

.hero.hero--headline - Headline

markup:
<sg-insert>5.1-1</sg-insert>
<figure class="{$modifiers}  |  gutter--right" style="background-image: url('https://images.pexels.com/photos/35550/ipad-tablet-technology-touch.jpg?w=1200&h=900&auto=compress&cs=tinysrgb');">
  <figcaption class="headline">
    <div class="leader  |  trailer  |  wings">
      <a class="title title--headline  |  gutters" href="javascript:void()">Female Farmers</a>
      <p class="gutters  |  leader  |  trailer">A Youth in Agriculture workshop was held as part of the Caribbean Farmers Network (CaFAN's) overall strategy to get more young people involved in farming. More than 45 people, 40 of them under 35, attended the CTA-supported workshop, which was held in Grenada in January.</p>
      <a class="gutters  |  read-more" href="javascript:void()">Read more...</a>
    </div>
    <div class="pin-box  |  wings">
      <div class="pin-box__cell  |  gutters">
        <ul class="reset">
          <li class="trailer--tiny">
            <a class="block-link block-link--icon  |  is-heir" href="javascript:void()">Launch of the Fish Farming AgriHack in West Africa</a>
          </li>
          <li class="trailer--tiny">
            <a class="block-link block-link--icon  |  is-heir" href="javascript:void()">Meet the winners of the Durban AgriHack Talent Challenge</a>
          </li>
          <li class="trailer--tiny">
            <a class="block-link block-link--icon  |  is-heir" href="javascript:void()">The Durban AgriHack Challenge is now open: Win cash prize and develop your career opportunities!</a>
          </li>
        </ul>
      </div>
    </div>
    <em class="headline__tax  |  wings"><span class="label  |  gutters">Youth & Agriculture</span></em>
  </figcaption>
</figure>

sg-wrapper:
<div class="js flexbox">
  <sg-wrapper-content/>
</div>

Styleguide 5.4.6
*/
/*
Hero - map

.hero.hero--map - Toggleable slider menu

markup:
<sg-insert>5.1-1</sg-insert>
<figure class="hero hero--map hero--event-teaser  |  is-active" style="background-image: url('https://res.cloudinary.com/idemo/image/upload/c_fill,g_faces,h_800,w_1920/Map_nyp0nt.jpg');">
  <img class="hero__figure  |  image image--stretch" width="1260" height="750" alt="" src="https://res.cloudinary.com/idemo/image/upload/c_fill,g_faces,h_800,w_1920/Map_nyp0nt.jpg" />
  <figcaption class="hero__headline">
    <div class="stack">
      <div class="hero--map__body  |  teaser  |  stack__unit">
        <div class="leader  |  trailer  |  wings">
          <h2 class="title  |  gutters">We empower agricultural and rural communities in Africa, the Caribbean and the Pacific.</h2>
          <ul class="legenda__list  |  reset  |  gutters  |  leader  |  grid layout--even">
            <li class="layout__cell  |  title title--sub-section  |  trailer--small">
              <span class="legenda__item--identifier legenda__item--gold"></span>
              <a class="is-heir" href="javascript:void()">Caribbean</a>
            </li>
            <li class="layout__cell  |  title title--sub-section  |  trailer--small">
              <span class="legenda__item--identifier legenda__item--orange"></span>
              <a class="is-heir" href="javascript:void()">Western Africa</a>
            </li>
            <li class="layout__cell  |  title title--sub-section  |  trailer--small">
              <span class="legenda__item--identifier legenda__item--red"></span>
              <a class="is-heir" href="javascript:void()">Eastern Africa</a>
            </li>
            <li class="layout__cell  |  title title--sub-section  |  trailer--small">
              <span class="legenda__item--identifier legenda__item--purple"></span>
              <a class="is-heir" href="javascript:void()">Central Africa</a>
            </li>
            <li class="layout__cell  |  title title--sub-section  |  trailer--small">
              <span class="legenda__item--identifier legenda__item--yellow"></span>
              <a class="is-heir" href="javascript:void()">Southern Africa</a>
            </li>
            <li class="layout__cell  |  title title--sub-section  |  trailer--small">
              <span class="legenda__item--identifier legenda__item--blue"></span>
              <a class="is-heir" href="javascript:void()">Pacific</a>
            </li>
          </ul>
          <form class="gutters  |  leader">
            <label class="title title--sub-section">Search a country/region</label>
            <input class="fld" type="text" />
          </form>
        </div>
      </div>
      <div class="hero--map__toggle  |  stack__unit stack__pin" data-toggle=".hero--map">
        <span class="toggle  |  icon"></span>
      </div>
    </div>
  </figcaption>
</figure>


Styleguide 5.4.7
*/
@media only screen and (min-width: 64em) {
  .hero--map .hero__headline {
    width: 33.33333%; } }

.hero--map__body {
  visibility: hidden; }
  .is-active .hero--map__body {
    visibility: visible; }

.hero--map__toggle {
  background-color: #67ab43;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
     -moz-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #fff;
  width: 33px;
  cursor: pointer; }
  .hero--map__toggle.theme--dark,
  .theme--dark .hero--map__toggle,
  .theme .theme--dark .hero--map__toggle {
    background-color: #3d3d3d; }
  .hero--map__toggle.theme--green,
  .theme--green .hero--map__toggle,
  .theme .theme--green .hero--map__toggle {
    background-color: #67ab43; }
  .hero--map__toggle.theme--blue,
  .theme--blue .hero--map__toggle,
  .theme .theme--blue .hero--map__toggle {
    background-color: #56c0dd; }
  .hero--map__toggle.theme--lime,
  .theme--lime .hero--map__toggle,
  .theme .theme--lime .hero--map__toggle {
    background-color: #c1d435; }
  .hero--map__toggle.theme--yellow,
  .theme--yellow .hero--map__toggle,
  .theme .theme--yellow .hero--map__toggle {
    background-color: #facf21; }
  .hero--map__toggle.theme--gold,
  .theme--gold .hero--map__toggle,
  .theme .theme--gold .hero--map__toggle {
    background-color: #eb942c; }
  .hero--map__toggle.theme--orange,
  .theme--orange .hero--map__toggle,
  .theme .theme--orange .hero--map__toggle {
    background-color: #e26435; }
  .hero--map__toggle.theme--salmon,
  .theme--salmon .hero--map__toggle,
  .theme .theme--salmon .hero--map__toggle {
    background-color: #eb735d; }
  .hero--map__toggle.theme--red,
  .theme--red .hero--map__toggle,
  .theme .theme--red .hero--map__toggle {
    background-color: #ec2d10; }
  .hero--map__toggle.theme--burgundy,
  .theme--burgundy .hero--map__toggle,
  .theme .theme--burgundy .hero--map__toggle {
    background-color: #ba222a; }
  .hero--map__toggle.theme--purple,
  .theme--purple .hero--map__toggle,
  .theme .theme--purple .hero--map__toggle {
    background-color: #9b3381; }
  .hero--map__toggle.theme--youth,
  .theme--youth .hero--map__toggle,
  .theme .theme--youth .hero--map__toggle {
    background-color: #d57800; }
  .hero--map__toggle.theme--digitalisation,
  .theme--digitalisation .hero--map__toggle,
  .theme .theme--digitalisation .hero--map__toggle {
    background-color: #9a3324; }
  .hero--map__toggle.theme--climate,
  .theme--climate .hero--map__toggle,
  .theme .theme--climate .hero--map__toggle {
    background-color: #693c5e; }
  .hero--map__toggle.theme--gender,
  .theme--gender .hero--map__toggle,
  .theme .theme--gender .hero--map__toggle {
    background-color: #046a38; }
  .hero--map__toggle.theme--nutrition,
  .theme--nutrition .hero--map__toggle,
  .theme .theme--nutrition .hero--map__toggle {
    background-color: #487a7b; }
  .hero--map__toggle.theme--blog,
  .theme--blog .hero--map__toggle,
  .theme .theme--blog .hero--map__toggle {
    background-color: #ffa300; }
  .hero--map__toggle.theme--spore-blue,
  .theme--spore-blue .hero--map__toggle,
  .theme .theme--spore-blue .hero--map__toggle {
    background-color: #3f68b1; }
  .hero--map__toggle.theme--spore-brown,
  .theme--spore-brown .hero--map__toggle,
  .theme .theme--spore-brown .hero--map__toggle {
    background-color: #774b04; }
  .hero--map__toggle.theme--spore-dark-blue,
  .theme--spore-dark-blue .hero--map__toggle,
  .theme .theme--spore-dark-blue .hero--map__toggle {
    background-color: #044e7e; }
  .hero--map__toggle.theme--spore-forest-green,
  .theme--spore-forest-green .hero--map__toggle,
  .theme .theme--spore-forest-green .hero--map__toggle {
    background-color: #5f810a; }
  .hero--map__toggle.theme--spore-grey-blue,
  .theme--spore-grey-blue .hero--map__toggle,
  .theme .theme--spore-grey-blue .hero--map__toggle {
    background-color: #6d8c9f; }
  .hero--map__toggle.theme--spore-light-blue,
  .theme--spore-light-blue .hero--map__toggle,
  .theme .theme--spore-light-blue .hero--map__toggle {
    background-color: #79accf; }
  .hero--map__toggle.theme--spore-lime,
  .theme--spore-lime .hero--map__toggle,
  .theme .theme--spore-lime .hero--map__toggle {
    background-color: #bbae03; }
  .hero--map__toggle.theme--spore-ochre,
  .theme--spore-ochre .hero--map__toggle,
  .theme .theme--spore-ochre .hero--map__toggle {
    background-color: #db9623; }
  .hero--map__toggle.theme--spore-olive-green,
  .theme--spore-olive-green .hero--map__toggle,
  .theme .theme--spore-olive-green .hero--map__toggle {
    background-color: #778d3e; }
  .hero--map__toggle.theme--spore-red,
  .theme--spore-red .hero--map__toggle,
  .theme .theme--spore-red .hero--map__toggle {
    background-color: #f54c23; }
  .hero--map__toggle.theme--spore-taupe,
  .theme--spore-taupe .hero--map__toggle,
  .theme .theme--spore-taupe .hero--map__toggle {
    background-color: #7b6d65; }
  .hero--map__toggle.theme--spore-teal,
  .theme--spore-teal .hero--map__toggle,
  .theme .theme--spore-teal .hero--map__toggle {
    background-color: #077fc1; }
  .no-flexbox .is-inactive .hero--map__toggle {
    display: table;
    height: 100%; }
    .no-flexbox .is-inactive .hero--map__toggle .toggle {
      display: table-cell;
      vertical-align: middle; }
  .is-active .hero--map__toggle {
    position: relative; }
  .hero--map__toggle .toggle {
    font-size: 24px; }
    .hero--map__toggle .toggle:before {
      content: ""; }
    .is-active .hero--map__toggle .toggle:before {
      content: ""; }
  .no-flexbox .hero--map__toggle {
    text-align: center;
    vertical-align: middle; }

.hero--map a {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
          transition-duration: 0s; }

.hero--map .legenda__item--identifier {
  vertical-align: bottom;
  width: 15px;
  height: 15px; }

/* Gradient on hero images */
.article-header__image,
.hero__figure {
  position: relative; }
  .article-header__image:after,
  .hero__figure:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 97%);
    background-image: -moz- oldlinear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 97%);
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 97%); }

/* 4.42 Stories */
/*
Stories

markup:
<section class="trailer-inside--small well well--full well--slim-fit  body--inverse">
    <div class="layout layout--narrow">
        <h1 class="title title--section  |  gutters  |  leader trailer--small">CTA In numbers</h1>
    </div>
    <div class="layout layout--narrow  |  trailer">
        <p class="gutters">Our world in numbers - CTA facts and figures at a glance</p>
    </div>
    <div class="layout--narrow">
        <div class="grid grid--posts  |  grid-decoration  |  gutters  |  leader-inside--small  |  trailer-inside--small">
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">1983</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">1983 </span>Year of establishment. Director: Michael Hailu (2010 - present)</figcaption>
            </figure>
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">6</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">6 </span>Regions. Eastern, Western, Central and Southern Africa, the Caribbean and the Pacific</figcaption>
            </figure>
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">78</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">78 </span>ACP. Focusing on policy processes, value chains, information, communication and knowledge management.</figcaption>
            </figure>
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">3</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">3 </span>Core values. Commitment to development, transparency, empowering communities and groups.</figcaption>
            </figure>
        </div>
    </div>
    <div class="is-silent  |  story-line--horizon">
        <div class="layout--narrow">
            <div class="story-line  |  grid grid--teletubbies grid--align-end  |  leader--small">
                <picture class="story story--globe-plane  |  grid__cell  |  gutters">
                    <source type="image/svg+xml" srcset="/images/stories/globe-plane.svg">
                    <img src="/images/stories/globe-plane.png" alt="1983 Year of establishment. Director: Michael Hailu (2010 - present)">
                </picture>
                <picture class="story story--conversation  |  grid__cell  |  gutters">
                    <source type="image/svg+xml" srcset="/images/stories/conversation.svg">
                    <img src="/images/stories/conversation.png" alt="6 Regions. Eastern, Western, Central and Southern Africa, the Caribbean and the Pacific">
                </picture>
                <picture class="story story--speakers  |  grid__cell  |  gutters">
                    <source type="image/svg+xml" srcset="/images/stories/speakers.svg">
                    <img src="/images/stories/speakers.png" alt="78 ACP. Focusing on policy processes, value chains, information, communication and knowledge management.">
                </picture>
                <picture class="story story--printing-press-publisher  |  grid__cell  |  gutters">
                    <source type="image/svg+xml" srcset="/images/stories/printing-press-publisher.svg">
                    <img src="/images/stories/printing-press-publisher.png" alt="3 Core values. Commitment to development, transparency, empowering communities and groups.">
                </picture>
            </div>
        </div>
    </div>
</section>

Styleguide 4.42
*/
/* 4.43 Contact */
/*
contact

markup:
<sg-insert>3.54-1</sg-insert>
<sg-insert>3.53-1</sg-insert>

Styleguide 4.43
*/
.credit {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .credit__cell {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%; }
    @media only screen and (max-width: 47.9375em) {
      .credit__cell {
        padding-left: 15px;
        padding-right: 15px; } }
    @media only screen and (min-width: 48em) {
      .credit__cell {
        -webkit-box-flex: 0;
           -moz-box-flex: 0;
            -ms-flex: 0 0 50%;
                flex: 0 0 50%;
        max-width: 50%; } }
    .no-flexbox .credit__cell {
      display: inline-block;
      float: left; }
    .credit__cell .credit__cell {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 0 100%;
              flex: 0 0 100%;
      max-width: 100%;
      padding: 0; }

.credits {
  -moz-background-size: cover;
       background-size: cover;
  width: 100%;
  height: 1350px;
  color: #3d3d3d;
  position: relative; }
  @media only screen and (min-width: 64em) {
    .credits {
      padding-top: 150px; } }
  .credits .standout {
    top: 80px; }
    @media only screen and (min-width: 64em) {
      .credits .standout {
        top: -120px; } }
    @media only screen and (min-width: 90em) {
      .credits .standout {
        top: -200px; } }
  .credits-department {
    font-family: "Open Sans", sans-serif;
    text-transform: uppercase;
    font-weight: bold; }

.job-title {
  font-style: italic; }

.spread {
  font-size: 0.75em; }
  .spread, .spread__hero,
  .spread > * {
    position: relative; }
  .spread > * {
    z-index: 2; }
  @media only screen and (max-width: 63.9375em) {
    .spread {
      position: absolute;
      bottom: 0;
      padding-top: 60px; } }
  .spread:after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    width: 100vw;
    z-index: 1; }
  .spread__hero {
    display: block;
    width: 100%; }
    @media only screen and (max-width: 63.9375em) {
      .spread__hero {
        padding: 0 7.5px;
        margin: 15px 0; } }
  .spread__label, .spread__hero {
    z-index: 3; }
  .spread__label {
    position: absolute;
    top: 0;
    right: 15px; }
    @media only screen and (min-width: 64em) {
      .spread__label {
        right: 0; } }

.card-slider .slick-slide, .card-slider .slick-track {
  display: -webkit-box !important;
  display: -moz-box !important;
  display: -ms-flexbox !important;
  display: flex !important; }

.card-slider .slick-slide {
  height: auto !important; }

.card-slider {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .card-slider__slide {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 66.66667vw;
            flex: 0 0 66.66667vw;
    max-width: 66.66667vw; }
  @media only screen and (min-width: 32.5em) {
    .card-slider__slide {
      -ms-flex-preferred-size: 50vw;
          flex-basis: 50vw;
      max-width: 50vw; } }
  @media only screen and (min-width: 64em) {
    .card-slider__slide {
      -ms-flex-preferred-size: 22.22222vw;
          flex-basis: 22.22222vw;
      max-width: 22.22222vw; }
    .card-slider__double-slide {
      -ms-flex-preferred-size: 44.44444vw;
          flex-basis: 44.44444vw;
      max-width: 44.44444vw; } }

.card {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 0;
     -moz-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%; }
  .card__label, .card__theme {
    position: absolute;
    left: 0; }
  .card__label {
    top: 0; }
  .card__theme {
    bottom: 0;
    right: 0;
    padding: 9px 0 0 0; }
  .card__image {
    position: relative; }
  .card__body {
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1; }
  .card__post {
    border-bottom: 0.5px solid rgba(0, 0, 0, 0.26); }
    .card__post:first-child:last-child {
      border-bottom: 0; }
  @media only screen and (min-width: 48em) {
    .card--wide {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      position: relative; }
    .card--wide .card__image {
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%;
      width: 50%;
      -ms-flex-negative: 0;
          flex-shrink: 0;
      position: static;
      padding-right: 30px; }
    .card .post__content .heading {
      padding-top: 3px;
      font-size: 1em; } }
  @media only screen and (min-width: 90em) {
    .card--wide .card__image {
      -ms-flex-preferred-size: 22.22222vw;
          flex-basis: 22.22222vw;
      width: 50%; } }

/* 4.x.x Post-row */
/* 4.x.x Post-tile */
/* 4.50 ICT Update */
/*
ICT Update

Styleguide 4.50
*/
/* 4.50.1 ICT Update – Featured Issues */
/*
ICT Update – Featured Issues

markup:
<div class="layout  |  well">
    <aside class="layout__cell layout__cell--aside layout__cell--divider  |  wings  |  trailer-inside">
        <div class="topics topics" data-fe-id="aab1193f72e3388e">
            <h3 class="title title--lead trailer  |  gutters">Topics</h3>
            <ul class="label-list reset list--inline  |  gutters">
                <li>
                    <a class="label label--s" href="">resources</a>
                </li>
                <li>
                    <a class="label label--s" href="">groups</a>
                </li>
                <li>
                    <a class="label label--s" href="">time</a>
                </li>
                <li>
                    <a class="label label--s" href="">technology</a>
                </li>
                <li>
                    <a class="label label--s" href="">products</a>
                </li>
            </ul>
        </div>
    </aside>
    <div class="layout__cell  |  wing--right">
        <div class="grid grid--stories">
            <article class="grid__cell grid grid--stories  |  posting  |  trailer">
                <a class="anchor--shy anchor--reset  |  is-heir  |   grid grid--posts" href="">
                    <figure class="grid__cell  |  gutters  |  trailer--tiny">
                        <img class="image image--stretch" alt="Drones for agriculture" src="https://res.cloudinary.com/cta/image/upload/v1505735714/pkdnckzvvuymywupcrl6.jpg">
                    </figure>
                    <div class="grid__cell  |  gutters">
                        <div class="issue-label  |  media  |  trailer--small">
                            <div class="issue-label__nr" data-issue-nr="85"></div>
                            <div class="issue-label__caption anchor--reset">
                                <p>
                                    <strong>Issue 85</strong><br>
                                    <span>June 2017</span>
                                </p>
                            </div>
                        </div>
                        <h3 class="title title--lead title--section">Applications for agriculture</h3>
                        <span class="read-more">View issue</span>
                    </div>
                </a>
            </article>
            <div class="grid__cell">
                <ul class="reset trellis trellis--l">
                    <li class="trellis__cell trailer gutters">
                        <a class="anchor--shy anchor--reset  |  is-heir" href="">
                            <figure>
                                <img class="image image--stretch" alt="Issue 84" src="https://res.cloudinary.com/cta/image/upload/v1494857266/ulzr5sayvjioztg4nptf.jpg">
                                <figcaption class="issue-label issue-label--s issue-label--offset-top media leader-inside--tiny">
                                    <div class="issue-label__nr" data-issue-nr="84"></div>
                                    <span class="issue-label__caption">Issue 84 February 2017</span>
                                </figcaption>
                            </figure>
                        </a>
                    </li>
                    <li class="trellis__cell trailer gutters">
                        <a class="anchor--shy anchor--reset  |  is-heir" href="">
                            <figure>
                                <img class="image image--stretch" alt="Issue 83" src="https://res.cloudinary.com/cta/image/upload/v1494910410/q6fohw6gnw1u1p5b5wzz.jpg">
                                <figcaption class="issue-label issue-label--s issue-label--offset-top media leader-inside--tiny">
                                    <div class="issue-label__nr" data-issue-nr="83"></div>
                                    <span class="issue-label__caption">Issue 83 October 2016</span>
                                </figcaption>
                            </figure>
                        </a>
                        <a class="button button--stretch leader trailer" href="">All issues</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

Styleguide 4.50.1
*/
/* 4.50.2 ICT Update – Posting */
/*
Posting Issue - Issue Row

ICT Update has a slightly different markup than a regular row posting to accommodate the posting top border.

markup:
<article class="grid__cell  |  leader-small  |  gutters">
    <div class="media  |  post">
        <div class="media__body  |  gutter">
            <span class="meta">
                in <a href="/en/ictupdate">ICTUpdate</a>
            </span>
            <h3 class="title  |  anchor--reset">
    		    <a class="anchor anchor--shy  |  is-heir" href="/en/ictupdate/issue-85/article/meet-the-apps4ag-database-sid080bc222e-80b1-4293-bd9d-75b2ea6c8615">Meet the Apps4Ag database</a>
  	    </h3>
            <p class="post__intro">The Apps4Ag database is developed by CTA and is an online collection of over 500 applications, which provides new ways to find and discover worldwide ICT innovations for agriculture. How can you make the most of this database on www.apps4ag.org?</p>
            <a class="read-more" href="/en/ictupdate/issue-85/article/meet-the-apps4ag-database-sid080bc222e-80b1-4293-bd9d-75b2ea6c8615">Read More</a>
        </div>
        <div class="media__figure  |  trailer--tiny">
            <a class="anchor anchor--shy" href="/en/article/meet-the-apps4ag-database-sid080bc222e-80b1-4293-bd9d-75b2ea6c8615">
                <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
            </a>
        </div>
    </div>
</article>

Styleguide 4.50.2
*/
.posting--row.posting--issue .posting__image, .posting--row.posting--issue .posting__content {
  padding-top: 3px;
  border-top: 1px solid #67ab43; }
  .theme--blue .posting--row.posting--issue .posting__image, .theme--blue .posting--row.posting--issue .posting__content {
    border-color: #56c0dd; }
  .theme--lime .posting--row.posting--issue .posting__image, .theme--lime .posting--row.posting--issue .posting__content {
    border-color: #c1d435; }
  .theme--yellow .posting--row.posting--issue .posting__image, .theme--yellow .posting--row.posting--issue .posting__content {
    border-color: #facf21; }
  .theme--gold .posting--row.posting--issue .posting__image, .theme--gold .posting--row.posting--issue .posting__content {
    border-color: #eb942c; }
  .theme--orange .posting--row.posting--issue .posting__image, .theme--orange .posting--row.posting--issue .posting__content {
    border-color: #e26435; }
  .theme--salmon .posting--row.posting--issue .posting__image, .theme--salmon .posting--row.posting--issue .posting__content {
    border-color: #eb735d; }
  .theme--red .posting--row.posting--issue .posting__image, .theme--red .posting--row.posting--issue .posting__content {
    border-color: #ec2d10; }
  .theme--burgundy .posting--row.posting--issue .posting__image, .theme--burgundy .posting--row.posting--issue .posting__content {
    border-color: #ba222a; }
  .theme--purple .posting--row.posting--issue .posting__image, .theme--purple .posting--row.posting--issue .posting__content {
    border-color: #9b3381; }
  .posting--row.posting--issue .posting__image .issue-label, .posting--row.posting--issue .posting__content .issue-label {
    float: right;
    position: relative;
    top: -3px; }
    .posting--row.posting--issue .posting__image .issue-label, .posting--row.posting--issue .posting__image .issue-label:after, .posting--row.posting--issue .posting__content .issue-label, .posting--row.posting--issue .posting__content .issue-label:after {
      margin-left: 15px; }

.posting.posting--row.posting--issue .issue-label {
  position: relative;
  top: -3px;
  white-space: nowrap; }

.posting .media__stretcher + .media__stretcher {
  display: none; }

@media only screen and (min-width: 90em) {
  .posting .media__stretcher + .media__stretcher {
    display: block; } }

/* 4.50.3 ICT Update – Issue */
/*
ICT Update – Issue

Uses the issue-label. The Issue label can be placed above or below the cover image. Use trailer/leader for extra spacing.

The squared issue label is not part of the semantics of the HTML and is rendered through the data-issue attribute.

markup:
<aside class="gutters">
    <div class="issue-label issue-label--l media media--middle anchor--reset leader">
        <div class="issue-label__nr" data-issue-nr="85"></div>
        <div class="issue-label__caption">
            <p>
                <strong>Issue 85</strong>
                <span>June 2017</span>
            </p>
        </div>
    </div>
    <figure>
        <figcaption class="title title--lead title--section leader--small anchor--reset">Applications for agriculture</figcaption>
        <img class="0" src="https://res.cloudinary.com/cta/image/upload/w_480/pkdnckzvvuymywupcrl6" srcset="https://res.cloudinary.com/cta/image/upload/w_480/pkdnckzvvuymywupcrl6 480w,https://res.cloudinary.com/cta/image/upload/w_320/pkdnckzvvuymywupcrl6 320w,https://res.cloudinary.com/cta/image/upload/w_240/pkdnckzvvuymywupcrl6 240w" sizes="100vw, (min-width: 480px) 480px" alt="Array">
    </figure>
</aside>

sg-wrapper:
<div style="width: 350px;">
    <sg-wrapper-content/>
</div>

Styleguide 4.50.3
*/
.issue {
  margin-top: 36px; }
  .issue__cover {
    display: block;
    max-width: 100%; }
  .issue--s .issue__cover {
    width: 120px; }
  .issue .anchor--shy {
    /* In order to decrease the size of the anchor */
    display: inline-block; }

/*
Issue aside

markup:
<article class="grid__cell grid grid--stories  |  posting  |  trailer">
    <a class="anchor--shy anchor--reset  |  is-heir  |   grid grid--posts" href="">
        <figure class="grid__cell  |  gutters  |  trailer--tiny">
            <img class="image image--stretch" alt="Drones for agriculture" src="https://res.cloudinary.com/cta/image/upload/v1505735714/pkdnckzvvuymywupcrl6.jpg">
        </figure>
        <div class="grid__cell  |  gutters">
            <div class="issue-label  |  media  |  trailer--small">
                <div class="issue-label__nr" data-issue-nr="85"></div>
                <div class="issue-label__caption anchor--reset">
                    <p>
                        <strong>Issue 85</strong><br>
                        <span>June 2017</span>
                    </p>
                </div>
            </div>
            <h3 class="title title--lead title--section">Applications for agriculture</h3>
            <span class="read-more">View issue</span>
        </div>
    </a>
</article>

sg-wrapper:
<div style="width: 450px;">
    <sg-wrapper-content/>
</div>

Styleguide 4.50.3.1
*/
/*
Issue below

markup:
<a class="anchor--shy anchor--reset  |  is-heir" href="">
    <figure>
        <img class="image image--stretch" alt="Issue 84" src="https://res.cloudinary.com/cta/image/upload/v1494857266/ulzr5sayvjioztg4nptf.jpg">
        <figcaption class="issue-label issue-label--s issue-label--offset-top media leader-inside--tiny">
            <div class="issue-label__nr" data-issue-nr="84"></div>
            <span class="issue-label__caption">Issue 84 February 2017</span>
        </figcaption>
    </figure>
</a>

sg-wrapper:
<div style="width: 200px;">
    <sg-wrapper-content/>
</div>

Styleguide 4.50.3.2
*/
/* 4.51 Legacy banner by Jasper :D */
.legacy-banner {
  background: #67ab43;
  color: #fff;
  text-align: center; }
  .legacy-banner__wrapper {
    width: 80vw;
    margin: 0 auto; }
    @media only screen and (min-width: 64em) {
      .legacy-banner__wrapper {
        width: 40vw; } }
  .legacy-banner__header {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1em; }
  .legacy-banner__link {
    background: #67ab43;
    color: #fff;
    border-color: #fff; }

/* 5. */
/*
Modules

Styleguide 5.0
*/
/* 5.1 Masthead */
/*
Masthead

.masthead - Site header, includes navigation and search

markup:
<header class="{$modifiers}">
  <sg-insert>4.2-1</sg-insert>
  <sg-insert>4.3-2</sg-insert>
</header>

Styleguide 5.1
*/
.masthead {
  position: relative;
  max-width: 100%;
  z-index: 2; }

/*
Masthead – ICT Update

.masthead - Site header, includes navigation and search

markup:
<header class="masthead">
  <sg-insert>4.2-1</sg-insert>
  <sg-insert>4.3.2-2</sg-insert>
</header>

Styleguide 5.1.1
*/
/* 5.2 Site-footer */
/*
Site footer

markup:
<div class="site-footer layout">
	<div class="layout__cell layout__cell--aside  |  site-footer__meta  |   wings">
		<div class="trailer--normal">
			<img class="gutters" src="/images/logos/europe-logo.png" alt="European Union">
			<img class="gutters" src="/images/logos/acp-logo.png" alt="ACP">
		</div>
		<p class="gutters  |  meta meta--s meta--lowercase">CTA is a joint institution operating under the framework of the Cotonou Agreement between the ACP Group of States (Africa, the Caribbean and the Pacific) and the EU Member States (European Union). CTA is funded by the European Union.</p>
		<div class="gutters  |  leader  |  txt-meta  |  layout__cell layout__cell--aside">
			<a class="anchor--shy  is-heir  |  meta meta--s  |  gutter--right" href="">Disclaimer</a>
			<a class="anchor--shy  is-heir  |  meta meta--s  |  gutter--right" href="">Copyrights</a>
			<a class="anchor--shy  is-heir  |  meta meta--s  |  gutter--right" href="">Privacy statement</a>
		</div>
	</div>
	<div class="layout__cell layout__cell--main  |  layout layout--footer">
		<div class="layout__cell layout__cell--main  |  site-footer__links">
			<div class="grid grid--musketeers">
				<div class="grid__cell  |  gutters">
					<h2 class="title  |  site-footer__title">About CTA</h2>
					<ul class="reset">
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">About CTA</a>
						</li>
					</ul>
				</div>
				<div class="grid__cell  |  gutters">
					<h2 class="title  |  site-footer__title">Regions</h2>
					<ul class="reset">
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Caribbean</a>
						</li>
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Central Africa</a>
						</li>
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Eastern Africa</a>
						</li>
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Western Africa</a>
						</li>
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Southern Africa</a>
						</li>
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Pacific</a>
						</li>
					</ul>
				</div>
				<div class="grid__cell  |  gutters">
					<h2 class="title  |  site-footer__title">Focus Areas</h2>
					<ul class="reset">
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Agribusiness</a>
						</li>
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">ICTs for agriculture</a>
						</li>
						<li class="title site-footer__link  |  leader--tiny  |  trailer-inside--tiny">
							<a class="is-heir" href="">Climate resilient agriculture</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="layout__cell layout__cell--aside  |  site-footer__social  |  wings">
			<div>
				<h2 class="title  |  site-footer__title  |  gutters">CTA Flash</h2>
				<p class="body--whisper  |  gutters  |  tweets">
					RT <a href="" target="_blank">@UAV4Ag</a>: African Union Executive Council decision EX CL/Dec. 986-1007(XXXII) requests AU and Member States to harness <a href="" target="_blank">#drone</a>					tech for #a…
				</p>
				<p class="meta meta--lowercase meta--s |  leader--small  |  gutters">4 hours ago</p>
			</div>
			<div class="trailer  |  site-footer__share">
				<span class="gutters  |  title  |  site-footer__title">follow us</span>
				<a class="anchor--shy  is-heir" href="" target="_blank"><span class="icon icon--facebook icon--s  |  gutter--right"></span></a>
				<a class="anchor--shy  is-heir" href="" target="_blank"><span class="icon icon--twitter icon--s  |  gutter--right"></span></a>
				<a class="anchor--shy  is-heir" href="" target="_blank"><span class="icon icon--linkedin icon--s  |  gutter--right"></span></a>
				<a class="anchor--shy  is-heir" href=""><span class="icon icon--vimeo icon--s  |  gutter--right"></span></a>
			</div>
		</div>
	</div>
</div>

Styleguide 5.2
*/
.site-footer {
  background-color: #3d3d3d;
  color: #fff;
  color: rgba(255, 255, 255, 0.8);
  padding-top: 30px;
  padding-bottom: 30px; }
  .is-illustrated + .site-footer {
    padding-top: 60px;
    /* Add extra padding when a container with overlapping illustrations is placed above the site-footer */ }
  .site-footer a.meta:hover, .site-footer__link:hover,
  .site-footer .icon:hover,
  .site-footer .list--take-aways li:hover:before,
  .list--take-aways .site-footer li:hover:before,
  .site-footer .list--theme li:hover:before,
  .list--theme .site-footer li:hover:before,
  .site-footer .filter__trigger:hover:after,
  .site-footer .block-link--icon:hover:before,
  .site-footer .panel.is-inactive .panel__trigger:hover:after,
  .panel.is-inactive .site-footer .panel__trigger:hover:after,
  .site-footer .tail__lengthen:hover:before,
  .site-footer .tail__lengthen:hover:after,
  .site-footer .tail__shorten:hover:before,
  .site-footer .tail__shorten:hover:after {
    color: #fff !important; }
  .site-footer__meta .meta {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-weight: 500;
    line-height: 1.3; }
  .site-footer__title, .site-footer__share {
    margin-top: 30px;
    margin-bottom: 24px; }
  .site-footer__title {
    color: rgba(255, 255, 255, 0.4);
    /* small title*/
    font-size: 0.875em;
    line-height: 1.28571; }
  .site-footer__link {
    /* small title*/
    font-size: 0.75em;
    line-height: 1.5; }
  .site-footer .txt-meta a {
    text-transform: uppercase; }
  .site-footer .icon, .site-footer .list--take-aways li:before, .list--take-aways .site-footer li:before, .site-footer .list--theme li:before, .list--theme .site-footer li:before, .site-footer .filter__trigger:after, .site-footer .block-link--icon:before, .site-footer .panel.is-inactive .panel__trigger:after, .panel.is-inactive .site-footer .panel__trigger:after, .site-footer .tail__lengthen:before, .site-footer .tail__lengthen:after, .site-footer .tail__shorten:before, .site-footer .tail__shorten:after {
    font-size: 1.75em; }
  @media only screen and (max-width: 63.9375em) {
    .site-footer .grid__cell {
      width: 33.33333%;
      -ms-flex-preferred-size: 33.33333%;
          flex-basis: 33.33333%; } }
  @media only screen and (min-width: 64em) {
    .site-footer .layout--footer {
      overflow: hidden; }
    .layout .site-footer__links {
      -ms-flex-preferred-size: 33.33333vw;
          flex-basis: 33.33333vw;
      max-width: 33.33333vw; }
      .no-flexbox .layout .site-footer__links {
        width: 46.15385%;
        max-width: 46.15385%; }
    .layout .site-footer__social {
      -ms-flex-preferred-size: 27.77778vw;
          flex-basis: 27.77778vw;
      max-width: 27.77778vw; }
      .no-flexbox .layout .site-footer__social {
        width: 38.46154%;
        max-width: 38.46154%; }
    .site-footer__share .title {
      font-size: 0.75em; }
    .site-footer__share .title,
    .site-footer__share .icon,
    .site-footer__share .list--take-aways li:before,
    .list--take-aways .site-footer__share li:before,
    .site-footer__share .list--theme li:before,
    .list--theme .site-footer__share li:before,
    .site-footer__share .filter__trigger:after,
    .site-footer__share .block-link--icon:before,
    .site-footer__share .panel.is-inactive .panel__trigger:after,
    .panel.is-inactive .site-footer__share .panel__trigger:after,
    .site-footer__share .tail__lengthen:before,
    .site-footer__share .tail__lengthen:after,
    .site-footer__share .tail__shorten:before,
    .site-footer__share .tail__shorten:after {
      line-height: 21px; }
    .site-footer__title {
      margin-top: 0;
      font-size: 1em; } }
  @media only screen and (min-width: 90em) {
    .layout .site-footer__social {
      -ms-flex-preferred-size: 27.77778vw;
          flex-basis: 27.77778vw;
      max-width: 27.77778vw;
      padding-left: 5.55556vw;
      padding-right: 2.77778vw; }
      .no-flexbox .layout .site-footer__social {
        width: 38.46154%;
        max-width: 38.46154%; } }

/* 5.3 Post */
/*
Article

Styleguide 5.3
*/
/* 5.3.1 Hero */
/*
Article Header

.article-header - Article hero
.article-header.is-crowned - Pulled up under menu

markup:
<header class="{$modifiers}">
  <img
  class="article-header__image  |  image image--stretch"
  sizes="(max-width: 500w) 500w, 1024w,1480w"
  srcset="https://images.unsplash.com/photo-1464684979825-ad6f2811cef2?q=80&crop=entropy&w=630&h=480&fit=crop 320w,
          https://images.unsplash.com/photo-1464684979825-ad6f2811cef2?q=80&crop=entropy&w=1920&h=600&fit=crop 1480w"
  alt="…">
  <sg-insert>5.3.2</sg-insert>
</header>

Styleguide 5.3.1
*/
/*
 * 1. Pull up (under navigation)
 */
.article-header {
  background-color: #67ab43;
  margin-bottom: 30px; }
  .article-header.theme--dark,
  .theme--dark .article-header,
  .theme .theme--dark .article-header {
    background-color: #3d3d3d; }
  .article-header.theme--green,
  .theme--green .article-header,
  .theme .theme--green .article-header {
    background-color: #67ab43; }
  .article-header.theme--blue,
  .theme--blue .article-header,
  .theme .theme--blue .article-header {
    background-color: #56c0dd; }
  .article-header.theme--lime,
  .theme--lime .article-header,
  .theme .theme--lime .article-header {
    background-color: #c1d435; }
  .article-header.theme--yellow,
  .theme--yellow .article-header,
  .theme .theme--yellow .article-header {
    background-color: #facf21; }
  .article-header.theme--gold,
  .theme--gold .article-header,
  .theme .theme--gold .article-header {
    background-color: #eb942c; }
  .article-header.theme--orange,
  .theme--orange .article-header,
  .theme .theme--orange .article-header {
    background-color: #e26435; }
  .article-header.theme--salmon,
  .theme--salmon .article-header,
  .theme .theme--salmon .article-header {
    background-color: #eb735d; }
  .article-header.theme--red,
  .theme--red .article-header,
  .theme .theme--red .article-header {
    background-color: #ec2d10; }
  .article-header.theme--burgundy,
  .theme--burgundy .article-header,
  .theme .theme--burgundy .article-header {
    background-color: #ba222a; }
  .article-header.theme--purple,
  .theme--purple .article-header,
  .theme .theme--purple .article-header {
    background-color: #9b3381; }
  .article-header.theme--youth,
  .theme--youth .article-header,
  .theme .theme--youth .article-header {
    background-color: #d57800; }
  .article-header.theme--digitalisation,
  .theme--digitalisation .article-header,
  .theme .theme--digitalisation .article-header {
    background-color: #9a3324; }
  .article-header.theme--climate,
  .theme--climate .article-header,
  .theme .theme--climate .article-header {
    background-color: #693c5e; }
  .article-header.theme--gender,
  .theme--gender .article-header,
  .theme .theme--gender .article-header {
    background-color: #046a38; }
  .article-header.theme--nutrition,
  .theme--nutrition .article-header,
  .theme .theme--nutrition .article-header {
    background-color: #487a7b; }
  .article-header.theme--blog,
  .theme--blog .article-header,
  .theme .theme--blog .article-header {
    background-color: #ffa300; }
  .article-header.theme--spore-blue,
  .theme--spore-blue .article-header,
  .theme .theme--spore-blue .article-header {
    background-color: #3f68b1; }
  .article-header.theme--spore-brown,
  .theme--spore-brown .article-header,
  .theme .theme--spore-brown .article-header {
    background-color: #774b04; }
  .article-header.theme--spore-dark-blue,
  .theme--spore-dark-blue .article-header,
  .theme .theme--spore-dark-blue .article-header {
    background-color: #044e7e; }
  .article-header.theme--spore-forest-green,
  .theme--spore-forest-green .article-header,
  .theme .theme--spore-forest-green .article-header {
    background-color: #5f810a; }
  .article-header.theme--spore-grey-blue,
  .theme--spore-grey-blue .article-header,
  .theme .theme--spore-grey-blue .article-header {
    background-color: #6d8c9f; }
  .article-header.theme--spore-light-blue,
  .theme--spore-light-blue .article-header,
  .theme .theme--spore-light-blue .article-header {
    background-color: #79accf; }
  .article-header.theme--spore-lime,
  .theme--spore-lime .article-header,
  .theme .theme--spore-lime .article-header {
    background-color: #bbae03; }
  .article-header.theme--spore-ochre,
  .theme--spore-ochre .article-header,
  .theme .theme--spore-ochre .article-header {
    background-color: #db9623; }
  .article-header.theme--spore-olive-green,
  .theme--spore-olive-green .article-header,
  .theme .theme--spore-olive-green .article-header {
    background-color: #778d3e; }
  .article-header.theme--spore-red,
  .theme--spore-red .article-header,
  .theme .theme--spore-red .article-header {
    background-color: #f54c23; }
  .article-header.theme--spore-taupe,
  .theme--spore-taupe .article-header,
  .theme .theme--spore-taupe .article-header {
    background-color: #7b6d65; }
  .article-header.theme--spore-teal,
  .theme--spore-teal .article-header,
  .theme .theme--spore-teal .article-header {
    background-color: #077fc1; }
  .article-header.is-crowned {
    overflow-x: hidden; }
  .article-header.is-crowned .article-header__image {
    width: 130%; }
  .article-header,
  .article-header .issue-label__caption,
  .article-header .meta {
    color: #fff; }

/* 5.3.2 Header */
/*
Article Headline

markup:
<div class="article-headline  |  layout layout--reverse">
    <div class="layout  layout--align-middle  |  layout__cell layout__cell--main">
        <div class="layout__cell layout__cell--main  |  gutters">
            <div class="leader  |  trailer">
                <h1 class="article-headline__title  |  title title--headline">
                    Addressing finance challenges for ICT4Ag start-ups
                </h1>
            </div>
            <p class="article-headline__byline  |  meta  |  trailer"><strong class="reset">ICT4Ag Outlook Expert Meeting, 9-11 October 2017, Rhenen, Netherlands</strong></p>
        </div>
        <div class="layout__cell layout__cell--aside  |  leader--ie-l  | wings  ">
            <p class="caption  |  gutters  |  trailer">ICT4Ag Outlook Expert Meeting</p>
            <p class="credit  |  gutters  |  trailer">© CTA</p>
        </div>
    </div>
    <div class="layout__cell layout__cell--aside  |  gutters">
    </div>
</div>

Styleguide 5.3.2
*/
.article-headline {
  background-color: #67ab43;
  color: #fff; }
  .article-headline.theme--dark,
  .theme--dark .article-headline,
  .theme .theme--dark .article-headline {
    background-color: #3d3d3d; }
  .article-headline.theme--green,
  .theme--green .article-headline,
  .theme .theme--green .article-headline {
    background-color: #67ab43; }
  .article-headline.theme--blue,
  .theme--blue .article-headline,
  .theme .theme--blue .article-headline {
    background-color: #56c0dd; }
  .article-headline.theme--lime,
  .theme--lime .article-headline,
  .theme .theme--lime .article-headline {
    background-color: #c1d435; }
  .article-headline.theme--yellow,
  .theme--yellow .article-headline,
  .theme .theme--yellow .article-headline {
    background-color: #facf21; }
  .article-headline.theme--gold,
  .theme--gold .article-headline,
  .theme .theme--gold .article-headline {
    background-color: #eb942c; }
  .article-headline.theme--orange,
  .theme--orange .article-headline,
  .theme .theme--orange .article-headline {
    background-color: #e26435; }
  .article-headline.theme--salmon,
  .theme--salmon .article-headline,
  .theme .theme--salmon .article-headline {
    background-color: #eb735d; }
  .article-headline.theme--red,
  .theme--red .article-headline,
  .theme .theme--red .article-headline {
    background-color: #ec2d10; }
  .article-headline.theme--burgundy,
  .theme--burgundy .article-headline,
  .theme .theme--burgundy .article-headline {
    background-color: #ba222a; }
  .article-headline.theme--purple,
  .theme--purple .article-headline,
  .theme .theme--purple .article-headline {
    background-color: #9b3381; }
  .article-headline.theme--youth,
  .theme--youth .article-headline,
  .theme .theme--youth .article-headline {
    background-color: #d57800; }
  .article-headline.theme--digitalisation,
  .theme--digitalisation .article-headline,
  .theme .theme--digitalisation .article-headline {
    background-color: #9a3324; }
  .article-headline.theme--climate,
  .theme--climate .article-headline,
  .theme .theme--climate .article-headline {
    background-color: #693c5e; }
  .article-headline.theme--gender,
  .theme--gender .article-headline,
  .theme .theme--gender .article-headline {
    background-color: #046a38; }
  .article-headline.theme--nutrition,
  .theme--nutrition .article-headline,
  .theme .theme--nutrition .article-headline {
    background-color: #487a7b; }
  .article-headline.theme--blog,
  .theme--blog .article-headline,
  .theme .theme--blog .article-headline {
    background-color: #ffa300; }
  .article-headline.theme--spore-blue,
  .theme--spore-blue .article-headline,
  .theme .theme--spore-blue .article-headline {
    background-color: #3f68b1; }
  .article-headline.theme--spore-brown,
  .theme--spore-brown .article-headline,
  .theme .theme--spore-brown .article-headline {
    background-color: #774b04; }
  .article-headline.theme--spore-dark-blue,
  .theme--spore-dark-blue .article-headline,
  .theme .theme--spore-dark-blue .article-headline {
    background-color: #044e7e; }
  .article-headline.theme--spore-forest-green,
  .theme--spore-forest-green .article-headline,
  .theme .theme--spore-forest-green .article-headline {
    background-color: #5f810a; }
  .article-headline.theme--spore-grey-blue,
  .theme--spore-grey-blue .article-headline,
  .theme .theme--spore-grey-blue .article-headline {
    background-color: #6d8c9f; }
  .article-headline.theme--spore-light-blue,
  .theme--spore-light-blue .article-headline,
  .theme .theme--spore-light-blue .article-headline {
    background-color: #79accf; }
  .article-headline.theme--spore-lime,
  .theme--spore-lime .article-headline,
  .theme .theme--spore-lime .article-headline {
    background-color: #bbae03; }
  .article-headline.theme--spore-ochre,
  .theme--spore-ochre .article-headline,
  .theme .theme--spore-ochre .article-headline {
    background-color: #db9623; }
  .article-headline.theme--spore-olive-green,
  .theme--spore-olive-green .article-headline,
  .theme .theme--spore-olive-green .article-headline {
    background-color: #778d3e; }
  .article-headline.theme--spore-red,
  .theme--spore-red .article-headline,
  .theme .theme--spore-red .article-headline {
    background-color: #f54c23; }
  .article-headline.theme--spore-taupe,
  .theme--spore-taupe .article-headline,
  .theme .theme--spore-taupe .article-headline {
    background-color: #7b6d65; }
  .article-headline.theme--spore-teal,
  .theme--spore-teal .article-headline,
  .theme .theme--spore-teal .article-headline {
    background-color: #077fc1; }
  @media only screen and (max-width: 63.9375em) {
    .article-headline {
      padding-top: 30px; } }
  .article-headline__title {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }
  .article-headline__about, .article-headline__author {
    font-size: 0.8em; }
  .article-headline__author {
    margin-top: 18px;
    margin-bottom: 18px; }
  .article-headline__byline {
    display: block; }

/* 5.3.4 List */
/*
Post List - Rows

markup:
<div class="grid grid--posts">
    <div class="grid__cell  |  trailer  |  gutters">
        <div class="post">
            <div class="post__media">
                <a class="anchor anchor--shy" href="/en/spore/article/super-seeds-reach-refugees-in-uganda-sid03d1c2e72-dd48-4afb-a343-ba8c7901948b">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-10T06:06:39+00:00">10 January 2018</time>
                <span class="meta">in <a href="/en/spore">Spore</a></span>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="">
                        'Super seeds' reach refugees in Uganda
                    </a>
                </h3>
                <p class="is-gt-small-desktop  |  post__intro">To promote food security and self-sufficiency in Uganda among smallholder farmers and refugee communities, new bean varieties have been bred to tolerate the changing climate. The highly productive seeds have also become popular among traders and seed companies who have a ready market for their product.</p>
                <a class="read-more" href="">Read More</a>
            </div>
        </div>
    </div>
    <div class="grid__cell  |  trailer  |  gutters">
        <div class="post">
            <div class="post__media">
                <a class="anchor anchor--shy" href="/en/spore/article/super-seeds-reach-refugees-in-uganda-sid03d1c2e72-dd48-4afb-a343-ba8c7901948b">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-10T06:06:39+00:00">10 January 2018</time>
                <span class="meta">in <a href="/en/spore">Spore</a></span>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="">
                        'Super seeds' reach refugees in Uganda
                    </a>
                </h3>
                <p class="is-gt-small-desktop  |  post__intro">To promote food security and self-sufficiency in Uganda among smallholder farmers and refugee communities, new bean varieties have been bred to tolerate the changing climate. The highly productive seeds have also become popular among traders and seed companies who have a ready market for their product.</p>
                <a class="read-more" href="">Read More</a>
            </div>
        </div>
    </div>
    <div class="grid__cell  |  trailer  |  gutters">
        <div class="post">
            <div class="post__media">
                <a class="anchor anchor--shy" href="/en/spore/article/super-seeds-reach-refugees-in-uganda-sid03d1c2e72-dd48-4afb-a343-ba8c7901948b">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-10T06:06:39+00:00">10 January 2018</time>
                <span class="meta">in <a href="/en/spore">Spore</a></span>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="">
                        'Super seeds' reach refugees in Uganda
                    </a>
                </h3>
                <p class="is-gt-small-desktop  |  post__intro">To promote food security and self-sufficiency in Uganda among smallholder farmers and refugee communities, new bean varieties have been bred to tolerate the changing climate. The highly productive seeds have also become popular among traders and seed companies who have a ready market for their product.</p>
                <a class="read-more" href="">Read More</a>
            </div>
        </div>
    </div>
</div>

Styleguide 5.3.4
*/
/* 5.3.5 Body */
/*
Article Body

markup:
<div class="layout layout--reverse">
    <div class="layout__cell layout__cell--main">
        <div class="layout">
            <div class="layout__cell layout__cell--main  |  trailer--hero">
                <div class="social__share  |  trailer  |  gutters">
                    <ul class="share-list reset list--float">
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=Policy-Support-Gap-for-&quot;Climate-Smart&quot;-Agriculture&amp;redirect_uri=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280&amp;link=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280" target="_blank">
                                <span data-icon="facebook" class="icon icon--facebook">
                                    <span>
                                        <span class="is-narrative">Share on Facebook</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280" target="_blank">
                                <span data-icon="twitter" class="icon icon--twitter">
                                    <span>
                                        <span class="is-narrative">Share on Twitter</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--print" title="Print" href="javascript:print();">
                                <span data-icon="print" class="icon icon--print">
                                    <span>
                                        <span class="is-narrative">Print</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--email" title="Send link via E-mail" href="mailto:?subject=Policy-Support-Gap-for-&quot;Climate-Smart&quot;-Agriculture&amp;body=">
                                <span data-icon="email" class="icon icon--envelope">
                                    <span>
                                        <span class="is-narrative">Send link via E-mail</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
                <footer class="gutters  |  trailer--hero">
                    <p class="meta">Thursday, 25 January 2018 </p>
                    <div class="media__content  |  body--whisper  |  leader--tiny">
                        by Busani Bafana - Journalist, based in Bulawayo, Zimbabwe, writer for IPS Inter Press Service Africa
                    </div>
                </footer>
                <div class="post-anchor  |  clear">
                    <p class="gutters  |  paragraph--lead">Conditioned that ploughing is the sure way to produce crops, Zimbabwean farmer Handrixious Zvomarima surprised himself by trying a different method. He planted cowpea seeds directly without tilling the land. It worked. The new method
                        tripled Zvomarima's cowpea yield when many farmers did not harvest a crop following the El Nino-induced drought which affected more than 40 million people in Southern Africa.
                    </p>
                    <p class="paragraph  |  gutters">Zvomarima from Shamva District, 120 km northwest of Harare, adopted the water-saving method known as 'no till farming'. This is part of the Climate Smart Agriculture (CSA) practices and approaches developed and promoted by the United
                        Nations Food and Agriculture Organization (FAO). This model of climate-smart agriculture seeks to sustainably increase productivity and incomes while helping farmers adapt to and become more resilient to the effects of climate
                        change. CSA practices also aim to reduce and remove agriculture's greenhouse gases emissions, where possible.</p>
                    <h2 class="heading  |  gutters">With policies, CSA practices pay</h2>
                    <p class="paragraph  |  gutters">"Policymakers have a role to play in climate-smart agro-technological innovation; the researchers suggest traditional supply-side measures and equivalent demand-side measures (such as tax breaks) could reduce cost and increase return
                        on investment for users," said Dr Federica Matteoli, project Manager at FAO Climate Change and Environment Division in Rome.</p>
                    <figure class="gutters  |  leader leader-inside--small  |  trailer trailer-inside--small">
                        <img class="image image--stretch" src="https://res.cloudinary.com/cta/image/upload/v1516871717/vo9tyysicxip70qztttz.jpg" alt="Zimbabwean farmer Handrixious Zvomarima (centre) and family members admiring their cowpea crop in Shamva District, planted using conservation agriculture techniques">
                        <figcaption class="well well--neutral  |  leader-inside--small  |  trailer-inside--small">
                            <p class="caption">Zimbabwean farmer Handrixious Zvomarima (centre) and family members admiring their cowpea crop in Shamva District, planted using conservation agriculture techniques</p>
                            <p class="credit">© Busani Bafana/IPS</p>
                        </figcaption>
                    </figure>
                    <p class="paragraph  |  gutters">She shared a case study of Italy's embrace of CSA at the 4th Global Science Conference on Climate Smart Agriculture in Johannesburg, South Africa in November 2017. Matteoli said policies need to be compatible with CSA objectives and
                        their ability to boost the development and adoption of CSA technological innovation.</p>
                    <div class="gutters">
                        <blockquote class="pull-quote">Some of the technologies that more farmers need include access to resilient seeds and livestock breeds, timely weather information and weather index insurance</blockquote>
                    </div>
                    <p class="paragraph  |  gutters">Italy was currently at the forefront of promoting research and developing scientifically supported policies related to climate change adaptation and mitigation measures, Matteoli said. At the same time the country was promoting the
                        application of the principles of CSA to locally building resilience throughout the food system.</p>
                    <p class="paragraph  |  gutters">Matteoli said cooperation and knowledge sharing can promote an enabling policy environment at a national and local level in promoting CSA. Italy has promoted conservation agriculture, no tillage practices, climate-smart production
                        systems and knowledge transfer which have collectively been called the Italian Blue Agriculture.</p>
                    <p class="paragraph  |  gutters">For an enabling environment to promote CSA, potential users must be engaged with earlier in the innovation process, ensuring sharing of information and linkage with universities, technical bodies and national institutions. In addition,
                        there is a need for appropriate education programmes and awareness campaigns and the identification of knowledge needs for CSA and priority areas for intervention using consultative and participatory approaches, Matteoli said.</p>
                    <h2 class="heading  |  gutters">CSA adoption down, time to scale up</h2>
                    <p class="paragraph  |  gutters">Researchers say CSA techniques are effective but there is an urgency to quickly spread out the practices, innovations and technologies as climate change threaten agriculture productivity. Some of the technologies that more farmers
                        need include access to resilient seeds and livestock breeds, timely weather information and weather index insurance.<br></p>
                    <p class="paragraph  |  gutters">Scaling up CSA needs bold and inclusive policies which are still lacking several decades after CSA approaches were introduced. Researchers and development actors argue that alternative farming methods have been proven to help farmers
                        cope with weather variability and still harvest crops even in poor rainfall.</p>
                    <p class="paragraph  |  gutters">Another Zimbabwean farmer, Fungisai Masanga (44) saved 150 dollars in labour in the last season after adopting conservation agriculture, another approach of climate-smart agriculture. She intercropped maize with nitrogen-fixing cowpeas,
                        pigeon pea and lablab.</p>
                    <p class="paragraph  |  gutters">"This system has allowed us to have more crops in the same field," says Masanga, a mother of five children. "We have harvested some of the cowpeas which my family has enjoyed and we are soon to harvest maize too, all from the small
                        field where we did not have to plough."</p>
                    <p class="paragraph  |  gutters">Zimbabwe has a national investment framework which has recognized CA as a sustainable agriculture intervention and as a tool in climate change adaptation. Promoters of conservation agriculture laud it for saving soil moisture, enabling
                        farmers to plant crops earlier and produce more yield and income in 2-5 cropping seasons.</p>
                    <p class="paragraph  |  gutters">However, mass adoption of these production changing innovations is not happening across Southern Africa, much to the chagrin of scientists. One reason being the promotion of manual CA systems to farmers, competition for crop residues
                        with livestock, lack of access to appropriate machinery, and increased need for weed control in the first cropping seasons after conversion.</p>
                    <p class="paragraph  |  gutters">Many innovative climate-smart agriculture practices have been developed in Africa with the capacity to increase productivity and build resilience. These are largely unknown and therefore not adopted, the Forum for Agricultural Research
                        in Africa (FARA) found in a 2015 <a href="http://faraafrica.org/wp-content/uploads/2015/10/Barriers-to-scaling-up-out-CSA-in-Africa.pdf" target="_blank">study</a>.</p>
                    <figure class="gutters  |  leader leader-inside--small  |  trailer trailer-inside--small">
                        <img class="image image--stretch" src="https://res.cloudinary.com/cta/image/upload/v1516872223/dplb9ytmrqq6deshzobi.jpg" alt="Dr. Christian Thierfelder from CIMMYT explains the multiple benefits of ‘climate-smart agriculture’, in conservation agriculture plots with a maize-cowpea intercropping system outside Harare, Zimbabwe">
                        <figcaption class="well well--neutral  |  leader-inside--small  |  trailer-inside--small">
                            <p class="caption">Dr. Christian Thierfelder from CIMMYT explains the multiple benefits of ‘climate-smart agriculture’, in conservation agriculture plots with a maize-cowpea intercropping system outside Harare, Zimbabwe</p>
                            <p class="credit">© Busani Bafana/IPS</p>
                        </figcaption>
                    </figure>
                    <h2 class="heading  |  gutters">Agriculture on the global agenda</h2>
                    <p class="paragraph  |  gutters">Several countries who signed the Paris Agreement in 2015 have included agriculture as both an adaptation and mitigation strategy on climate change in their national development plans and climate-related strategies including the Nationally
                        Determined Contributions (INDCs), National Adaptation Plans (NAPs) and Nationally Appropriate Mitigation Actions (NAMAs).</p>
                    <p class="paragraph  |  gutters">The United Nations recently agreed to discuss issues related to agriculture, paving the way for the promotion of CSA approaches such as heat adapted crops and weather index insurance for crops and inputs.</p>
                    <p class="paragraph  |  gutters">This actually means that if one has a policy that supports climate-smart technologies then one needs to tackle a wide range of policy issues, says Bruce Campbell, director of the CGIAR Research Program on Climate Change, Agriculture
                        and Food Security (CCAFS).</p>
                    <p class="paragraph  |  gutters">Campbell cites improving the regulatory framework for index-based insurance, enhancing the ICT regulations so they can foster the spread of mobile phones and connectivity and enhancing the business operating framework so that private
                        sector can function easily.</p>
                    <p class="paragraph  |  gutters">"Scaling up is crucially dependent on government, providing an enabling policy environment for farmers and business," Campbell told IPS. "Research also needs to be changed, to be much more connected to the end-users of stakeholders
                        - research must be directed to the issues that stakeholders see as priorities."</p>
                    <h2 class="heading  |  gutters">Show us the money</h2>
                    <p class="paragraph  |  gutters">Food security is an urgent priority but agriculture has been the poor cousin when it comes to investment both in research and innovations compared to other sectors. Campbell predicts a slow process in agriculture investment.</p>
                    <p class="paragraph  |  gutters">"Agriculture is also to blame - the sector lags behind in terms of its excitement around innovation - when one thinks of climate-smart solutions, the public think of electric cars, wind energy," he said, adding that, "Agriculture needs
                        to up its game on innovation and communicating about the exciting things that are indeed happening in agricultural innovation."</p>
                    <p class="paragraph  |  gutters">Upping agriculture's game needs money, which the sector does not have. Global costs of adaptation in the agricultural sector have been estimated at 7 billion dollars per year to 12.6 billion per year but only. 2.5 percent of public
                        climate finance goes to agriculture. The majority of the needs for finance will have to be derived from private sources, making it imperative to get markets in agriculture working in Africa, currently, a net food importer spending
                        more than 50 billion dollars annually.</p>
                    <p class="paragraph  |  gutters">"Without a conducive policy environment, we cannot achieve much," argues Oluyede Ajayi, Senior Programme Coordinator of the Technical Centre for Agricultural and Rural Cooperation (CTA), an ACP-EU institution based in The Netherlands,
                        which has just launched a 1.5 million Euro-regional project to help more than 150,000 smallholder farmers in Malawi, Zambia and Zimbabwe address the impacts of climate change.</p>
                    <p class="paragraph  |  gutters">Stable and clear CSA policies matter in attracting public investment in public goods such as weather stations, data quality and training, Ajayi says while highlighting the need by researchers and development workers to effectively
                        engage in CSA policies by understanding the political process, and identify policy champions and shapers that could help in policy engagement.</p>
                    <p class="paragraph  |  gutters">"We need to create an enabling policy environment with government and private sectors cooperating in order to upscale CSA," said Ajayi. "We have to make sure that within policies, we emphasize empowering women and youths."</p>
                    <p class="paragraph  |  gutters">The challenge to science and policymakers is how to bring the science/policy nexus and to directly bear on accelerating and expanding the evolution, adaptation and uptake of climate-smart farming practices, Ibrahim Mayaki, CEO of the
                        New Partnership for Africa's Development (NEPAD), who gave a keynote address at the 4th Global Science Conference on Climate Smart Agriculture in South Africa last November.</p>
                    <p class="paragraph  |  gutters">According to the Malabo Montpellier Panel - a group of international agriculture experts guiding policy choices on food and nutritional security in Africa - examples and innovations in climate-smart agriculture have multiple benefits.
                        For example, agroforestry helps to diversify the produce of farms, improves soil quality and enhances resilience. Solar irrigation enables smallholder farmers to increase their yields without contributing to emissions while the
                        use of stress tolerant seed varieties counter climate change, are more nutritious and are often more pest and disease resistant.</p>
                    <h2 class="heading  |  gutters">Climate Smart Agriculture not smart?</h2>
                    <p class="paragraph  |  gutters">The concept of 'Climate Smart Agriculture' was originally developed by the FAO and the World Bank, claiming that "triple wins" in agriculture could be achieved in mitigation (reducing greenhouse gas emissions), adaptation (supporting
                        crops to grow in changing climate conditions), and increasing crop yields. The FAO views CSA as an approach for developing agricultural strategies for food security under climate change.</p>
                    <p class="paragraph  |  gutters">But the global civil society organization, ActionAid, says there is confusion on the meaning and benefits of climate-smart agriculture.</p>
                    <p class="paragraph  |  gutters">A number of industrialised countries (the US in particular), along with a number of agribusiness corporations, are now the most enthusiastic promoters of the concept, ActionAid says.</p>
                    <p class="paragraph  |  gutters">"But increasingly civil society and farmer organisations express concerns that the term can be used to green-wash industrial agricultural practices that will harm future food production, said ActionAid in a briefing.</p>
                    <p class="paragraph  |  gutters">ActionAid contends that some governments and NGOs also worry that pressure to adopt Climate Smart Agriculture will translate into obligations for developing countries' food systems to take on an unfair mitigation burden. They point
                        out that their agricultural systems have contributed the least to the problem, but that mitigation obligations could limit their ability to effectively adapt to the climate challenges ahead.</p>
                    <p class="paragraph  |  gutters">"Ultimately, there are no means to ensure that 'Climate Smart Agriculture' is actually smart for the climate, for agriculture, or for farmers," says ActionAid.</p>
                    <p class="paragraph  |  gutters">While there is a debate on the benefits and constraints of climate-smart agriculture technologies, its techniques such as conservation agriculture have improved the productivity for farmers like Zvomarima.</p>
                    <p class="paragraph  |  gutters">"CA has produced good results for me and as I apply its methods more, I am convinced my crop yields can only get better."</p>
                </div>
                <div class="gutters  |  trailer  |  leader">
                    <ul class="reset  |  tag-list  |  list--inline">
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_7252">South Africa</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_1666">climate change</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_7265">Southern Africa</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_117">Adaptation</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_207">agroforestry</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_3902">insurance</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_1361789093890">climate-smart agriculture</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_12332">maize</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_3820">Income</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_1665">climate</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_3781">World Bank</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_10176">Crop yield</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_1938">Cowpeas</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_1374567058134">climate change adaptation</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_7208">Soil water content</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_8345">Weed control</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_2901">finance</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_4397">Livestock</a>
                        </li>
                    </ul>
                </div>
                <div class="well well--slim-fit  |  gutters-outside  |  leader  |  trailer  |  is-gt-small-desktop">
                    <ul class="share-list reset list--float">
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=Policy-Support-Gap-for-&quot;Climate-Smart&quot;-Agriculture&amp;redirect_uri=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280&amp;link=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280" target="_blank">
                                <span data-icon="facebook" class="icon icon--facebook">
                                    <span>
                                        <span class="is-narrative">Share on Facebook</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280" target="_blank">
                                <span data-icon="twitter" class="icon icon--twitter">
                                    <span>
                                        <span class="is-narrative">Share on Twitter</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--print" title="Print" href="javascript:print();">
                                <span data-icon="print" class="icon icon--print">
                                    <span>
                                        <span class="is-narrative">Print</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--email" title="Send link via E-mail" href="mailto:?subject=Policy-Support-Gap-for-&quot;Climate-Smart&quot;-Agriculture&amp;body=">
                                <span data-icon="email" class="icon icon--envelope">
                                    <span>
                                        <span class="is-narrative">Send link via E-mail</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
                <aside class="gutters-outside  |  divider divider--top  |  leader--hero leader-inside--small">
                    <h2 class="title title--sub-section  |  leader--small  |  trailer--small">Disclaimer</h2>
                    <p class="body--quiet">This document has been produced with the financial assistance of the European Union. The contents of this document are the sole responsibility of CTA and can under no circumstances be regarded as reflecting the position of the European
                        Union.
                    </p>
                </aside>
            </div>
            <div class="layout__cell layout__cell--aside layout__cell--aside--l  |  wings">
                <div class="well well--slim-fit  |  gutters-outside  |  leader  |  trailer  |  is-lt-small-desktop">
                    <ul class="share-list reset list--float">
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=Policy-Support-Gap-for-&quot;Climate-Smart&quot;-Agriculture&amp;redirect_uri=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280&amp;link=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280" target="_blank">
                                <span data-icon="facebook" class="icon icon--facebook">
                                    <span>
                                        <span class="is-narrative">Share on Facebook</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280" target="_blank">
                                <span data-icon="twitter" class="icon icon--twitter">
                                    <span>
                                        <span class="is-narrative">Share on Twitter</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--print" title="Print" href="javascript:print();">
                                <span data-icon="print" class="icon icon--print">
                                    <span>
                                        <span class="is-narrative">Print</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--email" title="Send link via E-mail" href="mailto:?subject=Policy-Support-Gap-for-&quot;Climate-Smart&quot;-Agriculture&amp;body=">
                                <span data-icon="email" class="icon icon--envelope">
                                    <span>
                                        <span class="is-narrative">Send link via E-mail</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="layout__cell layout__cell--aside layout__cell--aside--l  |  wings">
        <div class="mini-map  |  well well--neutral well--slim-fit  |  gutters-outside  |  trailer--hero">
            <div class="mini-map__map">
                <div id="map" style="height: 250px; position: relative; overflow: hidden;">
                    <div style="height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; background-color: rgb(229, 227, 223);">
                        <div class="gm-style" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px;">
                            <div tabindex="0" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; cursor: url(&quot;https://maps.gstatic.com/mapfiles/openhand_8_8.cur&quot;) 8 8, default;">
                                <div style="z-index: 1; position: absolute; top: 0px; left: 0px; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);">
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 100; width: 100%;">
                                        <div style="position: absolute; left: 0px; top: 0px; z-index: 0;">
                                            <div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;">
                                                <div style="width: 256px; height: 256px; position: absolute; left: -116px; top: -87px;"></div>
                                                <div style="width: 256px; height: 256px; position: absolute; left: -116px; top: 169px;"></div>
                                                <div style="width: 256px; height: 256px; position: absolute; left: 140px; top: -87px;"></div>
                                                <div style="width: 256px; height: 256px; position: absolute; left: 140px; top: 169px;"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 101; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 102; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 103; width: 100%;">
                                        <div style="position: absolute; left: 0px; top: 0px; z-index: -1;">
                                            <div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;">
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: -116px; top: -87px;"><canvas draggable="false" height="256" width="256" style="user-select: none; position: absolute; left: 0px; top: 0px; height: 256px; width: 256px;"></canvas></div>
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: -116px; top: 169px;"></div>
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: 140px; top: -87px;"><canvas draggable="false" height="256" width="256" style="user-select: none; position: absolute; left: 0px; top: 0px; height: 256px; width: 256px;"></canvas></div>
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: 140px; top: 169px;"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div style="position: absolute; z-index: 0; left: 0px; top: 0px;">
                                        <div style="overflow: hidden; width: 272px; height: 250px;"><img src="https://maps.googleapis.com/maps/api/js/StaticMapService.GetMapImage?1m2&amp;1i9332&amp;2i9303&amp;2e1&amp;3u6&amp;4m2&amp;1u272&amp;2u250&amp;5m5&amp;1e0&amp;5sen-US&amp;6sus&amp;10b1&amp;12b1&amp;token=9474"
                                                style="width: 272px; height: 250px;"></div>
                                    </div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 0;">
                                        <div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;">
                                            <div style="position: absolute; left: -116px; top: 169px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i36!3i37!4i256!2m3!1e0!2sm!3i410108589!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=45414" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                            <div style="position: absolute; left: -116px; top: -87px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i36!3i36!4i256!2m3!1e0!2sm!3i410108589!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=9393" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                            <div style="position: absolute; left: 140px; top: 169px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i37!3i37!4i256!2m3!1e0!2sm!3i410108589!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=102601"
                                                    style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                            <div style="position: absolute; left: 140px; top: -87px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i37!3i36!4i256!2m3!1e0!2sm!3i410108589!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=66580" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                        </div>
                                    </div>
                                </div>
                                <div class="gm-style-pbc" style="z-index: 2; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px; opacity: 0;">
                                    <p class="gm-style-pbt"></p>
                                </div>
                                <div style="z-index: 3; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px;">
                                    <div style="z-index: 1; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px;"></div>
                                </div>
                                <div style="z-index: 4; position: absolute; top: 0px; left: 0px; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);">
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 104; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 105; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 106; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 107; width: 100%;"></div>
                                </div>
                            </div>
                            <div style="margin-left: 5px; margin-right: 5px; z-index: 1000000; position: absolute; left: 0px; bottom: 0px;">
                                <a target="_blank" href="https://maps.google.com/maps?ll=-26.20227,28.04363&amp;z=6&amp;t=m&amp;hl=en-US&amp;gl=US&amp;mapclient=apiv3" title="Click to see this area on Google Maps" style="position: static; overflow: visible; float: none; display: inline;">
                                    <div style="width: 66px; height: 26px; cursor: pointer;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/google4.png" draggable="false" style="position: absolute; left: 0px; top: 0px; width: 66px; height: 26px; user-select: none; border: 0px; padding: 0px; margin: 0px;"></div>
                                </a>
                            </div>
                            <div style="background-color: white; padding: 15px 21px; border: 1px solid rgb(171, 171, 171); font-family: Roboto, Arial, sans-serif; color: rgb(34, 34, 34); box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 16px; z-index: 10000002; display: none; width: 218px; height: 148px; position: absolute; left: 5px; top: 35px;">
                                <div style="padding: 0px 0px 10px; font-size: 16px;">Map Data</div>
                                <div style="font-size: 13px;">Map data ©2018 AfriGIS (Pty) Ltd, Google</div>
                                <div style="width: 13px; height: 13px; overflow: hidden; position: absolute; opacity: 0.7; right: 12px; top: 12px; z-index: 10000; cursor: pointer;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/mapcnt6.png" draggable="false" style="position: absolute; left: -2px; top: -336px; width: 59px; height: 492px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                            </div>
                            <div class="gmnoprint" style="z-index: 1000001; position: absolute; right: 71px; bottom: 0px; width: 197px;">
                                <div draggable="false" class="gm-style-cc" style="user-select: none; height: 14px; line-height: 14px;">
                                    <div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;">
                                        <div style="width: 1px;"></div>
                                        <div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div>
                                    </div>
                                    <div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a style="text-decoration: none; cursor: pointer; display: none;">Map Data</a><span>Map data ©2018 AfriGIS (Pty) Ltd, Google</span></div>
                                </div>
                            </div>
                            <div class="gmnoscreen" style="position: absolute; right: 0px; bottom: 0px;">
                                <div style="font-family: Roboto, Arial, sans-serif; font-size: 11px; color: rgb(68, 68, 68); direction: ltr; text-align: right; background-color: rgb(245, 245, 245);">Map data ©2018 AfriGIS (Pty) Ltd, Google</div>
                            </div>
                            <div class="gmnoprint gm-style-cc" draggable="false" style="z-index: 1000001; user-select: none; height: 14px; line-height: 14px; position: absolute; right: 0px; bottom: 0px;">
                                <div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;">
                                    <div style="width: 1px;"></div>
                                    <div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div>
                                </div>
                                <div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a href="https://www.google.com/intl/en-US_US/help/terms_maps.html" target="_blank" style="text-decoration: none; cursor: pointer; color: rgb(68, 68, 68);">Terms of Use</a></div>
                            </div><button draggable="false" title="Toggle fullscreen view" aria-label="Toggle fullscreen view" type="button" style="background: none; border: 0px; margin: 10px 14px; padding: 0px; position: absolute; cursor: pointer; user-select: none; width: 25px; height: 25px; overflow: hidden; top: 0px; right: 0px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/sv9.png" draggable="false" class="gm-fullscreen-control" style="position: absolute; left: -52px; top: -86px; width: 164px; height: 175px; user-select: none; border: 0px; padding: 0px; margin: 0px;"></button>
                            <div draggable="false" class="gm-style-cc" style="user-select: none; height: 14px; line-height: 14px; display: none; position: absolute; right: 0px; bottom: 0px;">
                                <div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;">
                                    <div style="width: 1px;"></div>
                                    <div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div>
                                </div>
                                <div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a target="_new" title="Report errors in the road map or imagery to Google" href="https://www.google.com/maps/@-26.20227,28.04363,6z/data=!10m1!1e1!12b1?source=apiv3&amp;rapsrc=apiv3" style="font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); text-decoration: none; position: relative;">Report a map error</a></div>
                            </div>
                            <div class="gmnoprint gm-bundled-control gm-bundled-control-on-bottom" draggable="false" controlwidth="28" controlheight="93" style="margin: 10px; user-select: none; position: absolute; bottom: 107px; right: 28px;">
                                <div class="gmnoprint" controlwidth="28" controlheight="55" style="position: absolute; left: 0px; top: 38px;">
                                    <div draggable="false" style="user-select: none; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; cursor: pointer; background-color: rgb(255, 255, 255); width: 28px; height: 55px;"><button draggable="false" title="Zoom in" aria-label="Zoom in" type="button" style="background: none; display: block; border: 0px; margin: 0px; padding: 0px; position: relative; cursor: pointer; user-select: none; width: 28px; height: 27px; top: 0px; left: 0px;"><div style="overflow: hidden; position: absolute; width: 15px; height: 15px; left: 7px; top: 6px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl.png" draggable="false" style="position: absolute; left: 0px; top: 0px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 120px; height: 54px;"></div></button>
                                        <div style="position: relative; overflow: hidden; width: 67%; height: 1px; left: 16%; background-color: rgb(230, 230, 230); top: 0px;"></div><button draggable="false" title="Zoom out" aria-label="Zoom out" type="button" style="background: none; display: block; border: 0px; margin: 0px; padding: 0px; position: relative; cursor: pointer; user-select: none; width: 28px; height: 27px; top: 0px; left: 0px;"><div style="overflow: hidden; position: absolute; width: 15px; height: 15px; left: 7px; top: 6px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl.png" draggable="false" style="position: absolute; left: 0px; top: -15px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 120px; height: 54px;"></div></button></div>
                                </div>
                                <div class="gm-svpc" controlwidth="28" controlheight="28" style="background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; width: 28px; height: 28px; cursor: url(&quot;https://maps.gstatic.com/mapfiles/openhand_8_8.cur&quot;) 8 8, default; position: absolute; left: 0px; top: 0px;">
                                    <div style="position: absolute; left: 1px; top: 1px;"></div>
                                    <div style="position: absolute; left: 1px; top: 1px;">
                                        <div aria-label="Street View Pegman Control" style="width: 26px; height: 26px; overflow: hidden; position: absolute; left: 0px; top: 0px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/cb_scout5.png" draggable="false" style="position: absolute; left: -147px; top: -26px; width: 215px; height: 835px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                        <div aria-label="Pegman is on top of the Map" style="width: 26px; height: 26px; overflow: hidden; position: absolute; left: 0px; top: 0px; visibility: hidden;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/cb_scout5.png" draggable="false" style="position: absolute; left: -147px; top: -52px; width: 215px; height: 835px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                        <div aria-label="Street View Pegman Control" style="width: 26px; height: 26px; overflow: hidden; position: absolute; left: 0px; top: 0px; visibility: hidden;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/cb_scout5.png" draggable="false" style="position: absolute; left: -147px; top: -78px; width: 215px; height: 835px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                    </div>
                                </div>
                                <div class="gmnoprint" controlwidth="28" controlheight="0" style="display: none; position: absolute;">
                                    <div title="Rotate map 90 degrees" style="width: 28px; height: 28px; overflow: hidden; position: absolute; background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; cursor: pointer; display: none;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl4.png" draggable="false" style="position: absolute; left: -141px; top: 6px; width: 170px; height: 54px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                    <div class="gm-tilt" style="width: 28px; height: 28px; overflow: hidden; position: absolute; background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; top: 0px; cursor: pointer;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl4.png" draggable="false" style="position: absolute; left: -141px; top: -13px; width: 170px; height: 54px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                </div>
                            </div>
                            <div class="gmnoprint" style="margin: 10px; z-index: 0; position: absolute; cursor: pointer; left: 0px; top: 0px;">
                                <div class="gm-style-mtc" style="float: left; position: relative;">
                                    <div role="button" tabindex="0" title="Show street map" aria-label="Show street map" aria-pressed="true" draggable="false" style="direction: ltr; overflow: hidden; text-align: center; position: relative; color: rgb(0, 0, 0); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 8px; border-bottom-left-radius: 2px; border-top-left-radius: 2px; -webkit-background-clip: padding-box; background-clip: padding-box; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; min-width: 22px; font-weight: 500;">Map</div>
                                    <div style="background-color: white; z-index: -1; padding: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; position: absolute; left: 0px; top: 29px; text-align: left; display: none;">
                                        <div draggable="false" title="Show street map with terrain" style="color: rgb(0, 0, 0); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 6px 8px 6px 6px; direction: ltr; text-align: left; white-space: nowrap;"><span role="checkbox" style="box-sizing: border-box; position: relative; line-height: 0; font-size: 0px; margin: 0px 5px 0px 0px; display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid rgb(198, 198, 198); border-radius: 1px; width: 13px; height: 13px; vertical-align: middle;"><div style="position: absolute; left: 1px; top: -2px; width: 13px; height: 11px; overflow: hidden; display: none;"><img alt="" src="https://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -52px; top: -44px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 68px; height: 67px;"></div></span>
                                            <label style="vertical-align: middle; cursor: pointer;">Terrain</label>
                                        </div>
                                    </div>
                                </div>
                                <div class="gm-style-mtc" style="float: left; position: relative;">
                                    <div role="button" tabindex="0" title="Show satellite imagery" aria-label="Show satellite imagery" aria-pressed="false" draggable="false" style="direction: ltr; overflow: hidden; text-align: center; position: relative; color: rgb(86, 86, 86); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 8px; border-bottom-right-radius: 2px; border-top-right-radius: 2px; -webkit-background-clip: padding-box; background-clip: padding-box; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; min-width: 40px; border-left: 0px;">Satellite</div>
                                    <div style="background-color: white; z-index: -1; padding: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; position: absolute; right: 0px; top: 29px; text-align: left; display: none;">
                                        <div draggable="false" title="Show imagery with street names" style="color: rgb(0, 0, 0); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 6px 8px 6px 6px; direction: ltr; text-align: left; white-space: nowrap;"><span role="checkbox" style="box-sizing: border-box; position: relative; line-height: 0; font-size: 0px; margin: 0px 5px 0px 0px; display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid rgb(198, 198, 198); border-radius: 1px; width: 13px; height: 13px; vertical-align: middle;"><div style="position: absolute; left: 1px; top: -2px; width: 13px; height: 11px; overflow: hidden;"><img alt="" src="https://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -52px; top: -44px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 68px; height: 67px;"></div></span>
                                            <label style="vertical-align: middle; cursor: pointer;">Labels</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <script type="text/javascript">
                    jQuery(function($) {
                        $('#map').gmaps({
                            zoom: 6,
                            location: {
                                latitude: -26.20227,
                                longitude: 28.04363
                            },
                            marker: {
                                icon: '/assets/images/icons/gmaps_pin.png'
                            }
                        });
                    });
                </script>
            </div>
            <div class="mini-map__asset  |  divider divider--inverse divider--top  |  gutters  |  trailer-inside--small  |  leader-inside--small">
                <div class="media media--middle  |  location">
                    <span class="location__marker  |  media__figure">
                        <span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">Location:</span></span>
                    </span>
                    <div class="location__body  |  media__content">
                        <a class="is-heir" href="/en/search?location=993800">Johannesburg</a>
                    </div>
                </div>
            </div>
        </div>
        <aside class="trailer--hero">
            <h2 class="title  |  trailer--normal  |  gutters">About the author</h2>
            <div class="media  |  leader--normal  |  trailer--normal">
                <div class="media__figure  |  gutters">
                    <img src="https://res.cloudinary.com/cta/image/upload/v1498285373/lkvtaxcyqt2hdmawpgcf.png" width="50" height="50" alt=" Busani Bafana">
                </div>
                <div class="media__body  |  gutter--right  |  body--whisper">
                    <p class="meta--bold  |  trailer--tiny">Busani Bafana</p>
                    <p class="">Busani Bafana is a journalist, based in Bulawayo, Zimbabwe, who covers climate change and agriculture issues.</p>
                </div>
            </div>
        </aside>
        <div class="gutters  |  trailer">
            <p class="meta">Link to the <a href="http://www.ipsnews.net/2018/01/policy-support-gap-climate-smart-agriculture/?utm_source=rss&amp;utm_medium=rss&amp;utm_campaign=policy-support-gap-climate-smart-agriculture" target="_blank">original article</a></p>
        </div>
        <aside class="trailer--hero">
            <h1 class="title title--apropos  |  trailer--small  |  gutters">About IPS EUROPA</h1>
            <p class="body--whisper  |  gutters">
                The Inter Press Service (IPS) is an international communication institution with a global news agency at its core. Since its inception in 1964, IPS has strived to act as an information bridge between the local and the global, and between the expert and
                the layperson. The IPS International News Agency produces a daily news service with reporting originating in English, French and Spanish and is available both in print and online. Italy
            </p>
        </aside>
    </div>
</div>

Styleguide 5.3.5
*/
/* 5.5 Channels */
/*
Channels

Styleguide 5.5
*/
/*
Channels, with articles

markup:
<section class="grid grid--teletubbies">
    <section class="grid__cell  |  gutters  |  trailer trailer-inside">
        <h2 class="title     trailer teleport  |  media  |  title">
            <a class="teleport__label  |  media__content media__stretcher  |  gutter  |  is-heir" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">Women in agriculture</a>
            <a class="teleport__trigger  |  media__image  |  icon icon--thin-arrow" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">
                <span class="is-narrative">
                    View all in Women in agriculture
                </span>
            </a>
        </h2>
        <div class="post">
            <div class="post__media">
                <a class="anchor anchor--shy" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-25T00:00:00+00:00">25 January 2018</time>
                <span class="meta">in <a href="/en/spore">Spore</a></span>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                        Policy Support Gap for "Climate-Smart" Agriculture
                    </a>
                </h3>
                <p class="post__author  |  author">by Busani Bafana</p>
                <p class="is-gt-small-desktop  |  post__intro">Conditioned that ploughing is the sure way to produce crops, Zimbabwean farmer Handrixious Zvomarima surprised himself by trying a different method. He planted cowpea seeds directly without tilling the land. It worked. The new method tripled Zvomarima's cowpea yield when many farmers did not harvest a crop following the El Nino-induced drought which affected more than 40 million people in Southern Africa.</p>
                <a class="read-more" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">Read More</a>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-24T18:26:19+00:00">24 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/climate-change-and-conflict-in-chad-using-p3dm-to-secure-peace-sid073658965-487b-4a81-99ff-a86b349e26ef">
                        Climate Change and Conflict in Chad - Using P3DM to secure peace
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-21T06:03:37+00:00">21 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/uganda-s-rural-women-find-beans-to-beat-climate-sid03b3eccf2-7787-4e08-aa9f-ee8354e0f9d0">
                        Uganda's rural women find beans to beat climate
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-18T09:12:44+00:00">18 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/project-manager-geopuu-sid075ccd95a-6b04-4c62-9ecb-81487435bebc">
                        Project Manager, geoPuu
                    </a>
                </h3>
            </div>
        </div>
    </section>
    <section class="grid__cell  |  gutters  |  trailer trailer-inside">
        <h2 class="title     trailer teleport  |  media  |  title">
            <a class="teleport__label  |  media__content media__stretcher  |  gutter  |  is-heir" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">Women in agriculture</a>
            <a class="teleport__trigger  |  media__image  |  icon icon--thin-arrow" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">
                <span class="is-narrative">
                    View all in Women in agriculture
                </span>
            </a>
        </h2>
        <div class="post">
            <div class="post__media">
                <a class="anchor anchor--shy" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-25T00:00:00+00:00">25 January 2018</time>
                <span class="meta">in <a href="/en/spore">Spore</a></span>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                        Policy Support Gap for "Climate-Smart" Agriculture
                    </a>
                </h3>
                <p class="post__author  |  author">by Busani Bafana</p>
                <p class="is-gt-small-desktop  |  post__intro">Conditioned that ploughing is the sure way to produce crops, Zimbabwean farmer Handrixious Zvomarima surprised himself by trying a different method. He planted cowpea seeds directly without tilling the land. It worked. The new method tripled Zvomarima's cowpea yield when many farmers did not harvest a crop following the El Nino-induced drought which affected more than 40 million people in Southern Africa.</p>
                <a class="read-more" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">Read More</a>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-24T18:26:19+00:00">24 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/climate-change-and-conflict-in-chad-using-p3dm-to-secure-peace-sid073658965-487b-4a81-99ff-a86b349e26ef">
                        Climate Change and Conflict in Chad - Using P3DM to secure peace
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-21T06:03:37+00:00">21 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/uganda-s-rural-women-find-beans-to-beat-climate-sid03b3eccf2-7787-4e08-aa9f-ee8354e0f9d0">
                        Uganda's rural women find beans to beat climate
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-18T09:12:44+00:00">18 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/project-manager-geopuu-sid075ccd95a-6b04-4c62-9ecb-81487435bebc">
                        Project Manager, geoPuu
                    </a>
                </h3>
            </div>
        </div>
    </section>
    <section class="grid__cell  |  gutters  |  trailer trailer-inside">
        <h2 class="title     trailer teleport  |  media  |  title">
            <a class="teleport__label  |  media__content media__stretcher  |  gutter  |  is-heir" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">Women in agriculture</a>
            <a class="teleport__trigger  |  media__image  |  icon icon--thin-arrow" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">
                <span class="is-narrative">
                    View all in Women in agriculture
                </span>
            </a>
        </h2>
        <div class="post">
            <div class="post__media">
                <a class="anchor anchor--shy" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-25T00:00:00+00:00">25 January 2018</time>
                <span class="meta">in <a href="/en/spore">Spore</a></span>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                        Policy Support Gap for "Climate-Smart" Agriculture
                    </a>
                </h3>
                <p class="post__author  |  author">by Busani Bafana</p>
                <p class="is-gt-small-desktop  |  post__intro">Conditioned that ploughing is the sure way to produce crops, Zimbabwean farmer Handrixious Zvomarima surprised himself by trying a different method. He planted cowpea seeds directly without tilling the land. It worked. The new method tripled Zvomarima's cowpea yield when many farmers did not harvest a crop following the El Nino-induced drought which affected more than 40 million people in Southern Africa.</p>
                <a class="read-more" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">Read More</a>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-24T18:26:19+00:00">24 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/climate-change-and-conflict-in-chad-using-p3dm-to-secure-peace-sid073658965-487b-4a81-99ff-a86b349e26ef">
                        Climate Change and Conflict in Chad - Using P3DM to secure peace
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-21T06:03:37+00:00">21 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/uganda-s-rural-women-find-beans-to-beat-climate-sid03b3eccf2-7787-4e08-aa9f-ee8354e0f9d0">
                        Uganda's rural women find beans to beat climate
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-18T09:12:44+00:00">18 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/project-manager-geopuu-sid075ccd95a-6b04-4c62-9ecb-81487435bebc">
                        Project Manager, geoPuu
                    </a>
                </h3>
            </div>
        </div>
    </section>
    <section class="grid__cell  |  gutters  |  trailer trailer-inside">
        <h2 class="title     trailer teleport  |  media  |  title">
            <a class="teleport__label  |  media__content media__stretcher  |  gutter  |  is-heir" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">Women in agriculture</a>
            <a class="teleport__trigger  |  media__image  |  icon icon--thin-arrow" href="/en/channel/women-in-agriculture-sid0c10e4148-971b-4f92-9ced-0af64ceaa268">
                <span class="is-narrative">
                    View all in Women in agriculture
                </span>
            </a>
        </h2>
        <div class="post">
            <div class="post__media">
                <a class="anchor anchor--shy" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/vo9tyysicxip70qztttz 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-25T00:00:00+00:00">25 January 2018</time>
                <span class="meta">in <a href="/en/spore">Spore</a></span>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">
                        Policy Support Gap for "Climate-Smart" Agriculture
                    </a>
                </h3>
                <p class="post__author  |  author">by Busani Bafana</p>
                <p class="is-gt-small-desktop  |  post__intro">Conditioned that ploughing is the sure way to produce crops, Zimbabwean farmer Handrixious Zvomarima surprised himself by trying a different method. He planted cowpea seeds directly without tilling the land. It worked. The new method tripled Zvomarima's cowpea yield when many farmers did not harvest a crop following the El Nino-induced drought which affected more than 40 million people in Southern Africa.</p>
                <a class="read-more" href="/en/spore/article/policy-support-gap-for-climate-smart-agriculture-sid09297d9e8-8220-4ddf-94d6-3a2b4f6b4280">Read More</a>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-24T18:26:19+00:00">24 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/climate-change-and-conflict-in-chad-using-p3dm-to-secure-peace-sid073658965-487b-4a81-99ff-a86b349e26ef">
                        Climate Change and Conflict in Chad - Using P3DM to secure peace
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-21T06:03:37+00:00">21 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/uganda-s-rural-women-find-beans-to-beat-climate-sid03b3eccf2-7787-4e08-aa9f-ee8354e0f9d0">
                        Uganda's rural women find beans to beat climate
                    </a>
                </h3>
            </div>
        </div>
        <hr class="reset  |  divider divider--top  |  leader-inside--tiny leader--small  |  trailer-inside--tiny trailer--small">
        <div class="post">
            <div class="post__content  |  leader-inside">
                <time class="meta" datetime="2018-01-18T09:12:44+00:00">18 January 2018</time>
                <h3 class="title  |  anchor--reset">
                    <a class="anchor anchor--shy  |  is-heir" href="/en/article/project-manager-geopuu-sid075ccd95a-6b04-4c62-9ecb-81487435bebc">
                        Project Manager, geoPuu
                    </a>
                </h3>
            </div>
        </div>
    </section>
</section>

Styleguide 5.5.1
*/
/*
Channels, with events

markup:
<div class="wing--right ">
    <h2 class="title title--section  |  trailer">Upcoming events</h2>
    <ul class="reset  |  trailer">
        <li class="  |  leader--normal  |  trailer--normal">
            <a class="anchor--reset anchor--shy  |  is-heir  |  stack" href="/en/event/-sid0c829bb0b-38e9-4880-b56e-0e7359e04237">
                <div class="stack__unit stack__pin">
                    <div class="gutter-outside">
                        <span class="date">
                            <span class="date__head">Feb</span>
                            <span class="date__body"> 4</span>
                        </span>
                    </div>
                </div>
                <div class="stack__unit">
                    <h2 class="title title">Capitalization of Experiences for Greater Impact in Rural Development - Senegal</h2>
                    <time class="meta" datetime="2018-02-04T00:00:00+00:00"> 4 Feb 2018</time>
                    <time class="meta" datetime="2018-02-09T23:59:59+00:00"> –  9 Feb 2018</time>
                    <div class="body--whisper">Dakar, Senegal</div>
                </div>
            </a>
        </li>
        <li class="  |  leader--normal  |  trailer--normal">
            <a class="anchor--reset anchor--shy  |  is-heir  |  stack" href="/en/event/-sid02972c8f9-dad6-49be-8db8-bb45ec32e692">
                <div class="stack__unit stack__pin">
                    <div class="gutter-outside">
                        <span class="date">
                            <span class="date__head">Feb</span>
                            <span class="date__body"> 5</span>
                        </span>
                    </div>
                </div>
                <div class="stack__unit">
                    <h2 class="title title">Capitalization of Experiences for Greater Impact in Rural Development - Pacific region</h2>
                    <time class="meta" datetime="2018-02-05T00:00:00+12:00"> 5 Feb 2018</time>
                    <time class="meta" datetime="2018-02-09T23:59:59+12:00"> –  9 Feb 2018</time>
                    <div class="body--whisper">Suva, FJ</div>
                </div>
            </a>
        </li>
        <li class="  |  leader--normal  |  trailer--normal">
            <a class="anchor--reset anchor--shy  |  is-heir  |  stack" href="/en/event/-sid0550865a5-129d-4602-8954-017dd2fc10f1">
                <div class="stack__unit stack__pin">
                    <div class="gutter-outside">
                        <span class="date">
                            <span class="date__head">Feb</span>
                            <span class="date__body">19</span>
                        </span>
                    </div>
                </div>
                <div class="stack__unit">
                    <h2 class="title title">Agribusiness enterprise development in Uganda</h2>
                    <time class="meta" datetime="2018-02-19T00:00:00+03:00">19 Feb 2018</time>
                    <time class="meta" datetime="2018-02-23T23:59:59+03:00"> – 23 Feb 2018</time>
                    <div class="body--whisper">Ishaka, Uganda</div>
                </div>
            </a>
        </li>
        <li class="  |  leader--normal  |  trailer--normal">
            <a class="anchor--reset anchor--shy  |  is-heir  |  stack" href="/en/event/-sid0d4cf11eb-e98c-4f8d-862f-c996f6026cda">
                <div class="stack__unit stack__pin">
                    <div class="gutter-outside">
                        <span class="date">
                            <span class="date__head">Feb</span>
                            <span class="date__body">26</span>
                        </span>
                    </div>
                </div>
                <div class="stack__unit">
                    <h2 class="title title">Cooperative Leadership Training</h2>
                    <time class="meta" datetime="2018-02-26T00:00:00+02:00">26 Feb 2018</time>
                    <time class="meta" datetime="2018-03-02T23:59:59+02:00"> –  2 Mar 2018</time>
                    <div class="body--whisper">Kigali, Rwanda</div>
                </div>
            </a>
        </li>
    </ul>
</div>

Styleguide 5.5.2
*/
/* 5.6 triptych */
/*
Triptych - Featured events

markup:
<section class="is-clear">
<div class="triptych" style="background-image: url(http://images.unsplash.com/photo-1428542244207-0aaec316e609?dpr=1&fit=crop&w=1000&h=762&q=80)">
  <sg-insert>4.11-1</sg-insert>
</div>
<div class="triptych" style="background-image: url(http://images.unsplash.com/photo-1428542244207-0aaec316e609?dpr=1&fit=crop&w=1000&h=762&q=80)">
  <sg-insert>4.11-1</sg-insert>
</div>
<div class="triptych" style="background-image: url(http://images.unsplash.com/photo-1428542244207-0aaec316e609?dpr=1&fit=crop&w=1000&h=762&q=80)">
  <sg-insert>4.11-1</sg-insert>
</div>
</section>

Styleguide 5.6
*/
/*
 * 1. Align top of date with title
 */
.triptych {
  position: relative;
  height: 390px;
  background: no-repeat center;
  -moz-background-size: cover;
       background-size: cover; }
  .triptych .teaser {
    position: absolute;
    left: 0;
    right: 15px;
    bottom: 30px;
    margin-top: 198px;
    background: #fff;
    background: rgba(255, 255, 255, 0.8); }
  .triptych__date {
    background: #67ab43;
    padding-top: 6px;
    /* 1 */ }
  .triptych .title {
    /* regular title*/
    font-size: 1em;
    line-height: 1.3125;
    padding-top: 9px;
    margin-bottom: 6px; }
  .no-flexbox .triptych .pin-box__cell {
    display: inline-block;
    width: 50%;
    float: left; }
  @media only screen and (min-width: 48em) {
    .triptych {
      float: left;
      width: 50%;
      height: 360px; }
      .triptych .teaser {
        min-height: 165px; }
        .triptych .teaser:first-child {
          min-height: 0; }
      .triptych:first-child {
        width: 100%; }
        .triptych:first-child .title {
          /* medium title*/
          font-size: 1.125em;
          line-height: 1.33333;
          padding-top: 18px; }
      .triptych:first-child .triptych.teaser {
        width: 75%;
        bottom: 96px; }
      .triptych .date {
        padding-top: 9px;
        /* 1 */ } }
  @media only screen and (min-width: 64em) {
    .triptych {
      width: 44.44444%;
      height: 360px; }
      .triptych .teaser {
        min-height: 0;
        width: 87.5%; }
      .triptych .title {
        /* medium title*/
        font-size: 1.125em;
        line-height: 1.33333;
        padding-top: 18px; }
      .triptych:first-child {
        width: 55.55556%;
        height: 762px;
        height: 720px; }
        .triptych:first-child .title {
          /* large title*/
          font-size: 1.5em;
          line-height: 1.125; }
      .triptych:first-child .triptych.teaser {
        width: 80%; }
      .triptych .pin-box__cell {
        padding-top: 15px;
        padding-bottom: 15px; }
      .triptych:first-child .pin-box__cell {
        padding-top: 30px;
        padding-bottom: 30px; } }
  @media only screen and (min-width: 90em) {
    .triptych .teaser {
      margin: 0;
      width: 75%; }
    .triptych .meta {
      /* regular meta */
      font-size: 0.75em;
      line-height: 1.25; }
    .triptych .location {
      /* regular meta */
      font-size: 0.875em;
      line-height: 1.07143; }
    .triptych .title {
      /* large title*/
      font-size: 1.5em;
      line-height: 1.125;
      padding-top: 18px; }
    .triptych:first-child .title {
      /* hero title*/
      font-size: 1.875em;
      line-height: 1.1; } }

/* 5.7 Cross-section */
/*
Cross Section

A cross section is a collection of featured aticles, with a side bar containing a short-list of articles over configurable period.

markup:
<section class="cross-section  |  divider divider--top">
  <h1 class="title title--headline  |  wings  trailer--hero"><span class="gutters">Resources</span></h1>
  <div class="layout">
    <div class="layout__cell layout__cell--aside layout__cell--divider  |  wings">
      <div class="trailer  |  gutters">
        <sg-insert>4.14</sg-insert>
      </div>
      <div class="gutters">
        <sg-insert>4.13.1</sg-insert>
      </div>
    </div>
    <div class="layout__cell">
      <sg-insert>4.8.2</sg-insert>
      <div class="grid grid--posts  |  leader--hero  |  wing--right">
        <div class="grid__cell  |  gutters">
          <sg-insert>4.8.1</sg-insert>
        </div>
        <div class="grid__cell  |  gutters">
          <sg-insert>4.8.1</sg-insert>
        </div>
        <div class="grid__cell  |  gutters">
          <sg-insert>4.8.1</sg-insert>
        </div>
        <div class="grid__cell  |  gutters">
          <sg-insert>4.8.1</sg-insert>
        </div>
      </div>
    </div>
  </div>
</section>

Styleguide 5.7
*/
/*
 * 1. lengthen divider below content, in case an adjacent container touches this one
 */
.cross-section .layout__cell {
  padding-bottom: 18px;
  /* 1 */ }

/* 5.8 Upcoming events */
/*
Upcoming events

A cross section is a collection of featured aticles, with a side bar containing a short-list of articles over configurable period.

markup:
<section>
  <h1 class="title title--headline  |  leader--hero  |  trailer--hero  |  wings">
    <span class="gutters">Upcoming events</span>
  </h1>
  <div class="layout">
    <div class="layout__cell layout__cell--aside layout__cell--divider  |  wings">
      <div class="gutters  |  trailer--hero">
        <sg-insert>3.20</sg-insert>
      </div>
      <div class="gutters">
        <form class="trailer" action="https://cta.us5.list-manage.com/subscribe/post" method="post">
          <input type="hidden" name="u" value="3dc86afdfe91e13b55050810d">
          <input type="hidden" name="id" value="f855876cb7">
          <input type="hidden" name="MERGE3" value="English">
          <h4 class="title title--section">Don't miss our next event. Subscribe now!</h4>
          <fieldset class="leader trailer">
              <label class="fld-label title title--meta" for="name">Full name</label>
              <input class="fld" name="MERGE1" type="text" id="name">
              <label class="fld-label title title--meta" for="email">E-mail address</label>
              <input class="fld" name="MERGE0" type="text" id="email">
              <label class="fld-label title title--meta" for="country">Country</label>
              <input class="fld" name="MERGE2" type="text" id="country">
          </fieldset>
          <button class="button button--stretch">Subscribe</button>
        </form>
      </div>
    </div>
    <div class="layout__cell  |  gutters  |  wing--right">
      <div id="upcoming-events">
        <sg-insert>4.15</sg-insert>
        <hr class="reset  |  divider divider--bottom  |  gutters-outside  |  gutters-outside  |  trailer">
        <sg-insert>4.15</sg-insert>
        <hr class="reset  |  divider divider--bottom  |  gutters-outside  |  gutters-outside  |  trailer">
        <sg-insert>4.15</sg-insert>
        <hr class="reset  |  divider divider--bottom  |  gutters-outside  |  gutters-outside  |  trailer">
        <sg-insert>4.15</sg-insert>
      </div>
    </div>
  </div>
</section>

Styleguide 5.8
*/
/* 5.9 Related Articles */
/*
Related articles

A cross section is a collection of featured aticles, with a side bar containing a short-list of articles over configurable period.

markup:
<section>
    <h1 class="title title--section  |  wings"><span class="gutters">Related Articles</span></h1>
    <div class="layout layout--reverse  |  wing--right">
        <div class="layout__cell  |  grid grid--posts">
            <div class="grid__cell  |  trailer  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/spore/article/super-seeds-reach-refugees-in-uganda-sid03d1c2e72-dd48-4afb-a343-ba8c7901948b">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2018-01-10T06:06:39+00:00">10 January 2018</time>
                        <span class="meta">in <a href="/en/spore">Spore</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="">
                                'Super seeds' reach refugees in Uganda
                            </a>
                        </h3>
                        <p class="is-gt-small-desktop  |  post__intro">To promote food security and self-sufficiency in Uganda among smallholder farmers and refugee communities, new bean varieties have been bred to tolerate the changing climate. The highly productive seeds have also become popular among traders and seed companies who have a ready market for their product.</p>
                        <a class="read-more" href="">Read More</a>
                    </div>
                </div>
            </div>
            <div class="grid__cell  |  trailer  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/spore/article/super-seeds-reach-refugees-in-uganda-sid03d1c2e72-dd48-4afb-a343-ba8c7901948b">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2018-01-10T06:06:39+00:00">10 January 2018</time>
                        <span class="meta">in <a href="/en/spore">Spore</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="">
                                'Super seeds' reach refugees in Uganda
                            </a>
                        </h3>
                        <p class="is-gt-small-desktop  |  post__intro">To promote food security and self-sufficiency in Uganda among smallholder farmers and refugee communities, new bean varieties have been bred to tolerate the changing climate. The highly productive seeds have also become popular among traders and seed companies who have a ready market for their product.</p>
                        <a class="read-more" href="">Read More</a>
                    </div>
                </div>
            </div>
            <div class="grid__cell  |  trailer  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/spore/article/super-seeds-reach-refugees-in-uganda-sid03d1c2e72-dd48-4afb-a343-ba8c7901948b">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2018-01-10T06:06:39+00:00">10 January 2018</time>
                        <span class="meta">in <a href="/en/spore">Spore</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="">
                                'Super seeds' reach refugees in Uganda
                            </a>
                        </h3>
                        <p class="is-gt-small-desktop  |  post__intro">To promote food security and self-sufficiency in Uganda among smallholder farmers and refugee communities, new bean varieties have been bred to tolerate the changing climate. The highly productive seeds have also become popular among traders and seed companies who have a ready market for their product.</p>
                        <a class="read-more" href="">Read More</a>
                    </div>
                </div>
            </div>
            <div class="grid__cell  |  trailer  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/spore/article/super-seeds-reach-refugees-in-uganda-sid03d1c2e72-dd48-4afb-a343-ba8c7901948b">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wa6pfr0uvyh3plf36mqk 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2018-01-10T06:06:39+00:00">10 January 2018</time>
                        <span class="meta">in <a href="/en/spore">Spore</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="">
                                'Super seeds' reach refugees in Uganda
                            </a>
                        </h3>
                        <p class="is-gt-small-desktop  |  post__intro">To promote food security and self-sufficiency in Uganda among smallholder farmers and refugee communities, new bean varieties have been bred to tolerate the changing climate. The highly productive seeds have also become popular among traders and seed companies who have a ready market for their product.</p>
                        <a class="read-more" href="">Read More</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="layout__cell layout__cell--aside layout__cell--divider  |  wings">
            <form class="trailer  |  gutters" method="post">
                <h4 class="title">Don't miss our next event. Subscribe now!</h4>
                <fieldset class="leader trailer">
                    <label class="fld-label title title--meta" for="name">Full name</label>
                    <input class="fld" type="text" id="name">
                    <label class="fld-label title title--meta" for="email">E-mail address</label>
                    <input class="fld" type="text" id="email">
                    <label class="fld-label title title--meta" for="country">Country</label>
                    <input class="fld" type="text" id="country">
                </fieldset>
                <button class="button button--stretch">Subscribe</button>
            </form>
        </div>
    </div>
</section>

Styleguide 5.9
*/
/* 5.10 Contextual search */
/*
Contextual Search

markup:
<div class="well  |  is-root  |  trailer  |  is-illustrated">
    <form class="layout  |  trailer--hero" method="get" action="/en/search">
        <div class="layout__cell  |  layout__cell--aside  |  wings  |  trailer">
            <div class="topics topics" data-fe-id="">
                <h3 class="title title--lead trailer  |  gutters">Topics</h3>
                <ul class="label-list reset list--inline  |  gutters">
                    <li>
                        <a class="label label--s" href="/en/search?concepts[]=c_9001017">resources</a>
                    </li>
                    <li>
                        <a class="label label--s" href="/en/search?concepts[]=c_50227">groups</a>
                    </li>
                    <li>
                        <a class="label label--s" href="/en/search?concepts[]=c_7778">time</a>
                    </li>
                    <li>
                        <a class="label label--s" href="/en/search?concepts[]=c_7644">technology</a>
                    </li>
                    <li>
                        <a class="label label--s" href="/en/search?concepts[]=c_6211">products</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="layout__cell layout__cell--main  |  wing--right  |  trailer--hero trailer-inside">
            <h3 class="title title--lead trailer  |  gutters">Find events</h3>
            <div class="leader--small gutters ctx-form__item ctx-item__search">
                <div class="fld">
                    <label for="ctx-item__search" class="fld-label">Labels</label>
                    <input id="ctx-item__search" name="q" class="placeholder-visible" value="">
                </div>
            </div>
            <div class="grid grid--contextual">
                <div class="ctx-form__item grid__cell gutters ctx-item__content-type  |  ctx-item__date">
                    <div class="fld">
                        <label for="ctx-item__article-selectized" class="fld-label">Event type</label>
                        <select id="ctx-item__article" name="type" class="placeholder-visible selectized" tabindex="-1" style="display: none;"><option value="" selected="selected">All</option></select>
                        <div class="selectize-control placeholder-visible single">
                            <div class="selectize-input items full has-options has-items">
                                <div class="item" data-value="">All</div><input type="text" autocomplete="off" tabindex="" id="ctx-item__article-selectized" style="width: 4px;"></div>
                            <div class="selectize-dropdown single placeholder-visible" style="display: none;">
                                <div class="selectize-dropdown-content"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="ctx-form__item grid__cell gutters ctx-item__date">
                    <div class="fld">
                        <label for="ctx-item__date-selectized" class="fld-label">Period</label>
                        <select id="ctx-item__date" name="upcoming" class="placeholder-visible selectized" tabindex="-1" style="display: none;"><option value="true" selected="selected">Upcoming</option></select>
                        <div class="selectize-control placeholder-visible single">
                            <div class="selectize-input items full has-options has-items">
                                <div class="item" data-value="true">Upcoming</div><input type="text" autocomplete="off" tabindex="" id="ctx-item__date-selectized" style="width: 4px;"></div>
                            <div class="selectize-dropdown single placeholder-visible" style="display: none;">
                                <div class="selectize-dropdown-content"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="ctx-form__item grid__cell gutters ctx-item__location">
                    <div class="fld">
                        <label for="ctx-item__country-selectized" class="fld-label">Region or country</label>
                        <select id="ctx-item__country" name="location" class="placeholder-visible selectized" tabindex="-1" style="display: none;"><option value="" selected="selected">All</option></select>
                        <div class="selectize-control placeholder-visible single">
                            <div class="selectize-input items full has-options has-items">
                                <div class="item" data-value="">All</div><input type="text" autocomplete="off" tabindex="" id="ctx-item__country-selectized" style="width: 4px;"></div>
                            <div class="selectize-dropdown single placeholder-visible" style="display: none;">
                                <div class="selectize-dropdown-content"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="ctx-form__item grid__cell gutters ctx-item__submit">
                    <button class="button button--wide" type="submit">Search</button>
                </div>
            </div>
        </div>
    </form>
    <figure class="search__illustrations-set">
        <span class="search__illustration illustration illustration--fish-barn"></span>
        <span class="search__illustration illustration illustration--fishing-shore"></span>
        <span class="search__illustration illustration illustration--fishing-boat"></span>
        <span class="water-illustration"></span>
    </figure>
</div>

Styleguide 5.10
*/
.ctx__topics, .ctx__search {
  display: inline-block;
  width: 100%; }
  @media only screen and (min-width: 64em) {
    .no-flexbox .ctx__topics, .no-flexbox .ctx__search {
      width: 72.22222%;
      float: left; } }

.ctx__search {
  margin-top: 30px; }
  @media only screen and (min-width: 64em) {
    .ctx__search {
      margin-top: 0; } }

.ctx-form__item .fld-label {
  margin-bottom: 12px;
  font-size: 0.625em; }

@media only screen and (min-width: 48em) {
  .ctx-form__item {
    max-width: 33.33333%; } }

.ctx-item__search {
  display: inline-block;
  width: 100%;
  margin-top: 0; }
  @media only screen and (min-width: 48em) {
    .ctx-item__search {
      margin-bottom: 30px;
      max-width: 100%; } }
  .ctx-item__search .item.item {
    color: #cdcdcd;
    font-size: 1.6875em;
    font-weight: 600; }
    @media only screen and (min-width: 64em) {
      .ctx-item__search .item.item {
        font-size: 2.8125em; } }

@media only screen and (min-width: 48em) {
  .ctx-item__submit {
    -ms-flex-item-align: end;
        align-self: flex-end; } }

.ctx-item__submit .button, .ctx-item__submit [data-vendor="commento"] .commento-button.commento-submit-button, [data-vendor="commento"] .ctx-item__submit .commento-button.commento-submit-button {
  margin-top: 30px;
  width: 100%; }
  @media only screen and (min-width: 48em) {
    .ctx-item__submit .button, .ctx-item__submit [data-vendor="commento"] .commento-button.commento-submit-button, [data-vendor="commento"] .ctx-item__submit .commento-button.commento-submit-button {
      width: auto;
      float: right; } }

.selectize-control {
  position: relative;
  cursor: pointer; }
  .selectize-control input {
    font-size: 0.75em;
    font-family: "Open Sans", sans-serif;
    color: #3d3d3d;
    background: transparent; }
    .selectize-control input:focus {
      outline: none; }
  .selectize-control .item {
    display: inline-block;
    font-size: 0.8125em; }
  .selectize-control .option {
    padding: 3px 6px;
    font-size: 0.8125em;
    text-transform: capitalize;
    cursor: pointer; }
    .selectize-control .option:hover {
      background: #dedede; }
  .selectize-control .optgroup-header {
    padding: 3px 6px;
    font-size: 0.8125em;
    font-weight: bold;
    text-transform: capitalize;
    border-bottom: 1px solid #3d3d3d; }
  .selectize-control.single .selectize-input:before {
    position: absolute;
    font-family: "cta-icons";
    content: "";
    right: 0;
    top: -2px; }
  .selectize-control.single .selectize-input.dropdown-active:before {
    content: ""; }

.selectize-dropdown {
  position: absolute;
  margin-top: 6px;
  background: #fff;
  border: 1px solid #dedede;
  z-index: 11; }
  .selectize-dropdown-content .option.selected {
    background: #ececec; }

/* 5.11 Tabbed content */
/*
Tabbed content event overview

markup:
<div class="layout  |  leader--hero  |  trailer--hero">
	 <div class="layout__cell layout__cell--aside layout__cell--divider  |  wings">
			<nav class="tabbed__navigation  |  is-gt-small-desktop  |  gutters  |  trailer">
				 <ul class="reset">
						<li>
							 <a class="block-link  |  title" href="#overview">Event Overview</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#speakers">Speakers</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#attendees">Attendees</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#organisers">Organisers</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#sponsors">Sponsors</a>
						</li>
				 </ul>
			</nav>
			<div class="gutters">
				<a class="button button--wide  |  gutters" href="javascript:void();">Register now</a>
			</div>
	 </div>
	 <div class="panel-group  |  layout__cell layout__cell--aside">
		 <section class="is-active  |  panel  |  layout  |  event-body" id="overview">
			 <div class="layout__cell  |  gutters">
				 <div class="social__share  |  trailer">
					 <ul class="share-list share-list--whisper reset list--float">
						<li class="divider  divider--left">
							 <a class="label share share--whisper share--facebook" title="Share on Facebook" href="javascript:void();"><span data-icon="facebook"><span><span class="is-narrative">Share on Facebook</span></span></span></a>
						</li>
						<li class="divider  divider--left">
							 <a class="label share share--whisper share--twitter" title="Share on Twitter" href="javascript:void();"><span data-icon="twitter"><span><span class="is-narrative">Share on Twitter</span></span></span></a>
						</li>
						<li class="divider  divider--left">
							 <a class="label share share--whisper share--print" title="Print" href="javascript:void();"><span data-icon="print"><span><span class="is-narrative">Print</span></span></span></a>
						</li>
						<li class="divider  divider--left">
							 <a class="label share share--whisper share--email" title="Send link via E-mail" href="javascript:void();"><span data-icon="email"><span><span class="is-narrative">Send link via E-mail</span></span></span></a>
						</li>
					</ul>
				</div>
				<h2 class="panel__trigger  |  title  |  trailer">Event Overview</h2>
				<p class="paragraph--lead"><span>From 5 to 7 October 2016, His Excellency, Mr. Hailemariam Desalegn, the Prime Minister of Ethiopia is hosting the first International Agro-Industry Investment Forum in Addis Ababa. The event is co-organized by the Government of Ethiopia and UNIDO. The high-level investment forum will feature participants from the public and private sector, including representatives of the Ethiopian Government, international investors, international financial institutions, domestic enterprises, international organizations and industry associations.</span><br></p>
				<h2 class="panel__trigger  |  title  |  trailer">Investment Promotion Roadshows</h2>
				<p><span>Government of Ethiopia officials are conducting roadshows to select countries in Asia, Europe and the Middle East in preparation for the first International Agro-Industry Investment Forum. Co-organized by UNIDO, the roadshows aim to promote specific investment opportunities in Ethiopia’s agro-industries and allied sectors, including the Integrated Agro-Industrial Parks initiative, a key component of UNIDO's PCP for Ethiopia.<br><br>
The roadshows are tailored to each country and feature workshops, roundtables or bilateral meetings depending on country-specific needs.</span><br></p>
				<div class="trailer--normal  |  leader">
					<ul class="reset  |  tag-list  |  list--inline">
						 <li>
								<a class="tag" href="http://aims.fao.org/aos/agrovoc/c_7848">Trade</a>
						 </li>
						 <li>
								<a class="tag" href="http://aims.fao.org/aos/agrovoc/c_870">Belgium</a>
						 </li>
						 <li>
								<a class="tag" href="http://aims.fao.org/aos/agrovoc/c_49916">European Commission</a>
						 </li>
					 </ul>
				 </div>
				 <div class="social__share  |  trailer">
				 <ul class="share-list reset list--float">
						<li class="divider  divider--left">
							 <a class="label share share--facebook" title="Share on Facebook" href="javascript:void();"><span data-icon="facebook"><span><span class="is-narrative">Share on Facebook</span></span></span></a>
						</li>
						<li class="divider  divider--left">
							 <a class="label share share--twitter" title="Share on Twitter" href="javascript:void();"><span data-icon="twitter"><span><span class="is-narrative">Share on Twitter</span></span></span></a>
						</li>
						<li class="divider  divider--left">
							 <a class="label share share--print" title="Print" href="javascript:void();"><span data-icon="print"><span><span class="is-narrative">Print</span></span></span></a>
						</li>
						<li class="divider  divider--left">
							 <a class="label share share--email" title="Send link via E-mail" href="javascript:void();"><span data-icon="email"><span><span class="is-narrative">Send link via E-mail</span></span></span></a>
						</li>
				 </ul>
			 </div>
		 </div>
		 <div class="layout__cell--aside  |  wings">
				<aside>
					<sg-insert>4.20</sg-insert>
					<div class="organisers  |  leader">
						<h3 class="title trailer--normal">Organisers</h3>
						<div class="grid grid--organisers">
							<div class="grid__cell  |  gutters  |  trailer">
								<div class="sponsor__image" style="background-image: url(http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png);background-repeat: no-repeat;
								background-size: contain;background-position: center center">
								</div>
							</div>
							<div class="grid__cell  grid--organisers  |  gutters  |  trailer">
								<div class="sponsor__image" style="background-image: url(http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png);background-repeat: no-repeat;
								background-size: contain;background-position: center center">
								</div>
							</div>
						</div>
					</div>
					<div class="trailer--hero">
						<h3 class="title trailer--normal">External links</h3>
						<ul class="reset">
							<li class="trailer--normal"><a href="javascript:void();">Alliance for a Green Revolution in Africa (AGRA)</a></li>
							<li class="trailer--normal"><a href="javascript:void();">Economic Community of West African States (ECOWAS)</a></li>
							<li class="trailer--normal"><a href="javascript:void();">Alliance for a Green Revolution in Africa (AGRA)</a></li>
						</ul>
					</div>
					<div class="trailer--hero">
						<h3 class="title trailer--normal">Related projects</h3>
						<ul class="reset">
							<li class="trailer--normal"><a href="javascript:void();">MUISS Project</a></li>
							<li class="trailer--normal"><a href="javascript:void();">Promoting the grain trade in West Africa</a></li>
						</ul>
					</div>
				</aside>
		 </div>
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="speakers">
				 <h2 class="panel__trigger  |  title">Speakers</h2>
				 Speakers
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="attendees">
				 <h2 class="panel__trigger  |  title">Attendees</h2>
				 Attendees
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="organisers">
				 <h2 class="panel__trigger  |  title">Organisers</h2>
				 Organisers
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="sponsors">
				 <h2 class="panel__trigger  |  title">Sponsors</h2>
				 Sponsors
			</section>
	 </div>
</div>

Styleguide 5.11
*/
.tabbed__navigation .block-link {
  display: block;
  padding: 6px 0; }

.event-body p {
  margin-bottom: 24px; }

/*
Tabbed content speakers

markup:
<div class="layout  |  leader--hero  |  trailer--hero">
	<div class="layout__cell layout__cell--aside layout__cell--divider  |  wings">
		<nav class="tabbed__navigation  |  is-gt-small-desktop  |  gutters  |  trailer">
			<ul class="reset">
				<li>
					<a class="block-link  |  title" href="#overview">Event Overview</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#speakers">Speakers</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#attendees">Attendees</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#organisers">Organisers</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#sponsors">Sponsors</a>
				</li>
			</ul>
		</nav>
	<div class="gutters">
		<a class="button button--wide  |  gutters" href="javascript:void();">Register now</a>
	</div>
	</div>
	<div class="panel-group  |  layout__cell layout__cell--main">
		<section class="is-active  |  panel  |  event-body" id="overview">
			<sg-insert>4.25</sg-insert>
			<sg-insert>4.25.1</sg-insert>
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="speakers">
			<h2 class="panel__trigger  |  title">Speakers</h2>
			Speakers
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="attendees">
			<h2 class="panel__trigger  |  title">Attendees</h2>
			Attendees
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="organisers">
			<h2 class="panel__trigger  |  title">Organisers</h2>
			Organisers
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="sponsors">
			<h2 class="panel__trigger  |  title">Sponsors</h2>
			Sponsors
		</section>
	</div>
</div>

Styleguide 5.11.1
*/
/*
Tabbed content attendees

markup:
<div class="layout  |  leader--hero  |  trailer--hero">
	 <div class="layout__cell layout__cell--aside layout__cell--divider  |  wings">
			<nav class="tabbed__navigation  |  is-gt-small-desktop  |  gutters  |  trailer">
				 <ul class="reset">
						<li>
							 <a class="block-link  |  title" href="#overview">Event Overview</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#speakers">Speakers</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#attendees">Attendees</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#organisers">Organisers</a>
						</li>
						<li>
							 <a class="block-link  |  title" href="#sponsors">Sponsors</a>
						</li>
				 </ul>
			</nav>
			<div class="gutters">
				<a class="button button--wide  |  gutters" href="javascript:void();">Register now</a>
			</div>
	 </div>
	 <div class="panel-group  |  layout__cell layout__cell--main">
		 <section class="is-active  |  panel" id="overview">
			 	<sg-insert>4.24</sg-insert>
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="speakers">
				 <h2 class="panel__trigger  |  title">Speakers</h2>
				 Speakers
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="attendees">
				 <h2 class="panel__trigger  |  title">Attendees</h2>
				 Attendees
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="organisers">
				 <h2 class="panel__trigger  |  title">Organisers</h2>
				 Organisers
			</section>
			<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="sponsors">
				 <h2 class="panel__trigger  |  title">Sponsors</h2>
				 Sponsors
			</section>
	 </div>
</div>

Styleguide 5.11.2
*/
/*
Tabbed content sponsors

markup:
<div class="layout  |  leader--hero  |  trailer--hero">
	<div class="layout__cell layout__cell--aside layout__cell--divider  |  wings">
		<nav class="tabbed__navigation  |  is-gt-small-desktop  |  gutters  |  trailer">
			<ul class="reset">
				<li>
					<a class="block-link  |  title" href="#overview">Event Overview</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#speakers">Speakers</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#attendees">Attendees</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#organisers">Organisers</a>
				</li>
				<li>
					<a class="block-link  |  title" href="#sponsors">Sponsors</a>
				</li>
			</ul>
		</nav>
	<div class="gutters">
		<a class="button button--wide  |  gutters" href="javascript:void();">Register now</a>
	</div>
	</div>
	<div class="panel-group  |  layout__cell layout__cell--main">
		<section class="is-active  |  panel  |  event-body" id="overview">
			<div>
				<h1 class="title  |  trailer  |  gutters">Sponsors</h1>
				<div class="trellis  |  wing--right">
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
					<div class="trellis__cell  |  gutters  |  trailer">
						<a href="javascript:void();">
							<img class="image" src="http://www.loveknowsnobounds.org/wp-content/uploads/2014/04/May-2012-LKNB-Logo-1-e1396396316281.png" alt="" />
						</a>
					</div>
				</div>
			</div>
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="speakers">
			<h2 class="panel__trigger  |  title">Speakers</h2>
			Speakers
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="attendees">
			<h2 class="panel__trigger  |  title">Attendees</h2>
			Attendees
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="organisers">
			<h2 class="panel__trigger  |  title">Organisers</h2>
			Organisers
		</section>
		<section class="is-inactive  |  panel  |  wings--right  |  event-body" id="sponsors">
			<h2 class="panel__trigger  |  title">Sponsors</h2>
			Sponsors
		</section>
	</div>
</div>

Styleguide 5.11.3
*/
/* 5.12 Statistics bar*/
/*
Statistics bar

markup:
<div class="well well--darker  |  leader-inside  |  trailer-inside">
    <div class="layout">
        <div class="layout__cell layout__cell--aside  |  wing--left">
            <div class="gutters">
                <h3 class="title  |  trailer--small">
                    Green shoots for the future
                </h3>
                <p class="trailer">
                </p>
                <div class="title--filter  |  trailer-inside">
                </div>
            </div>
        </div>
        <div class="layout__cell  |  is-center  |  wing--right">
            <div class="grid grid--posts  |  grid-decoration  |  gutters">
                <figure class="stat  |  grid__cell">
                    <p class="stat__figure  |  trailer">260%</p>
                    <figcaption class="stat__caption  |  meta meta--s  |  gutters">
                        260% required increase in crop production by 2050 to feed Africa’s projected population growth.
                    </figcaption>
                </figure>
                <figure class="stat  |  grid__cell">
                    <p class="stat__figure  |  trailer">40%</p>
                    <figcaption class="stat__caption  |  meta meta--s  |  gutters">
                        Post-harvest losses in ACP countries amount up to 40% of harvests.
                    </figcaption>
                </figure>
                <figure class="stat  |  grid__cell">
                    <p class="stat__figure  |  trailer">1%</p>
                    <figcaption class="stat__caption  |  meta meta--s  |  gutters">
                        A 1% growth in agriculture pulls 0.41% of the population out of poverty, according to the International Monetary Fund (IMF)
                    </figcaption>
                </figure>
                <figure class="stat  |  grid__cell">
                    <p class="stat__figure  |  trailer">78%</p>
                    <figcaption class="stat__caption  |  meta meta--s  |  gutters">
                        Only 20% of trade in SSA is intra-regional, compared with 78% in the EU and 60% in Asia.
                    </figcaption>
                </figure>
            </div>
        </div>
    </div>
</div>

sg-wrapper:
<div class="theme--salmon">
  <sg-wrapper-content/>
</div>

Styleguide 5.12
*/
/* 5.14 Impact Stories */
/*
Impact stories

markup:
<section class="impact-stories  |  well">
    <header class="trailer--hero  |  leader-inside  |  wings">
        <h2 class="title title--container  |  gutters">Impact stories</h2>
    </header>
    <div class="layout layout--reverse trailer-inside--small">
        <div class="layout__cell  |  wing--right">
            <a class="post post--hero  |  layout layout--even  |  anchor anchor--shy  |  is-heir" href="/en/article/satellite-based-crop-advice-sid0e6cbabe4-0bf2-4848-a8f9-88f45fcc26ee">
                <div class="post__media  |  layout__cell  |  gutters">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_750,ar_3:2,f_auto,c_fill/i7f2tfwpinjayoskaap5" srcset="http://res.cloudinary.com/cta/image/upload/w_1480,ar_3:2,f_auto,c_fill/i7f2tfwpinjayoskaap5 1500w,http://res.cloudinary.com/cta/image/upload/w_1280,ar_3:2,f_auto,c_fill/i7f2tfwpinjayoskaap5 1280w,http://res.cloudinary.com/cta/image/upload/w_740,ar_3:2,f_auto,c_fill/i7f2tfwpinjayoskaap5 750w,http://res.cloudinary.com/cta/image/upload/w_640,ar_3:2,f_auto,c_fill/i7f2tfwpinjayoskaap5 640w,http://res.cloudinary.com/cta/image/upload/w_480,ar_3:2,f_auto,c_fill/i7f2tfwpinjayoskaap5 480w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/i7f2tfwpinjayoskaap5 320w" sizes="(min-width: 1024px) 50vw, (min-width: 768px) 100vw" width="360" height="240" alt="">
                </div>
                <div class="post__content  |  layout__cell layout__cell--aside  |  stack stack--stacked">
                    <div class="stack__unit  |  gutters">
                        <blockquote class="quote  |  leader--small  |  trailer--normal">
                            There are a number of innovations that can be brought to scale, to counter the threats of climate change.
                        </blockquote>
                        <div class="meta">Bruce Campbell, Director of the CGIAR Research Programme on Climate Change</div>
                    </div>
                    <div class="stack__unit stack__pin  |  gutters">
                        <div class="pin-box  |  leader-inside--small">
                            <span><time class="meta" datetime="2017-04-19T20:29:48+00:00">19 April 2017</time></span>
                            <h3 class="title">Satellite-based crop advice</h3>
                        </div>
                    </div>
                </div>
            </a>
        </div>
        <div class="layout__cell layout__cell--aside  |  wings">
            <div class="short-list  |  gutters  |  trailer">
                <ul class="reset  |  short-list">
                    <li class="short-list__item">
                        <div class="trailer--tiny"> <time class="meta" datetime="2017-04-20T02:24:48+00:00">20 April 2017</time>
                        </div>
                        <a href="/en/article/-sid05152d5fc-3ea4-4e04-9c06-043f20f55780">
                            <h2 class="block-link">New site for ICT Update launched</h2>
                        </a>
                    </li>
                    <li class="short-list__item">
                        <div class="trailer--tiny"> <time class="meta" datetime="2017-04-20T02:29:36+00:00">20 April 2017</time>
                        </div>
                        <a href="/en/article/-sid0cb5dedc2-7d88-49ab-a557-1e64a0db1c0d">
                            <h2 class="block-link">Supporting young e-agriculture start-ups</h2>
                        </a>
                    </li>
                    <li class="short-list__item">
                        <div class="trailer--tiny"> <time class="meta" datetime="2017-04-20T02:19:20+00:00">20 April 2017</time>
                        </div>
                        <a href="/en/article/-sid0d3dbbc9a-241c-4c11-9504-20d94fe49236">
                            <h2 class="block-link">ICTs for agriculture: a must for youth and farmers</h2>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</section>

sg-wrapper:
<div class="theme--salmon">
  <sg-wrapper-content/>
</div>

Styleguide 5.14
*/
.impact-stories {
  padding-top: 0; }

/* 5.15 About us */
/*
About us sections

Styleguide 5.15
*/
/*
About us section 1

markup:
<div class="about-cta">
    <div class="about-cta--container  |  layout--narrow  |  wings">
        <div class="is-root">
            <div class="is-silent  |  about-cta__section-id  |  meta  |  gutters-outside"><span class="section-id__number">01</span></div>
            <h2 class="title title--sub-section  title--about-cta  |  trailer |  leader-inside--hero  |  gutters">Message from the director</h2>
            <div class="layout layout--even">
                <div class="layout__cell  |  gutters">
                    <div class="title title--tile">
                        Agriculture is key to meeting many of the 2030 Sustainable Development Goals. It is critical not only to ensure food and nutrition security for African, Caribbean and Pacific (ACP) countries, but also to create jobs for millions of young people joining the labour market each year and to contribute to economic growth and prosperity.
                    </div>
                </div>
                <div class="layout__cell  |  gutters">
                    <div class="paragraph--lead">
                        To achieve this effectively, agriculture must be treated as a business and smallhoder producers must be placed at the centre to earn a greater share of the agricultural value chain
                    </div>
                    <h3 class="title title--sub-section  |  leader leader-inside--small  |  trailer--normal">ACP partners and networks</h3>
                    <p class="trailer">
                        They can produce enough food to feed not only themselves, but also burgeoning urban populations and reverse the rising trend of food imports into the ACP countries. To this end, smallholders must be able to apply innovations to increase their productivity, reduce post-harvest losses and become more resilient to climate change. They must also have access to lucrative markets. CTA assists smallholders to become better organised in order to profit from domestic, regional and international markets; by promoting access to key business development services, such as finance and inputs; by leveraging ICTs at various stages of the value chain; and by building resilience through climate-smart farming practices. While smallholder producers are CTA's ultimate 'clients', it is the Centre's partner organisations and networks in the ACP that serve smallholders directly. Therefore, we are intensifying our partnerships and articulating how to convert global challenges into opportunities for smallholders.
                    </p>
                    <h3 class="title title--sub-section  |  leader leader-inside--small  |  trailer--normal">Key areas</h3>
                    <p class="trailer">
                        Agribusiness development, ICT for agriculture, youth and women entrepreneurship, climate-smart agriculture and knowledge management – these are the key areas where we are working with partners to transform agriculture for the benefit of ACP smallholder producers and other value chain actors. I would like to thank the ACP Group and the European Union for their commitment and continued support for the work of CTA. I look forward to working with our key stakeholders to ensure that CTA continues to work for the benefit of rural communities, especially women and youth across the ACP.
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>

sg-wrapper:
<section class="theme--dark">
  <sg-wrapper-content/>
</section>

Styleguide 5.15.1
*/
.about-cta {
  background-color: #67ab43;
  color: #fff; }
  .about-cta.theme--dark,
  .theme--dark .about-cta,
  .theme .theme--dark .about-cta {
    background-color: #3d3d3d; }
  .about-cta.theme--green,
  .theme--green .about-cta,
  .theme .theme--green .about-cta {
    background-color: #67ab43; }
  .about-cta.theme--blue,
  .theme--blue .about-cta,
  .theme .theme--blue .about-cta {
    background-color: #56c0dd; }
  .about-cta.theme--lime,
  .theme--lime .about-cta,
  .theme .theme--lime .about-cta {
    background-color: #c1d435; }
  .about-cta.theme--yellow,
  .theme--yellow .about-cta,
  .theme .theme--yellow .about-cta {
    background-color: #facf21; }
  .about-cta.theme--gold,
  .theme--gold .about-cta,
  .theme .theme--gold .about-cta {
    background-color: #eb942c; }
  .about-cta.theme--orange,
  .theme--orange .about-cta,
  .theme .theme--orange .about-cta {
    background-color: #e26435; }
  .about-cta.theme--salmon,
  .theme--salmon .about-cta,
  .theme .theme--salmon .about-cta {
    background-color: #eb735d; }
  .about-cta.theme--red,
  .theme--red .about-cta,
  .theme .theme--red .about-cta {
    background-color: #ec2d10; }
  .about-cta.theme--burgundy,
  .theme--burgundy .about-cta,
  .theme .theme--burgundy .about-cta {
    background-color: #ba222a; }
  .about-cta.theme--purple,
  .theme--purple .about-cta,
  .theme .theme--purple .about-cta {
    background-color: #9b3381; }
  .about-cta.theme--youth,
  .theme--youth .about-cta,
  .theme .theme--youth .about-cta {
    background-color: #d57800; }
  .about-cta.theme--digitalisation,
  .theme--digitalisation .about-cta,
  .theme .theme--digitalisation .about-cta {
    background-color: #9a3324; }
  .about-cta.theme--climate,
  .theme--climate .about-cta,
  .theme .theme--climate .about-cta {
    background-color: #693c5e; }
  .about-cta.theme--gender,
  .theme--gender .about-cta,
  .theme .theme--gender .about-cta {
    background-color: #046a38; }
  .about-cta.theme--nutrition,
  .theme--nutrition .about-cta,
  .theme .theme--nutrition .about-cta {
    background-color: #487a7b; }
  .about-cta.theme--blog,
  .theme--blog .about-cta,
  .theme .theme--blog .about-cta {
    background-color: #ffa300; }
  .about-cta.theme--spore-blue,
  .theme--spore-blue .about-cta,
  .theme .theme--spore-blue .about-cta {
    background-color: #3f68b1; }
  .about-cta.theme--spore-brown,
  .theme--spore-brown .about-cta,
  .theme .theme--spore-brown .about-cta {
    background-color: #774b04; }
  .about-cta.theme--spore-dark-blue,
  .theme--spore-dark-blue .about-cta,
  .theme .theme--spore-dark-blue .about-cta {
    background-color: #044e7e; }
  .about-cta.theme--spore-forest-green,
  .theme--spore-forest-green .about-cta,
  .theme .theme--spore-forest-green .about-cta {
    background-color: #5f810a; }
  .about-cta.theme--spore-grey-blue,
  .theme--spore-grey-blue .about-cta,
  .theme .theme--spore-grey-blue .about-cta {
    background-color: #6d8c9f; }
  .about-cta.theme--spore-light-blue,
  .theme--spore-light-blue .about-cta,
  .theme .theme--spore-light-blue .about-cta {
    background-color: #79accf; }
  .about-cta.theme--spore-lime,
  .theme--spore-lime .about-cta,
  .theme .theme--spore-lime .about-cta {
    background-color: #bbae03; }
  .about-cta.theme--spore-ochre,
  .theme--spore-ochre .about-cta,
  .theme .theme--spore-ochre .about-cta {
    background-color: #db9623; }
  .about-cta.theme--spore-olive-green,
  .theme--spore-olive-green .about-cta,
  .theme .theme--spore-olive-green .about-cta {
    background-color: #778d3e; }
  .about-cta.theme--spore-red,
  .theme--spore-red .about-cta,
  .theme .theme--spore-red .about-cta {
    background-color: #f54c23; }
  .about-cta.theme--spore-taupe,
  .theme--spore-taupe .about-cta,
  .theme .theme--spore-taupe .about-cta {
    background-color: #7b6d65; }
  .about-cta.theme--spore-teal,
  .theme--spore-teal .about-cta,
  .theme .theme--spore-teal .about-cta {
    background-color: #077fc1; }
  .about-cta--container {
    position: relative; }
    .about-cta--container .title.title--about-cta, .about-cta--container .title.piped-text-section {
      color: inherit; }
    @media only screen and (min-width: 20em) {
      .about-cta--container .layout--even {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; } }
  .about-cta__lead {
    margin-top: 0; }
  .about-cta__section-id {
    position: absolute;
    top: 15px;
    right: 100%;
    display: table;
    width: 90px;
    height: 90px;
    border: 3px solid #fff;
    color: #fff;
    font-size: 4em;
    letter-spacing: -0.06em;
    text-align: center; }
    @media only screen and (min-width: 64em) {
      .about-cta__section-id {
        height: 135px;
        width: 135px;
        font-size: 6em; } }
    @media only screen and (min-width: 90em) {
      .about-cta__section-id {
        height: 150px;
        width: 150px;
        font-size: 7.5em; } }
  .about-cta .section-id__number {
    display: table-cell;
    vertical-align: bottom; }
  .about-cta__core-values {
    position: relative; }
    .about-cta__core-values .goal {
      position: absolute;
      background: #ba222a;
      color: #fff;
      bottom: 80px;
      right: 0;
      width: 350px; }
    .no-flexbox .about-cta__core-values img {
      width: 100%; }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .about-cta__core-values img[src$=".svg"] {
        width: 100%; } }

/*
About us section 2

markup:
<div class="about-cta">
    <div class="about-cta--container  |  layout--narrow  |  wings">
        <div class="is-root">
            <div class="is-silent  |  about-cta__section-id  |  meta  |  gutters-outside"><span class="section-id__number">02</span></div>
            <h2 class="title title--sub-section  title--about-cta  |  trailer |  leader-inside--hero  |  gutters">What we do</h2>
            <div class="title title--tile  |  leader  |  trailer  |  gutters">
                CTA has a new way of doing business. The organisation is introducing six new flagship projects to increase agricultural productivity, contribute to more-efficient and inclusive agricultural value chains and markets, and promote climate-smart agriculture.
            </div>
            <p class="gutters  |  leader  |  trailer">
                The flagship projects have been developed to complement the Centre’s three strategic priorities: policies, value chains and knowledge management, in addition to youth and women's empowerment. They are integral elements in the regional business plans that
                have been developed in close consultation with CTA's partners and beneficiaries, a process involving external reviews, rapid scans and scoping and impact studies. The projects will improve coordination among programmes, allowing CTA to
                involve key stakeholders in the development of agricultural value chains, such as those that improve nutritional outcomes. This focus on business development is crucial, giving smallholder farmers the opportunity to escape poverty by becoming
                the foundation of improved, inclusive markets.
            </p>
            <div class="layout  layout--split  |  leader  |  trailer">
                <div class="layout__cell  |  gutters">
                    <p class="gutter">
                        CTA is increasingly focusing its attention on links with the private sector, especially small and medium-sized businesses and their associations that are related to agriculture. This sector is a powerful yet underutilised partner in agricultural and rural
                        development. Climate-smart agriculture continues to be a cornerstone of CTA’s programmes; the Centre has played a significant role in putting agriculture on the climate-change agenda. A continuing focus is on supporting participatory
                        development of policies, strategies and value chains that include a wide range of stakeholders, particularly farmers’ organisations, youth and women’s groups, and research and education institutions.
                    </p>
                </div>
                <div class="layout__cell layout__cell--aside  |  gutters">
                    <div class="addendum">
                        <h3 class="addendum__title  |  title title--sub-section  |  trailer--normal">Our programmes</h3>
                        <p class="trailer--small">CTA has organised its activities under two operational programmes:</p>
                        <ul class="reset">
                            <li class="trailer--small"><a class="anchor" href="javascript:void(0);">Policies, Markets, and Information &amp; Communication Technologies (PMI)</a></li>
                            <li class="trailer--small"><a class="anchor" href="javascript:void(0);">Knowledge Management and Communication (KMC)</a></li>
                        </ul>
                        <p>The PMI and KMC programmes are supported by a unit devoted to promoting organisational <a class="anchor" href="javascript:void(0);">earning and effective monitoring, evaluation and impact assessment (LME)</a>.</p>
                    </div>
                </div>
            </div>
            <div class="world-map  |  leader-inside--hero  |  trailer-inside  |  gutters">
                <img class="world-map__image" style="width:100%" src="/images/content/about-cta/world-map-about-cta.svg" alt="Projects are tailored to the particular needs of six regions">
            </div>
            <div class="layout layout--split layout--align-end  |  trailer-inside--hero">
                <div class="layout__cell--aside  |  gutters">
                    <div class="legenda">
                        <ul class="legenda__list  |  reset">
                            <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--gold"></span>Caribbean</li>
                            <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--orange"></span>Western Africa</li>
                            <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--red"></span>Eastern Africa</li>
                            <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--purple"></span>Central Africa</li>
                            <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--yellow"></span>Southern Africa</li>
                            <li class="legenda__item  |  title title--sub-section  |  trailer--small"><span class="legenda__item--identifier legenda__item--blue"></span>Pacific</li>
                        </ul>
                    </div>
                </div>
                <div class="layout__cell  |  gutters  |  trailer--small">
                    <p>
                        Feedback, including results of external reviews and impact studies, has played a central role in guiding CTA as it sets out on its new pathway. The Centre is confident that adopting this approach will help to ensure that its work is even more closely
                        aligned to the needs of its beneficiaries and partners.
                    </p>
                </div>
            </div>
            <p class="paragraph paragraph--lead-xl  |  gutters  |  trailer-inside--hero">
                The new projects are tailored to the particular needs of six regions: West Africa, Central Africa, Eastern Africa, Southern Africa, the Caribbean and the Pacific.
            </p>
            <div class="globe-regions  |  grid  |  grid--musketeers">
                <div class="grid__cell  | gutters  |  trailer--giant">
                    <img class="globe-regions__image" src="/images/content/about-cta/globe-western-africa.svg" alt="Western Africa">
                    <div class="globe-regions__title  |  title title--sub-section  |  trailer--normal  |  leader--small">Western Africa</div>
                    <p>
                        Enhance intraregional grain value chains, allowing farmers’ organisations as well as private entrepreneurs to actively pursue opportunities in the ECOWAS regional grain trade.
                    </p>
                </div>
                <div class="grid__cell  | gutters  |  trailer--giant">
                    <img class="globe-regions__image" src="/images/content/about-cta/globe-central-africa.svg" alt="Central Africa">
                    <div class="globe-regions__title  |  title title--sub-section  |  trailer--normal  |  leader--small">Central Africa</div>
                    <p>
                        Food and nutrition security will be increased with better information and knowledge management, strengthened market institutions and more-effective multistakeholder platforms focusing on roots and tubers, particularly cassava.
                    </p>
                </div>
                <div class="grid__cell  | gutters  |  trailer--giant">
                    <img class="globe-regions__image" src="/images/content/about-cta/globe-eastern-africa.svg" alt="Eastern Africa">
                    <div class="globe-regions__title  |  title title--sub-section  |  trailer--normal  |  leader--small">Eastern Africa</div>
                    <p>
                        Help livestock keepers, including pastoralists, to become more resilient as they gain the knowledge and skills they need to earn more from their animals.
                    </p>
                </div>
            </div>
            <div class="globe-regions  |  grid  |  grid--musketeers">
                <div class="grid__cell  | gutters  |  trailer--giant">
                    <img class="globe-regions__image" src="/images/content/about-cta/globe-southern-africa.svg" alt="Southern Africa">
                    <div class="globe-regions__title  |  title title--sub-section  |  trailer--normal  |  leader--small">
                        Southern Africa
                    </div>
                    <p>
                        Empower farmers to use climate-smart agri-food solutions for their cereals and livestock, increase their livelihoods and move out of poverty.
                    </p>
                </div>
                <div class="grid__cell  | gutters  |  trailer--giant">
                    <img class="globe-regions__image" src="/images/content/about-cta/globe-caribbean.svg" alt="Caribbean">
                    <div class="globe-regions__title  |  title title--sub-section  |  trailer--normal  |  leader--small">Caribbean</div>
                    <p>
                        Small-scale producers, women and young entrepreneurs will have better access to intra-regional and international markets, key business development services, such as finance, and increased profits.
                    </p>
                </div>
                <div class="grid__cell  | gutters  |  trailer--giant">
                    <img class="globe-regions__image" src="/images/content/about-cta/globe-pacific.svg" alt="Pacific">
                    <div class="globe-regions__title  |  title title--sub-section  |  trailer--normal  |  leader--small">Pacific</div>
                    <p>
                        Improve the long-term financial and physical health of poor rural and urban dwellers, especially women and young children, by developing the local food crops and fisheries markets.
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>

sg-wrapper:
<div class="theme--dark">
  <sg-wrapper-content/>
</div>

Styleguide 5.15.2
*/
.world-map {
  margin-left: auto;
  margin-right: auto; }
  @media only screen and (min-width: 48em) {
    .world-map {
      margin-left: -90px;
      margin-right: -90px; } }

/*
About us section 3

markup:
<div class="about-cta  |  trailer-inside--giant">
    <div class="about-cta--container  |  layout--narrow  |  wings">
        <div class="is-root">
            <div class="is-silent  |  about-cta__section-id  |  meta  |  gutters-outside"><span class="section-id__number">03</span></div>
            <h2 class="title title--sub-section  title--about-cta  |  trailer |  leader-inside--hero  |  gutters">Our strategy</h2>
            <div class="layout |  trailer-inside--hero">
                <div class="layout__cell  |  gutter--right">
                    <div class="wing--right">
                        <div class="title title--tile  |  trailer-inside--large  |  gutters">
                            <div class="gutter">
                                Sowing innovation, harvesting prosperity. CTA’s Strategic Plan 2016–2020.
                            </div>
                        </div>
                        <div class="paragraph  |  gutters">
                            <p class="gutter">
                                The world does not stand still, and neither does CTA. CTA's Strategic Plan 2016-2020 is a way-station on a road of continuous change that has seen CTA become a results-based organisation closely aligned with the priorities of the ACP countries it serves.
                            </p>
                        </div>
                    </div>
                    <p class="paragraph  |  gutters">
                        The strategy has been developed with a close eye on the Sustainable Development Goals, many of which it addresses directly. Zero hunger, food security, nutrition and sustainable agriculture (Goal 2), poverty (Goal 1) and gender (Goal 5) are at the heart
                        of CTA's activities, which will also create employment, particularly for young people and women (Goal 8), resulting in reduced inequality (Goal 10). With our partners, CTA will help to reduce food waste (Goal 12), build greater
                        climate resilience (Goal 13) and promote sustainable fisheries (Goal 14).
                    </p>
                    <p class="paragraph  |  gutters">
                        Ultimately, CTA through its emphasis on partnership (Goal 17), will contribute to greater sustainability (Goal 15).
                    </p>
                </div>
                <div class="layout__cell layout__cell--aside  | gutters">
                    <div class="goals-set">
                        <div class="goal goal--filled">
                            <h4 class="goal__title  |  title title--sub-section  |  trailer--small">Mission</h4>
                            <p class="body--whisper">
                                To advance food security, resilience and inclusive economic growth in Africa, the Caribbean and the Pacific through innovations in sustainable agriculture.
                            </p>
                        </div>
                        <div class="goal goal--outlined">
                            <h4 class="goal__title  |  title title--sub-section  |  trailer--small">Vision</h4>
                            <p class="body--whisper">
                                Smallholder agriculture as a vibrant, modern and sustainable business that creates value for farmers, entrepreneurs, youth and women, and produces affordable, nutritious and healthy food for all.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layout layout--align-middle  |  trailer-inside--hero">
                <div class="layout__cell  |  gutters">
                    <div class="about-cta__chapter-title  |  title title--section  |  leader  |  trailer--small">
                        Three strategic goals
                    </div>
                    <p class="gutter">
                        CTA has set three interrelated strategic goals to contribute to greater food and nutrition security and achieve the greatest impact for its work:
                    </p>
                </div>
                <div class="layout__cell layout__cell--aside  |  gutters">
                    <div class="addendum">
                        <h3 class="addendum__title  |  title title--sub-section  |  trailer--normal">Downloads</h3>
                        <ul class="reset">
                            <li class="trailer--small"><a class="meta" href="javascript:void(0);"><strong>CTA's Strategic Plan 2016-2020</strong></a><br>Synthesis version, 622 KB</li>
                            <li class="trailer--small"><a class="meta" href="javascript:void(0);"><strong>CTA's Partnership Strategy</strong></a><br>700KB
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="strategic-goals  |  gutters-outside">
                <div class="grid grid--musketeers">
                    <div class="grid__cell  |  strategic-goals__item  |  divider divider--left  |  gutters">
                        <div class="title title--sub-section">
                            <span class="strategic-goals__number">01</span>
                            <div class="strategic-goals__title">Profitable smallholder value chains</div>
                        </div>
                        <span class="strategic-goals__illustration illustration illustration--fish-market-supplier"></span>
                    </div>
                    <div class="grid__cell  |  strategic-goals__item  |  divider divider--left  |  gutters">
                        <div class="title title--sub-section">
                            <span class="strategic-goals__number">02</span>
                            <div class="strategic-goals__title">Conducive agricultural policies</div>
                        </div>
                        <span class="strategic-goals__illustration illustration illustration--factory"></span>
                    </div>
                    <div class="grid__cell  |  strategic-goals__item  |  divider divider--left  |  gutters">
                        <div class="title title--sub-section">
                            <span class="strategic-goals__number">03</span>
                            <div class="strategic-goals__title">Enhanced capacity for knowledge management</div>
                        </div>
                        <span class="strategic-goals__illustration illustration illustration--farmer-presentation"></span>
                    </div>
                </div>
            </div>
            <div class="layout  layout--split  |  leader-inside--hero  |  trailer-inside--giant">
                <div class="layout__cell layout__cell--aside  |  gutters">
                    &nbsp;
                </div>
                <div class="layout__cell  |  gutters">
                    <p>
                        Smallholders need profitable value chains; the development of profitable value chains requires supportive agricultural policies; and both are boosted by improved knowledge management.
                    </p>
                </div>
            </div>
            <div class="title title--tile  |  trailer-inside--large  |  gutters">
                Regional focus for impact
            </div>
            <p class="paragraph paragraph--lead  |  gutters  trailer">
                Key to implementing this Strategy are the regional business plans CTA and its partners formulated on the basis of each of the six ACP regions' agricultural-sector priorities and making best use of the Centre's comparative advantages.
            </p>
            <div class="layout  |  trailer--hero">
                <div class="layout__cell">
                    <p class="gutters">
                        The flagship projects help to improve coordination and team work among various programmes, allowing CTA to fully leverage the power of key stakeholders, including the private sector, and catalyse complementary actions along agricultural value chains,
                        such as those that improve nutritional outcomes. This focus on business development is crucial, giving smallholder farmers the opportunity to escape poverty by becoming the foundation of improved, inclusive value chains.
                    </p>
                </div>
                <div class="layout__cell layout__cell--aside  |  gutters">
                    <div class="title title--sub-section  |  trailer--small">Key themes</div>
                    <h3 class="body--whisper  |  trailer--small">
                        <a class="-anchor -anchor--shy" href="/en/agribusiness">Agribusiness development</a>
                    </h3>
                    <h3 class="body--whisper  |  trailer--small">
                        <a class="-anchor -anchor--shy" href="/en/icts-for-agriculture">ICTs for agriculture</a>
                    </h3>
                    <h3 class="body--whisper  |  trailer--small">
                        <a class="-anchor -anchor--shy" href="/en/channel/-sid0a48927f8-6c97-4016-a620-eeaa6e630435">Youth and women entrepreneurship</a>
                    </h3>
                    <h3 class="body--whisper  |  trailer--small">
                        <a class="-anchor -anchor--shy" href="/en/climate-resilient-agriculture">Climate resilient agriculture</a>
                    </h3>
                </div>
            </div>
            <div class="piped-text-section  |  title title--container  |  leader-inside  |  trailer-inside">
                <span class="pipe pipe--top"></span> Nullam id dolor id nibh ultricies vehicula ut id elit. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Maecenas faucibus mollis interdum. Cras justo odio, dapibus ac facilisis
                in, egestas eget quam. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
                Sed posuere consectetur est at lobortis.
                <span class="pipe pipe--bottom"></span>
            </div>
        </div>
    </div>
</div>

sg-wrapper:
<section class="theme--dark">
  <sg-wrapper-content/>
</section>

Styleguide 5.15.3
*/
.goals-set .goal:first-child {
  margin-top: 15px;
  margin-left: 25%;
  margin-bottom: -33px; }
  @media only screen and (min-width: 64em) {
    .goals-set .goal:first-child {
      margin-top: 0;
      margin-left: -25%; } }

.piped-text-section {
  position: relative;
  text-align: center; }

.pipe {
  position: absolute;
  width: 100%;
  left: 0; }
  .pipe:before {
    background: #fff;
    display: inline-block;
    content: "";
    height: 3px;
    width: 50%; }
  .pipe--top {
    top: 0; }
    .pipe--top:before {
      vertical-align: top; }
  .pipe--bottom {
    bottom: 0; }
    .pipe--bottom:before {
      vertical-align: bottom; }

/* 5.17 Project preview */
/*
Project preview

Three column layout with an inset in the outer-most right column.

markup:
<article class="project-preview | layout layout--align-end | is-root">
    <div class="project-preview__body  |  layout__cell layout__cell--aside">
        <h1 class="project-preview__title  |  title">Lorem Ipsum Dolor Sit Amet</h1>
        <p class="project-preview__intro">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
        <p class="meta  |  anchor  |  leader--small">
            <a href="javascript:void()">Read more</a>
        </p>
    </div>
    <div class="project-preview__visual  |  layout__cell layout__cell--main">
        <div class="project-preview__cover">
            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_750,ar_3:2,f_auto,c_fill/xft8rdr1mvnsj1tvkp8o" srcset="http://res.cloudinary.com/cta/image/upload/w_1480,ar_3:2,f_auto,c_fill/xft8rdr1mvnsj1tvkp8o 1500w,http://res.cloudinary.com/cta/image/upload/w_1280,ar_3:2,f_auto,c_fill/xft8rdr1mvnsj1tvkp8o 1280w,http://res.cloudinary.com/cta/image/upload/w_740,ar_3:2,f_auto,c_fill/xft8rdr1mvnsj1tvkp8o 750w,http://res.cloudinary.com/cta/image/upload/w_640,ar_3:2,f_auto,c_fill/xft8rdr1mvnsj1tvkp8o 640w,http://res.cloudinary.com/cta/image/upload/w_480,ar_3:2,f_auto,c_fill/xft8rdr1mvnsj1tvkp8o 480w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/xft8rdr1mvnsj1tvkp8o 320w"
                sizes="(min-width: 1024px) 44%, (min-width: 768px) 66%, 100vw" width="480" height="320" alt="">
        </div>
        <div class="project-preview__inset  |  divider divider--bottom  |  trailer-inside--small">
            <div class="media media--end">
                <div class="media__figure">
                    <img class="globe  |  leader  |  trailer  |  gutters-outside  |  fx" src="/images/globes/western-africa.png" alt="Picture of the globe with Western Africa highlighted." width="214" height="214">
                </div>
                <div class="media__body">
                    <div class="media  |  location">
                        <span class="location__marker  |  media__figure">
                            <span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">location:</span></span>
                        </span>
                        <div class="location__body  |  media__content">
                            Wageningen, Netherlands
                        </div>
                    </div>
                    <ul class="reset  |  label-list  |  list--inline  |  leader--small">
                        <li>
                            <a class="label label--s" href="http://aims.fao.org/aos/agrovoc/c_7848">Trade</a>
                        </li>
                        <li>
                            <a class="label label--s" href="http://aims.fao.org/aos/agrovoc/c_870">Belgium</a>
                        </li>
                        <li>
                            <a class="label label--s" href="http://aims.fao.org/aos/agrovoc/c_49916">European Commission</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <aside class="project-preview__aside  |  layout__cell layout__cell--aside  |  wing--right">
        <h2 class="title  |  trailer--small">Project updates</h2>
        <ul class="reset">
            <li>
                <a class="block-link block-link--icon  |  is-heir" href="">Lorem ipsum dolor sit amet, consectetur adipisicing elit</a>
            </li>
            <li>
                <a class="block-link block-link--icon  |  is-heir" href="">Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua</a>
            </li>
            <li>
                <a class="block-link block-link--icon  |  is-heir" href="">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat</a>
            </li>
        </ul>
    </aside>
</article>

Styleguide 5.17
*/
.project-preview__body, .project-preview__visual, .project-preview__aside {
  padding-left: 15px;
  padding-right: 15px; }

.project-preview__visual {
  margin-top: 21px; }

.project-preview__inset {
  position: relative;
  top: -30px;
  margin-bottom: -15px;
  padding-left: 15px; }

.project-preview__title {
  margin-bottom: 6px; }

.project-preview__intro {
  line-height: 21px; }

.project-preview .globe {
  width: 117px;
  height: 117px;
  margin-right: 15px; }

@media only screen and (min-width: 64em) {
  .project-preview__body, .project-preview__aside {
    -webkit-box-flex: 0;
       -moz-box-flex: 0;
        -ms-flex: 0 0 27.77778vw;
            flex: 0 0 27.77778vw;
    max-width: 27.77778vw; }
  .project-preview__intro {
    font-size: 0.875em;
    line-height: 1.5; }
  .project-preview__visual {
    margin-top: 0; }
  .project-preview__title {
    margin-bottom: 6px; }
  .project-preview__cover {
    padding-left: 0;
    padding-right: 0; }
  .project-preview__aside {
    margin-left: -15px; }
    .no-flexbox .project-preview__aside {
      position: absolute;
      bottom: 0; }
  .project-preview__inset {
    position: absolute;
    top: 9px;
    right: 15px;
    width: 30.55556%;
    padding-left: 0; }
  .project-preview__aside .title {
    /* small title*/
    font-size: 0.875em;
    line-height: 1.28571; }
  .project-preview .globe {
    width: 78px;
    height: 78px; }
  .project-preview .block-link {
    /* regular meta */
    font-size: 0.75em;
    line-height: 1.25; } }

@media only screen and (min-width: 75em) {
  .project-preview__intro {
    font-size: 1em; }
  .project-preview__aside {
    margin-left: 0; }
    .project-preview__aside .title {
      /* regular title*/
      font-size: 1em;
      line-height: 1.3125; }
  .project-preview__title {
    /* medium title*/
    font-size: 1.125em;
    line-height: 1.33333;
    margin-bottom: 18px; }
  .project-preview__inset {
    top: 18px;
    width: 29.16667%;
    /* 5 1/4 columns */ }
  .project-preview .globe {
    width: 123px;
    height: 123px;
    margin-right: 30px; }
  .project-preview .block-link {
    /* regular meta */
    font-size: 0.875em;
    line-height: 1.07143; } }

@media only screen and (min-width: 90em) {
  .project-preview {
    width: 88.88889%;
    width: 88.88889vw;
    margin-left: auto;
    margin-right: auto; }
    .project-preview__body, .project-preview__aside {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 0 22.22222vw;
              flex: 0 0 22.22222vw;
      max-width: 22.22222vw; }
    .project-preview__title {
      /* large title*/
      font-size: 1.625em;
      line-height: 1.03846; }
    .project-preview .globe {
      width: 147px;
      height: 147px; } }

.project--list-item .project-preview__body {
  -webkit-box-flex: 0;
     -moz-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%; }

.project__list {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

@media only screen and (max-width: 63.9375em) {
  .project--list-item {
    display: block !important; } }

/* 5.18 Leaflet */
/*
Leaflet

NOTE: THESE ARE NO LONGER USED

.leaflet - Leaflet

markup:
<div class="{$modifiers}  |  well  |  wings">
    <div class="leaflet__tile  |  gutters">
        <sg-insert>4.8.6-2</sg-insert>
    </div>
    <div class="leaflet__testimonial  |  testimonial testimonial--align-center">
        <div class="testimonial__tile  |  gutters">
            <sg-insert>4.8.6-1</sg-insert>
        </div>
        <div class="testimonial__quote  |  gutters">
            <sg-insert>3.30</sg-insert>
        </div>
    </div>
    <div class="leaflet__shoots">
        <h3 class="title  |  trailer--tiny  |  gutters">Greenshoots for the future</h3>
        <p class="body--whisper  |  trailer  |  gutters">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        <div class="grid grid--posts  |  grid-decoration  |  gutters">
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">60</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">60 </span>people from different ACP and European countries</figcaption>
            </figure>
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">12</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">12 </span>different languages spoken in our offices</figcaption>
            </figure>
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">200</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">200 </span>events attended in the last two years</figcaption>
            </figure>
            <figure class="stat  |  grid__cell">
                <p class="stat__figure  |  trailer">500</p>
                <figcaption class="stat__caption  |  meta meta--s  |  gutters"><span class="is-narrative">500 </span>tons of magazines published in the last three years</figcaption>
            </figure>
        </div>
    </div>
    <div class="leaflet__tile  |  gutters">
        <sg-insert>4.8.6-2</sg-insert>
    </div>
    <div class="leaflet__tile  |  gutters">
        <sg-insert>4.8.6-2</sg-insert>
    </div>
</div>

Styleguide 5.18
*/
.leaflet {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  .no-flexbox .leaflet {
    /**
  * For IE 6/7 only
  */ }
    .no-flexbox .leaflet::before, .no-flexbox .leaflet::after {
      content: " ";
      display: table; }
    .no-flexbox .leaflet::after {
      clear: both; }
  .leaflet__testimonial, .leaflet__tile, .leaflet__shoots {
    padding-top: 15px;
    padding-bottom: 15px; }
  @media only screen and (min-width: 64em) {
    .leaflet__testimonial {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 0 81.25%;
              flex: 0 0 81.25%;
      width: 81.25%; }
      .no-flexbox .leaflet__testimonial {
        max-width: 81.25%; }
    .leaflet__shoots {
      -webkit-box-flex: 62.5%;
         -moz-box-flex: 62.5%;
          -ms-flex: 62.5%;
              flex: 62.5%;
      width: 62.5%;
      -ms-flex-item-align: end;
          align-self: flex-end; }
      .no-flexbox .leaflet__shoots {
        max-width: 62.5%; }
    .leaflet__tile {
      -webkit-box-flex: 18.75%;
         -moz-box-flex: 18.75%;
          -ms-flex: 18.75%;
              flex: 18.75%;
      width: 18.75%; }
      .no-flexbox .leaflet__tile {
        max-width: 18.75%; }
    .no-flexbox .leaflet__testimonial, .no-flexbox .leaflet__shoots, .no-flexbox .leaflet__tile {
      display: inline-block;
      float: left; }
    .leaflet .testimonial__tile {
      -webkit-box-flex: 0;
         -moz-box-flex: 0;
          -ms-flex: 0 0 53.84615%;
              flex: 0 0 53.84615%;
      width: 53.84615%; }
      .no-flexbox .leaflet .testimonial__tile {
        max-width: 53.84615%; } }

/* 5.19 Project menu */
/*
Project menu

Project menu - Open preview in fullscreen

markup:
<div class="project-menu  |  fx is-active">
    <div class="stack">
        <div class="project-menu--toggle  |  stack__unit stack__pin" data-toggle=".project-menu">
            <span class="icon icon--chevron-left"></span>
        </div>
        <div class="project-menu__body  |  stack__unit  |  leader-inside  |  trailer-inside--normal  |  gutters">
            <h2 class="title  |  trailer--normal  |  gutters">Our projects</h2>
            <div class="media  |  gutters  |  trailer--small">
                <div class="media__figure">
                    <span class="legenda__item--identifier legenda__item--identifier-l legenda__item--blue"></span>
                </div>
                <div class="media__body">
                    <a class="block-link  |  is-heir  |  gutter--right" href="#tile-112949e5-80eb-4738-aacd-3d636fa307e1">Promoting Nutritious Food Systems in the Pacific Islands</a>
                </div>
            </div>
            <div class="media  |  gutters  |  trailer--small">
                <div class="media__figure">
                    <span class="legenda__item--identifier legenda__item--identifier-l legenda__item--yellow"></span>
                </div>
                <div class="media__body">
                    <a class="block-link  |  is-heir  |  gutter--right" href="#tile-ae9374a7-f48f-4707-8efa-4426769e8a56">Promoting Climate-Resilient Agrifood Solutions in Southern Africa</a>
                </div>
            </div>
            <div class="media  |  gutters  |  trailer--small">
                <div class="media__figure">
                    <span class="legenda__item--identifier legenda__item--identifier-l legenda__item--"></span>
                </div>
                <div class="media__body">
                    <a class="block-link  |  is-heir  |  gutter--right" href="#tile-"></a>
                </div>
            </div>
            <div class="media  |  gutters  |  trailer--small">
                <div class="media__figure">
                    <span class="legenda__item--identifier legenda__item--identifier-l legenda__item--"></span>
                </div>
                <div class="media__body">
                    <a class="block-link  |  is-heir  |  gutter--right" href="#tile-"></a>
                </div>
            </div>
            <div class="media  |  gutters  |  trailer--small">
                <div class="media__figure">
                    <span class="legenda__item--identifier legenda__item--identifier-l legenda__item--"></span>
                </div>
                <div class="media__body">
                    <a class="block-link  |  is-heir  |  gutter--right" href="#tile-"></a>
                </div>
            </div>
        </div>
    </div>
</div>

Styleguide 5.19
*/
.project-menu {
  position: fixed;
  top: 50%;
  right: -83.33333vw;
  z-index: 11;
  /* Contextual search illustration have a z-index of 10. */
  -webkit-transform: translateY(-50%);
     -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%); }
  @media only screen and (min-width: 48em) {
    .project-menu {
      right: -33.33333vw; } }
  @media only screen and (min-width: 90em) {
    .project-menu {
      right: -22.22222vw; } }
  .project-menu.is-active {
    right: 0; }
  .project-menu--toggle {
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    color: #fff;
    background: #67ab43;
    width: 30px;
    font-size: 1.5em;
    cursor: pointer; }
    .no-flexbox .project-menu--toggle {
      text-align: center;
      vertical-align: middle; }
    .theme--blue .project-menu--toggle {
      background: #56c0dd; }
    .theme--lime .project-menu--toggle {
      background-color: #c1d435; }
    .theme--yellow .project-menu--toggle {
      background-color: #facf21; }
    .theme--gold .project-menu--toggle {
      background-color: #eb942c; }
    .theme--orange .project-menu--toggle {
      background-color: #e26435; }
    .theme--salmon .project-menu--toggle {
      background-color: #eb735d; }
    .theme--red .project-menu--toggle {
      background-color: #ec2d10; }
    .theme--burgundy .project-menu--toggle {
      background-color: #ba222a; }
    .theme--purple .project-menu--toggle {
      background-color: #9b3381; }
    .is-active .project-menu--toggle .icon--chevron-left:before {
      content: ""; }
    @media only screen and (min-width: 48em) {
      .project-menu--toggle {
        width: 45px; } }
  .project-menu__body {
    background: #fff;
    width: 83.33333vw; }
    @media only screen and (min-width: 48em) {
      .project-menu__body {
        width: 33.33333vw; } }
    @media only screen and (min-width: 64em) {
      .project-menu__body {
        background: rgba(255, 255, 255, 0.8); } }
    @media only screen and (min-width: 90em) {
      .project-menu__body {
        width: 22.22222vw; } }

/* 5.20 Carousel */
/*
Carousel

Carousel cannot be displayed on the styleguide due to a javascript dependency

Styleguide 5.20
*/
.carousel {
  display: block; }
  .carousel--wrapper, .carousel--article {
    position: relative; }
  .no-flexbox .carousel--wrapper {
    overflow: hidden; }
  .carousel--row {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow-x: scroll; }
    .no-flexbox .carousel--row {
      width: 200vw; }
  .carousel--article {
    width: 66.66667vw;
    -webkit-box-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1 0 66.66667vw;
            flex: 1 0 66.66667vw; }
    .no-flexbox .carousel--article {
      display: inline-block;
      float: left; }
    .carousel--article__author {
      position: absolute;
      top: 15px;
      left: 15px;
      background: rgba(255, 255, 255, 0.84); }
    .carousel--article .topic-teaser {
      padding: 15px;
      min-height: 78px;
      /* Totally arbitrary min height based on two title row heights */ }
  .carousel-switch {
    background-color: #67ab43;
    background-color: #67ab43;
    position: absolute;
    top: 25%;
    -webkit-transform: translateY(-75%);
       -moz-transform: translateY(-75%);
        -ms-transform: translateY(-75%);
            transform: translateY(-75%);
    width: 63px;
    height: 63px;
    font-size: 1.875em;
    color: #fff; }
    .carousel-switch.theme--dark,
    .theme--dark .carousel-switch,
    .theme .theme--dark .carousel-switch {
      background-color: #3d3d3d;
      background-color: #3d3d3d; }
    .carousel-switch.theme--green,
    .theme--green .carousel-switch,
    .theme .theme--green .carousel-switch {
      background-color: #67ab43;
      background-color: #67ab43; }
    .carousel-switch.theme--blue,
    .theme--blue .carousel-switch,
    .theme .theme--blue .carousel-switch {
      background-color: #56c0dd;
      background-color: #56c0dd; }
    .carousel-switch.theme--lime,
    .theme--lime .carousel-switch,
    .theme .theme--lime .carousel-switch {
      background-color: #c1d435;
      background-color: #c1d435; }
    .carousel-switch.theme--yellow,
    .theme--yellow .carousel-switch,
    .theme .theme--yellow .carousel-switch {
      background-color: #facf21;
      background-color: #facf21; }
    .carousel-switch.theme--gold,
    .theme--gold .carousel-switch,
    .theme .theme--gold .carousel-switch {
      background-color: #eb942c;
      background-color: #eb942c; }
    .carousel-switch.theme--orange,
    .theme--orange .carousel-switch,
    .theme .theme--orange .carousel-switch {
      background-color: #e26435;
      background-color: #e26435; }
    .carousel-switch.theme--salmon,
    .theme--salmon .carousel-switch,
    .theme .theme--salmon .carousel-switch {
      background-color: #eb735d;
      background-color: #eb735d; }
    .carousel-switch.theme--red,
    .theme--red .carousel-switch,
    .theme .theme--red .carousel-switch {
      background-color: #ec2d10;
      background-color: #ec2d10; }
    .carousel-switch.theme--burgundy,
    .theme--burgundy .carousel-switch,
    .theme .theme--burgundy .carousel-switch {
      background-color: #ba222a;
      background-color: #ba222a; }
    .carousel-switch.theme--purple,
    .theme--purple .carousel-switch,
    .theme .theme--purple .carousel-switch {
      background-color: #9b3381;
      background-color: #9b3381; }
    .carousel-switch.theme--youth,
    .theme--youth .carousel-switch,
    .theme .theme--youth .carousel-switch {
      background-color: #d57800;
      background-color: #d57800; }
    .carousel-switch.theme--digitalisation,
    .theme--digitalisation .carousel-switch,
    .theme .theme--digitalisation .carousel-switch {
      background-color: #9a3324;
      background-color: #9a3324; }
    .carousel-switch.theme--climate,
    .theme--climate .carousel-switch,
    .theme .theme--climate .carousel-switch {
      background-color: #693c5e;
      background-color: #693c5e; }
    .carousel-switch.theme--gender,
    .theme--gender .carousel-switch,
    .theme .theme--gender .carousel-switch {
      background-color: #046a38;
      background-color: #046a38; }
    .carousel-switch.theme--nutrition,
    .theme--nutrition .carousel-switch,
    .theme .theme--nutrition .carousel-switch {
      background-color: #487a7b;
      background-color: #487a7b; }
    .carousel-switch.theme--blog,
    .theme--blog .carousel-switch,
    .theme .theme--blog .carousel-switch {
      background-color: #FFA300;
      background-color: #ffa300; }
    .carousel-switch.theme--spore-blue,
    .theme--spore-blue .carousel-switch,
    .theme .theme--spore-blue .carousel-switch {
      background-color: #3f68b1;
      background-color: #3f68b1; }
    .carousel-switch.theme--spore-brown,
    .theme--spore-brown .carousel-switch,
    .theme .theme--spore-brown .carousel-switch {
      background-color: #774b04;
      background-color: #774b04; }
    .carousel-switch.theme--spore-dark-blue,
    .theme--spore-dark-blue .carousel-switch,
    .theme .theme--spore-dark-blue .carousel-switch {
      background-color: #044e7e;
      background-color: #044e7e; }
    .carousel-switch.theme--spore-forest-green,
    .theme--spore-forest-green .carousel-switch,
    .theme .theme--spore-forest-green .carousel-switch {
      background-color: #5f810a;
      background-color: #5f810a; }
    .carousel-switch.theme--spore-grey-blue,
    .theme--spore-grey-blue .carousel-switch,
    .theme .theme--spore-grey-blue .carousel-switch {
      background-color: #6d8c9f;
      background-color: #6d8c9f; }
    .carousel-switch.theme--spore-light-blue,
    .theme--spore-light-blue .carousel-switch,
    .theme .theme--spore-light-blue .carousel-switch {
      background-color: #79accf;
      background-color: #79accf; }
    .carousel-switch.theme--spore-lime,
    .theme--spore-lime .carousel-switch,
    .theme .theme--spore-lime .carousel-switch {
      background-color: #bbae03;
      background-color: #bbae03; }
    .carousel-switch.theme--spore-ochre,
    .theme--spore-ochre .carousel-switch,
    .theme .theme--spore-ochre .carousel-switch {
      background-color: #db9623;
      background-color: #db9623; }
    .carousel-switch.theme--spore-olive-green,
    .theme--spore-olive-green .carousel-switch,
    .theme .theme--spore-olive-green .carousel-switch {
      background-color: #778d3e;
      background-color: #778d3e; }
    .carousel-switch.theme--spore-red,
    .theme--spore-red .carousel-switch,
    .theme .theme--spore-red .carousel-switch {
      background-color: #f54c23;
      background-color: #f54c23; }
    .carousel-switch.theme--spore-taupe,
    .theme--spore-taupe .carousel-switch,
    .theme .theme--spore-taupe .carousel-switch {
      background-color: #7b6d65;
      background-color: #7b6d65; }
    .carousel-switch.theme--spore-teal,
    .theme--spore-teal .carousel-switch,
    .theme .theme--spore-teal .carousel-switch {
      background-color: #077fc1;
      background-color: #077fc1; }
    .carousel-switch:first-of-type {
      left: 0; }
    .carousel-switch:last-of-type {
      right: 0; }
    .slideshow__container .carousel-switch {
      top: 50%;
      -webkit-transform: translateY(-50%);
         -moz-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
              transform: translateY(-50%); }
      .slideshow__container .carousel-switch .icon, .slideshow__container .carousel-switch .list--take-aways li:before, .list--take-aways .slideshow__container .carousel-switch li:before, .slideshow__container .carousel-switch .list--theme li:before, .list--theme .slideshow__container .carousel-switch li:before, .slideshow__container .carousel-switch .filter__trigger:after, .slideshow__container .carousel-switch .block-link--icon:before, .slideshow__container .carousel-switch .panel.is-inactive .panel__trigger:after, .panel.is-inactive .slideshow__container .carousel-switch .panel__trigger:after, .slideshow__container .carousel-switch .tail__lengthen:before, .slideshow__container .carousel-switch .tail__lengthen:after, .slideshow__container .carousel-switch .tail__shorten:before, .slideshow__container .carousel-switch .tail__shorten:after {
        display: block;
        line-height: 1; }
      @media only screen and (max-width: 63.9375em) {
        .slideshow__container .carousel-switch {
          width: 43px;
          height: 43px; } }
  .carousel__content {
    position: absolute;
    top: 0;
    right: 15px;
    bottom: 0;
    left: 15px; }
  @media only screen and (min-width: 48em) {
    .carousel-switch {
      top: 50%;
      -webkit-transform: translateY(-50%);
         -moz-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
              transform: translateY(-50%); } }
  @media only screen and (min-width: 64em) {
    .carousel--article__author {
      top: auto;
      bottom: 30px;
      left: 30px; }
    .carousel--article .topic-teaser {
      position: absolute;
      left: 30px;
      top: 30px;
      margin-right: 33.33333vw;
      background-color: #67ab43;
      background-color: rgba(103, 171, 67, 0.84); }
      .carousel--article .topic-teaser.theme--dark,
      .theme--dark .carousel--article .topic-teaser,
      .theme .theme--dark .carousel--article .topic-teaser {
        background-color: #3d3d3d;
        background-color: rgba(61, 61, 61, 0.84); }
      .carousel--article .topic-teaser.theme--green,
      .theme--green .carousel--article .topic-teaser,
      .theme .theme--green .carousel--article .topic-teaser {
        background-color: #67ab43;
        background-color: rgba(103, 171, 67, 0.84); }
      .carousel--article .topic-teaser.theme--blue,
      .theme--blue .carousel--article .topic-teaser,
      .theme .theme--blue .carousel--article .topic-teaser {
        background-color: #56c0dd;
        background-color: rgba(86, 192, 221, 0.84); }
      .carousel--article .topic-teaser.theme--lime,
      .theme--lime .carousel--article .topic-teaser,
      .theme .theme--lime .carousel--article .topic-teaser {
        background-color: #c1d435;
        background-color: rgba(193, 212, 53, 0.84); }
      .carousel--article .topic-teaser.theme--yellow,
      .theme--yellow .carousel--article .topic-teaser,
      .theme .theme--yellow .carousel--article .topic-teaser {
        background-color: #facf21;
        background-color: rgba(250, 207, 33, 0.84); }
      .carousel--article .topic-teaser.theme--gold,
      .theme--gold .carousel--article .topic-teaser,
      .theme .theme--gold .carousel--article .topic-teaser {
        background-color: #eb942c;
        background-color: rgba(235, 148, 44, 0.84); }
      .carousel--article .topic-teaser.theme--orange,
      .theme--orange .carousel--article .topic-teaser,
      .theme .theme--orange .carousel--article .topic-teaser {
        background-color: #e26435;
        background-color: rgba(226, 100, 53, 0.84); }
      .carousel--article .topic-teaser.theme--salmon,
      .theme--salmon .carousel--article .topic-teaser,
      .theme .theme--salmon .carousel--article .topic-teaser {
        background-color: #eb735d;
        background-color: rgba(235, 115, 93, 0.84); }
      .carousel--article .topic-teaser.theme--red,
      .theme--red .carousel--article .topic-teaser,
      .theme .theme--red .carousel--article .topic-teaser {
        background-color: #ec2d10;
        background-color: rgba(236, 45, 16, 0.84); }
      .carousel--article .topic-teaser.theme--burgundy,
      .theme--burgundy .carousel--article .topic-teaser,
      .theme .theme--burgundy .carousel--article .topic-teaser {
        background-color: #ba222a;
        background-color: rgba(186, 34, 42, 0.84); }
      .carousel--article .topic-teaser.theme--purple,
      .theme--purple .carousel--article .topic-teaser,
      .theme .theme--purple .carousel--article .topic-teaser {
        background-color: #9b3381;
        background-color: rgba(155, 51, 129, 0.84); }
      .carousel--article .topic-teaser.theme--youth,
      .theme--youth .carousel--article .topic-teaser,
      .theme .theme--youth .carousel--article .topic-teaser {
        background-color: #d57800;
        background-color: rgba(213, 120, 0, 0.84); }
      .carousel--article .topic-teaser.theme--digitalisation,
      .theme--digitalisation .carousel--article .topic-teaser,
      .theme .theme--digitalisation .carousel--article .topic-teaser {
        background-color: #9a3324;
        background-color: rgba(154, 51, 36, 0.84); }
      .carousel--article .topic-teaser.theme--climate,
      .theme--climate .carousel--article .topic-teaser,
      .theme .theme--climate .carousel--article .topic-teaser {
        background-color: #693c5e;
        background-color: rgba(105, 60, 94, 0.84); }
      .carousel--article .topic-teaser.theme--gender,
      .theme--gender .carousel--article .topic-teaser,
      .theme .theme--gender .carousel--article .topic-teaser {
        background-color: #046a38;
        background-color: rgba(4, 106, 56, 0.84); }
      .carousel--article .topic-teaser.theme--nutrition,
      .theme--nutrition .carousel--article .topic-teaser,
      .theme .theme--nutrition .carousel--article .topic-teaser {
        background-color: #487a7b;
        background-color: rgba(72, 122, 123, 0.84); }
      .carousel--article .topic-teaser.theme--blog,
      .theme--blog .carousel--article .topic-teaser,
      .theme .theme--blog .carousel--article .topic-teaser {
        background-color: #FFA300;
        background-color: rgba(255, 163, 0, 0.84); }
      .carousel--article .topic-teaser.theme--spore-blue,
      .theme--spore-blue .carousel--article .topic-teaser,
      .theme .theme--spore-blue .carousel--article .topic-teaser {
        background-color: #3f68b1;
        background-color: rgba(63, 104, 177, 0.84); }
      .carousel--article .topic-teaser.theme--spore-brown,
      .theme--spore-brown .carousel--article .topic-teaser,
      .theme .theme--spore-brown .carousel--article .topic-teaser {
        background-color: #774b04;
        background-color: rgba(119, 75, 4, 0.84); }
      .carousel--article .topic-teaser.theme--spore-dark-blue,
      .theme--spore-dark-blue .carousel--article .topic-teaser,
      .theme .theme--spore-dark-blue .carousel--article .topic-teaser {
        background-color: #044e7e;
        background-color: rgba(4, 78, 126, 0.84); }
      .carousel--article .topic-teaser.theme--spore-forest-green,
      .theme--spore-forest-green .carousel--article .topic-teaser,
      .theme .theme--spore-forest-green .carousel--article .topic-teaser {
        background-color: #5f810a;
        background-color: rgba(95, 129, 10, 0.84); }
      .carousel--article .topic-teaser.theme--spore-grey-blue,
      .theme--spore-grey-blue .carousel--article .topic-teaser,
      .theme .theme--spore-grey-blue .carousel--article .topic-teaser {
        background-color: #6d8c9f;
        background-color: rgba(109, 140, 159, 0.84); }
      .carousel--article .topic-teaser.theme--spore-light-blue,
      .theme--spore-light-blue .carousel--article .topic-teaser,
      .theme .theme--spore-light-blue .carousel--article .topic-teaser {
        background-color: #79accf;
        background-color: rgba(121, 172, 207, 0.84); }
      .carousel--article .topic-teaser.theme--spore-lime,
      .theme--spore-lime .carousel--article .topic-teaser,
      .theme .theme--spore-lime .carousel--article .topic-teaser {
        background-color: #bbae03;
        background-color: rgba(187, 174, 3, 0.84); }
      .carousel--article .topic-teaser.theme--spore-ochre,
      .theme--spore-ochre .carousel--article .topic-teaser,
      .theme .theme--spore-ochre .carousel--article .topic-teaser {
        background-color: #db9623;
        background-color: rgba(219, 150, 35, 0.84); }
      .carousel--article .topic-teaser.theme--spore-olive-green,
      .theme--spore-olive-green .carousel--article .topic-teaser,
      .theme .theme--spore-olive-green .carousel--article .topic-teaser {
        background-color: #778d3e;
        background-color: rgba(119, 141, 62, 0.84); }
      .carousel--article .topic-teaser.theme--spore-red,
      .theme--spore-red .carousel--article .topic-teaser,
      .theme .theme--spore-red .carousel--article .topic-teaser {
        background-color: #f54c23;
        background-color: rgba(245, 76, 35, 0.84); }
      .carousel--article .topic-teaser.theme--spore-taupe,
      .theme--spore-taupe .carousel--article .topic-teaser,
      .theme .theme--spore-taupe .carousel--article .topic-teaser {
        background-color: #7b6d65;
        background-color: rgba(123, 109, 101, 0.84); }
      .carousel--article .topic-teaser.theme--spore-teal,
      .theme--spore-teal .carousel--article .topic-teaser,
      .theme .theme--spore-teal .carousel--article .topic-teaser {
        background-color: #077fc1;
        background-color: rgba(7, 127, 193, 0.84); }
      .carousel--article .topic-teaser__title {
        margin-bottom: 0; } }
  @media only screen and (min-width: 90em) {
    .carousel--article {
      width: 66.66667vw;
      -webkit-box-flex: 1;
         -moz-box-flex: 1;
          -ms-flex: 1 0 66.66667vw;
              flex: 1 0 66.66667vw; }
      .carousel--article__author {
        left: 60px; }
      .carousel--article .topic-teaser {
        left: 60px;
        top: 60px;
        margin-right: 27.77778vw; } }

/* 5.21 Project header */
/*
Project header

markup:
<header class="trailer--hero">
    <div class="ie9-hero">
        <picture class="not-crown article-header__image  |  image image--stretch">
            <source media="(max-width: 767px) and (orientation: portrait)" srcset="https://res.cloudinary.com/cta/image/upload/w_1536,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1536w,https://res.cloudinary.com/cta/image/upload/w_1334,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1334w,https://res.cloudinary.com/cta/image/upload/w_1136,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1136w,https://res.cloudinary.com/cta/image/upload/w_960,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 960w,https://res.cloudinary.com/cta/image/upload/w_768,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 768w,https://res.cloudinary.com/cta/image/upload/w_667,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 667w,https://res.cloudinary.com/cta/image/upload/w_568,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 568w,https://res.cloudinary.com/cta/image/upload/w_480,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 480w" sizes="100vw">
            <source media="(max-width: 767px) and (orientation: landscape)" srcset="https://res.cloudinary.com/cta/image/upload/w_1536,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1536w,https://res.cloudinary.com/cta/image/upload/w_1334,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1334w,https://res.cloudinary.com/cta/image/upload/w_1136,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1136w,https://res.cloudinary.com/cta/image/upload/w_960,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 960w,https://res.cloudinary.com/cta/image/upload/w_768,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 768w,https://res.cloudinary.com/cta/image/upload/w_667,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 667w,https://res.cloudinary.com/cta/image/upload/w_568,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 568w,https://res.cloudinary.com/cta/image/upload/w_480,ar_3:2,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 480w" sizes="100vw">
            <source media="(min-width: 768px) and (max-width: 1024px)" srcset="https://res.cloudinary.com/cta/image/upload/w_2048,ar_2:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 2048w,https://res.cloudinary.com/cta/image/upload/w_1536,ar_2:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1536w,https://res.cloudinary.com/cta/image/upload/w_1024,ar_2:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1024w,https://res.cloudinary.com/cta/image/upload/w_768,ar_2:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 768w" sizes="100vw">
            <source media="(min-height: 800px) and (max-height: 1280px) and (min-width: 800px) and (max-width: 1280px) and (orientation: portrait)" srcset="https://res.cloudinary.com/cta/image/upload/w_1600,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1600w,https://res.cloudinary.com/cta/image/upload/w_800,ar_2:3,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 800w" sizes="100vw">
            <source media="(min-width: 1280px) and (max-width: 600px) and (orientation: landscape)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_3:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 2560w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_3:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1280w" sizes="100vw">
            <source media="(min-aspect-ratio: 16/9) and (min-width: 1800px)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:5,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:5,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:5,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:5,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:5,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1280w" sizes="100vw">
            <source media="(min-aspect-ratio: 1/1)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:6,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:6,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:6,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:6,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:6,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1280w" sizes="100vw">
            <source media="(max-aspect-ratio: 1/1)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:8,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:8,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:8,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:8,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:8,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 1280w" sizes="100vw">
            <img class="article-header__image  |  image image--stretch" src="https://res.cloudinary.com/cta/image/upload/w_480,ar_1:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd" srcset="https://res.cloudinary.com/cta/image/upload/w_960,ar_1:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 960w,https://res.cloudinary.com/cta/image/upload/w_480,ar_1:1,g_faces:center,f_auto,c_fill/qytec3abmjuedugomwnd 480w" sizes="100vw" alt="Leading image">
        </picture>
    </div>
    <div class="article-headline  |  layout layout--align-middle  |  wings">
        <div class="layout__cell  |  gutters">
            <div class="leader  |  trailer">
                <h1 class="article-headline__title  |  title title--headline">Promoting Nutritious Food Systems in the Pacific Islands</h1>
            </div>
        </div>
        <div class="layout__cell layout__cell--aside  |  gutters  |  wings  |  caption--right">
            <p class="caption  |  gutters">about text</p>
            <p class="credit  |  gutters">© Alamy stock images</p>
        </div>
    </div>
</header>

Styleguide 5.21
*/
/* 5.22 Project body */
/*
Project Body

markup:
<div class="layout layout--split">
    <div class="layout__cell layout__cell--main  |  trailer-inside--hero  |  divider divider--right">
        <div class="wings">
            <div class="social__share  |  trailer  |  gutters">
                <ul class="share-list reset list--float">
                    <li class="share-list__item divider  divider--left">
                        <a class="label share share--whisper share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=&amp;redirect_uri=http://cta.platform.local/en/project/promoting-nutritious-food-systems-in-the-pacific-islands-sid0112949e5-80eb-4738-aacd-3d636fa307e1&amp;link=http://cta.platform.local/en/project/promoting-nutritious-food-systems-in-the-pacific-islands-sid0112949e5-80eb-4738-aacd-3d636fa307e1" target="_blank">
                            <span data-icon="facebook" class="icon icon--facebook">
                                <span>
                                    <span class="is-narrative">Share on Facebook</span>
                                </span>
                            </span>
                        </a>
                    </li>
                    <li class="share-list__item divider  divider--left">
                        <a class="label share share--whisper share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/project/promoting-nutritious-food-systems-in-the-pacific-islands-sid0112949e5-80eb-4738-aacd-3d636fa307e1" target="_blank">
                            <span data-icon="twitter" class="icon icon--twitter">
                                <span>
                                    <span class="is-narrative">Share on Twitter</span>
                                </span>
                            </span>
                        </a>
                    </li>
                    <li class="share-list__item divider  divider--left">
                        <a class="label share share--whisper share--print" title="Print" href="javascript:print();">
                            <span data-icon="print" class="icon icon--print">
                                <span>
                                    <span class="is-narrative">Print</span>
                                </span>
                            </span>
                        </a>
                    </li>
                    <li class="share-list__item divider  divider--left">
                        <a class="label share share--whisper share--email" title="Send link via E-mail" href="mailto:?subject=&amp;body=">
                            <span data-icon="email" class="icon icon--envelope">
                                <span>
                                    <span class="is-narrative">Send link via E-mail</span>
                                </span>
                            </span>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="post-body">
                <h2 class="heading  |  gutters">The aim</h2>
                <p class="paragraph  |  gutters">The aim of this project is to strengthen the capacity of the Pacific island governments, farmer and private-sector organisations and subregional institutions to develop innovative strategies and programmes that can increase poor rural
                    people’s access to nutritious and healthy food and to mobilise the funds needed to deliver these.</p>
                <h2 class="heading  |  gutters">The approach&nbsp;</h2>
                <p class="paragraph  |  gutters">The project aims at improving local food supply, income and nutrition outcomes by building value-chain-specific public-private partnerships (value-chain coordination/agricultural innovation platforms) and effective linkages between knowledge
                    institutes, government and industry to drive innovation and attract investments. To achieve this, the project employs a three-pronged approach: • Analyse – Build the evidence base • Act – Build capacity for change • Advocate – Share
                    practices and lobby for policy change and development impact at scale. Local communities and public and private actors will participate and drive the setting of the agenda for an innovative agricultural sector that will contribute
                    to better nutrition, higher incomes and a sustainable agri-food system.<br></p>
                <h2 class="heading  |  gutters">The beneficiaries</h2>
                <p class="paragraph  |  gutters">Direct</p>
                <div class="paragraph  |  gutters">
                    <ul>
                        <li>Governments and public national and sub-regional agencies&nbsp;</li>
                        <li>Private agro-enterprises (including those owned by women and young people)&nbsp;</li>
                        <li>Decision-makers in international organisations and NGOs&nbsp;</li>
                        <li>Producers and community-based organisations (including farmers’ organisations)&nbsp;</li>
                        <li>Financiers<br></li>
                    </ul>
                </div>
                <p class="paragraph  |  gutters">Indirect</p>
                <div class="paragraph  |  gutters">
                    <ul>
                        <li>Farmer and fisherfolk households&nbsp;</li>
                        <li>Rural communities&nbsp;</li>
                        <li>Women<br></li>
                    </ul>
                </div>
                <h2 class="heading  |  gutters">The impact</h2>
                <p class="paragraph  |  gutters">Increased nutritional status and long-term financial and physical health of poor rural communities, especially women and young children. Increased production and consumption of local nutritious, culturally and environmentally sensitive
                    foods and fish. Innovative approaches to public-private partnerships in addressing food and nutrition challenges and designing policies that stimulate development. Cooperation programmes that speed the development of agribusinesses
                    that support local crop and fisheries value chains and food systems.</p>
                <h2 class="heading  |  gutters">The long view</h2>
                <p class="paragraph  |  gutters">Develop innovative profitable and sustainable value chains with focus on increased production of nutritious foods for local consumption and export driven by agribusinesses and 40.000 farmers and fisher folk. Strategic partnerships with
                    governments, private sector, universities, international organisations and farming communities to ensure best practices and successful initiatives are scaled up and taken up by other countries.</p>
                <h2 class="heading  |  gutters">Activities</h2>
                <div class="paragraph  |  gutters">
                    <ul>
                        <li>Mainstreaming nutritionally, culturally and environmentally sensitive value chains: (I) identification of local food crops and fisheries value chains, and (II) policy, regulatory and institutional constraints, (III) design of private-
                            and public-sector strategies and interventions for value-chain development and their mainstreaming into national development frameworks and sectoral development plans.&nbsp;</li>
                        <li>National and sub-regional policy dialogue, and partnership development: (I) development of action plans for the selected value chains through sub-regional and national forums, roundtable workshops, and consultations, (II) provision
                            of technical assistance for local business plan development, (III) drafting of supporting regulations and policies and participatory integrated business development plans and landscape and fisheries management plans.&nbsp;</li>
                        <li>Monitoring and evaluation: (i) development of baselines, (ii) tracking and reporting on progress, and (iii) final evaluation.&nbsp;</li>
                        <li>A knowledge management and communication plan with a strong focus on using innovative information and communication technologies is implemented. Gender sensitive approach is mainstreamed in all activities.<br></li>
                    </ul>
                </div>
                <div class="gutters  |  trailer  |  leader">
                    <ul class="reset  |  tag-list  |  list--inline">
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_8420">women</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_5487">Pacific Islands</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_49892">nutrition</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_3017">Food crops</a>
                        </li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_1666">climate change</a>
                        </li>
                    </ul>
                </div>
                <div class="well well--slim-fit  |  gutters-outside  |  leader  |  trailer">
                    <ul class="share-list reset list--float">
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=&amp;redirect_uri=http://cta.platform.local/en/project/promoting-nutritious-food-systems-in-the-pacific-islands-sid0112949e5-80eb-4738-aacd-3d636fa307e1&amp;link=http://cta.platform.local/en/project/promoting-nutritious-food-systems-in-the-pacific-islands-sid0112949e5-80eb-4738-aacd-3d636fa307e1" target="_blank">
                                <span data-icon="facebook" class="icon icon--facebook">
                                    <span>
                                        <span class="is-narrative">Share on Facebook</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/project/promoting-nutritious-food-systems-in-the-pacific-islands-sid0112949e5-80eb-4738-aacd-3d636fa307e1" target="_blank">
                                <span data-icon="twitter" class="icon icon--twitter">
                                    <span>
                                        <span class="is-narrative">Share on Twitter</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--print" title="Print" href="javascript:print();">
                                <span data-icon="print" class="icon icon--print">
                                    <span>
                                        <span class="is-narrative">Print</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--email" title="Send link via E-mail" href="mailto:?subject=&amp;body=">
                                <span data-icon="email" class="icon icon--envelope">
                                    <span>
                                        <span class="is-narrative">Send link via E-mail</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="layout__cell layout__cell--aside  |  stack stack--stacked">
        <aside class="trailer--hero  |  wings">
            <div class="gutters">
                <div class="mini-map-statistics  |  well--neutral  |  project-map">
                    <div class="media">
                        <div class="media__body  |  divider divider--inverse divider--right">
                            <div class="mini-map__map">
                                <figure class="tab-teaser__panel--map" style="background-image: url(/images/maps/2363254.png);">
                                    <img class="is-narrative" src="/images/maps/2363254.png" alt="Map of Western Africa" width="840" height="406">
                                    <img class="globe  |  leader  |  trailer  |  gutters-outside  |  fx" src="/images/globes/2363254.png" alt="Picture of the globe with Western Africa highlighted." width="214" height="214">
                                    <figcaption class="is-narrative">
                                        <p>2363254</p>
                                    </figcaption>
                                </figure>
                            </div>
                            <div class="timeline timeline--l timeline--bold timeline--10  |  stack  |  divider divider--inverse divider--top">
                                <div class="stack__unit  |  meta">
                                    <div class="timeline__item  |  is-complete  |  gutters">
                                        <span class="timeline__date">2016</span>
                                    </div>
                                </div>
                                <div class="stack__unit  |  meta">
                                    <div class="timeline__item  |  is-complete  |  gutters">
                                        <span class="timeline__date">2017</span>
                                    </div>
                                </div>
                                <div class="stack__unit  |  meta">
                                    <div class="timeline__item  |  is-active  |  gutters">
                                        <span class="timeline__date">2018</span>
                                    </div>
                                </div>
                                <div class="stack__unit  |  meta">
                                    <div class="timeline__item  |    |  gutters">
                                        <span class="timeline__date">2019</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="media__figure  |  trailer-inside--small  |  leader-inside--small">
                            <div class="divider divider--inverse divider--bottom  |  leader-inside--small  |  trailer-inside--small  |  gutters">
                                <div class="mini-map__asset">
                                    <div class="media  |  location">
                                        <div class="media media--middle  |  location">
                                            <span class="location__marker  |  media__figure">
                                                <span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">Location:</span></span>
                                            </span>
                                            <div class="location__body  |  media__content">
                                                <a class="is-heir" href="/en/search?location=2205218">Fiji</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="grid grid--stories  |  leader">
                <div class="grid__cell  |  gutters  |  trailer  |  leader">
                    <h3 class="title  |  trailer--normal">Funders</h3>
                    <div class="media  |  trailer--small">
                        <div class="media__figure">
                            <a href="https://www.ifad.org/" target="_blank">
                                <img class="image" height="50" width="50" src="https://res.cloudinary.com/cta/image/upload/v1496055467/gcpnx4be3zo13cafa4tk.png" alt="">
                            </a>
                        </div>
                        <div class="is-center  |  block-link  |  media__body  |  gutters">IFAD</div>
                    </div>
                    <div class="media  |  trailer--small">
                        <div class="media__figure">
                            <a href="http://www.cta.int" target="_blank">
                                <img class="image" height="50" width="50" src="https://res.cloudinary.com/cta/image/upload/v1494444431/wa0ucd786gupcci4cxqx.png" alt="">
                            </a>
                        </div>
                        <div class="is-center  |  block-link  |  media__body  |  gutters">CTA</div>
                    </div>
                </div>
                <div class="grid__cell  |  gutters  |  trailer  |  leader">
                    <h3 class="title  |  trailer--normal">Implementing organisations</h3>
                    <div class="media  |  trailer--small">
                        <div class="media__figure">
                            <a href="http://www.cta.int" target="_blank">
                                <img class="image" height="50" width="50" src="https://res.cloudinary.com/cta/image/upload/v1494444431/wa0ucd786gupcci4cxqx.png" alt="">
                            </a>
                        </div>
                        <div class="is-center  |  block-link  |  media__body  |  gutters">CTA</div>
                    </div>
                    <div class="media  |  trailer--small">
                        <div class="media__figure">
                            <img class="image" height="50" width="50" src="https://res.cloudinary.com/cta/image/upload/v1494907221/gtgpp7mtr9bojb5nhfgq.png" alt="">
                        </div>
                        <div class="is-center  |  block-link  |  media__body  |  gutters">PIPSO</div>
                    </div>
                </div>
                <div class="grid__cell  |  gutters  |  trailer  |  leader">
                    <h3 class="title  |  trailer--normal">Countries</h3>
                    <ul class="reset">
                        <li class="block-link block-link--theme">Fiji</li>
                        <li class="block-link block-link--theme">Kiribati</li>
                        <li class="block-link block-link--theme">Marshall Islands</li>
                        <li class="block-link block-link--theme">Samoa</li>
                        <li class="block-link block-link--theme">Solomon Islands</li>
                        <li class="block-link block-link--theme">Tonga</li>
                        <li class="block-link block-link--theme">Vanuatu</li>
                        <li class="block-link block-link--theme">Pacific Ocean</li>
                    </ul>
                </div>
                <div class="grid__cell  |  gutters  |  trailer  |  leader">
                    <section class="trailer--hero">
                        <h3 class="title  |  trailer--normal">External links</h3>
                        <div class="media  |  leader--small">
                            <div class="anchor  |  media__figure">
                                <a class="is-heir  |  icon icon--link icon--drop" href="http://www.cta.int" target="_blank"></a>
                            </div>
                            <div class="anchor  |  media__body  |  gutters">
                                <a class="is-heir  |  body--whisper" href="http://www.cta.int" target="_blank">CTA website</a>
                            </div>
                        </div>
                    </section>
                </div>
            </div>
        </aside>
        <div class="divider divider--top  |  wings  |  leader-inside  |  trailer-inside--hero">
            <h2 class="title title--section  |  gutters">Project updates</h2>
            <ul class="reset  |  grid grid--stories">
                <li class="grid__cell  |  leader  |  gutters">
                    <div class="post">
                        <div class="post__content  |  leader-inside">
                            <time class="meta" datetime="2015-09-20T11:10:25+00:00">20 September 2015</time>
                            <h3 class="title  |  anchor--reset">
                                <a class="anchor anchor--shy  |  is-heir" href="/en/article/pacific-islands-agritourism-for-sustainable-growth-sid009db6bfd-4bd0-4833-9c0c-b8a7cb9b23c2">
                                    Pacific Islands: Agritourism for sustainable growth
                                </a>
                            </h3>
                        </div>
                    </div>
                </li>
                <li class="grid__cell  |  leader  |  gutters">
                    <div class="post">
                        <div class="post__content  |  leader-inside">
                            <time class="meta" datetime="2016-12-18T05:46:50+00:00">18 December 2016</time>
                            <h3 class="title  |  anchor--reset">
                                <a class="anchor anchor--shy  |  is-heir" href="/en/article/linking-agriculture-and-tourism-in-samoa-through-policy-setting-sid03d7d7dc3-38e2-4054-ad08-a96d60d7b263">
                                    Linking agriculture and tourism in Samoa through policy setting
                                </a>
                            </h3>
                        </div>
                    </div>
                </li>
                <li class="grid__cell  |  leader  |  gutters">
                    <div class="post">
                        <div class="post__content  |  leader-inside">
                            <time class="meta" datetime="2017-03-18T00:00:00+00:00">18 March 2017</time>
                            <h3 class="title  |  anchor--reset">
                                <a class="anchor anchor--shy  |  is-heir" href="/en/article/topographic-relief-model-captures-the-past-and-present-to-help-plan-the-future-of-nauru-sid0bd1cf6a4-a421-429d-9f4a-84f883d138f9">
                                    Topographic relief model captures the past and present to help plan the future of Nauru
                                </a>
                            </h3>
                        </div>
                    </div>
                </li>
                <li class="grid__cell  |  leader  |  gutters">
                    <div class="post">
                        <div class="post__content  |  leader-inside">
                            <time class="meta" datetime="2017-01-11T12:50:52+00:00">11 January 2017</time>
                            <h3 class="title  |  anchor--reset">
                                <a class="anchor anchor--shy  |  is-heir" href="/en/article/tackling-obesity-in-the-pacific-islands-sid0f9c9bd02-e3ea-4177-b179-a307093fc1eb">
                                    Tackling obesity in the Pacific Islands
                                </a>
                            </h3>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="divider divider--top  |  wings  |  leader-inside  |  trailer-inside--hero">
            <h2 class="title title--section  |  trailer--small  |  gutters">Related projects</h2>
            <ul class="reset  |  grid grid--stories">
                <li class="grid__cell  |  post  |  leader  |  gutters">
                    <h3 class="title  |  anchor--reset">
                        <a class="anchor anchor--shy  |  is-heir" href="/en/project/enhancing-market-response-to-resilience-in-livestock-value-chain-in-eastern-africa-sid04b14cf44-324d-4e84-96f0-1648f688be1f">
                            Enhancing market response to resilience in livestock value chain in Eastern Africa
                        </a>
                    </h3>
                </li>
                <li class="grid__cell  |  post  |  leader  |  gutters">
                    <h3 class="title  |  anchor--reset">
                        <a class="anchor anchor--shy  |  is-heir" href="/en/project/sustainable-and-profitable-value-chains-and-agribusinesses-in-the-caribbean-sid02eba1de3-bddb-4b66-845b-26987f34144d">
                            Sustainable and profitable value chains and agribusinesses in the Caribbean
                        </a>
                    </h3>
                </li>
                <li class="grid__cell  |  post  |  leader  |  gutters">
                    <h3 class="title  |  anchor--reset">
                        <a class="anchor anchor--shy  |  is-heir" href="/en/project/promoting-climate-resilient-agrifood-solutions-in-southern-africa-sid0ae9374a7-f48f-4707-8efa-4426769e8a56">
                            Promoting Climate-Resilient Agrifood Solutions in Southern Africa
                        </a>
                    </h3>
                </li>
            </ul>
        </div>
    </div>
</div>

Styleguide 5.22
*/
/* 5.23 Error */
/*
404 Page

markup:
<sg-insert>5.1-1</sg-insert>
<div class="divider divider--top">
	<div class="layout  |  leader--giant">
		<div class="layout__cell">
			<div class="layout layout__even">
				<div class="layout__cell  |  body--align-center">
					<h1 class="title title--error">404</h1>
					<p class="block-link block-link--theme">Page not found</p>
				</div>
				<div class="layout__cell  |  error  |  leader  |  gutters">
					<h2 class="title title--section title--thin  |  trailer">We can't seem to find the page you are looking for.</h2>
					<p class="trailer--small  |  error-message">You may have typed the address incorrectly or you may have used an outdated link.</p>
					<p class="error-message">Please go back to the <a href="#">home page</a> or use the above navigation bar to choose a new direction.</p>
				</div>
			</div>
		</div>
	</div>
	<span class="illustration illustration--fishing-boat"></span>
	<div class="trailer--giant"></div>
</div>

Styleguide 5.23
*/
.error {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center; }
  .error-message {
    color: #6c6c6c;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }
  @media only screen and (min-width: 48em) {
    .error-illustrations--wrapper {
      margin-top: 120px;
      margin-bottom: 180px; } }
  .error-illustrations .water-illustration,
  .error-illustrations .illustration--fishing-boat {
    color: #c5c5c5; }
    @media only screen and (max-width: 47.9375em) {
      .error-illustrations .water-illustration,
      .error-illustrations .illustration--fishing-boat {
        display: none; } }
  .error-illustrations .illustration--fishing-boat {
    margin-left: 50%; }
    @media only screen and (min-width: 64em) {
      .error-illustrations .illustration--fishing-boat {
        font-size: 15em;
        bottom: -132px; } }
  .error-illustrations .water-illustration {
    width: 100%;
    background-color: #c5c5c5; }

/* 5.24 Maintenance */
/*
Maintenance page

markup:
<div class="maintenance  |  is-root">
	<div class="maintenance-overlay"></div>
	<div class="maintenance--container">
		<div class="is-root">
			<figure class="brand--cta"><figcaption class="is-narrative">CTA Homepage</figcaption></figure>
			<div class="wings  |  leader-inside--hero  |  trailer-inside">
				<div class="body--align-center  |  gutters">
					<h1 class="title title--section  |  trailer  |  leader">Our website is temporary offline.</h1>
					<p class="leader-inside">We are working to make this world a better place. Get notified about our latest projects and activites by subscribing below.</p>
				</div>
				<fieldset class="leader trailer  |  gutters">
	        <label class="fld-label title title--meta" for="firstname">firstname</label>
	        <input class="fld" type="text" id="firstname" name="Field6">
	        <label class="fld-label title title--meta" for="lastname">lastname</label>
	        <input class="fld" type="text" id="lastname" name="Field7">
	        <label class="fld-label title title--meta" for="email">e-mail address</label>
	        <input class="fld" type="text" name="Field1" id="email">
		    </fieldset>
		    <div class="gutters">
		    	<button class="button button--inverse button--stretch">Subscribe</button>
		    </div>
		    <div class="body--align-center">
		    	<p class="site-footer__title  |  title">Follow us on</p>
		    	<div class="trailer">
						<a class="anchor--shy  |  is-heir" href="https://www.facebook.com/CTApage" target="_blank"><span class="icon icon--facebook"></span></a>
						<a class="anchor--shy  |  is-heir" href="https://twitter.com/ctaflash" target="_blank"><span class="icon icon--twitter"></span></a>
						<a class="anchor--shy  |  is-heir" href="javascript:void()"><span class="icon icon--rss"></span></a>
					</div>
		    </div>
			</div>
		</div>
		<p class="maintenance--disclaimer  |  body--align-center">CTA is a joint institution operating under the framework of the Cotonou Agreement between the ACP Group of States (Africa, the Caribbean and the Pacific) and the EU Member States (European Union). CTA is funded by the European Union.</p>
	</div>
</div>

Styleguide 5.24
*/
.maintenance {
  width: 100%;
  color: #e0e0e0;
  font-family: "Open Sans", sans-serif;
  overflow: hidden;
  /* IE 11 */ }
  .maintenance-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #3d3d3d;
    opacity: .5; }
  .maintenance-image {
    height: 100%;
    width: 100%;
    color: #e0e0e0;
    font-family: "Open Sans", sans-serif;
    overflow: hidden; }
  .maintenance--container {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
       -moz-transform: translateY(-50%) translateX(-50%);
        -ms-transform: translateY(-50%) translateX(-50%);
            transform: translateY(-50%) translateX(-50%);
    width: 83.33333vw;
    margin: 0 auto; }
    @media only screen and (min-width: 64em) {
      .maintenance--container {
        width: 66.66667vw; } }
    @media only screen and (min-width: 90em) {
      .maintenance--container {
        width: 33.33333vw; } }
    .maintenance--container .is-root {
      background: #3d3d3d; }
  .maintenance--disclaimer {
    font-size: 0.75em;
    color: #e2e2e2;
    margin-top: 15px;
    padding-left: 11.11111%;
    padding-right: 11.11111%; }
  .maintenance--footer {
    color: rgba(255, 255, 255, 0.8); }
  .maintenance .icon, .maintenance .list--take-aways li:before, .list--take-aways .maintenance li:before, .maintenance .list--theme li:before, .list--theme .maintenance li:before, .maintenance .filter__trigger:after, .maintenance .block-link--icon:before, .maintenance .panel.is-inactive .panel__trigger:after, .panel.is-inactive .maintenance .panel__trigger:after, .maintenance .tail__lengthen:before, .maintenance .tail__lengthen:after, .maintenance .tail__shorten:before, .maintenance .tail__shorten:after {
    font-size: 1.3125em;
    padding: 0 6px; }
  .maintenance .brand--cta {
    position: absolute;
    top: -42px;
    left: 50%;
    -webkit-transform: translateX(-50%);
       -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    margin-left: 0;
    margin-right: 0; }
    @media only screen and (min-width: 64em) {
      .maintenance .brand--cta {
        top: -81px; } }
  .maintenance .fld {
    border-color: #fff; }
    .maintenance .fld:focus {
      color: #3d3d3d; }

/* 5.50 ICT Update */
/*
ICT Update

Styleguide 5.50
*/
/* 5.50.1 Featured posts */
/*
ICT Update – Featured posts

markup:
<div class="layout leader--hero">
    <div class="layout__cell layout__cell--aside layout__cell--divider wings">
        <footer class="gutters">
            <h2 class="meta trailer-inside--small">Our partners for this issue:</h2>
            <ul class="reset">
                <li class="trailer--tiny">
                    <img src="https://res.cloudinary.com/cta/image/upload/v1494858314/aec6lyrf9k67vqic3fgi.png" alt="e-Agriculture">
                </li>
            </ul>
        </footer>
        <aside class="gutters">
            <div class="issue-label issue-label--l media media--middle anchor--reset leader">
                <div class="issue-label__nr" data-issue-nr="85"></div>
                <div class="issue-label__caption">
                    <p>
                        <strong>Issue 85</strong>
                        <span>June 2017</span>
                    </p>
                </div>
            </div>
            <figure>
                <figcaption class="title title--lead title--section leader--small anchor--reset">Applications for agriculture</figcaption>
                <img class="0" src="https://res.cloudinary.com/cta/image/upload/w_480/pkdnckzvvuymywupcrl6" srcset="https://res.cloudinary.com/cta/image/upload/w_480/pkdnckzvvuymywupcrl6 480w,https://res.cloudinary.com/cta/image/upload/w_320/pkdnckzvvuymywupcrl6 320w,https://res.cloudinary.com/cta/image/upload/w_240/pkdnckzvvuymywupcrl6 240w"
                  sizes="100vw, (min-width: 480px) 480px" alt="Array">
            </figure>
        </aside>
    </div>
    <div class="layout__cell layout__cell--main wing--right">
        <div class="post post--hero  |  layout">
            <div class="post__media  |  layout__cell  |  gutters">
                <a class="anchor anchor--shy" href="/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681">
                    <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_750,ar_3:2,f_auto,c_fill/c69x3ej3plfrkexfva0m" srcset="http://res.cloudinary.com/cta/image/upload/w_1480,ar_3:2,f_auto,c_fill/c69x3ej3plfrkexfva0m 1500w,http://res.cloudinary.com/cta/image/upload/w_1280,ar_3:2,f_auto,c_fill/c69x3ej3plfrkexfva0m 1280w,http://res.cloudinary.com/cta/image/upload/w_740,ar_3:2,f_auto,c_fill/c69x3ej3plfrkexfva0m 750w,http://res.cloudinary.com/cta/image/upload/w_640,ar_3:2,f_auto,c_fill/c69x3ej3plfrkexfva0m 640w,http://res.cloudinary.com/cta/image/upload/w_480,ar_3:2,f_auto,c_fill/c69x3ej3plfrkexfva0m 480w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/c69x3ej3plfrkexfva0m 320w" sizes="(min-width: 1024px) 50vw, (min-width: 768px) 100vw" width="360" height="240" alt="">
                </a>
            </div>
            <div class="post__content  |  layout__cell layout__cell--aside layout__cell--aside--l  |  stack stack--stacked  |  wing--right">
                <div class="stack__unit  |  gutters">
                    <time class="meta" datetime="2017-06-20T15:54:41+00:00">20 June 2017</time>
                    <span class="meta">in <a href="/en/ictupdate">ICTUpdate</a></span>
                    <h3 class="title title--tile anchor--reset">
                        <a class="anchor anchor--shy  |  is-heir" href="/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681">
                            Creating ICT opportunities with the apps4ag database
                        </a>
                    </h3>
                    <div class="media media--middle  |  bleed">
                        <div class="media__figure  |  gutters">
                            <img class="image image--stretch" width="30" height="30" alt="Addom, Benjamin" src="https://res.cloudinary.com/cta/image/upload/v1497037424/tomt8o4tph3qewiicvsv.png">
                        </div>
                        <div class="media__content  |  body--whisper">
                            by Benjamin Addom
                        </div>
                    </div>
                    <p class="post__intro">In ICT Update and on websites as ICT4D, CTA has covered the explosive growth and proliferation of digital and mobile phone technologies for agriculture. Now CTA takes the next step with developing the Apps4Ag database, a comprehensive,
                        up-to-date and responsive database of ICTs including mobile, web, animation, audio, and video applications involved in the food value chains.</p>
                    <a class="read-more" href="/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681">Read More</a>
                </div>
            </div>
        </div>
        <section class="grid grid--posts  |  leader--hero  |  wing--right  |  ">
            <div class="grid__cell  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/ictupdate/issue-85/article/facilitating-change-in-agricultural-value-chains-with-app-services-sid0bb2a907a-f0d3-47c8-8212-619a793d24e1">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/tg0v4gpguf1ds9866b5i" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/tg0v4gpguf1ds9866b5i 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/tg0v4gpguf1ds9866b5i 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/tg0v4gpguf1ds9866b5i 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/tg0v4gpguf1ds9866b5i 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2017-06-20T14:36:56+00:00">20 June 2017</time>
                        <span class="meta">in <a href="/en/ictupdate">ICTUpdate</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="/en/ictupdate/issue-85/article/facilitating-change-in-agricultural-value-chains-with-app-services-sid0bb2a907a-f0d3-47c8-8212-619a793d24e1">
                                Facilitating change in agricultural value chains with app services
                            </a>
                        </h3>
                        <p class="is-gt-small-desktop  |  post__intro">Investment in mobile agricultural services is likely to be most effective where the technology is integrated into specific systems and organisational routines that are developed by new or established local innovators. They are
                            the drivers for developing new processes and new networks on the ground that promote scale efficiencies along the value chain.</p>
                        <a class="read-more" href="/en/ictupdate/issue-85/article/facilitating-change-in-agricultural-value-chains-with-app-services-sid0bb2a907a-f0d3-47c8-8212-619a793d24e1">Read More</a>
                    </div>
                </div>
            </div>
            <div class="grid__cell  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/ictupdate/issue-85/article/four-building-stones-for-a-vibrant-ict-environment-sid05d74ccce-68ac-4d45-b547-a50b17b09d81">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/ca5ojjuovtapj2ag28sn" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/ca5ojjuovtapj2ag28sn 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/ca5ojjuovtapj2ag28sn 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/ca5ojjuovtapj2ag28sn 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/ca5ojjuovtapj2ag28sn 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2017-06-20T14:11:46+00:00">20 June 2017</time>
                        <span class="meta">in <a href="/en/ictupdate">ICTUpdate</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="/en/ictupdate/issue-85/article/four-building-stones-for-a-vibrant-ict-environment-sid05d74ccce-68ac-4d45-b547-a50b17b09d81">
                                Four building stones for a vibrant ICT environment
                            </a>
                        </h3>
                        <p class="post__author  |  author">
                            by Serge Kedja
                        </p>
                        <p class="is-gt-small-desktop  |  post__intro">A vibrant enabling environment is vital for creativity, stimulus and optimism on which ICT4Ag initiatives can generate impact. Developers and innovators have to learn from cases, either successful or not, when it comes to the environments
                            or contexts where they have been deployed. There are four areas on which an enabling environment depends.</p>
                        <a class="read-more" href="/en/ictupdate/issue-85/article/four-building-stones-for-a-vibrant-ict-environment-sid05d74ccce-68ac-4d45-b547-a50b17b09d81">Read More</a>
                    </div>
                </div>
            </div>
            <div class="grid__cell  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/ictupdate/issue-85/article/it-solutions-are-disruptive-they-change-the-way-things-are-working-sid0b545abc3-b9ff-410c-9370-12c70a1d6dc6">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/zimclxlffuq5cyts6uzw" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/zimclxlffuq5cyts6uzw 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/zimclxlffuq5cyts6uzw 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/zimclxlffuq5cyts6uzw 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/zimclxlffuq5cyts6uzw 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2017-06-20T14:05:35+00:00">20 June 2017</time>
                        <span class="meta">in <a href="/en/ictupdate">ICTUpdate</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="/en/ictupdate/issue-85/article/it-solutions-are-disruptive-they-change-the-way-things-are-working-sid0b545abc3-b9ff-410c-9370-12c70a1d6dc6">
                                IT solutions are disruptive: they change the way things are working
                            </a>
                        </h3>
                        <p class="is-gt-small-desktop  |  post__intro">Interview with Martin Njeru, the Account Director for Cojengo in the East Africa region. </p>
                        <a class="read-more" href="/en/ictupdate/issue-85/article/it-solutions-are-disruptive-they-change-the-way-things-are-working-sid0b545abc3-b9ff-410c-9370-12c70a1d6dc6">Read More</a>
                    </div>
                </div>
            </div>
            <div class="grid__cell  |  gutters">
                <div class="post">
                    <div class="post__media">
                        <a class="anchor anchor--shy" href="/en/ictupdate/issue-85/article/what-is-in-the-apps4ag-database-sid06d684573-589a-4802-961f-775d1885ce36">
                            <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wxqhu2xdasgcoqnx8nff" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/wxqhu2xdasgcoqnx8nff 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/wxqhu2xdasgcoqnx8nff 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/wxqhu2xdasgcoqnx8nff 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/wxqhu2xdasgcoqnx8nff 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                        </a>
                    </div>
                    <div class="post__content  |  leader-inside">
                        <time class="meta" datetime="2017-06-20T13:02:30+00:00">20 June 2017</time>
                        <span class="meta">in <a href="/en/ictupdate">ICTUpdate</a></span>
                        <h3 class="title  |  anchor--reset">
                            <a class="anchor anchor--shy  |  is-heir" href="/en/ictupdate/issue-85/article/what-is-in-the-apps4ag-database-sid06d684573-589a-4802-961f-775d1885ce36">
                                What is in the Apps4Ag database?
                            </a>
                        </h3>
                        <p class="is-gt-small-desktop  |  post__intro">The Apps4Ag database has over 500 online and mobile applications and services for stakeholders in the food value chain. ICT Update gives you an insight what users from farmers, traders, researchers and decision-makers can find
                            in the database. The database will be updated and extended with new information and new innovations on a regular base. So, have a look and see if there is something useful in it for you?</p>
                        <a class="read-more" href="/en/ictupdate/issue-85/article/what-is-in-the-apps4ag-database-sid06d684573-589a-4802-961f-775d1885ce36">Read More</a>
                    </div>
                </div>
            </div>
        </section>
        <section class="leader--hero">
            <h2 class="title gutters-outside">Also in this issue</h2>
            <div class="grid grid--rows">
                <article class="grid__cell  |  leader-small  |  gutters">
                    <div class="media  |  post">
                        <div class="media__body  |  gutter">
                            <span class="meta">in <a href="/en/ictupdate">ICTUpdate</a></span>
                            <h3 class="title  |  anchor--reset">
                                <a class="anchor anchor--shy  |  is-heir" href="/en/ictupdate/issue-85/article/meet-the-apps4ag-database-sid080bc222e-80b1-4293-bd9d-75b2ea6c8615">
                                    Meet the Apps4Ag database
                                </a>
                            </h3>
                            <p class="post__intro">The Apps4Ag database is developed by CTA and is an online collection of over 500 applications, which provides new ways to find and discover worldwide ICT innovations for agriculture. How can you make the most of this database
                                on www.apps4ag.org?</p>
                            <a class="read-more" href="/en/ictupdate/issue-85/article/meet-the-apps4ag-database-sid080bc222e-80b1-4293-bd9d-75b2ea6c8615">Read More</a>
                        </div>
                        <div class="media__figure  |  trailer--tiny">
                            <a class="anchor anchor--shy" href="/en/article/meet-the-apps4ag-database-sid080bc222e-80b1-4293-bd9d-75b2ea6c8615">
                                <img class="image image--stretch" src="http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u" srcset="http://res.cloudinary.com/cta/image/upload/w_500,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 500w,http://res.cloudinary.com/cta/image/upload/w_320,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 320w,http://res.cloudinary.com/cta/image/upload/w_240,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 240w,http://res.cloudinary.com/cta/image/upload/w_160,ar_3:2,f_auto,c_fill/u2fo3006emubr5atfa9u 160w" sizes="(min-width: 1024px) 17vw, (min-width: 768px) 50vw" width="160" height="240" alt="">
                            </a>
                        </div>
                    </div>
                </article>
            </div>
        </section>
    </div>
</div>

Styleguide 5.50.1
*/
/* 5.50.3 Post */
/*
ICT Update – Post

Styleguide 5.50.3
*/
/* 5.50.3.1 Header */
/*
Post Header

photo-1464684979825-ad6f2811cef2 - 3

markup:
<header class="trailer--hero">
    <div class="ie9-hero">
        <picture class="not-crown article-header__image  |  image image--stretch">
            <source media="(max-width: 767px) and (orientation: portrait)" srcset="https://res.cloudinary.com/cta/image/upload/w_1536,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1536w,https://res.cloudinary.com/cta/image/upload/w_1334,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1334w,https://res.cloudinary.com/cta/image/upload/w_1136,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1136w,https://res.cloudinary.com/cta/image/upload/w_960,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 960w,https://res.cloudinary.com/cta/image/upload/w_768,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 768w,https://res.cloudinary.com/cta/image/upload/w_667,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 667w,https://res.cloudinary.com/cta/image/upload/w_568,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 568w,https://res.cloudinary.com/cta/image/upload/w_480,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 480w" sizes="100vw">
            <source media="(max-width: 767px) and (orientation: landscape)" srcset="https://res.cloudinary.com/cta/image/upload/w_1536,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1536w,https://res.cloudinary.com/cta/image/upload/w_1334,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1334w,https://res.cloudinary.com/cta/image/upload/w_1136,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1136w,https://res.cloudinary.com/cta/image/upload/w_960,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 960w,https://res.cloudinary.com/cta/image/upload/w_768,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 768w,https://res.cloudinary.com/cta/image/upload/w_667,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 667w,https://res.cloudinary.com/cta/image/upload/w_568,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 568w,https://res.cloudinary.com/cta/image/upload/w_480,ar_3:2,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 480w" sizes="100vw">
            <source media="(min-width: 768px) and (max-width: 1024px)" srcset="https://res.cloudinary.com/cta/image/upload/w_2048,ar_2:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 2048w,https://res.cloudinary.com/cta/image/upload/w_1536,ar_2:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1536w,https://res.cloudinary.com/cta/image/upload/w_1024,ar_2:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1024w,https://res.cloudinary.com/cta/image/upload/w_768,ar_2:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 768w" sizes="100vw">
            <source media="(min-height: 800px) and (max-height: 1280px) and (min-width: 800px) and (max-width: 1280px) and (orientation: portrait)" srcset="https://res.cloudinary.com/cta/image/upload/w_1600,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1600w,https://res.cloudinary.com/cta/image/upload/w_800,ar_2:3,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 800w" sizes="100vw">
            <source media="(min-width: 1280px) and (max-width: 600px) and (orientation: landscape)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_3:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 2560w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_3:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1280w" sizes="100vw">
            <source media="(min-aspect-ratio: 16/9) and (min-width: 1800px)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:5,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:5,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:5,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:5,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:5,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1280w" sizes="100vw">
            <source media="(min-aspect-ratio: 1/1)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:6,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:6,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:6,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:6,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:6,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1280w" sizes="100vw">
            <source media="(max-aspect-ratio: 1/1)" srcset="https://res.cloudinary.com/cta/image/upload/w_2560,ar_16:8,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 2560w,https://res.cloudinary.com/cta/image/upload/w_1920,ar_16:8,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1920w,https://res.cloudinary.com/cta/image/upload/w_1680,ar_16:8,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1680w,https://res.cloudinary.com/cta/image/upload/w_1440,ar_16:8,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1440w,https://res.cloudinary.com/cta/image/upload/w_1280,ar_16:8,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 1280w" sizes="100vw">
            <img class="article-header__image  |  image image--stretch" src="https://res.cloudinary.com/cta/image/upload/w_480,ar_1:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha" srcset="https://res.cloudinary.com/cta/image/upload/w_960,ar_1:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 960w,https://res.cloudinary.com/cta/image/upload/w_480,ar_1:1,g_faces:center,f_auto,c_fill/wh9fkc7fuhirbywjr0ha 480w" sizes="100vw" alt="Leading image">
        </picture>
    </div>
    <div class="article-headline  |  layout layout--reverse">
        <div class="layout  layout--align-middle  |  layout__cell layout__cell--main">
            <div class="layout__cell layout__cell--main  |  gutters">
                <div class="leader  |  trailer">
                    <h1 class="article-headline__title  |  title title--headline">
                        Investing in the ICT4Ag application space
                    </h1>
                </div>
            </div>
            <div class="layout__cell layout__cell--aside  |  leader--ie-l  | wings">
                <p class="credit  |  gutters  |  trailer">© Fiona Graham / WorldRemit</p>
            </div>
        </div>
        <div class="layout__cell layout__cell--aside  |  gutters">
        </div>
    </div>
</header>

Styleguide 5.50.3.1
*/
/* 5.50.3.2 Body */
/*
ICT Update - Post Body

markup:
<div class="layout layout--reverse">
    <div class="layout__cell layout__cell--main">
        <div class="layout">
            <div class="layout__cell layout__cell--main  |  trailer--hero">
                <div class="social__share  |  trailer  |  gutters">
                    <ul class="share-list reset list--float">
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=Creating-ICT-opportunities-with-the-apps4ag-database&amp;redirect_uri=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681&amp;link=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681" target="_blank">
                                <span data-icon="facebook" class="icon icon--facebook">
                                    <span>
                                        <span class="is-narrative">Share on Facebook</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681" target="_blank">
                                <span data-icon="twitter" class="icon icon--twitter">
                                    <span>
                                        <span class="is-narrative">Share on Twitter</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--print" title="Print" href="javascript:print();">
                                <span data-icon="print" class="icon icon--print">
                                    <span>
                                        <span class="is-narrative">Print</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--whisper share--email" title="Send link via E-mail" href="mailto:?subject=Creating-ICT-opportunities-with-the-apps4ag-database&amp;body=">
                                <span data-icon="email" class="icon icon--envelope">
                                    <span>
                                        <span class="is-narrative">Send link via E-mail</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
                <footer class="gutters  |  trailer--hero">
                    <p class="meta">Tuesday, 20 June 2017 in <a href="/en/ictupdate/issue-85/article/-sid04661ea79-6f24-4cf9-81eb-0cad58487186">Applications for agriculture</a>. Updated on Tuesday, 30 January 2018</p>
                    <div class="media__content  |  body--whisper  |  leader--tiny">
                        by Benjamin Addom - Programme Coordinator, ICT4D at CTA, Netherlands
                    </div>
                </footer>
                <div class="post-anchor  |  clear">
                    <p class="gutters  |  paragraph--lead">In ICT Update and on websites as ICT4D, CTA has covered the explosive growth and proliferation of digital and mobile phone technologies for agriculture. Now CTA takes the next step with developing the Apps4Ag database, a comprehensive,
                        up-to-date and responsive database of ICTs including mobile, web, animation, audio, and video applications involved in the food value chains.
                    </p>
                    <p class="paragraph  |  gutters">The ubiquity of ICTs, especially mobile technologies, is noticeably transforming the way individuals and institutions exchange information and interact. Still, rural populations in developing countries, in particular the millions of
                        smallholder farmers, only marginally benefit from the potentials linked to adoption and use of these new technologies. The solution to speeding up the uptake of ICTs, mainly through mobile devices, by smallholders is two-fold:
                        firstly, ensuring that smallholders are aware of the benefits of using the applications on their devices, and secondly, ensuring that smallholders are able to benefit from the penetration of the internet into rural areas. Both
                        are eminent for improving production and marketing efficiency and the effectiveness of farmers’ business and livelihoods.</p>
                    <p class="paragraph  |  gutters">Many initiatives and studies already have shown the opportunities of mobile applications for stakeholders in the agricultural sector. The World Bank published <em>Mobile Applications for Agriculture and Rural Development</em> in 2011
                        and there is GSMA’s mAgri Deployment Tracker among many other initiatives. Still, there is not one comprehensive and interactive database that collects information from all available ICTs and mobile applications for agriculture.
                        That is why CTA and partners initiated the Apps4Ag framework immediately after the 2013 ICT4Ag International Conference in Kigali, Rwanda and why we are now asking you to try out this version and give us some feedback and contribute
                        content. </p>
                    <h2 class="heading  |  gutters">Sustainable platform for interaction</h2>
                    <p class="paragraph  |  gutters">Over the years, CTA has shown its profound experience in knowledge management for agriculture and rural development. With its current expertise in ICTs for agriculture and rural development, and its leadership in the organisation of
                        the ICT4Ag Conference, CTA aims with Apps4Ag to address the need and provide the agricultural value chain development community and the app development community with a sustainable platform for interaction that meets the rapidly
                        changing requirements of these stakeholders.</p>
                    <p class="paragraph  |  gutters">There were three specific objectives and needs for Apps4Ag database. First, developing an agricultural value chain framework upon which the apps will be mapped to facilitate use by value chain actors. Second, collating and documenting
                        ICT applications for agriculture. Third, developing a framework for assessing the usability and functionality of these applications for agricultural value chain development.</p>
                    <p class="paragraph  |  gutters">The database will become the centerpiece for new opportunities to facilitate and support up-scaling of ICTs for agriculture initiatives with support from the ICT4Ag Community of Practice that will evaluate the applications. Apps4Ag
                        database will boost information dissemination, knowledge exchange, extension and advisory service delivery, farmer engagement, and market access for both agricultural inputs and outputs.</p>
                    <h2 class="heading  |  gutters">Keeping the database up-to-date</h2>
                    <p class="paragraph  |  gutters">The database is expected to be interactive with a feedback and update form for users to submit information on applications that are not currently in the database or for developers to correct and update information on their solutions.
                        Feedbacks and new submissions will be received, validated and updated by CTA for quality purposes.</p>
                    <p class="paragraph  |  gutters">Now the database is operational within its framework, it will guide the definition of requirements arising from evaluations by the ICT4Ag Community of Practice, and act as a guide for new applications yet to be developed. The ICT4Ag
                        Community of Practice will be able to apply the framework and submit their evaluations of new apps, or new versions of existing apps. The community is expected to grow with increasing confidence in their ability review, assess,
                        and rate the applications using the framework. CTA remains committed to sustaining the community and the platform as it provides a neutral environment to monitor the development of apps in the agricultural sector, not only to satisfy
                        its mandate of support to agricultural and rural development institutions in ACP regions, but also as an international open and accessible resource.</p>
                    <p class="paragraph  |  gutters">The Apps4Ag database project, through its different components, is expected to address the current challenge facing most ICT4Ag initiatives: to scale up and be sustainable after donor support ends. Scaling up requires systemic effort,
                        long-term commitment on the part of institutions, donors, and individuals. It requires a basic set of institutional values and incentives for key actors to continuously identify ways to build on successful interventions ensuring
                        that they are replicated, transferred, and adapted in other settings. Current efforts and ideas to increase impact and upscaling can be read in this issue of ICT Update, for example in the articles of Christian Merz (Bill &amp;
                        Melinda Gates Foundation) and Richard Duncombe (University of Manchester). It will also showcase some interesting ICTs and mobile applications that you can find in the Apps4Ag database.</p>
                    <h2 class="heading  |  gutters">Related links</h2>
                    <p class="paragraph  |  gutters">Link to the <a href="http://www.apps4ag.org/" target="_blank">Apps4Ag database</a></p>
                    <p class="paragraph  |  gutters">Link to the ICT4Ag online platform</p>
                    <figure class="gutters  |  leader leader-inside--small  |  trailer trailer-inside--small">
                        <img class="image image--stretch" src="https://res.cloudinary.com/cta/image/upload/v1505749758/c69x3ej3plfrkexfva0m.jpg" alt="Creating ICT opportunities with the apps4ag database">
                    </figure>
                </div>
                <div class="gutters  |  trailer  |  leader">
                    <ul class="reset  |  tag-list  |  list--inline">
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_330966">information</a></li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_331436">application</a></li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_14343">smallholders</a></li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_11768">Information dissemination</a></li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_37890">Knowledge management</a></li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_203">agriculture</a></li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_28563">solutions</a></li>
                        <li> <a class="label label--s" href="/en/search?concepts[]=c_1312459073954">market access</a></li>
                    </ul>
                </div>
                <div class="well well--slim-fit  |  gutters-outside  |  leader  |  trailer  |  is-gt-small-desktop">
                    <ul class="share-list reset list--float">
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=Creating-ICT-opportunities-with-the-apps4ag-database&amp;redirect_uri=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681&amp;link=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681" target="_blank">
                                <span data-icon="facebook" class="icon icon--facebook">
                                    <span>
                                        <span class="is-narrative">Share on Facebook</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681" target="_blank">
                                <span data-icon="twitter" class="icon icon--twitter">
                                    <span>
                                        <span class="is-narrative">Share on Twitter</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--print" title="Print" href="javascript:print();">
                                <span data-icon="print" class="icon icon--print">
                                    <span>
                                        <span class="is-narrative">Print</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--email" title="Send link via E-mail" href="mailto:?subject=Creating-ICT-opportunities-with-the-apps4ag-database&amp;body=">
                                <span data-icon="email" class="icon icon--envelope">
                                    <span>
                                        <span class="is-narrative">Send link via E-mail</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
                <aside class="gutters-outside  |  divider divider--top  |  leader--hero leader-inside--small">
                    <h2 class="title title--sub-section  |  leader--small  |  trailer--small">Disclaimer</h2>
                    <p class="body--quiet">This document has been produced with the financial assistance of the European Union. The contents of this document are the sole responsibility of CTA and can under no circumstances be regarded as reflecting the position of the European
                        Union.
                    </p>
                </aside>
            </div>
            <div class="layout__cell layout__cell--aside layout__cell--aside--l  |  wings">
                <div class="well well--slim-fit  |  gutters-outside  |  leader  |  trailer  |  is-lt-small-desktop">
                    <ul class="share-list reset list--float">
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--facebook share--facebook-branded" title="Share on Facebook" href="https://www.facebook.com/dialog/feed?app_id=145634995501895&amp;display=popup&amp;caption=Creating-ICT-opportunities-with-the-apps4ag-database&amp;redirect_uri=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681&amp;link=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681" target="_blank">
                                <span data-icon="facebook" class="icon icon--facebook">
                                    <span>
                                        <span class="is-narrative">Share on Facebook</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--twitter share--twitter-branded" title="Share on Twitter" href="http://www.twitter.com/share?url=http://cta.platform.local/en/ictupdate/issue-85/article/creating-ict-opportunities-with-the-apps4ag-database-sid05cffb2b5-3d5c-4299-b45a-d7e421d80681" target="_blank">
                                <span data-icon="twitter" class="icon icon--twitter">
                                    <span>
                                        <span class="is-narrative">Share on Twitter</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--print" title="Print" href="javascript:print();">
                                <span data-icon="print" class="icon icon--print">
                                    <span>
                                        <span class="is-narrative">Print</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                        <li class="share-list__item divider  divider--left">
                            <a class="label share share--email" title="Send link via E-mail" href="mailto:?subject=Creating-ICT-opportunities-with-the-apps4ag-database&amp;body=">
                                <span data-icon="email" class="icon icon--envelope">
                                    <span>
                                        <span class="is-narrative">Send link via E-mail</span>
                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="layout__cell layout__cell--aside layout__cell--aside--l  |  wings">
        <div class="mini-map  |  well well--neutral well--slim-fit  |  gutters-outside  |  trailer--hero">
            <div class="mini-map__map">
                <div id="map" style="height: 250px; position: relative; overflow: hidden;">
                    <div style="height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; background-color: rgb(229, 227, 223);">
                        <div class="gm-style" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px;">
                            <div tabindex="0" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; cursor: url(&quot;https://maps.gstatic.com/mapfiles/openhand_8_8.cur&quot;) 8 8, default;">
                                <div style="z-index: 1; position: absolute; top: 0px; left: 0px; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);">
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 100; width: 100%;">
                                        <div style="position: absolute; left: 0px; top: 0px; z-index: 0;">
                                            <div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;">
                                                <div style="width: 256px; height: 256px; position: absolute; left: -205px; top: -222px;"></div>
                                                <div style="width: 256px; height: 256px; position: absolute; left: -205px; top: 34px;"></div>
                                                <div style="width: 256px; height: 256px; position: absolute; left: 51px; top: -222px;"></div>
                                                <div style="width: 256px; height: 256px; position: absolute; left: 51px; top: 34px;"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 101; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 102; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 103; width: 100%;">
                                        <div style="position: absolute; left: 0px; top: 0px; z-index: -1;">
                                            <div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;">
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: -205px; top: -222px;"></div>
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: -205px; top: 34px;"></div>
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: 51px; top: -222px;"></div>
                                                <div style="width: 256px; height: 256px; overflow: hidden; position: absolute; left: 51px; top: 34px;"><canvas draggable="false" height="256" width="256" style="user-select: none; position: absolute; left: 0px; top: 0px; height: 256px; width: 256px;"></canvas></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div style="position: absolute; z-index: 0; left: 0px; top: 0px;">
                                        <div style="overflow: hidden; width: 272px; height: 250px;"><img src="https://maps.googleapis.com/maps/api/js/StaticMapService.GetMapImage?1m2&amp;1i9421&amp;2i8158&amp;2e1&amp;3u6&amp;4m2&amp;1u272&amp;2u250&amp;5m5&amp;1e0&amp;5sen-US&amp;6sus&amp;10b1&amp;12b1&amp;token=93261" style="width: 272px; height: 250px;"></div>
                                    </div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 0;">
                                        <div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;">
                                            <div style="position: absolute; left: -205px; top: -222px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i36!3i31!4i256!2m3!1e0!2sm!3i410108733!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=21452" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                            <div style="position: absolute; left: -205px; top: 34px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i36!3i32!4i256!2m3!1e0!2sm!3i410108733!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=57473" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                            <div style="position: absolute; left: 51px; top: -222px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i37!3i31!4i256!2m3!1e0!2sm!3i410108733!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=78639" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                            <div style="position: absolute; left: 51px; top: 34px; transition: opacity 200ms ease-out;"><img draggable="false" alt="" src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i6!2i37!3i32!4i256!2m3!1e0!2sm!3i410108733!3m9!2sen-US!3sUS!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!4e0&amp;token=114660" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                        </div>
                                    </div>
                                </div>
                                <div class="gm-style-pbc" style="z-index: 2; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px; opacity: 0;">
                                    <p class="gm-style-pbt"></p>
                                </div>
                                <div style="z-index: 3; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px;">
                                    <div style="z-index: 1; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px;"></div>
                                </div>
                                <div style="z-index: 4; position: absolute; top: 0px; left: 0px; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);">
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 104; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 105; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 106; width: 100%;"></div>
                                    <div style="position: absolute; left: 0px; top: 0px; z-index: 107; width: 100%;"></div>
                                </div>
                            </div>
                            <div style="margin-left: 5px; margin-right: 5px; z-index: 1000000; position: absolute; left: 0px; bottom: 0px;">
                                <a target="_blank" href="https://maps.google.com/maps?ll=-2,30&amp;z=6&amp;t=m&amp;hl=en-US&amp;gl=US&amp;mapclient=apiv3" title="Click to see this area on Google Maps" style="position: static; overflow: visible; float: none; display: inline;">
                                    <div style="width: 66px; height: 26px; cursor: pointer;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/google4.png" draggable="false" style="position: absolute; left: 0px; top: 0px; width: 66px; height: 26px; user-select: none; border: 0px; padding: 0px; margin: 0px;"></div>
                                </a>
                            </div>
                            <div style="background-color: white; padding: 15px 21px; border: 1px solid rgb(171, 171, 171); font-family: Roboto, Arial, sans-serif; color: rgb(34, 34, 34); box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 16px; z-index: 10000002; display: none; width: 218px; height: 148px; position: absolute; left: 5px; top: 35px;">
                                <div style="padding: 0px 0px 10px; font-size: 16px;">Map Data</div>
                                <div style="font-size: 13px;">Map data ©2018 Google</div>
                                <div style="width: 13px; height: 13px; overflow: hidden; position: absolute; opacity: 0.7; right: 12px; top: 12px; z-index: 10000; cursor: pointer;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/mapcnt6.png" draggable="false" style="position: absolute; left: -2px; top: -336px; width: 59px; height: 492px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                            </div>
                            <div class="gmnoprint" style="z-index: 1000001; position: absolute; right: 71px; bottom: 0px; width: 121px;">
                                <div draggable="false" class="gm-style-cc" style="user-select: none; height: 14px; line-height: 14px;">
                                    <div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;">
                                        <div style="width: 1px;"></div>
                                        <div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div>
                                    </div>
                                    <div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a style="text-decoration: none; cursor: pointer; display: none;">Map Data</a><span>Map data ©2018 Google</span></div>
                                </div>
                            </div>
                            <div class="gmnoscreen" style="position: absolute; right: 0px; bottom: 0px;">
                                <div style="font-family: Roboto, Arial, sans-serif; font-size: 11px; color: rgb(68, 68, 68); direction: ltr; text-align: right; background-color: rgb(245, 245, 245);">Map data ©2018 Google</div>
                            </div>
                            <div class="gmnoprint gm-style-cc" draggable="false" style="z-index: 1000001; user-select: none; height: 14px; line-height: 14px; position: absolute; right: 0px; bottom: 0px;">
                                <div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;">
                                    <div style="width: 1px;"></div>
                                    <div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div>
                                </div>
                                <div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a href="https://www.google.com/intl/en-US_US/help/terms_maps.html" target="_blank" style="text-decoration: none; cursor: pointer; color: rgb(68, 68, 68);">Terms of Use</a></div>
                            </div><button draggable="false" title="Toggle fullscreen view" aria-label="Toggle fullscreen view" type="button" style="background: none; border: 0px; margin: 10px 14px; padding: 0px; position: absolute; cursor: pointer; user-select: none; width: 25px; height: 25px; overflow: hidden; top: 0px; right: 0px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/sv9.png" draggable="false" class="gm-fullscreen-control" style="position: absolute; left: -52px; top: -86px; width: 164px; height: 175px; user-select: none; border: 0px; padding: 0px; margin: 0px;"></button>
                            <div draggable="false" class="gm-style-cc" style="user-select: none; height: 14px; line-height: 14px; display: none; position: absolute; right: 0px; bottom: 0px;">
                                <div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;">
                                    <div style="width: 1px;"></div>
                                    <div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div>
                                </div>
                                <div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a target="_new" title="Report errors in the road map or imagery to Google" href="https://www.google.com/maps/@-2,30,6z/data=!10m1!1e1!12b1?source=apiv3&amp;rapsrc=apiv3" style="font-family: Roboto, Arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); text-decoration: none; position: relative;">Report a map error</a></div>
                            </div>
                            <div class="gmnoprint gm-bundled-control gm-bundled-control-on-bottom" draggable="false" controlwidth="28" controlheight="93" style="margin: 10px; user-select: none; position: absolute; bottom: 107px; right: 28px;">
                                <div class="gmnoprint" controlwidth="28" controlheight="55" style="position: absolute; left: 0px; top: 38px;">
                                    <div draggable="false" style="user-select: none; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; cursor: pointer; background-color: rgb(255, 255, 255); width: 28px; height: 55px;"><button draggable="false" title="Zoom in" aria-label="Zoom in" type="button" style="background: none; display: block; border: 0px; margin: 0px; padding: 0px; position: relative; cursor: pointer; user-select: none; width: 28px; height: 27px; top: 0px; left: 0px;"><div style="overflow: hidden; position: absolute; width: 15px; height: 15px; left: 7px; top: 6px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl.png" draggable="false" style="position: absolute; left: 0px; top: 0px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 120px; height: 54px;"></div></button>
                                        <div style="position: relative; overflow: hidden; width: 67%; height: 1px; left: 16%; background-color: rgb(230, 230, 230); top: 0px;"></div><button draggable="false" title="Zoom out" aria-label="Zoom out" type="button" style="background: none; display: block; border: 0px; margin: 0px; padding: 0px; position: relative; cursor: pointer; user-select: none; width: 28px; height: 27px; top: 0px; left: 0px;"><div style="overflow: hidden; position: absolute; width: 15px; height: 15px; left: 7px; top: 6px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl.png" draggable="false" style="position: absolute; left: 0px; top: -15px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 120px; height: 54px;"></div></button></div>
                                </div>
                                <div class="gm-svpc" controlwidth="28" controlheight="28" style="background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; width: 28px; height: 28px; cursor: url(&quot;https://maps.gstatic.com/mapfiles/openhand_8_8.cur&quot;) 8 8, default; position: absolute; left: 0px; top: 0px;">
                                    <div style="position: absolute; left: 1px; top: 1px;"></div>
                                    <div style="position: absolute; left: 1px; top: 1px;">
                                        <div aria-label="Street View Pegman Control" style="width: 26px; height: 26px; overflow: hidden; position: absolute; left: 0px; top: 0px;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/cb_scout5.png" draggable="false" style="position: absolute; left: -147px; top: -26px; width: 215px; height: 835px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                        <div aria-label="Pegman is on top of the Map" style="width: 26px; height: 26px; overflow: hidden; position: absolute; left: 0px; top: 0px; visibility: hidden;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/cb_scout5.png" draggable="false" style="position: absolute; left: -147px; top: -52px; width: 215px; height: 835px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                        <div aria-label="Street View Pegman Control" style="width: 26px; height: 26px; overflow: hidden; position: absolute; left: 0px; top: 0px; visibility: hidden;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/cb_scout5.png" draggable="false" style="position: absolute; left: -147px; top: -78px; width: 215px; height: 835px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                    </div>
                                </div>
                                <div class="gmnoprint" controlwidth="28" controlheight="0" style="display: none; position: absolute;">
                                    <div title="Rotate map 90 degrees" style="width: 28px; height: 28px; overflow: hidden; position: absolute; background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; cursor: pointer; display: none;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl4.png" draggable="false" style="position: absolute; left: -141px; top: 6px; width: 170px; height: 54px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                    <div class="gm-tilt" style="width: 28px; height: 28px; overflow: hidden; position: absolute; background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; border-radius: 2px; top: 0px; cursor: pointer;"><img alt="" src="https://maps.gstatic.com/mapfiles/api-3/images/tmapctrl4.png" draggable="false" style="position: absolute; left: -141px; top: -13px; width: 170px; height: 54px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div>
                                </div>
                            </div>
                            <div class="gmnoprint" style="margin: 10px; z-index: 0; position: absolute; cursor: pointer; left: 0px; top: 0px;">
                                <div class="gm-style-mtc" style="float: left; position: relative;">
                                    <div role="button" tabindex="0" title="Show street map" aria-label="Show street map" aria-pressed="true" draggable="false" style="direction: ltr; overflow: hidden; text-align: center; position: relative; color: rgb(0, 0, 0); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 8px; border-bottom-left-radius: 2px; border-top-left-radius: 2px; -webkit-background-clip: padding-box; background-clip: padding-box; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; min-width: 22px; font-weight: 500;">Map</div>
                                    <div style="background-color: white; z-index: -1; padding: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; position: absolute; left: 0px; top: 29px; text-align: left; display: none;">
                                        <div draggable="false" title="Show street map with terrain" style="color: rgb(0, 0, 0); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 6px 8px 6px 6px; direction: ltr; text-align: left; white-space: nowrap;"><span role="checkbox" style="box-sizing: border-box; position: relative; line-height: 0; font-size: 0px; margin: 0px 5px 0px 0px; display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid rgb(198, 198, 198); border-radius: 1px; width: 13px; height: 13px; vertical-align: middle;"><div style="position: absolute; left: 1px; top: -2px; width: 13px; height: 11px; overflow: hidden; display: none;"><img alt="" src="https://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -52px; top: -44px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 68px; height: 67px;"></div></span>
                                            <label style="vertical-align: middle; cursor: pointer;">Terrain</label>
                                        </div>
                                    </div>
                                </div>
                                <div class="gm-style-mtc" style="float: left; position: relative;">
                                    <div role="button" tabindex="0" title="Show satellite imagery" aria-label="Show satellite imagery" aria-pressed="false" draggable="false" style="direction: ltr; overflow: hidden; text-align: center; position: relative; color: rgb(86, 86, 86); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 8px; border-bottom-right-radius: 2px; border-top-right-radius: 2px; -webkit-background-clip: padding-box; background-clip: padding-box; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; min-width: 40px; border-left: 0px;">Satellite</div>
                                    <div style="background-color: white; z-index: -1; padding: 2px; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; position: absolute; right: 0px; top: 29px; text-align: left; display: none;">
                                        <div draggable="false" title="Show imagery with street names" style="color: rgb(0, 0, 0); font-family: Roboto, Arial, sans-serif; user-select: none; font-size: 11px; background-color: rgb(255, 255, 255); padding: 6px 8px 6px 6px; direction: ltr; text-align: left; white-space: nowrap;"><span role="checkbox" style="box-sizing: border-box; position: relative; line-height: 0; font-size: 0px; margin: 0px 5px 0px 0px; display: inline-block; background-color: rgb(255, 255, 255); border: 1px solid rgb(198, 198, 198); border-radius: 1px; width: 13px; height: 13px; vertical-align: middle;"><div style="position: absolute; left: 1px; top: -2px; width: 13px; height: 11px; overflow: hidden;"><img alt="" src="https://maps.gstatic.com/mapfiles/mv/imgs8.png" draggable="false" style="position: absolute; left: -52px; top: -44px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none; width: 68px; height: 67px;"></div></span>
                                            <label style="vertical-align: middle; cursor: pointer;">Labels</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <script type="text/javascript">
                    jQuery(function($) {
                        $('#map').gmaps({
                            zoom: 6,
                            location: {
                                latitude: -2,
                                longitude: 30
                            },
                            marker: {
                                icon: '/assets/images/icons/gmaps_pin.png'
                            }
                        });
                    });
                </script>
            </div>
            <div class="mini-map__asset  |  divider divider--inverse divider--top  |  gutters  |  trailer-inside--small  |  leader-inside--small">
                <div class="media media--middle  |  location">
                    <span class="location__marker  |  media__figure">
                        <span class="icon icon--theme icon--drop icon--map-marker"><span class="is-narrative">Location:</span></span>
                    </span>
                    <div class="location__body  |  media__content">
                        <a class="is-heir" href="/en/search?location=49518">Rwanda</a>
                    </div>
                </div>
            </div>
        </div>
        <aside class="trailer--hero">
            <h2 class="title  |  trailer--normal  |  gutters">About the author</h2>
            <div class="media  |  leader--normal  |  trailer--normal">
                <div class="media__figure  |  gutters">
                    <img src="https://res.cloudinary.com/cta/image/upload/v1497037424/tomt8o4tph3qewiicvsv.png" width="50" height="50" alt=" Benjamin Addom">
                </div>
                <div class="media__body  |  gutter--right  |  body--whisper">
                    <p class="meta--bold  |  trailer--tiny">Benjamin Addom</p>
                    <p class="">Programme Coordinator, ICT4D at CTA</p>
                </div>
            </div>
        </aside>
    </div>
</div>

Styleguide 5.50.3.2
*/
/* 5.50.4 Issues overview */
/*
ICT Update – Issues overview

markup:
<div class="layout leader--hero">
    <div class="layout__cell layout__cell--aside layout__cell--divider wings">
        <footer class="gutters">
            <h2 class="meta trailer-inside--small">Our partners for this issue:</h2>
            <ul class="reset">
                <li class="trailer--tiny">
                    <img src="https://res.cloudinary.com/cta/image/upload/v1494858314/aec6lyrf9k67vqic3fgi.png" alt="e-Agriculture">
                </li>
            </ul>
        </footer>
        <aside class="gutters  |  trailer">
            <div class="issue-label issue-label--l media media--middle anchor--reset leader">
                <div class="issue-label__nr" data-issue-nr="85"></div>
                <div class="issue-label__caption">
                    <p>
                        <strong>Issue 85</strong>
                        <span>June 2017</span>
                    </p>
                </div>
            </div>
            <figure>
                <figcaption class="title title--lead title--section leader--small anchor--reset">Applications for agriculture</figcaption>
                <img class="0" src="https://res.cloudinary.com/cta/image/upload/w_480/pkdnckzvvuymywupcrl6" srcset="https://res.cloudinary.com/cta/image/upload/w_480/pkdnckzvvuymywupcrl6 480w,https://res.cloudinary.com/cta/image/upload/w_320/pkdnckzvvuymywupcrl6 320w,https://res.cloudinary.com/cta/image/upload/w_240/pkdnckzvvuymywupcrl6 240w"
                  sizes="100vw, (min-width: 480px) 480px" alt="Array">
            </figure>
        </aside>
    </div>
    <div class="layout__cell layout__cell--main wing--right">
        <div class="grid__cell">
            <ul class="reset trellis trellis--l">
                <li class="trellis__cell trailer gutters">
                    <a class="anchor--shy anchor--reset  |  is-heir" href="">
                        <figure>
                            <img class="image image--stretch" alt="Issue 85" src="https://res.cloudinary.com/cta/image/upload/v1505735714/pkdnckzvvuymywupcrl6.jpg">
                            <figcaption class="issue-label issue-label--s issue-label--offset-top media leader-inside--tiny">
                                <div class="issue-label__nr" data-issue-nr="85"></div>
                                <span class="issue-label__caption">Issue 85 June 2017</span>
                            </figcaption>
                        </figure>
                    </a>
                    <a class="button button--stretch  |  leader--small" href="">View issue</a>
                    <div class="body--align-center">
                        <a class="meta" href="" target="_blank">Download in PDF format</a>
                    </div>
                </li>
                <li class="trellis__cell trailer gutters">
                    <a class="anchor--shy anchor--reset  |  is-heir" href="">
                        <figure>
                            <img class="image image--stretch" alt="Issue 85" src="https://res.cloudinary.com/cta/image/upload/v1505735714/pkdnckzvvuymywupcrl6.jpg">
                            <figcaption class="issue-label issue-label--s issue-label--offset-top media leader-inside--tiny">
                                <div class="issue-label__nr" data-issue-nr="85"></div>
                                <span class="issue-label__caption">Issue 85 June 2017</span>
                            </figcaption>
                        </figure>
                    </a>
                    <a class="button button--stretch  |  leader--small" href="">View issue</a>
                    <div class="body--align-center">
                        <a class="meta" href="" target="_blank">Download in PDF format</a>
                    </div>
                </li>
                <li class="trellis__cell trailer gutters">
                    <a class="anchor--shy anchor--reset  |  is-heir" href="">
                        <figure>
                            <img class="image image--stretch" alt="Issue 85" src="https://res.cloudinary.com/cta/image/upload/v1505735714/pkdnckzvvuymywupcrl6.jpg">
                            <figcaption class="issue-label issue-label--s issue-label--offset-top media leader-inside--tiny">
                                <div class="issue-label__nr" data-issue-nr="85"></div>
                                <span class="issue-label__caption">Issue 85 June 2017</span>
                            </figcaption>
                        </figure>
                    </a>
                    <a class="button button--stretch  |  leader--small" href="">View issue</a>
                    <div class="body--align-center">
                        <a class="meta" href="" target="_blank">Download in PDF format</a>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>

Styleguide 5.50.4
*/
/* 8. */
.layout.is-gt-small-desktop,
.stack.is-gt-small-desktop,
.grid.is-gt-small-desktop {
  display: none; }

@media only screen and (min-width: 64em) {
  .layout.is-gt-small-desktop,
  .stack.is-gt-small-desktop,
  .grid.is-gt-small-desktop {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; } }

.media__body--single {
  -webkit-box-flex: 0;
     -moz-box-flex: 0;
      -ms-flex: 0 0 80%;
          flex: 0 0 80%; }

.twitter-feed {
  color: #55acee; }

.selectize-dropdown {
  max-height: 300px;
  overflow-y: scroll; }

@media only screen and (max-width: 47.9375em) {
  .project-map .media {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
    .project-map .media__body, .project-map .media__figure {
      width: 100%; } }

@media only screen and (max-width: 63.9375em) {
  .panel__body .layout .media {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
    .panel__body .layout .media .media__figure {
      width: 100%; } }

@media only screen and (max-width: 47.9375em) {
  .project-map .media {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
    .project-map .media__body, .project-map .media__figure {
      width: 100%; } }

.extended-search {
  font-family: "Open Sans", sans-serif;
  font-size: 1.6875em;
  font-weight: 600;
  border: 0; }
  .extended-search::-webkit-input-placeholder {
    color: #cdcdcd; }
  .extended-search::-moz-placeholder {
    color: #cdcdcd; }
  .extended-search:-ms-input-placeholder {
    color: #cdcdcd; }
  .extended-search::placeholder {
    color: #cdcdcd; }
  @media only screen and (min-width: 64em) {
    .extended-search {
      font-size: 2.8125em; } }

#ctx-item__search {
  background: transparent;
  border: 0; }

.tweets a:hover,
.theme--dark a:hover {
  color: #8bbf70; }

.iframe-video {
  max-height: 56.25vw; }

@media only screen and (min-width: 48em) {
  .grid--rows .grid__cell .post {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row; }
    .grid--rows .grid__cell .post .media__figure {
      width: 33.33333%; } }

@media only screen and (min-width: 64em) {
  .grid--rows .grid__cell .post .media__figure {
    width: auto; } }

.post-body .heading {
  margin-top: 24px; }

.post-body h2.heading {
  /* medium title*/
  font-size: 1.25em;
  line-height: 1.35; }

.post-body h3.heading {
  /* medium title*/
  font-size: 1.125em;
  line-height: 1.33333; }

.markdown ul {
  padding-left: 0;
  margin-left: 1em; }

[data-prefix]::before {
  content: attr(data-prefix); }

[data-issue-nr] {
  position: relative; }
  [data-issue-nr]::before {
    background-color: #67ab43;
    content: attr(data-issue-nr);
    overflow: hidden;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: end;
       -moz-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    width: 48px;
    height: 48px;
    padding: 6px;
    color: #fff;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    font-size: 1em;
    line-height: 1;
    text-align: center; }
    [data-issue-nr]::before.theme--dark,
    .theme--dark [data-issue-nr]::before,
    .theme .theme--dark [data-issue-nr]::before {
      background-color: #3d3d3d; }
    [data-issue-nr]::before.theme--green,
    .theme--green [data-issue-nr]::before,
    .theme .theme--green [data-issue-nr]::before {
      background-color: #67ab43; }
    [data-issue-nr]::before.theme--blue,
    .theme--blue [data-issue-nr]::before,
    .theme .theme--blue [data-issue-nr]::before {
      background-color: #56c0dd; }
    [data-issue-nr]::before.theme--lime,
    .theme--lime [data-issue-nr]::before,
    .theme .theme--lime [data-issue-nr]::before {
      background-color: #c1d435; }
    [data-issue-nr]::before.theme--yellow,
    .theme--yellow [data-issue-nr]::before,
    .theme .theme--yellow [data-issue-nr]::before {
      background-color: #facf21; }
    [data-issue-nr]::before.theme--gold,
    .theme--gold [data-issue-nr]::before,
    .theme .theme--gold [data-issue-nr]::before {
      background-color: #eb942c; }
    [data-issue-nr]::before.theme--orange,
    .theme--orange [data-issue-nr]::before,
    .theme .theme--orange [data-issue-nr]::before {
      background-color: #e26435; }
    [data-issue-nr]::before.theme--salmon,
    .theme--salmon [data-issue-nr]::before,
    .theme .theme--salmon [data-issue-nr]::before {
      background-color: #eb735d; }
    [data-issue-nr]::before.theme--red,
    .theme--red [data-issue-nr]::before,
    .theme .theme--red [data-issue-nr]::before {
      background-color: #ec2d10; }
    [data-issue-nr]::before.theme--burgundy,
    .theme--burgundy [data-issue-nr]::before,
    .theme .theme--burgundy [data-issue-nr]::before {
      background-color: #ba222a; }
    [data-issue-nr]::before.theme--purple,
    .theme--purple [data-issue-nr]::before,
    .theme .theme--purple [data-issue-nr]::before {
      background-color: #9b3381; }
    [data-issue-nr]::before.theme--youth,
    .theme--youth [data-issue-nr]::before,
    .theme .theme--youth [data-issue-nr]::before {
      background-color: #d57800; }
    [data-issue-nr]::before.theme--digitalisation,
    .theme--digitalisation [data-issue-nr]::before,
    .theme .theme--digitalisation [data-issue-nr]::before {
      background-color: #9a3324; }
    [data-issue-nr]::before.theme--climate,
    .theme--climate [data-issue-nr]::before,
    .theme .theme--climate [data-issue-nr]::before {
      background-color: #693c5e; }
    [data-issue-nr]::before.theme--gender,
    .theme--gender [data-issue-nr]::before,
    .theme .theme--gender [data-issue-nr]::before {
      background-color: #046a38; }
    [data-issue-nr]::before.theme--nutrition,
    .theme--nutrition [data-issue-nr]::before,
    .theme .theme--nutrition [data-issue-nr]::before {
      background-color: #487a7b; }
    [data-issue-nr]::before.theme--blog,
    .theme--blog [data-issue-nr]::before,
    .theme .theme--blog [data-issue-nr]::before {
      background-color: #FFA300; }
    [data-issue-nr]::before.theme--spore-blue,
    .theme--spore-blue [data-issue-nr]::before,
    .theme .theme--spore-blue [data-issue-nr]::before {
      background-color: #3f68b1; }
    [data-issue-nr]::before.theme--spore-brown,
    .theme--spore-brown [data-issue-nr]::before,
    .theme .theme--spore-brown [data-issue-nr]::before {
      background-color: #774b04; }
    [data-issue-nr]::before.theme--spore-dark-blue,
    .theme--spore-dark-blue [data-issue-nr]::before,
    .theme .theme--spore-dark-blue [data-issue-nr]::before {
      background-color: #044e7e; }
    [data-issue-nr]::before.theme--spore-forest-green,
    .theme--spore-forest-green [data-issue-nr]::before,
    .theme .theme--spore-forest-green [data-issue-nr]::before {
      background-color: #5f810a; }
    [data-issue-nr]::before.theme--spore-grey-blue,
    .theme--spore-grey-blue [data-issue-nr]::before,
    .theme .theme--spore-grey-blue [data-issue-nr]::before {
      background-color: #6d8c9f; }
    [data-issue-nr]::before.theme--spore-light-blue,
    .theme--spore-light-blue [data-issue-nr]::before,
    .theme .theme--spore-light-blue [data-issue-nr]::before {
      background-color: #79accf; }
    [data-issue-nr]::before.theme--spore-lime,
    .theme--spore-lime [data-issue-nr]::before,
    .theme .theme--spore-lime [data-issue-nr]::before {
      background-color: #bbae03; }
    [data-issue-nr]::before.theme--spore-ochre,
    .theme--spore-ochre [data-issue-nr]::before,
    .theme .theme--spore-ochre [data-issue-nr]::before {
      background-color: #db9623; }
    [data-issue-nr]::before.theme--spore-olive-green,
    .theme--spore-olive-green [data-issue-nr]::before,
    .theme .theme--spore-olive-green [data-issue-nr]::before {
      background-color: #778d3e; }
    [data-issue-nr]::before.theme--spore-red,
    .theme--spore-red [data-issue-nr]::before,
    .theme .theme--spore-red [data-issue-nr]::before {
      background-color: #f54c23; }
    [data-issue-nr]::before.theme--spore-taupe,
    .theme--spore-taupe [data-issue-nr]::before,
    .theme .theme--spore-taupe [data-issue-nr]::before {
      background-color: #7b6d65; }
    [data-issue-nr]::before.theme--spore-teal,
    .theme--spore-teal [data-issue-nr]::before,
    .theme .theme--spore-teal [data-issue-nr]::before {
      background-color: #077fc1; }
  @media only screen and (min-width: 64em) {
    [data-issue-nr]::before {
      position: absolute;
      top: 0;
      left: -66px;
      width: 51px;
      height: 51px;
      padding: 6px;
      font-size: 1.25em; } }

@media only screen and (min-width: 64em) and (max-width: 99.9375em) {
  html {
    font-size: 0.875em; } }

/*
 * Overrides for commento styling
 */
[data-vendor="commento"] .commento-root textarea,
[data-vendor="commento"] .commento-button.commento-submit-button {
  -moz-border-radius: 0;
       border-radius: 0; }

[data-vendor="commento"] .commento-root textarea {
  border-color: #d7e9ce; }
  [data-vendor="commento"] .commento-root textarea.theme--dark,
  .theme--dark [data-vendor="commento"] .commento-root textarea,
  .theme .theme--dark [data-vendor="commento"] .commento-root textarea {
    border-color: #cdcdcd; }
  [data-vendor="commento"] .commento-root textarea.theme--green,
  .theme--green [data-vendor="commento"] .commento-root textarea,
  .theme .theme--green [data-vendor="commento"] .commento-root textarea {
    border-color: #d7e9ce; }
  [data-vendor="commento"] .commento-root textarea.theme--blue,
  .theme--blue [data-vendor="commento"] .commento-root textarea,
  .theme .theme--blue [data-vendor="commento"] .commento-root textarea {
    border-color: #d3eff6; }
  [data-vendor="commento"] .commento-root textarea.theme--lime,
  .theme--lime [data-vendor="commento"] .commento-root textarea,
  .theme .theme--lime [data-vendor="commento"] .commento-root textarea {
    border-color: #eff4ca; }
  [data-vendor="commento"] .commento-root textarea.theme--yellow,
  .theme--yellow [data-vendor="commento"] .commento-root textarea,
  .theme .theme--yellow [data-vendor="commento"] .commento-root textarea {
    border-color: #fef3c5; }
  [data-vendor="commento"] .commento-root textarea.theme--gold,
  .theme--gold [data-vendor="commento"] .commento-root textarea,
  .theme .theme--gold [data-vendor="commento"] .commento-root textarea {
    border-color: #fae3c8; }
  [data-vendor="commento"] .commento-root textarea.theme--orange,
  .theme--orange [data-vendor="commento"] .commento-root textarea,
  .theme .theme--orange [data-vendor="commento"] .commento-root textarea {
    border-color: #f7d7ca; }
  [data-vendor="commento"] .commento-root textarea.theme--salmon,
  .theme--salmon [data-vendor="commento"] .commento-root textarea,
  .theme .theme--salmon [data-vendor="commento"] .commento-root textarea {
    border-color: #fadbd5; }
  [data-vendor="commento"] .commento-root textarea.theme--red,
  .theme--red [data-vendor="commento"] .commento-root textarea,
  .theme .theme--red [data-vendor="commento"] .commento-root textarea {
    border-color: #fac8c1; }
  [data-vendor="commento"] .commento-root textarea.theme--burgundy,
  .theme--burgundy [data-vendor="commento"] .commento-root textarea,
  .theme .theme--burgundy [data-vendor="commento"] .commento-root textarea {
    border-color: #edc6c8; }
  [data-vendor="commento"] .commento-root textarea.theme--purple,
  .theme--purple [data-vendor="commento"] .commento-root textarea,
  .theme .theme--purple [data-vendor="commento"] .commento-root textarea {
    border-color: #e5cade; }
  [data-vendor="commento"] .commento-root textarea.theme--youth,
  .theme--youth [data-vendor="commento"] .commento-root textarea,
  .theme .theme--youth [data-vendor="commento"] .commento-root textarea {
    border-color: #f4dcbd; }
  [data-vendor="commento"] .commento-root textarea.theme--digitalisation,
  .theme--digitalisation [data-vendor="commento"] .commento-root textarea,
  .theme .theme--digitalisation [data-vendor="commento"] .commento-root textarea {
    border-color: #e5cac6; }
  [data-vendor="commento"] .commento-root textarea.theme--climate,
  .theme--climate [data-vendor="commento"] .commento-root textarea,
  .theme .theme--climate [data-vendor="commento"] .commento-root textarea {
    border-color: #d8ccd5; }
  [data-vendor="commento"] .commento-root textarea.theme--gender,
  .theme--gender [data-vendor="commento"] .commento-root textarea,
  .theme .theme--gender [data-vendor="commento"] .commento-root textarea {
    border-color: #bed8cb; }
  [data-vendor="commento"] .commento-root textarea.theme--nutrition,
  .theme--nutrition [data-vendor="commento"] .commento-root textarea,
  .theme .theme--nutrition [data-vendor="commento"] .commento-root textarea {
    border-color: #cfdcdd; }
  [data-vendor="commento"] .commento-root textarea.theme--blog,
  .theme--blog [data-vendor="commento"] .commento-root textarea,
  .theme .theme--blog [data-vendor="commento"] .commento-root textarea {
    border-color: #ffe7bd; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-blue,
  .theme--spore-blue [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-blue [data-vendor="commento"] .commento-root textarea {
    border-color: #cdd8eb; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-brown,
  .theme--spore-brown [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-brown [data-vendor="commento"] .commento-root textarea {
    border-color: #dcd0be; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-dark-blue,
  .theme--spore-dark-blue [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-dark-blue [data-vendor="commento"] .commento-root textarea {
    border-color: #bed1dd; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-forest-green,
  .theme--spore-forest-green [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-forest-green [data-vendor="commento"] .commento-root textarea {
    border-color: #d5debf; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-grey-blue,
  .theme--spore-grey-blue [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-grey-blue [data-vendor="commento"] .commento-root textarea {
    border-color: #d9e1e6; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-light-blue,
  .theme--spore-light-blue [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-light-blue [data-vendor="commento"] .commento-root textarea {
    border-color: #dce9f3; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-lime,
  .theme--spore-lime [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-lime [data-vendor="commento"] .commento-root textarea {
    border-color: #edeabd; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-ochre,
  .theme--spore-ochre [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-ochre [data-vendor="commento"] .commento-root textarea {
    border-color: #f6e4c6; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-olive-green,
  .theme--spore-olive-green [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-olive-green [data-vendor="commento"] .commento-root textarea {
    border-color: #dce1cd; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-red,
  .theme--spore-red [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-red [data-vendor="commento"] .commento-root textarea {
    border-color: #fcd0c6; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-taupe,
  .theme--spore-taupe [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-taupe [data-vendor="commento"] .commento-root textarea {
    border-color: #ddd9d7; }
  [data-vendor="commento"] .commento-root textarea.theme--spore-teal,
  .theme--spore-teal [data-vendor="commento"] .commento-root textarea,
  .theme .theme--spore-teal [data-vendor="commento"] .commento-root textarea {
    border-color: #bfdeef; }

[data-vendor="commento"] .commento-button.commento-submit-button {
  -moz-box-shadow: none;
       box-shadow: none; }

[data-location] {
  cursor: pointer; }

@media only screen and (min-width: 64em) {
  .tmp-publication {
    padding-right: 30px; }
    .tmp-publication .media__content .media__figure {
      width: 20%; } }
